:root{
  --bg:#f0e2cc;
  --paper:#fff8ec;
  --paper2:#fbf0df;
  --cream:#fffdf8;
  --ink:#2e2118;
  --brown:#594636;
  --muted:#766a5d;
  --gold:#c78e42;
  --gold2:#a96d28;
  --gold3:#e7c171;
  --danger:#a8483b;
  --line:rgba(169,109,40,.18);
  --shadow:0 28px 80px rgba(70,48,25,.14);
  --shadow2:0 14px 40px rgba(70,48,25,.09);
  --radius:32px;
  --fontSize:18px;
}
body.night{
  --bg:#15100b;
  --paper:#211912;
  --paper2:#19130e;
  --cream:#261d15;
  --ink:#f3e6d3;
  --brown:#e7d6c1;
  --muted:#bea990;
  --line:rgba(231,193,113,.20);
  --shadow:0 28px 80px rgba(0,0,0,.42);
  --shadow2:0 14px 40px rgba(0,0,0,.28);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  min-height:100vh;
  background:
    radial-gradient(circle at 8% 0%,rgba(231,193,113,.30),transparent 28%),
    radial-gradient(circle at 92% 3%,rgba(199,142,66,.20),transparent 32%),
    linear-gradient(180deg,#f5eadb 0%,var(--bg) 48%,#f8efe4 100%);
  color:var(--brown);
  font-family:Inter, ui-sans-serif, system-ui, -apple-system, Segoe UI, sans-serif;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
body.night{
  background:
    radial-gradient(circle at 12% 4%,rgba(231,193,113,.13),transparent 30%),
    linear-gradient(180deg,#120d09,#1c140e 50%,#0f0b08 100%);
}
.ambient{position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(circle at 50% 100%,rgba(255,255,255,.38),transparent 34%)}
a{text-decoration:none;color:inherit}
button,input{font:inherit}
button{cursor:pointer}
img{max-width:100%;display:block}
.shell{max-width:1230px;margin:0 auto;padding:0 18px}
.shell.narrow{max-width:980px}
.mobile-only{display:none!important}

.app-topbar{
  position:sticky;top:0;z-index:90;
  min-height:72px;
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:12px 18px;
  background:rgba(255,248,236,.84);
  backdrop-filter:blur(18px);
  border-bottom:1px solid var(--line);
}
body.night .app-topbar{background:rgba(22,16,11,.84)}
.brand{display:flex;align-items:center;gap:12px}
.brand img{width:46px;height:46px;border-radius:14px;box-shadow:0 10px 30px rgba(70,48,25,.18)}
.brand small{display:block;color:var(--gold2);font-weight:900;font-size:10px;letter-spacing:.18em}
.brand b{display:block;color:var(--ink);font-weight:900}
.top-actions{display:flex;align-items:center;gap:8px}
.install-btn,.primary-btn,.ghost-btn,.danger-btn,.mini-btn{
  border:0;border-radius:999px;min-height:46px;padding:13px 18px;
  display:inline-flex;align-items:center;justify-content:center;font-weight:900;transition:.2s ease;
}
.install-btn,.primary-btn{
  color:white;background:linear-gradient(180deg,#ddb063,#b8752d);
  box-shadow:0 16px 42px rgba(169,109,40,.24),inset 0 1px 0 rgba(255,255,255,.32);
}
.primary-btn.small{min-height:42px;padding:11px 16px}
.ghost-btn,.mini-btn{
  color:var(--ink);background:rgba(255,255,255,.72);border:1px solid var(--line);
  box-shadow:0 10px 24px rgba(70,48,25,.06);
}
.danger-btn{color:#fff;background:linear-gradient(180deg,#c06654,#9d3f35)}
.round-btn{
  width:42px;height:42px;border-radius:50%;border:1px solid var(--line);
  background:rgba(255,255,255,.72);color:var(--ink);display:grid;place-items:center;font-weight:900;
}
body.night .ghost-btn,body.night .round-btn,body.night .mini-btn{background:rgba(255,255,255,.05)}
.screen{display:none;min-height:calc(100vh - 72px);padding:26px 0 92px}
.screen.active{display:block}

.hero-card{
  display:grid;grid-template-columns:1.03fr .97fr;gap:22px;align-items:stretch;
  border-radius:42px;padding:26px;background:linear-gradient(135deg,rgba(255,253,248,.96),rgba(248,237,219,.94));
  border:1px solid var(--line);box-shadow:var(--shadow);overflow:hidden;position:relative;
}
body.night .hero-card{background:linear-gradient(135deg,#211912,#17110c)}
.hero-card:before{content:"";position:absolute;right:-140px;top:-180px;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(231,193,113,.28),transparent 66%)}
.hero-copy{position:relative;z-index:2;padding:12px}
.ribbon{
  display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:999px;
  background:linear-gradient(180deg,#e7c171,#b87931);color:#fff;font-size:12px;font-weight:900;letter-spacing:.14em;
}
.eyebrow{margin:22px 0 0;color:var(--gold2);font-size:12px;font-weight:900;letter-spacing:.20em;text-transform:uppercase}
.hero-copy h1{
  margin:12px 0 8px;color:var(--ink);font-family:Georgia,'Times New Roman',serif;
  font-size:clamp(44px,6.4vw,86px);line-height:.94;font-weight:500;
}
.hero-copy h1 strong{display:block;color:var(--gold2);font-size:1.08em;text-transform:uppercase;letter-spacing:.03em}
.sub{color:var(--ink);font-family:Georgia,serif;font-size:clamp(24px,3vw,36px);margin:0 0 14px}
.lead{color:var(--brown);font-family:Georgia,serif;font-size:20px;line-height:1.55;max-width:660px}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin:26px 0}
.quick-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:12px;max-width:640px}
.quick-card{
  padding:18px;border-radius:24px;background:rgba(255,255,255,.72);border:1px solid var(--line);
  box-shadow:var(--shadow2);display:flex;gap:12px;align-items:flex-start;
}
body.night .quick-card{background:rgba(255,255,255,.04)}
.quick-card span{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(180deg,#d6a14e,#a96d28);color:#fff;flex:0 0 42px}
.quick-card b{display:block;color:var(--ink);font-family:Georgia,serif;font-size:22px;line-height:1}
.quick-card small{display:block;color:var(--muted);font-size:13px;margin-top:4px}
.hero-media{position:relative;z-index:2;display:flex;align-items:center;justify-content:center}
.hero-media img{border-radius:30px;width:100%;height:100%;object-fit:cover;min-height:520px;box-shadow:0 28px 76px rgba(70,48,25,.14);border:1px solid var(--line)}
.premium-strip{
  margin-top:18px;display:grid;grid-template-columns:repeat(3,1fr);gap:14px;
}
.premium-strip div{
  padding:24px;border-radius:26px;background:rgba(255,253,248,.82);border:1px solid var(--line);box-shadow:var(--shadow2)
}
body.night .premium-strip div{background:rgba(255,255,255,.04)}
.premium-strip b{display:block;color:var(--ink);font-family:Georgia,serif;font-size:28px;line-height:1.05;margin-bottom:8px}
.premium-strip p{margin:0;color:var(--muted)}

.reader-screen{padding:0 0 160px}
.reader-screen.active{display:grid;grid-template-columns:310px minmax(0,1fr)}
.toc-panel{
  position:sticky;top:72px;height:calc(100vh - 72px);overflow:auto;padding:18px;background:rgba(255,248,236,.86);
  border-right:1px solid var(--line);backdrop-filter:blur(18px);z-index:40;
}
body.night .toc-panel{background:rgba(22,16,11,.90)}
.toc-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.toc-head span{display:block;color:var(--gold2);font-size:11px;font-weight:900;letter-spacing:.17em;text-transform:uppercase}
.toc-head b{display:block;color:var(--ink);font-family:Georgia,serif;font-size:30px;line-height:1}
.search-row{display:flex;gap:0;margin-bottom:14px}
.search-row input{
  flex:1;min-width:0;border:1px solid var(--line);border-right:0;border-radius:17px 0 0 17px;background:var(--cream);color:var(--ink);padding:12px 14px;outline:none
}
.search-row button{
  border:0;border-radius:0 17px 17px 0;background:var(--ink);color:var(--paper);padding:12px 14px;font-weight:900;
}
#tocNav{display:grid;gap:5px}
#tocNav a{padding:11px 12px;border-radius:16px;color:var(--brown);font-size:14px;font-weight:800;line-height:1.25}
#tocNav a.active,#tocNav a:hover{background:rgba(199,142,66,.13);color:var(--gold2)}
.reader-main{min-width:0;padding:18px}
.reader-header{
  position:sticky;top:84px;z-index:30;
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:12px 14px;border-radius:24px;background:rgba(255,248,236,.88);border:1px solid var(--line);box-shadow:0 10px 30px rgba(70,48,25,.07);backdrop-filter:blur(18px)
}
body.night .reader-header{background:rgba(22,16,11,.90)}
.reader-title small{display:block;color:var(--gold2);font-size:11px;font-weight:900;letter-spacing:.16em;text-transform:uppercase}
.reader-title b{display:block;color:var(--ink);font-size:15px}
.reader-header-actions{display:flex;gap:8px}
.book-content{max-width:850px;margin:22px auto 0}
.book-cover{
  display:grid;grid-template-columns:.8fr 1.2fr;gap:22px;align-items:center;margin-bottom:18px;padding:30px;
  border-radius:32px;background:linear-gradient(135deg,#151515,#2d2117);color:#f8e2b2;box-shadow:var(--shadow);overflow:hidden;
}
.book-cover img{border-radius:16px;box-shadow:0 30px 70px rgba(0,0,0,.4)}
.book-cover h2{font-family:Georgia,serif;font-size:clamp(34px,5vw,64px);line-height:.96;margin:0;color:#f8e2b2}
.book-cover p{font-family:Georgia,serif;color:#ecd0a0;font-size:20px}
.book-page{
  scroll-margin-top:155px;margin:18px 0;padding:32px 34px;border-radius:28px;background:rgba(255,253,248,.96);
  border:1px solid var(--line);box-shadow:0 16px 44px rgba(70,48,25,.07)
}
body.night .book-page{background:rgba(255,255,255,.035)}
.page-num{color:var(--gold2);font-size:11px;font-weight:900;letter-spacing:.16em;text-transform:uppercase;margin-bottom:12px}
.page-text{
  color:var(--ink);font-family:Georgia,'Times New Roman',serif;font-size:var(--fontSize);line-height:1.78;white-space:pre-wrap
}
.page-text mark{background:#ffe9ad;color:#422b16;border-radius:3px;padding:0 2px}

.kindle-bar{
  position:fixed;left:330px;right:20px;bottom:18px;z-index:60;border-radius:26px;padding:14px 16px;
  background:rgba(255,248,236,.94);border:1px solid var(--line);box-shadow:0 20px 54px rgba(70,48,25,.16);backdrop-filter:blur(18px)
}
body.night .kindle-bar{background:rgba(22,16,11,.94)}
.progress-line{display:flex;justify-content:space-between;align-items:center;font-weight:900;color:var(--ink);font-size:13px;margin-bottom:8px}
#progressSlider{width:100%;accent-color:var(--gold);margin:0 0 10px}
.kindle-tools{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
.kindle-tools button{
  min-height:56px;border-radius:18px;border:1px solid var(--line);background:var(--cream);color:var(--ink);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
}
body.night .kindle-tools button{background:rgba(255,255,255,.04)}
.kindle-tools b{font-size:18px}.kindle-tools small{color:var(--muted);font-weight:800;font-size:11px}

.audio-hero,.sos-hero,.page-head,.notice-card{
  padding:34px;border-radius:34px;background:rgba(255,253,248,.86);border:1px solid var(--line);box-shadow:var(--shadow2)
}
body.night .audio-hero,body.night .sos-hero,body.night .page-head,body.night .notice-card{background:rgba(255,255,255,.04)}
.status-pill{
  display:inline-flex;padding:10px 14px;border-radius:999px;background:linear-gradient(180deg,#e7c171,#b87931);color:white;font-size:12px;font-weight:900;letter-spacing:.12em;text-transform:uppercase
}
.status-pill.danger{background:linear-gradient(180deg,#d77765,#9e4137)}
.audio-hero h2,.sos-hero h2,.page-head h2{
  margin:16px 0 10px;color:var(--ink);font-family:Georgia,serif;font-size:clamp(36px,5vw,64px);line-height:1
}
.audio-hero p,.sos-hero p,.page-head p{color:var(--brown);font-family:Georgia,serif;font-size:20px;line-height:1.55}
.unlock-box{
  margin-top:24px;display:flex;gap:15px;align-items:center;padding:20px;border-radius:24px;background:#fff2d9;border:1px solid var(--line)
}
body.night .unlock-box{background:rgba(199,142,66,.10)}
.unlock-box span{font-size:34px}.unlock-box b{display:block;color:var(--ink)}.unlock-box p{margin:0;color:var(--muted);font-size:15px;font-family:Inter,sans-serif}
.audio-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin:18px 0}
.audio-card{
  position:relative;overflow:hidden;min-height:260px;padding:28px;border-radius:30px;background:linear-gradient(180deg,#fff,#fff4e3);border:1px solid var(--line);box-shadow:var(--shadow2)
}
body.night .audio-card{background:rgba(255,255,255,.04)}
.audio-card.dark{background:linear-gradient(135deg,#111820,#2a2118);color:#f7e0b2}
.audio-card:after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 18px,rgba(199,142,66,.08) 18px 20px);opacity:.22;pointer-events:none}
.audio-icon{font-size:40px}
.audio-card h3{position:relative;margin:18px 0 8px;color:inherit;font-family:Georgia,serif;font-size:34px;line-height:1}
.audio-card p{position:relative;color:var(--muted);font-size:16px;max-width:410px}
.audio-card.dark p{color:#ead8bd}
.audio-card button{position:relative;margin-top:18px;border:0;border-radius:999px;background:#ded3c4;color:#6c5d50;padding:12px 16px;font-weight:900;cursor:not-allowed}

.saved-list{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:18px}
.saved-item{
  padding:22px;border-radius:24px;background:rgba(255,253,248,.86);border:1px solid var(--line);box-shadow:var(--shadow2)
}
body.night .saved-item{background:rgba(255,255,255,.04)}
.saved-item small{display:block;color:var(--gold2);font-size:11px;font-weight:900;letter-spacing:.14em;text-transform:uppercase}
.saved-item p{color:var(--ink);font-family:Georgia,serif;font-size:18px;line-height:1.5}
.saved-actions{display:flex;gap:8px;flex-wrap:wrap}.inline-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}

.emergency-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:22px}
.emergency-grid a{padding:18px;border-radius:22px;background:#fff;border:1px solid rgba(168,72,59,.18);box-shadow:var(--shadow2)}
body.night .emergency-grid a{background:rgba(255,255,255,.04)}
.emergency-grid b{display:block;color:var(--danger);font-size:21px}.emergency-grid small{color:var(--muted)}
.sos-grid,.support-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:18px}
.sos-card,.support-card{
  padding:26px;border-radius:28px;background:rgba(255,253,248,.86);border:1px solid var(--line);box-shadow:var(--shadow2)
}
body.night .sos-card,body.night .support-card{background:rgba(255,255,255,.04)}
.sos-card h3,.support-card h3{margin:0 0 10px;color:var(--ink);font-family:Georgia,serif;font-size:32px;line-height:1}
.sos-card p,.support-card p{color:var(--brown);font-size:16px;line-height:1.65}
.sos-card ul{margin:0;padding-left:20px;color:var(--brown);line-height:1.7}
.breath-orb{
  width:166px;height:166px;margin:20px auto;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle,#fff 0 34%,#fde5bd 35% 62%,#c78e42 63% 100%);
  box-shadow:0 22px 60px rgba(199,142,66,.24);transition:transform 4s ease
}
body.night .breath-orb{background:radial-gradient(circle,#201812 0 34%,#714d25 35% 62%,#c78e42 63% 100%)}
.breath-orb.inhale{transform:scale(1.15)}
.breath-orb.exhale{transform:scale(.88);transition-duration:6s}
.breath-orb span{font-weight:900;color:var(--ink)}
.grounding{display:grid;gap:10px}
.grounding button{padding:14px;border-radius:16px;border:1px solid var(--line);background:var(--cream);color:var(--ink);font-weight:800;text-align:left}
.grounding button.done{background:#f7e2bd;color:var(--gold2);text-decoration:line-through}
body.night .grounding button{background:rgba(255,255,255,.04)}
.notice-card{margin-top:16px}.notice-card b{color:var(--ink)}.notice-card p{color:var(--muted)}

.bottom-nav{
  position:fixed;left:0;right:0;bottom:0;z-index:80;
  display:none;grid-template-columns:repeat(5,1fr);gap:6px;padding:8px 10px calc(8px + env(safe-area-inset-bottom));
  background:rgba(255,248,236,.94);backdrop-filter:blur(18px);border-top:1px solid var(--line)
}
body.night .bottom-nav{background:rgba(22,16,11,.94)}
.bottom-nav a{text-align:center;padding:10px 4px;border-radius:14px;color:var(--muted);font-weight:900;font-size:12px}
.bottom-nav a.active{background:rgba(199,142,66,.14);color:var(--gold2)}
.drawer{
  position:fixed;inset:0 auto 0 0;width:min(86vw,360px);z-index:150;transform:translateX(-105%);transition:.24s ease;
  background:var(--paper);border-right:1px solid var(--line);box-shadow:var(--shadow);padding:20px
}
.drawer.open{transform:translateX(0)}
.drawer-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.drawer-head b{font-family:Georgia,serif;font-size:28px;color:var(--ink)}
.drawer a{display:block;padding:14px;border-radius:16px;font-weight:800;color:var(--brown)}
.drawer a:hover{background:rgba(199,142,66,.12)}

.selection-bubble{
  position:absolute;z-index:200;display:none;border:1px solid rgba(255,255,255,.30);border-radius:999px;
  padding:12px 16px;background:linear-gradient(180deg,#ddb063,#b8752d);color:#fff;box-shadow:0 18px 46px rgba(70,48,25,.22);font-weight:900
}
.selection-bubble.show{display:block}
.search-modal{position:fixed;inset:0;z-index:190;display:none;place-items:center;padding:18px;background:rgba(46,33,24,.35);backdrop-filter:blur(10px)}
.search-modal.show{display:grid}
.modal-card{width:min(560px,100%);padding:28px;border-radius:30px;background:var(--paper);border:1px solid var(--line);box-shadow:var(--shadow)}
.modal-card h3{margin:10px 0;color:var(--ink);font-family:Georgia,serif;font-size:40px}
.modal-card p{color:var(--muted)}
.modal-close{float:right;width:38px;height:38px;border-radius:50%;border:1px solid var(--line);background:var(--cream);color:var(--ink)}
.toast{
  position:fixed;left:50%;bottom:96px;z-index:210;transform:translateX(-50%) translateY(10px);opacity:0;transition:.22s ease;
  padding:14px 18px;border-radius:999px;background:var(--ink);color:var(--paper);font-weight:900;box-shadow:var(--shadow)
}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
@media(max-width:1060px){
  .hero-card{grid-template-columns:1fr}.hero-media img{min-height:auto}
  .premium-strip,.quick-grid{grid-template-columns:1fr}
  .reader-screen.active{grid-template-columns:1fr}
  .toc-panel{position:fixed;top:0;height:100vh;width:min(88vw,360px);transform:translateX(-105%);transition:.22s ease}
  .toc-panel.open{transform:translateX(0)}
  .kindle-bar{left:18px;right:18px}
}
@media(max-width:760px){
  .mobile-only{display:grid!important}
  .install-btn{display:none}
  .screen{padding:16px 0 98px}
  .app-topbar{min-height:68px;padding:10px 12px}
  .brand small{font-size:9px}.brand b{font-size:14px}
  .hero-card{padding:16px;border-radius:30px}
  .hero-copy h1{font-size:48px}
  .sub{font-size:22px}.lead{font-size:18px}
  .hero-actions .primary-btn,.hero-actions .ghost-btn{width:100%}
  .premium-strip div,.audio-hero,.sos-hero,.page-head,.notice-card{padding:22px;border-radius:26px}
  .reader-main{padding:12px}
  .reader-header{top:78px}
  .book-cover{grid-template-columns:1fr;padding:22px}
  .book-page{padding:24px 18px}
  .page-text{font-size:calc(var(--fontSize) - 1px)}
  .kindle-bar{bottom:72px;left:10px;right:10px;padding:12px}
  .kindle-tools{gap:6px}
  .kindle-tools button{min-height:52px}
  .audio-grid,.sos-grid,.support-grid,.saved-list,.emergency-grid{grid-template-columns:1fr}
  .bottom-nav{display:grid}
}