/* ============================================================
   填字游戏 · AI每日新题  —— 还原 Figma 设计系统
   ============================================================ */
:root{
  --bg:#faf8f5; --ink:#2c2416; --brown:#8b5e3c; --muted:#8d6e63;
  --line:#ece6d8; --line2:#e8e0d0; --paper:#fff;
  --amber:#fff3cd; --amber-bd:#e3c068; --amber-tx:#8b5e3c;
  --red:#c0392b; --blue:#2980b9; --green:#27ae60; --black:#1a1a1a;
  --serif:"Noto Serif SC","Songti SC","STSong",serif;
  --sans:"PingFang SC","Hiragino Sans GB","Microsoft YaHei UI","Microsoft YaHei","Noto Sans SC",sans-serif;
}
*{box-sizing:border-box;}
html{scrollbar-gutter:stable;}
html,body{margin:0;padding:0;}
body{
  background:var(--bg); color:var(--ink); font-family:var(--sans);
  -webkit-font-smoothing:antialiased; line-height:1.5;
  display:flex; flex-direction:column; min-height:100svh;
}
button{font-family:inherit;}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0;}
#hidden-input{position:fixed;opacity:0;pointer-events:none;top:0;left:0;width:1px;height:1px;font-size:16px;}

svg.ic,svg.ic-s{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
svg.ic{width:16px;height:16px;color:var(--brown);}
svg.ic-s{width:15px;height:15px;}

/* ===== 顶部导航 ===== */
.topnav{
  height:calc(56px + env(safe-area-inset-top)); background:var(--paper); border-bottom:1px solid var(--line);
  display:flex; align-items:center; justify-content:space-between;
  padding:env(safe-area-inset-top) calc(32px + env(safe-area-inset-right)) 0 calc(32px + env(safe-area-inset-left)); position:sticky; top:0; z-index:30;
}
.brand{display:flex;align-items:center;gap:8px;background:none;border:none;cursor:pointer;padding:0;text-decoration:none;}
.brand-logo{width:32px;height:32px;border-radius:5px;display:block;}
.brand-name{font-family:var(--serif);font-size:18px;font-weight:600;color:var(--ink);}
.topnav-links{display:flex;align-items:center;gap:24px;}
.navlink{background:none;border:none;cursor:pointer;padding:0;font-size:15px;color:var(--muted);display:flex;align-items:center;gap:4px;white-space:nowrap;text-decoration:none;}
.navlink.active{color:var(--ink);font-weight:600;}
.navlink:hover{color:var(--ink);}

/* ===== 页面容器 ===== */
.app{max-width:1440px;margin:0 auto;padding:0 24px;width:100%;flex:1;display:flex;flex-direction:column;}
.page{display:none;}
.page.active{display:block;}

/* ===== 游戏首屏布局容器（desktop 视口填满）===== */
.game-layout{
  display:flex; flex-direction:column;
  min-height:calc(100svh - 56px); /* 减去顶栏 */
}

/* ===== 游戏页头部 ===== */
.game-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:14px;flex-shrink:0;}
.game-title h1{font-family:var(--serif);font-size:24px;font-weight:700;letter-spacing:.02em;line-height:1.2;margin:0;}
.game-title h2,.game-title .game-subtitle{font-size:13px;color:var(--muted);margin:2px 0 0;font-weight:400;}
.ad{background:#faf7f1;border:1px solid #ece5d6;color:#9c8f76;display:flex;align-items:center;justify-content:center;border-radius:8px;font-size:13px;letter-spacing:.2px;}
.ad-banner{flex:1;max-width:640px;height:56px;}
.ad-mobile{display:none;height:50px;font-size:13px;margin:8px 0;}

/* ===== 三栏布局 ===== */
.game-grid{
  --board:500px;
  display:grid; grid-template-columns:minmax(220px,1fr) var(--board) minmax(220px,1fr);
  gap:16px; margin-top:14px; align-items:stretch;
  flex:1; min-height:0; /* 在 .game-layout flex 容器中填充剩余高度 */
}
.clues-col{min-width:0;}
.board-col{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  width:100%;min-height:0;
}
/* 棋盘框：自适应填满剩下的高和宽 */
.board-wrap{
  flex:1; width:100%; min-height:0;
  display:flex;align-items:center;justify-content:center;
  background:var(--bg);
}
.board-tip{margin-top:8px;color:var(--muted);font-size:12px;text-align:center;}

/* 方向切换 pills */
.dir-toggle{display:inline-flex;gap:2px;padding:3px;background:var(--paper);border:1px solid var(--line);border-radius:999px;margin-bottom:10px;}
.dir-toggle-m{display:none;margin-bottom:0;}
.dir-btn{border:none;background:transparent;border-radius:999px;padding:6px 18px;font-size:14px;font-weight:500;cursor:pointer;transition:.15s;}
.dir-btn[data-dir="across"]{color:var(--red);}
.dir-btn[data-dir="down"]{color:var(--blue);}
.dir-btn[data-dir="across"].active{background:var(--red);color:#fff;}
.dir-btn[data-dir="down"].active{background:var(--blue);color:#fff;}

/* ===== 网格 ===== */
.crossword{
  display:flex; align-items:center; justify-content:center;
  width:100%; height:100%;
  background:var(--paper); padding:12px; border-radius:10px;
  border:1px solid #e8e2d6; box-shadow:0 2px 12px rgba(0,0,0,.06);
  --cell:44px;
}
.crossword .grid-inner{display:inline-grid;border:2px solid var(--black);}
.cell{
  width:var(--cell);height:var(--cell);position:relative;display:flex;align-items:center;justify-content:center;
  border:1px solid #333;background:#fff;cursor:pointer;font-family:var(--serif);
  transition:box-shadow .15s,border-color .15s,background .15s;
}
.cell.black{background:var(--black);border:1px solid var(--black);cursor:default;}
.cell .cnum{position:absolute;top:2px;left:3px;font-size:clamp(9px,calc(var(--cell) * .26),16px);line-height:1;color:#999;font-family:var(--sans);}
.cell .ch{font-size:clamp(16px,calc(var(--cell) * .56),52px);line-height:1;font-weight:500;color:var(--black);}
.cell.user .ch{color:#1a3a8f;}
.cell.in-word{background:#eef5ff;}
.cell.selected{background:#fffbea;border:2.5px solid #f59e0b;box-shadow:inset 0 0 0 1px #fcd34d,0 0 8px 2px rgba(245,158,11,.35);z-index:2;}
.cell.wrong{background:#ffe8e8;}
.cell.wrong .ch{color:var(--red);}
.cell.revealed .ch{color:#b36a00;}
.crossword.win{outline:2px solid var(--green);outline-offset:4px;}

/* ===== 当前提示（移动端）===== */
.cur-clue{display:none;width:100%;margin-top:10px;padding:8px 10px;background:var(--amber);border:1px solid var(--amber-bd);border-radius:8px;}
.cur-clue-label{font-size:11px;color:var(--brown);margin-bottom:1px;}
.cur-clue-text{font-size:14px;color:var(--ink);font-weight:500;line-height:1.3;}

/* ===== 提示卡片 ===== */
.clues-card{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:18px;height:100%;box-shadow:0 2px 8px rgba(0,0,0,.06);overflow-y:auto;overflow-x:hidden;}
.clue-group + .clue-group{margin-top:22px;}
.clue-group-head{display:flex;align-items:center;gap:8px;margin-bottom:12px;}
.clue-tag{display:inline-block;padding:2px 8px;border-radius:4px;color:#fff;font-size:13px;font-family:var(--sans);}
.clue-tag.a{background:var(--red);} .clue-tag.d{background:var(--blue);}
.clue-count{color:var(--muted);font-size:13px;}
.clue-list{list-style:none;margin:0;padding:0;}
.clue-item{display:flex;gap:8px;padding:8px 12px;border-radius:8px;cursor:pointer;font-size:18px;color:var(--ink);transition:background .1s;}
.clue-item:hover{background:#faf7f0;}
.clue-item.active{background:var(--amber);}
.clue-item .cnum{min-width:24px;font-weight:600;}
.clue-item[data-dir="across"] .cnum{color:var(--red);}
.clue-item[data-dir="down"] .cnum{color:var(--blue);}
.clue-item.done .ctext{color:var(--muted);text-decoration:line-through;}

/* ===== 控制条 ===== */
.controls{
  display:flex;align-items:center;gap:24px;background:var(--paper);border:1px solid var(--line);
  border-radius:12px;padding:12px 20px;margin-top:14px;box-shadow:0 2px 8px rgba(0,0,0,.06);overflow-x:auto;
  flex-shrink:0; /* 不被压缩，始终显示在底部 */
}
.ctrl-block{display:flex;align-items:center;gap:8px;flex-shrink:0;}
.ctrl-divider{width:1px;height:32px;background:var(--line);flex-shrink:0;}
.ctrl-spacer{flex:1;}
.ctrl-date{font-size:14px;font-weight:600;line-height:1.1;}
.ctrl-issue{font-size:12px;color:var(--muted);}
.ctrl-lbl{font-size:12px;color:var(--muted);}
.ctrl-timer{font-family:var(--serif);font-size:18px;font-weight:600;font-variant-numeric:tabular-nums;min-width:5ch;}
.ctrl-progress{flex-shrink:0;min-width:200px;}
.ctrl-progress-top{display:flex;justify-content:space-between;margin-bottom:4px;}
.ctrl-pct{font-size:12px;font-weight:600;}
.bar{height:6px;border-radius:999px;background:var(--line);overflow:hidden;}
.bar-fill{height:100%;background:var(--brown);width:0;transition:width .4s;}
.ctrl-saved{font-size:11px;color:#b0a090;margin-top:3px;}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:6px;overflow:hidden;}
.seg-btn{border:none;background:#fff;padding:6px 12px;font-size:13px;color:var(--ink);cursor:pointer;}
.seg-btn.active{background:var(--brown);color:#fff;}
.mode-btns{display:flex;gap:8px;}
.mode-btn{display:inline-flex;align-items:center;gap:4px;border:1px solid var(--line);background:#fff;border-radius:6px;padding:6px 10px;font-size:13px;color:var(--ink);cursor:pointer;}
.mode-btn.active{background:var(--amber);border-color:var(--amber-bd);}
.ctrl-actions{display:flex;align-items:center;gap:8px;flex-shrink:0;}
.btn{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:6px;padding:8px 12px;font-size:14px;cursor:pointer;transition:.15s;}
.btn:hover{border-color:#d8cdb8;}
.btn-primary{background:var(--brown);color:#fff;border-color:var(--brown);}
.btn-primary:hover{background:#7a5234;}
.badge{font-size:11px;opacity:.85;}

/* ===== 移动端操作行 ===== */
.m-actions{display:none;grid-template-columns:repeat(5,1fr);gap:6px;margin-top:8px;}

/* ===== 移动端信息栏（期号+计时+进度）===== */
.m-info{display:none;flex-shrink:0;padding:4px 0 2px;}
.m-info-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px;}
.m-info-issue{font-size:12px;color:var(--muted);display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.m-info-diff{flex-shrink:0;border:1px solid var(--line);background:#fff;border-radius:999px;padding:2px 8px;font-size:11px;font-weight:600;color:var(--brown);line-height:1.4;}
.m-info-row{display:flex;align-items:center;gap:10px;}
.m-info-timer{font-size:13px;color:var(--ink);white-space:nowrap;}
.m-info-timer b{font-family:var(--serif);font-weight:600;}
.m-info-progress{flex:1;min-width:0;}
.m-info-progress .bar{height:5px;}
.m-info-pct{font-size:12px;font-weight:600;color:var(--ink);min-width:2.5em;text-align:right;}
.m-btn{border:1px solid var(--line);background:#fff;border-radius:6px;padding:9px 0;font-size:13px;cursor:pointer;white-space:nowrap;}
.m-mode.active{background:var(--amber);border-color:var(--amber-bd);color:var(--brown);font-weight:600;}
.m-ai{background:var(--brown);color:#fff;border-color:var(--brown);font-size:15px;}
.m-check{color:var(--green);} .m-reset{color:var(--muted);}

/* ===== 图文内容手风琴 ===== */
.guide{margin:36px 0 40px;border:1px solid var(--line2);border-radius:12px;overflow:hidden;background:var(--paper);}
.guide-item{border-bottom:1px solid #f0ebe0;}
.guide-item:last-child{border-bottom:none;}
.guide-q{margin:0;font:inherit;font-weight:inherit;}
.guide-head{width:100%;height:52px;display:flex;align-items:center;justify-content:space-between;padding:0 28px;background:#fff;border:none;cursor:pointer;text-align:left;}
.guide-item.open .guide-head{background:var(--bg);}
.guide-head>span:first-child{font-family:var(--serif);font-size:16px;font-weight:500;color:#5a4a36;letter-spacing:.02em;}
.guide-item.open .guide-head>span:first-child{font-weight:700;color:var(--ink);}
.guide-plus{font-size:18px;color:#c9bfa8;transition:transform .2s;line-height:1;}
.guide-item.open .guide-plus{transform:rotate(45deg);}
.guide-body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .25s ease;}
.guide-item.open .guide-body{grid-template-rows:1fr;}
.guide-body>.guide-inner{overflow:hidden;}
.guide-inner{padding:0 28px;color:#3d3020;font-size:15px;line-height:1.9;}
.guide-item.open .guide-inner{padding:16px 28px 24px;border-top:1px solid #f0ebe0;}
.guide-inner p{margin:0 0 12px;}
.guide-inner i{color:#5a4a36;font-style:normal;font-weight:500;}
.guide-feats{display:grid;grid-template-columns:1fr 1fr;gap:6px 24px;list-style:none;padding:0;margin:6px 0 0;font-size:14px;color:#5a4a36;}
.guide-feats b{color:var(--ink);}
.guide-steps{list-style:none;padding:0;margin:0;}
.guide-steps li{display:flex;gap:12px;align-items:flex-start;margin-bottom:12px;}
.step-n{flex-shrink:0;width:22px;height:22px;border-radius:50%;background:var(--brown);color:#fff;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;margin-top:2px;}
.guide-steps b,.guide-dot b{color:var(--ink);}
.guide-note{color:var(--brown);font-size:14px;background:#fff8ee;border-left:3px solid var(--amber-bd);padding:8px 12px;border-radius:0 4px 4px 0;margin-top:14px;}
.guide-dot{list-style:none;padding:0;margin:0;}
.guide-dot li{display:flex;gap:10px;align-items:flex-start;margin-bottom:10px;}
.guide-dot li::before{content:"·";color:#c9bfa8;font-size:18px;line-height:1;margin-top:2px;}
.guide-cards{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.guide-card{background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:12px 14px;}
.guide-card b{display:block;color:var(--ink);margin-bottom:4px;font-size:14px;}
.guide-card span{font-size:14px;color:#5a4a36;}
.guide-faq{margin:0;}
.guide-faq .qa{border-bottom:1px solid #f0ebe0;padding-bottom:14px;margin-bottom:14px;}
.guide-faq .qa:last-child{border-bottom:none;margin-bottom:0;}
.guide-faq .q{font-weight:600;color:var(--ink);margin:0 0 5px;font-size:15px;}
.guide-faq .a{color:#5a4a36;font-size:14px;margin:0;}

/* ===== 子页面（我的答题/题库/隐私）===== */
.subpage{margin:0 auto;padding:28px 0 40px;}
#page-history,#page-archive{width:960px;max-width:100%;}   /* 我的答题 / 题库：PC端统一宽度，移动端自适应 */
#page-privacy{width:780px;max-width:100%;}    /* 隐私政策：还原设计稿阅读宽度 */
.sub-head{display:flex;align-items:center;gap:12px;margin-bottom:18px;}
.back-btn{background:#fff;border:1px solid var(--line);color:var(--muted);border-radius:6px;padding:6px 12px;font-size:14px;cursor:pointer;}
.sub-title{font-family:var(--serif);font-size:22px;font-weight:700;margin:0;}
#page-privacy .sub-title{font-size:26px;}  /* 隐私标题还原设计稿 26px */
.sub-desc{font-size:14px;color:var(--muted);margin:0 0 18px;}
.sub-foot{font-size:13px;color:#bfae90;margin-top:24px;text-align:center;}
.stats-bar{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:16px;margin-bottom:22px;}
.stat{text-align:center;}
.stat-mid{border-left:1px solid #f0ebe0;border-right:1px solid #f0ebe0;}
.stat-lbl{font-size:11px;color:var(--muted);margin-bottom:3px;}
.stat-num{font-family:var(--serif);font-size:26px;font-weight:700;font-variant-numeric:tabular-nums;}
.history-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px;}
.history-item{display:flex;align-items:center;gap:16px;background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:16px 20px;cursor:pointer;box-shadow:0 1px 4px rgba(0,0,0,.04);transition:border-color .15s,box-shadow .15s;}
.history-item:hover{border-color:#d8cdb8;box-shadow:0 2px 8px rgba(0,0,0,.06);}
.hi-badge{width:40px;height:40px;border-radius:10px;background:#f5f1ea;display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-weight:700;color:var(--brown);font-size:13px;flex-shrink:0;}
/* 空状态卡片（无记录时） */
.hist-empty{background:var(--paper);border:1px solid var(--line);border-radius:16px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:80px 20px;}
.hist-empty-icon{width:64px;height:64px;border-radius:50%;background:#f5f1ea;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;color:#c9bfa8;margin-bottom:20px;}
.hist-empty-icon svg{width:28px;height:28px;}
.hist-empty-title{font-family:var(--serif);font-size:18px;color:var(--ink);margin:0 0 8px;}
.hist-empty-sub{font-size:14px;color:var(--muted);margin:0 0 24px;}
.hist-empty-btn{padding:10px 26px;}
.hi-main{flex:1;min-width:0;}
.hi-title{font-size:15px;font-weight:600;color:var(--ink);}
.hi-sub{font-size:12px;color:var(--muted);margin-top:4px;}
.hi-right{display:flex;align-items:center;gap:12px;flex-shrink:0;}
.hi-diff{display:inline-block;padding:2px 8px;border-radius:999px;color:#fff;font-size:11px;font-weight:500;}
.hi-score-box{text-align:right;min-width:48px;}
.hi-score{font-family:var(--serif);font-size:18px;font-weight:700;line-height:1;}
.hi-time{font-size:11px;color:var(--muted);margin-top:4px;}
.hi-arrow{color:#c9bfa8;font-size:18px;font-family:var(--serif);margin-left:4px;}
.archive-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.archive-card{display:flex;gap:14px;background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:14px 18px;cursor:pointer;position:relative;overflow:hidden;box-shadow:0 1px 4px rgba(0,0,0,.04);}
.archive-card.done{border-color:#b8ddb8;}
.ac-ribbon{position:absolute;top:0;right:0;background:var(--green);color:#fff;font-size:10px;font-weight:600;padding:2px 8px;border-bottom-left-radius:6px;}
.ac-badge{flex-shrink:0;width:52px;height:52px;border-radius:10px;background:#f5f1ea;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--brown);}
.archive-card.done .ac-badge{background:#e8f5e9;color:var(--green);}
.ac-badge .d{font-family:var(--serif);font-size:16px;font-weight:700;line-height:1.1;}
.ac-badge .m{font-size:10px;}
.ac-main{flex:1;min-width:0;}
.ac-date{font-size:13px;color:var(--brown);font-weight:600;}
.ac-diff{display:inline-block;margin-left:6px;padding:1px 6px;border-radius:4px;color:#fff;font-size:11px;}
.ac-sub{font-size:12px;color:var(--muted);margin-top:4px;}
.ac-cta{align-self:center;margin-left:auto;color:var(--brown);background:var(--amber);border:1px solid var(--amber-bd);border-radius:6px;padding:3px 8px;font-size:12px;white-space:nowrap;}

/* ===== 隐私 ===== */
.privacy-card{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:32px;box-shadow:0 2px 12px rgba(0,0,0,.05);}
.privacy-card h3{font-family:var(--serif);font-size:20px;font-weight:700;margin:28px 0 10px;}
.privacy-card p{font-size:15px;color:#3d3020;line-height:1.85;margin:0 0 12px;}
.privacy-card ul{padding-left:20px;margin:0 0 12px;}
.privacy-card li{font-size:15px;color:#3d3020;line-height:1.85;margin-bottom:6px;}
.privacy-card em{color:var(--brown);font-style:normal;}
.privacy-card .muted{color:var(--muted);font-size:14px;}

/* ===== 页脚 ===== */
.site-footer{background:var(--ink);color:#e8dcc9;padding:32px 24px;margin-top:8px;}
.footer-inner{max-width:900px;margin:0 auto;text-align:center;}
.footer-title{font-family:var(--serif);font-size:17px;margin-bottom:8px;}
.footer-desc{font-size:13px;color:#bfae90;line-height:1.75;max-width:560px;margin:0 auto 16px;}
.footer-bottom{border-top:1px solid #3d3320;padding-top:14px;font-size:13px;color:#9c8a6e;}
.footer-link{color:#9c8a6e;background:none;border:none;cursor:pointer;font-size:13px;text-decoration:underline;text-underline-offset:3px;margin-bottom:8px;}
.footer-bottom a{color:inherit;text-decoration:none;}

/* ===== 移动底栏 + 抽屉 + 庆祝 ===== */
.tabbar{display:none;position:fixed;bottom:0;left:0;right:0;height:calc(56px + env(safe-area-inset-bottom));background:#fff;border-top:1px solid var(--line);padding:0 env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);z-index:40;}
.tab-btn{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;background:none;border:none;color:var(--muted);font-size:11px;cursor:pointer;}
.tab-btn svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.tab-btn.active{color:var(--brown);}

.drawer-mask{display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:50;align-items:flex-end;}
.drawer-mask.show{display:flex;}
.drawer{width:100%;background:#fff;max-height:76vh;display:flex;flex-direction:column;border-radius:20px 20px 0 0;box-shadow:0 -4px 24px rgba(0,0,0,.15);padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right);}
.drawer-handle{width:40px;height:4px;border-radius:2px;background:#ddd6c8;margin:10px auto 4px;}
.drawer-head{display:flex;align-items:center;justify-content:space-between;padding:4px 20px 12px;}
.drawer-title{font-family:var(--serif);font-size:17px;font-weight:700;}
.drawer-close{width:30px;height:30px;border-radius:50%;background:#f5f1ea;border:none;color:var(--muted);font-size:18px;cursor:pointer;}
.drawer-tabs{display:flex;gap:4px;margin:0 20px 12px;background:#f5f1ea;border-radius:12px;padding:4px;}
.drawer-tab{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;border:none;background:transparent;border-radius:10px;padding:8px;font-size:14px;color:var(--muted);cursor:pointer;}
.drawer-tab.active{background:#fff;font-weight:600;box-shadow:0 1px 4px rgba(0,0,0,.08);}
.drawer-tab[data-dtab="across"].active{color:var(--red);}
.drawer-tab[data-dtab="down"].active{color:var(--blue);}
.dt-badge{width:18px;height:18px;border-radius:4px;color:#fff;font-size:10px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;font-style:normal;background:#d4c9b6;}
.drawer-tab.active .dt-a{background:var(--red);} .drawer-tab.active .dt-d{background:var(--blue);}
.drawer-tab em{font-style:normal;font-size:12px;color:#a89878;}
.drawer-list{list-style:none;margin:0;padding:0 16px calc(24px + env(safe-area-inset-bottom));overflow-y:auto;flex:1;}
.drawer-list .clue-item{font-size:15px;}

.win-mask{display:none;position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:60;align-items:center;justify-content:center;}
.win-mask.show{display:flex;}
.win-card{background:var(--bg);border-radius:18px;text-align:center;width:min(400px,90vw);padding:40px 32px 28px;box-shadow:0 20px 60px rgba(0,0,0,.3);animation:pop .3s cubic-bezier(.34,1.56,.64,1);}
@keyframes pop{from{transform:scale(.85);opacity:0;}to{transform:scale(1);opacity:1;}}
.win-icon{width:68px;height:68px;margin:0 auto 18px;border-radius:50%;background:#e8f5e9;border:2px solid var(--green);display:flex;align-items:center;justify-content:center;}
.win-icon svg{width:38px;height:38px;fill:none;stroke:var(--green);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.win-title{font-family:var(--serif);font-size:30px;font-weight:700;margin:0 0 8px;}
.win-sub{font-size:14px;color:var(--muted);margin:0 0 28px;}
.win-stats{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:20px;}
.win-stat{background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px 0;}
.ws-lbl{font-size:11px;color:var(--muted);margin-bottom:4px;}
.ws-num{font-family:var(--serif);font-size:24px;font-weight:700;font-variant-numeric:tabular-nums;}
.win-actions{display:flex;gap:12px;margin-bottom:14px;}
.win-actions .btn{flex:1;justify-content:center;padding:12px 0;border-radius:12px;font-size:15px;}
.win-share-note{font-size:12px;color:var(--muted);line-height:1.6;margin:0 0 10px;}
.win-share-row{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;}
.win-share-btn{border:1px solid var(--line);background:#fff;color:var(--brown);font-size:13px;border-radius:999px;padding:8px 12px;cursor:pointer;}
.win-share-btn.primary{background:var(--brown);border-color:var(--brown);color:#fff;text-decoration:none;}

.confirm-mask{display:none;position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:70;align-items:center;justify-content:center;}
.confirm-mask.show{display:flex;}
.confirm-card{background:var(--bg);border-radius:18px;text-align:center;width:min(320px,85vw);padding:28px 24px 24px;box-shadow:0 20px 60px rgba(0,0,0,.3);animation:pop .3s cubic-bezier(.34,1.56,.64,1);}
.confirm-title{font-family:var(--serif);font-size:20px;font-weight:700;margin:0 0 12px;color:var(--ink);}
.confirm-sub{font-size:15px;color:var(--muted);margin:0 0 24px;line-height:1.5;}
.confirm-actions{display:flex;gap:12px;}
.confirm-actions .btn{flex:1;justify-content:center;padding:10px 0;border-radius:10px;font-size:15px;}

/* ============================================================
   响应式：≤1023px 切换为移动布局
   ============================================================ */
@media (max-width:1023px){
  .topnav{padding:env(safe-area-inset-top) calc(16px + env(safe-area-inset-right)) 0 calc(16px + env(safe-area-inset-left));height:calc(52px + env(safe-area-inset-top));justify-content:center;}
  .topnav-links{display:none;}
  .app{padding:0;display:block;padding-bottom:0;}
  /* 首屏游戏区：固定高度 flex 列；标题钉在顶部、广告钉在底部，中部网格吸收多余空间 */
  .game-layout{
    display:flex;flex-direction:column;gap:6px;
    height:calc(100svh - 52px - 56px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
    min-height:0; /* 覆盖桌面端 min-height，避免首屏超出而把广告位顶到 tabbar 之下 */
    padding:6px calc(12px + env(safe-area-inset-right)) 6px calc(12px + env(safe-area-inset-left));
  }
  /* 顶部信息区：自然高度，钉在首屏顶部 */
  .m-topgrow{
    flex:0 0 auto;
    display:flex;flex-direction:column;gap:6px;
  }
  .game-head{padding-top:0;}
  .game-head .dir-toggle-m{display:inline-flex;}
  #dir-toggle{display:none;}
  .game-title h1{font-size:17px;} .game-title h2,.game-title .game-subtitle{display:none;}
  .ad-banner{display:none;}
  .ad-mobile{display:flex;flex:0 0 auto;height:46px;font-size:13px;margin:0;}
  .m-info{display:block;}
  /* 网格区：占满首屏中部剩余空间，正方形网格由 JS 取宽高较小边居中铺满 */
  .game-grid{display:flex;flex:1 1 auto;min-height:0;margin-top:0;width:100%;align-items:stretch;justify-content:center;}
  .clues-desktop{display:none;}
  .board-col{flex:1;min-height:0;width:100%;justify-content:center;}
  .board-tip{display:none;}
  .cur-clue{display:block;flex:0 0 auto;margin-top:0;padding:8px 10px;}
  .controls{display:none;}
  .m-actions{display:grid;flex:0 0 auto;margin-top:0;}
  .board-wrap{width:100%;flex:1 1 auto;min-height:0;height:auto;background:var(--bg);}
  /* 白卡填满中部可用区域，正方形网格在白卡内居中（空白收进卡片，呈现为内边距）*/
  .crossword{width:100%;height:100%;padding:10px;}
  .tabbar{display:flex;}
  .guide{margin:24px calc(12px + env(safe-area-inset-right)) 16px calc(12px + env(safe-area-inset-left));}
  .subpage{padding:18px calc(16px + env(safe-area-inset-right)) calc(70px + env(safe-area-inset-bottom)) calc(16px + env(safe-area-inset-left));}
  .archive-grid{grid-template-columns:1fr;}
  .guide-feats,.guide-cards{grid-template-columns:1fr;}
  .site-footer{margin-bottom:calc(56px + env(safe-area-inset-bottom));}
}

/* 移动端：根据 data-mtab 控制游戏页内主视图（提示走抽屉） */
@media (min-width:1024px){
  .tabbar,.drawer-mask{display:none !important;}
}