:root{--bg: #f6efe2;--bg-soft: #fbf6ec;--paper: #ffffff;--ink: #1d1f23;--ink-soft: #4a4d54;--muted: #7a7e87;--line: #e7dfd0;--line-strong: #d4c9b3;--teal: #0d6b62;--teal-soft: #d8efeb;--teal-deep: #074a44;--coral: #c44b3b;--coral-soft: #fbe1da;--sage: #4d7a44;--sage-soft: #e1ecdb;--espresso: #2a2218;--espresso-soft: #ddd2bf;--amber: #b07f1f;--amber-soft: #fdeec5;--danger: #b1372a;--danger-soft: #f7d8d2;--shadow-sm: 0 1px 2px rgba(33, 28, 18, .06);--shadow-md: 0 8px 22px rgba(33, 28, 18, .07);--shadow-lg: 0 24px 60px rgba(33, 28, 18, .1);--radius-sm: 10px;--radius-md: 14px;--radius-lg: 22px;--radius-xl: 28px;--serif: "Iowan Old Style", "Charter", "Source Serif Pro", "Source Serif 4", "Noto Serif SC", Georgia, "Times New Roman", serif;--sans: "Inter", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;font-family:var(--sans);color:var(--ink);background:var(--bg);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100vh}body{background:radial-gradient(1200px 600px at 0% 0%,rgba(13,107,98,.06),transparent 60%),radial-gradient(900px 600px at 100% 100%,rgba(196,75,59,.05),transparent 60%),var(--bg)}button,input,select,textarea{font:inherit;color:inherit}button{border:none;background:none;cursor:pointer;min-width:0}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid rgba(13,107,98,.32);outline-offset:2px}input,select,textarea{width:100%;border:1px solid var(--line-strong);border-radius:var(--radius-md);background:var(--paper);padding:12px 14px;font-size:.96rem;color:var(--ink);transition:border-color .12s ease,box-shadow .12s ease}input:focus,select:focus,textarea:focus{border-color:var(--teal);box-shadow:0 0 0 4px #0d6b621a;outline:none}input,select{height:50px}textarea{resize:vertical;line-height:1.45}input::placeholder,textarea::placeholder{color:#a09689}.app{width:min(560px,100%);margin:0 auto;padding:16px 16px 140px;display:flex;flex-direction:column;gap:18px}@media(min-width:720px){.app{width:min(620px,100%);padding:28px 24px 160px}}.topbar{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px;border-radius:var(--radius-lg);background:#fbf6eceb;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1px solid var(--line);box-shadow:var(--shadow-sm)}.topbar-brand{display:flex;align-items:center;gap:10px;min-width:0}.brand-emoji{font-size:24px;line-height:1}.brand-text{display:flex;flex-direction:column;gap:2px;min-width:0}.brand-text strong{font-family:var(--serif);font-size:1.05rem;line-height:1.1;color:var(--ink);letter-spacing:.005em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}.brand-text span{font-size:.74rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.topbar-actions{display:inline-flex;align-items:center;gap:6px}.locale-chip,.health-chip{display:inline-flex;align-items:center;gap:5px;height:34px;padding:0 10px;border-radius:999px;border:1px solid var(--line-strong);background:var(--paper);font-size:.78rem;font-weight:700;color:var(--ink-soft);transition:background .12s ease,color .12s ease,border-color .12s ease}.locale-chip:hover{border-color:var(--teal);color:var(--teal)}.health-chip.offline{border-color:var(--danger);color:var(--danger);background:var(--danger-soft)}.health-chip .dot{width:7px;height:7px;border-radius:999px;background:var(--danger)}.appfoot{display:flex;justify-content:center;padding:4px 0 0}.privacy-pill{display:inline-flex;align-items:center;gap:5px;font-size:.7rem;color:var(--muted);font-weight:600;padding:5px 10px;background:var(--paper);border:1px solid var(--line);border-radius:999px}.setup{display:flex;flex-direction:column;gap:14px}.hero{padding:0 4px}.eyebrow{margin:0 0 6px;font-family:var(--serif);font-size:1.55rem;line-height:1.05;color:var(--ink);letter-spacing:-.01em}.hero-hint{margin:0;color:var(--ink-soft);font-size:.92rem;line-height:1.45}.card{padding:18px;border-radius:var(--radius-lg);background:var(--paper);border:1px solid var(--line);box-shadow:var(--shadow-sm)}.stack{display:flex;flex-direction:column;gap:14px}.row{display:flex;gap:10px;flex-wrap:wrap}.row>.grow{flex:1 1 60%}.row>.shrink{flex:0 0 28%;min-width:100px}.field{display:flex;flex-direction:column;gap:6px;flex:1;min-width:0}.field>span{font-size:.78rem;font-weight:700;color:var(--ink-soft);letter-spacing:.02em;text-transform:uppercase}.pillrow{display:flex;flex-wrap:wrap;gap:6px}.pill{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:0 14px;height:38px;border-radius:999px;border:1px solid var(--line-strong);background:var(--paper);color:var(--ink-soft);font-size:.86rem;font-weight:700;transition:all .12s ease}.pill:hover{border-color:var(--teal);color:var(--teal)}.pill[data-active=true]{background:var(--teal);border-color:var(--teal);color:#fff;box-shadow:0 4px 14px #0d6b6240}.theme-scroller{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px}.theme-card{display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:12px 14px;border-radius:var(--radius-md);background:var(--bg-soft);border:1px solid var(--line);transition:all .12s ease}.theme-card:hover{border-color:var(--teal)}.theme-card[data-active=true]{background:var(--teal-soft);border-color:var(--teal);color:var(--teal-deep)}.theme-emoji{font-size:22px;line-height:1}.theme-label{font-size:.84rem;font-weight:700;text-align:left;text-transform:capitalize}.card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.card-title{margin:0;font-size:1.05rem;color:var(--ink)}.card-hint{margin:4px 0 0;font-size:.78rem;color:var(--muted)}.counter{display:inline-flex;align-items:baseline;gap:3px;padding:8px 12px;border-radius:999px;background:var(--coral-soft);color:var(--coral);font-weight:800;font-size:.92rem;flex-shrink:0}.counter strong{font-size:1.15rem}.counter-label{margin-left:4px;font-size:.66rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em}.counter[data-full=true]{background:var(--ink);color:#fff}.word-grid{display:flex;flex-wrap:wrap;gap:8px}.word-chip{position:relative;display:inline-flex;align-items:center;gap:6px;padding:0 14px;height:42px;border-radius:12px;background:var(--bg-soft);border:1px solid var(--line);color:var(--ink-soft);font-weight:700;font-size:.94rem;transition:all .1s ease}.word-chip:hover{border-color:var(--line-strong);background:#fff}.word-chip[data-status=target]{background:var(--coral-soft);border-color:var(--coral);color:var(--coral)}.word-chip[data-status=knows]{background:var(--sage-soft);border-color:var(--sage);color:var(--sage)}.word-chip[data-status=says]{background:var(--ink);border-color:var(--ink);color:#fff}.word-tag{font-size:.66rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;padding:2px 6px;border-radius:999px;background:#ffffff8c}.word-chip[data-status=says] .word-tag{background:#ffffff2e;color:#fff}.word-text{font-family:var(--sans)}.word-skeleton{width:80px;height:42px;border-radius:12px;background:linear-gradient(90deg,#ece4d3,#f5efe1,#ece4d3);background-size:200% 100%;animation:shimmer 1.4s infinite linear}@keyframes shimmer{to{background-position:-200% 0}}.legend{display:flex;flex-wrap:wrap;gap:6px;padding-top:4px;border-top:1px dashed var(--line)}.legend-item{display:inline-flex;align-items:center;height:26px;padding:0 12px;border-radius:999px;font-size:.74rem;font-weight:700;border:1px solid transparent}.legend-item[data-status=target]{background:var(--coral-soft);color:var(--coral);border-color:var(--coral)}.legend-item[data-status=knows]{background:var(--sage-soft);color:var(--sage);border-color:var(--sage)}.legend-item[data-status=says]{background:var(--ink);color:#fff;border-color:var(--ink)}.disclosure{padding:0}.disclosure-head{width:100%;display:flex;align-items:center;gap:12px;padding:16px 18px;background:transparent;text-align:left}.disclosure-icon{display:inline-grid;width:32px;height:32px;flex:0 0 auto;place-items:center;background:var(--teal-soft);color:var(--teal);border-radius:10px}.disclosure-text{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}.disclosure-text strong{font-size:.96rem;color:var(--ink)}.disclosure-text span{font-size:.76rem;color:var(--muted);line-height:1.4}.disclosure-body{padding:4px 18px 18px;border-top:1px solid var(--line);margin-top:4px}.muted-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0;font-size:.76rem;color:var(--muted)}.muted-row strong{color:var(--ink);font-weight:700}.primary,.ghost,.iconbtn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:46px;padding:0 18px;border-radius:14px;font-weight:800;font-size:.92rem;letter-spacing:.005em;transition:transform 80ms ease,box-shadow .12s ease,background .12s ease,color .12s ease,border-color .12s ease}.primary{background:var(--teal);color:#fff;box-shadow:0 6px 18px #0d6b6247}.primary:hover:not(:disabled){background:var(--teal-deep);transform:translateY(-1px);box-shadow:0 10px 22px #0d6b6252}.primary:disabled{opacity:.45;cursor:not-allowed;box-shadow:none}.primary.lg{height:56px;font-size:1rem;padding:0 22px;border-radius:18px}.ghost{background:var(--paper);color:var(--ink);border:1px solid var(--line-strong)}.ghost:hover:not(:disabled){border-color:var(--teal);color:var(--teal)}.ghost:disabled{opacity:.45;cursor:not-allowed}.iconbtn{width:44px;height:44px;padding:0;background:var(--paper);color:var(--ink);border:1px solid var(--line-strong)}.iconbtn:hover{border-color:var(--teal);color:var(--teal)}.file-button{position:relative;overflow:hidden}.file-button input{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;cursor:pointer}.spin{animation:spin .85s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.bottom-bar{position:sticky;bottom:0;margin:16px -16px -140px;padding:14px 16px 22px;background:linear-gradient(to top,var(--bg) 0%,var(--bg) 60%,rgba(246,239,226,0) 100%);display:flex;flex-direction:column;gap:10px;z-index:5}@media(min-width:720px){.bottom-bar{margin:16px -24px -160px;padding:16px 24px 30px}}.bottom-bar .primary{width:100%}.bottom-hint{margin:0;text-align:center;font-size:.74rem;color:var(--muted)}.notice{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 14px;border-radius:12px;font-size:.88rem;font-weight:600;line-height:1.4;border:1px solid transparent}.notice[data-tone=error]{background:var(--danger-soft);color:var(--danger);border-color:#b1372a4d}.notice[data-tone=info]{background:var(--amber-soft);color:var(--amber);border-color:#b07f1f4d}.notice[data-tone=success]{background:var(--sage-soft);color:var(--sage);border-color:#4d7a444d}.notice button{display:inline-flex;align-items:center;gap:4px;padding:4px 10px;border-radius:999px;border:1px solid currentColor;font-size:.74rem;font-weight:700;background:transparent;color:inherit}.recent{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px}.recent-label{font-size:.74rem;color:var(--muted);font-weight:700}.recent-chip{padding:4px 10px;border-radius:999px;background:var(--coral-soft);color:var(--coral);font-weight:700;font-size:.78rem}.reader{display:flex;flex-direction:column;gap:14px;min-height:calc(100vh - 100px)}.reader-bar{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;padding:4px 0}.reader-meta{text-align:center;display:flex;flex-direction:column;align-items:center;gap:2px;min-width:0}.reader-meta strong{font-family:var(--serif);font-size:1.05rem;letter-spacing:.01em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}.reader-meta span{font-size:.74rem;color:var(--muted);font-variant-numeric:tabular-nums;font-weight:700}.dotrow{display:flex;justify-content:center;gap:8px;padding:4px 0 8px}.dot{width:8px;height:8px;border-radius:999px;background:var(--line-strong);transition:all .12s ease}.dot[data-done=true]{background:var(--teal)}.dot[data-active=true]{width:24px;background:var(--teal)}.page{position:relative;display:flex;flex-direction:column;gap:14px;padding:28px 24px 32px;border-radius:var(--radius-xl);background:var(--paper);border:1px solid var(--line);box-shadow:var(--shadow-md);flex:1;touch-action:pan-y;-webkit-user-select:none;user-select:none}.page-text{margin:0;font-family:var(--serif);font-size:clamp(1.5rem,5.5vw,2.2rem);line-height:1.32;color:var(--ink);letter-spacing:-.005em}.page-targets{display:flex;flex-wrap:wrap;gap:8px;padding-top:8px;border-top:1px dashed var(--line)}.page-target{display:inline-flex;align-items:center;gap:4px}.target-word{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;height:38px;border-radius:999px;background:var(--coral-soft);border:1px solid var(--coral);color:var(--coral);font-weight:800;font-size:.92rem;transition:all .12s ease}.target-word[data-reaction=listened]{background:var(--amber-soft);border-color:var(--amber);color:var(--amber)}.target-word[data-reaction=repeated]{background:var(--sage-soft);border-color:var(--sage);color:var(--sage)}.target-word[data-reaction=said]{background:var(--ink);border-color:var(--ink);color:#fff}.target-icon{display:inline-grid;place-items:center}.dot-tiny{width:6px;height:6px;border-radius:999px;background:currentColor;display:inline-block}.target-extra{display:inline-flex;align-items:center;gap:3px;padding:3px 8px;height:26px;border-radius:999px;background:var(--paper);border:1px dashed var(--line-strong);color:var(--muted);font-size:.7rem;font-weight:700}.target-extra[data-active=true]{background:var(--teal);border-color:var(--teal);color:#fff;border-style:solid}.reaction-hint{margin:0;font-size:.78rem;color:var(--muted)}.swipe-hint{margin:auto 0 0;text-align:center;font-size:.7rem;color:var(--muted);padding-top:12px;letter-spacing:.04em}.drawer-handle{display:inline-flex;align-items:center;justify-content:center;gap:6px;align-self:center;padding:8px 16px;border-radius:999px;background:var(--paper);border:1px solid var(--line);font-size:.78rem;font-weight:700;color:var(--ink-soft)}.drawer-handle.open{border-color:var(--teal);color:var(--teal);background:var(--teal-soft)}.drawer{display:flex;flex-direction:column;gap:12px;padding:16px 18px;border-radius:var(--radius-lg);background:var(--bg-soft);border:1px solid var(--line);box-shadow:var(--shadow-sm)}.drawer-empty{margin:0;font-size:.86rem;color:var(--muted);text-align:center}.drawer-line{display:flex;flex-direction:column;gap:4px}.drawer-label{font-size:.66rem;color:var(--teal);font-weight:800;letter-spacing:.06em;text-transform:uppercase}.drawer-line p{margin:0;font-size:.94rem;color:var(--ink);line-height:1.45}.reader-nav{display:grid;grid-template-columns:auto 1fr;gap:10px;position:sticky;bottom:0;padding:10px 0 18px;background:linear-gradient(to top,var(--bg) 0%,var(--bg) 60%,rgba(246,239,226,0) 100%)}.reader-nav .ghost{width:56px}.reader-nav .primary{width:100%}.sheet-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#211c1266;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:40;display:flex;align-items:flex-end;justify-content:center;padding:0;animation:fade .16s ease}@media(min-width:720px){.sheet-overlay{align-items:center;padding:24px}}.sheet{width:min(560px,100%);max-height:90vh;overflow:auto;background:var(--paper);border-radius:24px 24px 0 0;padding:22px 22px 28px;display:flex;flex-direction:column;gap:16px;box-shadow:0 -20px 60px #211c1240;animation:slideup .22s cubic-bezier(.18,.89,.32,1.15)}@media(min-width:720px){.sheet{border-radius:24px}}.sheet-head{display:flex;align-items:center;justify-content:space-between}.sheet-head h3{margin:0;font-family:var(--serif);font-size:1.3rem}.sheet-summary{background:var(--bg-soft);padding:12px;border-radius:var(--radius-md)}.summary-grid{display:flex;flex-direction:column;gap:8px}.summary-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 12px;border-radius:12px;background:var(--paper);border:1px solid var(--line)}.summary-row strong{font-family:var(--serif);font-size:1.05rem}.summary-row span{font-size:.82rem;font-weight:700;color:var(--muted)}.summary-row[data-reaction=listened]{border-color:var(--amber);background:var(--amber-soft)}.summary-row[data-reaction=listened] span{color:var(--amber)}.summary-row[data-reaction=repeated]{border-color:var(--sage);background:var(--sage-soft)}.summary-row[data-reaction=repeated] span{color:var(--sage)}.summary-row[data-reaction=said]{background:var(--ink);color:#fff;border-color:var(--ink)}.summary-row[data-reaction=said] strong,.summary-row[data-reaction=said] span{color:#fff}.sheet-actions{display:flex;gap:8px}.sheet-actions .ghost{flex:0 0 auto}.sheet-actions .primary{flex:1}@keyframes slideup{0%{transform:translateY(28px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes fade{0%{opacity:0}to{opacity:1}}.done{display:flex;align-items:center;justify-content:center;min-height:calc(100vh - 220px)}.done-card{width:100%;display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center;padding:36px 24px;border-radius:var(--radius-xl);background:var(--paper);border:1px solid var(--line);box-shadow:var(--shadow-md)}.done-emoji{font-size:56px;line-height:1}.done-card h2{margin:0;font-family:var(--serif);font-size:1.7rem}.done-card p{margin:0;color:var(--ink-soft);font-size:.95rem;line-height:1.5}.done-actions{display:flex;flex-direction:column;gap:8px;width:100%}.done-actions .primary,.done-actions .ghost{width:100%}.muted-text{color:var(--muted);font-size:.86rem}@media(prefers-reduced-motion:reduce){.spin,.word-skeleton,.sheet,.sheet-overlay{animation:none!important}.primary,.ghost{transition:none}}