/* 全息道德经 · 玄夜书馆视觉层 */

body[data-page]{
  --ui-night:#070D18;
  --ui-panel:#101B2D;
  --ui-panel-2:#15233A;
  --ui-paper:#E8DCC5;
  --ui-ink:#33291A;
  --ui-copper:#D9855B;
  --ui-gold:#E8C97E;
  --ui-text:#F0E8D8;
  --ui-dim:#A99F8E;
  --ui-line:rgba(232,201,126,.18);
  background:var(--ui-night);
}
body[data-page] .app{background:var(--ui-night)}
body[data-page] .bg{
  background:
    radial-gradient(circle at 84% 4%,rgba(75,103,151,.2),transparent 30%),
    radial-gradient(circle at 8% 42%,rgba(44,102,105,.09),transparent 32%),
    linear-gradient(180deg,rgba(7,13,24,.16),rgba(7,13,24,.88) 82%),
    url('https://zaz-ddj.oss-cn-shanghai.aliyuncs.com/assets/img/cover_dark.webp') center top/cover no-repeat,var(--ui-night);
}
body[data-page] .bg::after{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,transparent 55%,rgba(7,13,24,.42));
}
body[data-page] .app::before{
  content:'';position:absolute;left:0;right:0;top:0;height:1px;z-index:20;pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(232,201,126,.45),transparent);
}
body[data-page] ::selection{background:rgba(217,133,91,.35);color:#FFF7E8}
body[data-page] [role="button"]:focus-visible,
body[data-page] button:focus-visible,
body[data-page] [tabindex="0"]:focus-visible{
  outline:2px solid var(--ui-gold);outline-offset:3px;
}

body[data-page] .footer{
  background:rgba(6,11,22,.94);
  -webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);
  border-top:1px solid rgba(232,201,126,.13);
}
body[data-page] .footer .tabs{height:calc(50 * var(--u))}
body[data-page] .footer .tab{position:relative;transition:opacity .2s ease}
body[data-page] .footer .tab::before{
  content:'';position:absolute;top:0;left:50%;width:calc(22 * var(--u));height:2px;
  transform:translateX(-50%) scaleX(0);border-radius:2px;background:var(--ui-copper);
  transition:transform .25s ease;
}
body[data-page] .footer .tab.active::before{transform:translateX(-50%) scaleX(1)}
body[data-page] .footer .tab.active .tab-icon{filter:drop-shadow(0 0 calc(6 * var(--u)) rgba(217,133,91,.28))}
body[data-page] .footer .tab-label{font-size:max(calc(12.5 * var(--u)),10px);letter-spacing:calc(1.5 * var(--u))}
body[data-page] .footer .home-indicator{opacity:.55}

body[data-page] .pagehead,
body[data-page] .chat-head,
body[data-page] .pagebar{
  background:linear-gradient(180deg,rgba(7,13,24,.78),rgba(7,13,24,.08));
}
body[data-page] .back-btn,
body[data-page] .pagebar .back{color:var(--ui-gold)}
body[data-page] .page-title,
body[data-page] .pagehead-title,
body[data-page] .chat-title,
body[data-page] .pagebar h1{
  color:var(--ui-gold);text-shadow:none;font-weight:400;
}

