:root{--bg: #fdf6e3;--surface: #eee8d5;--surface-hover: #e6dfcc;--text: #3b4d54;--text-secondary: #586e75;--text-muted: #839496;--accent: #cb6800;--accent-hover: #b45d00;--accent-rgb: 203, 104, 0;--accent-soft: rgba(var(--accent-rgb), .1);--accent-border: rgba(var(--accent-rgb), .3);--on-accent: #fdf6e3;--success: #5c7a4f;--success-rgb: 92, 122, 79;--error: #dc322f;--error-rgb: 220, 50, 47;--border: #c9c0ab;--border-subtle: rgba(0, 0, 0, .06);--overlay-rgb: 0, 0, 0;--highlight-rgb: 255, 255, 255;--glass: rgba(253, 246, 227, .93);--glass-hover: rgba(243, 237, 220, .95);--glass-deep: rgba(245, 239, 223, .96);--surface-card: rgba(255, 255, 255, .45);--surface-card-hover: rgba(255, 255, 255, .55);--shadow-card: 0 1px 3px rgba(120, 90, 50, .06);--shadow-card-hover: 0 2px 8px rgba(120, 90, 50, .1);--radius: 10px;--radius-lg: 14px;--radius-sm: 6px;--font-ui: "Plus Jakarta Sans", system-ui, -apple-system, sans-serif;--font-read: "Newsreader", "Georgia", serif;--fs-xs: .75rem;--fs-sm: .85rem;--fs-md: .95rem;--fs-lg: 1.05rem;--fs-xl: 1.2rem}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%;text-size-adjust:100%}body{font-family:var(--font-ui);background:var(--bg);color:var(--text);min-height:100vh;padding:0 1rem}body:before,body:after{content:"";position:fixed;bottom:0;width:180px;height:220px;pointer-events:none;z-index:0;opacity:.6;background:url(/flowers.svg) no-repeat bottom center;background-size:contain}body:before{left:0}body:after{right:0;transform:scaleX(-1)}main,header{position:relative;z-index:1}@media(max-width:1200px){body:before,body:after{display:none}}header{max-width:900px;margin:0 auto;padding:1rem 0;display:flex;flex-direction:column;gap:.6rem}.header-top{display:flex;align-items:center;justify-content:space-between}.header-nav{display:flex;background:rgba(var(--overlay-rgb),.07);border-radius:var(--radius-sm);padding:3px}.nav-link{padding:.5rem 1.4rem;border-radius:5px;background:transparent;color:var(--text-secondary);text-decoration:none;font-size:var(--fs-md);font-weight:600;letter-spacing:.03em;transition:color .2s,background-color .2s}.nav-link:hover{color:var(--text)}.nav-link.active{color:var(--text);background:rgba(var(--highlight-rgb),.12);box-shadow:0 1px 4px rgba(var(--overlay-rgb),.12)}.header-controls{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1rem;padding:.3rem 0 .3rem .4rem}.control-row{display:flex;align-items:center;gap:.4rem}.control-row label{font-size:var(--fs-xs);color:var(--text-muted);white-space:nowrap;text-transform:uppercase;letter-spacing:.06em;font-weight:500}.control-row input[type=password]{width:170px;padding:.3rem .5rem;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);color:var(--text);font-family:var(--font-ui);font-size:var(--fs-sm);transition:border-color .2s}.control-row input[type=password]:focus{outline:none;border-color:var(--accent-border)}.control-row select{padding:.3rem .5rem;border:none;border-radius:var(--radius-sm);background:var(--surface);color:var(--text);font-family:var(--font-ui);font-size:var(--fs-sm)}.control-row select:focus{outline:none}.control-row input[type=range]{width:80px;accent-color:var(--accent)}#speed-value{display:inline-block;min-width:1.8em;text-align:center}.banner{position:fixed;bottom:1rem;left:50%;transform:translate(-50%);z-index:100;max-width:90vw;padding:.6rem 1rem;border-radius:var(--radius);background:var(--error);color:#fff;font-size:var(--fs-sm);display:flex;flex-wrap:wrap;align-items:center;gap:.75rem;cursor:pointer;box-shadow:0 2px 8px #00000040}.banner-success{background:var(--success)}.banner-info{background:var(--surface-alt, #555)}.banner-action{background:#fff3;color:#fff;border:none;border-radius:var(--radius);padding:.25rem .6rem;cursor:pointer;font-size:var(--fs-sm);white-space:nowrap}.banner-action:hover{background:#ffffff59}.banner-details{width:100%;max-height:8rem;overflow:auto;margin:0;padding:.4rem .6rem;border-radius:var(--radius);background:#0003;font-family:monospace;font-size:var(--fs-xs);white-space:pre-wrap;word-break:break-word;cursor:text;-webkit-user-select:text;user-select:text}main{max-width:900px;margin:0 auto}#library-view textarea{width:100%;padding:1rem;border:1px solid var(--border-subtle);border-radius:var(--radius);background:var(--surface-card);box-shadow:var(--shadow-card);color:var(--text);font-family:var(--font-read);font-size:var(--fs-lg);line-height:1.7;resize:vertical;transition:border-color .2s}#library-view textarea:focus{outline:none;border-color:var(--accent-border)}#library-view textarea::placeholder{color:var(--text-muted);font-family:var(--font-read);font-style:italic}#start-btn{margin-top:.75rem;padding:.65rem 1.8rem;border:none;border-radius:var(--radius);background:var(--accent);color:var(--on-accent);font-family:var(--font-ui);font-size:var(--fs-md);font-weight:600;cursor:pointer;transition:background-color .2s,transform .1s}#start-btn:hover{background:var(--accent-hover)}#start-btn:active{transform:scale(.98)}#history-list{margin-top:1.25rem}.history-loading-inline{display:flex;justify-content:center;margin-bottom:.6rem}.load-more-btn{display:block;margin:.25rem auto 0;padding:.4rem 1.4rem;border:1px solid var(--border-subtle);border-radius:var(--radius-sm);background:rgba(var(--highlight-rgb),.05);color:var(--text-secondary);font-family:var(--font-ui);font-size:var(--fs-sm);font-weight:500;cursor:pointer;transition:color .2s,border-color .2s}.load-more-btn:hover{color:var(--text);border-color:var(--accent-border)}.stories-actions{display:flex;gap:.5rem;margin-top:.25rem}.stories-action-btn{padding:.4rem 1rem;border:1px solid var(--border-subtle);border-radius:var(--radius-sm);background:rgba(var(--highlight-rgb),.05);color:var(--text-secondary);font-family:var(--font-ui);font-size:var(--fs-sm);font-weight:500;cursor:pointer;text-decoration:none;transition:color .2s,border-color .2s}.stories-action-btn:hover{color:var(--text);border-color:var(--accent-border)}.stories-custom{margin-top:.25rem}.data-controls{display:flex;gap:.5rem;margin-top:.25rem;padding-top:.75rem;border-top:1px solid var(--border-subtle)}.data-controls button{padding:.4rem .9rem;border:1px solid var(--border-subtle);border-radius:var(--radius-sm);background:rgba(var(--highlight-rgb),.05);color:var(--text-secondary);font-size:var(--fs-sm);cursor:pointer;transition:color .2s,border-color .2s}.data-controls button:hover{color:var(--text);border-color:var(--accent-border)}#library-view{display:flex;flex-direction:column;gap:.5rem;padding-bottom:2rem}.library-section{border:1px solid var(--border-subtle);border-radius:var(--radius);background:var(--surface-card);overflow:hidden}.library-section-title{display:flex;align-items:center;padding:.7rem .85rem;font-family:var(--font-ui);font-size:var(--fs-md);font-weight:600;color:var(--text);margin:0}.library-section-title-collapsible{cursor:pointer;-webkit-user-select:none;user-select:none}.collapse-chevron{display:inline-block;font-size:var(--fs-xs);margin-right:.4rem;transition:transform .15s ease}.collapse-chevron-collapsed{transform:rotate(-90deg)}.library-section-content{display:flex;flex-direction:column;gap:.35rem;padding:0 .6rem .6rem}#my-stories-list,#recent-list,.library-level-texts{display:flex;flex-direction:column;gap:.35rem}.library-level-header{display:flex;align-items:center;gap:.5rem;width:100%;padding:.5rem 0;background:none;border:none;font-family:var(--font-ui);font-size:var(--fs-md);font-weight:600;color:var(--text)}.library-level-title{text-align:left}.library-level-dot{width:.5rem;height:.5rem;border-radius:50%;flex-shrink:0}.library-level-stats{font-size:var(--fs-xs);font-weight:400;color:var(--text-muted);margin-left:auto}.library-card{display:block;padding:.6rem .75rem;border:1px solid var(--border-subtle);border-radius:var(--radius-sm);background:rgba(var(--highlight-rgb),.05);cursor:pointer;transition:border-color .2s;text-decoration:none;color:inherit}.library-card:hover{border-color:var(--accent-border)}.library-card-added{border-left:3px solid var(--success);background:rgba(var(--success-rgb),.04)}.library-card-scene{display:block;font-family:var(--font-read);font-size:var(--fs-lg);line-height:1.5;color:var(--text)}.library-card-bottom{display:flex;align-items:center;gap:.5rem;margin-top:.3rem}.library-card-meta{font-size:var(--fs-xs);color:var(--text-muted)}.library-card-preview-link{background:none;border:none;padding:0;font-family:var(--font-ui);font-size:var(--fs-xs);font-weight:400;color:var(--text-muted);cursor:pointer;text-decoration:underline;text-underline-offset:2px;text-transform:lowercase}.library-card-preview-link:hover{color:var(--text-secondary)}.library-card-delete{background:none;border:none;color:var(--text-muted);font-size:var(--fs-xl);cursor:pointer;padding:0 .25rem;line-height:1;margin-left:auto;transition:color .2s}.library-card-delete:hover,.library-card-delete.confirming{color:var(--error)}.library-preview{margin-top:.5rem;padding:.6rem .75rem;background:rgba(var(--overlay-rgb),.03);border-radius:var(--radius-sm);font-family:var(--font-read);font-size:var(--fs-lg);line-height:1.6;color:var(--text-secondary)}#text-view{display:flex;flex-direction:column;gap:.75rem}#back-btn{color:var(--text-secondary);text-decoration:none;font-size:var(--fs-sm);transition:color .2s}#back-btn:hover{color:var(--text)}.text-controls{display:flex;align-items:center;gap:.5rem;padding-top:.5rem;border-top:1px solid var(--border-subtle)}.text-controls button{padding:.45rem 1rem;border:1px solid var(--border-subtle);border-radius:var(--radius-sm);background:var(--surface-card);color:var(--text-secondary);font-family:var(--font-ui);font-size:var(--fs-sm);cursor:pointer;transition:color .2s,background-color .2s,border-color .2s}.text-controls button:hover{color:var(--text);background:var(--surface-card-hover);border-color:var(--accent-border)}.text-controls button.active{border-color:var(--accent);background:var(--accent);color:var(--on-accent)}.sentences-area{position:relative}.sentences-panel{line-height:2.2;padding:.8rem 1.25rem;background:var(--surface-card);border-radius:var(--radius-lg);border:1px solid var(--border-subtle);box-shadow:var(--shadow-card);font-family:var(--font-read);font-size:var(--fs-xl)}.sentence{display:inline;padding:.15rem 0;border-radius:4px;cursor:pointer;transition:background-color .3s,outline-color .2s;outline:2px solid transparent;outline-offset:1px}.sentence:first-child{margin-left:0}.sentence:hover{outline-color:rgba(var(--highlight-rgb),.18)}.sentence.active{outline-color:rgba(var(--accent-rgb),.55)}.sentence.full-playing{outline-color:rgba(var(--accent-rgb),.45)}.sentences-panel.text-hidden .sentence{color:transparent;outline-color:rgba(var(--overlay-rgb),.03)}.sentences-panel.text-hidden .sentence.active{outline-color:rgba(var(--accent-rgb),.55)}.sentences-panel.text-hidden .sentence:hover{outline-color:var(--text-muted)}.sentences-panel.text-hidden .sentence::selection{color:transparent}.sentences-panel.text-hidden .sentence.revealed{color:var(--text)}.inline-player{position:absolute;display:flex;flex-direction:column;z-index:10;width:14rem;max-width:min(24rem,100%);border-radius:var(--radius);background:var(--glass);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(var(--highlight-rgb),.1);box-shadow:0 4px 20px rgba(var(--overlay-rgb),.15),0 0 0 1px rgba(var(--overlay-rgb),.05);overflow:hidden;transition:width .2s ease-out,top .2s ease,left .2s ease}.inline-player.expanded{width:100%}.inline-player.disabled{border-color:rgba(var(--highlight-rgb),.05);box-shadow:0 4px 16px rgba(var(--overlay-rgb),.12)}.inline-player-controls{display:flex;align-items:center;gap:.5rem;padding:.25rem .7rem .25rem .25rem;white-space:nowrap;cursor:pointer}.inline-player:not(.disabled) .inline-player-controls:hover{background:var(--glass-hover)}.inline-player.disabled .inline-player-controls{cursor:not-allowed}.inline-player .play-icon{width:36px;height:36px;border-radius:50%;border:2px solid var(--accent);background:transparent;color:var(--accent);font-size:var(--fs-md);display:flex;align-items:center;justify-content:center;flex-shrink:0;line-height:1;transition:border-color .2s,background-color .2s}.inline-player:not(.disabled) .inline-player-controls:hover .play-icon{background:var(--accent-soft)}.inline-player .play-icon.loading{border-color:var(--text-muted);cursor:default}.inline-player .play-icon.awaiting-record{border-color:var(--error)}.inline-player.recording .play-icon{border-color:var(--error);animation:pulse 1s infinite}.inline-player.disabled .play-icon{border-color:var(--text-muted);color:var(--text-muted)}.inline-player .phase-label{font-size:var(--fs-sm);color:var(--text-secondary)}.inline-player-explain{margin-left:auto;width:26px;height:26px;border-radius:50%;border:1px solid var(--border);background:none;color:var(--text-muted);font-size:var(--fs-xs);font-weight:600;display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;transition:color .2s,border-color .2s,background-color .2s}.inline-player-explain:hover{color:var(--text);border-color:var(--text-secondary);background:rgba(var(--highlight-rgb),.06)}.inline-player-explain .spinner{width:12px;height:12px;border-width:1.5px}.inline-player-word{display:flex;flex-direction:column;gap:.25rem;padding:.55rem .85rem;border-top:1px solid var(--border-subtle);font-size:var(--fs-sm);color:var(--text);animation:section-reveal .2s ease-out}.word-header{display:flex;align-items:center;gap:.4rem;min-height:26px;line-height:1.5}.word-header .spinner{width:13px;height:13px;border-width:1.5px;vertical-align:-2px}.word-name{font-weight:600;color:var(--text)}.word-pos{font-size:var(--fs-xs);color:var(--text-muted);letter-spacing:.02em}.word-translation{font-family:var(--font-read);font-style:italic;color:var(--text);line-height:1.5}.word-actions{display:flex;align-items:center;gap:.15rem;margin-left:auto}.word-action{background:none;border:none;cursor:pointer;color:var(--text-muted);font-size:var(--fs-md);width:26px;height:26px;padding:0;line-height:1;display:inline-flex;align-items:center;justify-content:center;transition:color .2s}.word-action .spinner{width:12px;height:12px;border-width:1.5px}.word-action .icon-stop{width:8px;height:8px}.word-action:hover:not(:disabled){color:var(--text)}.word-action:disabled{cursor:default;opacity:.4}.word-action.saved{color:var(--accent)}.word-details{display:flex;flex-wrap:wrap;column-gap:.6rem;row-gap:.1rem;font-size:var(--fs-sm);color:var(--text-secondary);line-height:1.5}.word-infinitive{white-space:nowrap}.word-synonyms{white-space:normal}.word-usage{color:var(--text-secondary);line-height:1.5}.inline-player-explanation{display:flex;flex-direction:column;gap:.3rem;padding:.55rem .85rem;border-top:1px solid var(--border-subtle);font-size:var(--fs-sm);color:var(--text);animation:section-reveal .2s ease-out}.explain-translation{font-family:var(--font-read);font-style:italic;color:var(--text);line-height:1.55}.explain-grammar{color:var(--text-secondary);line-height:1.55}.sentence.active .word{cursor:pointer;border-radius:3px;transition:background-color .15s}.sentence.active .word:hover{background:rgba(var(--accent-rgb),.2)}.sentence .word-highlighted{background:rgba(var(--accent-rgb),.3);border-radius:3px}.word.saved{text-decoration:underline dotted var(--accent);text-decoration-thickness:1.5px;text-underline-offset:2px}.full-player{display:flex;align-items:center;gap:.75rem;padding:.65rem .85rem;border:1px solid var(--border-subtle);border-radius:var(--radius);background:var(--surface-card);box-shadow:var(--shadow-card)}.full-player-btn{width:38px;height:38px;border-radius:50%;border:2px solid var(--accent);background:transparent;color:var(--accent);font-size:var(--fs-lg);display:flex;align-items:center;justify-content:center;flex-shrink:0;cursor:pointer;line-height:1;transition:background-color .2s}.full-player-btn:hover{background:var(--accent-soft)}.full-player-btn.loading{cursor:default}.full-player-track{flex:1;height:4px;border-radius:2px;background:rgba(var(--overlay-rgb),.09);position:relative;cursor:pointer}.full-player-track:before{content:"";position:absolute;top:-14px;bottom:-14px;left:0;right:0}.full-player-fill{position:absolute;left:0;top:0;height:100%;border-radius:2px;background:var(--accent);pointer-events:none}.full-player-caret{position:absolute;top:50%;width:12px;height:12px;border-radius:50%;background:var(--accent);transform:translate(-50%,-50%);pointer-events:none;box-shadow:0 0 6px rgba(var(--accent-rgb),.3)}.full-player-track.disabled{cursor:default;opacity:.3;pointer-events:none}.full-player-time{font-size:var(--fs-xs);color:var(--text-muted);white-space:nowrap;min-width:4.5em;text-align:right;font-variant-numeric:tabular-nums}.words-header{display:flex;align-items:center;gap:1rem;margin-bottom:1.25rem;padding:0 0 .75rem;border-bottom:1px solid var(--border-subtle)}.pill-group{display:flex;background:rgba(var(--overlay-rgb),.07);border-radius:var(--radius-sm);padding:3px}.pill-group>button,.pill-group>select{padding:.25rem .75rem;border:none;border-radius:4px;background:transparent;color:var(--text-secondary);font-family:var(--font-ui);font-size:var(--fs-sm);font-weight:500;cursor:pointer;transition:color .2s,background-color .2s}.pill-group>button:hover,.pill-group>select:hover{color:var(--text)}.pill-group>.active,.pill-group>.filtered{background:rgba(var(--highlight-rgb),.12);color:var(--text);box-shadow:0 1px 3px rgba(var(--overlay-rgb),.12)}.pill-group>select:focus{outline:none}#words-text-filter{max-width:12rem}.words-sort-controls{margin-left:auto;flex-shrink:0}.word-card{position:relative;display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto auto;column-gap:.5rem;padding:.6rem 1.2rem;border:1px solid var(--border-subtle);border-radius:var(--radius);background:var(--surface-card);box-shadow:var(--shadow-card);margin-bottom:.5rem;cursor:pointer;transition:background-color .2s,box-shadow .2s}@media(hover:hover){.word-card:hover{background:var(--surface-card-hover);box-shadow:var(--shadow-card-hover)}}.word-card-sentence{grid-column:1;font-family:var(--font-read);font-size:var(--fs-lg);line-height:1.8;color:var(--text)}.word-card-actions{grid-column:2;grid-row:1 / 3;align-self:center;display:flex;gap:.25rem;position:relative;z-index:2}.word-card-gap-wrap{display:inline-block}.word-card-gap{display:inline-block;min-width:5em;padding:.1rem .3rem;border:none;border-bottom:2px dashed rgba(var(--accent-rgb),.4);background:none;color:var(--text);font-size:inherit;font-family:inherit;text-align:center;cursor:pointer;transition:border-color .2s,color .2s}@media(hover:hover){.word-card-gap:hover{border-bottom-color:rgba(var(--accent-rgb),.6)}}.word-card-gap.revealed{border-bottom-style:solid;border-bottom-color:rgba(var(--highlight-rgb),.15);cursor:default;font-weight:500}.word-card-gap.correct{border-bottom-color:var(--success);color:var(--success)}.word-card-gap.incorrect{border-bottom-color:var(--error);color:var(--error)}.word-card-info{display:flex;gap:.75rem;font-size:var(--fs-xs);color:var(--text-muted);margin-top:.35rem}.word-card-stats{white-space:nowrap;cursor:pointer;padding:.4rem .6rem;margin:-.4rem -.2rem -.4rem -.6rem;border-radius:var(--radius-sm)}@media(hover:hover){.word-card-stats:hover{color:var(--text-secondary);background:rgba(var(--highlight-rgb),.06)}}.word-card-translation{font-style:italic;color:var(--text-secondary)}.word-card-synonyms{font-size:.85em;color:var(--text-muted)}.word-card-synonyms:before{content:" · "}.word-card-btn{width:30px;height:30px;border-radius:var(--radius-sm);border:none;background:transparent;color:var(--text-muted);font-size:var(--fs-sm);display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;transition:color .2s,background-color .2s}@media(hover:hover){.word-card-btn:hover{color:var(--text);background:rgba(var(--highlight-rgb),.08)}}.word-card-btn.confirming{color:var(--error);background:rgba(var(--error-rgb),.12)}.word-card-delete{opacity:.35;transition:opacity .2s,color .2s,background-color .2s}@media(hover:hover){.word-card-delete:hover{opacity:1}}.word-card.not-due{opacity:.45}.word-card.not-due.focused{opacity:1}@media(hover:hover){.word-card.not-due:hover{opacity:1}}.word-card.focused{box-shadow:inset 3px 0 0 var(--accent),var(--shadow-card-hover)}.word-card-btn.loading{pointer-events:none;cursor:default}.word-card-btn .spinner{width:14px;height:14px;border-width:1.5px}.word-card-btn .icon-stop{width:10px;height:10px}.word-card-grade-bar{grid-column:1 / -1;grid-row:3;display:flex;gap:.5rem;justify-content:flex-end;max-height:0;padding-top:0;overflow:hidden;transition:max-height .22s ease,padding-top .22s ease;position:relative;z-index:2}.word-card.revealed .word-card-grade-bar{max-height:60px;padding-top:.5rem}.grade-btn{min-width:72px;padding:.3rem .85rem;border:1px solid var(--border-subtle);border-radius:var(--radius-sm);background:transparent;color:var(--text-secondary);font-size:var(--fs-lg);font-weight:500;line-height:1;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:background-color .15s,color .15s,border-color .15s,transform .05s}.grade-btn.grade-miss{color:var(--error);border-color:rgba(var(--error-rgb),.3)}.grade-btn.grade-know{color:var(--success);border-color:rgba(var(--success-rgb),.3)}.grade-btn.grade-miss.selected{background:rgba(var(--error-rgb),.15);border-color:var(--error)}.grade-btn.grade-know.selected{background:rgba(var(--success-rgb),.15);border-color:var(--success)}@media(hover:hover){.grade-btn.grade-miss:hover{background:rgba(var(--error-rgb),.1);border-color:var(--error)}.grade-btn.grade-know:hover{background:rgba(var(--success-rgb),.1);border-color:var(--success)}}.grade-btn:active{transform:scale(.98)}.word-cards-empty{color:var(--text-muted);font-size:var(--fs-md);text-align:center;padding:3rem 2rem}.words-refresh-message{color:var(--text-muted);font-size:var(--fs-sm);text-align:center;padding:1rem;opacity:.7}.shortcuts-help{display:flex;flex-wrap:wrap;gap:.3rem 1rem;font-size:var(--fs-xs);color:var(--text-muted);opacity:.5;transition:opacity .2s;padding-top:.25rem}.shortcuts-help:hover{opacity:.85}.shortcut kbd{display:inline-block;padding:.1rem .35rem;border:1px solid var(--border);border-radius:3px;background:var(--surface);font-family:inherit;line-height:1.2}.icon-record{display:block;width:12px;height:12px;border-radius:50%;background:currentColor}.icon-stop{display:block;width:12px;height:12px;border-radius:2px;background:currentColor}.icon-triangle{display:block;width:0;height:0;border-left:8px solid currentColor;border-top:5px solid transparent;border-bottom:5px solid transparent;margin-left:2px}@keyframes pulse{0%,to{box-shadow:0 0 rgba(var(--error-rgb),.4)}50%{box-shadow:0 0 0 8px rgba(var(--error-rgb),0)}}@keyframes section-reveal{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{to{transform:rotate(360deg)}}.spinner{width:18px;height:18px;border:2px solid transparent;border-top-color:var(--accent);border-radius:50%;animation:spin .7s linear infinite}.loading-spinner{width:28px;height:28px;border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin .7s linear infinite}.loading-spinner-small{width:18px;height:18px;border-width:2px}.loading-view,.login-view{display:flex;align-items:center;justify-content:center;min-height:100vh}.content-loading{display:flex;align-items:center;justify-content:center;padding:4rem 0}.login-view{padding:1rem}.login-form{display:flex;flex-direction:column;gap:.75rem;width:100%;max-width:340px}.login-title{font-size:var(--fs-xl);font-weight:600;color:var(--text);text-align:center;margin-bottom:.5rem}.login-form input[type=email],.login-form input[type=password]{padding:.65rem .85rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);color:var(--text);font-family:var(--font-ui);font-size:var(--fs-md);transition:border-color .2s}.login-form input:focus{outline:none;border-color:var(--accent-border)}.login-form input::placeholder{color:var(--text-muted)}.login-form button[type=submit]{padding:.65rem;border:none;border-radius:var(--radius);background:var(--accent);color:var(--on-accent);font-family:var(--font-ui);font-size:var(--fs-md);font-weight:600;cursor:pointer;transition:background-color .2s}.login-form button[type=submit]:hover{background:var(--accent-hover)}.login-form button[type=submit]:disabled{opacity:.6;cursor:not-allowed}.login-google-btn{padding:.65rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);color:var(--text);font-family:var(--font-ui);font-size:var(--fs-md);font-weight:500;cursor:pointer;transition:background-color .2s,border-color .2s}.login-google-btn:hover{background:var(--surface-hover);border-color:var(--accent-border)}.login-divider{display:flex;align-items:center;gap:.75rem;color:var(--text-muted);font-size:var(--fs-sm)}.login-divider:before,.login-divider:after{content:"";flex:1;height:1px;background:var(--border)}.login-error{color:var(--error);font-size:var(--fs-sm);text-align:center}.login-toggle{background:none;border:none;color:var(--text-muted);font-family:var(--font-ui);font-size:var(--fs-sm);cursor:pointer;padding:0;text-align:center;transition:color .2s}.login-toggle:hover{color:var(--text)}.header-user{display:flex;align-items:center;gap:.5rem}.user-email{font-size:var(--fs-sm);color:var(--text-muted)}.logout-btn{padding:.3rem .7rem;border:1px solid var(--border-subtle);border-radius:var(--radius-sm);background:transparent;color:var(--text-secondary);font-family:var(--font-ui);font-size:var(--fs-xs);cursor:pointer;transition:color .2s,border-color .2s}.logout-btn:hover{color:var(--text);border-color:var(--text-secondary)}.stories-onboarding{max-width:420px;margin:2rem auto;text-align:center}.stories-onboarding-title{font-size:var(--fs-xl);font-weight:700;margin-bottom:.5rem}.stories-onboarding-desc{font-size:var(--fs-md);color:var(--text-secondary);margin-bottom:1.5rem}.stories-onboarding-levels{display:flex;flex-direction:column;gap:.6rem}.onboarding-level-btn{display:flex;align-items:center;justify-content:space-between;width:100%;padding:1rem 1.2rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface-card);cursor:pointer;transition:background .15s,box-shadow .15s;text-align:left;font-family:var(--font-ui)}.onboarding-level-btn:hover{background:var(--surface-card-hover);box-shadow:var(--shadow-card-hover)}.onboarding-level-label{font-size:var(--fs-md);font-weight:700;color:var(--text)}.onboarding-level-desc{font-size:var(--fs-sm);color:var(--text-muted)}.stories-subheader{max-width:900px;margin:0 auto;padding-bottom:.4rem}.stories-level-nav{display:flex;align-items:center;gap:.4rem;padding:.3rem 0}.stories-level-arrow{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border:1px solid var(--border-subtle);border-radius:var(--radius-sm);background:transparent;color:var(--text-secondary);font-size:var(--fs-lg);cursor:pointer;flex-shrink:0;transition:color .15s,border-color .15s;font-family:var(--font-ui)}.stories-level-arrow:hover:not(:disabled){color:var(--text);border-color:var(--text-secondary)}.stories-level-arrow:disabled{opacity:.25;cursor:default}.stories-level-info{flex:1;min-width:0;display:flex;align-items:center;gap:.5rem}.stories-level-name{font-size:var(--fs-md);font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.stories-level-progress{font-size:var(--fs-sm);color:var(--text-muted);white-space:nowrap}.stories-add-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border:1px dashed var(--border);border-radius:var(--radius-sm);background:transparent;color:var(--text-secondary);font-size:var(--fs-lg);line-height:1;padding-bottom:2px;cursor:pointer;flex-shrink:0;transition:color .15s,border-color .15s,background .15s;font-family:var(--font-ui)}.stories-add-btn:hover{color:var(--accent);border-color:var(--accent);background:var(--accent-soft)}.stories-go-current{border:none;background:transparent;color:var(--accent);font-family:var(--font-ui);font-size:var(--fs-xs);cursor:pointer;padding:.15rem .3rem;white-space:nowrap;opacity:.8;transition:opacity .15s}.stories-go-current:hover{opacity:1}.stories-go-current-short{display:none}.stories-custom-input{padding:.5rem 0}.stories-custom-input textarea{width:100%;padding:.5rem .75rem;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);color:var(--text);font-family:var(--font-ui);font-size:var(--fs-sm);resize:vertical}.stories-custom-actions{display:flex;gap:.5rem;margin-top:.4rem}.stories-custom-add-btn{padding:.4rem .9rem;border:none;border-radius:var(--radius-sm);background:var(--accent);color:var(--on-accent);font-family:var(--font-ui);font-size:var(--fs-sm);font-weight:600;cursor:pointer;transition:background .15s}.stories-custom-add-btn:hover{background:var(--accent-hover)}.stories-custom-cancel-btn{padding:.4rem .9rem;border:1px solid var(--border-subtle);border-radius:var(--radius-sm);background:transparent;color:var(--text-secondary);font-family:var(--font-ui);font-size:var(--fs-sm);cursor:pointer}.stories-pills{--fade-size: 2rem;display:flex;gap:.4rem;padding:.3rem 2px .5rem;overflow-x:auto;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity;scrollbar-width:none}.stories-pills-fade-left{-webkit-mask-image:linear-gradient(to right,transparent,black var(--fade-size));mask-image:linear-gradient(to right,transparent,black var(--fade-size))}.stories-pills-fade-right{-webkit-mask-image:linear-gradient(to left,transparent,black var(--fade-size));mask-image:linear-gradient(to left,transparent,black var(--fade-size))}.stories-pills-fade-left.stories-pills-fade-right{-webkit-mask-image:linear-gradient(to right,transparent,black var(--fade-size),black calc(100% - var(--fade-size)),transparent);mask-image:linear-gradient(to right,transparent,black var(--fade-size),black calc(100% - var(--fade-size)),transparent)}.stories-pills::-webkit-scrollbar{display:none}.stories-pill{display:flex;align-items:center;gap:.3rem;padding:.35rem .7rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface-card);color:var(--text-secondary);font-family:var(--font-ui);font-size:var(--fs-sm);font-weight:500;white-space:nowrap;cursor:pointer;flex-shrink:0;scroll-snap-align:center;transition:background .15s,border-color .15s,color .15s,box-shadow .15s}.stories-pill:hover:not(:disabled){box-shadow:var(--shadow-card)}.stories-pill-completed{background:rgba(var(--success-rgb),.08);border-color:rgba(var(--success-rgb),.25);color:var(--success)}.stories-pill-active,.stories-pill-active-completed{background:rgba(var(--accent-rgb),.12);border-color:var(--accent-border);color:var(--accent);font-weight:700;box-shadow:0 0 0 1px var(--accent-border)}.stories-pill-locked{opacity:.35;cursor:default}.stories-pill-locked:hover{background:var(--surface-card);box-shadow:none}.stories-pill-custom{border-style:dashed}.stories-pill-icon{font-size:var(--fs-xs);line-height:1}.stories-pill-label{line-height:1}.stories-complete-btn{transition:color .15s}.stories-complete-btn-ready{color:var(--success);font-weight:600}.stories-empty{max-width:900px;margin:2rem auto;text-align:center;color:var(--text-muted);font-size:var(--fs-md)}.stories-inline-actions{display:flex;gap:.5rem;margin-left:auto}.stories-delete-btn{opacity:.5}.stories-delete-btn:hover{opacity:1}.stories-delete-btn.confirming{opacity:1;border-color:var(--error);color:var(--error);background:transparent}.hidden{display:none!important}body{-webkit-tap-highlight-color:transparent;touch-action:manipulation}@media(max-width:640px){body{padding:0 .5rem}header{padding:.75rem 0;gap:.4rem}.nav-link{padding:.4rem .55rem;font-size:var(--fs-sm)}.user-email{display:none}.header-controls{display:grid;grid-template-columns:auto 1fr auto 1fr;gap:.4rem .75rem;padding:.4rem .6rem;align-items:center}.control-row{display:contents}.control-row select{padding:.35rem .5rem;min-width:0}.sentences-panel{padding:.4rem .75rem;line-height:2}.text-controls{flex-wrap:wrap}.shortcuts-help{display:none}.words-header{padding-left:0}.word-card{padding:.5rem .75rem}.word-card-sentence{grid-column:1 / -1}.word-card-actions{grid-row:2;grid-column:2}.word-card-info{font-size:var(--fs-xs);align-self:center}.word-card.has-translation .word-card-stats{display:none}.word-card-btn{width:38px;height:38px;font-size:var(--fs-md)}.full-player-btn{width:44px;height:44px;font-size:var(--fs-lg)}.data-controls{flex-wrap:wrap}.stories-level-arrow,.stories-add-btn{width:44px;height:44px}.stories-level-name{font-size:var(--fs-sm)}.stories-go-current-full{display:none}.stories-go-current-short{display:inline}.stories-pill{padding:.3rem .55rem;font-size:var(--fs-xs)}.stories-onboarding{margin:1rem auto;padding:0 .5rem}.onboarding-level-btn{flex-direction:column;align-items:flex-start;gap:.2rem}}
