/* 汉字抽卡 · 移动端前台 v1.0.0 */
:root{
  --bg:#0d0b0a;
  --bg2:#141110;
  --panel:#1a1613;
  --panel2:#211b16;
  --line:#2e2720;
  --text:#ece4d6;
  --muted:#94897a;
  --gold:#c9a55c;
  --gold-soft:#e2c98d;
  --ink:#dbcdb2;
  --red:#c0503f;
  --n:#9aa8b2;
  --r:#4e9ec9;
  --sr:#a06fd4;
  --ssr:#e0a03c;
  --ur:#d9534f;
  --serif:"Songti SC","STSong","SimSun","KaiTi",serif;
  --sans:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;padding:0;height:100%}
body{
  background:var(--bg);color:var(--text);font-family:var(--sans);
  overscroll-behavior:none;-webkit-font-smoothing:antialiased;
}
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background:
    radial-gradient(700px 380px at 50% -8%,rgba(201,165,92,.10),transparent 65%),
    radial-gradient(500px 300px at 110% 100%,rgba(192,80,63,.07),transparent 70%);
}
button{font-family:inherit}
h1,h2,h3,p{margin:0}

/* ============ 骨架 ============ */
#app{position:relative;z-index:1;height:100%}
.shell{display:flex;flex-direction:column;height:100dvh;max-width:560px;margin:0 auto;position:relative}

