*{margin:0;padding:0;box-sizing:border-box}body{font-family:PingFang SC,Microsoft YaHei,Helvetica Neue,sans-serif;background:#faf9f6;color:#333;line-height:1.8;min-height:100vh}#app{max-width:1200px;margin:0 auto;padding:20px}.header{text-align:center;padding:20px 0 15px;background:linear-gradient(180deg,#faf8f5,#f5f0e8);border-bottom:1px solid #e8e0d5;border-radius:12px 12px 0 0;margin-bottom:20px;max-width:1000px;margin-left:auto;margin-right:auto}.title-wrapper{display:flex;align-items:center;justify-content:center;gap:15px;padding:10px 35px;background:linear-gradient(135deg,#fffef9,#f8f4ec,#f5f0e5);border-radius:4px;max-width:550px;margin:0 auto;box-shadow:0 3px 10px #8b5a2b1f,inset 0 1px #ffffffe6;border:1px solid #e0d5c5;position:relative}.title-wrapper:before{content:"";position:absolute;inset:0;background-image:repeating-linear-gradient(0deg,transparent,transparent 3px,rgba(139,90,43,.04) 3px,rgba(139,90,43,.04) 6px);pointer-events:none;border-radius:4px}.seal{width:38px;height:38px;background:linear-gradient(135deg,#d42c2c,#b81c1c);border:2px solid #8b1515;border-radius:4px;display:flex;align-items:center;justify-content:center;font-family:Ma Shan Zheng,STKaiti,KaiTi,serif;font-size:20px;color:#fff;font-weight:700;box-shadow:2px 2px 5px #8b5a2b59,inset 0 0 10px #00000040;transform:rotate(-6deg);position:relative;z-index:2;flex-shrink:0}.seal:after{content:"";position:absolute;inset:3px;background:linear-gradient(135deg,transparent 0%,rgba(255,255,255,.15) 50%,transparent 100%);border-radius:2px}.logo-title{font-family:Ma Shan Zheng,ZCOOL XiaoWei,STKaiti,KaiTi,cursive;font-size:46px;font-weight:400;letter-spacing:6px;margin:0;padding:0;display:flex;align-items:baseline;justify-content:center;position:relative;z-index:1}.title-small{font-size:28px;color:#5d4e37;font-weight:400;letter-spacing:4px;text-shadow:1px 1px 1px rgba(139,90,43,.15)}.title-large{font-size:46px;color:#2c1810;font-weight:600;letter-spacing:6px;text-shadow:2px 2px 2px rgba(139,90,43,.2);position:relative}.subtitle{color:#8b7355;margin-top:10px;letter-spacing:2px;font-weight:400;font-size:16px;color:#7f8c8d}.input-area{display:flex;gap:15px;justify-content:center;align-items:center;padding:25px;background:#fffdf9;border-radius:12px;margin:0 auto 20px;max-width:1000px;box-shadow:0 2px 8px #8b5a2b14}.text-input{width:400px;height:50px;font-size:18px;padding:0 20px;border:2px solid #e0e0e0;border-radius:8px;outline:none;transition:border-color .2s}.text-input:focus{border-color:#3498db}.btn{border:none;border-radius:8px;cursor:pointer;font-family:inherit;transition:all .2s}.btn-large{height:50px;padding:0 30px;font-size:18px;font-weight:500}.btn-primary{background:#3498db;color:#fff}.btn-primary:hover{background:#2980b9}.btn-secondary{background:#ecf0f1;color:#333}.btn-secondary:hover{background:#d5dbdb}.btn-danger{background:#e74c3c;color:#fff}.btn-danger:hover{background:#c0392b}.btn-early{height:45px;padding:0 20px;font-size:16px;background:#fff;color:#2c3e50;border:2px solid #e0e0e0}.btn-early:hover{background:#f8f9fa;border-color:#3498db;color:#3498db}.btn-early.active{background:linear-gradient(135deg,#4285f4,#5b8df9,#7c4dff);color:#fff;border-color:#5b8df9}.early-read-bar{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:0;padding:16px 20px;background:#fffdf9;border-radius:12px;margin:0 auto 20px;max-width:1000px;box-shadow:0 2px 8px #8b5a2b14}.bar-group{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:center;margin:4px 0}.bar-divider{width:1px;height:32px;background:#d4c8b8;margin:0 15px;align-self:center}.action-bar{display:flex;gap:15px;justify-content:center;flex-wrap:wrap;padding:20px;background:#fffdf9;border-radius:12px;margin:0 auto 20px;max-width:1000px;box-shadow:0 2px 8px #8b5a2b14}.status-area{display:flex;align-items:center;justify-content:center;gap:15px;padding:10px;min-height:40px}#statusText{padding:8px 20px;background:#fff3cd;border-radius:20px;font-size:14px;color:#856404}#btnStop{padding:8px 24px;font-size:14px;border-radius:20px}.content-area{background:#fffdf9;border-radius:12px;padding:20px 24px;margin:0 auto 20px;box-shadow:0 2px 8px #8b5a2b14;min-height:300px;max-width:1000px}.content-placeholder{text-align:center;color:#b8a98a;font-size:18px;margin-top:100px}.content-wrapper{max-width:100%;margin:0 auto}.content-title{font-size:28px;font-weight:600;color:#2c3e50;text-align:center;margin-bottom:15px;padding-bottom:15px;border-bottom:2px solid #eee}.content-buttons{display:flex;justify-content:center;gap:15px;margin-bottom:20px;padding-bottom:15px;border-bottom:1px solid #eee}.content-btn{padding:8px 20px;font-size:14px;border:1px solid #ddd;border-radius:20px;background:#f8f9fa;color:#555;cursor:pointer;transition:all .2s}.content-btn:hover{background:#e8f4fd;border-color:#3498db;color:#3498db}.content-btn.active{background:linear-gradient(135deg,#4285f4,#5b8df9,#7c4dff);border-color:transparent;color:#fff}.content-body{font-size:18px;line-height:1.6;text-align:left;color:#333}.paragraph{margin-bottom:.3em;text-indent:2em;text-align:justify}.sentence{display:inline}.sentence:last-child{margin-bottom:0}.sentence.highlight{background:linear-gradient(135deg,#4285f4,#5b8df9,#7c4dff);border-radius:4px;padding:4px 8px;color:#fff;text-indent:0}.sentence.follow-reading{background:linear-gradient(135deg,#34a853,#4caf50,#66bb6a);border-radius:4px;padding:4px 8px;color:#fff;text-indent:0;animation:followPulse 1s ease-in-out infinite}@keyframes followPulse{0%,to{box-shadow:0 0 #4caf5066}50%{box-shadow:0 0 0 8px #4caf5000}}.sentence.hidden{opacity:.2}.poem-wrapper{text-align:center}.poem-body{text-align:center;padding:20px 0}.poem-line{margin-bottom:.8em;text-indent:0;text-align:center;font-size:1.1em}.poem-line .sentence{display:inline}.poem-line .sentence.highlight{background:linear-gradient(135deg,#4285f4,#5b8df9,#7c4dff);border-radius:4px;padding:4px 12px;color:#fff}.not-found{text-align:center;padding:60px 20px;color:#7f8c8d}.not-found p{font-size:20px;margin-bottom:10px}.not-found .hint{font-size:16px}.multi-match{padding:30px 20px;max-width:600px;margin:0 auto}.multi-match h3{text-align:center;color:#2c3e50;margin-bottom:20px;font-size:18px}.match-list{display:flex;flex-direction:column;gap:12px}.match-item{background:#f8f9fa;border:1px solid #e0e0e0;border-radius:8px;padding:15px 20px;cursor:pointer;transition:all .2s ease}.match-item:hover{background:#e8f4f8;border-color:#3498db;transform:translate(5px)}.match-grade{display:inline-block;background:#3498db;color:#fff;padding:4px 12px;border-radius:4px;font-size:14px;margin-right:10px}.match-preview{color:#666;font-size:14px}.timer-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.timer-options{background:#fff;padding:40px;border-radius:16px;text-align:center;max-width:400px}.timer-options h3{font-size:24px;margin-bottom:20px;color:#2c3e50}.timer-options .section-title{font-size:16px;color:#7f8c8d;margin:20px 0 10px;text-align:left}.timer-options .btn{display:block;width:200px;margin:10px auto;height:50px;font-size:18px}.remind-options{display:flex;gap:10px;justify-content:center;margin-bottom:20px}.remind-option{padding:12px 16px;border:2px solid #e0e0e0;border-radius:8px;cursor:pointer;font-size:14px;background:#fff;transition:all .2s}.remind-option:hover{border-color:#3498db}.remind-option.selected{border-color:#3498db;background:#e3f2fd;color:#1976d2}.timer-option.selected,.reminder-option.active{background:#e8f5e9;border-color:#4caf50;color:#2e7d32}.timer-display{position:fixed;top:20px;right:20px;z-index:999;min-width:140px;min-height:80px;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:16px;box-shadow:0 8px 32px #667eea66;cursor:move;-webkit-user-select:none;-moz-user-select:none;user-select:none;resize:both;overflow:hidden}.timer-header{display:flex;align-items:center;justify-content:center;padding:12px 16px;gap:8px}.timer-drag-handle{color:#ffffff80;font-size:14px;cursor:move}.timer-text{font-size:36px;font-weight:700;color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.2);font-variant-numeric:tabular-nums;letter-spacing:2px}.timer-controls{display:flex;gap:8px;justify-content:center;padding:8px 12px 12px;border-top:1px solid rgba(255,255,255,.2)}.btn-timer-control{padding:6px 14px;font-size:13px;font-weight:500;color:#fff;background:#fff3;border:1px solid rgba(255,255,255,.3);border-radius:6px;cursor:pointer;transition:all .2s}.btn-timer-control:hover{background:#ffffff4d;transform:translateY(-1px)}.timer-resize-handle{position:absolute;bottom:0;right:0;width:16px;height:16px;cursor:se-resize;background:linear-gradient(135deg,transparent 50%,rgba(255,255,255,.3) 50%)}.fullscreen-wrapper{position:relative;width:100%;max-width:none;padding:16px 24px}.exit-fullscreen-btn{position:fixed;bottom:30px;right:30px;padding:15px 30px;font-size:18px;background:#fffffff2;border:2px solid #333;border-radius:8px;cursor:pointer;z-index:100;box-shadow:0 4px 12px #00000026}.fullscreen-header{display:flex;flex-direction:column;align-items:center;gap:20px;margin-bottom:50px}.fullscreen-title{font-size:48px;text-align:center;margin:0}.fullscreen-controls{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}.btn-fs-control{padding:10px 20px;font-size:16px;font-weight:500;color:#333;background:#ffffffe6;border:2px solid #ddd;border-radius:8px;cursor:pointer;transition:all .2s}.btn-fs-control:hover{border-color:#3498db;color:#3498db}.btn-fs-control.active{background:linear-gradient(135deg,#4285f4,#5b8df9,#7c4dff);border-color:#5b8df9;color:#fff}.fullscreen-body{font-size:36px;line-height:1.8;text-align:left;max-width:90%;margin:0 auto}.fs-paragraph{margin-bottom:1.5em;text-indent:2em;text-align:justify}.fs-paragraph:last-child{margin-bottom:0}.fs-sentence{display:inline}.fs-sentence.highlight{background:linear-gradient(135deg,#4285f4,#5b8df9,#7c4dff);border-radius:8px;padding:8px 16px;color:#fff;text-indent:0}.fs-sentence.hidden{opacity:.2}.fs-poem-wrapper{text-align:center}.fs-poem-body{text-align:center;padding:10px 0}.fs-poem-line{margin-bottom:.3em;text-indent:0;text-align:center}.fs-poem-line .fs-sentence{display:inline}.fs-poem-line .fs-sentence.highlight{background:linear-gradient(135deg,#4285f4,#5b8df9,#7c4dff);border-radius:8px;padding:8px 20px;color:#fff}.speed-panel{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.speed-options{background:#fff;padding:40px;border-radius:16px;text-align:center}.speed-options h3{font-size:24px;margin-bottom:30px;color:#2c3e50}.speed-btn{display:block;width:200px;margin:15px auto;height:50px;font-size:18px}.speed-btn.selected{background:#3498db;color:#fff;border-color:#3498db}.follow-controls,.hide-controls{display:flex;gap:15px;justify-content:center;margin-top:20px;padding:15px;background:#f8f9fa;border-radius:8px}.hot-texts{text-align:center;padding:20px;background:#fff;border-radius:12px;margin:0 auto 20px;box-shadow:0 2px 8px #0000000d;max-width:1000px}.hot-label{color:#7f8c8d;margin-right:10px}.hot-text-link{color:#3498db;text-decoration:none;margin:0 8px;font-size:16px}.hot-text-link:hover{text-decoration:underline}.footer{text-align:center;padding:30px 20px;color:#666;font-size:14px;background:#f5f5f5;border-top:1px solid #e0e0e0;margin-top:40px}.footer-content{max-width:800px;margin:0 auto}.footer-main{margin-bottom:15px;display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:8px}.footer-bottom{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:8px}.footer-text{color:#555}.footer-divider{color:#ccc}.footer-link{color:#06c;text-decoration:none;transition:color .2s}.footer-link:hover{color:#049;text-decoration:underline}.footer-copyright{color:#888}.footer-beian{color:#888;text-decoration:none;transition:color .2s}.footer-beian:hover{color:#555;text-decoration:underline}@media(max-width:768px){.header,.input-area,.early-read-bar,.content-area,.hot-texts{max-width:none;width:100%;margin-left:0;margin-right:0;border-radius:0}.input-area{flex-direction:column}.text-input,.btn-large{width:100%}.early-read-bar,.action-bar{flex-direction:column;align-items:stretch}.btn-early{width:100%;height:50px;font-size:17px}.content-body{font-size:18px}.early-read-bar{flex-direction:column;gap:15px;padding:15px}.bar-group{width:100%;flex-direction:column;gap:10px}.bar-divider{width:100%;height:1px;margin:8px 0}.hot-texts{flex-direction:column;align-items:flex-start;gap:10px;padding:15px}.hot-text-link{padding:8px 12px;font-size:15px}.timer-options{width:95%;max-width:95%;padding:20px 15px;margin:0 auto}.timer-options h3{font-size:16px}.timer-duration-btns,.timer-reminder-btns{flex-direction:column;gap:10px}.timer-option,.reminder-option{width:100%;height:44px}.speed-options{width:95%;max-width:95%;padding:20px 15px}.speed-btns{flex-direction:column;gap:10px}.speed-option{width:100%;height:44px}.fill-in-container{margin:0 -10px;border-radius:0}.fill-in-header{padding:16px 15px}.fill-in-header .content-title{font-size:20px;margin-bottom:15px}.fill-in-controls{flex-direction:column;gap:15px;align-items:stretch}.difficulty-control{justify-content:space-between}.difficulty-control input[type=range]{flex:1;margin:0 10px}.fill-in-actions{flex-direction:column;gap:10px}.fill-btn{width:100%;height:44px;font-size:15px}.fill-in-body{padding:20px 15px;font-size:17px;line-height:2}.fill-blank{display:inline;padding:1px 4px;margin:0 1px;background:linear-gradient(180deg,#fffbf0,#f5f0e0);border:1px dashed #c0a060;border-radius:3px;color:inherit;font-weight:inherit;font-size:inherit;cursor:pointer;text-align:center;vertical-align:baseline}.fill-blank:hover{background:linear-gradient(180deg,#fff8e8,#f0e8d8);border-color:#a08040}.fill-blank.revealed{background:linear-gradient(180deg,#e8f5e8,#d0e8d0);border:1px solid #7cb87c;color:inherit}.fill-blank.revealed:hover{background:linear-gradient(180deg,#d0e8d0,#c0dcc0)}.fill-in-tip{padding:12px 15px;font-size:13px}.fullscreen-wrapper{padding:15px}.fullscreen-title{font-size:24px}.fullscreen-controls{flex-wrap:wrap;gap:8px;justify-content:center}.btn-fs-control{height:44px;padding:0 14px;font-size:14px}.fs-paragraph{font-size:22px;line-height:1.8;margin-bottom:20px}.exit-fullscreen-btn{width:100%;height:50px;font-size:16px;inset:auto auto 20px 50%;transform:translate(-50%);border-radius:25px}.content-buttons{flex-wrap:wrap;gap:8px}.content-btn{height:40px;padding:0 14px;font-size:14px}.title-wrapper{padding:8px 20px;max-width:100%}.logo-title{font-size:24px}.subtitle{font-size:13px}.timer-display{width:120px;padding:8px 12px}.timer-text{font-size:18px}.footer{padding:20px 15px;margin-top:20px}.footer-main,.footer-bottom{flex-direction:column;gap:10px}.footer-divider{display:none}}@media(min-width:1200px){.header{padding:25px 0}.title-wrapper{margin-bottom:15px}.title-small{font-size:38px}.title-large{font-size:64px}.subtitle{font-size:18px}.input-area{max-width:1000px;margin:0 auto 20px}.text-input{font-size:18px;padding:14px 20px}.btn-primary{font-size:16px;padding:14px 28px}.early-read-bar,.action-bar{max-width:1000px;margin:0 auto 20px;gap:12px}.btn-early{font-size:16px;padding:12px 20px}.content-area{max-width:1000px;padding:30px 40px}.content-body{font-size:20px;line-height:1.6}.paragraph{margin-bottom:.3em;text-indent:2.5em}.sentence{line-height:1.6}.fullscreen-content{max-width:1400px}.fullscreen-title{font-size:42px}.fs-paragraph{font-size:36px;line-height:1.6;margin-bottom:.5em}.fs-sentence{line-height:1.6}}@media(min-width:1600px){.title-small{font-size:42px}.title-large{font-size:72px}.input-area,.early-read-bar,.action-bar,.content-area{max-width:1200px}.content-body{font-size:22px}.fullscreen-content{max-width:1600px}.fs-paragraph{font-size:42px}}.fill-in-container{background:#fff;border-radius:16px;box-shadow:0 4px 20px #00000014;overflow:hidden}.fill-in-container.poem-mode .fill-in-body{text-align:center}.fill-in-header{background:linear-gradient(135deg,#f8f6f0,#f0ebe0);padding:24px 30px;border-bottom:1px solid #e5ddd0}.fill-in-header .content-title{font-size:26px;font-weight:600;color:#3d3425;margin-bottom:20px;text-align:center}.fill-in-controls{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:24px}.difficulty-control{display:flex;align-items:center;gap:10px}.difficulty-control label{font-size:15px;color:#5a4d3a;font-weight:500}.difficulty-control input[type=range]{width:120px;height:6px;-webkit-appearance:none;background:linear-gradient(90deg,#a8d5a2,#f5d76e,#e88b7d);border-radius:3px;cursor:pointer}.difficulty-control input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;background:#fff;border:2px solid #8b7355;border-radius:50%;cursor:pointer;box-shadow:0 2px 6px #00000026}#difficultyLabel{font-size:14px;font-weight:600;color:#6b5c4a;min-width:40px}.fill-in-stats{font-size:15px;color:#5a4d3a}.fill-in-stats strong{color:#d4a24c;font-size:18px}.fill-in-actions{display:flex;gap:12px}.fill-btn{padding:8px 18px;font-size:14px;font-weight:500;border:none;border-radius:8px;cursor:pointer;transition:all .2s ease}#revealAllBtn{background:linear-gradient(135deg,#e8c97a,#d4a24c);color:#3d3425}#revealAllBtn:hover{background:linear-gradient(135deg,#d4a24c,#c0903c);transform:translateY(-1px)}#resetBlanksBtn{background:linear-gradient(135deg,#7cb87c,#5a9c5a);color:#fff}#resetBlanksBtn:hover{background:linear-gradient(135deg,#5a9c5a,#4a8c4a);transform:translateY(-1px)}.fill-in-body{padding:16px 24px;font-size:18px;line-height:1.8;color:#3d3425}.fill-in-body .paragraph{margin-bottom:10px;text-indent:2em}.fill-in-body .poem-line{margin-bottom:4px}.fill-blank{display:inline;padding:1px 4px;margin:0 1px;background:linear-gradient(180deg,#fffbf0,#f5f0e0);border:1px dashed #c0a060;border-radius:3px;color:inherit;font-weight:inherit;font-size:inherit;cursor:pointer;text-align:center;vertical-align:baseline}.fill-blank:hover{background:linear-gradient(180deg,#fff8e8,#f0e8d8);border-color:#a08040}.fill-blank.revealed{background:linear-gradient(180deg,#e8f5e8,#d0e8d0);border:1px solid #7cb87c;color:inherit}.fill-blank.revealed:hover{background:linear-gradient(180deg,#d0e8d0,#c0dcc0)}.fill-in-tip{text-align:center;padding:16px;background:#f8f6f0;color:#8b7355;font-size:14px;border-top:1px solid #e5ddd0}