:root{
  --paper:#f7f1e3; --paper2:#fffaf0; --ink:#141414; --red:#e63946; --yellow:#ffd23f; --gray:#d9d3c5; --green:#1f9d55; --blue:#3a86ff; --pink:#ff5a9a;
  --sat:env(safe-area-inset-top,0px); --sab:env(safe-area-inset-bottom,0px);
  --sal:env(safe-area-inset-left,0px); --sar:env(safe-area-inset-right,0px);
  --dots:radial-gradient(rgba(20,20,20,.2) 1.1px, transparent 1.5px);
  /* ===== 12c 漫画 UI 设计令牌（经营 / 家宅 / CEO 及弹窗共用；只改外观，不碰玩法） ===== */
  /* 墨色：主墨 / 正文 / 说明（正文、说明在纸色上对比度 ≥ 4.5） */
  --ink-2:#463f36; --ink-3:#655d52;
  /* 纸与格：页面纸 / 主面板 / 高亮面板 / 禁用斜纹 */
  --panel:#fffaf0; --panel-2:#fff4d1; --panel-pink:#ffe3ee;
  --hatch:repeating-linear-gradient(45deg,#f1ece0 0 6px,#e4ddcd 6px 12px);
  /* 限定强调色：红 = 行动/提醒，黄 = 选中/高亮，蓝 = 焦点；正文用的红加深到 --red-ink（白底 ≥ 5:1） */
  --red-ink:#c21d2c;
  /* 线宽三档：细节 / 控件 / 面板 */
  --lw-1:2px; --lw-2:2px; --lw-3:3px; /* 12c1：按熊大基准 外框 3px / 内框 2px（细节也不再用 1.5px） */
  /* 圆角 */
  --r-sm:4px; --r-md:8px; --r-lg:12px; --r-pill:999px;
  /* 硬投影（漫画格错位墨影）：控件 / 按钮 / 面板 / 弹窗 */
  --sh-1:2px 2px 0 var(--ink); --sh-2:3px 3px 0 var(--ink); --sh-3:4px 4px 0 var(--ink); --sh-4:7px 7px 0 var(--ink);
  /* 网点（screentone）：墨 / 红 / 黄 */
  --tone-ink:radial-gradient(rgba(20,20,20,.2) 1.1px,transparent 1.5px) 0 0/6px 6px;
  --tone-red:radial-gradient(rgba(230,57,70,.38) 1.4px,transparent 1.8px) 0 0/6px 6px;
  --tone-yel:radial-gradient(rgba(201,140,0,.38) 1.2px,transparent 1.6px) 0 0/5px 5px;
  /* 字级：标题 / 段标题 / 卡片名 / 正文 / 说明 / 数字 */
  --fs-title:18px; --fs-h:14px; --fs-name:15px; --fs-body:12px; --fs-cap:11px; --fs-num:30px;
  --num-shadow:2px 2px 0 var(--yellow); --head-shadow:3px 3px 0 var(--red);
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;height:100%;background:var(--paper);color:var(--ink);overflow:hidden;
  font-family:-apple-system,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans CJK SC",sans-serif;
  -webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-text-size-adjust:100%}
body{position:fixed;inset:0;touch-action:manipulation}
button{font-family:inherit;color:var(--ink);touch-action:manipulation;cursor:pointer}
.hidden{display:none!important}

#app{position:absolute;inset:0;display:flex;flex-direction:column;
  padding:calc(var(--sat) + 4px) calc(var(--sar) + 10px) 0 calc(var(--sal) + 10px);
  background:var(--dots) 0 0/7px 7px, var(--paper);max-width:560px;margin:0 auto}

