/* ---------- 게임 UI (설계 크기 432x768, 화면 크기에 맞춰 통째로 줄이고 늘림) ---------- */
#ui{position:absolute;left:0;top:0;width:432px;height:768px;transform-origin:0 0;pointer-events:none;color:#fff3dc;
 --fh:PreB;--fb:PreM;font-family:var(--fb);--gold:#d6a24a;--pn1:#3c2256;--pn2:#2a1640;--or:#ffb24a;--mu:#cbb7e0}
#ui b,#ui .h{font-family:var(--fh);font-weight:400}
#ui button{font:inherit;color:inherit;pointer-events:auto;cursor:pointer;border:0;padding:0;background:none}
#ui button:focus-visible{outline:2px solid #fff;outline-offset:2px}
#ui .pn{background:linear-gradient(var(--pn1),var(--pn2));border:2px solid var(--gold);border-radius:10px;box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 3px 0 rgba(10,4,20,.45)}
.ic{image-rendering:pixelated;display:block}
svg{display:block}
.top{position:absolute;left:10px;right:10px;top:10px;height:46px;display:flex;gap:7px;align-items:center}
.prof{display:flex;align-items:center;gap:7px;padding:3px 10px 3px 3px;height:46px;box-sizing:border-box}
.ava{width:36px;height:36px;border-radius:8px;background:#5b3479;border:1.5px solid var(--gold);display:grid;place-items:center;overflow:hidden}
.pinfo{display:grid;gap:3px;line-height:1}
.pinfo b{font-size:14px}
.lv{display:flex;align-items:center;gap:5px;font-size:11px;color:var(--mu)}
.lv i{display:block;width:44px;height:6px;border-radius:3px;background:#1a0d28;overflow:hidden}
.lv em{display:block;height:100%;background:linear-gradient(90deg,#ff9a3a,#ffd24a)}
.res{flex:1;height:34px;display:flex;align-items:center;gap:6px;padding:0 6px 0 7px;box-sizing:border-box;min-width:0}
.res b{font-size:16px;letter-spacing:.2px;font-variant-numeric:tabular-nums;flex:1;text-align:right}
.res.gem{flex:.75}
#ui .plus{width:22px;height:22px;border-radius:6px;background:linear-gradient(#7fd54f,#4fa82e);border:1.5px solid #24561a;color:#fff;font:700 17px/18px var(--f);display:grid;place-items:center;flex:none}
.sq{width:40px;height:40px;display:grid;place-items:center;flex:none}
.row2{position:absolute;left:10px;top:64px;display:flex;gap:6px}
.chip{height:28px;display:flex;align-items:center;gap:6px;padding:0 10px;font-size:13px;box-sizing:border-box}
.chip .yr{color:var(--or)}
.stars{color:#ffd24a;letter-spacing:1px;font-size:12px}.stars s{text-decoration:none;color:#6d5a82}
.card{position:absolute;left:10px;top:100px;width:124px;padding:7px 10px 9px;box-sizing:border-box;pointer-events:auto;cursor:pointer}
.ch{display:flex;justify-content:space-between;font-size:12px;color:var(--mu);margin-bottom:3px}
.sr{display:flex;align-items:center;gap:5px;font-size:12.5px;height:21px}
.sr svg{flex:none}
.sr b{margin-left:auto;font-size:14px;font-variant-numeric:tabular-nums}
.sbar{height:5px;border-radius:3px;background:#1a0d28;overflow:hidden;margin-top:3px}.sbar em{display:block;height:100%;background:linear-gradient(90deg,#ff6a8a,#ffb24a);transition:width .6s}
.card.closed .sr,.card.closed .sbar{display:none}.card.closed .ch{margin:0}
.side{position:absolute;right:10px;top:100px;display:grid;gap:9px}
.sb{width:56px;height:58px;position:relative;display:grid;place-items:center;align-content:center;gap:2px}
.sb small{font-size:11px;line-height:1}
.sb.on{border-color:#ffd24a;box-shadow:inset 0 0 0 2px rgba(255,210,74,.35),0 3px 0 rgba(10,4,20,.45)}
.ad{position:absolute;top:-6px;right:-6px;background:#e0393a;border:1.5px solid #6a0f12;color:#fff;font:700 9px/1 var(--f);padding:3px 4px;border-radius:5px}
.news{position:absolute;left:10px;right:10px;bottom:96px;height:28px;display:flex;align-items:center;gap:8px;padding:0 10px;font-size:13px;background:rgba(32,16,48,.78);border-radius:8px;border:1px solid rgba(214,162,74,.55);box-sizing:border-box}
.news .nt{color:var(--or);flex:none}
.news span:last-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tabs{position:absolute;left:0;right:0;bottom:0;height:86px;display:grid;grid-template-columns:repeat(5,1fr);gap:4px;padding:8px 8px 10px;box-sizing:border-box;
 background:linear-gradient(#3c2256,#22112f);border-top:2px solid var(--gold);border-radius:16px 16px 0 0;box-shadow:0 -3px 0 rgba(10,4,20,.35)}
#ui .tab{display:grid;justify-items:center;align-content:center;gap:4px;border-radius:10px}
.tab span{font-size:13px;font-family:var(--fh)}
#ui .tab.act{background:rgba(255,178,74,.16);box-shadow:inset 0 0 0 1.5px rgba(255,178,74,.6)}
.tab .ib{width:50px;height:44px;display:grid;place-items:center}
#fx{position:absolute;inset:0;overflow:hidden}
.bub{position:absolute;left:0;top:0;white-space:nowrap;background:#fffaf0;color:#2a1a3a;border:2px solid #2a1a3a;border-radius:9px;padding:3px 9px;font-size:13px;line-height:1.3;transform-origin:50% 100%}
.bub::after{content:"";position:absolute;left:50%;bottom:-7px;margin-left:-5px;border:5px solid transparent;border-top-color:#2a1a3a;border-bottom:0}
.pop{position:absolute;left:0;top:0;font-family:var(--fh);font-size:16px;color:#ffe066;white-space:nowrap;
 text-shadow:-1.5px 0 #5a2a10,1.5px 0 #5a2a10,0 -1.5px #5a2a10,0 1.5px #5a2a10,0 2px 2px rgba(0,0,0,.4)}
.pop.minus{color:#ff9a8a;text-shadow:-1.5px 0 #4a1010,1.5px 0 #4a1010,0 -1.5px #4a1010,0 1.5px #4a1010}
.cons{position:absolute;left:0;top:0;display:flex;align-items:center;gap:6px;padding:3px 4px 3px 9px;font-size:12px;background:linear-gradient(var(--pn1),var(--pn2));border:1.5px solid var(--gold);border-radius:8px;white-space:nowrap}
#ui .cons button{display:flex;align-items:center;gap:3px;background:linear-gradient(#7fd54f,#4fa82e);border:1.5px solid #24561a;border-radius:6px;padding:1px 6px 1px 4px;font-family:var(--fh);font-size:12px}
.sign{position:absolute;left:0;top:0;font-family:var(--fh);font-size:11px;line-height:1;padding:3px 6px;border-radius:5px;color:#fff;border:1.5px solid rgba(0,0,0,.45);white-space:nowrap}
.sign.in{background:#3d9a3a}.sign.out{background:#c24a2a}
.toast{position:absolute;left:50%;top:330px;transform:translateX(-50%);max-width:330px;text-align:center;padding:10px 16px;font-size:14px;opacity:0;transition:opacity .25s;pointer-events:none}
.toast.show{opacity:1}

/* ---------- 짓기 ---------- */
#ui.bmode .card,#ui.bmode .side,#ui.bmode .news{display:none}
#ui.bplace .tabs{display:none}
.sheet{position:absolute;left:8px;right:8px;bottom:94px;height:246px;padding:10px 0 10px;box-sizing:border-box;pointer-events:auto;display:none;flex-direction:column}
#ui.bmenu #sheet,#ui.lmenu #lsheet{display:flex}
#ui.lsel .tabs{display:none}
#ui.lsel #lbar{display:flex}
#ui.osel .tabs{display:none}
#ui.osel #obar{display:flex}
#ui #ob-rm{display:flex;align-items:center;justify-content:center;gap:4px}
#ui .bb.warn{background:linear-gradient(#c8473a,#9a2a22);border-color:#5a1410;color:#fff}
.lmeta{font-size:12.5px;color:var(--mu)}
.lgood{font-size:13.5px;line-height:1.45;color:#fff3dc}.lgood em{font-style:normal;color:#a6e88a}
.lnote{font-size:11.5px;line-height:1.4;color:var(--mu)}
#ui .zlab{position:absolute;left:0;top:0;display:none;justify-items:center;gap:1px;padding:4px 9px 5px;font-size:11.5px;line-height:1.15;background:linear-gradient(var(--pn1),var(--pn2));border:1.5px solid var(--gold);border-radius:8px;white-space:nowrap;box-shadow:0 2px 0 rgba(10,4,20,.45)}
#ui .zlab b{font-size:13px}.zlab .zp{color:#ffe08a}
#ui .zlab.lock{border-color:#7a6a90;color:#cbb7e0}
#ui .zlab.sel{border-color:#ffe08a;box-shadow:0 0 0 2px rgba(255,224,138,.4),0 2px 0 rgba(10,4,20,.45)}
.it .th canvas{image-rendering:pixelated}
.pop.big{font-size:19px;color:#b8ff8a;text-shadow:-1.5px 0 #1a4a10,1.5px 0 #1a4a10,0 -1.5px #1a4a10,0 1.5px #1a4a10,0 2px 3px rgba(0,0,0,.45)}
.shd{display:flex;align-items:center;gap:8px;padding:0 10px 8px 14px}
.shd b{font-size:17px}
.shd .gl{font-size:12px;color:var(--mu);margin-left:auto}
#ui .x{width:32px;height:32px;border-radius:8px;display:grid;place-items:center;background:rgba(255,255,255,.08);border:1px solid rgba(214,162,74,.45);flex:none}
.chips{display:flex;gap:6px;padding:0 10px 9px}
#ui .c2{height:30px;padding:0 13px;border-radius:15px;background:rgba(255,255,255,.07);border:1px solid rgba(214,162,74,.4);font-size:13px;color:#e6d6f5}
#ui .c2.on{background:var(--or);color:#2a1640;border-color:var(--or);font-family:var(--fh)}
.cards{display:flex;gap:8px;overflow-x:auto;padding:0 10px 2px;scroll-snap-type:x proximity;touch-action:pan-x;scrollbar-width:none}
.cards::-webkit-scrollbar{display:none}
#ui .it{flex:none;width:98px;height:140px;border-radius:10px;background:rgba(18,7,30,.55);border:1.5px solid rgba(214,162,74,.4);display:grid;grid-template-rows:70px auto auto;justify-items:center;align-content:start;gap:1px;padding:5px 4px 6px;box-sizing:border-box;scroll-snap-align:start}
#ui .it:hover{border-color:var(--or)}
.it .th{height:70px;display:grid;place-items:center}
.it b{font-size:13px;line-height:1.25}
.it .pr{font-size:12px;color:#ffe08a;display:flex;gap:3px;align-items:center;line-height:1.3}
.it .tg{font-size:10.5px;color:var(--mu);line-height:1.2}
#ui .it.lock{opacity:.45;cursor:default}
.it.poor .pr{color:#ff9a8a}
.bbar{position:absolute;left:8px;right:8px;bottom:10px;padding:10px 12px 12px;box-sizing:border-box;display:none;pointer-events:auto;flex-direction:column;gap:7px}
#ui.bplace #bbar{display:flex}
.btop{display:flex;align-items:center;gap:8px}
.btop b{font-size:16px}
.btop .pr{font-size:14px;color:#ffe08a;display:flex;gap:4px;align-items:center}
.btop .x{margin-left:auto}
.steps{display:flex;gap:4px;font-size:11.5px}
.steps span{padding:2px 9px;border-radius:10px;background:rgba(255,255,255,.07);color:var(--mu)}
.steps span.on{background:var(--or);color:#2a1640;font-family:var(--fh)}
.steps span.done{color:#a6e88a}
.hint{font-size:13px;line-height:1.45;color:#e6d6f5;min-height:19px}
.hint.warn{color:#ffb07a}
.brow{display:flex;gap:8px}
#ui .bb{flex:1;height:46px;border-radius:10px;font-family:var(--fh);font-size:15px;background:rgba(255,255,255,.09);border:1.5px solid rgba(214,162,74,.5)}
#ui .bb.pri{flex:1.5;background:linear-gradient(#7fd54f,#4fa82e);border-color:#24561a;color:#fff;text-shadow:0 1px 0 rgba(0,0,0,.25)}
#ui .bb.rot{flex:1.05;display:flex;align-items:center;justify-content:center;gap:5px}
#ui .bb.rot[hidden]{display:none}
.pop.scream{font-size:20px;color:#ff6a7a;text-shadow:-1.5px 0 #3a0a18,1.5px 0 #3a0a18,0 -1.5px #3a0a18,0 1.5px #3a0a18,0 2px 3px rgba(0,0,0,.5)}
.pop.scream span{display:inline-block;animation:shk .12s steps(2) infinite}
@keyframes shk{0%{transform:translate(-1px,0) rotate(-5deg) scale(1.05)}100%{transform:translate(1px,-1px) rotate(5deg)}}
@media (prefers-reduced-motion: reduce){.pop.scream span{animation:none}}
#ui .bb:disabled{filter:grayscale(1);opacity:.45;cursor:default}

/* ---------- 월말 리포트 · 연말 결산 ---------- */
.dim{position:absolute;inset:0;background:rgba(12,4,22,.62);display:none;pointer-events:auto}
#ui.rep .dim{display:block}
#ui.rep .card,#ui.rep .side,#ui.rep .news,#ui.rep .tabs{display:none}
.rp{position:absolute;left:14px;right:14px;top:34px;padding:14px 16px 14px;box-sizing:border-box;display:none;pointer-events:auto;flex-direction:column;gap:9px}
#ui.rep-m #rpM,#ui.rep-y1 #rpY1,#ui.rep-y2 #rpY2,#ui.rep-y3 #rpY3{display:flex}
.rh{display:flex;align-items:baseline;gap:8px}
.rh b{font-size:24px;line-height:1.1}
.rh span{font-size:12.5px;color:var(--mu)}
.rh .cl{margin-left:auto}
.rsub{font-size:12px;color:var(--mu);letter-spacing:.3px}
.rsec{font-size:12px;color:var(--or);font-family:var(--fh);margin-top:2px}
.rs{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}
.rst{background:rgba(18,7,30,.55);border:1.5px solid rgba(214,162,74,.35);border-radius:10px;padding:7px 8px 8px;display:grid;gap:2px;opacity:0;transform:translateY(6px);transition:opacity .3s,transform .3s}
.rst.on{opacity:1;transform:none}
.rst .lb{font-size:11.5px;color:var(--mu)}
.rst b{font-size:20px;line-height:1.15;font-variant-numeric:tabular-nums}
.dl{font-family:var(--fh);font-size:11.5px;line-height:1;opacity:0;transform:scale(.6);transition:opacity .2s,transform .25s cubic-bezier(.3,1.8,.6,1)}
.dl.on{opacity:1;transform:none}
.dl.up{color:#a6e88a}.dl.dn{color:#ff9a8a}
.rk{display:grid;gap:5px}
.rr{display:grid;grid-template-columns:22px 40px 1fr auto;align-items:center;gap:7px;height:38px;padding:0 9px 0 6px;border-radius:9px;background:rgba(18,7,30,.45);opacity:0;transform:translateX(-8px);transition:opacity .3s,transform .3s}
.rr.on{opacity:1;transform:none}
.rr.first{background:linear-gradient(90deg,rgba(255,178,74,.28),rgba(18,7,30,.45));box-shadow:inset 0 0 0 1.5px rgba(255,210,74,.65)}
.rr .no{font-family:var(--fh);font-size:15px;color:#ffe08a;text-align:center}
.rr .th{display:grid;place-items:center;height:36px;overflow:hidden}
.rr .nm{font-size:13.5px;line-height:1.2}
.rr .nm small{display:block;font-size:10.5px;color:var(--mu)}
.rr .ct{font-family:var(--fh);font-size:14px;font-variant-numeric:tabular-nums}
.rr .ct small{font-family:var(--fb);font-size:11px;color:var(--mu);margin-left:2px}
.rbox{display:grid;grid-template-columns:44px 1fr;gap:9px;align-items:center;padding:8px 10px;border-radius:10px;background:rgba(18,7,30,.45);border:1px solid rgba(214,162,74,.3);opacity:0;transition:opacity .35s}
.rbox.on{opacity:1}
.rbox .pf{width:44px;height:44px;border-radius:9px;background:#5b3479;border:1.5px solid var(--gold);display:grid;place-items:center;overflow:hidden}
.rbox .q{font-size:13.5px;line-height:1.4}
.rbox .q .st{color:#ffd24a;letter-spacing:1px;font-size:12px;display:block}
.rbox .who{font-size:11px;color:var(--mu);display:block;margin-top:1px}
.rbox .sayl{display:block;font-size:12px;color:#ffe08a;margin-top:2px}
#m-mvpn{display:block}
.rgoal{font-size:12.5px;color:#e6d6f5;text-align:center;line-height:1.4}
.rgoal b{color:#ffe08a}
.cheer{position:absolute;left:50%;top:150px;transform:translate(-50%,0) rotate(-6deg) scale(.4);padding:6px 14px;border:3px solid #ffd24a;border-radius:10px;font-family:var(--fh);font-size:20px;color:#ffd24a;background:rgba(42,22,64,.92);opacity:0;pointer-events:none;white-space:nowrap;transition:opacity .15s,transform .3s cubic-bezier(.3,1.9,.5,1)}
.cheer.on{opacity:1;transform:translate(-50%,0) rotate(-6deg) scale(1)}
#conf{position:absolute;inset:0;pointer-events:none;image-rendering:pixelated}
/* 고지서 = 종이 */
#ui .paper{background:#f3e6c6;color:#3a2414;border:2px solid #7a5428;border-radius:6px;box-shadow:0 3px 0 rgba(10,4,20,.45),inset 0 0 0 4px #f3e6c6,inset 0 0 0 5px rgba(122,84,40,.35)}
.paper .rh span,.paper .rsub{color:#7a5a3a}
.seal{width:34px;height:34px;border-radius:50%;background:#7a1a2a;border:2px solid #4a0a14;display:grid;place-items:center;color:#f3d6a0;font-family:var(--fh);font-size:15px;flex:none}
.bill{display:grid;gap:3px;font-size:13.5px;border-top:1.5px dashed rgba(122,84,40,.5);border-bottom:1.5px dashed rgba(122,84,40,.5);padding:7px 2px}
.bill div{display:flex;justify-content:space-between;opacity:0;transition:opacity .25s}
.bill div.on{opacity:1}
.bill em{font-style:normal;color:#8a6a4a;font-size:11.5px;margin-left:5px}
.bill b{font-variant-numeric:tabular-nums}
.tot{display:flex;justify-content:space-between;align-items:baseline;font-size:14px}
.tot b{font-size:22px;color:#9a1a1a;font-variant-numeric:tabular-nums}
.wal{display:grid;grid-template-columns:1fr auto;gap:2px 10px;font-size:13px;background:rgba(122,84,40,.1);border-radius:6px;padding:7px 10px}
.wal b{text-align:right;font-variant-numeric:tabular-nums}
.wal .left{color:#2a6a1a}
#ui .paper .bb{background:#e4d2a8;border-color:#7a5428;color:#3a2414}
#ui .paper .bb.pri{background:linear-gradient(#c8473a,#9a2a22);border-color:#5a1410;color:#fff}
.stamp{position:absolute;right:26px;top:150px;padding:4px 12px;border:4px double #c0302a;border-radius:8px;color:#c0302a;font-family:var(--fh);font-size:26px;transform:rotate(-14deg) scale(2.4);opacity:0;pointer-events:none;transition:transform .22s cubic-bezier(.5,0,.8,.4),opacity .1s;mix-blend-mode:multiply}
.stamp.on{opacity:.88;transform:rotate(-14deg) scale(1)}
/* 연말 머리띠 (.mag) — 해골 등급은 아래 .skg */
.mag{display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:8px;background:linear-gradient(90deg,#c2304a,#7a1a5a);color:#fff}
.mag b{font-size:16px;line-height:1.2}.mag small{display:block;font-size:11px;opacity:.85}
.mag .ttl{font-family:var(--fh);font-size:30px;line-height:1;letter-spacing:-1px}
.mr{display:grid;grid-template-columns:30px 1fr auto;align-items:center;gap:8px;height:42px;padding:0 10px 0 8px;border-radius:9px;background:rgba(18,7,30,.45);position:relative;overflow:hidden}
.mr .no{font-family:var(--fh);font-size:18px;color:#ffe08a;text-align:center}
.mr .nm{font-size:14px;line-height:1.2;transition:filter .3s}
.mr .nm small{display:block;font-size:10.5px;color:var(--mu)}
.mr .sc{font-size:12px;color:var(--mu)}
.mr.hid .nm,.mr.hid .sc{filter:blur(6px);opacity:.5}
.mr.me{background:linear-gradient(90deg,rgba(255,178,74,.35),rgba(60,34,86,.6));box-shadow:inset 0 0 0 2px #ffd24a}
.mr.me .nm{font-family:var(--fh);color:#fff}
.mr .tag{font-family:var(--fh);font-size:10.5px;color:#2a1640;background:#a6e88a;border-radius:5px;padding:1px 5px;margin-left:5px;vertical-align:1px}
/* 11/14 출시 3단계: 해골 등급 (인간계 여행 가이드) — 09_report.js openRank */
.mag.skg{background:linear-gradient(90deg,#3a1a52,#5b2a6e);border:1.5px solid #c9b48a;color:#f3ead8}
.mag.skg .ttl{width:34px;height:31px;display:grid;place-items:center}
.mag.skg .ttl svg{width:30px;height:28px;fill:#f3ead8}
.skv{display:grid;gap:4px}
.skr{display:grid;grid-template-columns:66px auto 1fr;align-items:baseline;gap:4px 8px;padding:6px 10px;border-radius:8px;background:rgba(18,7,30,.45);opacity:0;transform:translateX(-8px);transition:opacity .3s,transform .3s}
.skr.on{opacity:1;transform:none}
.skr i{font-style:normal;font-size:11.5px;color:var(--mu)}
.skr b{font-size:13.5px;font-variant-numeric:tabular-nums;white-space:nowrap}
.skr small{font-size:11px;color:#d9c8ef;text-align:right;line-height:1.25}
.skb{display:grid;justify-items:center;gap:4px;padding:8px 6px 6px;border-radius:10px;background:rgba(18,7,30,.55);box-shadow:inset 0 0 0 1.5px rgba(201,180,138,.35);opacity:0;transition:opacity .3s}
.skb.on{opacity:1}
.sks{display:flex;gap:8px}
.sks .sk{width:38px;height:35px;fill:rgba(243,234,216,.13);transition:fill .15s,transform .32s cubic-bezier(.3,1.9,.5,1);transform:scale(.8)}
.sks .sk.lit{fill:#f3ead8;transform:scale(1);filter:drop-shadow(0 0 4px rgba(190,130,255,.85))}
.skn{display:flex;align-items:center;gap:6px;min-height:24px;opacity:0;transform:scale(1.6);transition:opacity .2s,transform .3s cubic-bezier(.3,1.8,.6,1)}
.skb.done .skn{opacity:1;transform:none}
.skn b{font-family:var(--fh);font-size:18px;color:#ffe08a}
.skn .tag{font-family:var(--fh);font-size:10.5px;color:#2a1640;background:#a6e88a;border-radius:5px;padding:1px 5px}
.skn .tag.dn{background:#ffb09a}
.skx{font-size:11px;color:var(--mu);opacity:0;transition:opacity .3s}
.skb.done .skx{opacity:1}
@media (prefers-reduced-motion:reduce){.sks .sk,.skn,.skr{transition:none}}
.quote{font-size:12.5px;line-height:1.45;color:#e6d6f5;border-left:3px solid var(--or);padding:1px 0 1px 9px;opacity:0;transition:opacity .4s}
.quote.on{opacity:1}
.nx{display:grid;gap:7px;justify-items:center;text-align:center;padding:4px 0 2px}
.nx .big{font-family:var(--fh);font-size:26px;line-height:1.2}
.nx .yr2{font-size:13px;color:var(--or);font-family:var(--fh)}
.nx ul{list-style:none;padding:0;margin:0;display:grid;gap:5px;font-size:13.5px;text-align:left}
.nx li{display:flex;gap:8px;align-items:center;background:rgba(18,7,30,.45);border-radius:8px;padding:6px 10px}
.nx li i{font-style:normal;color:#ffe08a;font-family:var(--fh);flex:none}
/* 정보 탭 */
#ui.imenu #isheet{display:flex}
.isum{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;padding:0 12px}
.isum div{background:rgba(18,7,30,.55);border:1px solid rgba(214,162,74,.35);border-radius:9px;padding:6px 8px;display:grid;gap:1px}
.isum span{font-size:11px;color:var(--mu)}.isum b{font-size:16px;font-variant-numeric:tabular-nums}
.ibtn{display:grid;grid-template-columns:1fr 1fr;gap:7px;padding:10px 12px 0}
#ui .ibtn .bb{height:44px;font-size:13.5px}
.inote{font-size:11.5px;color:var(--mu);padding:8px 14px 0;line-height:1.4}
/* 직원 · 메뉴 */
#ui.smenu #ssheet,#ui.mmenu #msheet{display:flex}
/* 직원·메뉴 = 큰 창(팝업) + 위 탭 + 세로 목록, 줄 누르면 자세히 */
.pdim{position:absolute;left:0;right:0;top:0;bottom:86px;background:rgba(12,4,22,.55);display:none;pointer-events:auto}
#ui.smenu .pdim,#ui.mmenu .pdim{display:block}
.plw{position:absolute;left:10px;right:10px;top:62px;bottom:96px;padding:12px 0 8px;box-sizing:border-box;pointer-events:auto;display:none;flex-direction:column;box-shadow:0 8px 30px rgba(8,2,16,.6)}
.plw .chips{flex-wrap:wrap}
.c2 .n{font-size:11px;opacity:.75;margin-left:3px}
.plist{flex:1;overflow-y:auto;padding:0 10px 4px;display:flex;flex-direction:column;gap:6px;scrollbar-width:thin;scrollbar-color:rgba(214,162,74,.5) transparent;touch-action:pan-y}
.pr0{border-radius:10px;background:rgba(18,7,30,.55);border:1.5px solid rgba(214,162,74,.32);flex:none}
.pr0.open{border-color:var(--or);background:rgba(28,12,44,.75)}
#ui .prh{width:100%;display:grid;grid-template-columns:42px 1fr auto 14px;align-items:center;gap:10px;padding:7px 10px 7px 8px;box-sizing:border-box;text-align:left;min-height:56px}
.prh .pf{width:40px;height:40px;border-radius:9px;background:#5b3479;border:1.5px solid var(--gold);display:grid;place-items:center;overflow:hidden}
.prh .pf canvas{image-rendering:pixelated;transform:scale(1.6)}
.prh .pf.fd{font-size:24px;background:#3a2152}
.prh .pf.fd .fdi{width:30px;height:30px;image-rendering:pixelated}
.lab{padding:4px 2px}.lab .lt{font-size:13px;color:var(--mu);margin:2px 0 8px}
.lab .lr{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
#ui .lab .lc{font-size:13px;padding:7px 10px;border-radius:8px;border:1px solid rgba(255,210,74,.35);background:#3a2152;color:#f3e8ff;cursor:pointer}
#ui .lab .lc.on{background:#ffd24a;color:#2a1640;border-color:#ffd24a}#ui .lab .lc:disabled{opacity:.45;cursor:default}
.lab .rx span{display:inline-block;margin:2px 6px 2px 0;padding:3px 8px;border-radius:6px;background:#3a2152}
#ui .lab .lc small{font-size:11px;opacity:.8}#ui .lab .lc.emp{opacity:.6;border-style:dashed}
/* 11/14 국경 상인 마차 (35_merchant.js) */
.mch{margin:2px 2px 12px;padding:9px 10px;border-radius:10px;background:rgba(18,7,30,.55);border:1.5px solid rgba(214,162,74,.4)}
.mchh{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:6px}.mchh b{font-family:var(--fh);font-weight:normal;color:#ffe08a;font-size:14px}
.mchh span{font-size:12px;color:var(--mu)}.mchh span.on{color:#a6e88a}
.mev{font-size:12px;color:#ffd8a8;margin:2px 0 6px}
.mgr{display:grid;grid-template-columns:1fr 1fr;gap:5px}
.mit{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:5px;padding:5px 6px;border-radius:8px;background:rgba(255,255,255,.05)}
.mit.lk{opacity:.5}.mit .mn{font-size:12.5px;color:#f3e8ff;line-height:1.2;min-width:0}.mit .mn small{display:block;font-size:10.5px;color:var(--mu)}
.mit .mp{font-size:12px;color:#ffe08a;white-space:nowrap}.mit .mp em{font-style:normal;margin-left:1px}.mit .mp em.up{color:#ff8a7a}.mit .mp em.dn{color:#8ae8a0}
#ui .mit .bb{height:28px;padding:0 8px;font-size:12px}.mit .ml{font-size:11px;color:var(--mu)}
.pop.flash{font-size:22px;color:#fff;text-shadow:0 0 6px #fff,0 0 12px #ffe680}
.prh .nm{font-size:14.5px;line-height:1.25;font-family:var(--fh);min-width:0}
.prh .nm small{display:block;font-family:var(--fb);font-size:11.5px;color:var(--mu);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.prh .rt{display:grid;justify-items:end;gap:3px;font-size:12px}
.prh .rt b{color:#ffe08a;font-size:13.5px}
.prh .chev{color:var(--mu);font-size:11px;transition:transform .2s}
.pr0.open .chev{transform:rotate(180deg)}
.mini{width:58px;height:5px;border-radius:3px;background:#1a0d28;overflow:hidden}.mini em{display:block;height:100%;background:linear-gradient(90deg,#7fd54f,#c8ff8a)}
.mini.cook em{background:linear-gradient(90deg,#ff9a3a,#ffd24a)}
.dot{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;color:var(--mu)}
.dot::before{content:"";width:7px;height:7px;border-radius:50%;background:#7a6a90}
.dot.on{color:#a6e88a}.dot.on::before{background:#7fd54f;box-shadow:0 0 5px #7fd54f}
.pd{display:none;padding:0 12px 11px 12px;gap:7px;flex-direction:column}
.pr0.open .pd{display:flex}
.pd .q{font-size:13px;line-height:1.45;color:#e6d6f5;border-left:3px solid var(--or);padding:1px 0 1px 9px}
.pd .kv{display:grid;grid-template-columns:auto 1fr;gap:3px 12px;font-size:12.5px}
.pd .kv span{color:var(--mu)}.pd .kv b{font-weight:normal;color:#fff3dc}.pd .kv b.g{color:#a6e88a}
.pd .xl{display:flex;align-items:center;gap:8px;font-size:12px}.pd .xl .xb{flex:1;height:7px;border-radius:4px;background:#1a0d28;overflow:hidden}.pd .xl .xb em{display:block;height:100%;background:linear-gradient(90deg,#7fd54f,#c8ff8a)}
.pd .rx{display:flex;flex-wrap:wrap;gap:5px}.pd .rx span{font-size:11.5px;background:#fffaf0;color:#2a1a3a;border-radius:8px;padding:2px 8px}
.pd .brow .bb{height:40px;font-size:14px}
.pr0.lock{opacity:.5}
.pr0.hire{border-style:dashed}
.pempty{font-size:13px;color:var(--mu);text-align:center;padding:24px 0}
#ui .sc{flex:none;width:150px;height:182px;border-radius:10px;background:rgba(18,7,30,.55);border:1.5px solid rgba(214,162,74,.4);display:grid;grid-template-rows:auto auto auto 1fr;gap:4px;padding:8px 9px 8px;box-sizing:border-box;scroll-snap-align:start;text-align:left;align-content:start}
#ui .sc:hover{border-color:var(--or)}
.sc .sh{display:flex;gap:7px;align-items:center}
.sc .pf{width:38px;height:38px;border-radius:8px;background:#5b3479;border:1.5px solid var(--gold);display:grid;place-items:center;overflow:hidden;flex:none}
.sc .pf canvas{image-rendering:pixelated;transform:scale(1.6)}
.sc .nm{font-size:13.5px;line-height:1.2;font-family:var(--fh)}
.sc .nm small{display:block;font-family:var(--fb);font-size:11px;color:var(--mu)}
.sc .lvr{display:flex;align-items:center;gap:6px;font-size:12px}
.sc .lvr b{color:#ffe08a;font-size:13px}
.sc .xb{flex:1;height:6px;border-radius:3px;background:#1a0d28;overflow:hidden}.sc .xb em{display:block;height:100%;background:linear-gradient(90deg,#7fd54f,#c8ff8a);transition:width .4s}
.sc .ef{font-size:11.5px;color:#a6e88a;line-height:1.3}
.sc .ln{font-size:11.5px;color:#e6d6f5;line-height:1.35;align-self:end}
.sc .pay{font-size:11px;color:var(--mu)}
#ui .sc.hire{border-style:dashed;place-items:center;text-align:center;grid-template-rows:auto auto auto auto;align-content:center}
.sc.hire .pr{font-size:13px;color:#ffe08a;display:flex;gap:3px;align-items:center;justify-content:center}
#ui .mc{flex:none;width:118px;height:140px;border-radius:10px;background:rgba(18,7,30,.55);border:1.5px solid rgba(214,162,74,.4);display:grid;grid-template-rows:36px auto auto auto 1fr;justify-items:center;gap:2px;padding:6px 6px 7px;box-sizing:border-box;scroll-snap-align:start;text-align:center}
.mc .fd{font-size:27px;line-height:36px}
.mc b{font-size:13px;line-height:1.25}
.mc .pr{font-size:12px;color:#ffe08a;display:flex;gap:3px;align-items:center}
.mc .ds{font-size:10.5px;color:var(--mu);line-height:1.3}
.mc .st{align-self:end;font-family:var(--fh);font-size:11.5px;border-radius:7px;padding:3px 8px}
.mc .st.on{background:rgba(127,213,79,.18);color:#a6e88a}
.mc .st.go{background:linear-gradient(#7fd54f,#4fa82e);color:#fff;border:1.5px solid #24561a}
.mc .st.wk{background:rgba(255,178,74,.16);color:var(--or)}
.mc .st.lk{color:var(--mu)}
#ui .mc.lock{opacity:.45}
.mc .pg{width:90%;height:5px;border-radius:3px;background:#1a0d28;overflow:hidden}.mc .pg em{display:block;height:100%;background:linear-gradient(90deg,#ff9a3a,#ffd24a)}
.sign.newm{background:#d8306a;border-color:#5a0a28;font-size:12px;animation:nb .8s ease-in-out infinite alternate}
@keyframes nb{to{filter:brightness(1.25)}}
@media (prefers-reduced-motion: reduce){.sign.newm{animation:none}}
html.notr #ui *{transition:none!important}
@media (prefers-reduced-motion: reduce){.rst,.rr,.rbox,.dl,.bill div,.quote{transition:none}.cheer,.stamp{transition:opacity .1s}}

/* ---------- 진짜 게임: 상점 창 ---------- */
#ui.shmenu #shsheet{display:flex}
#ui.shmenu .pdim{display:block}
/* 11/15 상점 새로 (다듬기 시안 ① 그대로) — 프리미엄 큰 카드 · 기구 팩 820어치 · 줄 · 보석 접기 */
#shsheet .plist{gap:8px}
#shsheet .shgem{display:flex;align-items:center;gap:4px;font-family:var(--fh);font-size:13px;color:#f0dcff;background:rgba(0,0,0,.25);border-radius:8px;padding:3px 8px}
.txg{display:inline-block;width:15px;height:15px;vertical-align:-2px;flex:none}
.txi{display:inline-block;width:16px;height:16px;image-rendering:pixelated;vertical-align:-3px;margin-right:2px;flex:none}
.shhero{border-radius:12px;border:2px solid #ffd24a;background:radial-gradient(120% 70% at 50% 30%,#5a2f86 0%,#2c1645 70%);box-shadow:0 0 0 1px rgba(255,210,74,.25),0 0 18px rgba(255,190,80,.18);overflow:hidden;flex:none;transition:box-shadow .3s}
.shhero.flash{box-shadow:0 0 0 3px rgba(255,225,77,.8),0 0 22px rgba(255,210,90,.5)}
.shhero .hhead{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:8px;padding:9px 12px 0}
.shhero .hhead b{font-family:var(--fh);font-size:15px;color:#ffd75a;white-space:nowrap}.shhero .hhead span{font-size:11.5px;color:#d9c6ef}
.shhero .stage{position:relative;height:206px;display:grid;place-items:center}
.shhero .stage::before{content:"";position:absolute;left:12%;right:12%;bottom:14px;height:34px;border-radius:50%;background:radial-gradient(closest-side,rgba(255,210,120,.28),transparent)}
.shhero canvas.pv{position:relative;max-width:94%;max-height:196px;image-rendering:pixelated}
#ui .shhero .nv{position:absolute;top:50%;transform:translateY(-50%);width:30px;height:44px;flex:none;border-radius:9px;border:1.5px solid rgba(255,210,74,.5);background:rgba(20,8,34,.55);color:#ffe9a8;font-family:var(--fh);font-size:18px;padding:0}
#ui .shhero .nv.l{left:6px}#ui .shhero .nv.r{right:6px}
.shhero .actb{position:absolute;left:10px;top:8px;font-family:var(--fh);font-size:11.5px;color:#2a1640;background:#ffd24a;border-radius:6px;padding:2px 7px}
.shhero .hname{padding:0 12px;display:grid;gap:1px}.shhero .hname b{font-family:var(--fh);font-size:17px}.shhero .hname small{font-size:11.8px;color:#d6c4ec}
.shhero .strip{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:5px;padding:9px 10px 2px}
#ui .shhero .strip button{position:relative;height:44px;border-radius:8px;border:1.5px solid rgba(255,210,74,.28);background:rgba(16,6,28,.55);padding:0;display:grid;place-items:center;overflow:hidden}
.shhero .strip canvas{max-width:92%;max-height:40px;width:auto!important;height:auto!important;image-rendering:pixelated}
#ui .shhero .strip button.on{border-color:#ffe14d;box-shadow:0 0 0 2px rgba(255,225,77,.45)}
.shhero .strip i{position:absolute;right:2px;bottom:1px;font-family:var(--fh);font-size:9px;font-style:normal;color:#ffe9a8;text-shadow:0 1px 0 #000}.shhero .strip i.ow{color:#a8ff8a}
.shhero .hbuy{display:flex;padding:9px 10px 4px}#ui .shhero .hbuy .bb{height:40px;font-size:14.5px;display:flex;align-items:center;justify-content:center;gap:5px}
.shhero .hnote{font-size:11px;color:#cdb8e6;padding:0 12px 10px;margin:0}
.shpack{position:relative;border-radius:12px;border:2px solid rgba(255,210,74,.75);background:linear-gradient(#4a2470,#2e1748);padding:11px 12px;flex:none;margin-top:6px}
.shpack .worth{position:absolute;right:10px;top:-11px;display:flex;align-items:center;gap:4px;font-family:var(--fh);font-size:13px;color:#3a1f00;background:linear-gradient(#ffe27a,#f0a52a);border:1.5px solid #7a4a10;border-radius:999px;padding:2px 10px 2px 7px;box-shadow:0 2px 0 rgba(0,0,0,.35);transform:rotate(3deg)}
.shpack b.t{font-family:var(--fh);font-size:16px;color:#ffd75a;display:block}
.shpack>small{display:block;font-size:11.8px;color:#d9c6ef;line-height:1.45}
.shpack .pk6{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:4px;margin:8px 0}
.shpack .pk6 span{height:40px;border-radius:7px;background:rgba(16,6,28,.5);display:grid;place-items:center;overflow:hidden}
.shpack .pk6 canvas{max-width:94%;max-height:38px;width:auto!important;height:auto!important;image-rendering:pixelated}
.shpack .pkrow{display:flex;align-items:center;gap:8px}
.shpack .calc{flex:1;font-size:11.5px;color:#e8d8ff;line-height:1.4}.shpack .calc s{color:#bfa9d8}
#ui .shpack .bb{flex:none;min-width:104px;height:40px;font-size:14.5px}
#ui .pr0.shr .prh{grid-template-columns:minmax(0,1fr) auto;min-height:0;padding:9px 10px 9px 12px}
#ui .pr0.shr .prh .bb{flex:none;height:36px;min-width:86px;padding:0 10px;font-size:13.5px}
.pr0.shr .nm em{font-style:normal;font-family:var(--fh);font-size:10.5px;color:#2a1640;background:#ffb24a;border-radius:5px;padding:1px 5px;margin-left:5px;vertical-align:2px}
.pr0.shr .nm small{white-space:normal}
.pr0.shr ul{margin:3px 0 0;padding-left:16px;font-family:var(--fb);font-size:11.8px;line-height:1.55;color:#dccbf0}
#ui .shfold{width:100%;display:flex;align-items:center;gap:8px;padding:10px 12px;border-radius:10px;background:rgba(18,7,30,.4);border:1.5px dashed rgba(214,162,74,.4);color:#fff3dc;font-family:var(--fh);font-size:14px;flex:none}
.shfold small{font-family:var(--fb);font-size:11.5px;color:var(--mu)}.shfold .cv{margin-left:auto;transition:transform .2s}.shfold[aria-expanded="true"] .cv{transform:rotate(180deg)}
.shfoldb{display:flex;flex-direction:column;gap:6px}
.shfoot{font-size:10.8px;color:#a993c4;text-align:center;padding:4px 6px 2px;margin:0;flex:none;line-height:1.5}
/* 리포트 도착 칩 (48_polish.js) */
#ui .repchip{position:absolute;left:50%;top:118px;transform:translateX(-50%);z-index:7;display:flex;align-items:center;gap:8px;height:34px;padding:0 14px;border-radius:17px;color:#fff3dc;font-size:12.5px;pointer-events:auto;animation:snb 1s infinite alternate}
#ui .repchip b{font-family:var(--fh);font-size:14px;color:#ffd75a}

/* ---------- 설정 창 ---------- */
#ui.stmenu #stsheet{display:flex}
#ui.stmenu .pdim{display:block}
#ui .pr0.st .prh{min-height:0;padding:9px 12px 6px}
.strow{display:flex;gap:6px;padding:0 10px 10px}
#ui .strow .seg{flex:1;height:38px;border-radius:9px;font-family:var(--fh);font-size:14px;color:#cdb8e6;background:rgba(255,255,255,.06);border:1.5px solid rgba(214,162,74,.35)}
#ui .strow .seg.on{color:#fff;background:linear-gradient(#8a4fd8,#5e2aa8);border-color:var(--gold)}
#ui .strow .bb{height:40px;font-size:14px}
#ui .strow .bb.warn{background:linear-gradient(#c8473a,#9a2a22);border-color:#5a1410;color:#fff;font-size:13px}

/* ---------- 첫 스토리 ---------- */
#ui.storyon .card,#ui.storyon .side,#ui.storyon .news,#ui.storyon .tabs,#ui.storyon .top,#ui.storyon .row2{visibility:hidden}
.story{position:absolute;inset:0;background:linear-gradient(rgba(12,4,22,.1) 0%,rgba(12,4,22,.16) 42%,rgba(12,4,22,.6) 74%,rgba(12,4,22,.8) 100%);pointer-events:auto;cursor:pointer}   /* 11/15 공원이 보이게 (예전 .55 한 겹) */
.story.dark{background:rgba(4,1,10,.86)}
.scap{position:absolute;left:30px;right:30px;top:38%;text-align:center;font-size:18px;line-height:1.9;color:#e6d6f5;transition:opacity .5s}
.sf{position:absolute;bottom:180px;width:112px;height:112px;image-rendering:pixelated;transition:opacity .25s,filter .25s}
.sf.l{left:14px}.sf.r{right:14px}
.sf.dim{filter:brightness(.6)}
.sbox{position:absolute;left:12px;right:12px;bottom:60px;min-height:104px;padding:16px 16px 14px;box-sizing:border-box}
.snm{position:absolute;top:-14px;left:16px;background:var(--gold);color:#2a1640;font-family:var(--fh);font-size:13px;border-radius:7px;padding:2px 10px}
.sbox p{margin:4px 0 0;font-size:16px;line-height:1.6}
.sbig{position:absolute;left:0;right:0;top:36%;text-align:center;font-family:var(--fh);font-size:34px;line-height:1.3;color:#ffd24a;text-shadow:0 3px 0 #5a2a10,0 0 18px rgba(255,180,60,.5);opacity:0;transform:scale(.6);transition:all .4s cubic-bezier(.3,1.8,.6,1)}
.sbig.on{opacity:1;transform:none}
/* 11/15 프롤로그 끝 제목 = 인트로 제목처럼 「어서 오세요」 톡 → 「마·계·랜·드」 톡톡 → 둥실 */
.sbig.logo{transform:none;transition:opacity .2s;text-shadow:none;top:27%;padding:26px 0 30px;background:radial-gradient(ellipse 62% 50% at 50% 52%,rgba(18,7,32,.72),rgba(18,7,32,.4) 55%,transparent 75%)}
.sbig.logo .s1{display:block;font-size:27px;color:#fff3dc;-webkit-text-stroke:0;text-shadow:0 0 0 #2a1640,2px 2px 0 #2a1640,-2px 2px 0 #2a1640,2px -2px 0 #2a1640,-2px -2px 0 #2a1640,0 3px 0 #2a1640,0 6px 0 #120726;opacity:0}
.sbig.logo .s2{display:block;margin-top:6px;white-space:nowrap}
.sbig.logo .s2 i{display:inline-block;font-style:normal;font-size:64px;line-height:1.1;margin:0 1px;color:#ffd24a;background:linear-gradient(#fff7d0 8%,#ffd24a 52%,#ff9f2a 92%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(3px 0 0 #2a1640) drop-shadow(-3px 0 0 #2a1640) drop-shadow(0 3px 0 #2a1640) drop-shadow(0 -3px 0 #2a1640) drop-shadow(0 5px 0 #120726);opacity:0}
.sbig.logo .s2 i:nth-child(2n){--r:3deg}.sbig.logo .s2 i:nth-child(2n+1){--r:-3deg}
.sbig.logo.on .s1{animation:tok .42s cubic-bezier(.3,1.9,.55,1) .1s both,bob 2.6s ease-in-out 1.6s infinite}
.sbig.logo.on .s2 i{animation:tokr .4s cubic-bezier(.3,1.9,.55,1) both,bobr 2.4s ease-in-out infinite}
.sbig.logo.on .s2 i:nth-child(1){animation-delay:.55s,1.5s}.sbig.logo.on .s2 i:nth-child(2){animation-delay:.68s,1.65s}.sbig.logo.on .s2 i:nth-child(3){animation-delay:.81s,1.8s}.sbig.logo.on .s2 i:nth-child(4){animation-delay:.94s,1.95s}.sbig.logo.on .s2 i:nth-child(5){animation-delay:1.07s,2.1s}
.sbig.logo .s3{display:table;margin:10px auto 0;padding:3px 14px 4px;border-radius:12px;background:rgba(24,10,40,.82);border:1.5px solid rgba(214,162,74,.6);font-size:14px;line-height:1.4;color:#f1e4ff;font-family:var(--fb);text-shadow:none;opacity:0}
.sbig.logo.on .s3{animation:fin .6s ease 1.5s both}
@keyframes tok{0%{opacity:0;transform:translateY(-26px) scale(.4)}60%{opacity:1;transform:translateY(3px) scale(1.12)}100%{opacity:1;transform:none}}
@keyframes tokr{0%{opacity:0;transform:translateY(-34px) scale(.3) rotate(var(--r))}60%{opacity:1;transform:translateY(4px) scale(1.15) rotate(var(--r))}100%{opacity:1;transform:rotate(var(--r))}}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
@keyframes bobr{0%,100%{transform:rotate(var(--r)) translateY(0)}50%{transform:rotate(var(--r)) translateY(-6px)}}
@keyframes fin{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.sbig.logo.on .s1,.sbig.logo.on .s2 i,.sbig.logo.on .s3{animation:fin .3s both}}
/* 11/15 「개간 가능」 팻말 이름표 (14_land.js signFloaters) */
#ui .zsign{position:absolute;left:0;top:0;display:grid;justify-items:center;gap:0;padding:2px 7px 3px;font-size:10px;line-height:1.15;background:rgba(42,22,64,.88);border:1.5px solid #8fd06a;border-radius:7px;white-space:nowrap;color:#eaffdc;box-shadow:0 2px 0 rgba(10,4,20,.45);pointer-events:auto}
#ui .zsign b{font-size:11.5px;color:#c8ff9a}
#ui.bmode .zsign,#ui.storyon .zsign,#ui.rep .zsign{display:none!important}
.snx{position:absolute;right:20px;bottom:30px;font-size:12px;color:#cbb7e0;animation:snb 1s infinite alternate}
@keyframes snb{to{opacity:.3}}
#ui .sskip{position:absolute;right:12px;top:14px;font-size:13px;color:#cbb7e0;padding:6px 12px;border:1px solid rgba(214,162,74,.5);border-radius:14px;background:rgba(0,0,0,.3)}
.tut{position:absolute;left:10px;right:74px;top:100px;display:grid;grid-template-columns:56px 1fr auto;gap:10px;align-items:center;padding:8px 10px;pointer-events:auto;box-shadow:0 6px 20px rgba(8,2,16,.5);z-index:3}
.tf{width:56px;height:56px;image-rendering:pixelated;border-radius:9px;background:#5b3479;border:1.5px solid var(--gold)}
.tt b{font-size:13px;color:var(--or)}.tt p{margin:1px 0 0;font-size:13.5px;line-height:1.45}
#ui .tb{height:36px;padding:0 12px;border-radius:9px;font-family:var(--fh);font-size:13.5px;background:linear-gradient(#7fd54f,#4fa82e);border:1.5px solid #24561a;color:#fff;white-space:nowrap}
#ui .hl{animation:hlp .9s ease-in-out infinite alternate}
@keyframes hlp{from{box-shadow:inset 0 0 0 2px rgba(255,210,74,.3),0 0 0 0 rgba(255,210,74,.0)}to{box-shadow:inset 0 0 0 2px #ffd24a,0 0 14px 3px rgba(255,210,74,.65)}}
@media (prefers-reduced-motion: reduce){.snx,#ui .hl{animation:none}#ui .hl{box-shadow:inset 0 0 0 2px #ffd24a}}

/* ---------- 11/14 2번: 리치 연구소 · 분실물 · 마력 · 변이 · 주변 인기 ---------- */
.sb[hidden],.chip[hidden]{display:none}
#ui .bb[hidden],.mrow[hidden],.bdg[hidden]{display:none}
.bdg{position:absolute;top:-6px;right:-6px;min-width:18px;height:18px;box-sizing:border-box;background:#e0393a;border:1.5px solid #6a0f12;color:#fff;font:700 11px/15px var(--f);padding:0 4px;border-radius:9px;text-align:center}
.chip.mana{cursor:pointer}.chip.mana .mo{color:#c873ff;letter-spacing:1px;font-size:12px;text-shadow:0 0 4px rgba(200,115,255,.6)}
#ui.lbmenu #labsheet{display:flex}
#ui.lbmenu .pdim{display:block}
.mrow{display:flex;flex-wrap:wrap;gap:5px;align-items:center}
.mrow .ml{font-size:12px;color:var(--mu);margin-right:2px}
#ui .mrow button{font-size:12.5px;padding:5px 10px;border-radius:13px;background:rgba(255,255,255,.08);border:1px solid rgba(214,162,74,.45);color:#e6d6f5}
#ui .mrow button.on{background:#a65ae0;border-color:#e3b4ff;color:#fff}
#ui .mrow button:disabled{opacity:.45}
.mrow .brk{flex-basis:100%;height:0}.mrow .tkv{min-width:44px;text-align:center;font-size:15px;color:#ffe08a;font-weight:normal;font-family:var(--fh)}.mrow .tkw{margin-left:4px}
.mrow .pdot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:3px;vertical-align:-1px;border:1px solid rgba(0,0,0,.5)}
#ui #ob-go small{font-size:11px;opacity:.85;margin-left:2px;letter-spacing:1px}
.labtag{position:absolute;left:0;top:0;padding:3px 9px;font-size:12px;background:linear-gradient(var(--pn1),var(--pn2));border:1.5px solid var(--gold);border-radius:8px;white-space:nowrap;color:#f3e8ff}
.labtag.done{background:linear-gradient(#ffe08a,#f0b030);color:#3a1f08;border-color:#7a4a10;animation:labp 1s ease-in-out infinite alternate}
@keyframes labp{from{filter:brightness(1)}to{filter:brightness(1.18)}}
.lnote2{font-size:12.5px;line-height:1.45;color:#ffe08a;background:rgba(255,210,74,.08);border:1px dashed rgba(255,210,74,.4);border-radius:9px;padding:8px 10px}
.labres{display:flex;flex-direction:column;gap:7px;padding:2px 0}
.labres .lrow{font-size:13px;line-height:1.5;color:#f3e8ff;background:rgba(18,7,30,.55);border:1.5px solid rgba(214,162,74,.32);border-radius:10px;padding:8px 11px}
.labres .lrow small{display:block;font-size:11.5px;color:var(--mu);margin-top:2px}
.labres .lrow b{color:#ffe08a;font-weight:normal;font-family:var(--fh)}
.labres .xb{display:block;margin:5px 0 2px;height:8px;border-radius:4px;background:#1a0d28;overflow:hidden}.labres .xb em{display:block;height:100%;background:linear-gradient(90deg,#a65ae0,#e3b4ff)}
.labres .rx{display:flex;flex-direction:column;gap:3px;margin-top:4px}.labres .rx span{font-size:12px;color:#e6d6f5}
.labres .bk{display:flex;gap:10px;align-items:center;padding:6px 10px;border-radius:9px;background:rgba(255,255,255,.04)}
.labres .bk b{font-family:var(--fh);font-weight:normal;color:#fff3dc;font-size:13.5px}
.labres .bk small{display:block;font-size:11.5px;color:var(--mu);line-height:1.4}
.labres .bi{width:30px;height:30px;flex:none;border-radius:7px;background:#3a2152;display:grid;place-items:center;color:var(--mu);font-size:14px}
.it .th.unk canvas{filter:brightness(0) opacity(.45)}
.story .scap small{font-size:13px;opacity:.85;display:block;margin-top:6px;line-height:1.5}

/* ---------- 11/14 3번: 마계톡 · 손님 취향·무서움·여권 ---------- */
#ui.cbmenu #cbsheet{display:flex}
#ui.cbmenu .pdim{display:block}
/* 11/15 7번 3차: 조합 도감 (41_combo.js) */
.cbk{display:flex;flex-direction:column;gap:3px;padding:9px 11px;border-radius:10px;background:rgba(18,7,30,.55);border:1.5px solid rgba(214,162,74,.32)}
.cbk.no{border-style:dashed;border-color:rgba(214,162,74,.18);background:rgba(255,255,255,.03)}
.cbk .ct{display:flex;align-items:baseline;gap:7px}
.cbk .ct b{font-family:var(--fh);font-weight:normal;color:#ffe08a;font-size:14.5px}
.cbk.no .ct b{color:var(--mu)}
.cbk .ct i{font-style:normal;margin-left:auto;font-size:11px;color:#bfa8d8;white-space:nowrap}
.cbk .ct i.on{color:#9df2b0}
.cbk .pr2{font-size:12px;color:#e6d6f5;line-height:1.45}
.cbk .pr2 em{font-style:normal;color:#ffcf7a}
.cbk small{font-size:11.5px;color:var(--mu);line-height:1.4}
.cbsum{font-size:12.5px;color:#f3e8ff;padding:2px 2px 4px}
.cbsum b{color:#ffe08a;font-family:var(--fh);font-weight:normal}
.c2.cbb{border-color:rgba(255,214,120,.55);color:#ffe08a;flex:none}
#chips{overflow-x:auto;scrollbar-width:none}#chips::-webkit-scrollbar{display:none}#chips .c2{flex:none}
.cbk .bb{height:32px;font-size:12.5px;padding:0 14px;flex:none}
#ui.tkmenu #talksheet{display:flex}
#ui.tkmenu .pdim{display:block}
.sb.req .bdg{background:#ffb24a;border-color:#6a3a0a;color:#2a1640}
.tp{display:grid;grid-template-columns:40px 1fr;gap:9px;padding:9px 10px 8px;border-radius:10px;background:rgba(18,7,30,.55);border:1.5px solid rgba(214,162,74,.28);flex:none}
.tp .tav{width:40px;height:40px;border-radius:50%;background:#5b3479;border:1.5px solid var(--gold);display:grid;place-items:center;overflow:hidden}
.tp.k-park .tav{background:#3a2152}
.tbd{min-width:0;display:grid;gap:3px}
.tnm{display:flex;align-items:center;gap:6px;min-width:0}
.tnm b{font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.tdt{margin-left:auto;font-size:11px;color:var(--mu);white-space:nowrap}
.ttg{font-family:var(--fh);font-size:10.5px;line-height:1;padding:3px 6px;border-radius:6px;white-space:nowrap;color:#2a1640;background:#cbb7e0;flex:none}
.ttg.t-fam,.tv.t-fam b{background:#8fe06a}.ttg.t-cpl,.tv.t-cpl b{background:#ff9ac4}.ttg.t-adv,.tv.t-adv b{background:#ffb24a}.ttg.t-gour,.tv.t-gour b{background:#ffe066}.ttg.t-nob,.tv.t-nob b{background:#d8a8ff}.ttg.t-park{background:#ffd24a}
.tst{color:#ffd24a;font-size:11.5px;letter-spacing:1px;line-height:1}
.tbd p{margin:0;font-size:13.5px;line-height:1.45;color:#fff3dc;word-break:keep-all}
.tft{display:flex;gap:10px;font-size:11.5px;color:var(--mu)}
.tft .tlk{color:#ff8ab0}
.tp.k-req.open{border-color:#ffb24a;background:linear-gradient(rgba(255,178,74,.12),rgba(18,7,30,.55))}
.tp.k-req.done{border-color:rgba(127,213,79,.6)}
.tp.k-req.old{opacity:.6}
.trq{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:12px}
.trq span{font-family:var(--fh);font-size:11.5px;padding:2px 8px;border-radius:7px}
.trq .on{background:#ffb24a;color:#2a1640}.trq .ok{background:rgba(127,213,79,.2);color:#a6e88a}.trq .old{background:rgba(255,255,255,.08);color:var(--mu)}
.trq small{color:#ffe08a;font-size:11.5px}
.tpp{display:grid;gap:4px;padding:7px 9px;border-radius:8px;background:#f3e6c6;color:#3a2414;border:1.5px solid #7a5428;position:relative}
.tpp b{font-size:12px;color:#7a1a2a}.tpp i{position:absolute;right:8px;top:6px;font-style:normal;font-family:var(--fh);font-size:11px;color:#c0302a;border:2px double #c0302a;border-radius:6px;padding:1px 5px;transform:rotate(-8deg)}
.pps{display:flex;flex-wrap:wrap;gap:4px}
.ps{font-size:11px;line-height:1;padding:3px 6px;border-radius:9px;border:1.5px dashed rgba(203,183,224,.6);color:var(--mu)}
.ps.on{border:1.5px solid #c8202a;color:#c8202a;background:#fff2ec;font-family:var(--fh)}
/* 손님 막대 (#obar 안 #ob-xr) */
.gview{width:100%;display:grid;gap:5px}
.gr{display:grid;grid-template-columns:44px 1fr auto;align-items:center;gap:8px;font-size:12.5px}
.gr .gk{color:var(--mu)}.gr .gv{font-family:var(--fh);font-size:12.5px;color:#fff3dc;white-space:nowrap}
.gb{display:block;height:8px;border-radius:4px;background:#1a0d28;overflow:hidden}
.gb em{display:block;height:100%;background:linear-gradient(90deg,#ff6a8a,#ffb24a);transition:width .4s}
.gb.fr em{background:linear-gradient(90deg,#7ab8ff,#a68aff)}.gb.fr.hi em{background:linear-gradient(90deg,#a68aff,#ff5a6a)}.gb.fr.adv em{background:linear-gradient(90deg,#ffb24a,#ff5a3a)}
.gr2{font-size:12px;line-height:1.4;color:#e6d6f5}.gr2 span{color:var(--mu);margin-right:6px}
/* 월말 리포트 · 이달의 손님 */
.rtaste{display:grid;gap:5px;opacity:0;transition:opacity .35s}
.rtaste.on{opacity:1}
.tvs{display:flex;flex-wrap:wrap;gap:5px}
.tv{display:flex;align-items:center;gap:5px;font-size:12.5px;padding:3px 8px 3px 3px;border-radius:9px;background:rgba(18,7,30,.45);font-variant-numeric:tabular-nums}
.tv b{font-size:11px;color:#2a1640;border-radius:6px;padding:2px 6px;font-weight:normal}
.tvx{font-size:11.5px;color:var(--mu)}.tvx b{color:#ffe08a;font-weight:normal}
@media (prefers-reduced-motion: reduce){.rtaste,.gb em{transition:none}}#ui #ob-rm[hidden],#ui #ob-mv[hidden]{display:none}
.labtag.dine{background:linear-gradient(#5a3a1a,#3a2410);border-color:#ffb24a;color:#ffe8c0}.labtag.dine.full{border-color:#ff7a7a;color:#ffd6d6}

/* 11/14 5번: 마왕의 힘 창 (38_power.js) · 영웅 면접 얼굴 */
.sf.px{object-fit:contain}
.pwrbox{position:absolute;left:12px;right:12px;top:118px;z-index:40;padding:10px 12px 12px;display:flex;flex-direction:column;gap:7px;max-height:70%;overflow:auto}
.pwrbox[hidden]{display:none}
.pwh{display:flex;align-items:center;gap:8px}.pwh b{font-family:var(--fh);font-weight:normal;color:#ffe08a;font-size:16px}.pwh span{flex:1;font-size:12px;color:var(--mu)}
#ui .pwh .x{width:30px;height:30px;border-radius:8px;background:rgba(255,255,255,.08);border:1px solid rgba(214,162,74,.45);color:#eadcff;font-size:14px}
.pwl{font-size:12px;color:#e6d6f5}
.pws{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center;padding:8px 10px;border-radius:10px;background:rgba(18,7,30,.55);border:1.5px solid rgba(214,162,74,.3)}
.pws.lk{opacity:.55}.pws b{display:block;font-size:13.5px;color:#fff3dc;font-weight:normal;font-family:var(--fh)}.pws b em{font-style:normal;font-size:11px;color:#a6e88a;margin-left:4px}
.pws small{display:block;font-size:11.5px;color:var(--mu);line-height:1.4;margin-top:2px}.pws i{display:block;font-style:normal;font-size:11.5px;color:#ffd8a8;margin-top:3px}
#ui .pws .bb{height:32px;padding:0 12px;font-size:12.5px}.pwlv{font-size:12px;color:var(--mu)}

/* 11/14 6번: 행사 칩 · 소문 쪽지 · 소문 수첩 (39_event.js) */
#ui .evchip{position:absolute;top:116px;left:164px;z-index:6;display:flex;align-items:center;gap:5px;height:28px;padding:0 10px 0 4px;border-radius:14px;background:linear-gradient(var(--pn1),var(--pn2));border:1.5px solid var(--gold);color:#f3e8ff;font-size:12px;white-space:nowrap}
#ui .evchip[hidden]{display:none}#ui .evchip img{width:22px;height:22px;image-rendering:pixelated}#ui .evchip small{color:#ffe08a;font-size:11px}
.ttg.t-rumor{background:#ff7ab0;color:#3a0a24}
.tp.k-rumor{border-color:#ff9ac6;background:rgba(60,10,40,.6)}
.rnb{display:flex;flex-direction:column;gap:6px;padding:10px 11px;border-radius:10px;background:rgba(18,7,30,.55);border:1.5px solid rgba(255,154,198,.45)}
.rnb>b{font-family:var(--fh);font-weight:normal;color:#ffb8d8;font-size:14px}.rnb>small{color:var(--mu);font-size:12px}
.rr2{display:flex;flex-direction:column;gap:2px;padding:6px 8px;border-radius:8px;background:rgba(255,255,255,.05)}.rr2 i{font-style:normal;font-size:11px;color:var(--mu)}.rr2 span{font-size:13px;color:#f3e8ff}.rr2 small{font-size:11.5px;color:#ffd8a8}
#ui.bmode .evchip,#ui.storyon .evchip,#ui.rep .evchip{display:none}

/* ---------- 11/15 편의성 (43_ux.js · 시안 LCVvzpEq) ---------- */
/* 1 방향 4버튼 · 11 가까운 빈자리로 */
#ui .dirs{flex:1.5;display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:4px}
#ui .dirs[hidden]{display:none}
#ui .dbt{height:46px;border-radius:10px;background:rgba(255,255,255,.09);border:1.5px solid rgba(214,162,74,.5);display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1;color:#f3e8ff;padding:0}
#ui .dbt b{font-size:19px;font-weight:normal}
#ui .dbt small{font-size:10px;color:#ffe08a;margin-top:3px}
#ui .dbt.on{background:#5a3d10;border-color:#ffe14d;color:#ffe14d}
#ui .nearb{margin-left:8px;height:24px;padding:0 10px;border-radius:12px;background:#ffe08a;color:#2a1600;font-size:12px;font-family:var(--fh);border:0;vertical-align:middle}
/* 3 짓기 카드 */
#ui .it{position:relative}
.it .sz{position:absolute;top:4px;left:4px;font-size:10px;line-height:1;padding:2px 5px;border-radius:7px;background:rgba(60,40,90,.92);color:#e6d6f5}
.it .nw{position:absolute;top:4px;right:4px;font-size:9.5px;line-height:1;padding:2px 5px;border-radius:7px;background:#d9442f;color:#fff;font-family:var(--fh)}
#ui .it.flash{border-color:#ffe14d;box-shadow:0 0 0 2px rgba(255,225,77,.6);animation:cardfl .45s ease-in-out 6 alternate}
@keyframes cardfl{to{box-shadow:0 0 0 5px rgba(255,225,77,.12)}}
@media (prefers-reduced-motion: reduce){#ui .it.flash{animation:none}}
/* 11/14 프리미엄 기구 (45_premium.js) — 카드 ✦ 배지 · 상점 줄 */
.it .pmb{position:absolute;top:20px;right:4px;font-size:11px;line-height:1;padding:2px 4px;border-radius:7px;background:linear-gradient(#ffd75a,#e09a1e);color:#3a1a00;font-weight:700}
#ui .it.premc{border-color:rgba(255,210,90,.55)}
#ui .it.premc.lock{opacity:.85}
.prh0{padding:10px 6px 2px;display:flex;flex-direction:column;gap:2px;flex:none}
.prh0 b{color:#ffd75a;font-family:var(--fh);font-size:15px}
.prh0 small{color:#cdb8e6;font-size:11.5px}
.pr0.prem{border-color:rgba(255,210,90,.45)}
.pr0.prem .pthw{display:flex;align-items:center;justify-content:center;width:56px;height:52px}
.pr0.prem .pthw canvas{max-width:54px;max-height:50px;width:auto!important;height:auto!important;image-rendering:pixelated}
.pr0.prem.flash{border-color:#ffe14d;box-shadow:0 0 0 2px rgba(255,225,77,.6)}
#ui .c2.big{height:28px;padding:0 10px;font-size:12px;flex:none}
#ui #sheet.big{top:118px;height:auto}
#sheet.big .cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));overflow-x:hidden;overflow-y:auto;touch-action:pan-y;flex:1;align-content:start;padding-bottom:6px;scroll-snap-type:none}
#ui #sheet.big .it{width:auto}
.lockrow{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:5px;padding-top:6px}
.lockrow .lh{width:100%;font-size:12px;color:var(--mu)}
.lockrow .lc{font-size:11.5px;padding:3px 9px;border-radius:11px;background:rgba(255,255,255,.06);border:1px solid rgba(214,162,74,.25);color:#cbb7e0}
/* 4 직원 창 */
.enb{display:block;width:46px;height:5px;border-radius:3px;background:#1a0d28;overflow:hidden}
.enb em{display:block;height:100%}
.dot.zz{color:#ffd24a}.dot.zz::before{background:#ffb84a}
.ssum{font-size:12.5px;color:#e6d6f5;padding:0 2px 2px;flex:none}
.ssum b{color:#ffd24a;font-weight:normal;font-family:var(--fh)}
/* 5 막대 칩 */
#ob-good{display:flex;flex-wrap:wrap;gap:5px}
.gc{font-size:12.5px;line-height:1.35;padding:3px 9px;border-radius:11px;background:rgba(255,255,255,.07);border:1px solid rgba(214,162,74,.3);color:#fff3dc}
.gc.w{border-color:#ff9a6a;color:#ffc0a0}.gc.h{color:#ffe08a;border-style:dashed}.gc.g{color:#b8f0a0;border-color:rgba(127,213,79,.5)}
#ui .brow[hidden]{display:none}
/* 6 마계톡 = 폰 */
#ui #talksheet{border-radius:30px;border:7px solid #0d0615;padding:0 0 16px;background:linear-gradient(#2b1842,#1b0f2c);box-shadow:0 0 0 2px #6a4a8a,0 10px 30px rgba(8,2,16,.7);overflow:hidden}
#ui #talksheet::after{content:"";position:absolute;left:50%;bottom:5px;width:96px;height:4px;margin-left:-48px;border-radius:2px;background:rgba(240,230,255,.5)}
.tkbar{position:relative;display:flex;align-items:center;justify-content:space-between;height:26px;padding:0 20px;font-size:12px;font-weight:700;color:#f3e8ff;font-variant-numeric:tabular-nums;flex:none}
.tkn{position:absolute;left:50%;top:0;width:86px;height:19px;margin-left:-43px;background:#0d0615;border-radius:0 0 13px 13px}
.tks{display:flex;align-items:flex-end;gap:2px;height:11px}
.tks i{display:block;width:3px;background:#f3e8ff;border-radius:1px}
.tks i:nth-child(1){height:4px}.tks i:nth-child(2){height:6px}.tks i:nth-child(3){height:8px}.tks i:nth-child(4){height:10px;opacity:.4}
.tks .bat{display:block;width:20px;height:10px;border:1.5px solid #f3e8ff;border-radius:3px;margin-left:5px;position:relative;box-sizing:border-box}
.tks .bat em{position:absolute;left:1px;top:1px;bottom:1px;width:70%;background:#8fe39c;border-radius:1px}
.tks .bat::after{content:"";position:absolute;right:-4px;top:2px;width:2px;height:4px;background:#f3e8ff;border-radius:0 1px 1px 0}
#talksheet .shd{background:linear-gradient(#7a3ec4,#5b2a99);padding:9px 10px 9px 16px;margin-bottom:9px;flex:none}
#talksheet .shd .gl{color:#eadcff}
#ui .tgo{flex:none;height:26px;padding:0 11px;border-radius:13px;background:#ffe08a;color:#2a1600;border:0;font-family:var(--fh);font-size:12.5px;margin-left:auto;white-space:nowrap}
/* 7 공원 한눈에 */
#ui #isheet{height:auto;max-height:calc(100% - 210px)}
.ihub{display:flex;flex-direction:column;gap:6px;padding:8px 12px 0;overflow-y:auto;min-height:0}
.ih{display:grid;gap:1px;background:rgba(18,7,30,.55);border:1px solid rgba(214,162,74,.3);border-radius:9px;padding:6px 10px}
.ih b{font-size:13px;color:#ffe08a;font-weight:normal;font-family:var(--fh)}
.ih span{font-size:12.5px;color:#f3e8ff;line-height:1.4}
.ih i{font-style:normal}.ih i.ok{color:#a6e88a}.ih i.no{color:#ffb07a}
.ihl{font-size:11.5px;color:var(--mu);padding-top:2px}
.ihb{display:grid;grid-template-columns:1fr 1fr;gap:6px}
#ui .ihb .bb{height:40px;font-size:14px;display:flex;align-items:center;justify-content:center;gap:6px}
.ihb small{font-family:var(--fb);font-size:11.5px;color:#ffe08a}
/* 8 직원·마왕 말 */
.bub.pri{border-color:#5a2a90}
/* 10 돌아가기 */
#ui .backbtn{position:absolute;left:50%;top:112px;transform:translateX(-50%);height:36px;padding:0 16px;border-radius:18px;font-family:var(--fh);font-size:14px;color:#ffe08a;pointer-events:auto;z-index:6;white-space:nowrap}
#ui .backbtn[hidden]{display:none}
/* 12 창 열렸을 때 뒤 떠다니는 글씨 숨김 */
#ui.smenu #fx,#ui.mmenu #fx,#ui.lbmenu #fx,#ui.tkmenu #fx,#ui.cbmenu #fx,#ui.stmenu #fx,#ui.shmenu #fx{visibility:hidden}/* 💎 보석 쓰는 곳 (44_gem.js) — 마차 부르기 · 하피 소문 부탁 */
.mcall{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:2px 0 6px}.mcall .bb{height:34px;font-size:12.5px}.mcall small{font-size:10.5px;opacity:.8}
.rask{display:flex;flex-direction:column;gap:6px;padding:10px 11px;border-radius:10px;background:rgba(18,7,30,.55);border:1.5px solid rgba(200,115,255,.55);margin-bottom:8px}
.rask>b{font-family:var(--fh);font-weight:normal;color:#e6c2ff;font-size:14px}.rask>b small{font-family:inherit;color:var(--mu);font-size:11.5px;margin-left:4px}.rask>small{color:var(--mu);font-size:12px}
.raskc{display:flex;flex-wrap:wrap;gap:6px}.raskc .bb{height:32px;padding:0 10px;font-size:12.5px}
/* 11/14 바루의 안내 (47_tips.js) — 카드 = 예전 .tut 모양 + 버튼 칸 · 눌러서 다음 · 안내 수첩 */
.tut.tip{cursor:pointer;z-index:35;top:96px}
.tut.tip .tbs{display:flex;flex-direction:column;gap:5px;align-items:stretch}
.tut.tip .tt small.tn{display:block;font-size:10.5px;color:var(--mu);margin-top:2px}
.tut.tip .tnx{font-size:11.5px;color:var(--mu);white-space:nowrap}
#ui .tb.ghost{height:30px;background:rgba(18,7,30,.5);border-color:rgba(214,162,74,.45);color:#e6d6f5;font-size:12.5px}
.tut.tip.waiting{box-shadow:0 0 0 2px rgba(255,210,74,.55),0 6px 20px rgba(8,2,16,.5)}
#ui .snotip{position:absolute;left:50%;bottom:64px;transform:translateX(-50%);font-size:13px;color:#cbb7e0;padding:7px 14px;border:1px solid rgba(214,162,74,.5);border-radius:14px;background:rgba(0,0,0,.35);white-space:nowrap}
.tipbook{position:absolute;left:12px;right:12px;top:110px;z-index:40;padding:10px 12px 12px;display:flex;flex-direction:column;gap:8px;max-height:70%;overflow:auto}
.tipbook .tbl{display:flex;flex-wrap:wrap;gap:6px}
#ui .tipbook .tbi{font-size:13px;padding:6px 10px;border-radius:9px;background:rgba(18,7,30,.5);border:1px solid rgba(214,162,74,.4);color:#f1e8ff}
#ui .tipbook .tbi.no{color:var(--mu);border-style:dashed}
#ui .tipbook .x{margin-left:auto}

/* 11/15 ①-2 마왕의 힘 찾기 쉽게 · 짓기 때 건물 흐리게 (49_find.js) */
#ui .chip.mana .pwn{color:#e9d2ff;font-family:var(--fh);font-size:12.5px}
#ui .chip.mana{position:relative}
#ui .chip.mana .rdy{display:none;position:absolute;right:-6px;top:-7px;width:17px;height:17px;border-radius:50%;background:#ff4a6a;color:#fff;font:bold 11px/17px var(--fh);font-style:normal;text-align:center;box-shadow:0 0 0 2px #2a1640}
#ui .chip.mana.ready{border-color:#c873ff;animation:pwglow 1.4s ease-in-out infinite}
#ui .chip.mana.ready .rdy{display:block}
@keyframes pwglow{0%,100%{box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 3px 0 rgba(10,4,20,.45),0 0 0 0 rgba(200,115,255,0)}50%{box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 3px 0 rgba(10,4,20,.45),0 0 12px 3px rgba(200,115,255,.75)}}
@media (prefers-reduced-motion:reduce){#ui .chip.mana.ready{animation:none;box-shadow:0 0 0 2px rgba(200,115,255,.8)}}
.pwtop{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center;padding:9px 10px;border-radius:10px;background:linear-gradient(#5a2f86,#3a1c5c);border:1.5px solid #c873ff}
.pwtop b{font-family:var(--fh);font-weight:normal;color:#f3dcff;font-size:15px;display:block}.pwtop small{font-size:11.5px;color:#e0ccf5}
#ui .pwtop .bb{height:38px;padding:0 12px;font-size:13px;flex:none}
#ui .mpbar{position:absolute;left:50%;top:118px;transform:translateX(-50%);z-index:8;display:flex;align-items:center;gap:10px;padding:6px 6px 6px 14px;pointer-events:auto;border-color:#c873ff;white-space:nowrap}
#ui .mpbar b{font-family:var(--fh);font-weight:normal;color:#f3dcff;font-size:14px}#ui .mpbar .bb{height:32px;padding:0 12px;font-size:13px;flex:none}
#ui .mpbar[hidden]{display:none}
#ui #ob-go.hl{animation:gohl .5s ease-in-out 5 alternate}
@keyframes gohl{from{box-shadow:0 0 0 0 rgba(200,115,255,0)}to{box-shadow:0 0 0 4px rgba(200,115,255,.9),0 0 16px rgba(200,115,255,.8)}}
#ui .btop .see{margin-left:auto;height:28px;padding:0 9px;font-size:12px;border-radius:8px;background:rgba(255,255,255,.08);border:1.5px solid rgba(214,162,74,.45);color:#eadcff;flex:none}
#ui .btop .see.on{background:linear-gradient(#8a4fd8,#5e2aa8);border-color:var(--gold);color:#fff}

/* 11/15 ③ 테스트판: 뒤로 가기 「게임을 끌까요?」 (50_back.js) · 설정 정보 칸 (20_settings.js) */
#ui .quitdim{position:absolute;inset:0;z-index:90;background:rgba(10,4,20,.55);display:flex;align-items:center;justify-content:center;pointer-events:auto}
#ui .quitbox{width:300px;padding:18px 16px 14px;text-align:center;display:flex;flex-direction:column;gap:6px}
#ui .quitbox b{font-family:var(--fh);font-weight:normal;font-size:21px;color:#ffe08a}
#ui .quitbox p{margin:0 0 8px;font-size:13.5px;color:#d9c6ef}
#ui .quitbox .brow{display:flex;gap:8px}#ui .quitbox .bb{height:46px}
#ui .stinfo a.bb{display:flex;align-items:center;justify-content:center;text-decoration:none;color:#fff3dc;box-sizing:border-box;pointer-events:auto}
#ui .stlic{text-align:center;font-size:11.5px;line-height:1.6;padding:4px 10px 10px}