:root{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",sans-serif;color:#243f36;background:#f7f8f2;font-synthesis:none;--green:#277859;--muted:#7d8b80}*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button{cursor:pointer;border:0;color:inherit;background:#edf1e9;border-radius:14px;padding:12px 16px;touch-action:manipulation}button:active{transform:scale(.97)}button:disabled{opacity:.4}button.primary{background:var(--green);color:white}button.outline{background:white;border:1px solid #dbe4d8}h1,h2,h3,p{margin:0}h1{font-size:29px;margin-top:6px}h2{font-size:22px;margin-bottom:18px}h3{font-size:17px;margin-bottom:9px}p{line-height:1.7}.muted,.empty{color:var(--muted)}.empty{padding:50px 15px;text-align:center;line-height:1.9}.eyebrow{font-size:10px;letter-spacing:2px;color:#7b8b7d}.sprout{color:#e4ab4f}#home{max-width:880px;margin:auto;padding:calc(env(safe-area-inset-top) + 20px) 22px calc(100px + env(safe-area-inset-bottom))}header{display:flex;justify-content:space-between;align-items:center;margin-bottom:27px}.icon{background:white;font-size:22px;width:46px;height:46px;padding:0;border:1px solid #e3e7db}.hero{background:#e7efdd;border-radius:23px;padding:22px;margin-bottom:22px;position:relative;overflow:hidden}.hero p{font-size:13px;color:#66815f;margin:8px 0 14px}.hero h2{margin:0;font-size:22px}.hero small{display:block;color:#66815f}.levels{display:flex;gap:8px;overflow:auto;margin:0 -4px 14px;padding:4px 4px 10px;scrollbar-width:none}.levels button{flex-shrink:0;min-width:44px;background:white;border:1px solid #e1e7dc;font-weight:650}.levels button.selected{background:var(--green);color:white;border-color:var(--green)}.filters{display:flex;gap:9px;overflow:auto;margin-bottom:22px}.filters button{white-space:nowrap;font-size:12px;padding:8px 13px}.filters .selected{background:#e1ecda;color:#267050}.section-title{display:flex;justify-content:space-between;align-items:center;margin:20px 0 14px}.section-title h3{margin:0}.section-title span{color:var(--muted);font-size:12px}.books{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 15px}.book{background:none;padding:0;text-align:left;min-width:0}.cover{position:relative;background:#eceee4;height:180px;border-radius:15px;display:flex;align-items:center;justify-content:center;overflow:hidden;border:1px solid #e1e5d9}.cover img{height:100%;width:100%;object-fit:contain}.badge{position:absolute;bottom:8px;left:8px;font-size:10px;padding:4px 8px;background:#fffdf2e8;border-radius:8px}.book strong{display:block;margin:10px 0 3px;font-size:15px}.book small{color:var(--muted);font-size:12px}nav{position:fixed;bottom:0;left:0;right:0;max-width:880px;margin:auto;background:#fffffff5;border-top:1px solid #e7eadf;display:flex;justify-content:space-around;padding:10px 8px calc(12px + env(safe-area-inset-bottom));z-index:5;backdrop-filter:blur(12px)}nav button{background:none;font-size:12px;flex:1;padding:5px}nav b{display:block;font-size:23px;margin-bottom:5px}nav .selected{color:var(--green);font-weight:bold}.panel{background:white;border:1px solid #e5e9dd;padding:19px;border-radius:20px;margin-bottom:15px}.row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}.row:last-child{margin-bottom:0}.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}.actions button{flex:1;white-space:nowrap}.stat{font-size:32px;font-weight:700;color:var(--green)}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;text-align:center}.grid3 small{display:block;color:var(--muted);font-size:11px;margin-top:4px}#reader{position:fixed;inset:0;background:#f5f5ee;z-index:10;padding-top:env(safe-area-inset-top)}[hidden]{display:none!important}.read-head{height:52px;display:flex;align-items:center;gap:12px;padding:0 14px;font-size:13px}.read-head button{font-size:31px;line-height:1;padding:2px 13px;background:none}#book-title{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#page-number{font-size:11px;color:#829081}#reading-space{position:absolute;inset:calc(env(safe-area-inset-top) + 52px) 0 env(safe-area-inset-bottom);display:flex;align-items:center;justify-content:center}#stage{position:relative;touch-action:pan-y;user-select:none;-webkit-user-select:none;overflow:hidden;background:white}#page-image{display:block;width:100%;height:100%;pointer-events:none;object-fit:fill}#words{position:absolute;inset:0}.word{position:absolute;padding:0;border:0;border-radius:3px;background:transparent;touch-action:pan-y;min-width:0}.word.active{background:#f3d65066;outline:1px solid #e5bb36;mix-blend-mode:multiply}.gray #page-image,.gray .page-curl-layer{filter:grayscale(1)}.gray .word.active{background:#0002;outline:2px solid #555}.page-curl-layer{position:absolute;inset:0;width:100%;height:100%;z-index:4;pointer-events:none}.page-curl-running #words{visibility:hidden}#translate{position:absolute;right:12px;bottom:22px;width:44px;height:44px;padding:0;border-radius:50%;background:#ffffffed;box-shadow:0 3px 15px #243f3622;border:1px solid #dce3d5;color:#297455;font-size:20px;z-index:5}#notice{position:absolute;bottom:7px;left:12px;font-size:11px;color:#73816d;pointer-events:none}dialog{border:1px solid #e0e6d9;border-radius:24px;padding:24px;max-width:calc(100vw - 32px);width:420px;max-height:80dvh;color:#243f36;box-shadow:0 24px 90px #0003}dialog::backdrop{background:#162b234d;backdrop-filter:blur(3px)}#modal-body{max-height:62dvh;overflow:auto}.close{width:100%;margin-top:17px;background:#f0f3eb}.translation{padding:13px 0;border-bottom:1px solid #edf0e8}.translation strong{display:block;margin-bottom:7px;line-height:1.6}.translation p{color:#5b775a}.word-title{font-size:30px;margin-bottom:13px}.meaning{font-size:20px;margin-bottom:10px}#toast{position:fixed;left:50%;bottom:110px;transform:translateX(-50%);background:#243f36ed;color:white;padding:11px 18px;border-radius:20px;font-size:13px;z-index:100;max-width:90vw;display:none}.day-list{display:flex;gap:7px;flex-wrap:wrap}.day-list span{padding:6px 9px;background:#e9f1e0;border-radius:8px;font-size:12px}.calendar{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;text-align:center;font-size:12px}.calendar span{padding:9px 0;border-radius:9px}.calendar .read{background:#dbead1;color:#2a7149}.calendar .today{outline:1px solid #55946a}.calendar small{padding:8px 0;color:#8a978a}label{display:flex;align-items:center;justify-content:space-between;padding:14px 0;border-bottom:1px solid #edf0e8;font-size:14px}input[type=checkbox]{width:20px;height:20px;accent-color:var(--green)}.level-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.playlist{padding:12px 0;border-bottom:1px solid #eef1e8}.playlist .current{color:var(--green);font-weight:700}@media(min-width:600px){.books{grid-template-columns:repeat(3,minmax(0,1fr))}.cover{height:220px}}@media(orientation:landscape) and (max-height:520px){.read-head{height:38px}#reading-space{top:calc(env(safe-area-inset-top) + 38px)}}
/* v0.2: blue/white layout following the supplied reference. */
:root{color:#172c50;background:#f3f8ff;--green:#287bff;--muted:#7b8ba2}button{background:#edf4fc}header{margin-bottom:20px}header .eyebrow{display:none}header h1{color:#0959a1;font-size:28px}header h1:after{content:'每天读一点，进步看得见';display:block;font-size:12px;font-weight:400;letter-spacing:1px;margin-top:6px;color:#66768d}.sprout{color:#48ac57}.icon{color:#244e81}#home{background:linear-gradient(#fff 0,#f2f8ff 55%,#edf5ff 100%);min-height:100dvh;padding-left:16px;padding-right:16px}.search-box{background:#edf3f9;display:flex;gap:9px;align-items:center;padding:11px 13px;border-radius:13px;margin-bottom:13px;color:#7d8da2}.search-box svg{width:20px;height:20px}.search-box input{background:none;border:0;outline:0;min-width:0;width:100%;color:#29436b;font-size:13px}.shelf-tools{display:flex;gap:10px;margin-bottom:10px}.shelf-tools button{display:flex;align-items:center;justify-content:center;gap:8px;font-size:14px;font-weight:600;padding:12px 10px}.shelf-tools button:first-child{background:#dcf6f0;color:#128b83;flex:1.4}.shelf-tools button:last-child{flex:1}.shelf-tools svg{width:20px;height:20px}.levels{margin-bottom:7px}.levels button{padding:6px 12px;min-width:42px;font-size:14px;border-radius:22px}.levels button.selected{background:#287bff;border-color:#287bff}.section-title{gap:10px;margin:13px 0 4px}.section-title h3{font-size:18px;white-space:nowrap}.section-title .filters{margin:0;gap:5px}.filters button{font-size:11px;padding:6px 9px}.filters button.selected{background:#287bff;color:#fff}.count{font-size:11px;margin-bottom:10px}.books{gap:12px}.book{border:1px solid #e8edf4;background:white;border-radius:13px;padding:6px;box-shadow:0 2px 7px #133f7010}.cover{height:auto;aspect-ratio:1.45;border:0;border-radius:8px;background:#edf5fa}.book-info{display:flex;align-items:center;justify-content:space-between;gap:3px;padding:3px 2px}.book strong{font-size:12px;margin:3px 0;line-height:1.5;min-width:0}.book small{font-size:10px;white-space:nowrap}.book small.is-read{color:#42a84e}.book .cover img{object-fit:contain}.books>.empty{grid-column:1/-1}nav{color:#8a98a9}nav b svg{width:25px;height:25px;display:block;margin:auto}nav .selected{color:#1683ff}nav{border-color:#e7eff8}.panel{border:0;box-shadow:0 1px 8px #16446d05}.stat{color:#075cc1}.grid3{padding:20px 10px}.grid3>div:not(:last-child){border-right:1px solid #e6edf5}.grid3 small{font-size:12px}.mine-title{text-align:center;margin-bottom:20px}.mine-page header{position:absolute;top:calc(env(safe-area-inset-top) + 16px);right:17px;margin:0}.mine-page header>div{display:none}.mine-page header .icon{background:none;border:0}.profile-card{display:flex;align-items:center;gap:16px;background:linear-gradient(120deg,#c7edff,#e2f3ff);border-radius:22px;padding:22px 17px;margin-bottom:15px}.profile-card h2{font-size:21px;margin-bottom:8px}.profile-card p{font-size:13px;color:#607890}.avatar{height:72px;width:72px;flex-shrink:0;display:grid;place-items:center;background:#ffffffb5;border:3px solid white;border-radius:50%;color:#4197df}.avatar svg{width:43px;height:43px}.profile-card>button{margin-left:auto;padding:6px;background:transparent}.profile-card>button svg{width:22px;height:22px}.menu-panel{padding:0 17px}.menu-row{display:flex;align-items:center;gap:14px;width:100%;text-align:left;background:none;border-radius:0;padding:17px 0;min-height:76px}.menu-row:not(:last-child){border-bottom:1px solid #e9eff6}.menu-icon{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;color:white;flex-shrink:0}.menu-icon svg{width:25px;height:25px}.menu-icon.blue{background:linear-gradient(135deg,#2586ff,#69b3ff)}.menu-icon.yellow{background:linear-gradient(135deg,#ffbd31,#ffda65)}.menu-icon.mint{background:linear-gradient(135deg,#1dc8a4,#62dfbc)}.menu-icon.purple{background:linear-gradient(135deg,#9860f2,#bc99ff)}.menu-text{flex:1;font-weight:600;font-size:17px}.menu-text small{display:block;font-size:11px;color:#8a98aa;font-weight:400;margin-top:6px}.menu-arrow svg{width:18px;height:18px;color:#8796ab}.brand-footer{text-align:center;font-size:12px;color:#91a1b6;margin-top:25px}#profile-name{width:100%;padding:13px;border:1px solid #d9e5f3;border-radius:12px;color:inherit}dialog{color:#172c50;border-color:#e3ecf6}dialog.bottom-sheet{position:fixed;inset:auto 0 0;margin:0 auto;width:100%;max-width:620px;max-height:88dvh;border-radius:24px 24px 0 0;padding-bottom:calc(22px + env(safe-area-inset-bottom))}dialog.bottom-sheet:before{content:'';display:block;width:40px;height:4px;border-radius:8px;background:#adb9c6;margin:0 auto 19px}.bottom-sheet #modal-body{max-height:65dvh}.level-grid{gap:8px;margin-top:13px}.level-grid button{background:#fff;border:1px solid #e0e7f0;padding:11px 3px;border-radius:12px}.level-grid button.selected{background:#287bff;color:white;border-color:#287bff}.special-wide{display:flex;align-items:center;gap:10px;background:#dcf6f0;color:#168b84;width:100%;margin-bottom:17px}.special-wide svg{width:23px;height:23px}.special-wide svg:last-child{margin-left:auto}#reading-space{touch-action:none;overscroll-behavior:none;user-select:none;-webkit-user-select:none}#stage,#words,.word{touch-action:none}.read-head{touch-action:manipulation}.close{background:#edf4fc}.translation p{color:#3d699c}#toast{background:#17345cee}#reader{background:#f0f4f8}#translate{color:#287bff;border-color:#d6e4f5}#notice{color:#75899e}@media(min-width:600px){.cover{height:auto}.books{grid-template-columns:repeat(3,minmax(0,1fr))}.mine-page header{right:max(17px,calc((100vw - 846px)/2))}}

/* Entire reading screen owns touch gestures; explicit buttons remain taps. */
#reader,#reader .read-head,#reading-space,#stage,#words,.word{touch-action:none;overscroll-behavior:none}

/* v0.5: native system bars hidden while reading; preserve page proportions. */
#reader.immersive{padding:0}
#reader.immersive .read-head{display:none}
#reader.immersive #reading-space{top:var(--safe-area-inset-top,env(safe-area-inset-top,0px));bottom:var(--safe-area-inset-bottom,env(safe-area-inset-bottom,0px));left:var(--safe-area-inset-left,env(safe-area-inset-left,0px));right:var(--safe-area-inset-right,env(safe-area-inset-right,0px))}

/* v0.6: retain level/title header while native bars stay hidden. */
#reader.immersive .read-head{display:flex;height:48px;padding-top:0;position:relative;z-index:6}
#reader.immersive{padding-top:var(--safe-area-inset-top,env(safe-area-inset-top,0px))}
#reader.immersive #reading-space{top:calc(48px + var(--safe-area-inset-top,env(safe-area-inset-top,0px)))}
#reader-settings{position:absolute;right:12px;bottom:78px;width:44px;height:44px;padding:0;border-radius:50%;background:#ffffffed;box-shadow:0 3px 15px #243f3622;border:1px solid #d6e4f5;color:#287bff;font-size:23px;z-index:5}
.speed-control{background:#f1f6fe;padding:18px 14px;border-radius:16px;margin-bottom:12px}.speed-control output{color:#287bff;font-weight:700}.speed-control input[type=range]{width:100%;margin:14px 0 8px;accent-color:#287bff;touch-action:pan-x;height:32px}.speed-labels{display:flex;align-items:center;justify-content:space-between;font-size:12px;color:#7386a2}.speed-labels button{font-size:12px;color:#287bff;padding:5px 10px}.setting-help{font-size:11px;color:#8593a8;padding:9px 0 16px}.switch-row input[type=checkbox]{appearance:none;width:44px;height:26px;border-radius:18px;background:#cbd6e6;position:relative;flex-shrink:0}.switch-row input:before{content:'';position:absolute;width:20px;height:20px;top:3px;left:3px;border-radius:50%;background:white;box-shadow:0 1px 4px #0002;transition:transform .15s}.switch-row input:checked{background:#287bff}.switch-row input:checked:before{transform:translateX(18px)}

/* v0.7: all 30 choices share one horizontal strip, with no duplicate row. */
.level-strip{position:relative;margin:3px -4px 10px}
.level-strip:after{content:'';position:absolute;right:-1px;top:0;bottom:0;width:15px;pointer-events:none;background:linear-gradient(90deg,transparent,#f8fbff)}
.level-strip .levels{gap:9px;overflow-x:auto;overscroll-behavior-x:contain;touch-action:pan-x;margin:0;padding:6px 10px 9px 4px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.level-strip .levels::-webkit-scrollbar{display:none}
.level-strip .level-chip{display:grid;place-items:center;width:46px;height:46px;min-width:46px;padding:0;border-radius:15px;border:1px solid #e1eaf7;background:linear-gradient(145deg,#fff,#f2f7ff);box-shadow:0 2px 5px #275d9a09,inset 0 1px 0 #fff;color:#526b8d;font-size:16px;line-height:1;font-weight:650;letter-spacing:.2px;transition:background .15s,box-shadow .15s,color .15s;scroll-margin-inline:10px}
.level-strip .level-chip.special-chip{width:61px;min-width:61px;color:#15978d;border-color:#ccece6;background:linear-gradient(140deg,#f1fffb,#e1f7f0);font-size:14px}
.level-strip .level-chip.selected{color:#fff;border-color:#3486fa;background:linear-gradient(140deg,#55a7ff,#286bf5);box-shadow:0 4px 10px #3a7ef338,inset 0 1px 0 #ffffff4a}
.level-strip .level-chip.special-chip.selected{background:linear-gradient(140deg,#38caba,#139e99);border-color:#28b8ab;box-shadow:0 4px 10px #19aa9b30}
#categories{margin:0 0 12px;gap:7px}#categories button{padding:9px 12px;background:#eaf5f4;color:#4e7f7a}#categories button.selected{background:#159f96;color:white}
/* v0.8: fixed cover slots and aligned title rows for mixed orientations. */
.books{align-items:stretch;grid-auto-rows:1fr}.book{display:flex;flex-direction:column;width:100%;min-width:0;height:100%;padding:7px;border-radius:15px;background:#fff;border:1px solid #e5edf7;box-shadow:0 2px 8px #2f5c8910}.book .cover{position:relative;display:block;flex:none;width:100%;height:auto;aspect-ratio:1.45;overflow:hidden;border-radius:10px;background:#edf4f9}.book .cover img{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:contain;object-position:center}.book .book-info{flex:none;height:34px;min-height:34px;display:flex;align-items:center;gap:6px;padding:3px 2px}.book .book-info strong{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12px;line-height:22px;margin:0}.book .book-info small{flex:none;font-size:10px}.book:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* The expander occupies the SAME row as the scrollable level chips. */
.level-strip{display:flex;align-items:center;gap:7px}.level-strip:after{display:none}.level-strip .levels{flex:1;min-width:0}.level-strip #expand-levels{flex:none;display:grid;place-items:center;width:39px;height:46px;padding:0;margin-right:3px;border-radius:13px;border:1px solid #dfe9f6;background:#f5f9ff;color:var(--accent);box-shadow:0 2px 5px #275d9a09}.level-strip #expand-levels svg{width:19px;height:19px}.all-level-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:9px}.all-level-grid button{height:48px;font-weight:600;font-size:16px;padding:0}.all-level-grid .special-choice{background:#e2f6f1;color:#138f85}.all-level-grid .selected{color:white;background:var(--accent);border-color:var(--accent)}.level-footnote{text-align:center;font-size:12px;color:#8b9ab0;margin-top:20px}
/* Skin controls and previews, no external font/icon/image dependency. */
.appearance-card{background:#f7faff;border:1px solid #e8eff7;border-radius:17px;padding:15px;margin:0 0 15px}.appearance-card h3{margin-bottom:14px;font-size:15px}.theme-options{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.theme-choice{padding:0;background:none;border:0;display:flex;align-items:center;flex-direction:column;gap:8px;font-size:12px}.theme-swatch{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;box-shadow:inset 0 1px 1px #fff8,0 3px 8px #3d5f8b12}.theme-swatch.blue{background:linear-gradient(140deg,#65b4ff,#2370fa)}.theme-swatch.mint{background:linear-gradient(140deg,#a3e5d5,#32b99c)}.theme-swatch.peach{background:linear-gradient(140deg,#ffd3ae,#f09a65)}.theme-swatch.lavender{background:linear-gradient(140deg,#d2bdf9,#a08adf)}.theme-swatch span{color:white;font-size:24px;visibility:hidden}.theme-choice.selected .theme-swatch span{visibility:visible}.theme-choice.selected small{font-weight:700;color:var(--accent)}.mode-options{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.mode-choice{padding:6px;background:white;border:2px solid transparent;border-radius:12px;display:flex;align-items:center;flex-direction:column;gap:8px}.mode-choice.selected{border-color:var(--accent)}.mode-sample{position:relative;display:block;overflow:hidden;width:100%;height:49px;background:#deebfa;border-radius:7px}.mode-sample:before{content:'';position:absolute;width:13px;height:13px;background:#f6cf67;border-radius:50%;top:8px;right:9px}.mode-sample i,.mode-sample b{position:absolute;bottom:-16px;left:0;width:60px;height:43px;background:#8accc5;transform:rotate(34deg);border-radius:7px}.mode-sample b{background:#b1dfbe;left:38px;bottom:-22px}.mode-sample.warm{filter:sepia(.6)}.mode-sample.ink{filter:grayscale(1)}.mode-choice small{font-size:12px}.appearance-note{font-size:11px;color:#8997aa;margin-top:12px;text-align:center}
#reader.warm #page-image,#reader.warm .page-curl-layer{filter:sepia(.38) saturate(.72)}#reader.warm{background:#f5eedf}#reader.gray{background:#eeeeea}.gray .word.active{background:#0002;outline:2px solid #555}
/* Theme affects interface only; book artwork stays original outside display mode. */
body{--accent:#287bff;--accent-light:#eaf3ff;--accent-strong:#1b61d7;--skin-bg:#f3f8ff;--skin-panel:#e2efff;--green:var(--accent)}
body[data-theme=mint]{--accent:#20a68d;--accent-light:#e1f5ef;--accent-strong:#157d6b;--skin-bg:#f0faf6;--skin-panel:#d8f1e8}
body[data-theme=peach]{--accent:#e78b51;--accent-light:#fff0e3;--accent-strong:#b96735;--skin-bg:#fff8f0;--skin-panel:#ffe7d0}
body[data-theme=lavender]{--accent:#9880d7;--accent-light:#f0eafb;--accent-strong:#7659b6;--skin-bg:#f8f5fd;--skin-panel:#eae0fa}
body{background:var(--skin-bg)}#home{background:linear-gradient(#fff,var(--skin-bg) 65%)}header h1{color:var(--accent-strong)}.icon,nav .selected,.stat,#reader-settings,#translate,.speed-control output,.speed-labels button{color:var(--accent)}button.primary,.filters button.selected,.level-grid button.selected,.switch-row input:checked{background:var(--accent)}.level-strip .level-chip.selected{background:linear-gradient(140deg,var(--accent),var(--accent-strong));border-color:var(--accent);box-shadow:0 3px 9px color-mix(in srgb,var(--accent) 25%,transparent)}.level-strip .level-chip.special-chip.selected{background:linear-gradient(140deg,#38caba,#139e99);border-color:#28b8ab}.profile-card{background:linear-gradient(120deg,var(--skin-panel),var(--accent-light))}.search-box,.speed-control,.close{background:var(--accent-light)}input[type=range],input[type=checkbox]{accent-color:var(--accent)}.level-strip #expand-levels{background:var(--accent-light)}.calendar .read{background:var(--accent-light);color:var(--accent-strong)}.calendar .today{outline-color:var(--accent)}

/* v0.8.3: centered pages, header settings, accessible pause overlay. */
#reading-space{display:flex;align-items:center;justify-content:center;overflow:hidden}
#stage{flex:0 0 auto;margin:0;align-self:center}
#page-image{object-fit:contain;object-position:center}
#reader .read-head #reader-settings{position:static;flex:0 0 44px;width:44px;height:44px;bottom:auto;right:auto;font-size:24px;background:transparent;box-shadow:none;border:0;padding:0}
#translate{right:16px;bottom:clamp(76px,15vh,132px);width:52px;height:52px;font-size:23px}
#resume-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:76px;height:76px;padding:17px;border-radius:50%;background:rgba(25,38,53,.30);border:1px solid rgba(255,255,255,.55);box-shadow:0 3px 18px #0002;color:rgba(255,255,255,.90);z-index:5;touch-action:none}
#resume-play svg{width:100%;height:100%;fill:currentColor;pointer-events:none}
#resume-play:active{transform:translate(-50%,-50%) scale(.96)}
#resume-play:focus-visible{outline:3px solid var(--accent);outline-offset:4px}

/* v0.8.4: symmetric space around the book and independently centered title. */
#reader.immersive #reading-space{bottom:calc(48px + var(--safe-area-inset-bottom,env(safe-area-inset-bottom,0px)))}
#reader .read-head{position:relative;padding:0 12px;gap:8px}
#reader .read-head #back{margin-right:auto;flex:0 0 40px;width:40px;padding:0}
#reader #book-title{position:absolute;left:50%;transform:translateX(-50%);width:calc(100% - 208px);max-width:520px;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none}
#reader #page-number{flex:0 0 40px;text-align:right;font-size:11px}
#translate{width:44px;height:44px;font-size:20px}

/* v0.8.5: raise the complete reading area a further 24 CSS px. */
#reader.immersive #reading-space{bottom:calc(96px + var(--safe-area-inset-bottom,env(safe-area-inset-bottom,0px)))}
@media(max-height:480px){#reader.immersive #reading-space{bottom:calc(64px + var(--safe-area-inset-bottom,env(safe-area-inset-bottom,0px)))}}

/* 0.10.9: balanced side columns keep the book heading centered. */
#reader .read-head,#reader.immersive .read-head{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;grid-template-rows:48px;column-gap:8px;height:48px;align-items:center;padding-left:12px;padding-right:12px}
#reader .read-head #back{grid-column:1;grid-row:1;margin:0;width:44px;height:44px;justify-self:center;align-self:center;padding:0}
#reader .read-head #book-title{position:static;grid-column:2;grid-row:1;left:auto;transform:none;justify-self:stretch;width:100%;max-width:none;min-width:0;text-align:center;font-size:19px;font-weight:650;line-height:1.15;white-space:normal;overflow:hidden;overflow-wrap:anywhere;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;pointer-events:auto}
#reader .read-head #reader-settings{grid-column:3;grid-row:1;position:static;width:44px;height:32px;justify-self:center;align-self:start;margin:0;padding:0;font-size:22px;line-height:32px}
#reader .read-head #page-number{grid-column:3;grid-row:1;align-self:end;justify-self:center;margin:0 0 2px;min-width:0;width:44px;height:12px;line-height:12px;font-size:10px;font-weight:400;text-align:center;white-space:nowrap;color:var(--muted)}
@media(min-width:600px){#reader .read-head #book-title{font-size:21px;line-height:1.1}}
@media(max-width:340px){#reader .read-head,#reader.immersive .read-head{column-gap:6px;padding-left:8px;padding-right:8px}#reader .read-head #book-title{font-size:18px}}

/* v0.12: bounded, wrapping book titles; persistent download feedback. */
.book .book-info{height:auto;min-height:70px;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:3px}
.book .book-info strong{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;white-space:normal;overflow-wrap:anywhere;word-break:normal;overflow:hidden;line-height:1.45;flex:none;min-width:0;width:100%;max-height:4.35em}
.book .book-info small{align-self:flex-start;margin-top:auto}
.cover-retry,.cover-detail{position:absolute;left:8px;right:8px;white-space:normal;overflow-wrap:anywhere;padding:8px;font-size:11px;background:#ffffffed;z-index:2}
.cover-retry{top:30%}.cover-detail{top:65%;padding:4px;background:none;color:#326ca2}
#download-progress{position:fixed;left:16px;right:16px;bottom:calc(90px + env(safe-area-inset-bottom));margin:auto;max-width:600px;padding:15px 18px;z-index:120;background:#17345cf5;color:#fff;border-radius:15px;white-space:normal;overflow-wrap:anywhere;font-size:13px;line-height:1.6;box-shadow:0 6px 25px #17345c30}
.playlist,.playlist .row,.row>div,.menu-text{min-width:0}.playlist strong,.playlist span,.translation strong{overflow-wrap:anywhere;white-space:normal}
#download-progress.background-download{bottom:calc(14px + env(safe-area-inset-bottom));left:20px;right:20px;padding:7px 12px;max-width:460px;font-size:11px;opacity:.9;pointer-events:none}
.notice-body{white-space:pre-wrap;overflow-wrap:anywhere;font-size:15px;line-height:1.8}.notice-date{font-size:12px;color:#7b8ba2;margin:0 0 14px}.notification-item{width:100%;text-align:left;display:block;margin:10px 0;padding:16px;white-space:normal;overflow-wrap:anywhere}.support-qr{display:block;width:240px;max-width:100%;height:auto;object-fit:contain;margin:16px auto}
/* v0.15 brand and independent listening player */
.brand-header{display:inline-block;width:38px;height:38px;object-fit:cover;border-radius:50%;vertical-align:middle;margin-left:5px}.profile-card .avatar{padding:0;overflow:hidden;background:#fbfaf5}.avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%}.account-brand-image{width:76px;height:76px;object-fit:cover;border-radius:50%;display:block;margin:0 auto 14px}
.listen-player{max-width:540px;margin:0 auto;padding-bottom:20px}.listen-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:22px}.listen-top h2{margin:0}.listen-top button{font-size:13px;white-space:nowrap}.listen-cover{width:min(76vw,310px);aspect-ratio:1;display:flex;align-items:center;justify-content:center;background:white;border:1px solid #dce9e2;border-radius:24px;padding:16px;margin:10px auto 24px;box-shadow:0 15px 35px #145f4414;position:relative}.listen-cover img{width:100%;height:100%;object-fit:contain;border-radius:9px}.listen-cover.is-playing:after{content:'';position:absolute;bottom:-8px;width:42px;height:4px;background:var(--accent);border-radius:9px;animation:listen-pulse 1.8s ease-in-out infinite}@keyframes listen-pulse{50%{opacity:.35;transform:scaleX(.6)}}@media(prefers-reduced-motion:reduce){.listen-cover.is-playing:after{animation:none}}
.listen-heading{text-align:center;min-width:0}.listen-heading>span{display:inline-block;padding:3px 10px;border-radius:8px;background:var(--accent-light);color:var(--accent-strong);font-size:12px;margin:0 0 8px}.listen-heading h2{font-size:23px;line-height:1.4;overflow-wrap:anywhere;white-space:normal;margin:0 0 7px}.listen-heading p{font-size:13px;min-height:23px}.listen-progress{margin:23px 3px 12px}.listen-progress input{width:100%;padding:0;height:28px;accent-color:var(--accent)}.listen-progress>div{display:flex;justify-content:space-between;color:var(--muted);font-size:12px;font-variant-numeric:tabular-nums}.listen-transport{display:grid;grid-template-columns:minmax(55px,1fr) 44px 70px 44px minmax(55px,1fr);gap:8px;align-items:center;margin:15px 0 25px}.listen-transport button{background:none;padding:6px;color:var(--accent-strong);display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:0}.listen-transport svg{width:28px;height:28px}.listen-transport .listen-main{width:68px;height:68px;border-radius:50%;background:var(--accent);color:white;box-shadow:0 7px 18px #157d6b22}.listen-main svg{width:31px;height:31px}.listen-side small{font-size:10px;white-space:nowrap;margin-top:3px}.listen-side>span{font-size:27px;line-height:28px}.listen-tools{display:flex;justify-content:center;gap:14px}.listen-tools button{font-size:13px;min-width:100px;background:white;border:1px solid #dfe8df}.listen-footnote{text-align:center;font-size:11px;color:var(--muted);margin-top:24px}.listen-queue-row{display:flex;align-items:center;gap:8px;padding:8px 0;border-bottom:1px solid #edf1eb;min-width:0}.listen-queue-row.current{background:var(--accent-light);border-radius:10px}.queue-select{display:flex;align-items:center;gap:12px;background:none;text-align:left;min-width:0;flex:1;padding:8px}.queue-select img{width:45px;height:58px;object-fit:contain;border-radius:5px}.queue-select span{min-width:0;flex:1}.queue-select strong,.listen-choice strong{display:block;white-space:normal;overflow-wrap:anywhere;font-size:14px}.queue-select small,.listen-choice small{display:block;font-size:11px;color:var(--muted);margin-top:4px}.queue-remove{font-size:12px;flex-shrink:0;padding:8px}.listen-search{width:100%;border:1px solid #d9e5da;border-radius:12px;padding:13px;background:#fff}.listen-choose-filters{display:flex;gap:10px;margin-top:12px}.listen-choose-filters select{flex:1;min-width:0;border:1px solid #d9e5da;border-radius:10px;background:white;padding:10px;color:inherit;font:inherit}.listen-choices{max-height:40vh;overflow:auto}.listen-choice{display:flex;align-items:center;gap:12px;padding:12px 2px;border-bottom:1px solid #edf1eb}.listen-choice input{width:19px;height:19px;flex-shrink:0}.listen-choice span{min-width:0}#listen-choice-count{font-size:12px;margin:12px 0}
#listen-mini{position:fixed;left:12px;right:12px;bottom:calc(83px + env(safe-area-inset-bottom));max-width:830px;margin:auto;z-index:7;background:#fffdf8f5;border:1px solid #dce8df;border-radius:17px;box-shadow:0 4px 20px #1b5e431a;display:flex;align-items:center;padding:7px;gap:3px}#listen-mini[hidden]{display:none}#listen-mini button{background:none;padding:7px}.mini-info{display:flex;align-items:center;gap:10px;flex:1;min-width:0;text-align:left}.mini-info img{width:38px;height:43px;object-fit:contain;border-radius:5px}.mini-info span{min-width:0;flex:1}.mini-info strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13px}.mini-info small{font-size:10px;color:var(--muted)}#mini-toggle svg,#mini-list svg{width:27px;height:27px;color:var(--accent-strong)}body.has-mini #home{padding-bottom:calc(175px + env(safe-area-inset-bottom))}body.has-mini #download-progress{bottom:calc(158px + env(safe-area-inset-bottom))}
@media(max-height:700px){.listen-cover{width:min(59vw,235px);margin-bottom:17px}.listen-progress{margin-top:14px}.listen-transport{margin-bottom:18px}.listen-heading h2{font-size:21px}}

.account-art{border-radius:50%;object-fit:contain}
/* Listening fits the visible screen; queue/search dialogs keep their own scrolling. */
body.listen-page{height:100vh;height:100dvh;overflow:hidden}
body.listen-page #home{height:100vh;height:100dvh;max-width:880px;display:flex;flex-direction:column;padding:calc(env(safe-area-inset-top) + 12px) 20px calc(90px + env(safe-area-inset-bottom));overflow:hidden}
body.listen-page #home>header{display:none}
body.listen-page #screen{flex:1;min-height:0;overflow:hidden}
body.listen-page .listen-player{width:100%;height:100%;min-height:0;max-width:540px;margin:0 auto;padding:0;display:grid;grid-template-rows:auto minmax(0,1fr) auto auto auto auto auto;gap:clamp(4px,1dvh,10px)}
body.listen-page .listen-top{margin:0;min-height:32px}
body.listen-page .listen-top h2{font-size:21px}
body.listen-page .listen-top button{padding:8px 12px;font-size:12px}
body.listen-page .listen-cover{height:100%;width:auto;aspect-ratio:1;min-height:0;min-width:0;max-height:min(70vw,300px);max-width:100%;margin:0;justify-self:center;align-self:center;padding:clamp(5px,1.4dvh,12px);border-radius:18px;box-shadow:0 8px 22px #145f4412}
body.listen-page .listen-cover img{min-height:0;min-width:0}
body.listen-page .listen-cover.is-playing:after{bottom:-5px;height:3px}
body.listen-page .listen-heading{min-height:0}
body.listen-page .listen-heading>span{padding:2px 8px;margin:0 0 3px;font-size:11px;line-height:15px}
body.listen-page .listen-heading h2{font-size:clamp(17px,2.8dvh,22px);line-height:1.25;margin:0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;overflow-wrap:anywhere}
body.listen-page .listen-heading p{font-size:11px;line-height:17px;min-height:17px;margin-top:3px}
body.listen-page .listen-progress{margin:0 3px}
body.listen-page .listen-progress input{display:block;height:24px;margin:0;width:100%}
body.listen-page .listen-progress>div{font-size:11px;line-height:16px}
body.listen-page .listen-transport{margin:0;gap:6px;grid-template-columns:minmax(48px,1fr) 40px clamp(48px,8dvh,64px) 40px minmax(48px,1fr);height:clamp(48px,8dvh,64px)}
body.listen-page .listen-transport .listen-main{width:clamp(48px,8dvh,64px);height:clamp(48px,8dvh,64px)}
body.listen-page .listen-transport svg{width:25px;height:25px}
body.listen-page .listen-side>span{font-size:24px;line-height:25px}
body.listen-page .listen-tools{gap:12px}
body.listen-page .listen-tools button{padding:8px 12px;min-height:34px;font-size:12px}
body.listen-page .listen-footnote{margin:0;font-size:10px;line-height:14px}
body.listen-page #download-progress{left:auto;right:20px;top:calc(env(safe-area-inset-top) + 58px);bottom:auto;max-width:180px;padding:7px 10px;font-size:11px;pointer-events:none}
@media(max-height:480px) and (orientation:landscape){
 body.listen-page #home{padding-top:calc(env(safe-area-inset-top) + 6px);padding-bottom:calc(76px + env(safe-area-inset-bottom))}
 body.listen-page nav{padding-top:4px;padding-bottom:calc(5px + env(safe-area-inset-bottom))}
 body.listen-page nav b{font-size:19px;margin-bottom:2px}
 body.listen-page .listen-player{max-width:730px;grid-template-columns:minmax(80px,.8fr) minmax(0,1.2fr);grid-template-rows:auto auto minmax(0,1fr) auto auto;gap:4px 20px}
 body.listen-page .listen-top{grid-column:1/3;grid-row:1;min-height:28px}
 body.listen-page .listen-top h2{font-size:18px}
 body.listen-page .listen-top button{padding:5px 10px}
 body.listen-page .listen-cover{grid-column:1;grid-row:2/6;max-height:100%;max-width:100%}
 body.listen-page .listen-heading{grid-column:2;grid-row:2}
 body.listen-page .listen-heading>span{font-size:10px;line-height:12px;padding:1px 6px}
 body.listen-page .listen-heading h2{font-size:16px;line-height:1.15}
 body.listen-page .listen-heading p{line-height:14px;min-height:14px;margin-top:2px}
 body.listen-page .listen-progress{grid-column:2;grid-row:3;align-self:end}
 body.listen-page .listen-transport{grid-column:2;grid-row:4;height:44px;grid-template-columns:minmax(45px,1fr) 34px 44px 34px minmax(45px,1fr);gap:3px}
 body.listen-page .listen-transport .listen-main{width:44px;height:44px}
 body.listen-page .listen-tools{grid-column:2;grid-row:5}
 body.listen-page .listen-tools button{padding:5px 10px;min-height:28px}
 body.listen-page .listen-footnote{display:none}
}

#notice-horn{position:relative}#notice-horn[hidden]{display:none}#notice-horn svg{width:23px;height:23px}#notice-horn.has-unread:after{content:'';position:absolute;top:6px;right:5px;width:7px;height:7px;border-radius:50%;background:#ed5353;border:2px solid white}.mine-page header{display:flex;gap:3px;align-items:center}#clear-history-result{font-size:13px;line-height:1.7;margin-top:14px;overflow-wrap:anywhere}

/* Book task toolbar: icon-only, separate touch targets, mint completed states. */
.book .book-open{display:block;width:100%;min-width:0;padding:0;margin:0;border:0;background:transparent;color:inherit;text-align:left;border-radius:10px;box-shadow:none}
.book-task-tools{display:flex;align-items:center;gap:12px;margin-top:auto;padding:9px 3px 3px;border-top:1px solid rgba(100,149,134,.12)}
.book-task-icon{position:relative;display:flex;align-items:center;justify-content:center;flex:0 0 36px;width:36px;height:36px;padding:7px;border:1px solid #e1ebe7;border-radius:11px;background:#f3f7f5;color:#92a59d;box-shadow:none}
.book-task-icon>svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.book-task-icon.is-complete{background:#e3f5ed;border-color:#b9e5d3;color:#209a72}
.book-task-icon .task-check{position:absolute;right:-4px;top:-4px;width:14px;height:14px;border:2px solid white;border-radius:50%;background:#39b286;color:white;display:flex;align-items:center;justify-content:center}
.book-task-icon .task-check svg{width:10px;height:10px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.book-task-icon:focus-visible,.book-open:focus-visible{outline:2px solid #32af87;outline-offset:2px}
.finish-emblem{display:flex;align-items:center;justify-content:center;width:54px;height:54px;background:#e0f5eb;color:#259c74;border-radius:50%;font-size:29px;margin:0 auto 15px}
.finish-buttons{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:22px}
.finish-buttons button{min-height:45px;border-radius:13px}.finish-buttons .primary{grid-column:1/-1}
.practice-question{margin:15px 0;padding:15px;border:1px solid #dcebe5;border-radius:15px;background:#f8fcfa;text-align:left}
.practice-question h3{font-size:16px;line-height:1.6;margin:0 0 12px;overflow-wrap:anywhere}
.practice-choice{display:flex;align-items:flex-start;gap:10px;padding:11px 0;border-top:1px solid #e2ece7;line-height:1.6}
.practice-choice input{flex:0 0 auto;width:18px;height:18px;margin:4px 0;accent-color:#219e76}
.practice-question textarea{width:100%;min-height:90px;padding:10px;border:1px solid #cbddd4;border-radius:10px;font:inherit;box-sizing:border-box}
.practice-feedback{font-size:13px;line-height:1.6;color:#a66a2b}.practice-feedback.correct{color:#23986c}
.practice-submit{width:100%;min-height:46px}#record-player{width:100%;margin-top:16px}

/* Keep choice letters beside their text; override global label spacing. */
#practice-body .practice-choice{display:grid;grid-template-columns:18px minmax(0,1fr);justify-content:start;align-items:start;column-gap:9px;row-gap:0;text-align:left;padding:12px 10px;margin:8px 0;border:1px solid #e0eae5;border-radius:11px;background:white;width:100%;box-sizing:border-box}
#practice-body .practice-choice input{display:block;position:static;width:18px;min-width:18px;max-width:18px;height:18px;min-height:18px;padding:0;margin:4px 0 0;flex:none}
#practice-body .practice-choice span{display:block;position:static;width:auto;min-width:0;max-width:none;margin:0;padding:0;text-align:left;white-space:normal;overflow-wrap:anywhere;word-spacing:normal;letter-spacing:normal;line-height:1.65;justify-self:stretch}
#practice-body .practice-choice:has(input:checked){background:#edf8f2;border-color:#8bcdb2}
.finish-buttons .finish-return{grid-column:1/-1;display:flex;align-items:center;justify-content:center;width:100%;text-align:center}

/* Reader surround and bottom safe-area stay white; page geometry is unchanged. */
#reader,#reader.warm,#reader.gray{background:#fff}

/* QBM_CLEAR_QUEUE_STYLE */
.listen-queue-head{align-items:center;flex-wrap:wrap;gap:10px}
.listen-queue-head h2{flex:1;min-width:140px;margin:0;font-size:18px}
.queue-tools{display:flex;gap:6px;margin-left:auto;flex:none}
.listen-queue-head .queue-tools button{padding:8px 10px;font-size:12px;white-space:nowrap}
.queue-tools #queue-clear{background:#fdf0eb;color:#a24f39}

#account-gate{position:fixed;inset:0;z-index:200;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;background:#fffefa;color:#102643;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",sans-serif;padding:env(safe-area-inset-top) 0 env(safe-area-inset-bottom);isolation:isolate;-webkit-text-size-adjust:100%}#account-gate[hidden]{display:none!important}#account-gate *{box-sizing:border-box}#account-gate:after{content:"";position:fixed;z-index:-1;pointer-events:none;bottom:-75px;left:-10%;width:120%;height:150px;border-radius:45% 60% 0 0;background:linear-gradient(115deg,#e1f2e9,#eef9f8 55%,#e7f3d9)}.account-shell{width:100%;max-width:460px;margin:0 auto;padding:0 24px 18px;min-height:100%;display:flex;flex-direction:column}.account-brand{position:relative;flex:none;height:202px;margin:0 -24px 8px;display:block;border:0;overflow:hidden;padding:43px 24px 0}.account-brand-copy{position:relative;z-index:1;pointer-events:none}.account-wordmark{display:inline-block;position:relative;font-size:38px;font-weight:900;line-height:1.2;letter-spacing:2px;color:#102643}.account-wordmark i{position:absolute;right:-17px;top:-4px;width:6px;height:14px;background:#f6c75f;border-radius:4px;transform:rotate(30deg)}.account-wordmark i:after{content:"";position:absolute;left:12px;top:8px;width:6px;height:11px;border-radius:4px;background:#f6c75f;transform:rotate(32deg)}.account-brand span{display:block;font-size:13px;letter-spacing:.5px;margin-top:11px;color:#435a73}.account-art{position:absolute;width:300px;height:140px;right:-29px;bottom:0;object-fit:contain}.account-card{background:transparent;border:0;box-shadow:none;padding:0;margin:0;flex:none;width:100%;min-width:0}.account-card h1{font-size:29px;font-weight:800;line-height:1.3;letter-spacing:.5px;color:#102643;margin:15px 0 28px}.account-card form{margin:0}.account-card label{display:block;border:0;padding:0;margin:0 0 21px;font-size:13px;font-weight:600;line-height:1.4;color:#203650}.account-field{display:flex;align-items:center;min-width:0;width:100%;height:52px;border:1px solid #dbe3e8;border-radius:13px;background:#fff;gap:10px;padding:0 12px;margin-top:9px;transition:border-color .15s,box-shadow .15s}.account-field:focus-within{border-color:#20a6b2;box-shadow:0 0 0 3px #18a9b312}.field-icon{display:flex;flex:0 0 20px;color:#344c67;align-items:center;justify-content:center}.account-field input{width:0;min-width:0;flex:1;height:100%;background:transparent;border:0;border-radius:0;padding:0;font:inherit;font-weight:400;font-size:16px;line-height:normal;color:#142b46;outline:none;box-shadow:none;touch-action:auto}.account-field input:focus{outline:0;box-shadow:none}.account-field input::placeholder{font-size:14px;color:#94a1b4;letter-spacing:0}.account-card button{border:0;cursor:pointer;font-family:inherit;touch-action:manipulation}.account-eye{display:flex;align-items:center;justify-content:center;padding:0;width:32px;height:42px;flex:0 0 32px;background:transparent;color:#8290a4}.account-eye[aria-pressed=true]{color:#11a1ae}.account-forgot{display:flex;justify-content:flex-end;margin:-9px 0 26px}.account-forgot button,.account-links button{background:transparent;color:#0b9fab;font-size:14px;padding:8px 0;font-weight:600}.account-primary{display:block;width:100%;height:52px;border-radius:17px;background:linear-gradient(110deg,#21adb9,#11a3b3);box-shadow:0 8px 18px #16a8b322;color:white;font-weight:700;font-size:18px;letter-spacing:1px;margin:12px 0 0;padding:0 12px}.account-links{display:flex;align-items:center;justify-content:center;gap:7px;flex-wrap:wrap;margin:21px 0 0;font-size:13px}.account-links span{color:#44546a}.account-hint{font-size:11px;color:#a0aabb;line-height:1.65;text-align:center;margin:8px 0 0}.account-connection{margin:12px 0 0;text-align:center}.account-connection button{background:transparent;color:#a3aebd;border:0;font-size:10px;padding:8px 12px}.account-connection p{font-size:11px;color:#8d7158;line-height:1.6;overflow-wrap:anywhere;margin:0}.account-footer{font-size:10px;color:#b2bbc6;text-align:center;margin:4px 0 0}.account-card #account-message{display:none;color:#9d533f;background:#fff0e8;border:1px solid #f5dfd3;border-radius:10px;padding:10px 12px;margin:0 0 16px;font-size:12px;font-weight:400;line-height:1.65;overflow-wrap:anywhere}.account-card #account-message:not(:empty){display:block}.account-picture-row{gap:8px;padding-right:7px}.account-picture-row input{text-transform:uppercase;font-size:17px;letter-spacing:2px}.account-picture-row .field-icon{display:none}.account-picture-row button{flex:0 0 100px;width:100px;height:39px;padding:0;overflow:hidden;border-radius:5px;background:#f6f9fd;color:#8d9db1;font-size:11px}.account-picture-row img{display:block;width:100%;height:100%;object-fit:contain}.picture-refresh{font-size:11px;color:#13a3ae;white-space:nowrap;font-weight:500}.account-picture-note{display:block;margin-top:5px;color:#a3adbb;font-size:10px;font-weight:400}.account-code-row{gap:8px}.account-code-row input{font-size:18px;letter-spacing:1px}.account-code-row #account-send{flex:0 0 96px;width:96px;white-space:nowrap;height:36px;padding:0 2px;border-radius:8px;background:#f0f9f9;color:#0b9fab;font-size:12px;font-weight:600}.account-card button:disabled{opacity:.5;cursor:default}.account-code-row #account-send:disabled{opacity:.7}.account-who{font-size:22px;margin:18px 0}.account-device{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 0;border-bottom:1px solid #e5eeeb;font-size:13px}.account-device button{flex:none;background:#e8f6f4;color:#19958d;border-radius:9px;padding:8px 12px}.account-card #account-activation-code{width:100%;min-height:52px;padding:13px;border:1px solid #dbe3e8;border-radius:13px;background:#fff;font-size:16px}.account-avatar{width:62px;height:62px;border-radius:50%}#account-gate[data-mode=register] .account-brand,#account-gate[data-mode=reset] .account-brand{height:146px;padding-top:21px}#account-gate[data-mode=register] .account-art,#account-gate[data-mode=reset] .account-art{width:230px;height:107px;right:-39px;bottom:-2px}#account-gate[data-mode=register] .account-wordmark,#account-gate[data-mode=reset] .account-wordmark{font-size:33px}#account-gate[data-mode=register] .account-brand span,#account-gate[data-mode=reset] .account-brand span{font-size:11px}#account-gate[data-mode=register] h1,#account-gate[data-mode=reset] h1{font-size:26px;margin:8px 0 20px}#account-gate[data-mode=register] label,#account-gate[data-mode=reset] label{margin-bottom:14px}#account-gate[data-mode=register] .account-field,#account-gate[data-mode=reset] .account-field{height:48px;margin-top:6px}#account-gate[data-mode=register] .account-links,#account-gate[data-mode=reset] .account-links{margin-top:12px}#account-gate[data-mode=register] .account-connection,#account-gate[data-mode=reset] .account-connection{margin-top:4px}@media(max-width:359px){.account-shell{padding-left:18px;padding-right:18px}.account-brand{margin-left:-18px;margin-right:-18px;padding-left:18px}.account-field{gap:7px;padding-left:10px;padding-right:8px}.account-code-row .field-icon{display:none}.account-code-row input::placeholder{font-size:13px}.account-picture-row button{width:88px;flex-basis:88px}.picture-refresh{font-size:10px}.account-brand span{font-size:11px}.account-art{right:-55px}}@media(max-height:720px){#account-gate[data-mode=register] .account-brand,#account-gate[data-mode=reset] .account-brand{height:113px;padding-top:15px}#account-gate[data-mode=register] .account-art,#account-gate[data-mode=reset] .account-art{height:90px;width:193px}#account-gate[data-mode=register] h1,#account-gate[data-mode=reset] h1{margin:6px 0 14px}#account-gate[data-mode=register] label,#account-gate[data-mode=reset] label{margin-bottom:11px}.account-brand{height:160px;padding-top:22px}}@media(orientation:landscape) and (max-height:520px){.account-brand{height:110px;padding-top:14px}.account-card h1{margin-top:4px;margin-bottom:18px}.account-shell{max-width:470px}.account-art{height:100px;right:-15px}.account-wordmark{font-size:29px}}

.account-picture-row button.picture-refresh{flex:0 0 35px;width:35px;height:38px;overflow:visible;background:transparent;color:#13a3ae;font-size:11px;white-space:nowrap;padding:0;border-radius:0}

/* 0.10.9: registration starts directly with its heading. */
#account-gate[data-mode=register] .account-shell{padding-top:24px}
#account-gate[data-mode=register] .account-card h1{margin:0 0 25px;font-size:28px;line-height:1.35}
#account-gate[data-mode=register] .account-card label{margin-bottom:18px}
#account-gate[data-mode=register] .account-field{height:50px;margin-top:8px}
#account-gate[data-mode=register] .account-primary{margin-top:21px}
@media(max-height:640px){#account-gate[data-mode=register] .account-shell{padding-top:18px}#account-gate[data-mode=register] .account-card h1{margin-bottom:19px}#account-gate[data-mode=register] .account-card label{margin-bottom:14px}}

/* Square logo asset: circular presentation, balanced beside the wordmark. */
#account-gate .account-brand{display:flex;align-items:center;gap:16px;height:168px;padding:24px;margin-bottom:8px}
#account-gate .account-brand-copy{flex:1;min-width:0}
#account-gate .account-brand span{line-height:1.6;letter-spacing:0;overflow-wrap:anywhere}
#account-gate .account-art{position:static;display:block;flex:0 0 88px;width:88px;height:88px;max-width:none;object-fit:cover;aspect-ratio:1;border-radius:50%;clip-path:circle(47.5% at 50% 49%);margin:0}
#account-gate[data-mode=reset] .account-brand{height:132px;padding-top:18px;padding-bottom:18px}
#account-gate[data-mode=reset] .account-art{flex-basis:76px;width:76px;height:76px}
@media(max-width:359px){#account-gate .account-brand{padding-left:18px;padding-right:18px;gap:12px}#account-gate .account-art{flex-basis:76px;width:76px;height:76px}}
@media(orientation:landscape) and (max-height:520px){#account-gate .account-brand{height:110px;padding-top:12px;padding-bottom:12px}#account-gate .account-art{flex-basis:76px;width:76px;height:76px}}

/* QBM_SPROUT_BRAND_V1: shared approved sprout artwork. */
#account-gate .account-brand{display:flex;align-items:center;gap:16px;height:168px;padding:24px;margin-bottom:8px}
#account-gate .account-brand-copy{flex:1;min-width:0}
#account-gate .account-brand span{line-height:1.6;letter-spacing:0;overflow-wrap:anywhere}
#account-gate .account-art{position:static;display:block;flex:0 0 88px;width:88px;height:88px;max-width:none;object-fit:contain;aspect-ratio:1;border-radius:22%;clip-path:none;margin:0}
#account-gate[data-mode=reset] .account-brand{height:132px;padding-top:18px;padding-bottom:18px}
#account-gate[data-mode=reset] .account-art{flex-basis:76px;width:76px;height:76px}
.brand-header{object-fit:contain;border-radius:22%}
.account-brand-image{object-fit:contain;border-radius:22%}
.profile-card .avatar{padding:0;overflow:hidden;background:#fff}
.profile-card .avatar img{display:block;width:100%;height:100%;object-fit:cover;border-radius:50%}
#app-startup{background:#fff}
#app-startup .startup-content img{object-fit:contain;border-radius:22%;box-shadow:none}
@media(max-width:359px){#account-gate .account-brand{padding-left:18px;padding-right:18px;gap:12px}#account-gate .account-art{flex-basis:76px;width:76px;height:76px}}
@media(orientation:landscape) and (max-height:520px){#account-gate .account-brand{height:110px;padding-top:12px;padding-bottom:12px}#account-gate .account-art{flex-basis:76px;width:76px;height:76px}}

/* QBM_MOBILE_POLISH_20261108 */
#listen-mini #mini-close{display:grid;place-items:center;flex:0 0 40px;width:40px;height:44px;padding:8px;color:var(--muted)}
#mini-close svg{width:22px;height:22px}
#listen-mini #mini-toggle,#listen-mini #mini-list{flex:0 0 38px;width:38px;padding:6px}
body.listen-page #home{padding-top:calc(env(safe-area-inset-top) + 20px);padding-left:16px;padding-right:16px}
body.listen-page #home>header{display:flex;flex:0 0 auto}
body.listen-page .listen-top{min-height:28px}
body.listen-page .listen-top h2{font-size:18px}
body.listen-page .listen-player>.listen-top{justify-content:flex-end}
.level-strip .level-chip.special-chip{background:linear-gradient(145deg,#fff,#f2f7ff);color:#526b8d;border-color:#e1eaf7}
.level-strip .level-chip.special-chip.selected{color:white;background:linear-gradient(140deg,var(--accent),var(--accent-strong));border-color:var(--accent);box-shadow:0 3px 9px color-mix(in srgb,var(--accent) 25%,transparent)}
.all-level-grid .special-choice{background:white;color:inherit}
.all-level-grid .special-choice.selected{background:var(--accent);color:white;border-color:var(--accent)}
.settings-brand,.download-summary{text-align:center;font-size:12px;margin-top:15px}
#account-gate[data-mode=devices] .account-brand,#account-gate[data-mode=activate] .account-brand{display:none}
#account-gate[data-mode=devices] .account-shell,#account-gate[data-mode=activate] .account-shell{padding-top:24px}
#account-gate[data-mode=devices] .account-brand-image,#account-gate[data-mode=activate] .account-brand-image{display:block;width:80px;height:80px;margin:0 auto 16px;object-fit:contain}
#account-gate[data-mode=devices] .account-who,#account-gate[data-mode=activate] .account-who{text-align:center;margin:12px 0}
#account-gate .account-panel-back{display:flex;align-items:center;gap:5px;align-self:flex-start;background:transparent;color:#203650;border:0;padding:8px 0;font:inherit;font-size:14px;margin-bottom:4px}
#account-gate .account-panel-back svg{width:20px;height:20px}
@media(max-height:480px) and (orientation:landscape){body.listen-page #home{padding-top:calc(env(safe-area-inset-top) + 6px)}body.listen-page #home>header{margin-bottom:6px}body.listen-page #home>header h1{font-size:22px;margin-top:0}body.listen-page #home>header h1:after{display:none}body.listen-page #home>header .brand-header{width:28px;height:28px}body.listen-page #home>header .icon{width:36px;height:36px}}
