:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#1f201d;background:#f3efe5;font-synthesis:none}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-width:320px;min-height:100vh;background:#f3efe5;color:#20211e}button,input,textarea,select{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.55}[hidden]{display:none!important}header{height:72px;position:sticky;top:0;z-index:40;display:flex;align-items:center;justify-content:space-between;padding:0 4.5vw;background:rgba(248,245,237,.94);border-bottom:1px solid #ddd6c7;backdrop-filter:blur(12px)}.brandButton{border:0;background:none;padding:0}.brand{font-size:22px;font-weight:800}.brand em{font-family:Georgia,serif;font-style:normal;font-weight:400}.actions{display:flex;align-items:center;gap:8px}.actions select,.ghost{border:1px solid #d4ccbd;background:transparent;border-radius:11px;padding:10px 13px;color:inherit}.ribbon{position:sticky;top:72px;z-index:35;height:58px;display:flex;align-items:center;justify-content:center;padding:0 20px;background:#ebe4d4;border-bottom:1px solid #d8d0c1;font-family:Georgia,serif;font-size:20px;white-space:pre-wrap;overflow:hidden}.ribbon .active{background:#20211e;color:#fff;padding:5px 9px;border-radius:8px;margin:0 3px}.panel{width:min(1180px,92vw);margin:38px auto}.hero{display:grid;grid-template-columns:1fr 270px;gap:36px;align-items:end;padding:30px 0 50px}.kicker{font-size:12px;letter-spacing:.13em;font-weight:800;color:#777063}.hero h1,.discoverHero h1{font-family:Georgia,serif;font-size:clamp(48px,7vw,88px);line-height:.94;font-weight:400;margin:12px 0 24px;letter-spacing:-.035em}.hero p,.discoverHero p{font-size:19px;line-height:1.65;max-width:720px;color:#5c5b56}.heroActions{display:flex;gap:10px;margin-top:26px}.primary{border:0;border-radius:11px;padding:13px 18px;background:#20211e;color:#fff;font-weight:700}.plan{border:1px solid #d7cfbf;border-radius:20px;padding:28px;background:rgba(255,255,255,.34);display:flex;flex-direction:column;gap:8px}.plan b{font-size:21px}.plan span{font-family:Georgia,serif;font-size:36px}.plan small{color:#6c675e}.discoverIntro,.sectionhead{display:flex;align-items:end;justify-content:space-between;gap:20px;margin:28px 0 18px}.discoverIntro h2,.sectionhead h2,.addbox h2{font-family:Georgia,serif;font-size:36px;font-weight:400;margin:5px 0}.discoverIntro p{margin:0;color:#666}.bookgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.bookcard{min-height:245px;border:1px solid #d8d0c1;border-radius:18px;padding:20px;background:#faf7ef;display:flex;flex-direction:column;align-items:flex-start;text-align:left;color:inherit;transition:.18s}.bookcard:hover{transform:translateY(-3px);box-shadow:0 12px 30px rgba(40,35,25,.08)}.bookcard .type{font-size:11px;letter-spacing:.1em;font-weight:800;color:#7c7467}.bookcard h3{font-family:Georgia,serif;font-size:26px;line-height:1.08;font-weight:400;margin:20px 0 8px}.bookcard p{margin:0;color:#69655d;font-size:14px}.bookcard .meta{margin-top:auto;padding-top:18px;font-size:12px;color:#80796d}.bookcard .read{margin-top:10px;font-weight:800}.addbox{margin:60px 0 44px;border:1px solid #d8d0c1;border-radius:20px;padding:28px;background:#faf7ef}.tabs{display:flex;gap:8px;margin:16px 0}.tab{border:1px solid #d5cebf;border-radius:10px;background:transparent;padding:11px 16px}.tab.active{background:#20211e;color:white;border-color:#20211e}.addbox input,.addbox textarea,.discoverTools input{width:100%;border:1px solid #d7cfbf;border-radius:12px;background:#fffdf8;padding:14px;color:inherit}.addbox textarea{height:170px;resize:vertical;margin:12px 0;line-height:1.55;font-family:Georgia,serif;font-size:18px}.drop{display:grid;place-items:center;min-height:150px;border:1.5px dashed #bdb3a3;border-radius:14px;background:#fffdf8}.drop input{width:auto}.docs{display:grid;gap:9px}.doc{display:flex;justify-content:space-between;align-items:center;border:1px solid #ddd5c6;border-radius:13px;padding:16px 18px;background:#faf7ef;cursor:pointer}.doc small,.wordrow small{display:block;color:#777168;margin-top:4px}.empty{border:1px dashed #cfc6b6;border-radius:13px;padding:24px;color:#777168}.discoverHero{padding:18px 0 25px}.discoverHero h1{font-size:clamp(48px,6vw,78px);max-width:900px}.discoverTools{position:sticky;top:130px;z-index:20;background:#f3efe5;padding:12px 0 18px}.discoverTools input{font-size:17px}.chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.chip{border:1px solid #d5cebf;background:transparent;border-radius:999px;padding:9px 14px}.chip.active{background:#20211e;color:#fff}.catalog{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.sourceNote{color:#777168;font-size:13px;line-height:1.5;margin-top:22px}.readerTop{position:sticky;top:130px;z-index:25;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:15px;background:#f3efe5;padding:12px 0;border-bottom:1px solid #ddd5c6}.readerTop>div:last-child{text-align:right}.readerIdentity{text-align:center}.readerIdentity span{margin-left:12px;color:#777168}#content{width:min(820px,92vw);margin:36px auto 130px;font-family:Georgia,"Times New Roman",serif;font-size:27px;line-height:1.9;white-space:pre-wrap}.word{border-radius:5px;cursor:pointer;padding:1px 0}.word:hover{background:#e5ddcc}.word.active{background:#20211e;color:white;padding:2px 3px}.controls{position:fixed;z-index:45;bottom:18px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:8px;padding:10px;border:1px solid #d4ccbd;border-radius:16px;background:rgba(250,247,239,.96);box-shadow:0 10px 35px rgba(0,0,0,.12)}.controls button{border:1px solid #d5cebf;border-radius:9px;background:#fffdf8;padding:10px 14px}.controls label{display:flex;align-items:center;gap:9px;padding:0 8px}.compact{margin-top:55px}.words{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}.wordrow{display:flex;justify-content:space-between;border:1px solid #ddd5c6;border-radius:12px;padding:14px 16px;background:#faf7ef}.wordrow button{border:0;background:transparent}.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.plans>div{border:1px solid #d8d0c1;border-radius:18px;padding:25px;background:#faf7ef;display:flex;flex-direction:column;gap:9px}.plans .featured{border:2px solid #20211e}.plans strong{font-family:Georgia,serif;font-size:45px;font-weight:400}.plans button{margin-top:12px;border:1px solid #ccc3b3;border-radius:9px;padding:10px}.popup{position:fixed;z-index:80;right:28px;bottom:28px;width:min(390px,calc(100vw - 32px));border:1px solid #d5cebf;border-radius:20px;background:#fffdf8;padding:24px;box-shadow:0 22px 60px rgba(0,0,0,.2)}.popup .x{position:absolute;right:15px;top:12px;border:0;background:none;font-size:24px}.popup h3{font-family:Georgia,serif;font-size:35px;margin:9px 0}.translation{font-size:23px;font-weight:700;margin:12px 0}.popup small{display:block;line-height:1.5;color:#69655d}.popActions{display:flex;gap:8px;margin-top:18px}.popActions button{border:1px solid #d4ccbd;border-radius:9px;background:transparent;padding:9px 12px}footer{display:flex;justify-content:space-between;width:min(1180px,92vw);margin:60px auto 25px;border-top:1px solid #d8d0c1;padding-top:18px;color:#777168;font-size:12px}.loadingOverlay{position:fixed;inset:0;z-index:100;display:grid;place-items:center;background:rgba(243,239,229,.88);backdrop-filter:blur(5px)}.loadingBox{background:#fffdf8;border:1px solid #d5cebf;border-radius:18px;padding:28px 35px;text-align:center}.dark{background:#1b1c1a;color:#ece8de}.dark header,.dark .ribbon,.dark .discoverTools,.dark .readerTop{background:#20211e;color:#ece8de;border-color:#3c3d39}.dark .panel,.dark main{color:#ece8de}.dark .bookcard,.dark .addbox,.dark .doc,.dark .wordrow,.dark .plans>div,.dark .popup,.dark .controls{background:#262724;border-color:#44453f}.dark input,.dark textarea,.dark .drop,.dark .controls button{background:#1f201e;color:#eee;border-color:#454640}.dark .hero p,.dark .discoverHero p,.dark .bookcard p,.dark .doc small,.dark .wordrow small{color:#b9b4aa}.dark .word:hover{background:#393a36}.dark .word.active,.dark .ribbon .active{background:#eee9dd;color:#1b1c1a}
@media(max-width:850px){header{height:auto;min-height:68px;padding:10px 4vw;align-items:flex-start}.actions{flex-wrap:wrap;justify-content:flex-end}.actions #myLibraryBtn{display:none}.ribbon{top:68px}.hero{grid-template-columns:1fr}.plan{max-width:320px}.bookgrid,.catalog{grid-template-columns:repeat(2,1fr)}.readerTop{top:126px;grid-template-columns:auto 1fr}.readerTop>div:last-child{grid-column:1/-1;display:flex;justify-content:center}.words,.plans{grid-template-columns:1fr}.discoverTools{top:126px}}
@media(max-width:560px){.brand{font-size:18px}.actions #discoverBtn{display:none}.actions select{max-width:155px}.hero h1{font-size:48px}.bookgrid,.catalog{grid-template-columns:1fr}.heroActions{flex-direction:column}.discoverIntro{align-items:flex-start}.discoverIntro button{display:none}#content{font-size:23px;line-height:1.8}.controls{width:calc(100vw - 20px);justify-content:center}.controls label{max-width:145px}.readerTop{top:126px}.popup{right:16px;bottom:16px}.panel{width:94vw}}

.sourceTabs{display:flex;gap:9px;flex-wrap:wrap;margin:0 0 14px}
.sourceTab{border:1px solid #d5cebf;background:#faf7ef;border-radius:12px;padding:12px 15px;font-weight:700;color:inherit}
.sourceTab.active{background:#20211e;color:#fff;border-color:#20211e}
.liveStatus{margin:4px 0 16px;padding:11px 14px;border-radius:11px;background:#ebe4d4;color:#625d54;font-size:13px}
.inlineAction{border:0;background:transparent;padding:0;color:inherit;font-weight:800;text-align:left}
.snippet{display:block;margin-top:12px;line-height:1.45;color:#777168}
.dark .sourceTab{background:#262724;border-color:#44453f}.dark .sourceTab.active{background:#eee9dd;color:#1b1c1a}.dark .liveStatus{background:#292a27;color:#c9c3b8}

/* v0.6.1 compact translation UX */
.popup{position:fixed!important;z-index:80;width:280px!important;max-width:calc(100vw - 24px)!important;border-radius:14px!important;padding:13px 14px 12px!important;box-shadow:0 12px 32px rgba(0,0,0,.16)!important}
.popup .kicker{display:none}.popup h3{font-family:inherit!important;font-size:16px!important;line-height:1.15;margin:0 28px 4px 0!important}.translation{font-size:17px!important;line-height:1.25;margin:2px 0 7px!important}.popup small{display:none!important}.popup .x{right:9px!important;top:6px!important;font-size:18px!important}.popActions{margin-top:6px!important;gap:6px!important}.popActions button{padding:6px 9px!important;font-size:13px!important}.ribbonTranslation{font-family:Inter,ui-sans-serif,system-ui,sans-serif;font-weight:800;margin-left:8px;color:#2f5f4a;white-space:nowrap}.dark .ribbonTranslation{color:#c9e4d5}
@media(max-width:560px){.popup{width:250px!important;padding:11px 12px!important}.ribbon{font-size:17px}.ribbonTranslation{font-size:15px}}

/* v0.7 Learning Discover */
header nav button, header nav select, .topbar button, .topbar select{font-weight:750}
#discoverBtn,#myLibraryBtn{letter-spacing:.01em}
#lang{font-weight:800;background:#f1eadb;border-color:#bdb39f}
.sourceTab{font-weight:800}
.popup{cursor:grab!important;user-select:none;touch-action:none;width:250px!important;padding-top:27px!important}
.popup.dragging{cursor:grabbing!important;box-shadow:0 18px 46px rgba(0,0,0,.25)!important}
.dragHint{position:absolute;left:12px;top:7px;font:800 10px/1 Inter,system-ui,sans-serif;letter-spacing:.08em;color:#918a7e}
.retryTranslation{border:0;background:transparent;padding:0;font-weight:800;color:#806c45;cursor:pointer}
#translation{user-select:text}
@media(max-width:700px){.popup{width:220px!important;right:8px!important}.dragHint{display:inline}}

/* v0.8.1 CLEAN FIX */
header nav button{font-weight:800!important}
header nav #discoverBtn,header nav #listenBtn,header nav #myLibraryBtn{border:1px solid var(--line)!important;border-radius:14px!important;padding:13px 18px!important;background:transparent!important;color:var(--ink)!important}
header nav .mainActive{background:var(--ink)!important;color:var(--paper)!important;border-color:var(--ink)!important}
.chip{display:inline-flex!important;align-items:center!important;border:1px solid var(--line)!important;border-radius:999px!important;padding:10px 16px!important;background:transparent!important;color:var(--ink)!important;font-weight:700!important}
.chip.active,.chip[aria-pressed="true"]{background:var(--ink)!important;color:var(--paper)!important;border-color:var(--ink)!important}
.dark header nav #discoverBtn,.dark header nav #listenBtn,.dark header nav #myLibraryBtn{color:#f4eee2!important;border-color:#817b70!important}
.dark header nav .mainActive{background:#f2eadc!important;color:#171814!important}
.dark .chip{color:#f2ecdf!important;border-color:#817b70!important}.dark .chip.active,.dark .chip[aria-pressed="true"]{background:#f2ecdf!important;color:#181916!important}
.dark input,.dark select,.dark textarea{background:#22231f!important;color:#f5efe3!important;border-color:#777267!important}.dark input::placeholder,.dark textarea::placeholder{color:#aaa59a!important}
.dark .doc,.dark .bookCard,.dark .card,.dark .listenCard{color:#f1eadc!important}.dark .doc small,.dark .bookCard p,.dark .listenCard p{color:#c9c2b6!important}.dark #lang{background:#292a25!important;color:#f5efe3!important}
.listenSection{max-width:1200px;margin:auto;padding:52px 28px 90px}.listenHero{text-align:center;margin-bottom:30px}.listenHero h2{font-size:44px;margin:8px 0}.listenHero p{font-size:20px}.listenGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.listenCard{border:1px solid var(--line);border-radius:20px;padding:24px;background:var(--card)}.listenCard span{font-size:12px;font-weight:900;letter-spacing:.06em}.listenCard h3{font-size:25px;margin:10px 0}.listenCard a{font-weight:800;color:inherit}.listenNote{opacity:.7;margin-top:20px}@media(max-width:800px){.listenGrid{grid-template-columns:1fr}}

.playerBar{display:flex;align-items:center;justify-content:space-between;gap:20px;border:1px solid var(--line);border-radius:18px;padding:18px 20px;margin:0 auto 24px;max-width:900px}.playerBar div{display:flex;flex-direction:column;gap:4px}.playerBar small{opacity:.65}.playerBar audio{width:min(420px,48vw)}
.livePlay{border:1px solid var(--ink);border-radius:999px;padding:11px 18px;background:var(--ink);color:var(--paper);font-weight:800;cursor:pointer}.livePlay.playing{background:transparent;color:var(--ink)}
.dark .playerBar{border-color:#716d64}.dark .livePlay{background:#f2eadc;color:#171814;border-color:#f2eadc}.dark .livePlay.playing{background:transparent;color:#f2eadc}
@media(max-width:700px){.playerBar{align-items:stretch;flex-direction:column}.playerBar audio{width:100%}}

.buildMarker{position:fixed;left:12px;bottom:12px;z-index:99999;background:#171814;color:#fff;border-radius:999px;padding:7px 11px;font:700 11px/1.2 system-ui,sans-serif;letter-spacing:.04em;box-shadow:0 2px 12px rgba(0,0,0,.18)}
.dark .buildMarker{background:#f2eadc;color:#171814}

.speechRate{display:inline-flex;align-items:center;gap:5px;font-weight:700;font-size:13px}.speechRate select{padding:8px;border-radius:10px;border:1px solid var(--line);background:var(--paper);color:var(--ink)}

.levelControl{display:inline-flex;gap:10px;align-items:center;margin:14px 10px 5px 0;font-weight:700}.levelControl select{padding:10px;border:1px solid #d6cdbd;border-radius:10px;background:var(--paper,#fff);color:var(--ink,#111)}.levelHint{display:block;color:#756d62;margin-bottom:12px}.contextTools{display:flex;gap:8px;align-items:center;flex-wrap:wrap;max-width:1050px;margin:15px auto}.contextTools button{padding:10px}#readerLevelNote{font-size:12px;color:#746b5e}#newsCities{margin:12px 0}

.contextTools{display:flex!important;flex-wrap:wrap;gap:10px;align-items:center;padding:16px!important;margin:10px auto 22px!important;border:1px solid #d8c8aa;border-radius:14px;background:#f3ebdb}.contextTitle{width:100%;font:700 13px/1.5 system-ui;letter-spacing:.03em}.contextTools button{background:#fff!important;border:1px solid #bba989!important;padding:12px 18px!important;font-weight:700!important;color:#25231f!important}

/* v1.0.2: match understated Discover navigation buttons */
.contextTools{display:flex!important;gap:8px!important;align-items:center!important;justify-content:flex-start!important;max-width:1050px!important;margin:10px auto!important;padding:0!important;background:transparent!important;border:0!important;border-radius:0!important}
.contextTools button{font:400 16px/1.3 inherit!important;font-family:inherit!important;font-weight:400!important;letter-spacing:normal!important;background:transparent!important;border:1px solid #d6cdbd!important;border-radius:14px!important;padding:10px 16px!important;box-shadow:none!important;color:var(--ink,#222)!important}
.contextTools #readerLevelNote{font-size:12px!important}

/* v1.0.3: persistent, compact context actions; never obscure central reading column */
#reader .contextTools{position:fixed!important;z-index:110;left:12px;top:54%;transform:translateY(-50%);display:flex!important;flex-direction:column!important;align-items:stretch!important;width:112px!important;max-width:112px!important;margin:0!important;padding:7px!important;background:var(--paper,#f9f6ee)!important;border:1px solid #d6cdbd!important;border-radius:15px!important;box-shadow:0 5px 20px #00000012!important}
#reader .contextTools button{font-family:system-ui,sans-serif!important;font-size:13px!important;font-weight:400!important;padding:9px 7px!important;border-radius:10px!important;background:transparent!important;white-space:nowrap!important}
#reader .contextTools #readerLevelNote{font:11px/1.2 system-ui!important;max-width:100px!important}
#reader .contextTools [hidden]{display:none!important}
@media(max-width:700px){#reader .contextTools{left:4px!important;top:auto!important;bottom:90px!important;transform:none!important;width:75px!important;max-width:75px!important;padding:4px!important;opacity:.90}#reader .contextTools button{font-size:11px!important;padding:8px 2px!important}#reader #content{padding-left:36px!important}}

/* v1.0.5 MOBILE: avoid a tall sticky header hiding Ribbon and results */
.mobileCategoryToggle{display:none}
@media(max-width:700px){
 header{position:relative!important;height:auto!important;min-height:0!important;display:flex!important;flex-wrap:wrap!important;gap:8px!important;padding:12px 14px!important;align-items:center!important}
 header .actions,header nav{max-width:100%!important;min-width:0!important;flex-wrap:wrap!important;gap:7px!important}
 header .brand{font-size:19px!important}
 header select,#lang{max-width:min(230px,75vw)!important;font-size:14px!important}
 .ribbon{position:sticky!important;top:0!important;z-index:65!important;height:auto!important;min-height:48px!important;max-height:70px!important;padding:9px 12px!important;font-size:15px!important;line-height:1.35!important;white-space:normal!important;overflow:hidden!important;text-align:center!important}
 .ribbon .active{padding:2px 5px!important}
 .ribbonTranslation{font-size:14px!important;white-space:normal!important}
 .readerTop{position:relative!important;top:auto!important;grid-template-columns:1fr!important;gap:7px!important;padding:8px 0!important}
 .readerTop>div:last-child{grid-column:auto!important}
 .readerIdentity{overflow-wrap:anywhere!important}
 .discoverTools{position:static!important;top:auto!important;padding:8px 0!important}
 .mobileCategoryToggle{display:flex!important;align-items:center;justify-content:space-between;width:100%;margin:10px 0;border:1px solid #d5cebf;border-radius:12px;background:transparent;color:inherit;padding:12px 14px;font-size:15px}
 #localChips.mobileCollapsed{display:none!important}
 #localChips{gap:6px!important;margin:8px 0!important}
 #localChips .chip{font-size:13px!important;font-weight:400!important;padding:8px 11px!important}
 #catalog,.catalog,.bookgrid{grid-template-columns:minmax(0,1fr)!important;width:100%!important;min-width:0!important;overflow:visible!important}
 #catalog .bookcard,.catalog .bookcard{min-width:0!important;width:100%!important;min-height:145px!important}
 #catalog{scroll-margin-top:66px!important}
 #reader #content{width:calc(100vw - 32px)!important;margin:18px auto 140px!important;padding-left:0!important;font-size:23px!important;overflow-wrap:anywhere!important}
 #reader .contextTools{bottom:116px!important;left:4px!important}
 .popup{bottom:160px!important;max-height:40vh!important;overflow:auto!important}
 .controls{bottom:12px!important;max-width:calc(100vw - 16px)!important}
 .buildMarker{font-size:8px!important;max-width:55vw!important;white-space:normal!important;bottom:0!important;opacity:.75!important}
}

/* v1.0.6: translation result first; phone-friendly sheet */
.popup.contextMode #popWord{font-size:12px!important;font-weight:400!important;line-height:1.35!important;display:-webkit-box!important;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;overflow-wrap:anywhere;color:#696258;margin-bottom:9px!important;}
.popup.contextMode #translation{font-size:17px!important;font-weight:600!important;line-height:1.45!important;white-space:normal;overflow-wrap:anywhere;user-select:text!important;}
.popup.contextMode .popActions #saveWord{display:none!important;}
@media(max-width:700px){
 .popup,.popup.contextMode{position:fixed!important;left:50%!important;right:auto!important;top:auto!important;bottom:104px!important;transform:translateX(-50%)!important;width:calc(100vw - 28px)!important;max-width:420px!important;max-height:min(46dvh,420px)!important;overflow-y:auto!important;overscroll-behavior:contain;touch-action:pan-y!important;padding:15px 16px!important;cursor:auto!important;z-index:140!important;background:#fffcf6!important;}
 .popup .dragHint{display:none!important;}
 .popup.contextMode #popWord{padding-right:25px!important;}
 .popup.contextMode #translation{max-height:24dvh;overflow-y:auto!important;}
 .popup .popActions{position:sticky;bottom:-15px;background:#fffcf6;padding-top:9px;}
 .popup .x{position:sticky!important;float:right!important;right:0!important;top:0!important;z-index:2!important;background:#fffcf6!important;}
}