/* 主页：紧凑品牌、暖纸金句、人物分身 */
body[data-page="home"] .content-inner{
  padding-top:calc(calc(18 * var(--u)) + env(safe-area-inset-top,0px));
}
body[data-page="home"] .brand{
  display:grid;grid-template-columns:auto auto;grid-template-rows:auto auto;
  align-items:center;justify-content:center;column-gap:calc(15 * var(--u));text-align:left;
}
body[data-page="home"] .brand-mascot{
  grid-row:1/3;width:calc(82 * var(--u));margin:0;
  filter:drop-shadow(0 calc(8 * var(--u)) calc(18 * var(--u)) rgba(0,0,0,.42));
}
body[data-page="home"] .brand-title{
  grid-column:2;align-self:end;margin:0;font-size:calc(34 * var(--u));line-height:1.15;
  letter-spacing:calc(6 * var(--u));padding-left:0;color:var(--ui-gold);text-shadow:none;
}
body[data-page="home"] .brand-en{
  grid-column:2;align-self:start;margin:calc(5 * var(--u)) 0 0;padding:0;
  font-size:calc(8.5 * var(--u));letter-spacing:calc(3.6 * var(--u));color:#7DBDB7;
}
body[data-page="home"] .features{margin-top:calc(25 * var(--u));gap:calc(10 * var(--u))}
body[data-page="home"] .feature-card{
  height:calc(94 * var(--u));gap:calc(7 * var(--u));border-radius:calc(15 * var(--u));
  background:linear-gradient(155deg,rgba(24,39,65,.92),rgba(12,21,36,.94));
  border:1px solid rgba(232,201,126,.17);box-shadow:0 calc(12 * var(--u)) calc(26 * var(--u)) rgba(0,0,0,.2);
}
body[data-page="home"] .feature-card:nth-child(2){background:linear-gradient(155deg,rgba(34,31,55,.92),rgba(15,20,38,.94))}
body[data-page="home"] .feature-card:nth-child(3){background:linear-gradient(155deg,rgba(19,43,52,.88),rgba(12,24,35,.94))}
body[data-page="home"] .feature-icon{width:calc(33 * var(--u));height:calc(33 * var(--u))}
body[data-page="home"] .feature-icon svg{width:100%;height:100%}
body[data-page="home"] .feature-label{font-size:calc(24 * var(--u));letter-spacing:calc(4 * var(--u));text-indent:calc(4 * var(--u));color:var(--ui-text)}
body[data-page="home"] .card::after{background:linear-gradient(90deg,transparent,rgba(232,201,126,.22),transparent)}
body[data-page="home"] .daily{margin-top:calc(27 * var(--u))}
body[data-page="home"] .daily-head,
body[data-page="home"] .ai-header{align-items:baseline}
body[data-page="home"] .daily-bar,
body[data-page="home"] .ai-bar{width:calc(20 * var(--u));height:2px;box-shadow:none;background:var(--ui-copper)}
body[data-page="home"] .daily-title{font-size:calc(26 * var(--u));color:var(--ui-gold);text-shadow:none}
body[data-page="home"] .daily-day{
  border:0;border-bottom:1px solid rgba(217,133,91,.45);border-radius:0;padding:calc(3 * var(--u)) 0;
  color:var(--ui-copper);font-size:calc(12 * var(--u));letter-spacing:calc(1.5 * var(--u));
}
body[data-page="home"] .daily-card{
  border-radius:calc(18 * var(--u));border-color:rgba(232,220,197,.35);
  background:
    linear-gradient(135deg,rgba(255,255,255,.18),transparent 32%),
    linear-gradient(155deg,#EEE3CF,#D9C8AA);
  box-shadow:0 calc(18 * var(--u)) calc(42 * var(--u)) rgba(0,0,0,.28);
}
body[data-page="home"] .daily-ghost{color:rgba(77,55,28,.065)}
body[data-page="home"] .daily-quote{color:var(--ui-ink);text-shadow:none}
body[data-page="home"] .daily-src{color:#75654F}
body[data-page="home"] .daily-actions::before{
  background:linear-gradient(90deg,transparent,rgba(91,65,35,.48) 18%,rgba(91,65,35,.48) 78%,rgba(91,65,35,.15));
}
body[data-page="home"] .daily-actions::after{background:linear-gradient(90deg,transparent,rgba(147,73,45,.8),transparent)}
body[data-page="home"] .dao-step{color:rgba(74,52,29,.5)}
body[data-page="home"] .daily-dot{
  color:#43331F;background:rgba(65,46,24,.055);border-color:rgba(86,60,30,.36);
}
body[data-page="home"] .daily-act{
  color:#F4E7CF;background:#82452F;border-color:#82452F;box-shadow:0 calc(5 * var(--u)) calc(12 * var(--u)) rgba(80,43,28,.2);
}
body[data-page="home"] .daily-act::after{background:#E9C898}
body[data-page="home"] .ai{margin-top:calc(28 * var(--u))}
body[data-page="home"] .ai-title{color:var(--ui-gold);text-shadow:none;font-size:calc(20 * var(--u))}
body[data-page="home"] .ai-cards{gap:calc(9 * var(--u))}
body[data-page="home"] .ai-card{
  border:0;border-bottom:1px solid rgba(232,201,126,.17);border-radius:0;
  padding:calc(13 * var(--u)) calc(4 * var(--u));background:transparent;box-shadow:none;
}
body[data-page="home"] .ai-card::after{display:none}
body[data-page="home"] .ai-avatar{width:calc(58 * var(--u));height:calc(58 * var(--u));border-radius:50%;filter:none;border:1px solid rgba(232,201,126,.2)}
body[data-page="home"] .ai-name{color:var(--ui-text);font-size:calc(19 * var(--u))}
body[data-page="home"] .ai-desc{color:var(--ui-dim);font-size:calc(14 * var(--u));margin-top:calc(4 * var(--u))}
body[data-page="home"] .poster-frame{background:rgba(232,201,126,.18)}

/* 说唱：编辑式音频书库 */
body[data-page="music"] .pagehead{height:calc(54 * var(--u));border-bottom:1px solid rgba(232,201,126,.1)}
body[data-page="music"] .page-title{font-size:calc(28 * var(--u));letter-spacing:calc(5 * var(--u))}
body[data-page="music"] .pagehead::after{
  content:'AUDIO LIBRARY';margin-left:auto;font-family:var(--font-sans);font-size:calc(8 * var(--u));
  letter-spacing:calc(2 * var(--u));color:rgba(167,155,133,.65);
}
body[data-page="music"] .seq-tabs,
body[data-page="cards"] .seq-tabs{
  gap:calc(4 * var(--u));padding:calc(4 * var(--u));border:1px solid rgba(232,201,126,.13);
  border-radius:calc(17 * var(--u));background:rgba(12,21,36,.74);
}
body[data-page="music"] .seq-tab,
body[data-page="cards"] .seq-tab{
  border:0;border-radius:calc(12 * var(--u));background:transparent;box-shadow:none;
  font-size:calc(20 * var(--u));color:var(--ui-dim);
}
body[data-page="music"] .seq-tab.active,
body[data-page="cards"] .seq-tab.active{
  color:#F5E4C8;background:#71402F;box-shadow:0 calc(5 * var(--u)) calc(14 * var(--u)) rgba(0,0,0,.2);
}
body[data-page="music"] .seq-tab.active::after,
body[data-page="cards"] .seq-tab.active::after{display:none}
body[data-page="music"] .seq-note{color:var(--ui-dim);font-size:calc(12 * var(--u));letter-spacing:calc(.6 * var(--u))}
body[data-page="music"] .list{padding-top:calc(23 * var(--u))}
body[data-page="music"] .book{margin-bottom:calc(27 * var(--u))}
body[data-page="music"] .book-head{
  gap:calc(9 * var(--u));margin-bottom:calc(5 * var(--u));padding-bottom:calc(9 * var(--u));
  border-bottom:1px solid rgba(232,201,126,.2);
}
body[data-page="music"] .book-bar{width:calc(20 * var(--u));height:2px;background:var(--ui-copper);box-shadow:none}
body[data-page="music"] .book-name{color:var(--ui-gold);font-size:calc(18 * var(--u));letter-spacing:calc(1.5 * var(--u))}
body[data-page="music"] .book-count{font-size:calc(10 * var(--u));color:var(--ui-dim)}
body[data-page="music"] .tracks{gap:0}
body[data-page="music"] .track{
  gap:calc(13 * var(--u));padding:calc(11 * var(--u)) calc(4 * var(--u));
  border:0;border-bottom:1px solid rgba(236,228,211,.075);border-radius:0;background:transparent;
}
body[data-page="music"] .track:last-child{border-bottom:0}
body[data-page="music"] .track:active,
body[data-page="music"] .track.is-pressed{transform:none;background:rgba(232,201,126,.045)}
body[data-page="music"] .track-num{
  width:calc(41 * var(--u));height:calc(41 * var(--u));border-radius:calc(11 * var(--u));
  border:1px solid rgba(232,201,126,.24);background:rgba(232,201,126,.055);color:var(--ui-gold);
  font-size:calc(16 * var(--u));
}
body[data-page="music"] .track-name{font-size:calc(23 * var(--u));letter-spacing:calc(1.5 * var(--u));color:var(--ui-text)}
body[data-page="music"] .track.last .track-num{background:rgba(217,133,91,.14);border-color:rgba(217,133,91,.5);color:#F2AB82}

/* 章节：沉浸歌词舞台与控制坞 */
body[data-page="chapter"] .title-zone{margin-top:calc(49 * var(--u))}
body[data-page="chapter"] .ch-title{font-size:calc(34 * var(--u));color:var(--ui-gold);text-shadow:none;letter-spacing:calc(7 * var(--u))}
body[data-page="chapter"] .ch-subtitle{color:var(--ui-dim);font-size:calc(11 * var(--u));letter-spacing:calc(2.4 * var(--u))}
body[data-page="chapter"] .d-line{background:linear-gradient(90deg,transparent,rgba(217,133,91,.65))}
body[data-page="chapter"] .d-line.r{background:linear-gradient(270deg,transparent,rgba(217,133,91,.65))}
body[data-page="chapter"] .d-diamond{background:var(--ui-copper);box-shadow:none}
body[data-page="chapter"] .verse{color:rgba(240,232,216,.55);text-shadow:none}
body[data-page="chapter"] .verse.active{color:#F3D58F;text-shadow:0 0 calc(22 * var(--u)) rgba(232,201,126,.25)}
body[data-page="chapter"] .player{
  margin:0 calc(9 * var(--u));border:1px solid rgba(232,201,126,.15);border-bottom:0;
  border-radius:calc(24 * var(--u)) calc(24 * var(--u)) 0 0;
  background:linear-gradient(180deg,rgba(18,30,49,.94),rgba(7,13,24,.98));
  -webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);
  box-shadow:0 calc(-12 * var(--u)) calc(38 * var(--u)) rgba(0,0,0,.24);
}
body[data-page="chapter"] .player + .footer{background:rgba(7,13,24,.98)}
body[data-page="chapter"] .ctrl{color:var(--ui-dim)}
body[data-page="chapter"] .ctrl:active,
body[data-page="chapter"] .ctrl.is-pressed{color:var(--ui-gold)}
body[data-page="chapter"] .play-btn{
  border:0;background:linear-gradient(145deg,#E7C584,#CF7952);
  box-shadow:0 calc(7 * var(--u)) calc(20 * var(--u)) rgba(207,121,82,.25);
}
body[data-page="chapter"] .play-btn svg{fill:#152033}
body[data-page="chapter"] .play-btn.playing{border:0;box-shadow:0 0 calc(22 * var(--u)) rgba(232,201,126,.25)}
body[data-page="chapter"] .seg{background:rgba(5,11,22,.55);border-color:rgba(232,201,126,.15)}
body[data-page="chapter"] .seg-ind{background:linear-gradient(135deg,#E7C584,#CF7952);box-shadow:none}
body[data-page="chapter"] .seg-opt.active{color:#152033}
body[data-page="chapter"] .seg-opt{color:var(--ui-dim)}
body[data-page="chapter"] .toast{background:rgba(16,27,45,.94);border-color:rgba(232,201,126,.2)}

/* 翻卡：中央聚光抽卡桌，卡片内部完全沿用校准样式 */
body[data-page="cards"] .bgimg{opacity:.38;filter:saturate(.82) brightness(.82)}
body[data-page="cards"] .screen{
  background:radial-gradient(ellipse at 50% 38%,rgba(217,133,91,.09),transparent 40%);
}
body[data-page="cards"] .pagebar h1{font-size:calc(28 * var(--u));letter-spacing:calc(5 * var(--u))}
body[data-page="cards"] .pagebar::after{
  content:'CARD ATELIER';margin-left:auto;font-family:var(--font-sans);font-size:calc(8 * var(--u));
  letter-spacing:calc(2 * var(--u));color:rgba(167,155,133,.65);
}
body[data-page="cards"] .hint{color:var(--ui-dim);font-size:calc(12 * var(--u));letter-spacing:calc(.8 * var(--u))}
body[data-page="cards"] .hint i{background:var(--ui-copper);opacity:.65}
body[data-page="cards"] .display-area{
  background:radial-gradient(circle at 50% 50%,rgba(232,201,126,.08),transparent 56%);
}
body[data-page="cards"] .big-card .face{
  box-shadow:0 calc(22 * var(--u)) calc(52 * var(--u)) rgba(0,0,0,.58),0 0 calc(42 * var(--u)) rgba(217,133,91,.12);
}
body[data-page="cards"] .fcard{box-shadow:0 calc(5 * var(--u)) calc(13 * var(--u)) rgba(0,0,0,.48)}
body[data-page="cards"] .fcard.sel{box-shadow:0 calc(9 * var(--u)) calc(24 * var(--u)) rgba(0,0,0,.52),0 0 calc(20 * var(--u)) rgba(217,133,91,.32);border-color:rgba(217,133,91,.75)}
body[data-page="cards"] .readout .r-main{color:var(--ui-gold)}
body[data-page="cards"] .readout .r-word{color:var(--ui-text)}
body[data-page="cards"] .readout .r-sub{color:var(--ui-dim)}
body[data-page="cards"] .drawbar{background:linear-gradient(180deg,transparent,rgba(7,13,24,.96) 48%)}
body[data-page="cards"] .draw-btn{
  background:linear-gradient(135deg,#E7C584,#CF7952);color:#152033;
  box-shadow:0 calc(9 * var(--u)) calc(28 * var(--u)) rgba(207,121,82,.3);
}
body[data-page="cards"] .draw-btn svg{fill:#152033}
body[data-page="cards"] .fx{background:rgba(4,9,18,.9);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
body[data-page="cards"] .fx-close{color:var(--ui-gold)}
body[data-page="cards"] .fx-hint{color:var(--ui-dim);font-size:calc(12 * var(--u));letter-spacing:calc(2 * var(--u))}
body[data-page="cards"] .fbtn{background:rgba(18,30,49,.88);border-color:rgba(232,201,126,.2);color:var(--ui-text)}
body[data-page="cards"] .fbtn.primary{background:#71402F;border-color:#9A6249;color:#F4DFC0}
body[data-page="cards"] .nav-arrow{background:rgba(16,27,45,.9);border-color:rgba(232,201,126,.2);color:var(--ui-gold)}
body[data-page="cards"] .rdlg-panel{background:linear-gradient(155deg,#182840,#0C1627);border-color:rgba(232,201,126,.26)}
body[data-page="cards"] .rdlg-btn{background:linear-gradient(135deg,#E7C584,#CF7952);color:#152033;box-shadow:none}
body[data-page="cards"] .toast{background:rgba(16,27,45,.95)}

/* 书籍简介：安静的出版物陈列 */
body[data-page="intro"] .pagehead{border-bottom:1px solid rgba(232,201,126,.1)}
body[data-page="intro"] .pagehead-title{font-size:calc(25 * var(--u));color:var(--ui-gold);text-shadow:none}
body[data-page="intro"] .halo-ring{border-color:rgba(232,201,126,.09)}
body[data-page="intro"] .vtxt{color:rgba(236,228,211,.15)}
body[data-page="intro"] .floaty{animation:none}
body[data-page="intro"] .book{
  border-color:rgba(232,201,126,.38);
  box-shadow:0 calc(20 * var(--u)) calc(48 * var(--u)) rgba(0,0,0,.55),0 0 calc(30 * var(--u)) rgba(232,201,126,.1);
}
body[data-page="intro"] .book-title{color:var(--ui-gold);text-shadow:none;font-size:calc(28 * var(--u))}
body[data-page="intro"] .rule::before,
body[data-page="intro"] .rule::after{background:linear-gradient(90deg,transparent,rgba(217,133,91,.5))}
body[data-page="intro"] .rule::after{background:linear-gradient(270deg,transparent,rgba(217,133,91,.5))}
body[data-page="intro"] .rule i{background:var(--ui-copper);box-shadow:none}
body[data-page="intro"] .book-author{color:var(--ui-dim)}
body[data-page="intro"] .intro-zone{gap:calc(17 * var(--u))}
body[data-page="intro"] .desc{gap:calc(8 * var(--u));width:100%}
body[data-page="intro"] .desc p{
  padding:calc(10 * var(--u)) calc(12 * var(--u));border:1px solid rgba(232,201,126,.12);
  border-radius:calc(12 * var(--u));background:rgba(16,27,45,.72);
}
body[data-page="intro"] .desc .tick{background:var(--ui-copper)}
body[data-page="intro"] .desc .tag{color:var(--ui-copper)}
body[data-page="intro"] .desc .txt{color:var(--ui-text);font-size:calc(18 * var(--u))}
body[data-page="intro"] .kw{
  border:0;border-bottom:1px solid rgba(232,201,126,.25);border-radius:0;background:none;box-shadow:none;
  color:var(--ui-dim);font-size:calc(15 * var(--u));
}
body[data-page="intro"] .btn{border-radius:calc(12 * var(--u));font-size:calc(18 * var(--u))}
body[data-page="intro"] .btn-ghost{background:rgba(16,27,45,.75);border-color:rgba(232,201,126,.25);color:var(--ui-gold)}
body[data-page="intro"] .btn-primary{background:linear-gradient(135deg,#E7C584,#CF7952);box-shadow:0 calc(8 * var(--u)) calc(22 * var(--u)) rgba(207,121,82,.22)}
body[data-page="intro"] .btn-primary::after{display:none}

/* 目录：编目卡片与清晰阅读层级 */
body[data-page="toc"] .hero-wrap{height:calc(132 * var(--u));overflow:hidden;background:#0B1424}
body[data-page="toc"] .hero-wrap img{height:100%;object-fit:cover;object-position:center 42%;filter:brightness(1.02) saturate(.86)}
body[data-page="toc"] .hero-wrap::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,transparent 40%,rgba(7,13,24,.72))}
body[data-page="toc"] .pagehead{background:linear-gradient(180deg,rgba(7,13,24,.82),transparent)}
body[data-page="toc"] .page-title{color:var(--ui-gold);text-shadow:none}
body[data-page="toc"] .toc-toggle{background:rgba(12,21,36,.72);border-color:rgba(232,201,126,.2);color:var(--ui-text)}
body[data-page="toc"] .content{background:linear-gradient(180deg,rgba(7,13,24,.15),rgba(7,13,24,.72))}
body[data-page="toc"] .toc-stream{padding-left:calc(27 * var(--u));margin:0 calc(14 * var(--u))}
body[data-page="toc"] .toc-stream::before{left:calc(9 * var(--u));background:linear-gradient(180deg,transparent,rgba(217,133,91,.3) 8%,rgba(217,133,91,.3) 92%,transparent)}
body[data-page="toc"] .track-badge{
  left:calc(-27 * var(--u));border-radius:calc(7 * var(--u));border-color:rgba(232,201,126,.3);
  background:#111D30;color:var(--ui-gold);
}
body[data-page="toc"] .track-badge.reading{color:#F1A47D;background:#4C2E28;animation:none;border-color:rgba(217,133,91,.55)}
body[data-page="toc"] .track-badge.done{background:var(--ui-gold);color:#152033;border-color:var(--ui-gold)}
body[data-page="toc"] .card{
  border-color:rgba(232,201,126,.16);border-radius:calc(13 * var(--u));background:rgba(16,27,45,.94);
  box-shadow:0 calc(8 * var(--u)) calc(20 * var(--u)) rgba(0,0,0,.12);
}
body[data-page="toc"] .node.open .card{border-color:rgba(217,133,91,.42);background:rgba(24,38,61,.96)}
body[data-page="toc"] .progress{width:calc(6 * var(--u));background:rgba(236,228,211,.035);border-right:0}
body[data-page="toc"] .progress-fill{background:linear-gradient(180deg,var(--ui-gold),var(--ui-copper))}
body[data-page="toc"] .card-body{padding-left:calc(14 * var(--u))}
body[data-page="toc"] .card-title{color:#EBAD83;font-size:calc(17 * var(--u));letter-spacing:calc(2 * var(--u))}
body[data-page="toc"] .card-subtitle{color:var(--ui-dim);font-size:calc(13 * var(--u))}
body[data-page="toc"] .ch-count{color:var(--ui-dim)}
body[data-page="toc"] .ribbon{background:var(--ui-copper);animation:none}
body[data-page="toc"] .vol-profile{background:rgba(12,21,36,.62);border-color:rgba(232,201,126,.12)}
body[data-page="toc"] .vp-label{font-size:calc(14 * var(--u));color:var(--ui-text)}
body[data-page="toc"] .vp-tag{font-size:calc(13 * var(--u));color:var(--ui-gold);border-color:rgba(232,201,126,.16)}
body[data-page="toc"] .pill-sec{background:rgba(16,27,45,.66);border-color:rgba(236,228,211,.08)}
body[data-page="toc"] .pill-tag{background:rgba(81,157,151,.78);font-size:calc(13 * var(--u))}
body[data-page="toc"] .part-bar{background:rgba(20,33,55,.88);border-color:rgba(232,201,126,.14)}
body[data-page="toc"] .part-label{color:#EBAD83}
body[data-page="toc"] .part-desc{color:var(--ui-text)}
body[data-page="toc"] .ch-name{color:rgba(240,232,216,.86)}
body[data-page="toc"] .ch-item.last{background:rgba(217,133,91,.09)}
body[data-page="toc"] .ch-item.last .ch-name{color:#EBAD83}
body[data-page="toc"] .intro-item{background:rgba(16,27,45,.66);border-color:rgba(236,228,211,.08)}

/* 研习室与实战坊：对话、印墙和输入坞 */
body[data-page="study"] .chat-head,
body[data-page="practice"] .chat-head{background:rgba(7,13,24,.88);border-bottom-color:rgba(232,201,126,.12)}
body[data-page="study"] .chat-title,
body[data-page="practice"] .chat-title{font-size:calc(22 * var(--u));letter-spacing:calc(2 * var(--u))}
body[data-page="study"] .online,
body[data-page="practice"] .online{font-size:calc(11 * var(--u));color:#78C7BC}
body[data-page="study"] .online .dot,
body[data-page="practice"] .online .dot{background:#78C7BC;box-shadow:0 0 calc(8 * var(--u)) rgba(120,199,188,.55)}
body[data-page="study"] .avatar,
body[data-page="practice"] .avatar{border-radius:calc(11 * var(--u));border-color:rgba(232,201,126,.25)}
body[data-page="study"] .who,
body[data-page="practice"] .who{color:var(--ui-dim);font-size:calc(11 * var(--u))}
body[data-page="study"] .bubble.lao,
body[data-page="practice"] .bubble.lao{
  background:rgba(16,27,45,.9);border:0;border-left:2px solid rgba(232,201,126,.38);
  border-radius:calc(4 * var(--u)) calc(15 * var(--u)) calc(15 * var(--u)) calc(15 * var(--u));
  box-shadow:0 calc(8 * var(--u)) calc(20 * var(--u)) rgba(0,0,0,.1);
}
body[data-page="study"] .bubble.user,
body[data-page="practice"] .bubble.user{
  background:#673B2E;border:1px solid rgba(217,133,91,.38);box-shadow:none;color:#F5E7D4;
}
body[data-page="study"] .bubble.opening,
body[data-page="practice"] .bubble.opening{color:var(--ui-gold)}
body[data-page="study"] .ask,
body[data-page="practice"] .ask{
  background:rgba(16,27,45,.76);border-color:rgba(232,201,126,.12);border-radius:calc(10 * var(--u));
}
body[data-page="study"] .ask-badge,
body[data-page="practice"] .ask-badge{color:var(--ui-copper)}
body[data-page="study"] .ask-head,
body[data-page="practice"] .ask-head{color:var(--ui-dim)}
body[data-page="study"] .album-head{color:var(--ui-dim)}
body[data-page="study"] .seal{background:rgba(16,27,45,.68)}
body[data-page="study"] .seal.open{border-color:rgba(232,201,126,.55);animation:none;box-shadow:0 0 calc(16 * var(--u)) rgba(232,201,126,.12)}
body[data-page="study"] .seal.passed{border-color:rgba(217,133,91,.72);background:rgba(103,59,46,.5)}
body[data-page="study"] .seal.locked{background:rgba(12,21,36,.45)}
body[data-page="study"] .pill.mix{background:rgba(232,201,126,.06)}
body[data-page="study"] .pill.wrong{background:rgba(217,133,91,.06)}
body[data-page="study"] .opt.done.right{background:rgba(65,121,104,.18)}
body[data-page="study"] .opt.done.wrong{background:rgba(117,55,44,.2)}
body[data-page="study"] .asm-slot{background:rgba(7,13,24,.35)}
body[data-page="study"] .asm-chip{background:rgba(22,35,57,.9);border-color:rgba(232,201,126,.16)}
body[data-page="study"] .asm-submit.ready{background:#71402F;color:#F3DFC0}
body[data-page="study"] .src-card{background:rgba(65,121,104,.1);border-left-color:#6FAFA2;color:#B8C8BC}
body[data-page="practice"] .inputbar2{
  padding:5px;border:1px solid rgba(232,201,126,.2);border-radius:28px;
  background:rgba(12,21,36,.94);box-shadow:0 10px 30px rgba(0,0,0,.3);
  -webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);
}
body[data-page="practice"] .inputbar2 input{background:transparent;border:0;color:var(--ui-text)}
body[data-page="practice"] .inputbar2 button{background:linear-gradient(145deg,#E7C584,#CF7952);color:#152033}
body[data-page="practice"] .inputbar2 button.dim{opacity:.5}

@media (max-width:360px){
  body[data-page="home"] .brand-title{font-size:calc(31 * var(--u));letter-spacing:calc(5 * var(--u))}
  body[data-page="home"] .brand-mascot{width:calc(74 * var(--u))}
  body[data-page="home"] .feature-label{font-size:calc(22 * var(--u))}
  body[data-page="music"] .track-name{font-size:calc(21 * var(--u))}
  body[data-page="music"] .pagehead::after,
  body[data-page="cards"] .pagebar::after{display:none}
  body[data-page="intro"] .desc .txt{font-size:calc(16.5 * var(--u))}
  body[data-page="toc"] .card-end{padding-right:calc(8 * var(--u))}
}

@media (prefers-reduced-motion:reduce){
  body[data-page] .daily-actions::after,
  body[data-page] .floaty,
  body[data-page] .track-badge.reading,
  body[data-page] .ribbon,
  body[data-page] .btn-primary::after{animation:none!important}
  body[data-page] .daily-card,
  body[data-page] .daily-dot,
  body[data-page] .feature-card,
  body[data-page] .ai-card{transition:none!important}
}

/* 阅读区分区降噪与主页书封布局 */
body[data-page] .bg{
  background:
    radial-gradient(circle at 84% 4%,rgba(75,103,151,.13),transparent 30%),
    linear-gradient(180deg,rgba(7,13,24,.32),rgba(7,13,24,.8) 42%,rgba(7,13,24,.95) 100%),
    url('https://zaz-ddj.oss-cn-shanghai.aliyuncs.com/assets/img/cover_dark.webp') center top/cover no-repeat,var(--ui-night);
}
body[data-page] .bg::after{background:linear-gradient(180deg,transparent 35%,rgba(7,13,24,.36))}
body[data-page="music"] .bg,
body[data-page="toc"] .bg,
body[data-page="study"] .bg,
body[data-page="practice"] .bg{
  background:
    linear-gradient(180deg,rgba(7,13,24,.46),rgba(7,13,24,.9) 38%,rgba(7,13,24,.97) 80%),
    url('https://zaz-ddj.oss-cn-shanghai.aliyuncs.com/assets/img/cover_dark.webp') center top/cover no-repeat,var(--ui-night);
}
body[data-page="chapter"] .bg{
  background:
    linear-gradient(180deg,rgba(7,13,24,.54),rgba(7,13,24,.94) 34%,rgba(7,13,24,.985) 76%),
    url('https://zaz-ddj.oss-cn-shanghai.aliyuncs.com/assets/img/cover_dark.webp') center top/cover no-repeat,var(--ui-night);
}
body[data-page="cards"] .bgimg{opacity:.3}

body[data-page] .footer .tab{color:#AAA295}
body[data-page] .footer .tab-label{color:#AAA295}
body[data-page] .footer .tab-icon *{stroke:#AAA295}
body[data-page] .footer .tab.active{color:var(--orange)}
body[data-page] .footer .tab.active .tab-label{color:var(--orange)}
body[data-page] .footer .tab.active .tab-icon *{stroke:var(--orange)}
body[data-page="chapter"] .verse{color:rgba(240,232,216,.7)}
body[data-page="home"] .ai-desc,
body[data-page="music"] .book-count,
body[data-page="toc"] .ch-count,
body[data-page="toc"] .card-subtitle,
body[data-page="toc"] .part-count{color:#B6AD9D}

body[data-page="toc"] .vol-profile,
body[data-page="toc"] .part-bar,
body[data-page="toc"] .pill-sec,
body[data-page="toc"] .intro-item{
  border:0;border-bottom:1px solid rgba(232,201,126,.12);border-radius:0;background:transparent;
}
body[data-page="toc"] .vol-profile{border-top:1px solid rgba(232,201,126,.12)}
body[data-page="toc"] .part-bar.open,
body[data-page="toc"] .part-bar[aria-expanded="true"]{background:rgba(232,201,126,.035)}
body[data-page="study"] .seal{background:transparent}
body[data-page="study"] .seal.open{background:rgba(232,201,126,.035)}
body[data-page="study"] .seal.passed{background:rgba(103,59,46,.38)}

body[data-page="home"] .brand{order:1}
body[data-page="home"] .daily{order:2}
body[data-page="home"] .features{order:3}
body[data-page="home"] .ai{order:4}
body[data-page="home"] .spacer{order:5}
body[data-page="home"] .brand-book{
  width:calc(74 * var(--u));aspect-ratio:1555/2190;object-fit:cover;border-radius:calc(6 * var(--u));
  border:1px solid rgba(232,201,126,.3);
  box-shadow:0 calc(12 * var(--u)) calc(28 * var(--u)) rgba(0,0,0,.42);
  filter:none;
}
body[data-page="home"] .daily{margin-top:calc(22 * var(--u))}
body[data-page="home"] .features{
  margin-top:calc(19 * var(--u));padding:0 calc(20 * var(--u));
  display:flex;flex-direction:column;gap:0;
}
body[data-page="home"] .features::before{
  content:'修习工具';margin-bottom:calc(6 * var(--u));
  font-family:var(--font-sans);font-size:calc(10 * var(--u));letter-spacing:calc(2 * var(--u));color:var(--ui-copper);
}
body[data-page="home"] .feature-card,
body[data-page="home"] .feature-card:nth-child(2){
  height:calc(61 * var(--u));padding:0 calc(4 * var(--u));display:flex;flex-direction:row;justify-content:flex-start;
  gap:calc(12 * var(--u));border:0;border-bottom:1px solid rgba(232,201,126,.15);border-radius:0;
  background:transparent;box-shadow:none;
}
body[data-page="home"] .feature-card::after{display:none}
body[data-page="home"] .feature-card:active,
body[data-page="home"] .feature-card.is-pressed{transform:scale(.985);background:rgba(232,201,126,.035)}
body[data-page="home"] .feature-icon{width:calc(29 * var(--u));height:calc(29 * var(--u));flex:none}
body[data-page="home"] .feature-label{
  min-width:calc(50 * var(--u));font-size:calc(20 * var(--u));letter-spacing:calc(2 * var(--u));
  text-indent:0;color:var(--ui-text);
}
body[data-page="home"] .feature-note{
  margin-left:auto;color:var(--ui-dim);font-family:var(--font-sans);font-size:calc(10.5 * var(--u));
  letter-spacing:calc(.4 * var(--u));white-space:nowrap;
}
body[data-page="home"] .feature-arrow{margin-left:calc(5 * var(--u));color:var(--ui-copper);font-family:var(--font-sans);font-size:calc(18 * var(--u));line-height:1}
body[data-page="home"] .ai{margin-top:calc(20 * var(--u))}
body[data-page="home"] .ai-avatar{width:calc(50 * var(--u));height:calc(50 * var(--u))}
body[data-page="home"] .ai-card{padding-top:calc(10 * var(--u));padding-bottom:calc(10 * var(--u))}

@media (max-width:360px){
  body[data-page="home"] .brand-book{width:calc(68 * var(--u))}
  body[data-page="home"] .feature-label{font-size:calc(19 * var(--u))}
  body[data-page="home"] .feature-note{font-size:calc(10 * var(--u));letter-spacing:0}
}

/* 研习室 · 文房印谱 */
body[data-page="study"]{
  --study-paper:#E9DCC5;
  --study-paper-light:#F8EFDE;
  --study-ink:#3B3125;
  --study-muted:#82735E;
  --study-cinnabar:#944832;
  --study-teal:#477B70;
}
body[data-page="study"] .app{background:var(--study-paper)}
body[data-page="study"] .bg{display:none}
body[data-page="study"] .chat-head{
  height:calc(48 * var(--u));background:#F0E5D1;border-bottom:1px solid #D5C2A2;
}
body[data-page="study"] .chat-title{color:#75452F;text-shadow:none}
body[data-page="study"] .chat-head .back-btn{color:#9A6B45}
body[data-page="study"] .online{color:var(--study-teal)}
body[data-page="study"] .online .dot{background:var(--study-teal);box-shadow:0 0 calc(7 * var(--u)) rgba(71,123,112,.35)}
body[data-page="study"] .chat{
  color:var(--study-ink);
  background:
    linear-gradient(90deg,rgba(107,78,43,.026) 1px,transparent 1px),
    linear-gradient(180deg,#F0E5D1,#E6D6BA);
  background-size:26px 100%,100% 100%;
}
body[data-page="study"] .avatar{background:var(--study-paper-light);border-color:rgba(111,79,43,.28)}
body[data-page="study"] .who{color:var(--study-muted)}
body[data-page="study"] .bubble.lao{
  background:rgba(255,250,239,.72);border:1px solid #D5C2A2;border-left:3px solid #B0824D;
  color:var(--study-ink);box-shadow:0 calc(5 * var(--u)) calc(14 * var(--u)) rgba(94,67,35,.06);
}
body[data-page="study"] .bubble.user{background:#834432;border-color:#834432;color:#FFF1DF;box-shadow:none}
body[data-page="study"] .bubble.opening{color:#7B4030}
body[data-page="study"] .bubble .em{color:#93602F}
body[data-page="study"] .bubble.thinking i{background:var(--study-muted)}
body[data-page="study"] .ask-head{color:var(--study-muted)}
body[data-page="study"] .ask{background:rgba(255,250,239,.55);border-color:#D3C0A0}
body[data-page="study"] .ask:active,
body[data-page="study"] .ask.is-pressed{background:rgba(255,250,239,.85);border-color:#B99B70}
body[data-page="study"] .ask-text{color:var(--study-ink)}
body[data-page="study"] .ask-badge{color:var(--study-cinnabar)}
body[data-page="study"] .ask-chev{color:#A58D6D}
body[data-page="study"] .album-head{
  display:flex;align-items:center;justify-content:center;gap:calc(12 * var(--u));color:#746047;
}
body[data-page="study"] .album-head::before,
body[data-page="study"] .album-head::after{content:'';width:calc(34 * var(--u));height:1px;background:#B9A584}
body[data-page="study"] .seal{
  background:rgba(255,250,239,.62);border:calc(1.5 * var(--u)) solid rgba(130,97,58,.3);
  color:#5B4630;box-shadow:none;
}
body[data-page="study"] .seal.open{
  background:#FFF7E7;border:calc(2 * var(--u)) solid #B38443;color:#8C592D;
  box-shadow:0 calc(5 * var(--u)) calc(14 * var(--u)) rgba(118,79,36,.1);animation:none;
}
body[data-page="study"] .seal.locked{
  background:rgba(107,92,66,.035);border:calc(1.5 * var(--u)) dashed rgba(104,88,63,.35);
  color:#8A7B67;opacity:.78;
}
body[data-page="study"] .seal.passed{
  background:var(--study-cinnabar);border-color:var(--study-cinnabar);color:#FFF0DC;
  text-shadow:none;box-shadow:none;
}
body[data-page="study"] .seal-sub{color:#8A775F}
body[data-page="study"] .seal-stars,
body[data-page="study"] .seal-cur{color:#9A6B32}
body[data-page="study"] .seal.passed .seal-sub,
body[data-page="study"] .seal.passed .seal-stars,
body[data-page="study"] .seal.passed .seal-cur{color:#F6D9B9}
body[data-page="study"] .menu-block.menu-done{opacity:.62}
body[data-page="study"] .pill.mix{background:#FFF7E7;border-color:#B38A52;color:#83562D}
body[data-page="study"] .pill.wrong{background:#F1DED2;border-color:#B8765E;color:#874432}
body[data-page="study"] .pill.reset{background:transparent;border-color:#BBA98C;color:#74634F}
body[data-page="study"] .pill.reset.confirming{background:#F1DED2;border-color:#B8765E;color:#874432}
body[data-page="study"] .q-meta{color:var(--study-teal)}
body[data-page="study"] .q-text{color:var(--study-ink)}
body[data-page="study"] .audio-btn{
  color:var(--study-teal);border-color:rgba(71,123,112,.48);background:rgba(255,250,239,.46);
}
body[data-page="study"] .audio-btn.playing{background:#DFE9DD}
body[data-page="study"] .opt.done.right{background:#DFE9DD;border-color:rgba(71,123,112,.5)}
body[data-page="study"] .opt.done.right .ask-badge{color:var(--study-teal)}
body[data-page="study"] .opt.done.wrong{background:#EFD8CC;border-color:rgba(148,72,50,.5)}
body[data-page="study"] .opt.done.wrong .ask-badge{color:var(--study-cinnabar)}
body[data-page="study"] .asm-slot{background:rgba(255,250,239,.48);border-color:rgba(130,97,58,.35)}
body[data-page="study"] .asm.right .asm-slot{border-color:rgba(71,123,112,.55)}
body[data-page="study"] .asm.wrong .asm-slot{border-color:rgba(148,72,50,.55)}
body[data-page="study"] .asm-tip,
body[data-page="study"] .asm-sep{color:var(--study-muted)}
body[data-page="study"] .asm-hole{color:rgba(59,49,37,.3)}
body[data-page="study"] .asm-chip{background:#F9F0DF;color:var(--study-ink);border-color:#CBB493}
body[data-page="study"] .asm-chip.done{opacity:.65}
body[data-page="study"] .asm-submit.ready{background:var(--study-cinnabar);border-color:var(--study-cinnabar);color:#FFF0DC}
body[data-page="study"] .src-card{background:#DFE9DD;border-left-color:var(--study-teal);color:#4E675B}
body[data-page="study"] .stars{color:#9A6B32;text-shadow:none}
body[data-page="study"] .stamp{
  color:var(--study-cinnabar);border-color:var(--study-cinnabar);text-shadow:none;
  box-shadow:inset 0 0 calc(12 * var(--u)) rgba(148,72,50,.08);
}
body[data-page="study"] .dao-badge{
  color:var(--study-cinnabar);border-color:var(--study-cinnabar);text-shadow:none;
  box-shadow:inset 0 0 calc(18 * var(--u)) rgba(148,72,50,.08),0 0 calc(22 * var(--u)) rgba(148,72,50,.12);
}

body[data-page="home"] .poster-actions{display:flex;align-items:center;justify-content:center;gap:calc(12 * var(--u))}
body[data-page="home"] .poster-save,
body[data-page="home"] .poster-actions .poster-close{
  min-height:44px;display:flex;align-items:center;justify-content:center;
  padding:calc(8 * var(--u)) calc(24 * var(--u));border-radius:999px;cursor:pointer;
  font-family:var(--font-body);font-size:calc(15 * var(--u));letter-spacing:calc(1.5 * var(--u));
}
body[data-page="home"] .poster-save{
  border:1px solid rgba(255,255,255,.12);background:linear-gradient(135deg,#E7C584,#CF7952);
  color:#152033;box-shadow:0 calc(6 * var(--u)) calc(18 * var(--u)) rgba(207,121,82,.2);
}
body[data-page="home"] .poster-actions .poster-close{background:rgba(236,228,211,.05);border:1px solid rgba(236,228,211,.22);color:var(--cream)}

/* 翻卡 · 魔术师蛇形展牌 */
body[data-page="cards"] .vortex{touch-action:pan-y;cursor:grab;outline:none}
body[data-page="cards"] .vortex.dragging{cursor:grabbing}
body[data-page="cards"] .magic-deck{position:absolute;inset:0}
body[data-page="cards"] .magic-guide{
  position:absolute;top:15%;left:0;right:0;z-index:400;text-align:center;pointer-events:none;
}
body[data-page="cards"] .magic-guide span{
  display:block;color:var(--ui-copper);font-family:var(--font-sans);font-size:calc(10 * var(--u));
  letter-spacing:calc(4 * var(--u));text-transform:uppercase;
}
body[data-page="cards"] .magic-guide strong{
  display:block;margin-top:calc(10 * var(--u));color:var(--ui-gold);font-family:var(--font-title);
  font-size:calc(25 * var(--u));font-weight:400;letter-spacing:calc(3 * var(--u));
}
body[data-page="cards"] .magic-guide i{
  display:block;margin-top:calc(8 * var(--u));color:var(--ui-dim);font-family:var(--font-sans);
  font-size:calc(8 * var(--u));font-style:normal;letter-spacing:calc(3 * var(--u));
}
body[data-page="cards"] .magic-foot{
  position:absolute;bottom:16%;left:0;right:0;z-index:400;text-align:center;pointer-events:none;
  color:var(--ui-dim);font-family:var(--font-sans);font-size:calc(11 * var(--u));letter-spacing:calc(2 * var(--u));
}
body[data-page="cards"] .magic-card{
  position:absolute;left:50%;top:47%;width:calc(84 * var(--u));height:calc(134 * var(--u));
  display:flex;align-items:center;justify-content:center;border-radius:calc(9 * var(--u));
  background-size:cover;background-position:center;border:1px solid rgba(166,124,46,.62);
  box-shadow:0 calc(8 * var(--u)) calc(18 * var(--u)) rgba(0,0,0,.48);
  transform-origin:50% 50%;will-change:transform,opacity;
  transition:transform .16s ease,opacity .16s ease,border-color .16s ease,box-shadow .16s ease;
  user-select:none;-webkit-user-select:none;
}
body[data-page="cards"] .magic-card b{
  color:rgba(51,41,26,.82);font-family:'Youran';font-size:calc(21 * var(--u));font-weight:400;pointer-events:none;
}
body[data-page="cards"] .magic-card.current{
  border-color:rgba(243,161,111,.95);
  box-shadow:0 calc(12 * var(--u)) calc(30 * var(--u)) rgba(0,0,0,.52),0 0 calc(24 * var(--u)) rgba(243,161,111,.3);
}
body[data-page="cards"] .magic-card.chosen{
  border-color:var(--ui-gold);
  animation:magicChosen .32s ease both;
}
@keyframes magicChosen{
  to{transform:translate(-50%,-50%) translate(0,-54px) scale(1.32);opacity:0}
}
@media (prefers-reduced-motion:reduce){
  body[data-page="cards"] .magic-card{transition:none}
  body[data-page="cards"] .magic-card.chosen{animation:none}
}

/* 主页模块标题与基本节奏统一 */
body[data-page="home"] .features::before{
  position:relative;margin-bottom:calc(8 * var(--u));padding-left:calc(30 * var(--u));
  background:linear-gradient(var(--ui-copper),var(--ui-copper)) left center/calc(20 * var(--u)) 2px no-repeat;
  color:var(--ui-gold);font-family:var(--font-title);font-size:calc(20 * var(--u));font-weight:400;
  letter-spacing:calc(2 * var(--u));line-height:1.2;
}
body[data-page="home"] .ai-header{margin-bottom:calc(8 * var(--u));align-items:center}
body[data-page="home"] .ai-title{
  color:var(--ui-gold);font-family:var(--font-title);font-size:calc(20 * var(--u));font-weight:400;
  letter-spacing:calc(2 * var(--u));line-height:1.2;text-shadow:none;
}
body[data-page="home"] .feature-label,
body[data-page="home"] .ai-name{
  color:var(--ui-text);font-family:var(--font-title);font-size:calc(19 * var(--u));font-weight:400;
  letter-spacing:calc(1.5 * var(--u));line-height:1.25;
}
body[data-page="home"] .feature-note,
body[data-page="home"] .ai-desc{
  color:#B6AD9D;font-family:'Wenkai','Kaiti SC','KaiTi',serif;font-size:calc(12 * var(--u));
  line-height:1.4;letter-spacing:calc(.3 * var(--u));
}
body[data-page="home"] .feature-card{height:calc(64 * var(--u))}
body[data-page="home"] .ai-card{min-height:calc(64 * var(--u))}
body[data-page="home"] .ai-avatar{width:calc(46 * var(--u));height:calc(46 * var(--u))}

/* 主页书籍入口与简介抽屉 */
body[data-page="home"] .brand{
  position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;
  margin:0;padding-top:calc(6 * var(--u));text-align:center;
}
body[data-page="home"] .brand::before{display:none}
body[data-page="home"] .brand-book-button{
  position:relative;z-index:2;display:block;padding:0;border:0;border-radius:calc(7 * var(--u));background:transparent;cursor:pointer;
}
body[data-page="home"] .brand-book{width:calc(124 * var(--u));display:block}
body[data-page="home"] .brand-copy{position:static;display:flex;flex-direction:column;align-items:center;min-width:0;margin-top:calc(18 * var(--u))}
body[data-page="home"] .brand-title{
  grid-column:auto;margin:0;font-size:calc(32 * var(--u));letter-spacing:calc(4 * var(--u));text-indent:calc(4 * var(--u));line-height:1.2;
}
body[data-page="home"] .brand-en{display:none}
body[data-page="home"] .brand-keywords{display:none}
body[data-page="home"] .brand-actions{display:flex;align-items:center;justify-content:center;gap:calc(26 * var(--u));margin-top:calc(12 * var(--u))}
body[data-page="home"] .brand-actions button,
body[data-page="home"] .brand-actions a{
  display:inline-flex;align-items:center;justify-content:center;height:32px;padding:0;
  border:0;border-bottom:1px solid transparent;background:transparent;color:var(--ui-copper);
  font-family:'Wenkai','Kaiti SC','KaiTi',serif;font-size:calc(14 * var(--u));line-height:1;
  cursor:pointer;text-decoration:none;vertical-align:middle;
}
body[data-page="home"] .brand-actions a{color:var(--ui-gold);border-bottom-color:rgba(232,201,126,.42)}
body[data-page="home"] .brand-actions span{display:none}
body[data-page="home"] .brand-book-button:focus-visible,
body[data-page="home"] .brand-actions button:focus-visible,
body[data-page="home"] .brand-actions a:focus-visible{outline:2px solid var(--ui-gold);outline-offset:4px}

body[data-page="home"] .book-intro{position:fixed;inset:0;z-index:110;display:flex;align-items:flex-end;justify-content:center}
body[data-page="home"] .book-intro[hidden]{display:none}
body[data-page="home"] .book-intro-backdrop{
  position:absolute;inset:0;background:rgba(4,8,17,.74);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  opacity:0;transition:opacity .25s ease;
}
body[data-page="home"] .book-intro-panel{
  position:relative;width:min(100%,430px);max-height:82vh;max-height:82dvh;overflow-y:auto;
  padding:calc(12 * var(--u)) calc(22 * var(--u)) calc(calc(22 * var(--u)) + env(safe-area-inset-bottom,0px));
  border:1px solid rgba(232,201,126,.36);border-bottom:0;border-radius:calc(26 * var(--u)) calc(26 * var(--u)) 0 0;
  background:linear-gradient(155deg,#F1E6D2,#DCC7A7);color:#33291A;
  box-shadow:0 calc(-20 * var(--u)) calc(60 * var(--u)) rgba(0,0,0,.38);
  transform:translateY(102%);transition:transform .3s cubic-bezier(.22,.85,.28,1);
}
body[data-page="home"] .book-intro.on .book-intro-backdrop{opacity:1}
body[data-page="home"] .book-intro.on .book-intro-panel{transform:translateY(0)}
body[data-page="home"] .book-intro-handle{width:calc(42 * var(--u));height:4px;margin:0 auto calc(12 * var(--u));border-radius:4px;background:rgba(86,60,30,.22)}
body[data-page="home"] .book-intro-close{
  position:absolute;top:calc(12 * var(--u));right:calc(12 * var(--u));width:44px;height:44px;
  border:0;border-radius:50%;background:rgba(86,60,30,.06);color:#68472D;font-size:calc(23 * var(--u));cursor:pointer;
}
body[data-page="home"] .book-intro-kicker{color:#9A6B45;font-family:var(--font-sans);font-size:calc(11 * var(--u));letter-spacing:calc(2 * var(--u))}
body[data-page="home"] .book-intro-panel h2{margin-top:calc(7 * var(--u));color:#75452F;font-family:var(--font-title);font-size:calc(28 * var(--u));font-weight:400;letter-spacing:calc(3 * var(--u))}
body[data-page="home"] .book-intro-author{margin-top:calc(8 * var(--u));color:#806F58;font-family:'Wenkai','Kaiti SC','KaiTi',serif;font-size:calc(12 * var(--u))}
body[data-page="home"] .book-intro-copy{
  margin-top:calc(16 * var(--u));color:#3B3125;font-family:'Wenkai','Kaiti SC','KaiTi',serif;
  font-size:calc(15 * var(--u));line-height:1.9;letter-spacing:calc(.4 * var(--u));text-align:justify;
}
body[data-page="home"] .book-intro-tags{list-style:none;display:flex;flex-wrap:wrap;gap:calc(8 * var(--u));margin-top:calc(16 * var(--u))}
body[data-page="home"] .book-intro-tags li{
  padding:calc(4 * var(--u)) calc(9 * var(--u));border:1px solid rgba(117,69,47,.22);border-radius:999px;
  color:#7C5B3D;font-family:'Wenkai','Kaiti SC','KaiTi',serif;font-size:calc(11 * var(--u));
}
body[data-page="home"] .book-intro-toc{
  margin-top:calc(20 * var(--u));min-height:calc(48 * var(--u));display:flex;align-items:center;justify-content:center;gap:calc(8 * var(--u));
  border-radius:calc(13 * var(--u));background:linear-gradient(135deg,#E7C584,#CF7952);color:#152033;
  font-family:var(--font-body);font-size:calc(17 * var(--u));font-weight:700;letter-spacing:calc(2 * var(--u));
}

@media (max-width:360px){
  body[data-page="home"] .brand{column-gap:calc(14 * var(--u))}
  body[data-page="home"] .brand::before{width:calc(250 * var(--u));height:calc(180 * var(--u))}
  body[data-page="home"] .brand-book{width:calc(104 * var(--u))}
  body[data-page="home"] .brand-title{font-size:calc(28 * var(--u));letter-spacing:calc(3 * var(--u))}
  body[data-page="home"] .brand-keywords{font-size:calc(9.5 * var(--u))}
}
@media (prefers-reduced-motion:reduce){
  body[data-page="home"] .book-intro-backdrop,
  body[data-page="home"] .book-intro-panel{transition:none}
  body[data-page="home"] .brand::before{animation:none}
}

body[data-page="cards"] .magic-burst{
  position:absolute;left:50%;top:47%;z-index:350;width:calc(120 * var(--u));height:calc(120 * var(--u));
  border:1px solid rgba(232,201,126,.72);border-radius:50%;pointer-events:none;opacity:0;
  transform:translate(-50%,-50%) scale(.2);
}
body[data-page="cards"] .magic-burst.go{animation:magicBurst .55s ease-out}
@keyframes magicBurst{
  0%{opacity:.8;transform:translate(-50%,-50%) scale(.2)}
  100%{opacity:0;transform:translate(-50%,-50%) scale(2.6)}
}

body[data-page="home"] .brand-title a{color:inherit;text-decoration:none}
body[data-page="reader"] .reader-head{height:calc(54 * var(--u));border-bottom:1px solid rgba(232,201,126,.12)}
body[data-page="reader"] .reader-main{position:relative;z-index:1;flex:1;min-height:0;display:flex}
body[data-page="reader"] .reader-placeholder{
  margin:auto;padding:calc(30 * var(--u));text-align:center;color:var(--ui-dim);
  font-family:'Wenkai','Kaiti SC','KaiTi',serif;
}
body[data-page="reader"] .reader-placeholder img{
  display:block;width:calc(116 * var(--u));margin:0 auto calc(22 * var(--u));border-radius:calc(7 * var(--u));
  border:1px solid rgba(232,201,126,.3);box-shadow:0 calc(16 * var(--u)) calc(36 * var(--u)) rgba(0,0,0,.38);
}
body[data-page="reader"] .reader-kicker{color:var(--ui-copper);font-family:var(--font-sans);font-size:calc(9 * var(--u));letter-spacing:calc(3 * var(--u))}
body[data-page="reader"] .reader-placeholder h2{margin-top:calc(9 * var(--u));color:var(--ui-gold);font-family:var(--font-title);font-size:calc(26 * var(--u));font-weight:400;letter-spacing:calc(3 * var(--u))}
body[data-page="reader"] .reader-placeholder p:last-child{margin-top:calc(12 * var(--u));font-size:calc(13 * var(--u));line-height:1.7}
body[data-page="reader"] .reader-mount{flex:1;min-height:0;display:flex}
body[data-page="reader"] .reader-mount[hidden]{display:none}
body[data-page="reader"] .reader-frame{width:100%;height:100%;border:0;background:#F4F0E8}

/* 研习室 · 九编长卷闯关 */
body[data-page="study"] .album-head{
  font-family:var(--font-sans);font-size:calc(12 * var(--u));font-weight:400;
  letter-spacing:calc(2 * var(--u));color:#746047;
}
body[data-page="study"] .quest-current{
  position:sticky;top:calc(10 * var(--u));z-index:4;min-height:calc(152 * var(--u));margin:calc(4 * var(--u)) 0 calc(16 * var(--u));
  padding:calc(18 * var(--u));overflow:hidden;border:1px solid #B38A52;border-radius:calc(16 * var(--u));
  background-color:#F3E8D4;background-size:cover;background-position:center;
  box-shadow:0 calc(10 * var(--u)) calc(24 * var(--u)) rgba(94,67,35,.12);
}
body[data-page="study"] .quest-current::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(90deg,#F3E8D4 22%,rgba(243,232,212,.86) 52%,rgba(243,232,212,.12) 100%);
}
body[data-page="study"] .quest-current>*{position:relative;z-index:1}
body[data-page="study"] .quest-current-kicker{color:#9A6B45;font-family:var(--font-sans);font-size:calc(10 * var(--u));letter-spacing:calc(1.5 * var(--u))}
body[data-page="study"] .quest-current-title{
  margin-top:calc(7 * var(--u));color:#75452F;font-family:'Wenkai','Kaiti SC','KaiTi',serif;
  font-size:calc(26 * var(--u));letter-spacing:calc(2 * var(--u));
}
body[data-page="study"] .quest-current-meta{margin-top:calc(5 * var(--u));color:#806F58;font-family:var(--font-sans);font-size:calc(11 * var(--u))}
body[data-page="study"] .quest-start{
  display:inline-flex;align-items:center;justify-content:center;min-height:calc(40 * var(--u));margin-top:calc(13 * var(--u));
  padding:calc(7 * var(--u)) calc(18 * var(--u));border-radius:calc(10 * var(--u));
  background:var(--study-cinnabar);color:#FFF0DC;font-family:'Wenkai','Kaiti SC','KaiTi',serif;
  font-size:calc(14 * var(--u));cursor:pointer;user-select:none;
}
body[data-page="study"] .quest-path{position:relative;display:flex;flex-direction:column;padding-left:calc(14 * var(--u))}
body[data-page="study"] .quest-path::before{
  content:'';position:absolute;left:calc(3 * var(--u));top:calc(10 * var(--u));bottom:calc(10 * var(--u));
  width:1px;background:#C5AC82;
}
body[data-page="study"] .quest-node,
body[data-page="study"] .quest-node.open,
body[data-page="study"] .quest-node.passed,
body[data-page="study"] .quest-node.locked{
  height:auto;min-height:calc(54 * var(--u));display:grid;grid-template-columns:calc(28 * var(--u)) minmax(0,1fr) auto;
  align-items:center;gap:calc(10 * var(--u));padding:calc(8 * var(--u)) calc(4 * var(--u)) calc(8 * var(--u)) calc(12 * var(--u));
  border:0;border-bottom:1px solid rgba(130,97,58,.18);border-radius:0;background:transparent;
  color:#5B4630;box-shadow:none;text-shadow:none;cursor:pointer;opacity:1;
}
body[data-page="study"] .quest-node.current{background:rgba(179,132,67,.12);border-bottom-color:transparent;border-radius:calc(10 * var(--u))}
body[data-page="study"] .quest-node.locked{color:#8A7B67;opacity:.62;cursor:default}
body[data-page="study"] .quest-node.passed{color:var(--study-cinnabar)}
body[data-page="study"] .quest-index{
  width:calc(26 * var(--u));height:calc(26 * var(--u));display:flex;align-items:center;justify-content:center;
  border:1px solid rgba(130,97,58,.32);border-radius:50%;color:#9A6B32;
  font-family:'Wenkai','Kaiti SC','KaiTi',serif;font-size:calc(12 * var(--u));
}
body[data-page="study"] .quest-name{
  min-width:0;color:inherit;font-family:'Wenkai','Kaiti SC','KaiTi',serif;
  font-size:calc(17 * var(--u));line-height:1.3;
}
body[data-page="study"] .quest-state{
  color:#8A775F;font-family:var(--font-sans);font-size:calc(10.5 * var(--u));text-align:right;white-space:nowrap;
}
body[data-page="study"] .quest-node.current .quest-state{color:#9A6B32}
body[data-page="study"] .quest-node.passed .quest-state{color:var(--study-cinnabar)}

body[data-page="home"] .company-info{
  order:6;padding:calc(16 * var(--u)) calc(16 * var(--u)) calc(14 * var(--u));
  border-top:1px solid rgba(232,201,126,.08);text-align:center;
  color:rgba(182,173,157,.72);font-family:var(--font-sans);font-size:calc(10.5 * var(--u));
  line-height:1.75;letter-spacing:calc(.4 * var(--u));
}
body[data-page="home"] .company-info p+p{margin-top:calc(2 * var(--u))}