/* ===== 景区服务与管理 · 题库 ===== */
:root{
  --bg:#0b0e18; --bg2:#111528; --card:rgba(255,255,255,.055); --card2:rgba(255,255,255,.085);
  --line:rgba(255,255,255,.10); --txt:#eef1f8; --dim:#96a0bb; --dim2:#6f7a95;
  --acc:#7c9cff; --acc2:#66e0c8; --ok:#3ddc97; --no:#ff6b81; --warn:#ffc857;
  --radius:20px; --tab-h:64px;
  --fs:1;
  --shadow:0 18px 44px rgba(0,0,0,.42);
}
html{font-size:calc(16px * var(--fs)); -webkit-text-size-adjust:100%}
*{box-sizing:border-box; -webkit-tap-highlight-color:transparent}
html,body{margin:0;padding:0}
body{
  background:radial-gradient(1200px 600px at 15% -10%, #1b2246 0%, transparent 60%),
             radial-gradient(1000px 700px at 95% 5%, #17303a 0%, transparent 55%), var(--bg);
  color:var(--txt); font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
  line-height:1.62; min-height:100vh; overflow-x:hidden;
}
[data-theme="light"]{
  --bg:#f3f5fb; --bg2:#fff; --card:rgba(255,255,255,.88); --card2:#fff;
  --line:rgba(20,30,60,.10); --txt:#1a2136; --dim:#5b6683; --dim2:#8590ab;
  --shadow:0 14px 34px rgba(30,45,90,.10);
}
[data-theme="light"] body{
  background:radial-gradient(1100px 520px at 12% -8%, #dfe6ff 0%, transparent 62%),
             radial-gradient(900px 600px at 96% 4%, #d9f6ef 0%, transparent 58%), var(--bg);
}
[data-theme="light"] .hero-mask{background:linear-gradient(180deg,rgba(10,14,30,.18) 0%,rgba(10,14,30,.72) 60%,#f3f5fb 100%)}

.glow{position:fixed; border-radius:50%; filter:blur(90px); opacity:.32; pointer-events:none; z-index:0}
.g1{width:420px;height:420px;background:#4a63ff;top:-160px;left:-120px}
.g2{width:360px;height:360px;background:#12a89b;bottom:-140px;right:-120px}
[data-theme="light"] .glow{opacity:.18}

.view{display:none; position:relative; z-index:1; padding-bottom:calc(var(--tab-h) + 18px)}
.view.active{display:block; animation:in .32s cubic-bezier(.2,.7,.3,1)}
@keyframes in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* ---------- 首页 hero ---------- */
.hero{padding:calc(18px + env(safe-area-inset-top,0px)) 0 0}
.hero-top{max-width:980px; margin:0 auto; padding:14px 20px 12px}
.hero-kicker{margin:0 0 6px; font-size:.72rem; letter-spacing:.22em; color:var(--dim); text-transform:uppercase}
.hero h1{margin:0; font-size:2rem; line-height:1.18; letter-spacing:.01em}
.hero-sub{margin:8px 0 0; color:var(--dim); font-size:.88rem}
.hero-media{position:relative; max-width:980px; margin:0 auto; border-radius:22px; overflow:hidden;
  aspect-ratio:16/10; background:var(--bg2); box-shadow:var(--shadow)}
.hero-img{width:100%; height:100%; object-fit:cover; object-position:50% 22%; display:block}
.hero-glow{position:absolute; inset:auto 0 0 0; height:46%;
  background:linear-gradient(180deg,transparent,color-mix(in srgb, var(--bg) 88%, transparent))}
[data-theme="light"] .hero-glow{background:linear-gradient(180deg,transparent,#f3f5fb)}
.hero-in{max-width:980px; margin:-34px auto 0; padding:0 20px; position:relative; z-index:2}
.hero-stats{display:flex; gap:10px; margin-bottom:12px}
.hero-stats div{flex:1; background:var(--card); border:1px solid var(--line); backdrop-filter:blur(14px); border-radius:14px; padding:9px 10px; text-align:center}
.hero-stats b{display:block; font-size:1.16rem; line-height:1.2}
.hero-stats span{font-size:.7rem; color:var(--dim)}
.hero-cta{display:flex; gap:10px}

/* ---------- 通用容器 ---------- */
.wrap{max-width:980px; margin:0 auto; padding:22px 18px 30px}
.sec-head{display:flex; align-items:baseline; justify-content:space-between; margin:2px 2px 12px}
.sec-head h2{font-size:1.04rem; margin:0; letter-spacing:.02em}
.hint{font-size:.74rem; color:var(--dim)}

.grid{display:grid; grid-template-columns:1fr; gap:14px}
@media(min-width:760px){.grid{grid-template-columns:repeat(2,1fr); gap:16px}}

.card-set{position:relative; border-radius:20px; overflow:hidden; background:var(--card); border:1px solid var(--line);
  cursor:pointer; text-align:left; padding:0; color:inherit; font-family:inherit; display:block;
  transition:transform .16s ease, box-shadow .2s ease;}
.card-set:active{transform:scale(.99)}
.card-set:hover{box-shadow:var(--shadow)}
.card-set .img{position:relative; aspect-ratio:16/9; overflow:hidden}
.card-set .img img{width:100%; height:100%; object-fit:cover; display:block; transition:transform .5s ease}
.card-set:hover .img img{transform:scale(1.04)}
.card-set .img::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 62%,rgba(8,10,20,.55) 100%)}
.card-set .no{position:absolute; top:10px; left:11px; z-index:2; font-size:.7rem; letter-spacing:.14em; padding:4px 9px;
  border-radius:9px; background:rgba(10,14,26,.6); border:1px solid rgba(255,255,255,.22); backdrop-filter:blur(8px); color:#fff}
.card-set .cap{padding:11px 13px 13px}
.card-set .cap b{display:block; font-size:1.02rem; line-height:1.3}
.card-set .cap span{font-size:.72rem; color:var(--dim); display:block; margin-top:3px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.card-set .prog{margin-top:9px; height:5px; border-radius:99px; background:rgba(255,255,255,.16); overflow:hidden}
[data-theme="light"] .card-set .prog{background:rgba(20,30,60,.12)}
.card-set .prog i{display:block; height:100%; width:0; border-radius:99px; background:linear-gradient(90deg,#7c9cff,#66e0c8); transition:width .4s ease}
.card-set .stat{position:absolute; top:10px; right:11px; z-index:2; font-size:.68rem; padding:4px 8px; border-radius:8px; color:#fff;
  background:rgba(10,14,26,.6); border:1px solid rgba(255,255,255,.2); backdrop-filter:blur(8px)}
.card-set .kinds{display:flex; gap:5px; margin-top:8px; flex-wrap:wrap}
.card-set .kinds em{font-style:normal; font-size:.62rem; color:var(--dim); border:1px solid var(--line); border-radius:6px; padding:2px 6px}

/* 主题外观：自定义背景 / 文字颜色 */
.lookrow{display:flex; align-items:center; gap:10px; margin:9px 0; font-size:.8rem; color:var(--dim)}
.lookrow span{min-width:52px}
.lookrow input[type=color]{width:42px; height:28px; border:1px solid var(--line); border-radius:8px; background:none; padding:2px}
.lookrow input[type=range]{flex:1; accent-color:#7c9cff}
.lookrow b{font-size:.74rem; color:var(--txt); font-weight:600; min-width:38px; text-align:right}
.tinybtn{font-size:.76rem; padding:6px 11px}
body.custom-bg::before{content:""; position:fixed; inset:0; z-index:-2; background:var(--bg-custom,#0b1020) center/cover no-repeat}
body.custom-bg::after{content:""; position:fixed; inset:0; z-index:-1; background:var(--bg-sheen,rgba(0,0,0,.25))}

.tools{display:grid; grid-template-columns:repeat(2,1fr); gap:10px; margin-top:22px}
@media(min-width:720px){.tools{grid-template-columns:repeat(4,1fr)}}
.tool{display:flex; flex-direction:column; gap:2px; align-items:flex-start; padding:14px 14px 12px; border-radius:16px;
  background:var(--card); border:1px solid var(--line); color:inherit; font-family:inherit; cursor:pointer; text-align:left}
.tool i{font-style:normal; font-size:.95rem; color:var(--acc)}
.tool b{font-size:.86rem}
.tool span{font-size:.7rem; color:var(--dim)}
.tool:active{transform:scale(.98)}

.foot-note{font-size:.7rem; color:var(--dim2); margin:24px 4px 0; line-height:1.7}

/* ---------- 做题页 ---------- */
.qbar{position:sticky; top:0; z-index:20; display:flex; align-items:center; gap:10px; padding:calc(10px + env(safe-area-inset-top,0px)) 12px 10px;
  background:color-mix(in srgb, var(--bg) 78%, transparent); backdrop-filter:blur(18px); border-bottom:1px solid var(--line)}
.icon-btn{width:38px; height:38px; border-radius:12px; border:1px solid var(--line); background:var(--card);
  color:var(--txt); font-size:1.2rem; line-height:1; cursor:pointer; font-family:inherit}
.icon-btn:active{transform:scale(.95)}
.qbar-mid{flex:1; min-width:0}
.qbar-title{font-size:.86rem; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.progress{height:5px; border-radius:99px; background:rgba(255,255,255,.13); margin-top:6px; overflow:hidden}
.progress i{display:block; height:100%; width:0; background:linear-gradient(90deg,#7c9cff,#66e0c8); transition:width .3s ease}
.qbar-count{font-size:.76rem; color:var(--dim); font-variant-numeric:tabular-nums}

.qwrap{max-width:820px; margin:0 auto; padding:16px 14px 120px}
.card{background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:18px 16px; box-shadow:var(--shadow)}
[data-theme="light"] .card{background:#fff}

.qmeta{display:flex; align-items:center; gap:8px; margin-bottom:10px}
.tag{font-size:.66rem; letter-spacing:.06em; padding:3px 9px; border-radius:8px; background:rgba(124,156,255,.16);
  color:var(--acc); border:1px solid rgba(124,156,255,.28)}
[data-theme="light"] .tag{background:rgba(90,120,255,.10)}
.qidx{font-size:.7rem; color:var(--dim2)}
.star{margin-left:auto; background:none; border:0; font-size:1.1rem; color:var(--dim2); cursor:pointer; padding:2px 4px; line-height:1}
.star.on{color:var(--warn); text-shadow:0 0 14px rgba(255,200,87,.5)}
.stem{font-size:1.02rem; line-height:1.75; margin:2px 0 16px; font-weight:600; letter-spacing:.01em}

.opts{display:flex; flex-direction:column; gap:9px}
.opt{display:flex; gap:10px; align-items:flex-start; padding:12px 13px; border-radius:14px; background:var(--card2);
  border:1px solid var(--line); cursor:pointer; text-align:left; color:inherit; font-family:inherit; font-size:.94rem;
  transition:border-color .18s ease, background .18s ease, transform .1s ease}
[data-theme="light"] .opt{background:#f7f9ff}
.opt:active{transform:scale(.99)}
.opt .k{flex:0 0 24px; height:24px; border-radius:8px; display:grid; place-items:center; font-size:.78rem; font-weight:700;
  background:rgba(255,255,255,.1); border:1px solid var(--line)}
[data-theme="light"] .opt .k{background:#eef2ff}
.opt .t{flex:1; padding-top:1px}
.opt.sel{border-color:rgba(124,156,255,.7); background:rgba(124,156,255,.14)}
.opt.ok{border-color:rgba(61,220,151,.7); background:rgba(61,220,151,.14)}
.opt.ok .k{background:rgba(61,220,151,.28); border-color:rgba(61,220,151,.5)}
.opt.no{border-color:rgba(255,107,129,.7); background:rgba(255,107,129,.13)}
.opt.no .k{background:rgba(255,107,129,.26); border-color:rgba(255,107,129,.5)}
.opt.dim{opacity:.55}
.opt[disabled]{cursor:default}

.inputwrap{display:flex; flex-direction:column; gap:10px}
.inputwrap textarea{width:100%; min-height:96px; resize:vertical; border-radius:14px; padding:12px 13px; font-family:inherit;
  font-size:.92rem; line-height:1.7; background:var(--card2); border:1px solid var(--line); color:var(--txt)}
[data-theme="light"] .inputwrap textarea{background:#f7f9ff}
.selfgrade{display:flex; gap:9px}
.selfgrade .btn{flex:1; padding:10px}

.feedback{margin-top:16px; border-radius:14px; border:1px solid var(--line); background:rgba(255,255,255,.04); padding:13px 13px 11px;
  animation:in .25s ease}
[data-theme="light"] .feedback{background:#f7f9ff}
.fb-head{display:flex; align-items:center; gap:8px; font-size:.9rem; margin-bottom:8px; flex-wrap:wrap}
.fb-head b{font-weight:700}
.fb-head .good{color:var(--ok)} .fb-head .bad{color:var(--no)}
.fb-body{border-top:1px dashed var(--line); padding-top:9px}
.fb-label{font-size:.66rem; letter-spacing:.16em; color:var(--dim2); text-transform:uppercase}
.fb-body p{margin:5px 0 0; font-size:.9rem; line-height:1.8; color:var(--txt); opacity:.95; white-space:pre-wrap}

.qactions{display:flex; gap:10px; margin-top:16px}
.qactions .btn{flex:1}
.qjump{display:flex; flex-wrap:wrap; gap:6px; margin-top:26px; padding-top:14px; border-top:1px solid var(--line)}
.qjump button{width:30px; height:30px; border-radius:9px; border:1px solid var(--line); background:var(--card);
  color:var(--dim); font-size:.72rem; font-family:inherit; cursor:pointer; font-variant-numeric:tabular-nums}
.qjump button.done{color:var(--ok); border-color:rgba(61,220,151,.34)}
.qjump button.bad{color:var(--no); border-color:rgba(255,107,129,.34)}
.qjump button.cur{background:linear-gradient(135deg,#7c9cff,#66e0c8); color:#0a1020; border-color:transparent; font-weight:700}

/* ---------- 结果 ---------- */
.result{text-align:center; padding-top:34px}
.ring{position:relative; width:172px; height:172px; margin:0 auto 12px}
.ring svg{width:100%; height:100%; transform:rotate(-90deg)}
.ring circle{fill:none; stroke-width:9; stroke-linecap:round}
.ring-bg{stroke:rgba(255,255,255,.1)}
.ring-fg{stroke:url(#g); stroke:#66e0c8; stroke-dasharray:327; stroke-dashoffset:327; transition:stroke-dashoffset .9s cubic-bezier(.2,.8,.3,1)}
.ring-num{position:absolute; inset:0; display:grid; place-content:center; gap:0}
.ring-num b{font-size:2rem; line-height:1.1}
.ring-num span{font-size:.7rem; color:var(--dim)}
.result h2{margin:6px 0 4px; font-size:1.15rem}
.rs-sub{margin:0 0 18px; color:var(--dim); font-size:.84rem}
.rs-grid{display:flex; gap:10px; margin-bottom:20px}
.rs-grid div{flex:1; background:var(--card); border:1px solid var(--line); border-radius:14px; padding:12px 8px}
.rs-grid b{display:block; font-size:1.16rem}
.rs-grid span{font-size:.68rem; color:var(--dim)}
.rs-btns{display:flex; flex-direction:column; gap:9px}

/* ---------- 列表 ---------- */
.list{display:flex; flex-direction:column; gap:9px}
.item{background:var(--card); border:1px solid var(--line); border-radius:14px; padding:12px 13px; cursor:pointer; text-align:left;
  color:inherit; font-family:inherit; width:100%}
.item:active{transform:scale(.995)}
.item .row1{display:flex; gap:8px; align-items:center; font-size:.68rem; color:var(--dim2); margin-bottom:4px}
.item .row1 .mini-tag{padding:1px 6px; border-radius:6px; background:rgba(124,156,255,.14); color:var(--acc)}
.item .q{font-size:.9rem; line-height:1.6; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden}
.item .meta{margin-top:6px; font-size:.7rem; color:var(--dim)}
.empty{text-align:center; color:var(--dim); font-size:.86rem; padding:48px 0}
.searchbox{margin-bottom:12px}
.searchbox input{width:100%; padding:12px 14px; border-radius:14px; border:1px solid var(--line); background:var(--card);
  color:var(--txt); font-family:inherit; font-size:.9rem}
.searchbox input:focus{outline:none; border-color:rgba(124,156,255,.6)}

/* ---------- 设置 ---------- */
.setblock{background:var(--card); border:1px solid var(--line); border-radius:16px; padding:14px; margin-bottom:11px}
.setblock>label{font-size:.78rem; color:var(--dim); display:block; margin-bottom:9px}
.seg{display:flex; gap:6px; background:rgba(255,255,255,.05); padding:4px; border-radius:11px}
.seg button{flex:1; border:0; background:transparent; color:var(--dim); font-family:inherit; font-size:.82rem; padding:8px 4px;
  border-radius:8px; cursor:pointer; transition:.16s}
.seg button.on{background:var(--card2); color:var(--txt); font-weight:600; box-shadow:0 2px 10px rgba(0,0,0,.18)}
[data-theme="light"] .seg{background:#eef2fb}
[data-theme="light"] .seg button.on{background:#fff; color:#1a2136}
.btns{display:flex; gap:9px}
.btns .btn{flex:1; padding:10px; font-size:.84rem}
.tiny{font-size:.68rem; color:var(--dim2); margin:10px 0 0}

/* ---------- 底部 tab ---------- */
.tabbar{position:fixed; left:0; right:0; bottom:0; z-index:30; height:calc(var(--tab-h) + env(safe-area-inset-bottom,0px));
  padding-bottom:env(safe-area-inset-bottom,0px); display:flex; align-items:center;
  background:color-mix(in srgb, var(--bg) 84%, transparent); backdrop-filter:blur(20px); border-top:1px solid var(--line)}
.tabbar button{flex:1; background:none; border:0; color:var(--dim2); font-family:inherit; display:flex; flex-direction:column;
  align-items:center; gap:3px; padding:6px 0; cursor:pointer; font-size:.64rem}
.tabbar button i{font-style:normal; font-size:1rem; line-height:1}
.tabbar button.on{color:var(--acc)}

.toast{position:fixed; left:50%; bottom:calc(var(--tab-h) + 24px); transform:translate(-50%,14px); opacity:0; pointer-events:none;
  background:rgba(20,26,44,.94); color:#fff; border:1px solid rgba(255,255,255,.16); padding:9px 16px; border-radius:999px;
  font-size:.8rem; transition:.24s; z-index:60; max-width:86vw; text-align:center}
.toast.on{opacity:1; transform:translate(-50%,0)}

/* 做题页背景插画 */
body.has-cover .qwrap::before{content:""; position:fixed; inset:0; z-index:-1; background-image:var(--cover); background-size:cover;
  background-position:center; opacity:.14; filter:saturate(.9)}
body.has-cover .qwrap::after{content:""; position:fixed; inset:0; z-index:-1; background:linear-gradient(180deg,rgba(11,14,24,.55),rgba(11,14,24,.9))}
[data-theme="light"] body.has-cover .qwrap::after{background:linear-gradient(180deg,rgba(243,245,251,.62),rgba(243,245,251,.94))}

/* 横屏 / 平板 */
@media (min-width:900px) and (orientation:landscape){
  .qwrap{max-width:900px}
}
@media (max-height:480px) and (orientation:landscape){
  .qwrap{padding-bottom:80px}
}

@media (prefers-reduced-motion:reduce){*{animation:none!important; transition:none!important}}
/* ---------- 章内页 ---------- */
.ch-hero{position:relative; min-height:250px; display:flex; align-items:flex-end; overflow:hidden}
.ch-img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 30%}
.ch-mask{position:absolute; inset:0; background:linear-gradient(180deg,rgba(11,14,24,.10) 0%,rgba(11,14,24,.55) 45%,var(--bg) 100%)}
[data-theme="light"] .ch-mask{background:linear-gradient(180deg,rgba(10,14,30,.14),rgba(10,14,30,.62) 52%,#f3f5fb 100%)}
.ch-back{position:absolute; top:calc(12px + env(safe-area-inset-top,0px)); left:12px; z-index:3}
.ch-in{position:relative; z-index:2; width:100%; max-width:820px; margin:0 auto; padding:0 18px 14px}
.ch-in h2{margin:2px 0 4px; font-size:1.5rem; text-shadow:0 3px 18px rgba(0,0,0,.55)}
.ch-meta{margin:0 0 9px; font-size:.78rem; color:#d5dcf0}
.ch-prog{height:6px; border-radius:99px; background:rgba(255,255,255,.22); overflow:hidden}
.ch-prog i{display:block; height:100%; width:0; border-radius:99px; background:linear-gradient(90deg,#7c9cff,#66e0c8); transition:width .45s ease}

.chips{display:flex; flex-wrap:wrap; gap:7px; margin-bottom:4px}
.chip{border:1px solid var(--line); background:var(--card2); color:var(--dim); font-family:inherit; font-size:.8rem;
  padding:7px 12px; border-radius:11px; cursor:pointer; transition:.16s}
.chip.on{background:linear-gradient(135deg,rgba(124,156,255,.26),rgba(102,224,200,.22)); color:var(--txt);
  border-color:rgba(124,156,255,.55); font-weight:600}
[data-theme="light"] .chip{background:#f7f9ff}
[data-theme="light"] .chip.on{background:linear-gradient(135deg,rgba(124,156,255,.22),rgba(102,224,200,.20)); color:#1a2136}
.btn.big{width:100%; padding:15px; font-size:1rem; border-radius:16px; margin-top:12px}
.btn:disabled{opacity:.45; filter:grayscale(.4)}

.nbanner{margin:0 0 12px; padding:11px 13px; border-radius:14px; font-size:.8rem; line-height:1.65; cursor:pointer;
  background:rgba(255,200,87,.10); border:1px solid rgba(255,200,87,.32); color:#ffd98a}
[data-theme="light"] .nbanner{background:#fff7e4; color:#7a5c12; border-color:#f0d9a8}

/* ---------- 背记 ---------- */
.notes{display:flex; flex-direction:column; gap:9px}
.notes-head h2{font-size:1.02rem; margin:2px 0 3px}
.notes-head .hint{margin:0 0 10px}
.ncard{border:1px solid var(--line); border-radius:15px; background:var(--card); overflow:hidden}
.nhead{display:flex; align-items:center; gap:8px; padding:11px 13px; cursor:pointer; font-size:.88rem}
.nhead b{flex:1; font-weight:600; line-height:1.4}
.nhead i{font-style:normal; color:var(--dim2); font-size:.75rem; transition:transform .2s}
.ncard.fold .nhead i{transform:rotate(-90deg)}
.ncard.fold .nbody{display:none}
.lvb{flex:0 0 auto; font-size:.62rem; padding:2px 7px; border-radius:7px; letter-spacing:.04em}
.ncard.lv3 .lvb{background:rgba(255,107,129,.18); color:#ff8fa1; border:1px solid rgba(255,107,129,.3)}
.ncard.lv2 .lvb{background:rgba(255,200,87,.16); color:#ffce6b; border:1px solid rgba(255,200,87,.3)}
.ncard.lv1 .lvb{background:rgba(124,156,255,.16); color:#9db2ff; border:1px solid rgba(124,156,255,.3)}
[data-theme="light"] .ncard.lv3 .lvb{color:#c0392b}
[data-theme="light"] .ncard.lv2 .lvb{color:#9a6b00}
[data-theme="light"] .ncard.lv1 .lvb{color:#3a55b8}
.nbody{padding:0 13px 11px; border-top:1px dashed var(--line); padding-top:9px}
.nbody p{margin:0 0 6px; font-size:.85rem; line-height:1.75; color:var(--txt); opacity:.94}
.ncard.masked .nbody{filter:blur(5px); user-select:none; transition:filter .2s}
.ncard.masked .nbody:hover{filter:none}

/* ---------- 弹层 ---------- */
.modal{position:fixed; inset:0; z-index:80; display:flex; align-items:flex-end; justify-content:center;
  background:rgba(6,9,18,.62); backdrop-filter:blur(6px); padding:0}
.modal[hidden]{display:none}
.modal-card{width:100%; max-width:520px; background:var(--bg2); border:1px solid var(--line);
  border-radius:22px 22px 0 0; padding:18px 16px calc(18px + env(safe-area-inset-bottom,0px)); animation:up .26s cubic-bezier(.2,.8,.3,1)}
[data-theme="light"] .modal-card{background:#fff}
@media (min-width:720px){.modal{align-items:center; padding:20px} .modal-card{border-radius:22px}}
@keyframes up{from{transform:translateY(28px); opacity:.6}to{transform:none; opacity:1}}
.modal-card h3{margin:0 0 4px; font-size:1.02rem}
.modal-card label{display:block; font-size:.72rem; color:var(--dim); margin:12px 0 7px}

/* ---------- 提前结束按钮 ---------- */
.endbtn{width:auto; padding:0 11px; font-size:.74rem; font-family:inherit; color:var(--dim);
  display:flex; align-items:center; justify-content:center}
.endbtn:active{transform:scale(.96)}

/* ---------- 成绩单 ---------- */
.review{text-align:left; margin-top:26px; padding-top:18px; border-top:1px solid var(--line)}
.review .sec-head{margin-bottom:10px}
.rv{background:var(--card); border:1px solid var(--line); border-radius:15px; padding:12px 13px; margin-bottom:9px}
.rv.ok{border-left:3px solid rgba(61,220,151,.75)}
.rv.bad{border-left:3px solid rgba(255,107,129,.75)}
.rv.skip{border-left:3px solid rgba(255,255,255,.16); opacity:.86}
.rv-top{display:flex; align-items:center; gap:8px; font-size:.68rem; color:var(--dim2); margin-bottom:6px; flex-wrap:wrap}
.rv-top .mini-tag{padding:1px 6px; border-radius:6px; background:rgba(124,156,255,.14); color:var(--acc)}
.rv-top .mk{margin-left:auto; font-weight:700}
.rv-top .mk.ok{color:var(--ok)} .rv-top .mk.bad{color:var(--no)} .rv-top .mk.skip{color:var(--dim2)}
.rv-q{font-size:.92rem; line-height:1.65; font-weight:600; margin-bottom:9px}
.rv-li{display:flex; gap:9px; font-size:.84rem; line-height:1.65; margin-top:5px; align-items:baseline}
.rv-li b{flex:0 0 62px; font-size:.7rem; color:var(--dim2); font-weight:600; letter-spacing:.04em}
.rv-li span{flex:1; white-space:pre-wrap; word-break:break-word}
.rv-li span.ok{color:var(--ok); font-weight:600}
.rv-li span.no{color:var(--no); font-weight:600; text-decoration:line-through; text-decoration-thickness:1px}
.rv-exp{margin-top:9px; padding-top:8px; border-top:1px dashed var(--line)}
.rv-exp b{font-size:.66rem; letter-spacing:.16em; color:var(--dim2); font-weight:600}
.rv-exp p{margin:4px 0 0; font-size:.85rem; line-height:1.8; white-space:pre-wrap; opacity:.94}

/* ---------- 错题本统计 ---------- */
.lstats{margin-bottom:12px}
.lstat-grid{display:flex; gap:9px}
.lstat-grid div{flex:1; background:var(--card); border:1px solid var(--line); border-radius:13px; padding:10px 6px; text-align:center}
.lstat-grid b{display:block; font-size:1.1rem}
.lstat-grid span{font-size:.66rem; color:var(--dim)}
.lstat-line{display:flex; flex-wrap:wrap; gap:6px; align-items:center; margin-top:9px; font-size:.72rem}
.lstat-line b{color:var(--dim2); font-weight:600; font-size:.7rem; margin-right:2px}
.lstat-line em{font-style:normal; padding:3px 8px; border-radius:8px; border:1px solid var(--line);
  background:var(--card2); color:var(--dim)}
.rs-grid.tight{margin:0}
.rs-grid.tight div{padding:9px 6px}

/* ---------- 错题卡片（未掌握/已掌握） ---------- */
.wcard{background:var(--card); border:1px solid var(--line); border-left:3px solid rgba(255,107,129,.6);
  border-radius:14px; padding:11px 13px; margin-bottom:9px}
.wcard.mas{border-left-color:rgba(61,220,151,.6); opacity:.92}
.wmeta{display:flex; flex-wrap:wrap; gap:8px; align-items:center; font-size:.66rem; color:var(--dim2); margin-bottom:5px}
.wmeta .mini-tag{padding:1px 6px; border-radius:6px; background:rgba(124,156,255,.14); color:var(--acc)}
.wmeta .dots{display:inline-flex; gap:3px; margin-left:2px}
.wmeta .dots i{width:7px; height:7px; border-radius:99px; background:rgba(255,255,255,.18); display:block}
.wmeta .dots i.on{background:var(--ok)}
.wq{font-size:.9rem; line-height:1.6; font-weight:600; margin-bottom:7px}
.wans, .wexp{display:flex; gap:8px; font-size:.8rem; line-height:1.7; margin-top:4px}
.wans b, .wexp b{flex:0 0 auto; font-size:.66rem; color:var(--dim2); font-weight:600; letter-spacing:.04em; padding-top:2px}
.wans span{color:var(--ok); white-space:pre-wrap; word-break:break-word}
.wexp span{white-space:pre-wrap; word-break:break-word; opacity:.92}
.wmas{margin-top:12px; border:1px solid var(--line); border-radius:14px; background:var(--card); padding:10px 12px}
.wmas summary{cursor:pointer; font-size:.8rem; color:var(--dim); padding:2px 0}
.wmas .wcard{margin-top:9px; background:var(--card2)}

/* 数字步进器 */
.stepper{display:inline-flex; align-items:center; gap:6px; margin:0 4px}
.stepper button{width:30px; height:30px; border-radius:9px; border:1px solid var(--line); background:var(--card2);
  color:var(--txt); font-family:inherit; font-size:.95rem; cursor:pointer; line-height:1}
.stepper button:active{transform:scale(.94)}
.stepper b{min-width:22px; text-align:center; font-variant-numeric:tabular-nums}

/* ---------- 横屏 / 转竖屏 ---------- */
/* 能锁方向的直接锁；锁不了就整页转 90°，把人手上的竖屏当横屏用 */
body.force-land{position:fixed; top:0; left:0; width:100vh; height:100vw; min-height:0;
  transform:rotate(90deg) translateY(-100%); transform-origin:top left;
  overflow-y:auto; overflow-x:hidden; -webkit-overflow-scrolling:touch}
html.force-land-on{overflow:hidden}
body.force-land .qbar{padding-top:10px}
body.force-land .opts{display:grid; grid-template-columns:1fr 1fr; gap:10px; align-items:start}
body.force-land .qwrap{max-width:1080px; margin:0 auto; padding-bottom:20px}
body.force-land{overflow:hidden}
body.force-land .view.active{position:absolute; left:0; right:0; top:0;
  bottom:calc(var(--tab-h) + env(safe-area-inset-bottom,0px));
  overflow-y:auto; -webkit-overflow-scrolling:touch;
  padding-bottom:14px; animation:none}
body.force-land .view{min-height:0}
body.force-land .tabbar{position:absolute; left:0; right:0; width:auto}
body.force-land .glow{display:none}
body.force-land .ch-hero{height:190px}
body.force-land .set-grid{grid-template-columns:1fr 1fr}
.rotbtn{font-size:1rem; line-height:1}