/* ---------- header ---------- */
#top{flex:0 0 auto}
.title-row{display:flex;align-items:center;gap:8px;height:44px}
.logo{margin:0;font-size:22px;font-weight:900;letter-spacing:1px;transform:rotate(-3deg);white-space:nowrap;line-height:1}
.logo .l1{background:var(--ink);color:#fff;padding:2px 6px;border-radius:3px;box-shadow:3px 3px 0 var(--red)}
.logo .l2{color:var(--ink);margin-left:4px;text-shadow:2px 2px 0 var(--yellow)}
.chip{margin-left:auto;font-size:12px;font-weight:800;background:#fff;border:2px solid var(--ink);border-radius:999px;padding:0 10px;height:32px;white-space:nowrap;box-shadow:2px 2px 0 var(--ink)}
.chip.on{background:var(--yellow)}
.chip.used{background:var(--gray);color:#555}
.icon-btn{flex:0 0 auto;width:44px;height:44px;border:3px solid var(--ink);border-radius:50%;background:#fff;font-size:20px;font-weight:900;box-shadow:2px 2px 0 var(--ink);display:grid;place-items:center;padding:0}
.icon-btn.off{background:var(--gray);text-decoration:line-through}
.icon-btn:active,.chip:active{transform:translate(2px,2px);box-shadow:0 0 0 var(--ink)}

.money{position:relative;display:flex;align-items:center;gap:10px;margin:4px 0 8px;padding:6px 12px;
  background:#fff;border:3px solid var(--ink);border-radius:8px;box-shadow:4px 4px 0 var(--ink);overflow:hidden;min-height:60px}
.money::after{content:"";position:absolute;right:-20px;top:-20px;width:120px;height:120px;border-radius:50%;opacity:.4; /* 12c1：数值区网点减轻 */
  background:radial-gradient(rgba(230,57,70,.35) 1.6px, transparent 2px) 0 0/7px 7px;pointer-events:none}
.coin-ico{flex:0 0 auto;width:42px;height:42px;border-radius:50%;background:var(--yellow);border:3px solid var(--ink);
  display:grid;place-items:center;box-shadow:inset -4px -4px 0 rgba(0,0,0,.15)}
.coin-ico span{font-weight:900;font-size:18px;transform:rotate(-8deg)}
.coin-ico.sm{width:30px;height:30px;border-width:2px;display:inline-grid;vertical-align:middle;margin-right:6px}
.coin-ico.sm span{font-size:13px}
.money-main{flex:1;min-width:0;position:relative;z-index:1}
#coins{font-size:30px;font-weight:900;line-height:1.05;letter-spacing:.5px;font-variant-numeric:tabular-nums;
  text-shadow:2px 2px 0 var(--yellow);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transform-origin:left center}
#coins.bump{animation:bump .25s ease-out}
@keyframes bump{0%{transform:scale(1)}40%{transform:scale(1.1)}100%{transform:scale(1)}}
#cps{font-size:13px;font-weight:800;color:var(--red);white-space:nowrap}
.boost-tag{position:relative;z-index:2;font-size:12px;font-weight:900;background:var(--red);color:#fff;border:2px solid var(--ink);border-radius:6px;padding:3px 6px;transform:rotate(-4deg);white-space:nowrap;animation:pulse 0.6s infinite alternate}
@keyframes pulse{to{transform:rotate(-4deg) scale(1.08)}}
.sfx-word{position:relative;z-index:1;font-size:22px;font-weight:900;color:var(--red);transform:rotate(12deg);
  -webkit-text-stroke:1px var(--ink);opacity:.9;white-space:nowrap}
.sfx-word.pop{animation:wordpop .45s cubic-bezier(.3,1.8,.5,1)}
@keyframes wordpop{0%{transform:rotate(12deg) scale(.3)}100%{transform:rotate(12deg) scale(1)}}

/* ---------- stage ---------- */
#stage{flex:0 0 auto;height:clamp(160px,28vh,310px);height:clamp(160px,28dvh,310px);position:relative;border:3px solid var(--ink);border-radius:4px;
  background:var(--paper2);box-shadow:5px 5px 0 var(--ink);overflow:hidden}
#scene{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:pan-y}

#shopTabs{flex:0 0 auto;display:flex;gap:6px;margin:10px 0 6px}
#shopTabs button{flex:1;min-width:0;height:44px;border:2px solid var(--ink);border-radius:8px;background:#fff;font-weight:900;font-size:12px;
  line-height:1.1;padding:2px 2px;box-shadow:2px 2px 0 var(--ink);position:relative;overflow:hidden}
#shopTabs button .tn{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#shopTabs button small{display:block;font-size:10px;font-weight:700;color:#666;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#shopTabs button.on{background:var(--ink);color:var(--yellow)}
#shopTabs button.on small{color:#ddd}
#shopTabs button.locked{background:repeating-linear-gradient(45deg,#eee 0 6px,#e2ddd0 6px 12px);color:#777}
#shopTabs button .dot{position:absolute;right:3px;top:3px;width:9px;height:9px;border-radius:50%;background:var(--red);border:2px solid var(--ink)}

#goal{flex:0 0 auto;display:flex;align-items:center;gap:8px;background:#fff;border:2px solid var(--ink);border-radius:6px;padding:4px 8px;margin-bottom:6px}
.goal-txt{flex:1;min-width:0;font-size:12px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.goal-txt::before{content:"下一步";background:var(--red);color:#fff;font-size:10px;padding:1px 5px;border-radius:3px;margin-right:6px}
.goal-bar{flex:0 0 70px;height:10px;border:2px solid var(--ink);border-radius:6px;overflow:hidden;background:#eee}
.goal-bar i{display:block;height:100%;width:0;background:var(--yellow);transition:width .3s}

/* ---------- panel ---------- */
#panel{flex:1 1 auto;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding:2px 6px 12px 2px}
#bottomNav{flex:0 0 auto;display:flex;gap:0;margin:0 -10px;padding:6px calc(var(--sar) + 8px) calc(var(--sab) + 6px) calc(var(--sal) + 8px);
  background:#fff;border-top:3px solid var(--ink)}
#bottomNav button{flex:1;min-height:48px;border:0;background:none;font-weight:900;font-size:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;border-radius:8px;position:relative}
#bottomNav button .ni{font-size:19px;line-height:1}
#bottomNav button.on{background:var(--yellow);box-shadow:inset 0 0 0 2.5px var(--ink)}
#bottomNav button .dot{position:absolute;right:18%;top:4px;width:10px;height:10px;border-radius:50%;background:var(--red);border:2px solid var(--ink)}

.sec-title{display:inline-block;font-weight:900;font-size:14px;background:var(--red);color:#fff;padding:1px 10px;border:2px solid var(--ink);
  transform:skewX(-8deg);box-shadow:3px 3px 0 var(--ink);margin:2px 0 8px}
.row-head{display:flex;align-items:center;justify-content:space-between;gap:8px}
.buyamt{display:flex;border:2px solid var(--ink);border-radius:6px;overflow:hidden;box-shadow:2px 2px 0 var(--ink);margin-bottom:6px}
.buyamt button{min-width:44px;height:34px;border:0;border-left:2px solid var(--ink);background:#fff;font-weight:900;font-size:13px}
.buyamt button:first-child{border-left:0}
.buyamt button.on{background:var(--ink);color:var(--yellow)}

.card{position:relative;display:flex;align-items:center;gap:10px;background:#fffaf0;border:3px solid var(--ink);
  border-radius:8px;box-shadow:4px 4px 0 var(--ink);padding:7px 8px 7px 9px;margin-bottom:10px}
.card.hl{background:#fff6cf}
.card.dim{opacity:.75}
.card.flash{animation:flash .35s}
@keyframes flash{0%{background:#fff}30%{background:var(--yellow)}100%{background:#fffaf0}}
.ava{flex:0 0 auto;width:54px;height:54px;border:2px solid var(--ink);border-radius:50%;overflow:hidden;
  background:radial-gradient(rgba(20,20,20,.22) 1.2px,transparent 1.6px) 0 0/6px 6px,#fff;display:grid;place-items:center;font-size:26px}
.ava img{width:100%;height:100%;display:block}
.ava.sq{border-radius:10px}
.ava.art{background:#fbf4e6}
.ava.art img{object-fit:cover}
.ava.bust{width:128px;height:128px;border-radius:16px}
.info{flex:1;min-width:0}
.name{font-weight:900;font-size:15px;display:flex;align-items:center;gap:5px;white-space:nowrap;overflow:hidden}
.lv{background:var(--ink);color:#fff;font-size:11px;padding:2px 6px;border-radius:3px;font-weight:800;flex:0 0 auto}
.tag{font-size:10px;font-weight:900;padding:1px 5px;border-radius:3px;border:2px solid var(--ink);flex:0 0 auto}
.tag.match{background:var(--yellow)}
.tag.cross{background:var(--pink);color:#fff}
.tag.idle{background:var(--gray)}
.desc{font-size:12px;color:#555;margin:2px 0;line-height:1.35}
.desc.one{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gain{font-size:12px;color:var(--red);font-weight:800;line-height:1.35}
.mbar{height:8px;border:2px solid var(--ink);border-radius:5px;overflow:hidden;background:#eee;margin-top:4px}
.mbar i{display:block;height:100%;background:var(--red)}
.btns{display:flex;flex-direction:column;gap:6px;flex:0 0 auto}
.buy{flex:0 0 auto;min-width:86px;min-height:48px;border:3px solid var(--ink);border-radius:8px;background:var(--yellow);font-weight:900;font-size:14px;
  box-shadow:3px 3px 0 var(--ink);padding:3px 8px;line-height:1.15;display:flex;flex-direction:column;align-items:center;justify-content:center}
.buy small{font-size:12px;font-weight:800;display:flex;align-items:center;gap:3px;white-space:nowrap}
.buy small::before{content:"";width:11px;height:11px;border-radius:50%;background:var(--yellow);border:2px solid var(--ink);flex:0 0 auto}
.buy:active{transform:translate(3px,3px);box-shadow:0 0 0 var(--ink)}
.buy.no{background:#eee;color:#888}
.buy.no small::before{background:#ddd}
.buy.alt{background:#fff;min-height:40px}
.buy.red{background:var(--red);color:#fff}
.buy.big{width:100%;min-height:54px;font-size:18px}
.buy.ghost{background:#fff}
.buy[disabled]{opacity:.55}
.shake{animation:shake .3s}
@keyframes shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
.summary{font-size:11.5px;font-weight:800;background:#fff;border:2px dashed var(--ink);border-radius:6px;padding:4px 8px;margin-bottom:8px;line-height:1.45}
.note{font-size:11px;color:#666;line-height:1.5;margin:4px 2px 12px}
/* 体验-177：卡片里直接放了说明（收藏页「设置」的存档卡）→ 换行：标题说明占整行，按钮和说明排第二行，不再挤成竖字 */
.card:has(> .note){flex-wrap:wrap}
.card:has(> .note) > .info{flex:1 0 100%}
.card:has(> .note) > .note{flex:1 1 0;min-width:0;margin:0}

/* CEO / cross list */
.cross-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}
.cross-item{border:2px solid var(--ink);border-radius:8px;background:#fff;padding:8px;box-shadow:3px 3px 0 var(--ink);text-align:left;font-size:12px;min-height:84px}
.cross-item b{display:block;font-size:14px;margin-bottom:2px}
.cross-item.on{background:#ffe3ee}
.cross-item .who{font-size:11px;color:#555}

/* gacha */
.box-hero{display:flex;align-items:center;gap:12px;background:#fff;border:3px solid var(--ink);border-radius:10px;box-shadow:4px 4px 0 var(--ink);padding:10px;margin-bottom:12px}
.box-ico{flex:0 0 auto;width:84px;height:84px}
.box-ico svg{width:100%;height:100%}
.box-ico.shake svg{animation:boxshake .5s infinite}
@keyframes boxshake{0%,100%{transform:rotate(0)}25%{transform:rotate(-8deg)}75%{transform:rotate(8deg)}}
.item-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:14px}
.item{aspect-ratio:1/1.15;border:2px solid var(--ink);border-radius:8px;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;
  font-size:11px;font-weight:800;text-align:center;padding:3px;line-height:1.15;position:relative}
.item .ii{font-size:26px;line-height:1.1;margin-bottom:2px}
.item.no{background:repeating-linear-gradient(45deg,#f2eee4 0 6px,#e8e2d4 6px 12px);color:#999}
.item.no .ii,.item.no img{filter:grayscale(1) brightness(0);opacity:.25}
.item.sel{background:var(--yellow);box-shadow:inset 0 0 0 2px var(--ink)}
.item .t{position:absolute;top:2px;left:3px;font-size:9px;color:#888}
.story{border:2px solid var(--ink);border-radius:8px;background:#fffdf2;padding:8px 10px;margin-bottom:10px;box-shadow:3px 3px 0 var(--ink)}
.story b{font-size:14px}
.story p{margin:4px 0 0;font-size:13px;line-height:1.5}
.story.no{background:#eee;color:#999}
.toggle{min-width:64px;min-height:40px;border:2px solid var(--ink);border-radius:20px;background:#fff;font-weight:900}
.toggle.on{background:var(--green);color:#fff}

/* ---------- modal ---------- */
.modal{position:fixed;inset:0;z-index:50;display:grid;place-items:center;background:rgba(20,20,20,.55);padding:16px}
.modal .burst{position:absolute;inset:-50%;background:repeating-conic-gradient(rgba(255,210,63,.18) 0 8deg,transparent 8deg 16deg);animation:spin 30s linear infinite;pointer-events:none}
@keyframes spin{to{transform:rotate(360deg)}}
.mpanel{position:relative;width:min(92vw,400px);max-height:calc(100dvh - 40px - var(--sat) - var(--sab));overflow-y:auto;background:#fff;border:3px solid var(--ink);border-radius:12px;box-shadow:7px 7px 0 var(--ink);
  padding:18px 16px 16px;text-align:center;animation:popin .35s cubic-bezier(.3,1.6,.5,1)}
@keyframes popin{0%{transform:scale(.5)}100%{transform:scale(1)}}
.mbubble{display:inline-block;background:var(--ink);color:#fff;font-weight:900;padding:6px 12px;border-radius:14px;font-size:15px;position:relative;margin-bottom:10px}
.mtitle{font-weight:900;font-size:18px;margin-bottom:6px}
.mreward{font-size:32px;font-weight:900;margin:8px 0;text-shadow:2px 2px 0 var(--yellow);word-break:break-all}
/* 盲盒-70：离线结算醒目横条 */
.bb70-offline-banner{margin:10px 0 12px;padding:12px;border:3px solid var(--ink);border-radius:14px;background:linear-gradient(180deg,#ffe566 0%,#ffd23f 100%);box-shadow:3px 3px 0 var(--ink);display:flex;flex-direction:column;gap:8px}
.bb70-offline-txt{font-weight:900;font-size:14px;line-height:1.4;color:var(--ink);text-align:center}
.bb70-offline-banner .buy{width:100%}

.mnote{font-size:12px;color:#555;line-height:1.55;margin-bottom:12px}
.mbtns{display:flex;flex-direction:column;gap:10px}
.mbtns.two{flex-direction:row}
.mbtns.two .buy{flex:1}
.pv-table{width:100%;border-collapse:collapse;margin:8px 0 10px;font-size:13px}
.pv-table td{border-bottom:1.5px dashed #bbb;padding:6px 2px;text-align:right;white-space:nowrap}
.pv-table td:first-child{text-align:left;font-weight:800;white-space:normal}
.pv-table tr.total td{border-bottom:0;border-top:3px solid var(--ink);font-weight:900;font-size:14px}
.up{color:var(--green);font-weight:900}
.down{color:var(--red);font-weight:900}
.same{color:#777}
.pv-who{font-size:11px;color:#666;font-weight:600}
.pv-tags{display:flex;flex-direction:column;gap:6px;text-align:left;font-size:12px;margin-bottom:12px}
.pv-tags div{border:2px solid var(--ink);border-radius:6px;padding:5px 8px;background:#fff6cf}
.pv-tags div.off{background:#eee;color:#666}

/* 漫画格 */
.comic{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:6px 0 12px;transform:rotate(-.5deg)}
.panel4{border:3px solid var(--ink);background:#fff;min-height:104px;padding:6px;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;
  background:radial-gradient(rgba(20,20,20,.13) 1.1px,transparent 1.5px) 0 0/6px 6px,#fff;animation:panelin .4s both}
.panel4:nth-child(2){animation-delay:.25s}.panel4:nth-child(3){animation-delay:.5s}.panel4:nth-child(4){animation-delay:.75s}
@keyframes panelin{0%{opacity:0;transform:scale(.8)}100%{opacity:1;transform:scale(1)}}
.panel4 .pe{font-size:34px;line-height:1.1}
.panel4 .pt{font-size:12px;font-weight:800;line-height:1.35;background:#fff;border:2px solid var(--ink);border-radius:10px;padding:3px 6px;margin-top:4px}
.panel4 .pn{position:absolute;top:2px;left:4px;font-size:10px;font-weight:900}
.comic-sfx{font-size:30px;font-weight:900;color:var(--red);-webkit-text-stroke:1.5px var(--ink);transform:rotate(-8deg);margin:-4px 0 6px}
.comic.two .panel4{min-height:170px;justify-content:flex-start;padding-top:14px}
.pchar{position:relative;width:72px;height:72px;border:2px solid var(--ink);border-radius:50%;background:#fff;overflow:visible}
.pimg{width:100%;height:100%;border-radius:50%;overflow:hidden;background:radial-gradient(rgba(20,20,20,.18) 1.2px,transparent 1.6px) 0 0/6px 6px,#fff}
.pimg img{width:100%;height:100%;display:block;transform:scale(1.75);transform-origin:50% 66%}
.pimg img.art{transform:none;object-fit:cover}
.pchar .pe{position:absolute;right:-14px;bottom:-6px;font-size:28px}
.comic.two .pt{margin-top:10px}
.cross-wrap.has-art .comic{display:none}.cross-wrap:not(.has-art) .cross-cap{display:none}
.cross-art{display:flex;justify-content:center;margin:2px 0 8px}
.cross-art img{width:min(80vw,340px,calc(100dvh - 330px));min-width:180px;aspect-ratio:1;object-fit:cover;border:3px solid var(--ink);border-radius:12px;background:#fbf4e6;display:block}
.cross-zoom{position:relative;padding:0;border:0;background:none;cursor:zoom-in;display:block;border-radius:12px}
.cross-zoom:focus-visible{outline:3px solid var(--yellow);outline-offset:3px}
.zoom-hint{position:absolute;right:6px;bottom:6px;background:rgba(20,20,20,.72);color:#fff;font-size:11.5px;font-weight:800;padding:3px 8px;border-radius:10px;pointer-events:none}
.modal:has(.mpanel.zoom){padding:6px}
.mpanel.zoom{width:min(calc(100vw - 12px),520px);padding:14px 6px 12px;box-shadow:4px 4px 0 var(--ink)}
.mpanel.zoom .job-big img{width:min(calc(100vw - 36px),480px,calc(100dvh - 190px - var(--sat) - var(--sab)));cursor:zoom-out}
.cross-cap{font-size:12.5px;font-weight:800;line-height:1.45;margin:0 0 10px;text-align:left}
.cross-cap div{background:#fff;border:2px solid var(--ink);border-radius:10px;padding:3px 8px;margin-top:4px}
.swap-box{text-align:left;font-size:12.5px;line-height:1.6;border:2px solid var(--ink);border-radius:8px;background:#fff6cf;padding:6px 9px;margin:4px 0 6px}
.swap-box b{background:var(--ink);color:var(--yellow);padding:0 6px;border-radius:3px}

/* sheet */
.sheet{position:fixed;inset:0;z-index:45}
.sheet-bg{position:absolute;inset:0;background:rgba(20,20,20,.45)}
.sheet-panel{position:absolute;left:0;right:0;bottom:0;max-width:560px;margin:0 auto;background:var(--paper2);border-top:3px solid var(--ink);border-radius:16px 16px 0 0;
  padding:14px 14px calc(var(--sab) + 14px);max-height:80dvh;overflow-y:auto;animation:sheetin .25s ease-out}
@keyframes sheetin{from{transform:translateY(100%)}to{transform:translateY(0)}}
.sheet-title{font-weight:900;font-size:17px;margin-bottom:10px;display:flex;align-items:center;gap:8px}
.pick{width:100%;display:flex;align-items:center;gap:10px;text-align:left;border:3px solid var(--ink);border-radius:10px;background:#fff;padding:8px 10px;margin-bottom:10px;box-shadow:3px 3px 0 var(--ink);min-height:56px}
.pick:active{transform:translate(2px,2px);box-shadow:0 0 0 var(--ink)}
.pick[disabled]{opacity:.5}
.pick .pk-main{flex:1;min-width:0}
.pick .pk-name{font-weight:900;font-size:15px}
.pick .pk-sub{font-size:12px;color:#555}
.pick.cur{background:#eee}

/* lock overlay */
.lock{position:fixed;inset:0;z-index:100;display:grid;place-items:center;background:rgba(247,241,227,.96);padding:24px}
.lock-card{max-width:340px;text-align:center;background:#fff;border:3px solid var(--ink);border-radius:12px;box-shadow:6px 6px 0 var(--ink);padding:22px 18px}
.lock-ico{font-size:44px}
.lock-title{font-weight:900;font-size:19px;margin:6px 0}
.lock-txt{font-size:13px;color:#555;margin-bottom:14px;line-height:1.5}

#toast{position:fixed;left:50%;bottom:calc(var(--sab) + 84px);transform:translateX(-50%);z-index:60;background:var(--ink);color:#fff;font-weight:800;font-size:14px;
  padding:9px 16px;border-radius:20px;width:max-content;max-width:88vw;text-align:center;word-break:keep-all;overflow-wrap:anywhere;text-wrap:balance;animation:toastin .25s ease-out;pointer-events:none}
/* 文案-108：left:50% 时宽度只剩半屏，toast 被挤成窄条把「明天」拆开；改按内容宽（上限 88vw），中文只在空格/标点处换行，放不下才强拆 */
@keyframes toastin{from{opacity:0;transform:translate(-50%,10px)}to{opacity:1;transform:translate(-50%,0)}}

@media (max-height:700px){
  #stage{height:clamp(150px,26vh,230px);height:clamp(150px,26dvh,230px)}
  .money{min-height:52px;padding:4px 10px} #coins{font-size:26px}
  .title-row{height:40px} .icon-btn{width:40px;height:40px}
  #shopTabs{margin:8px 0 5px}
  .summary{font-size:11px;padding:3px 7px;margin-bottom:6px}
}
@media (max-width:360px){ .logo{font-size:19px} .chip{padding:0 6px;font-size:11px} .buy{min-width:78px} }
/* 盲盒 v2：超级装饰 / 暴击显示 / CEO 衣橱 */
.critline{display:flex;gap:6px;margin-top:3px;flex-wrap:wrap}
.critline span{background:#fff0f5;border:2px solid var(--ink);border-radius:4px;padding:0 6px;font-size:11px}
.critline b{color:var(--red)}
.critline small{font-size:10px;color:#555;margin-left:2px}
.critline .cl-tip{background:#effaf5;font-size:10px;color:#333}
.card.super{background:linear-gradient(135deg,#fff6cf,#ffe0ef);box-shadow:4px 4px 0 var(--pink)}
.card.super .ava{background:#fff}
.card.super .ava.sq{font-size:30px;display:flex;align-items:center;justify-content:center}
.card.super.dim{background:#f2eee4;box-shadow:none}
.who-row{display:flex;gap:8px;overflow-x:auto;margin:2px 0 6px;padding-bottom:2px}
.who{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:2px;background:#fff;border:2px solid var(--ink);border-radius:10px;padding:4px 6px;font-size:11px;font-weight:900;min-width:64px;min-height:44px}
.who .ava{width:40px;height:40px}
.who.on{background:var(--yellow);box-shadow:3px 3px 0 var(--ink)}
.item.superpop{background:linear-gradient(135deg,#fff3a0,#ffc2dd);animation:superpop .9s ease-out}
@keyframes superpop{0%{transform:scale(.3) rotate(-20deg)}60%{transform:scale(1.15) rotate(6deg)}100%{transform:scale(1) rotate(0)}}
@media (prefers-reduced-motion:reduce){.item.superpop{animation:none}}

/* ===== 布局：店景只留在经营页；其他页紧凑页头 ===== */
#app[data-tab]:not([data-tab="shop"]) #stage{display:none}
#app[data-tab]:not([data-tab="shop"]) #shopTabs{display:none}
#app[data-tab]:not([data-tab="shop"]) #goal{display:none}
#compactHead{flex:0 0 auto;background:#fff;border:3px solid var(--ink);border-radius:8px;box-shadow:3px 3px 0 var(--ink);padding:8px 10px;margin-bottom:8px}
#compactHead.hidden{display:none!important}
#compactHead .ch-title{font-weight:900;font-size:14px;margin-bottom:6px}
#compactHead .ch-row{display:flex;gap:6px;overflow-x:auto;padding-bottom:2px}
#compactHead .ch-card{flex:0 0 auto;min-width:72px;border:2px solid var(--ink);border-radius:8px;background:#fffaf0;padding:4px 6px;text-align:center;font-size:11px;font-weight:800;line-height:1.25}
#compactHead .ch-card .ava{width:36px;height:36px;margin:0 auto 2px}
#compactHead .ch-card b{display:block;font-size:12px}
#compactHead .ch-card small{color:#666;font-weight:700}
#compactHead .ch-note{font-size:11px;color:#666;margin-top:6px;line-height:1.4}

/* 衣橱分区 */
.slot-title{font-size:12px;font-weight:900;margin:8px 0 4px;display:flex;align-items:center;gap:6px}
.slot-title::before{content:"";width:8px;height:8px;background:var(--red);border:2px solid var(--ink);border-radius:2px}
.wear-preview{display:flex;align-items:center;gap:12px;background:#fff;border:3px solid var(--ink);border-radius:10px;box-shadow:3px 3px 0 var(--ink);padding:8px 10px;margin-bottom:8px}
.wear-preview .wp-ava{width:88px;height:88px;border:2px solid var(--ink);border-radius:50%;overflow:hidden;background:#fff;flex:0 0 auto}
.wear-preview .wp-ava img{width:100%;height:100%;display:block;transform:scale(1.7);transform-origin:50% 70%}
.wear-preview .wp-info{flex:1;min-width:0;text-align:left}
.wear-preview .wp-name{font-weight:900;font-size:15px}
.wear-preview .wp-sub{font-size:12px;color:#555;margin-top:2px}

/* 升级卡更突出等级 / 增量 / 原因 */
.card .gain.warn{color:#9a3412;background:#fff3cd;border:2px dashed var(--ink);border-radius:4px;padding:2px 6px;display:inline-block}
.details-fold{font-size:11px;color:#666;margin-top:4px}
.details-fold summary{cursor:pointer;font-weight:800;color:#444}

/* 团单进度条（画在 canvas 上为主；DOM 备用） */
.order-hud{position:absolute;left:8px;right:8px;bottom:8px;z-index:3;pointer-events:none}
/* CEO×店铺 任职形象 */
.job-gal{display:flex;gap:10px;align-items:stretch;margin:-6px 4px 14px;padding:10px 8px 8px;background:#fff6e3;border:3px solid var(--ink);border-top:none;border-radius:0 0 12px 12px}
.job-pic{position:relative;flex:0 0 auto;width:132px;height:132px;padding:0;border:2px solid var(--ink);border-radius:12px;overflow:hidden;background:#fbf4e6;cursor:pointer}
.job-pic img{width:100%;height:100%;object-fit:cover;display:block}
.job-wip{position:absolute;left:0;right:0;bottom:0;background:rgba(20,20,20,.72);color:#fff;font-size:11px;font-weight:800;padding:2px 0;text-align:center}
.job-side{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.job-cap{font-size:12px}
.job-chips{display:grid;grid-template-columns:1fr 1fr;gap:5px}
.job-chip{position:relative;min-height:36px;font:inherit;font-size:12px;font-weight:800;border:2px solid var(--ink);border-radius:8px;background:#fff;padding:4px 2px;cursor:pointer;white-space:nowrap}
.job-chip.on{background:var(--yellow);box-shadow:2px 2px 0 var(--ink)}
.job-chip.lock{opacity:.45;cursor:default}
.job-chip i{position:absolute;top:-8px;right:-4px;font-style:normal;font-size:9px;background:var(--red);color:#fff;border-radius:6px;padding:0 4px;border:2px solid var(--ink)}
.job-hint{font-size:10px;color:#6b5b4b}
.job-big{display:flex;justify-content:center;margin:6px 0}
.job-big img{width:min(78vw,340px);aspect-ratio:1;object-fit:cover;border:3px solid var(--ink);border-radius:16px;background:#fbf4e6}

/* ===== CEO 生活篇：家宅 / 商城（翻书） ===== */
#bottomNav button{min-width:0}
.book-tabs{display:flex;gap:0;margin:0 0 8px;border:3px solid var(--ink);border-radius:10px;overflow:hidden;box-shadow:3px 3px 0 var(--ink);background:#fff}
.book-tabs button{flex:1;min-height:38px;border:0;border-left:2px solid var(--ink);background:#fff;font-weight:900;font-size:13px}
.book-tabs button:first-child{border-left:0;background:#f2eee4}
.book-tabs button.on{background:var(--yellow)}
.home-who{margin-bottom:6px}
.home-who .who{min-width:58px;padding:3px 5px;font-size:10.5px}
.home-who .who .ava{width:30px;height:30px;font-size:16px}
.home-who .who.locked{opacity:.55}
.home-card .ava.sq{font-size:30px}
.home-card .lux{color:var(--red);font-size:14px}
.room{position:relative;border:3px solid var(--ink);border-radius:6px;box-shadow:5px 5px 0 var(--ink);overflow:hidden;margin:2px 4px 10px 0;background:var(--wall)}
.room-art{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;z-index:0;pointer-events:none}
/* 有底图时：墙和地板只留透明的格子线，固定装修全靠底图 */
.room.has-art .room-wall,.room.has-art .room-floor{background:transparent!important;border-bottom-color:transparent}
.room.has-art .rw-deco{display:none}
.room.has-art .room-floor{background-image:linear-gradient(to right,rgba(20,20,20,.12) 1px,transparent 1px),linear-gradient(to bottom,rgba(20,20,20,.12) 1px,transparent 1px)!important;background-size:calc(100% / var(--cols)) calc(100% / var(--rows))!important}
.room-wall{position:relative;z-index:1;aspect-ratio:var(--cols)/2;display:flex;align-items:flex-start;justify-content:flex-end;gap:6px;padding:8px 10px 0;border-bottom:5px solid var(--trim);
  background:radial-gradient(rgba(20,20,20,.12) 1.1px,transparent 1.5px) 0 0/7px 7px,var(--wall)}
.room-wall .rw-deco{font-size:22px}
.room-wall .rw-name{font-size:11px;font-weight:900;background:#fff;border:2px solid var(--ink);border-radius:4px;padding:1px 6px;transform:rotate(-2deg)}
.room-floor{position:relative;z-index:1;aspect-ratio:var(--cols)/var(--rows);touch-action:none;
  background-image:linear-gradient(to right,rgba(20,20,20,.22) 1.5px,transparent 1.5px),linear-gradient(to bottom,rgba(20,20,20,.22) 1.5px,transparent 1.5px);
  background-size:calc(100% / var(--cols)) calc(100% / var(--rows));background-color:var(--floor)}
.room.tier-hut .room-floor{background-image:linear-gradient(to right,rgba(20,20,20,.22) 1.5px,transparent 1.5px),linear-gradient(to bottom,rgba(20,20,20,.22) 1.5px,transparent 1.5px),
  repeating-linear-gradient(to bottom,transparent 0 9px,rgba(120,70,30,.18) 9px 10px)}
.room.tier-hut .room-floor{background-size:calc(100% / var(--cols)) calc(100% / var(--rows)),calc(100% / var(--cols)) calc(100% / var(--rows)),auto}
.room.tier-apt .room-wall{background:repeating-linear-gradient(90deg,var(--wall) 0 14px,#d4e6fb 14px 16px)}
.room.tier-apt .room-floor{background-image:linear-gradient(to right,rgba(20,20,20,.22) 1.5px,transparent 1.5px),linear-gradient(to bottom,rgba(20,20,20,.22) 1.5px,transparent 1.5px),
  conic-gradient(rgba(255,255,255,.35) 25%,transparent 0 50%,rgba(255,255,255,.35) 0 75%,transparent 0)}
.room.tier-apt .room-floor{background-size:calc(100% / var(--cols)) calc(100% / var(--rows)),calc(100% / var(--cols)) calc(100% / var(--rows)),calc(200% / var(--cols)) calc(200% / var(--rows))}
.room.tier-villa{border-color:#6b4f00;box-shadow:5px 5px 0 var(--ink),inset 0 0 0 3px #ffd23f}
.room.tier-villa .room-wall{background:linear-gradient(180deg,#fff8dc,var(--wall));border-bottom:6px double var(--trim)}
.room.has-art .room-wall{border-bottom-color:transparent!important}  /* 12b3：豪宅的金色双线踢脚边压在底图踢脚线上（12b1 起 Lv3 有底图），有底图时隐掉；无底图照旧 */
.room.tier-villa .room-floor{background-image:linear-gradient(to right,rgba(120,90,0,.28) 1.5px,transparent 1.5px),linear-gradient(to bottom,rgba(120,90,0,.28) 1.5px,transparent 1.5px),
  linear-gradient(135deg,rgba(255,255,255,.45),transparent 40%,rgba(255,255,255,.3) 60%,transparent)}
.room.tier-villa .room-floor{background-size:calc(100% / var(--cols)) calc(100% / var(--rows)),calc(100% / var(--cols)) calc(100% / var(--rows)),100% 100%}
.furn{position:absolute;z-index:2;border:2px solid var(--ink);border-radius:6px;background:var(--fc);box-shadow:2px 2px 0 rgba(20,20,20,.55);overflow:hidden;touch-action:none;cursor:grab}
.furn.rug{z-index:1;opacity:.85;border-style:dashed;box-shadow:none;border-radius:10px}
.furn.sel{z-index:4;outline:3px solid var(--red);outline-offset:1px;animation:furnsel .9s ease-in-out infinite alternate}
@keyframes furnsel{to{outline-color:var(--yellow)}}
.furn.lifting{opacity:.3}
.furn .fi{position:absolute;left:50%;top:50%;display:grid;place-items:center;pointer-events:none}
.furn .fi .fe,.furn-ico .fi .fe{font-size:min(26px,7vw);line-height:1}
.furn .fi img,.furn-ico .fi img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.furn .fi:has(img) .fe,.furn-ico .fi:has(img) .fe{visibility:hidden}
.furn.art{background:transparent;border-color:transparent;border-width:0;box-shadow:none}
.furn.art .fi img{filter:drop-shadow(2px 3px 0 rgba(20,20,20,.35))}
.furn.art:not(.sel) .fn{display:none}
.furn.tall{overflow:visible}
.room-wall{position:relative; overflow:visible}
.wall-grid{position:absolute;inset:0;z-index:2}
.room-wall .furn.wallf{z-index:2; border-radius:4px}
.room-wall .rw-deco,.room-wall .rw-name{position:relative;z-index:1;pointer-events:none}
/* 家宅-48 时段/天气标签；家宅-97 起并进右上房名牌（「77 的小屋 · 夜晚 · 雪」），不再单独挂左上角压住挂画 */
.room-wall .rw-status{font:inherit;white-space:nowrap}
.room-wall .rw-status::before{content:' · '}
.room-wall .rw-status[hidden]{display:none}
#wallHl{z-index:5}
.drag-ghost.tall{background:transparent;border-width:0;box-shadow:none}
.furn.tall .fi img{object-position:center bottom}
.furn.wallf .fi img{object-position:center top}  /* 挂画图贴格子上沿挂（墙壁最上面），图比格子扁也不往中间飘 */
.furn.rug.art .fi img{object-fit:fill}  /* 地毯平铺在地上：图拉满占地格 */
.furn.rug.art{opacity:1}
.furn .fn{position:absolute;left:2px;bottom:1px;font-size:9px;font-weight:900;background:rgba(255,255,255,.85);border-radius:3px;padding:0 3px;pointer-events:none;white-space:nowrap}
.drag-ghost{position:fixed;z-index:70;pointer-events:none;opacity:.85;transform:scale(1.05);box-shadow:4px 6px 0 rgba(20,20,20,.4)}
.drag-ghost.ok{outline:3px solid var(--green)}
.drag-ghost.bad{outline:3px solid var(--red)}
.room-hl{position:absolute;z-index:3;border:3px dashed var(--ink);border-radius:6px;pointer-events:none}
.room-hl.ok{background:rgba(31,157,85,.35);border-color:var(--green)}
.room-hl.bad{background:rgba(230,57,70,.35);border-color:var(--red)}
.room-tools{display:flex;align-items:center;gap:6px;margin:0 4px 10px 0;flex-wrap:wrap}
.room-tools .rt-sel{flex:1 1 120px;font-size:11.5px;font-weight:800;color:#555;min-width:0}
.room-tools .buy{min-width:64px;min-height:40px;font-size:13px}
.room-tools .buy[disabled]{opacity:.4}
.mall-go{min-height:36px!important;font-size:12px!important;margin-bottom:6px}
.inv-strip{display:flex;gap:8px;overflow-x:auto;overflow-y:hidden;padding:8px 2px 6px;margin:0 4px 4px 0;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
.tray-head{display:flex;align-items:center;gap:6px;margin:0 4px 0 0;font-size:11px;color:#555;font-weight:800}
.tray-head b{font-size:13px;color:var(--ink);background:var(--yellow);border:2px solid var(--ink);border-radius:4px;padding:0 6px;white-space:nowrap}
.tray-head span{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tray-head .mall-go{margin-bottom:0}
.inv-item{position:relative;flex:0 0 66px;height:70px;border:2px solid var(--ink);border-radius:8px;background:linear-gradient(#fff 55%,var(--fc));box-shadow:2px 2px 0 var(--ink);
  display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:11px;line-height:1.15;touch-action:pan-x;cursor:grab}
.inv-item .ie{font-size:24px;line-height:1.1;pointer-events:none}
.inv-item b,.inv-item small{pointer-events:none}
.inv-item small{font-size:9.5px;color:#555}
.inv-item i{position:absolute;top:-7px;right:-6px;font-style:normal;font-weight:900;font-size:11px;background:var(--red);color:#fff;border:2px solid var(--ink);border-radius:10px;padding:0 5px}
.mall-head{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:12px;font-weight:800;background:#fff;border:2px dashed var(--ink);border-radius:6px;padding:4px 8px;margin-bottom:8px}
.mall-head .coin-ico.sm{width:22px;height:22px;margin-right:3px}
.mall-head .coin-ico.sm span{font-size:10px}
.furn-ico{position:relative;background:var(--fc)!important;overflow:hidden}
.furn-ico .fi{position:absolute;left:50%;top:50%;display:grid;place-items:center}
.furn-ico.big{width:84px;height:84px;border:3px solid var(--ink);border-radius:12px;margin:2px auto 6px}
.furn-ico.big .fi .fe{font-size:42px}
.buy-prev{display:flex;justify-content:center}
/* 翻页动画：经营 → 家宅 → 商城 往后翻，回去往前翻 */
@keyframes flipNext{0%{transform:perspective(1100px) rotateY(-75deg);opacity:.15}100%{transform:none;opacity:1}}
@keyframes flipPrev{0%{transform:perspective(1100px) rotateY(75deg);opacity:.15}100%{transform:none;opacity:1}}
.flip-next{transform-origin:left center;animation:flipNext .38s cubic-bezier(.2,.8,.3,1)}
.flip-prev{transform-origin:right center;animation:flipPrev .38s cubic-bezier(.2,.8,.3,1)}
@media (prefers-reduced-motion:reduce){.flip-next,.flip-prev,.furn.sel{animation:none}}

/* 商城：分类 + 搜索 + 筛选（留白给以后加商品） */
.mall-search{display:flex;gap:6px;position:sticky;top:0;z-index:5;background:var(--paper,#f7f1e3);padding:4px 0 8px;margin-bottom:2px}
.mall-search input{flex:1;min-width:0;min-height:44px;border:2px solid var(--ink);border-radius:10px;padding:0 12px;font:inherit;font-weight:800;font-size:14px;background:#fff}
.mall-cats,.mall-subs{display:flex;gap:6px;overflow-x:auto;padding:0 0 8px;-webkit-overflow-scrolling:touch}
.mall-cats .mc,.mall-subs .ms{flex:0 0 auto;min-height:34px;padding:0 12px;border:2px solid var(--ink);border-radius:999px;background:#fff;font-weight:900;font-size:12px}
.mall-cats .mc.on,.mall-subs .ms.on{background:var(--yellow);box-shadow:2px 2px 0 var(--ink)}
.mall-filters{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-bottom:8px}
.mall-filters .mf{display:flex;align-items:center;gap:4px;font-size:12px;font-weight:800;background:#fff;border:2px solid var(--ink);border-radius:8px;padding:4px 8px;min-height:34px}
.mall-filters select{min-height:34px;border:2px solid var(--ink);border-radius:8px;font:inherit;font-weight:800;font-size:12px;padding:0 8px;background:#fff}
.mall-count{font-size:11px;font-weight:800;color:#666;margin:0 0 8px;display:flex;justify-content:space-between}
.mall-styles{display:flex;gap:6px;overflow-x:auto;padding:0 0 8px;-webkit-overflow-scrolling:touch}
.mall-styles .mst{flex:0 0 auto;display:inline-flex;align-items:center;gap:5px;min-height:44px;padding:0 12px;border:2px solid var(--ink);border-radius:999px;background:#fff;font-weight:800;font-size:12px}
.mall-styles .mst.on{background:var(--yellow);box-shadow:2px 2px 0 var(--ink)}
.sdot{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--sc,#999);border:1.5px solid var(--ink);flex:0 0 auto}
.mall-card .fstyles{display:flex;flex-wrap:wrap;gap:4px 10px;margin:0 0 2px}
.mall-card .fst{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:800;color:var(--ink-3,#555);line-height:1.2}
.mall-spacer{color:#999}
.mall-list{display:flex;flex-direction:column;gap:8px;min-height:220px}
.mall-card.mall-ghost{opacity:.45;border-style:dashed}
.mall-card.mall-ghost .buy{display:none}

.mode-tabs{display:flex;gap:0;margin:0 4px 8px 0;border:2px solid var(--ink);border-radius:10px;overflow:hidden;background:#fff}
.mode-tabs .mt{flex:1;min-height:36px;border:0;border-left:2px solid var(--ink);background:#fff;font-weight:900;font-size:13px}
.mode-tabs .mt:first-child{border-left:0}
.mode-tabs .mt.on{background:#b8f2e6}
.mode-tabs .mt.on:last-child{background:#ffe8a3}
.home-actor{position:absolute;z-index:6;width:18%;height:0;transform:translate(-50%,-70%);pointer-events:none;transition:left .05s linear, top .05s linear}
.home-actor .ha-ava{display:block;width:100%;aspect-ratio:1}
.home-actor .ha-ava .ava{width:100%;height:100%;border-width:2px}
.home-actor .ha-line{position:absolute;left:50%;bottom:108%;transform:translateX(calc(-50% + var(--ha-dx,0px)));background:#fff;border:2px solid var(--ink);border-radius:8px;padding:2px 6px;font-size:10px;font-weight:800;line-height:1.3;text-align:center;white-space:normal;width:max-content;max-width:140px;overflow-wrap:anywhere}
.home-actor .ha-line.ha-below{bottom:auto;top:108%}
.home-actor .ha-act{position:absolute;right:-4px;top:-8px;font-style:normal;font-size:14px}
.live-note{margin:0 4px 8px 0}
.room.live-mode .furn{cursor:pointer}

/* 房名牌 / emoji 窗户都靠右上（压在禁区上），左边空墙留给挂画 */
/* 墙面禁区：拖挂画时才显示（斜纹红），和 E.wallBlockedCells 同一份 */
.wall-block{position:absolute;display:none;pointer-events:none;z-index:1;border-radius:4px;background:repeating-linear-gradient(45deg,rgba(230,57,70,.30) 0 6px,rgba(230,57,70,.08) 6px 12px);outline:1px dashed rgba(230,57,70,.6);outline-offset:-2px}
.wall-grid.show-block .wall-block{display:block}


/* ======================================================================
   12c 漫画 UI 系统：经营 / 家宅 / CEO 统一（导航图标、面板、按钮、字级、弹窗、进度条、徽标）
   规则：实线 + 墨影 = 可点的格子 / 面板；虚线 = 说明框；黄 = 选中；红 = 行动 / 提醒；斜纹 = 不可用
   只叠加外观，不改 ID / data-act / 结构；店景人物、家宅底图、CEO 立绘等第二步（等熊大的规范和图）
   ====================================================================== */
/* 页面内容自成一层（z 0），弹窗 / 抽屉 / 提示一定盖在上面（修旧版 WebKit 里锁住的任职签会透到调任抽屉上面） */
#app{z-index:0}
/* --- 图标：同一支墨线笔 --- */
.ic{width:24px;height:24px;display:block;flex:0 0 auto;fill:none;stroke:var(--ink);stroke-width:2;stroke-linejoin:round;stroke-linecap:round;overflow:visible;pointer-events:none;
}
/* 12c1：图标配色变量的默认值放到 :root，按钮 / 页签的选中态变量才能继承下来（原来写在 .ic 自身，会盖住按钮的选中色） */
:root{--ica:var(--red);--icy:var(--yellow);--icf:#fff}

/* --- 底部导航：漫画格页签 --- */
#bottomNav{gap:4px;background:radial-gradient(rgba(20,20,20,.07) 1px,transparent 1.4px) 0 0/6px 6px,var(--panel);border-top:var(--lw-3) solid var(--ink)}
#bottomNav button{min-height:50px;gap:2px;color:var(--ink-2);font-size:11.5px;letter-spacing:.5px;border-radius:var(--r-md);--ica:#f0a9af;--icy:#fbe6a0;transition:transform .12s ease-out}
#bottomNav button .ni{display:grid;place-items:center;width:30px;height:26px;font-size:0}
#bottomNav button.on{color:var(--ink);background:var(--tone-yel),var(--yellow);box-shadow:inset 0 0 0 var(--lw-2) var(--ink),var(--sh-1);transform:translateY(-2px);--ica:var(--red);--icy:#fff6c2}
#bottomNav button.on .ic{transform:rotate(-6deg) scale(1.08)}
#bottomNav button:active{transform:translate(1px,1px)}
#bottomNav button .dot,#shopTabs button .dot{background:var(--red);border:var(--lw-1) solid var(--ink);box-shadow:1px 1px 0 var(--ink)}

/* --- 顶部 --- */
.icon-btn{border:var(--lw-2) solid var(--ink);box-shadow:var(--sh-1);font-size:0}
.icon-btn .ic{width:24px;height:24px}
.icon-btn .ic-off,.icon-btn.off .ic-on{display:none}
.icon-btn.off .ic-off{display:block}
.icon-btn.off{background:var(--hatch);text-decoration:none}
.chip{border:var(--lw-2) solid var(--ink);box-shadow:var(--sh-1);letter-spacing:.3px}
.chip.used{background:var(--hatch);color:var(--ink-3)}
.money{border:var(--lw-3) solid var(--ink);border-radius:var(--r-md);box-shadow:var(--sh-3);background:var(--panel)}
.coin-ico{border-width:3px;box-shadow:inset -4px -4px 0 rgba(0,0,0,.15),1.5px 1.5px 0 var(--ink)}
#coins{font-size:var(--fs-num);text-shadow:var(--num-shadow);letter-spacing:.5px}
#cps{color:var(--red-ink)}
@media (max-height:700px){ #coins{font-size:26px} }

/* --- 店景 / 房间 / 立绘：统一墨框（画面内容第二步再统一） --- */
#stage{border:var(--lw-3) solid var(--ink);border-radius:var(--r-sm);box-shadow:var(--sh-3)}
.room{border:var(--lw-3) solid var(--ink);box-shadow:var(--sh-3)}
.room.tier-villa{box-shadow:var(--sh-3),inset 0 0 0 3px #ffd23f}
.ava{border:var(--lw-2) solid var(--ink)}
.card .ava,.pick .ava,.sheet-title .ava{box-shadow:var(--sh-1)}
.ava.bust{border-width:var(--lw-3);box-shadow:var(--sh-2)}
.job-pic{border:var(--lw-2) solid var(--ink);box-shadow:var(--sh-1)}
.job-big img,.cross-art img{border:var(--lw-3) solid var(--ink);box-shadow:var(--sh-2)}

/* --- 选择器（店铺签 / 数量 / 翻页签 / 模式签 / 分类）：选中 = 黄格 + 墨边 --- */
#shopTabs button{border:var(--lw-2) solid var(--ink);border-radius:var(--r-md);box-shadow:var(--sh-1);transition:transform .1s}
#shopTabs button small{color:var(--ink-3)}
#shopTabs button.on{background:var(--tone-yel),var(--yellow);color:var(--ink);box-shadow:var(--sh-2);transform:translateY(-2px)}
#shopTabs button.on small{color:var(--ink-2)}
#shopTabs button.locked{background:var(--hatch);color:var(--ink-3);box-shadow:none;border-style:dashed}
.buyamt,.book-tabs,.mode-tabs{border:var(--lw-2) solid var(--ink);border-radius:var(--r-md);box-shadow:var(--sh-1);background:#fff;overflow:hidden}
.buyamt button,.book-tabs button,.mode-tabs .mt{border-left:var(--lw-2) solid var(--ink);color:var(--ink);letter-spacing:.3px}
.buyamt button:first-child,.book-tabs button:first-child,.mode-tabs .mt:first-child{border-left:0}
.buyamt button.on,.book-tabs button.on,.mode-tabs .mt.on,.mode-tabs .mt.on:last-child{background:var(--tone-yel),var(--yellow);color:var(--ink);box-shadow:inset 0 -3px 0 var(--ink)}
.book-tabs button,.mode-tabs .mt{display:flex;align-items:center;justify-content:center;gap:4px}
.book-tabs button .ic,.mode-tabs .mt .ic{width:20px;height:20px}
.book-tabs button:first-child{background:var(--hatch)}
.book-tabs button:not(.on):not(:first-child) .ic,.mode-tabs .mt:not(.on) .ic{--ica:#f0a9af;--icy:#fbe6a0}
.mall-cats .mc,.mall-subs .ms,.mall-filters .mf,.mall-filters select,.job-chip{border:var(--lw-2) solid var(--ink)}
.mall-cats .mc.on,.mall-subs .ms.on,.job-chip.on,.who.on,.item.sel{background:var(--tone-yel),var(--yellow);box-shadow:var(--sh-1)}
.item.sel{box-shadow:inset 0 0 0 2px var(--ink),var(--sh-1)}
.job-chip.lock{background:var(--hatch);opacity:.7}
.job-chip i,.inv-item i{background:var(--red);border:var(--lw-1) solid var(--ink);box-shadow:1px 1px 0 var(--ink)}
.mall-search input{border:var(--lw-2) solid var(--ink);border-radius:var(--r-md);box-shadow:inset 2px 2px 0 rgba(20,20,20,.08)}
.mall-search input:focus{outline:3px solid var(--blue);outline-offset:1px}
.mall-search .buy{min-height:44px}

/* --- 段标题：墨底说明框 + 红错位影（和 logo 同一语言） --- */
.sec-title{background:var(--ink);color:#fff;border:var(--lw-2) solid var(--ink);border-radius:2px;box-shadow:var(--head-shadow);font-size:var(--fs-h);letter-spacing:1px;padding:2px 12px 2px 9px;margin:4px 0 9px}
.sec-title::before{content:"";display:inline-block;width:7px;height:7px;margin-right:7px;vertical-align:2px;background:var(--yellow);transform:rotate(45deg)}

/* --- 面板 / 卡片：墨边 + 硬投影 + 右上网点（主面板 lw-3 / sh-3；子格 lw-2 / sh-1~2） --- */
.card{background:var(--panel);border:var(--lw-3) solid var(--ink);border-radius:var(--r-md);box-shadow:var(--sh-3);isolation:isolate}
.card::after{content:"";position:absolute;top:0;right:0;width:64px;height:42px;z-index:-1;pointer-events:none;border-top-right-radius:4px;background:var(--tone-ink);
  -webkit-mask-image:linear-gradient(215deg,#000 15%,transparent 70%);mask-image:linear-gradient(215deg,#000 15%,transparent 70%)}
.card.hl{background:var(--panel-2)}
.card.hl::after,.card.super::after{background:var(--tone-red)}
.card.dim{opacity:.85;background:var(--hatch);box-shadow:var(--sh-1)}
.card.dim::after{display:none}
.card.super{border:var(--lw-3) solid var(--ink)}
.card.super.dim{background:var(--hatch)}
#compactHead,.box-hero,.wear-preview{border:var(--lw-3) solid var(--ink);border-radius:var(--r-md);box-shadow:var(--sh-3);background:var(--panel)}
.cross-item,.story,.pick,.lock-card{border-color:var(--ink)}
.cross-item,.story{border-width:var(--lw-2);border-radius:var(--r-md);box-shadow:var(--sh-2)}
.cross-item.on{background:var(--tone-red),var(--panel-pink)}
.cross-item:active{transform:translate(2px,2px);box-shadow:var(--sh-1)}
.story.no{background:var(--hatch);color:var(--ink-3);box-shadow:var(--sh-1)}
.item{border:var(--lw-2) solid var(--ink)}
.who,.inv-item,#compactHead .ch-card{border:var(--lw-2) solid var(--ink);border-radius:var(--r-md)}
#compactHead .ch-card{box-shadow:var(--sh-1);background:var(--panel)}
.job-gal{border:var(--lw-3) solid var(--ink);border-top:none;box-shadow:var(--sh-3);background:var(--tone-ink),#fff6e3}
/* 面板页眉条：墨底白字 */
#compactHead{padding:0 10px 8px;overflow:hidden}
#compactHead .ch-title{margin:0 -10px 8px;padding:4px 10px;background:var(--ink);color:#fff;font-size:var(--fs-h);letter-spacing:1px}
#compactHead .ch-title::before{content:"";display:inline-block;width:7px;height:7px;margin-right:7px;vertical-align:2px;background:var(--yellow);transform:rotate(45deg)}
#compactHead .ch-card small,#compactHead .ch-note{color:var(--ink-3)}
.tray-head b{background:var(--ink);color:var(--yellow);border-color:var(--ink);box-shadow:1.5px 1.5px 0 var(--red)}
/* 说明框：虚线 = 信息，不可点 */
.summary,.mall-head{border:var(--lw-2) dashed var(--ink);border-radius:var(--r-md);background:var(--panel)}

/* --- 字级 --- */
.name,.pick .pk-name,.wear-preview .wp-name,.box-hero .name{font-size:var(--fs-name);font-weight:900;letter-spacing:.3px}
.desc,.pick .pk-sub,.wear-preview .wp-sub,.cross-item .who,.mnote,.lock-txt{color:var(--ink-2)}
.desc{font-size:var(--fs-body)}
.note,.mall-count,.job-hint,.details-fold,.room-tools .rt-sel,.tray-head{color:var(--ink-3)}
.gain{color:var(--red-ink)}
.lv{background:var(--ink);color:var(--yellow);border-radius:2px;transform:skewX(-8deg);box-shadow:1.5px 1.5px 0 var(--red);font-variant-numeric:tabular-nums;letter-spacing:.3px}
.tag{border:var(--lw-1) solid var(--ink);border-radius:var(--r-sm)}
.tag.cross{color:#fff;background:#d6336c}
.buy small,.lv,#coins,#cps,.mreward,.pv-table td,.goal-txt,#compactHead .ch-card small,.inv-item i{font-variant-numeric:tabular-nums}

/* --- 按钮：主（黄）/ 确认（红）/ 次（白）/ 买不起 / 禁用 / 按下 --- */
.buy{border:3px solid var(--ink);border-radius:var(--r-md);box-shadow:var(--sh-2);letter-spacing:.5px;transition:transform .06s,box-shadow .06s}
.buy:active,.pick:active{transform:translate(3px,3px);box-shadow:0 0 0 var(--ink)}
.buy.red{background:var(--red);color:#fff;text-shadow:1px 1px 0 var(--ink)}
.buy.alt,.buy.ghost{background:#fff}
.buy.no{background:var(--hatch);color:var(--ink-3);text-shadow:none;box-shadow:var(--sh-1)}
.buy.no small::before{background:#e4ddcd}
.buy[disabled],.room-tools .buy[disabled]{opacity:1;background:var(--hatch);color:#80786c;border-style:dashed;box-shadow:none;text-shadow:none;cursor:not-allowed}
.buy[disabled]:active{transform:none}
.mall-go{flex-direction:row;gap:4px}
.mall-go .ic{width:18px;height:18px}
.toggle{border:var(--lw-2) solid var(--ink);box-shadow:var(--sh-1)}
.toggle:active,#shopTabs button:active,.buyamt button:active,.book-tabs button:active,.mode-tabs .mt:active,.mall-cats .mc:active,.mall-subs .ms:active,.job-chip:active,.who:active{transform:translate(1px,1px)}
.buy:focus-visible,.pick:focus-visible,.cx-close:focus-visible,#bottomNav button:focus-visible,#shopTabs button:focus-visible,.icon-btn:focus-visible,.chip:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
.pick{border-width:var(--lw-2);border-radius:var(--r-md);box-shadow:var(--sh-2)}
.pick.cur{background:var(--hatch)}

/* --- 进度条：墨框 + 网点底 + 速度线填充 --- */
.mbar,.goal-bar{border:var(--lw-2) solid var(--ink);border-radius:var(--r-pill);background:var(--tone-ink),#fff}
.mbar i{background:repeating-linear-gradient(-45deg,rgba(255,255,255,.32) 0 4px,transparent 4px 8px),var(--red)}
.goal-bar i{background:repeating-linear-gradient(-45deg,rgba(255,255,255,.5) 0 4px,transparent 4px 8px),var(--yellow)}
#goal{border:var(--lw-2) solid var(--ink);border-radius:var(--r-md);box-shadow:var(--sh-1);background:var(--panel)}
.goal-txt::before{background:var(--ink);color:var(--yellow);border-radius:2px}

/* --- 弹窗：漫画格 + 对白泡页眉 + 统一关闭钮 --- */
.mpanel{background:var(--panel);border:3px solid var(--ink);border-radius:var(--r-lg);box-shadow:var(--sh-4);isolation:isolate}
.mpanel::before{content:"";position:absolute;left:0;right:0;top:0;height:72px;z-index:-1;pointer-events:none;background:var(--tone-yel);
  -webkit-mask-image:linear-gradient(#000 20%,transparent);mask-image:linear-gradient(#000 20%,transparent)}
.mbubble{background:#fff;color:var(--ink);border:var(--lw-2) solid var(--ink);border-radius:18px;box-shadow:var(--sh-1);padding:5px 14px;margin-bottom:15px;max-width:100%;transform:rotate(-1.5deg)}
.mbubble::before,.mbubble::after{content:"";position:absolute;width:0;height:0;border-style:solid;border-color:transparent}
.mbubble::before{left:20px;bottom:-13px;border-width:12px 8px 0 4px;border-top-color:var(--ink)}
.mbubble::after{left:22.5px;bottom:-7px;border-width:8px 5px 0 2.5px;border-top-color:#fff}
.mpanel.has-x .mbubble{max-width:calc(100% - 84px)}
.mpanel.has-x > .cx-close + .mtitle{padding:0 34px}
.mtitle,.sheet-title,.lock-title{font-size:var(--fs-title);font-weight:900;letter-spacing:.5px;line-height:1.3}
.mreward{text-shadow:var(--num-shadow);letter-spacing:.5px}
.pv-table td{border-bottom:var(--lw-1) dashed #b8b0a2}
.pv-table tr.total td{border-top:3px solid var(--ink)}
.up{color:#137a41}
.down{color:var(--red-ink)}
.swap-box,.pv-tags div{border-color:var(--ink);border-width:var(--lw-2)}
.swap-box{background:var(--tone-yel),var(--panel-2)}
.cx-close{position:absolute;top:8px;right:8px;z-index:3;width:36px;height:36px;padding:0;border:var(--lw-2) solid var(--ink);border-radius:50%;background:#fff;box-shadow:var(--sh-1);display:grid;place-items:center}
.cx-close::before{content:"";position:absolute;inset:-7px}  /* 12b3：触控区实测 46×46px（36px 按钮减 2×2px 边框 = 32px 内框，四边各外扩 7px；原 -5px 只有 42px），中心 ±23px 内都命中 */
.cx-close .ic{width:18px;height:18px}
.cx-close:active{transform:translate(2px,2px);box-shadow:none}
.cx-close:active::before{transform:translate(-2px,-2px)}  /* 12b3：按下时按钮右下移 2px，热区反向移回，按住滑到边缘也不丢 */
/* 底部抽屉（调任选店 / 选 CEO）：同一套格子 + 页眉线 + 关闭钮 */
.sheet-panel{background:var(--tone-ink),var(--panel);border-top:var(--lw-3) solid var(--ink);box-shadow:0 -4px 0 rgba(20,20,20,.18)}
.sheet-title{padding:0 44px 9px 0;margin-bottom:12px;border-bottom:var(--lw-2) solid var(--ink);font-size:16px}
/* 提示条：说明框（caption box） */
#toast{background:#fffbe3;color:var(--ink);border:var(--lw-2) solid var(--ink);border-radius:var(--r-sm);box-shadow:var(--sh-2);font-weight:900;padding:8px 14px 8px 34px;line-height:1.4}
#toast::before{content:"!";position:absolute;left:9px;top:50%;margin-top:-9px;width:18px;height:18px;border-radius:50%;background:var(--red);color:#fff;border:var(--lw-1) solid var(--ink);font-size:12px;line-height:15px;text-align:center;box-sizing:border-box}
#toast.toast-good::before{content:"✓";background:var(--yellow);color:var(--ink);font-weight:900}   /* 文案-115：到账/获得/完成 用金色对勾；错误/被挡/金币不够 仍是红「!」 */
.lock-card{border:3px solid var(--ink);border-radius:var(--r-lg);box-shadow:var(--sh-4);background:var(--panel)}

/* --- 小屏：375 / 320 宽不挤 --- */
@media (max-width:360px){
  #bottomNav button{font-size:11px;letter-spacing:0}
  .sec-title{letter-spacing:.5px;padding:2px 9px 2px 7px}
  .mpanel.has-x .mbubble{font-size:14px}
  /* 320 宽：任职图缩到 104px，四个店名签不再挤出面板（旧版就溢出 13px） */
  .job-gal{gap:8px}
  .job-pic{width:104px;height:104px}
}
/* --- 减少动态：关掉弹出 / 抽屉 / 提示 / 闪烁等动画 --- */
@media (prefers-reduced-motion:reduce){
  .mpanel,.sheet-panel,#toast,.boost-tag,.modal .burst,#coins.bump,.sfx-word.pop,.panel4,.card.flash,.box-ico.shake svg{animation:none!important}
  #bottomNav button,#shopTabs button,.buy{transition:none}
  #bottomNav button.on,#shopTabs button.on{transform:none}
  #bottomNav button.on .ic{transform:none}
}

/* ======================================================================
   12c1：按熊大 13:18 视觉基准逐条补齐（只改外观，不碰玩法 / 存档 / 家具逻辑）
   色：墨线 #141414 / 纸色 #f7f1e3 / 内容底 #fffaf0 / 主黄 #ffd23f / 重点红 #e63946
   线：外框 3px（面板、卡片、店景、房间、弹窗、底栏）· 内框 2px（按钮、页签、头像、徽标）
   网点：正文区不铺；店景背景减轻；只留超级装饰卡一角
   黄：只有主操作（.buy 默认）是大黄块；选中态改浅黄底 + 墨线下划，不再和主按钮抢
   触控：页签 / 模式签 / 任职签 / 数量切换 / 去商城 / 按钮 ≥44px；每日双倍、声音键用透明扩展点击区（视觉不变）
   ====================================================================== */
:root{--sel:#fff1c4}
#app{background:var(--paper)}
/* 正文区去网点 / 减网点 */
.card::after,.card.hl::after{display:none}
.card.super::after{display:block;opacity:.6}
#bottomNav{background:var(--panel)}
.sheet-panel{background:var(--panel)}
.job-gal{background:var(--panel)}
.mpanel::before{display:none}
.swap-box{background:var(--panel-2)}
.cross-item.on{background:var(--panel-pink)}
.mbar,.goal-bar{background:#fff}
/* 选中态：浅黄 + 墨线下划（主黄块只留给主操作） */
#bottomNav button.on{background:var(--sel);box-shadow:inset 0 0 0 var(--lw-2) var(--ink),inset 0 -5px 0 var(--ink);--ica:var(--red);--icy:var(--yellow);--icf:#fff}
#shopTabs button.on{background:var(--sel);box-shadow:inset 0 -4px 0 var(--ink),var(--sh-1)}
.buyamt button.on,.book-tabs button.on,.mode-tabs .mt.on,.mode-tabs .mt.on:last-child{background:var(--sel);box-shadow:inset 0 -4px 0 var(--ink)}
.mall-cats .mc.on,.mall-subs .ms.on,.job-chip.on,.who.on,.item.sel{background:var(--sel)}
.job-chip.on,.who.on,.mall-cats .mc.on,.mall-subs .ms.on{box-shadow:inset 0 -3px 0 var(--ink),var(--sh-1)}
/* 内框 2px：按钮 */
.buy{border-width:var(--lw-2)}
/* 新增 SVG 图标的尺寸（店铺 / 家宅 / 锁 / 墙饰 / 生活动作） */
.ava.sq,.ava.lock-ava{display:grid;place-items:center}
.ava{background:#fff}
.ava.sq .ic{width:62%;height:auto;aspect-ratio:1}
.ava.lock-ava{background:var(--hatch)}
.ava.lock-ava .ic{width:56%;height:auto;aspect-ratio:1}
#shopTabs button .tn .ic,.job-chip .ic,.pv-table td .ic,.swap-box .ic{display:inline-block;width:16px;height:16px;vertical-align:-3px;margin-right:3px}
#shopTabs button small .ic{display:inline-block;width:12px;height:12px;vertical-align:-2px;margin-right:2px}
.room-tools .buy{flex-direction:row;gap:3px}
.room-tools .buy .ic{width:18px;height:18px}
.room-wall .rw-deco{display:flex;gap:4px;font-size:0}
.room-wall .rw-deco .ic{width:26px;height:26px}
.home-actor .ha-act{display:block;width:18px;height:18px;background:#fff;border:var(--lw-2) solid var(--ink);border-radius:50%;padding:1px}
.home-actor .ha-act:empty{display:none}
.home-actor .ha-act .ic{width:100%;height:100%}
/* 触控区 ≥44px */
.buyamt button{height:auto;min-height:44px;min-width:46px}
.title-row{position:relative;z-index:4} /* 扩展点击区压在金币框外边距之上（不进框内） */
.book-tabs button,.mode-tabs .mt,.job-chip{min-height:44px}
.buy,.card .buy,.room-tools .buy{min-height:44px}
.mall-go{min-height:44px!important}
.mall-cats .mc,.mall-subs .ms,.mall-filters .mf,.mall-filters select{min-height:44px}
#dailyChip{position:relative}
#dailyChip::after{content:"";position:absolute;inset:-8px 0}
.icon-btn{position:relative}
.icon-btn::after{content:"";position:absolute;inset:-4px}  /* 44px 按钮减 2×2px 边框 = 40px 内框 + 2×4px = 48px（矮屏 40px 按钮 → 44px） */
/* 12b3：同样「伪元素扩热区 + :active 位移」的写法一并补反向位移（声音按钮 / 每日双倍芯片），按住时热区不跟着跑 */
.icon-btn:active::after,#dailyChip:active::after{transform:translate(-2px,-2px)}
/* 图标跟随选中态：未选中的页签 / 模式签图标淡色，选中后整套变回主色（底栏 / 家宅翻页签 / 生活·布置） */
.book-tabs button.on,.mode-tabs .mt.on{--ica:var(--red);--icy:var(--yellow);--icf:#fff}
/* 黄色按钮里的金币：原来是黄圈套在黄按钮上像空圈，改成深金币 + 高光 */
.buy small::before{width:13px;height:13px;background:radial-gradient(circle at 35% 32%,rgba(255,255,255,.75) 0 1.6px,transparent 2.2px),#e9a100;box-shadow:inset -1.5px -1.5px 0 rgba(0,0,0,.2)}
.buy.no small::before,.buy[disabled] small::before{background:#e4ddcd;box-shadow:none}
/* 商城「显示 N / 200 件」：数字和说明分左右两组，组内正常间距 */
.mall-count .mc-num b{margin:0 2px;color:var(--ink)}
/* SE 最小屏：弹窗对白泡在 × 旁边不折行 */
@media (max-width:360px){ .mpanel.has-x .mbubble{font-size:13px;padding:5px 10px;max-width:calc(100% - 56px);letter-spacing:0} }

/* 12c2：竖放侧面图（art/furn_<名>_side.webp，登记在 app.js FURN_SIDE）；rot 3 水平镜像。没侧面图的保持正面图等比兜底 */
.furn .fi img.mir{transform:scaleX(-1)}
/* 12b2 测试房间（?test=homes）角标：提醒这是不存档的假数据 */
#testBadge{position:fixed;left:50%;bottom:calc(var(--sab,0px) + 80px);transform:translateX(-50%) rotate(-1deg);z-index:59;opacity:.92;pointer-events:none;background:#ffd23f;color:#141414;border:2px solid #141414;border-radius:6px;box-shadow:2px 2px 0 #141414;font-size:11px;font-weight:900;padding:2px 8px;white-space:nowrap}
.zb-ov{position:fixed;inset:0;z-index:90;background:#f7f1e3}
.zb-ov iframe{display:block;width:100%;height:100%;border:0}

/* Story collection replay: keep locked cards inert; no progress or reward changes. */
.story-open{display:block;width:100%;min-height:44px;text-align:left;font:inherit;color:inherit}
.story-text{display:block;margin-top:4px;font-size:13px;line-height:1.5}
.story-replay-hint{display:block;margin-top:8px;font-size:12px;font-weight:800}
.story-open:focus-visible{outline:3px solid var(--red);outline-offset:3px}

/* Collection: state is text; button describes the next action. */
.decor-state{color:#294e39}.decor-card .toggle{min-width:60px;min-height:44px}.decor-view{display:block;margin-top:8px;min-height:44px;padding:7px 12px;border:2px solid #141414;border-radius:9px;background:#fff3bd;color:#141414;font:inherit;font-weight:800}.decor-view:focus-visible{outline:3px solid #118ab2;outline-offset:2px}

/* Keep notices over the read-only wallet, away from collection actions. */
#toast.toast-header{top:calc(var(--sat) + 58px);bottom:auto;font-size:12px;max-width:calc(100vw - 32px)}
/* Only owned story cards render an image; failures leave the original text readable. */
.story-art{display:block;position:relative;width:100%;aspect-ratio:4/3;margin:9px 0;border:2px solid var(--ink);border-radius:8px;background:#fff8e8;overflow:hidden}
.story-art img{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.story-art-status{position:absolute;inset:0;display:grid;place-items:center;padding:18px;background:#fff8e8;color:#665742;font-size:12px;font-weight:500;line-height:1.6;text-align:center}
.story-art [hidden]{display:none!important}.story-art-large{max-height:48dvh;margin:10px 0 12px}
#storyReplay .mnote{color:#3d352d;font-size:14px;line-height:1.6;text-align:left}

.story-open{display:grid;grid-template-columns:96px minmax(0,1fr);gap:8px 12px;align-items:start}
.story-open>b{grid-column:1/-1}.story-open .story-art{grid-column:1;grid-row:2/span 2;width:96px;margin:0}
.story-open .story-text{grid-column:2;grid-row:2;margin:0;font-size:12px}.story-open .story-replay-hint{grid-column:2;grid-row:3;margin:0;font-size:11px}
.story-open .story-art-status{padding:5px;font-size:10px;line-height:1.3}

/* The owner stays in the room. Standing portraits sit behind pet sprites. */
.home-actor .ha-pose{display:none}
.pet-host-docked .home-actor{width:18%!important;height:0!important;transform:translate(-50%,-70%);z-index:6!important;border:0;border-radius:0;background:transparent}
.pet-host-docked .home-actor .ha-ava,.pet-host-docked .home-actor .ha-line{display:block}
.home-actor.posed,.pet-host-docked .home-actor.posed{transition:none;transform:translate(-50%,-50%);width:var(--pose-width)!important;height:var(--pose-height)!important;z-index:var(--pose-z)!important}
.home-actor.posed .ha-ava,.home-actor.posed .ha-act{display:none!important}
.home-actor.posed .ha-pose{display:block;width:100%;height:100%}

/* Owned story cards also replay from the blind-box catalog. */
.item.story-open{display:flex;gap:3px;aspect-ratio:auto;min-height:126px;padding:16px 4px 5px;font-size:11px;text-align:center;justify-content:flex-start}
.item.story-open .story-art{width:100%;margin:0;flex:none}
.item.story-open .story-replay-hint{font-size:10px;margin:0}
.item.story-open .story-art-status{font-size:9px;padding:2px}

/* Collection artwork: consistent padding without cropping native hat/clothes drawings. */
.item-art{display:inline-flex;position:relative;width:52px;height:52px;flex:0 0 auto;align-items:center;justify-content:center}
.item-art img{display:block;width:100%;height:100%;object-fit:contain;transform:none!important}
.item-art img[hidden],.item-art-status[hidden]{display:none!important}
.item-art-status{font-size:10px;line-height:1.3;font-weight:400;color:#666}
.ava .item-art{width:100%;height:100%}
.ava .item-art img{position:static;width:100%;height:100%}
.item-grid>.item:not(.story-open){gap:3px;padding-top:15px;aspect-ratio:auto;min-height:94px}
.reveal-item{width:140px;margin:8px auto;font-size:14px;padding:8px;gap:6px;aspect-ratio:auto}
.reveal-item .item-art{width:112px;height:112px}
.reveal-story{width:100%;max-width:360px;margin:4px auto}
@media(max-width:350px){.item-grid .item-art{width:44px;height:44px}}

.item-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.item-grid>.item{min-width:0;overflow-wrap:anywhere}
/* 首批盲盒 6+2 图鉴预览（只展示） */
.collectible-preview .item-art img{width:100%;height:auto;object-fit:contain;aspect-ratio:1}
.collectible-preview .preview-note{display:block;font-size:11px;opacity:.75}

/* 家宅-65：房间底图跟着时段变色（只调 room-art 底图和窗玻璃色块，不碰家具、人物、按钮；按手机本地时间，由 home-status 写 data-room-tone） */
.room[data-room-tone] .room-art{transition:filter 1.5s ease}
.room[data-room-tone="morning"] .room-art{filter:sepia(.18) saturate(1.08) brightness(1.03)}
.room[data-room-tone="dusk"] .room-art{filter:sepia(.32) saturate(1.2) hue-rotate(-10deg) brightness(.94)}
.room[data-room-tone="night"] .room-art{filter:brightness(.68) saturate(.82) hue-rotate(6deg)}
.room-sky{position:absolute;left:68.8%;top:4.4%;width:17%;height:15.6%;z-index:0;pointer-events:none;opacity:0;mix-blend-mode:multiply;transition:opacity 1.5s ease}
.room[data-room-tone="morning"] .room-sky{opacity:.45;background:linear-gradient(#ffe2a0,#fff4d8)}
.room[data-room-tone="dusk"] .room-sky{opacity:.8;background:linear-gradient(#e9875c,#f6c48f)}
.room[data-room-tone="night"] .room-sky{opacity:.92;background:radial-gradient(circle at 28% 30%,#fff 0 1px,transparent 1.6px),radial-gradient(circle at 64% 22%,#fff 0 .8px,transparent 1.4px),radial-gradient(circle at 78% 58%,#fff 0 1px,transparent 1.6px),linear-gradient(#18204a,#34396f)}
@media (prefers-reduced-motion:reduce){.room[data-room-tone] .room-art,.room-sky{transition:none}}

/* 家宅-81：雨天 / 雪天在窗玻璃里加雨丝和雪点。和 .room-sky 同一个窗玻璃框，只在框内画（overflow:hidden），
   不用混合模式（夜晚也看得见），不碰家具、人物、按钮；由 home-status 写 data-room-weather。减少动态效果时只留静态。 */
.room-wx{position:absolute;left:68.8%;top:4.4%;width:17%;height:15.6%;z-index:0;pointer-events:none;overflow:hidden;opacity:0;transition:opacity 1.5s ease}
.room[data-room-weather="rain"] .room-wx{opacity:1;background:repeating-linear-gradient(104deg,transparent 0 5px,rgba(214,230,255,.85) 5px 6px,transparent 6px 11px),linear-gradient(rgba(96,118,146,.28),rgba(96,118,146,.18));background-size:22px 26px,100% 100%;animation:roomRain .55s linear infinite}
.room[data-room-weather="snow"] .room-wx{opacity:1;background:radial-gradient(circle,#fff 0 1.3px,transparent 1.9px),radial-gradient(circle,rgba(255,255,255,.9) 0 1px,transparent 1.5px),linear-gradient(rgba(214,226,240,.3),rgba(214,226,240,.18));background-size:16px 16px,11px 13px,100% 100%;background-position:0 0,6px 5px,0 0;animation:roomSnow 4s linear infinite}
/* 家宅-82：窗位改由 app.js HOME_WINDOWS 按底图写 inline left/top/width/height（上面 c77_1 的位置留作默认）；拱窗 / 圆窗把色块裁成窗形 */
.room-sky.win-arch,.room-wx.win-arch{border-radius:50% 50% 0 0/44% 44% 0 0}
.room-sky.win-round,.room-wx.win-round{border-radius:50%}
@keyframes roomRain{to{background-position:-6px 26px,0 0}}
@keyframes roomSnow{to{background-position:3px 32px,8px 31px,0 0}}
@media (prefers-reduced-motion:reduce){.room-wx{transition:none}.room[data-room-weather] .room-wx{animation:none}}

/* 家宅-56：CEO 自主活动时，远距离换位或「减少动态效果」打开时淡入；换衣服停下时闪一下 */
.home-actor.ha-fade{animation:haFade .5s ease}
@keyframes haFade{0%{opacity:0}100%{opacity:1}}
@media (prefers-reduced-motion:reduce){.home-actor.ha-fade{animation-duration:.01s}}

/* 家宅-57：开灯时灯旁淡入一圈暖色光晕，离开后 1.5 秒淡出（不改房间灯光、不加遮罩、不改灯的图） */
.furn.ha-lit{animation:haLitIn .6s ease forwards}
.furn.ha-lit-off{animation:haLitOut 1.5s ease forwards}
@keyframes haLitIn{from{box-shadow:2px 2px 0 rgba(20,20,20,.55),0 0 0 0 rgba(255,196,96,0)}to{box-shadow:2px 2px 0 rgba(20,20,20,.55),0 0 18px 8px rgba(255,196,96,.7)}}
@keyframes haLitOut{from{box-shadow:2px 2px 0 rgba(20,20,20,.55),0 0 18px 8px rgba(255,196,96,.7)}to{box-shadow:2px 2px 0 rgba(20,20,20,.55),0 0 0 0 rgba(255,196,96,0)}}
@media (prefers-reduced-motion:reduce){.furn.ha-lit,.furn.ha-lit-off{animation-duration:.01s}}