/* 퇴근길 작은 찻집 (방치형, 시제품) */
.ts-game{max-width:560px;margin:0 auto;background:#fffaf2;border:1px solid var(--line);border-radius:16px;overflow:hidden;position:relative;user-select:none;-webkit-user-select:none}
.ts-top{display:flex;justify-content:space-between;align-items:flex-end;gap:10px;padding:12px 14px 8px}
.ts-lbl{font-size:11px;color:var(--muted)}
.ts-coin{font-size:26px;font-weight:800;letter-spacing:-.5px;font-variant-numeric:tabular-nums;line-height:1.1;display:flex;align-items:center;gap:6px}
.ts-coin i{width:18px;height:18px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#ffe58a,#e0a92a);box-shadow:inset 0 0 0 2px #c58d14;display:inline-block}
.ts-ips{text-align:right;font-variant-numeric:tabular-nums}
.ts-ips b{font-size:17px}
.ts-boostchip{display:none;font-size:11px;font-weight:700;color:#fff;background:#d0543a;border-radius:99px;padding:2px 8px;margin-top:2px}
.ts-boostchip.on{display:inline-block}

/* 장면 */
.ts-scene{position:relative;height:240px;overflow:hidden;cursor:pointer;touch-action:manipulation;background:#f1e3cf}
.ts-wall{position:absolute;inset:0 0 34px 0;background:#f1e3cf}
.ts-floor{position:absolute;left:0;right:0;bottom:0;height:34px;background:repeating-linear-gradient(90deg,#c39566 0 38px,#b88a5c 38px 40px)}
.ts-window{position:absolute;left:5%;top:22px;width:30%;height:78px;border:5px solid #9a6a3e;border-radius:6px;background:linear-gradient(#2c3e6b,#5a4f84);overflow:hidden}
.ts-window::after{content:"";position:absolute;left:50%;top:0;bottom:0;width:4px;margin-left:-2px;background:#9a6a3e}
.ts-moon{position:absolute;right:14%;top:12px;width:14px;height:14px;border-radius:50%;background:#fff4c4;box-shadow:0 0 10px #fff4c4}
.ts-sea{display:none;position:absolute;left:0;right:0;bottom:0;height:45%;background:repeating-linear-gradient(0deg,#3d7fb5 0 6px,#4c90c4 6px 12px)}
.ts-beam{display:none;position:absolute;top:0;width:58%;height:10px;background:#7b5232;transform-origin:left top}
.ts-awning{display:none;position:absolute;right:0;width:40%;top:58px;height:22px;background:repeating-linear-gradient(90deg,#d0543a 0 18px,#fff6e8 18px 36px);border-radius:0 0 10px 10px}
.ts-counter{position:absolute;right:0;bottom:0;width:40%;height:66px;background:#9a6a3e;border-top:7px solid #7b5232;z-index:3}
.ts-sign{position:absolute;left:8px;right:8px;top:12px;text-align:center;color:#fff3dd;font-size:12px;font-weight:700;letter-spacing:.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ts-wheel{display:none;position:absolute;bottom:-14px;width:26px;height:26px;border-radius:50%;background:#3b2f27;border:4px solid #6b4a2b}
/* 단계별 */
.stg0 .ts-wall{background:linear-gradient(#f7c59f,#c9a3c8 70%)}
.stg0 .ts-window{display:none}
.stg0 .ts-floor{background:#8f8a84;height:34px}
.stg0 .ts-awning,.stg0 .ts-wheel{display:block}
.stg0 .ts-counter{height:58px;border-radius:8px 8px 0 0;bottom:14px;width:38%;right:2%}
.stg0 .ts-alley{display:block}
.ts-alley{display:none;position:absolute;left:0;bottom:34px;width:58%;height:60px;background:repeating-linear-gradient(0deg,#b77c62 0 14px,#a36b52 14px 16px),#b77c62;opacity:.55}
.stg2 .ts-wall{background:#eadbc2}
.stg2 .ts-beam{display:block}
.stg2 .ts-window{border-radius:50%;width:76px;height:76px;left:12%}
.stg2 .ts-window::after{display:none}
.stg3 .ts-wall{background:#e3eef0}
.stg3 .ts-window{width:52%;left:3%;background:linear-gradient(#9ecbe8,#cfe7f2 55%)}
.stg3 .ts-sea{display:block}
.stg3 .ts-moon{background:#fff;box-shadow:0 0 14px #ffe9a8;top:10px}
.stg3 .ts-floor{background:repeating-linear-gradient(90deg,#e2c9a3 0 38px,#d6bb92 38px 40px)}

/* 사람 */
.ts-person{position:absolute;bottom:14px;width:26px;height:46px;transition:left .6s linear,opacity .9s,transform .9s;z-index:4}
.ts-person svg{width:100%;height:100%;display:block}
.ts-person.leave{opacity:0;transform:translateX(-50px)}
.ts-barista{position:absolute;bottom:52px;width:28px;height:48px;z-index:2}
.stg0 .ts-barista{bottom:62px}
.ts-barista svg{width:100%;height:100%;display:block}
.ts-prog{position:absolute;left:-4px;right:-4px;top:-9px;height:5px;border-radius:3px;background:rgba(0,0,0,.15);overflow:hidden;opacity:0}
.ts-prog.on{opacity:1}
.ts-prog i{display:block;height:100%;width:0;background:#2f7a55}
.ts-bub{position:absolute;bottom:64px;left:0;transform:translateX(-10%);max-width:210px;font-size:11px;line-height:1.35;background:#fff;border:1px solid var(--line);border-radius:10px;padding:5px 8px;z-index:6;box-shadow:0 2px 6px rgba(0,0,0,.08);animation:tsbub 3.6s forwards;pointer-events:none}
.ts-bub b{display:block;font-size:10px;color:var(--muted)}
@keyframes tsbub{0%{opacity:0;transform:translate(-10%,6px)}8%{opacity:1;transform:translate(-10%,0)}85%{opacity:1}100%{opacity:0}}
.ts-pop{position:absolute;font-size:13px;font-weight:800;color:#2f7a55;z-index:7;pointer-events:none;animation:tspop 1s ease-out forwards;font-variant-numeric:tabular-nums;text-shadow:0 1px 0 #fff}
@keyframes tspop{from{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-30px)}}
.ts-tap{position:absolute;width:30px;height:30px;margin:-15px 0 0 -15px;border-radius:50%;border:2px solid rgba(255,255,255,.9);z-index:8;pointer-events:none;animation:tstap .45s ease-out forwards}
@keyframes tstap{from{opacity:1;transform:scale(.4)}to{opacity:0;transform:scale(1.6)}}
.ts-full{position:absolute;left:8px;bottom:50px;font-size:11px;font-weight:700;background:#fff;color:#c8463b;border-radius:99px;padding:2px 8px;z-index:6;opacity:0;transition:opacity .3s}
.ts-full.on{opacity:1}
.ts-toast{position:absolute;left:50%;top:8px;transform:translateX(-50%);background:rgba(38,35,32,.88);color:#fff;font-size:12px;font-weight:700;padding:6px 12px;border-radius:99px;z-index:9;white-space:nowrap;opacity:0;transition:opacity .3s;pointer-events:none;max-width:94%;overflow:hidden;text-overflow:ellipsis}
.ts-toast.on{opacity:1}

/* 꾸미기 */
.ts-dec{position:absolute;display:none;pointer-events:none}
.ts-dec.on{display:block}
.ts-dec svg{display:block;width:100%;height:100%}
.d-plant{left:1%;bottom:22px;width:30px;height:44px;z-index:1}
.d-lamp{left:46%;top:0;width:34px;height:58px;z-index:1}
.d-cat{right:24%;bottom:66px;width:34px;height:26px;z-index:4}
.stg0 .d-cat{bottom:79px}
.d-books{right:4%;top:18px;width:32%;height:40px;z-index:1}
.d-record{right:26%;top:2px;width:30px;height:20px;z-index:1}
.d-chime{left:38%;top:0;width:18px;height:46px;z-index:1}
.stg0 .d-books,.stg0 .d-record{top:-60px}

/* 행동 줄 */
.ts-actions{padding:10px 12px 4px;display:flex;flex-direction:column;gap:8px}
.ts-adbtn{width:100%;text-align:left;border:1.5px dashed #2f6fd0;background:#f4f8ff;color:var(--ink);font-weight:700;display:flex;justify-content:space-between;align-items:center;gap:8px}
.ts-adbtn small{font-weight:500;color:var(--muted);font-size:12px}
.ts-vip{display:none;border:1.5px solid #e0a92a;background:#fff8e6;border-radius:10px;padding:8px 10px;font-size:13px;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.ts-vip.on{display:flex}
.ts-vip b{color:#a8740c}
.ts-vip .btns{display:flex;gap:6px}
.ts-vip button{padding:6px 10px;font-size:13px}

/* 탭과 목록 */
.ts-tabs{display:flex;gap:4px;padding:6px 12px 0;border-bottom:1px solid var(--line);overflow-x:auto}
.ts-tabs button{border:0;border-radius:10px 10px 0 0;background:none;color:var(--muted);font-weight:700;padding:8px 12px;white-space:nowrap}
.ts-tabs button.on{background:#f3ece0;color:var(--ink)}
.ts-tabs .dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#d0543a;margin-left:4px;vertical-align:2px}
.ts-list{padding:4px 12px 12px;min-height:200px}
.ts-row{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 2px;border-bottom:1px solid #efe8dc}
.ts-row:last-child{border-bottom:0}
.ts-row .nm{font-weight:700;font-size:14px}
.ts-row .ds{font-size:12px;color:var(--muted);margin-top:1px}
.ts-row .sw{width:12px;height:12px;border-radius:3px;display:inline-block;margin-right:6px;vertical-align:-1px}
.ts-row button{min-width:92px;font-variant-numeric:tabular-nums;font-weight:700;padding:7px 10px;flex:none}
.ts-row button.buy{background:var(--ink);color:#fff;border-color:var(--ink)}
.ts-row button.buy:disabled{background:#fff;color:var(--muted);border-color:var(--line);opacity:1}
.ts-row.lock .nm{color:var(--muted)}
.ts-row.done button{background:#eaf3ee;color:#2f7a55;border-color:#cfe5d7}
.ts-stagecard{background:#f6f0e6;border-radius:12px;padding:12px;margin:10px 0 4px;border-bottom:0}
.ts-reg{padding:10px 2px;border-bottom:1px solid #efe8dc}
.ts-reg .nm{font-weight:700;font-size:14px;display:flex;align-items:center;gap:6px}
.ts-reg .nm i{width:12px;height:12px;border-radius:50%;display:inline-block}
.ts-reg p{margin:4px 0 0;font-size:13px;line-height:1.5}
.ts-reg .lk{color:var(--muted);font-size:12px}
.ts-meter{height:5px;background:#efe8dc;border-radius:3px;overflow:hidden;margin-top:4px;max-width:220px}
.ts-meter i{display:block;height:100%;background:#7a4fc0}

/* 덮개 (오프라인 수익, 광고 자리, 저장 코드) */
.ts-ov{position:absolute;inset:0;background:rgba(38,35,32,.55);display:none;align-items:center;justify-content:center;z-index:20;padding:16px}
.ts-ov.on{display:flex}
.ts-card{background:#fff;border-radius:16px;padding:20px;max-width:340px;width:100%;text-align:center}
.ts-card h3{margin:0 0 6px;font-size:18px}
.ts-card p{margin:0 0 12px;color:var(--muted);font-size:13px;line-height:1.55}
.ts-card .big{font-size:28px;font-weight:800;color:var(--ink);margin:6px 0 14px;font-variant-numeric:tabular-nums}
.ts-card .col{display:flex;flex-direction:column;gap:8px}
.ts-card textarea{width:100%;height:84px;font:12px/1.4 var(--font-mono,monospace);border:1px solid var(--line);border-radius:10px;padding:8px;resize:none;word-break:break-all}
.ts-adbox{background:#1d1b19;color:#fff;border-radius:16px;padding:28px 20px;max-width:320px;width:100%;text-align:center}
.ts-adbox .cnt{font-size:40px;font-weight:800;margin:10px 0}
.ts-adbox p{color:#cfc8bf;font-size:13px;margin:0;line-height:1.5}
.ts-proto{font-size:12px;color:var(--muted);text-align:center;padding:0 12px 12px}
@media(max-width:600px){.ts-game{border-radius:12px}.ts-scene{height:220px}.ts-coin{font-size:22px}}