.hud{
  flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;
  padding:10px 16px 8px;border-bottom:1px solid rgba(46,39,32,.7);
  background:linear-gradient(180deg,rgba(13,11,10,.96),rgba(13,11,10,.75));
  backdrop-filter:blur(8px);position:relative;z-index:5;
}
.hud-left{display:flex;align-items:center;gap:9px;min-width:0}
.hud-seal{
  width:32px;height:32px;flex:0 0 32px;border-radius:8px;display:grid;place-items:center;
  background:linear-gradient(150deg,#a8372c,#7c231b);color:#f8e7c9;
  font-family:var(--serif);font-size:17px;box-shadow:0 0 0 1px rgba(226,201,141,.35) inset,0 3px 10px rgba(168,55,44,.3);
}
.hud-user{display:flex;flex-direction:column;line-height:1.25;min-width:0}
.hud-user strong{font-size:13.5px;font-weight:600;max-width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hud-user span{font-size:10.5px;color:var(--gold);letter-spacing:.5px}
.hud-right{display:flex;align-items:center;gap:8px}
.hud-ink,.hud-coin{
  display:flex;align-items:center;gap:5px;padding:5px 11px;border-radius:20px;
  background:rgba(33,27,22,.9);border:1px solid var(--line);font-size:12px;
}
.hud-ink b,.hud-coin b{color:var(--gold-soft);font-weight:600}
.hud-ink span{color:var(--muted);font-size:10.5px}
.hi-dot{width:7px;height:7px;border-radius:50%;background:radial-gradient(circle at 30% 30%,#8fd0e8,#3b7f9c);box-shadow:0 0 6px rgba(90,180,220,.7)}
.hc-dot{width:7px;height:7px;border-radius:50%;background:radial-gradient(circle at 30% 30%,#e8c98a,#a8792f);box-shadow:0 0 6px rgba(230,190,110,.6)}

.view{flex:1;overflow-y:auto;overflow-x:hidden;padding:0 16px 18px;scroll-behavior:smooth}
.view::-webkit-scrollbar{width:0}
.page{padding-top:14px;padding-bottom:8px;animation:fadeUp .32s ease both}
@keyframes fadeUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

.tabbar{
  flex:0 0 auto;display:grid;grid-template-columns:repeat(6,1fr);
  height:calc(58px + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);
  border-top:1px solid var(--line);background:rgba(17,14,12,.96);backdrop-filter:blur(10px);
}
.tab{background:none;border:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;color:#7b7264}
.tab-ico{
  width:26px;height:26px;border-radius:8px;display:grid;place-items:center;
  font-family:var(--serif);font-size:14px;border:1px solid transparent;transition:.2s;
}
.tab-label{font-size:11px;letter-spacing:.5px}
.tab{position:relative}
.tab-badge{
  position:absolute;top:5px;left:calc(50% + 4px);min-width:15px;height:15px;padding:0 4px;
  border-radius:8px;background:#b8412f;color:#fff2e2;font-size:9px;line-height:15px;text-align:center;
  border:1px solid rgba(13,11,10,.7);box-shadow:0 2px 6px rgba(0,0,0,.35);
}
.tab.on{color:var(--gold)}
.tab.on .tab-ico{background:rgba(201,165,92,.12);border-color:rgba(201,165,92,.4);box-shadow:0 0 14px rgba(201,165,92,.15)}

/* ============ 抽卡首页 ============ */
.hero{text-align:center;padding:6px 0 16px;position:relative}
.hero-seal{
  width:52px;height:52px;margin:0 auto 10px;border-radius:12px;display:grid;place-items:center;
  font-family:var(--serif);font-size:27px;color:#f8e7c9;
  background:linear-gradient(150deg,#a8372c,#76211a);
  box-shadow:0 0 0 1px rgba(226,201,141,.4) inset,0 10px 26px rgba(140,40,30,.35);
}
.hero h1{font-family:var(--serif);font-size:25px;letter-spacing:5px;font-weight:600;color:#f3e9d5}
.hero p{margin-top:6px;font-size:11.5px;color:var(--muted);letter-spacing:2px}

.ink-card{background:linear-gradient(160deg,#1e1915,#171310);border:1px solid var(--line);border-radius:14px;padding:13px 15px 12px}
.ink-top{display:flex;justify-content:space-between;align-items:flex-end}
.ink-label{display:flex;flex-direction:column;gap:3px;font-size:11.5px;color:var(--muted);letter-spacing:1px}
.ink-hint{font-size:10px;color:#6f6659;letter-spacing:0}
.ink-value{font-family:var(--serif);font-size:22px;color:var(--gold-soft);line-height:1}
.ink-value em{font-style:normal;font-size:11px;color:var(--muted);font-family:var(--sans)}
.ink-bar{height:6px;border-radius:4px;background:#241e18;margin-top:9px;overflow:hidden}
.ink-bar i{display:block;height:100%;border-radius:4px;background:linear-gradient(90deg,#3b7f9c,#7fc4de);transition:width .5s ease}
.ink-sub{display:flex;justify-content:space-between;margin-top:7px;font-size:11px;color:#7d7365}

.pool-card{margin-top:14px;background:linear-gradient(165deg,#1c1713,#151110);border:1px solid var(--line);border-radius:14px;padding:15px}
.pool-title{display:flex;justify-content:space-between;align-items:baseline}
.pool-title h3{font-family:var(--serif);font-size:15px;letter-spacing:2px;color:#efe4cf}
.pool-title span{font-size:11px;color:var(--muted)}
.rate-list{display:grid;grid-template-columns:1fr 1fr;gap:7px 12px;margin:13px 0 16px}
.rate-item{display:flex;align-items:center;gap:7px;font-size:11.5px}
.rate-name{color:#a2988a;flex:1}
.rate-pct{color:var(--gold);font-weight:600}

.draw-actions{display:grid;grid-template-columns:1fr 1.15fr;gap:10px}
.draw-btn{
  position:relative;border-radius:12px;padding:13px 8px;cursor:pointer;
  background:linear-gradient(160deg,#28211a,#1d1814);border:1px solid #3a3025;
  color:#e6dcc9;display:flex;flex-direction:column;align-items:center;gap:3px;transition:.18s;
}
.draw-btn:active{transform:scale(.975)}
.draw-btn.primary{background:linear-gradient(160deg,#cdaa63,#9d7a30);border-color:#e0c489;color:#2a1f0d;box-shadow:0 8px 22px rgba(180,140,60,.22)}
.draw-btn.busy{opacity:.55;pointer-events:none}
.db-name{font-family:var(--serif);font-size:16px;letter-spacing:2px;font-weight:600}
.db-cost{font-size:10.5px;opacity:.75}
.db-tag{position:absolute;top:-8px;right:8px;font-size:9.5px;padding:1px 7px;border-radius:10px;background:#8d2f24;color:#ffe6c9;letter-spacing:.5px}

.notice{display:flex;gap:9px;margin-top:14px;padding:11px 13px;border-radius:11px;background:rgba(201,165,92,.06);border:1px solid rgba(201,165,92,.18);font-size:11.5px;color:#b3a794;line-height:1.7}
.notice b{flex:0 0 auto;color:var(--gold);font-family:var(--serif);letter-spacing:1px}

/* ============ 稀有度标签 ============ */
.rtag{display:inline-block;font-size:9.5px;line-height:1.5;padding:0 5px;border-radius:4px;border:1px solid;letter-spacing:.6px;font-weight:600}
.rtag.r-N{color:var(--n);border-color:rgba(154,168,178,.45);background:rgba(154,168,178,.10)}
.rtag.r-R{color:var(--r);border-color:rgba(78,158,201,.5);background:rgba(78,158,201,.12)}
.rtag.r-SR{color:var(--sr);border-color:rgba(160,111,212,.5);background:rgba(160,111,212,.12)}
.rtag.r-SSR{color:var(--ssr);border-color:rgba(224,160,60,.5);background:rgba(224,160,60,.12)}
.rtag.r-UR{color:var(--ur);border-color:rgba(217,83,79,.55);background:rgba(217,83,79,.14)}

/* ============ 卡片 ============ */
.cardface{
  position:relative;aspect-ratio:3/4;border-radius:11px;overflow:hidden;
  font-size:16px;background:#1a1613;border:1px solid #332b22;
  box-shadow:0 6px 18px rgba(0,0,0,.45);
}
.cf-inner{position:absolute;inset:0;display:flex;flex-direction:column;padding:.5em;gap:.28em}
.cf-glow{position:absolute;inset:0;pointer-events:none}
.cf-head{display:flex;justify-content:space-between;align-items:center;position:relative}
.cf-rarity{font-size:.5em;font-weight:700;letter-spacing:1px;padding:0 .35em;border-radius:3px}
.cf-cat{font-size:.46em;opacity:.55;letter-spacing:.5px}
.cf-body{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.18em;position:relative;text-align:center}
.cf-word{font-family:var(--serif);font-weight:600;letter-spacing:.06em;line-height:1.18;text-shadow:0 2px 10px rgba(0,0,0,.4);padding:0 .1em}
.len-s .cf-word{font-size:2.05em}
.len-m .cf-word{font-size:1.18em}
.len-l .cf-word{font-size:.86em}
.len-xl .cf-word{font-size:.64em}
.cf-pinyin{font-size:.44em;opacity:.62;letter-spacing:.06em}
.cf-meaning{font-size:.46em;line-height:1.6;opacity:.7;padding:0 .35em;max-height:3.4em;overflow:hidden}
.cf-foot{display:flex;justify-content:space-between;align-items:center;font-size:.44em;opacity:.55;position:relative}
.cf-badge{color:#ffdca8;border:1px solid rgba(255,220,168,.4);border-radius:3px;padding:0 .3em}

.cardface.r-N{background:linear-gradient(165deg,#2b2b2c,#1c1c1e 60%,#151516);border-color:#3d4247}
.cardface.r-N .cf-glow{background:radial-gradient(circle at 50% 40%,rgba(154,168,178,.18),transparent 62%)}
.cardface.r-N .cf-rarity{color:var(--n);background:rgba(154,168,178,.16)}
.cardface.r-R{background:linear-gradient(165deg,#14313f,#102430 60%,#0c1a22);border-color:#2b5364}
.cardface.r-R .cf-glow{background:radial-gradient(circle at 50% 40%,rgba(78,158,201,.28),transparent 62%)}
.cardface.r-R .cf-rarity{color:var(--r);background:rgba(78,158,201,.18)}
.cardface.r-SR{background:linear-gradient(165deg,#2b1a3f,#1e122c 60%,#150d1f);border-color:#4a3468}
.cardface.r-SR .cf-glow{background:radial-gradient(circle at 50% 40%,rgba(160,111,212,.32),transparent 62%)}
.cardface.r-SR .cf-rarity{color:var(--sr);background:rgba(160,111,212,.18)}
.cardface.r-SSR{background:linear-gradient(165deg,#3a2a12,#2a1d0c 60%,#1e1408);border-color:#6b4d1d}
.cardface.r-SSR .cf-glow{background:radial-gradient(circle at 50% 40%,rgba(224,160,60,.34),transparent 62%)}
.cardface.r-SSR .cf-rarity{color:var(--ssr);background:rgba(224,160,60,.18)}
.cardface.r-UR{background:linear-gradient(165deg,#3d1512,#2a0e0c 60%,#1c0907);border-color:#6b2b24}
.cardface.r-UR .cf-glow{background:radial-gradient(circle at 50% 40%,rgba(217,83,79,.38),transparent 62%)}
.cardface.r-UR .cf-rarity{color:var(--ur);background:rgba(217,83,79,.2)}

.cardface.hidden-card{display:grid;place-items:center;background:linear-gradient(160deg,#1d1914,#141110);border-color:#332b22}
.cf-back{display:flex;flex-direction:column;align-items:center;gap:.4em;opacity:.4}
.cf-back span{font-family:var(--serif);font-size:1.9em;color:#6b6154;border:1px solid #4a4136;border-radius:.16em;padding:.06em .14em}

/* ============ 抽卡结果 ============ */
.draw-overlay{
  position:fixed;inset:0;z-index:80;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:18px;padding:24px 16px;background:rgba(6,5,4,.94);backdrop-filter:blur(6px);
  opacity:0;transition:opacity .28s;
}
.draw-overlay.show{opacity:1}
.draw-overlay.out{opacity:0}
.draw-aura{position:absolute;width:min(90vw,460px);aspect-ratio:1;border-radius:50%;filter:blur(60px);opacity:.5;pointer-events:none}
.draw-aura.N{background:rgba(154,168,178,.5)}
.draw-aura.R{background:rgba(78,158,201,.55)}
.draw-aura.SR{background:rgba(160,111,212,.6)}
.draw-aura.SSR{background:rgba(224,160,60,.6)}
.draw-aura.UR{background:rgba(217,83,79,.65)}

.draw-stage{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;position:relative;z-index:1;max-width:100%}
.draw-stage .draw-card{width:min(62vw,240px);animation:cardIn .55s cubic-bezier(.2,.9,.25,1) both}
.draw-stage.multi .draw-card{width:calc((100vw - 62px) / 3.4);max-width:104px}
.draw-card{font-size:14px}
.draw-card .cardface{font-size:15px}
.draw-stage.multi .draw-card .cardface{font-size:11px}
@keyframes cardIn{from{opacity:0;transform:translateY(26px) scale(.86) rotate(-2deg)}to{opacity:1;transform:none}}
.draw-card.slot-SSR .cardface,.draw-card.slot-UR .cardface{animation:glowPulse 2.4s ease-in-out infinite .6s}
@keyframes glowPulse{0%,100%{box-shadow:0 6px 18px rgba(0,0,0,.45)}50%{box-shadow:0 0 26px rgba(224,160,60,.5)}}

.draw-summary{text-align:center;position:relative;z-index:1}
.ds-title{font-family:var(--serif);font-size:17px;letter-spacing:3px;color:var(--gold-soft)}
.ds-line{font-size:11.5px;color:var(--muted);margin-top:6px}
.ds-btn{
  margin-top:14px;padding:10px 34px;border-radius:22px;border:1px solid rgba(226,201,141,.5);
  background:linear-gradient(160deg,#cdaa63,#9d7a30);color:#2a1f0d;font-size:13.5px;letter-spacing:2px;font-family:var(--serif);
}

/* ============ 关卡 ============ */
.page-head{padding:4px 0 12px}
.page-head h2{font-family:var(--serif);font-size:21px;letter-spacing:3px;color:#f1e7d3}
.page-sub{font-size:11.5px;color:var(--muted);margin-top:5px;letter-spacing:.4px}

.level-group{margin-bottom:18px}
.lg-head{display:flex;align-items:center;gap:10px;margin-bottom:9px}
.lg-icon{width:30px;height:30px;flex:0 0 30px;border-radius:9px;display:grid;place-items:center;font-family:var(--serif);font-size:15px;border:1px solid}
.lg-title{flex:1;min-width:0}
.lg-title h3{font-size:13.5px;letter-spacing:1px}
.lg-title span{display:block;font-size:10.5px;color:#7b7264;margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.level-item{
  width:100%;display:flex;align-items:center;gap:11px;text-align:left;
  background:linear-gradient(160deg,#1a1613,#151211);border:1px solid var(--line);
  border-radius:13px;padding:12px 13px;margin-bottom:9px;color:var(--text);transition:.16s;
}
.level-item:active{transform:scale(.99)}
.level-item.locked{opacity:.55}
.li-chapter{flex:0 0 auto;font-family:var(--serif);font-size:10px;color:#8a7f6e;writing-mode:vertical-rl;letter-spacing:2px;border-right:1px solid #2b241d;padding-right:9px}
.li-main{flex:1;min-width:0}
.li-name{display:flex;align-items:center;gap:8px}
.li-name strong{font-family:var(--serif);font-size:15px;letter-spacing:1.5px}
.li-sub{font-size:11px;color:#857b6c;margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.li-meta{display:flex;gap:10px;margin-top:6px;font-size:10px;color:#6d6459}
.li-meta .best{color:var(--gold)}
.li-right{flex:0 0 auto}
.go-ico{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;font-family:var(--serif);font-size:12px;color:#2a1f0d;background:linear-gradient(160deg,#cdaa63,#9d7a30)}
.lock-ico{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;font-size:11px;color:#7b7264;border:1px solid #332b22}
.stars{display:inline-flex;gap:1px}
.stars i{font-style:normal;font-size:10px;color:#4a4338}
.stars i.on{color:var(--gold)}

/* ============ 图鉴 ============ */
.chips{display:flex;gap:8px;overflow-x:auto;padding:2px 0 12px;scrollbar-width:none}
.chips::-webkit-scrollbar{display:none}
.chip{
  flex:0 0 auto;padding:6px 13px;border-radius:20px;font-size:12px;
  background:#1a1613;border:1px solid var(--line);color:#a2988a;
}
.chip.on{background:linear-gradient(160deg,#cdaa63,#9d7a30);color:#2a1f0d;border-color:#e0c489;font-weight:600}

.album-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
.album-cell{position:relative;animation:cellIn .35s ease both}
@keyframes cellIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.album-cell .cardface{font-size:13px}
.album-cell .cf-meaning{display:none}
.album-cell.locked{opacity:.5}
.empty{padding:34px 0;text-align:center;color:#7b7264;font-size:12.5px}

/* 卡片详情 */
.card-detail{padding:6px 4px 4px}
.cd-head{display:flex;align-items:center;gap:8px}
.cd-cat{font-size:11px;color:var(--muted)}
.cd-word{font-family:var(--serif);font-size:30px;letter-spacing:4px;margin:16px 0 6px;color:#f4ead6;line-height:1.3}
.card-detail.r-SSR .cd-word{color:#f0c984}
.card-detail.r-UR .cd-word{color:#ec9086}
.cd-pinyin{font-size:12px;color:var(--gold);letter-spacing:1.5px}
.cd-block{margin-top:16px;border-top:1px solid var(--line);padding-top:12px}
.cd-block b{font-size:11px;color:var(--gold);letter-spacing:2px;font-family:var(--serif)}
.cd-block p{font-size:13.5px;line-height:1.85;color:#cfc4b1;margin-top:5px}
.cd-foot{margin-top:18px;font-size:11px;color:#7b7264}

/* ============ 我的 ============ */
.me-card{display:flex;gap:14px;align-items:center;background:linear-gradient(160deg,#1e1915,#161210);border:1px solid var(--line);border-radius:15px;padding:16px}
.me-avatar{
  width:54px;height:54px;flex:0 0 54px;border-radius:13px;display:grid;place-items:center;
  font-family:var(--serif);font-size:24px;color:#f7e6c8;
  background:linear-gradient(150deg,#a8372c,#76211a);box-shadow:0 0 0 1px rgba(226,201,141,.35) inset;
}
.me-main{flex:1;min-width:0}
.me-name{display:flex;align-items:center;gap:8px}
.me-name strong{font-size:16px;font-family:var(--serif);letter-spacing:1px}
.me-lv{font-size:10px;padding:1px 7px;border-radius:10px;color:var(--gold);border:1px solid rgba(201,165,92,.4);background:rgba(201,165,92,.1)}
.me-exp-bar{height:5px;border-radius:3px;background:#241e18;margin-top:9px;overflow:hidden}
.me-exp-bar i{display:block;height:100%;background:linear-gradient(90deg,#9d7a30,#e2c98d)}
.me-exp-text{font-size:10px;color:#7b7264;margin-top:5px}

.me-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:12px}
.ms{background:#1a1613;border:1px solid var(--line);border-radius:11px;padding:11px 4px;text-align:center}
.ms b{display:block;font-size:17px;font-family:var(--serif);color:var(--gold-soft)}
.ms span{display:block;font-size:9.5px;color:#7b7264;margin-top:3px}

.me-menu{margin-top:12px;background:#1a1613;border:1px solid var(--line);border-radius:13px;overflow:hidden}
.mi{width:100%;display:flex;justify-content:space-between;align-items:center;padding:14px 15px;background:none;border:0;border-bottom:1px solid #241e18;color:#d8cdbb;font-size:13.5px}
.mi:last-child{border-bottom:0}
.mi:active{background:#211b16}
.mi-arrow{color:#6d6459;font-size:16px}
.me-foot{margin-top:20px;text-align:center;color:#5c554b;font-size:10.5px;line-height:1.9}

/* ============ 答题 ============ */
.quiz-overlay{position:fixed;inset:0;z-index:70;background:var(--bg);opacity:0;transition:opacity .24s}
.quiz-overlay.show{opacity:1}
.quiz-page{display:flex;flex-direction:column;height:100dvh;max-width:560px;margin:0 auto;padding:0 16px calc(16px + env(safe-area-inset-bottom))}
.quiz-head{display:flex;align-items:center;gap:12px;padding:14px 0 10px}
.quiz-head.hide{visibility:hidden;height:0;padding:0;overflow:hidden}
.q-back{width:32px;height:32px;flex:0 0 32px;border-radius:9px;background:#1a1613;border:1px solid var(--line);color:#c9bfae;font-size:19px;line-height:1;padding-bottom:3px}
.q-name{flex:1;min-width:0;display:flex;flex-direction:column}
.q-name strong{font-family:var(--serif);font-size:15px;letter-spacing:1.5px}
.q-name span{font-size:10.5px;color:#7b7264;margin-top:1px}
.qp-text{font-size:11.5px;color:var(--muted)}
.qp-bar{height:3px;background:#241e18;border-radius:2px;overflow:hidden;margin-bottom:16px}
.qp-bar i{display:block;height:100%;background:linear-gradient(90deg,#9d7a30,#e2c98d);transition:width .35s}

.quiz-body{flex:1;display:flex;flex-direction:column;overflow-y:auto}
.q-card{background:linear-gradient(165deg,#1d1814,#151210);border:1px solid var(--line);border-radius:16px;padding:22px 18px 20px;text-align:center;position:relative;overflow:hidden}
.q-card::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 0%,rgba(201,165,92,.08),transparent 60%);pointer-events:none}
.q-type{display:flex;align-items:center;justify-content:center;gap:8px}
.q-type-name{font-size:10.5px;color:var(--gold);letter-spacing:2px;font-family:var(--serif)}
.q-title{font-family:var(--serif);color:#f5ecda;line-height:1.5;margin:16px 0 8px;letter-spacing:2px;word-break:break-word}
.q-title.ws-l{font-size:40px}
.q-title.ws-m{font-size:30px}
.q-title.ws-s{font-size:21px}
.q-title.ws-xs{font-size:16px;line-height:1.7;letter-spacing:1px}
.q-prompt{font-size:12px;color:#8a8072;letter-spacing:1px}

.q-options{display:flex;flex-direction:column;gap:9px;margin-top:16px}
.q-option{
  display:flex;align-items:flex-start;gap:10px;text-align:left;
  background:#1a1613;border:1px solid var(--line);border-radius:12px;padding:13px 14px;
  color:#ddd2c0;font-size:13.5px;line-height:1.6;transition:.16s;
}
.q-option:active{transform:scale(.99);background:#211b16}
.qo-idx{flex:0 0 20px;height:20px;border-radius:6px;display:grid;place-items:center;font-size:11px;background:#241e18;color:#8c8272;margin-top:1px}
.q-option.picked{border-color:var(--gold);background:rgba(201,165,92,.12)}
.q-option.picked .qo-idx{background:var(--gold);color:#241c0c}
.q-options.answered .q-option{pointer-events:none}
.q-foot{margin-top:auto;padding-top:14px;text-align:center;font-size:10.5px;color:#5c554b;letter-spacing:1px}
.q-loading{padding:60px 0;text-align:center;color:#8a8072;font-size:13px}

/* 结算 */
.result-box{text-align:center;padding:16px 0 8px;animation:fadeUp .4s ease both}
.r-verdict{font-family:var(--serif);font-size:13px;letter-spacing:3px;color:var(--gold)}
.r-verdict.fail{color:#a08c78}
.r-score{font-family:var(--serif);font-size:56px;line-height:1.1;color:#f5ecda;margin-top:6px}
.r-score em{font-style:normal;font-size:13px;color:var(--muted);margin-left:4px;font-family:var(--sans)}
.r-stars{display:flex;justify-content:center;gap:8px;margin:4px 0 10px}
.r-stars i{font-style:normal;font-size:26px;color:#3a332a;animation:starIn .4s ease both}
.r-stars i.on{color:var(--gold);text-shadow:0 0 18px rgba(201,165,92,.5)}
@keyframes starIn{from{transform:scale(.5);opacity:0}to{transform:none;opacity:1}}
.r-meta{font-size:11.5px;color:#8a8072}
.r-reward{display:flex;justify-content:center;gap:10px;margin-top:12px;flex-wrap:wrap}
.r-reward span{font-size:11px;padding:4px 11px;border-radius:14px;background:rgba(201,165,92,.1);border:1px solid rgba(201,165,92,.28);color:var(--gold-soft)}
.r-unlock{margin-top:12px;font-size:11.5px;color:#8fd3b0;background:rgba(79,157,116,.1);border:1px solid rgba(79,157,116,.3);border-radius:10px;padding:8px 12px}
.r-detail{margin-top:18px;text-align:left;max-height:34vh;overflow-y:auto}
.rd-item{display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:9px;background:#171310;margin-bottom:6px;font-size:11.5px}
.rd-mark{flex:0 0 16px;height:16px;border-radius:50%;display:grid;place-items:center;font-size:10px}
.rd-item.ok .rd-mark{background:rgba(79,157,116,.18);color:#8fd3b0}
.rd-item.bad .rd-mark{background:rgba(192,80,63,.18);color:#e0907f}
.rd-title{flex:0 0 auto;font-family:var(--serif);color:#e2d7c5;max-width:38%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rd-answer{flex:1;color:#7b7264;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10.5px}
.r-btn{margin-top:18px;width:100%;padding:13px;border-radius:12px;border:1px solid #e0c489;background:linear-gradient(160deg,#cdaa63,#9d7a30);color:#2a1f0d;font-family:var(--serif);font-size:15px;letter-spacing:3px}

/* ============ 弹层 / toast ============ */
.sheet-mask{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:90;opacity:0;transition:opacity .24s}
.sheet-mask.show{opacity:1}
.sheet-panel{
  position:fixed;left:0;right:0;bottom:0;z-index:91;max-height:82dvh;overflow-y:auto;
  background:linear-gradient(180deg,#1c1713,#141110);border-top:1px solid var(--line);
  border-radius:18px 18px 0 0;padding:22px 20px calc(24px + env(safe-area-inset-bottom));
  transform:translateY(100%);transition:transform .26s cubic-bezier(.2,.9,.3,1);
  max-width:560px;margin:0 auto;
}
.sheet-panel.show{transform:none}
.toast{
  position:fixed;left:50%;bottom:96px;transform:translate(-50%,12px);z-index:120;
  max-width:82vw;padding:10px 18px;border-radius:22px;font-size:12.5px;
  background:rgba(28,23,19,.96);border:1px solid var(--line);color:#e6dcc9;
  opacity:0;pointer-events:none;transition:.22s;text-align:center;
}
.toast.show{opacity:1;transform:translate(-50%,0)}
.toast.error{border-color:rgba(192,80,63,.5);color:#e8b0a4}
.toast.success{border-color:rgba(79,157,116,.5);color:#a8d8bd}

.history-box h3{font-family:var(--serif);font-size:15px;letter-spacing:2px;margin-bottom:14px}
.hl-list{max-height:52dvh;overflow-y:auto}
.hl-item{display:flex;align-items:center;gap:9px;padding:9px 0;border-bottom:1px solid #241e18;font-size:12.5px}
.hl-word{flex:1;color:#ded3c1}
.hl-cat{font-size:10px;color:#6d6459}
.hl-time{font-size:10px;color:#5c554b}
.progress-row{margin-bottom:14px}
.pr-top{display:flex;align-items:center;gap:8px;font-size:12px}
.pr-name{flex:1;color:#c9bfae}
.pr-num{color:var(--muted);font-size:11px}
.pr-bar{height:5px;border-radius:3px;background:#241e18;margin-top:6px;overflow:hidden}
.pr-bar i{display:block;height:100%;border-radius:3px}

/* ============ 启动 / 错误 ============ */
#loading{height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px}
.boot-seal{
  width:56px;height:56px;border-radius:14px;display:grid;place-items:center;font-family:var(--serif);font-size:28px;
  color:#f7e6c8;background:linear-gradient(150deg,#a8372c,#76211a);animation:breathe 1.8s ease-in-out infinite;
}
@keyframes breathe{0%,100%{transform:scale(1);box-shadow:0 0 0 rgba(168,55,44,0)}50%{transform:scale(1.06);box-shadow:0 0 30px rgba(168,55,44,.5)}}
.boot-text{font-size:11.5px;color:#6d6459;letter-spacing:3px}
.fatal{height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:30px;text-align:center}
.fatal-seal{width:50px;height:50px;border-radius:12px;display:grid;place-items:center;font-family:var(--serif);font-size:24px;color:#f0d6c8;background:#7c231b;margin-bottom:6px}
.fatal h2{font-family:var(--serif);letter-spacing:3px;font-size:18px}
.fatal p{font-size:12px;color:#8a8072;line-height:1.8}
.fatal-tip{color:#5c554b;font-size:11px !important}
.fatal-btn{margin-top:14px;padding:10px 30px;border-radius:22px;border:1px solid #e0c489;background:linear-gradient(160deg,#cdaa63,#9d7a30);color:#2a1f0d;font-size:13px}

@media (min-width:561px){
  body{background:#080706}
  .shell{border-left:1px solid #1c1814;border-right:1px solid #1c1814;background:var(--bg)}
}

/* ============ 首页签到入口条 ============ */
.sign-banner{
  width:100%;display:flex;align-items:center;gap:10px;margin-bottom:12px;padding:11px 13px;
  border-radius:12px;text-align:left;color:#e6dcc9;
  background:linear-gradient(120deg,rgba(201,165,92,.15),rgba(201,165,92,.04));
  border:1px solid rgba(201,165,92,.3);
}
.sign-banner:active{transform:scale(.99)}
.sb-seal{
  width:30px;height:30px;flex:0 0 30px;border-radius:9px;display:grid;place-items:center;
  font-family:var(--serif);font-size:15px;color:#f8e7c9;background:linear-gradient(150deg,#a8372c,#76211a);
  box-shadow:0 0 0 1px rgba(226,201,141,.3) inset;
}
.sb-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.sb-main strong{font-size:12.5px;font-weight:600}
.sb-main span{font-size:10.5px;color:#94897a;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sb-go{font-size:11.5px;color:var(--gold);white-space:nowrap}

/* ============ 日常：签到 ============ */
.daily-body{display:flex;flex-direction:column;gap:16px}
.signin-card{
  position:relative;overflow:hidden;border-radius:16px;padding:16px 15px 13px;
  border:1px solid #3a2f22;background:linear-gradient(155deg,#241d16,#1a1510 60%,#161210);
  box-shadow:0 10px 30px rgba(0,0,0,.28);
}
.signin-card.done{background:linear-gradient(155deg,#1e1a14,#171310)}
.si-glow{
  position:absolute;width:230px;height:230px;right:-80px;top:-100px;border-radius:50%;
  background:radial-gradient(circle,rgba(201,165,92,.22),transparent 70%);pointer-events:none;
}
.si-top{display:flex;align-items:center;justify-content:space-between;gap:12px;position:relative}
.si-left{min-width:0}
.si-label{font-size:11px;color:var(--gold);letter-spacing:2px}
.si-streak{margin-top:7px;display:flex;align-items:baseline;gap:5px}
.si-streak b{font-family:var(--serif);font-size:31px;line-height:1;color:#f4ead6}
.si-streak span{font-size:12px;color:#a2988a}
.si-sub{margin-top:7px;font-size:10.5px;color:#7b7264}
.si-btn{
  flex:0 0 auto;width:84px;height:84px;border-radius:50%;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:1px;padding:0;cursor:pointer;
  border:1px solid #e0c489;color:#2a1f0d;
  background:radial-gradient(circle at 35% 28%,#e2c98d,#b08a3e 62%,#8a6828);
  box-shadow:0 8px 24px rgba(180,140,60,.28);
  transition:transform .16s;
}
.si-btn:active{transform:scale(.95)}
.si-btn:disabled{opacity:.7}
.si-btn.signed{
  background:rgba(201,165,92,.09);border-color:rgba(201,165,92,.32);color:#b9a884;box-shadow:none;
}
.si-btn-ink{font-family:var(--serif);font-size:19px;font-weight:700;line-height:1.15}
.si-btn-text{font-size:11.5px;letter-spacing:2px}
.si-btn-check{font-size:24px;line-height:1}

.si-cycle{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;margin-top:16px}
.cyc{
  display:flex;flex-direction:column;align-items:center;gap:3px;padding:7px 1px 6px;
  border-radius:9px;border:1px solid #2b241d;background:rgba(0,0,0,.18);
}
.cyc-day{font-size:9px;color:#6d6459;letter-spacing:.4px}
.cyc-dot{
  width:20px;height:20px;border-radius:50%;display:grid;place-items:center;
  font-size:9.5px;color:#7b7264;border:1px solid #332b22;background:#1b1712;
}
.cyc-ink{font-size:9px;color:#8a8072}
.cyc.done{border-color:rgba(201,165,92,.32);background:rgba(201,165,92,.07)}
.cyc.done .cyc-dot{background:linear-gradient(150deg,#cdaa63,#9d7a30);color:#2a1f0d;border-color:#e0c489}
.cyc.done .cyc-ink{color:var(--gold)}
.cyc.today{border-color:rgba(201,165,92,.55);box-shadow:0 0 14px rgba(201,165,92,.12)}
.cyc.today .cyc-dot{background:rgba(201,165,92,.16);color:var(--gold);border-color:rgba(201,165,92,.55);animation:pulseDot 1.9s ease-in-out infinite}
.cyc.big .cyc-dot{border-radius:7px}
.cyc.big.today .cyc-dot{background:linear-gradient(150deg,#a8372c,#76211a);color:#ffe6c9;border-color:#d8a9a0;animation:none}
@keyframes pulseDot{0%,100%{box-shadow:0 0 0 0 rgba(201,165,92,.4)}50%{box-shadow:0 0 0 5px rgba(201,165,92,0)}}

.si-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px;font-size:10.5px;color:#7b7264}
.si-bonus{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.si-cal{background:none;border:0;color:var(--gold);font-size:11px;padding:0;white-space:nowrap}

/* ============ 日常：任务 ============ */
.task-sec{margin-top:2px}
.task-head{display:flex;align-items:baseline;justify-content:space-between;padding:0 2px 10px}
.task-head h3{font-family:var(--serif);font-size:17px;letter-spacing:2px;color:#f1e7d3}
.task-head span{font-size:11px;color:#7b7264}
.task-head span.on{color:var(--gold)}
.task-tabs{display:flex;gap:8px;margin-bottom:10px}
.tt{
  position:relative;flex:1;padding:8px 0;border-radius:10px;border:1px solid var(--line);
  background:#1a1613;color:#a2988a;font-size:12.5px;
}
.tt.on{background:linear-gradient(160deg,#cdaa63,#9d7a30);border-color:#e0c489;color:#2a1f0d;font-weight:600}
.tt-dot{position:absolute;top:5px;right:7px;width:5px;height:5px;border-radius:50%;background:#c0503f}
.task-hint{font-size:10.5px;color:#6d6459;margin:0 2px 8px}
.task-list{display:flex;flex-direction:column;gap:8px}
.task-item{
  display:flex;align-items:center;gap:11px;padding:12px;border-radius:13px;
  border:1px solid var(--line);background:linear-gradient(160deg,#1a1613,#151211);
}
.task-item.ready{border-color:rgba(201,165,92,.4);background:linear-gradient(160deg,#221c14,#171310)}
.task-item.taken{opacity:.6}
.ti-icon{
  width:36px;height:36px;flex:0 0 36px;border-radius:10px;display:grid;place-items:center;
  font-family:var(--serif);font-size:16px;color:var(--gold-soft);
  background:rgba(201,165,92,.08);border:1px solid rgba(201,165,92,.22);
}
.ti-main{flex:1;min-width:0}
.ti-name{display:flex;align-items:center;gap:7px}
.ti-name strong{font-size:13px;letter-spacing:.4px;color:#e7ddca}
.ti-reward{
  font-size:9.5px;color:var(--gold);border:1px solid rgba(201,165,92,.35);
  border-radius:9px;padding:0 6px;background:rgba(201,165,92,.08);white-space:nowrap;
}
.ti-desc{font-size:10.5px;color:#7b7264;margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ti-bar{position:relative;height:5px;border-radius:3px;background:#241e18;margin-top:9px}
.ti-bar i{display:block;height:100%;border-radius:3px;background:linear-gradient(90deg,#9d7a30,#e2c98d);transition:width .4s}
.ti-num{position:absolute;right:0;top:-14px;font-size:9px;color:#6d6459}
.ti-btn{
  flex:0 0 auto;min-width:58px;padding:7px 10px;border-radius:9px;font-size:11.5px;
  border:1px solid #3a3025;background:#241e18;color:#b9ae9c;
}
.ti-btn.primary{background:linear-gradient(160deg,#cdaa63,#9d7a30);border-color:#e0c489;color:#2a1f0d;font-weight:600}
.ti-btn.ghost{background:transparent;color:#8a8072}
.ti-btn.done{background:transparent;border-color:#2b241d;color:#5f574c}

/* ============ 签到日历 ============ */
.cal-box{padding-bottom:2px}
.cal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.cal-title{font-family:var(--serif);font-size:15px;letter-spacing:2px;color:#f1e7d3}
.cal-nav{
  width:30px;height:30px;border-radius:8px;background:#1a1613;border:1px solid var(--line);
  color:#c9bfae;font-size:16px;line-height:1;padding-bottom:2px;
}
.cal-week{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;margin-bottom:6px}
.cal-week span{text-align:center;font-size:10px;color:#6d6459}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:5px}
.cal-cell{
  position:relative;aspect-ratio:1;border-radius:9px;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:2px;border:1px solid #241e18;background:#171310;
}
.cal-cell.blank{border:0;background:none}
.cc-num{font-size:11.5px;color:#8a8072}
.cal-cell.future{opacity:.38}
.cal-cell.signed{border-color:rgba(201,165,92,.4);background:rgba(201,165,92,.1)}
.cal-cell.signed .cc-num{color:var(--gold-soft)}
.cc-dot{width:4px;height:4px;border-radius:50%;background:var(--gold)}
.cal-cell.is-makeup .cc-dot{background:#8fa3b0}
.cal-cell.today{box-shadow:0 0 0 1px var(--gold) inset}
.cal-cell.miss{border-style:dashed;border-color:rgba(192,80,63,.42)}
.cc-tag{position:absolute;top:2px;right:3px;font-size:8px;color:#c0503f}
.cal-legend{display:flex;align-items:center;gap:6px;margin-top:14px;font-size:10.5px;color:#7b7264;flex-wrap:wrap}
.lg-dot{width:6px;height:6px;border-radius:50%;background:var(--gold)}
.lg-tag{color:#c0503f;border:1px dashed rgba(192,80,63,.5);border-radius:4px;padding:0 3px;font-size:9px;margin-left:6px}
.cal-stat{margin-top:10px;font-size:11px;color:#8a8072}

/* ============ 签到动效 ============ */
.ck-flash{
  position:fixed;inset:0;z-index:110;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:5px;pointer-events:none;opacity:0;transform:scale(.9);transition:.3s cubic-bezier(.2,.9,.3,1);
}
.ck-flash.show{opacity:1;transform:none}
.ckf-title{font-family:var(--serif);font-size:15px;letter-spacing:5px;color:var(--gold-soft)}
.ckf-ink{
  font-family:var(--serif);font-size:56px;line-height:1.05;color:#f5ecda;
  text-shadow:0 0 34px rgba(201,165,92,.55);
}
.ckf-sub{font-size:11.5px;color:#a2988a;letter-spacing:.5px}

/* ============ 造句 ============ */
.sc-body{display:flex;flex-direction:column;gap:14px}

.sc-banner{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:11px 14px;border-radius:14px;border:1px solid #3a2f22;
  background:linear-gradient(135deg,rgba(201,165,92,.13),rgba(201,165,92,.02));
}
.scb-left{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap;min-width:0}
.scb-ink{font-family:var(--serif);font-size:23px;font-weight:700;color:#f2e2bb;text-shadow:0 0 18px rgba(201,165,92,.35);line-height:1}
.scb-unit{font-size:11.5px;color:var(--gold)}
.scb-sub{font-size:10.5px;color:#7b7264;width:100%;margin-top:2px}
.scb-right{font-size:11px;color:#94897a;white-space:nowrap}
.scb-right b{color:var(--gold);font-size:13px;margin:0 1px}
.scb-right.none{color:#c0503f}

.sc-card{border:1px solid var(--line);border-radius:16px;background:linear-gradient(160deg,#1a1613,#151110);padding:14px}
.sc-label{display:flex;align-items:center;gap:7px;font-size:11px;color:#a2988a;letter-spacing:1.5px;margin-bottom:9px}
.scl-no{width:16px;height:16px;border-radius:50%;display:grid;place-items:center;font-size:9.5px;color:#241c0c;background:var(--gold);letter-spacing:0}
.scl-tip{margin-left:auto;font-size:10px;color:#6d645a;letter-spacing:0}

.sc-word{
  display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px;
  padding:12px 13px;border-radius:12px;border:1px dashed #3a3128;background:#171310;cursor:pointer;transition:.18s;
}
.sc-word:active{transform:scale(.995)}
.sc-word.empty{justify-content:center}
.scw-hint{font-size:12px;color:#7b7264}
.scw-main{display:flex;align-items:baseline;gap:10px;min-width:0}
.scw-word{font-family:var(--serif);font-size:22px;color:#f2e7d2;letter-spacing:2px}
.scw-py{font-size:11px;color:#8a8072;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.scw-change{font-size:11px;color:var(--gold);white-space:nowrap}

.sc-input{
  width:100%;resize:none;border-radius:12px;border:1px solid #332b23;background:#171310;
  color:var(--text);font-family:inherit;font-size:14px;line-height:1.75;padding:12px 13px;outline:none;
}
.sc-input:focus{border-color:rgba(201,165,92,.5);box-shadow:0 0 0 2px rgba(201,165,92,.08)}
.sc-input::placeholder{color:#5f574c}

.sc-foot{display:flex;justify-content:flex-end;margin-top:6px}
.sc-count{font-size:10.5px;color:#6d645a}
.sc-count.near{color:#c0503f}

.sc-warn{
  margin-top:8px;padding:9px 12px;border-radius:10px;font-size:11.5px;line-height:1.65;
  color:#e69c8d;background:rgba(192,80,63,.1);border:1px solid rgba(192,80,63,.35);
}

.sc-submit{
  width:100%;margin-top:12px;height:44px;border-radius:12px;border:1px solid #d3b273;
  background:linear-gradient(145deg,#d8b978,#b8903f);color:#241c0c;
  font-size:14px;font-weight:600;letter-spacing:2px;transition:.18s;
}
.sc-submit:active{transform:scale(.985)}
.sc-submit:disabled{background:#2a2419;border-color:#3a3128;color:#6d645a;letter-spacing:1px}

.sc-sec{margin-top:2px}
.sc-sec-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:10px}
.sc-sec-head h3{font-family:var(--serif);font-size:15px;letter-spacing:2px;color:#efe4cf}
.sc-sec-head span{font-size:10.5px;color:#7b7264}
.sc-sec-head span.on{color:var(--gold)}

.sc-list{display:flex;flex-direction:column;gap:9px}
.sc-item{border:1px solid var(--line);border-radius:12px;background:#17130f;padding:11px 12px}
.sc-item.st-1{border-color:#2f4a3a;background:linear-gradient(150deg,#17231b,#151110)}
.sc-item.st-2{border-color:#4a2a24}
.sci-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.sci-word{font-family:var(--serif);font-size:14px;color:var(--gold);letter-spacing:1px;background:rgba(201,165,92,.1);border-radius:5px;padding:1px 7px}
.sci-status{font-size:10px;padding:1px 7px;border-radius:9px;border:1px solid #3a3128;color:#94897a}
.st-1 .sci-status{color:#7fc9a3;border-color:#2c4a3a;background:#16281f}
.st-2 .sci-status{color:#e08b7c;border-color:#4a2a24;background:#2a1a16}
.st-0 .sci-status{color:#e0b070;border-color:#5a4322;background:#2b2214}
.sci-text{margin-top:7px;font-size:13px;line-height:1.7;color:#ded4c4;font-family:var(--serif);letter-spacing:.5px;word-break:break-all}
.sci-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:8px;font-size:10px;color:#6d645a;flex-wrap:wrap}
.sci-gain{color:#e2c98d}
.sci-bad{color:#e08b7c}

.sc-empty{padding:26px 0;text-align:center;border:1px dashed #332b23;border-radius:14px}
.sc-empty-ico{width:38px;height:38px;margin:0 auto 9px;border-radius:10px;display:grid;place-items:center;font-family:var(--serif);font-size:17px;color:#7b7264;border:1px solid #332b23}
.sc-empty p{font-size:12.5px;color:#9a8f80}
.sc-empty span{font-size:10.5px;color:#6d645a}
.sc-total{margin-top:12px;text-align:center;font-size:10.5px;color:#7b7264}

/* 选词面板 */
.pk-head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:12px}
.pk-head strong{font-family:var(--serif);font-size:16px;letter-spacing:2px;color:#efe4cf}
.pk-head span{font-size:10.5px;color:#7b7264}
.pk-search{
  width:100%;height:38px;border-radius:10px;border:1px solid #332b23;background:#171310;
  color:var(--text);padding:0 12px;font-size:13px;outline:none;margin-bottom:10px;
}
.pk-search:focus{border-color:rgba(201,165,92,.45)}
.pk-list{max-height:52dvh;overflow-y:auto;display:flex;flex-direction:column;gap:7px}
.pk-row{display:flex;flex-direction:column;gap:3px;padding:10px 12px;border-radius:10px;border:1px solid var(--line);background:#17130f;cursor:pointer}
.pk-row:active{background:#1e1812}
.pk-row.on{border-color:rgba(201,165,92,.5);background:rgba(201,165,92,.08)}
.pkw{display:flex;align-items:baseline;gap:9px}
.pkw strong{font-family:var(--serif);font-size:16px;color:#f0e5d0;letter-spacing:1px}
.pkw span{font-size:10.5px;color:#8a8072}
.pkm{font-size:11px;color:#94897a;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ============ 官方题目造句 ============ */
.tp-sec{margin-bottom:4px}
.tp-official{font-size:9.5px;color:#241c0c;background:var(--gold);border-radius:8px;padding:1px 8px;letter-spacing:1px}
.tp-list{display:flex;flex-direction:column;gap:11px}

.tp-card{
  border:1px solid #4a3c24;border-radius:16px;padding:14px;
  background:linear-gradient(155deg,rgba(201,165,92,.10),#17130f 55%);
  box-shadow:0 0 0 1px rgba(201,165,92,.04), 0 6px 22px rgba(0,0,0,.25);
}
.tp-card.lock{opacity:.82;filter:saturate(.85)}
.tp-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.tp-title{display:flex;align-items:center;gap:8px;min-width:0}
.tp-badge{flex:0 0 auto;width:22px;height:22px;border-radius:7px;display:grid;place-items:center;font-size:11.5px;color:#241c0c;background:linear-gradient(145deg,#e8cc8c,#b8903f);font-weight:700}
.tp-title strong{font-family:var(--serif);font-size:17px;letter-spacing:1.5px;color:#f4e8cd}
.tp-reward{flex:0 0 auto;text-align:right;line-height:1.25}
.tp-reward b{font-family:var(--serif);font-size:21px;color:#f2d992;text-shadow:0 0 16px rgba(201,165,92,.4)}
.tp-reward span{display:block;font-size:9.5px;color:#b39b62}
.tp-brief{margin-top:7px;font-size:11.5px;line-height:1.7;color:#a89d8c}
.tp-ends{margin-top:3px;font-size:10px;color:#7b7264}

.tp-words{display:flex;flex-wrap:wrap;gap:7px;margin-top:11px}
.tp-chip{
  display:inline-flex;align-items:baseline;gap:5px;padding:5px 10px;border-radius:9px;
  border:1px dashed #4a3c24;background:#17130f;
}
.tp-chip b{font-family:var(--serif);font-size:14.5px;color:#6d645a;letter-spacing:1px}
.tp-chip i{font-style:normal;font-size:9.5px;color:#5f574c}
.tp-chip.own{border:1px solid rgba(201,165,92,.55);background:rgba(201,165,92,.10)}
.tp-chip.own b{color:#f0dfae}
.tp-chip.own i{color:#a08c5c}

.tp-lock-tip{margin-top:11px;padding:8px 11px;border-radius:10px;font-size:11px;color:#c9b98f;background:rgba(201,165,92,.07);border:1px dashed #4a3c24}
.tp-mine{margin-top:12px}

.tp-daily-head{margin-top:10px}