/* Drug Wars: Degen City. Street-poster UI: concrete wall, pasted paper, tape, hard shadows. Same class names as before. */
:root{
  --wall:#0b0b10;--wall2:#15141b;--panel:#17161e;--panel2:#1f1d28;
  --paper:#ece4d0;--paper2:#e0d6bd;--manila:#e6d49b;--ink:#f4f0e6;--ink2:#c3bfb3;--ink3:#8f8b82;--dark:#15130f;--dark2:#4a443a;
  --line:#3a3744;--line2:#26242f;
  --green:#3dff86;--pink:#ff3d9a;--blue:#33c8ff;--gold:#ffd400;--red:#ff4a5e;--purple:#a46bff;
  --r-sm:4px;--r:6px;--r-lg:8px;
  --bebas:"Bebas Neue",Impact,"Arial Narrow Bold",sans-serif;--marker:"Permanent Marker","Segoe Print","Comic Sans MS",cursive;--type:"Special Elite","Courier New",monospace;
  --tex-paper:url(../assets/street/paper.webp);--tex-manila:url(../assets/street/manila.webp);--tex-wall:url(../assets/street/concrete.webp);
  --shadow:5px 5px 0 #000;
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--ink);background:var(--wall);
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{-webkit-text-size-adjust:100%}
body{margin:0;min-height:100vh;font-variant-numeric:tabular-nums;
  background:
    radial-gradient(900px 500px at 15% -5%,#2a0f3a88,transparent 65%),
    radial-gradient(700px 500px at 110% 45%,#06364a66,transparent 65%),
    radial-gradient(600px 400px at -10% 85%,#4a0a2f55,transparent 65%),
    var(--wall)}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:var(--tex-wall) 0 0/520px;opacity:.6;mix-blend-mode:overlay}
button{font:inherit;color:inherit;cursor:pointer;border:0;background:none}
button:disabled{cursor:not-allowed}
h1,h2,h3{letter-spacing:.01em}
p{line-height:1.5}

/* ---------- layout ---------- */
.shell{max-width:530px;margin:auto;min-height:100dvh;padding-bottom:98px}
main{padding:18px 14px 34px}
main.enter{animation:slap .32s cubic-bezier(.2,1.4,.4,1)}
@keyframes slap{from{opacity:0;transform:scale(1.04) translateY(10px)}to{opacity:1;transform:none}}
h1{font-family:var(--bebas);font-weight:400;font-size:38px;line-height:.95;margin:4px 0 14px;text-shadow:3px 3px 0 #000}
.between,.flex{display:flex;align-items:center;justify-content:space-between;gap:12px}
.muted,small{color:var(--ink2)}
.sub{font-family:var(--type);font-size:11.5px;color:var(--ink3)}
.green{color:var(--green)}.pink{color:var(--pink)}.red{color:var(--red)}.gold{color:var(--gold)}.blue{color:var(--blue)}

/* ---------- top bar and stats ---------- */
.top{position:sticky;top:0;z-index:30;padding:11px 14px 12px;background:#0b0b10f4;border-bottom:4px solid var(--pink);box-shadow:0 6px 0 #000a}
.top::after{display:none}
.brand{font-family:var(--marker);font-size:23px;font-style:normal;font-weight:400;letter-spacing:.02em;text-shadow:2px 2px 0 var(--pink);transform:rotate(-1.5deg);display:inline-block}
.brand b{color:var(--gold);font-weight:400}
.tag{font-family:var(--type);color:var(--green);font-weight:400;letter-spacing:.18em;font-size:10.5px;text-transform:uppercase}
.stats{display:grid;grid-template-columns:repeat(5,1fr);gap:7px;margin-top:11px}
.stat{position:relative;padding:9px 3px 6px;text-align:center;min-width:0;overflow:hidden;color:var(--dark);
  background:var(--paper) var(--tex-paper) center/cover;background-blend-mode:multiply;border:2px solid #000;box-shadow:3px 3px 0 #000;transform:rotate(-1deg)}
.stat:nth-child(even){transform:rotate(1.2deg)}
.stat::before{content:"";position:absolute;inset:0 0 auto 0;height:5px;background:var(--c,#33c8ff)}
.stat:nth-child(1){--c:#1fd864}.stat:nth-child(2){--c:#ff4a5e}.stat:nth-child(3){--c:#33a0cc}.stat:nth-child(4){--c:#ffb800}.stat:nth-child(5){--c:#ff3d9a}
.stat small{display:flex;align-items:center;justify-content:center;gap:3px;color:var(--dark2);font-family:var(--type);font-size:8.5px;letter-spacing:.04em;white-space:nowrap}
.stat strong{font-family:var(--bebas);font-weight:400;font-size:19px;line-height:1;white-space:nowrap;color:var(--dark)}
.stat .art.si{width:14px;height:14px;font-size:10px}
.iconbtn{display:grid;place-items:center;width:38px;height:38px;font-size:16px;background:var(--paper) var(--tex-paper) center/cover;background-blend-mode:multiply;border:2px solid #000;box-shadow:3px 3px 0 #000;transition:transform .08s,box-shadow .08s}
.iconbtn:active{transform:translate(2px,2px);box-shadow:1px 1px 0 #000}

/* ---------- cards: dark panels, taped on, hard shadows ---------- */
.card{position:relative;margin-bottom:16px;padding:16px;border-radius:var(--r-sm);
  background:var(--panel) var(--tex-wall) 0 0/460px;background-blend-mode:soft-light;border:2px solid #4a4658;box-shadow:var(--shadow)}
.card::before{content:"";position:absolute;left:-14px;top:-12px;width:78px;height:26px;z-index:2;pointer-events:none;
  background:url(../assets/street/tape-1.webp) center/100% 100% no-repeat;transform:rotate(-24deg);filter:drop-shadow(0 2px 2px #0008)}
.card:nth-of-type(even)::before{left:auto;right:-14px;transform:rotate(24deg);background-image:url(../assets/street/tape-2.webp)}
.card::after{display:none}
.card>*{position:relative;z-index:1}
.card h2,.card h3{margin:0 0 8px;font-family:var(--bebas);font-weight:400;letter-spacing:.03em}
.card h2{font-size:30px}
.card h3{font-size:22px}
.card.gold{background:var(--manila) var(--tex-manila) center/cover;background-blend-mode:multiply;color:var(--dark);border-color:#000}
.card.gold h2,.card.gold h3{color:var(--dark)}
.card.gold .muted,.card.gold small,.card.gold .sub{color:var(--dark2)}
.card.danger{border-color:var(--red);box-shadow:5px 5px 0 #000,0 0 0 2px #000}
.card.danger h2,.card.danger h3{color:var(--red)}
.separator{border-top:2px dashed #ffffff22;margin:12px 0}

/* ---------- buttons: stamped blocks with hard shadows ---------- */
.btn{position:relative;display:block;width:100%;padding:13px 12px 11px;border-radius:var(--r-sm);font-family:var(--bebas);font-weight:400;font-size:21px;line-height:1;letter-spacing:.07em;text-align:center;
  color:#111;border:3px solid #000;box-shadow:5px 5px 0 #000;transform:rotate(-.6deg);transition:transform .1s,box-shadow .1s,filter .12s}
.btn:nth-of-type(even){transform:rotate(.6deg)}
.btn:hover:not(:disabled){transform:translate(-2px,-2px) rotate(-.6deg);box-shadow:7px 7px 0 #000}
.btn:active:not(:disabled){transform:translate(4px,4px);box-shadow:1px 1px 0 #000}
.btn.greenbg{background:var(--green)}
.btn.pinkbg{background:var(--pink);color:#fff;text-shadow:2px 2px 0 #000}
.btn.bluebg{background:var(--blue)}
.btn.goldbg{background:var(--gold)}
.btn.dark{background:#1b1a22;color:var(--paper);border-color:#000;box-shadow:5px 5px 0 #000,inset 0 0 0 2px #ece4d055}
.btn:disabled{filter:grayscale(1) brightness(.6);opacity:.6;box-shadow:3px 3px 0 #000;transform:none}
.btn.sm{padding:8px 11px 6px;font-size:16px}
.btn.full{width:100%}
.btn+.btn{margin-top:12px}
.buttons{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px}
.buttons.three{grid-template-columns:1fr 1fr 1fr}
.buttons .btn+.btn{margin:0}
.btn.pulse{animation:pulse 1.6s ease-in-out infinite}
@keyframes pulse{50%{transform:rotate(-.6deg) scale(1.04)}}

/* ---------- hero (home) ---------- */
.hero{height:250px;margin-bottom:18px;position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;padding:22px;
  background:radial-gradient(circle at 80% 25%,#ff3d9a77,transparent 40%),linear-gradient(145deg,#6b2a82 0%,#23265c 45%,#08111f 100%);background-size:cover;background-position:center;
  border:3px solid var(--paper);box-shadow:var(--shadow);transform:rotate(-.7deg)}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,#0b0b10cc);pointer-events:none}
.hero:before{content:'🌴 🏙️ 🚘 🌆';position:absolute;font-size:42px;left:10px;top:43px;letter-spacing:12px;opacity:.75;white-space:nowrap}
.hero.has-art:before{display:none}
.hero h1{font-size:56px;margin:0;line-height:.9;text-shadow:4px 4px 0 #000;position:relative;z-index:1}
.hero h1 span{color:var(--pink)}
.hero .tag{margin-top:10px;position:relative;z-index:1}
.hero .logo{position:relative;z-index:1;width:min(90%,440px);height:auto;margin:0 auto;display:block;filter:drop-shadow(4px 5px 0 #000);transform:rotate(-2deg)}
.hero:has(.logo){height:292px;justify-content:center;align-items:center;padding:14px}
.hero:has(.logo) .tag{margin-top:2px;text-shadow:0 2px 0 #000}

/* ---------- map ---------- */
.map{aspect-ratio:941/1672;position:relative;margin-bottom:16px;overflow:hidden;
  background:radial-gradient(ellipse at 45% 55%,#1597b8 0%,#07375f 65%,#06213a);background-size:cover;background-position:center;
  border:3px solid var(--paper);box-shadow:var(--shadow);transform:rotate(.4deg)}
.island{position:absolute;inset:10% 13%;background:linear-gradient(135deg,#b05caa,#654eaa 30%,#36647b 65%,#7ba46a);border:7px solid #58a9a6;border-radius:42% 55% 38% 45%;transform:rotate(-15deg)}
.map.has-art .island{display:none}
.district{position:absolute;transform:translate(-50%,-50%) rotate(-2deg);z-index:1;padding:5px 9px 6px;font-family:var(--bebas);font-weight:400;font-size:15px;letter-spacing:.04em;line-height:1;text-align:center;
  color:var(--dark);background:var(--paper) var(--tex-paper) center/cover;background-blend-mode:multiply;border:2px solid #000;box-shadow:3px 3px 0 #000;transition:transform .12s,box-shadow .12s}
.district:nth-child(even){transform:translate(-50%,-50%) rotate(2deg)}
.district:hover{transform:translate(-50%,-50%) scale(1.1) rotate(0);box-shadow:5px 5px 0 #000}
.district:active{transform:translate(-50%,-50%) scale(.96)}
.district.current{background:var(--gold);animation:here 1.8s ease-in-out infinite}
@keyframes here{50%{transform:translate(-50%,-50%) scale(1.09) rotate(-2deg)}}
.district .art{display:block;margin:0 auto 1px;filter:drop-shadow(1px 0 0 #fff) drop-shadow(-1px 0 0 #fff) drop-shadow(0 1px 0 #fff) drop-shadow(0 -1px 0 #fff) drop-shadow(2px 3px 2px #000a)}
.district small{display:block;font-family:var(--type);font-size:9px;font-weight:400;color:var(--dark2);margin-top:2px}

/* ---------- market rows ---------- */
.trade{position:relative;display:flex;width:100%;align-items:center;text-align:left;gap:12px;margin:10px 0;padding:10px 12px;overflow:hidden;
  background:var(--panel2);border:2px solid #4a4658;border-left:8px solid #4a4658;color:#fff;box-shadow:4px 4px 0 #000;transition:transform .1s,box-shadow .1s,border-color .12s}
.trade:active{transform:translate(3px,3px);box-shadow:1px 1px 0 #000}
.trade.active{background:var(--manila) var(--tex-manila) center/cover;background-blend-mode:multiply;border-color:#000;border-left-color:var(--green);color:var(--dark);box-shadow:4px 4px 0 #000}
.trade.active small,.trade.active .muted{color:var(--dark2)}
.trade.active::before{display:none}
.grow{flex:1}
.trade strong{display:block;font-family:var(--bebas);font-weight:400;font-size:21px;letter-spacing:.03em}
.trade small{font-family:var(--type);font-size:11px}

/* ---------- art slots (emoji fallback under the image) ---------- */
.art{position:relative;display:inline-flex;align-items:center;justify-content:center}
.art em{font-style:normal}
.art img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.art.ic{width:46px;height:46px;font-size:28px}
.art.pin{width:50px;height:50px;font-size:26px}
.art.big{width:96px;height:96px;font-size:64px}
.art.huge{width:210px;height:210px;font-size:110px;overflow:hidden;border:3px solid var(--paper);box-shadow:var(--shadow)}
.art.huge img{object-fit:cover}
.art.wide{display:flex;width:100%;height:150px;background:#0b1a30;font-size:54px;overflow:hidden;margin-bottom:10px;border:2px solid #000;box-shadow:4px 4px 0 #000}
.art.wide img{object-fit:cover}
.art.ic,.art.pin,.art.big{filter:drop-shadow(1.5px 0 0 #fff) drop-shadow(-1.5px 0 0 #fff) drop-shadow(0 1.5px 0 #fff) drop-shadow(0 -1.5px 0 #fff) drop-shadow(2px 4px 3px #000b)}
.art.ni{width:26px;height:26px;font-size:21px}
.art.ti{width:30px;height:30px;font-size:22px}

/* ---------- quantity, pills, bars ---------- */
.quantity{display:flex;justify-content:center;align-items:center;gap:22px;margin:14px}
.quantity button{width:54px;height:54px;font-family:var(--bebas);font-size:36px;line-height:1;color:#111;background:var(--gold);border:3px solid #000;box-shadow:4px 4px 0 #000;transition:transform .08s,box-shadow .08s}
.quantity button:active{transform:translate(3px,3px);box-shadow:1px 1px 0 #000}
.quantity strong{font-family:var(--bebas);font-weight:400;font-size:44px;min-width:50px;text-align:center;text-shadow:3px 3px 0 #000}
.pills{display:flex;gap:7px;justify-content:center;margin-bottom:10px;flex-wrap:wrap}
.pill{padding:7px 13px 5px;font-family:var(--bebas);font-size:16px;letter-spacing:.05em;color:var(--dark);background:var(--paper) var(--tex-paper) center/cover;background-blend-mode:multiply;border:2px solid #000;box-shadow:3px 3px 0 #000;transition:transform .08s,box-shadow .08s}
.pill:active{transform:translate(2px,2px);box-shadow:1px 1px 0 #000}
.bar{height:14px;overflow:hidden;background:#0a0a0e;border:2px solid #000;box-shadow:2px 2px 0 #000,inset 0 0 0 1px #ffffff1a}
.bar span{display:block;height:100%;transition:width .4s cubic-bezier(.2,.8,.2,1);
  background-image:repeating-linear-gradient(-45deg,#ffffff30 0 6px,transparent 6px 12px),linear-gradient(90deg,var(--blue),var(--green));background-size:24px 24px,100% 100%;animation:stripes 1s linear infinite}
@keyframes stripes{to{background-position:24px 0,0 0}}
.bar.heat span{background-image:repeating-linear-gradient(-45deg,#ffffff30 0 6px,transparent 6px 12px),linear-gradient(90deg,var(--green),var(--gold),var(--red))}
.bar.hp span{background-image:repeating-linear-gradient(-45deg,#ffffff30 0 6px,transparent 6px 12px),linear-gradient(90deg,var(--red),var(--gold),var(--green))}

/* ---------- bottom nav ---------- */
nav{position:fixed;bottom:0;left:50%;transform:translateX(-50%);max-width:530px;width:100%;z-index:30;display:flex;gap:4px;padding:10px 8px max(10px,env(safe-area-inset-bottom));
  background:#0b0b10;border-top:4px solid var(--pink);box-shadow:0 -6px 0 #000a}
nav button{position:relative;flex:1;padding:5px 0 3px;color:var(--ink3);font-family:var(--bebas);font-size:15px;letter-spacing:.07em;transition:color .12s,transform .1s,background .12s}
nav button span{display:grid;place-items:center;height:30px;font-size:22px;margin-bottom:2px;transition:transform .12s}
nav button:active{transform:scale(.94)}
nav button.active{color:#111;background:var(--gold);border:2px solid #000;box-shadow:3px 3px 0 #000;transform:rotate(-1.5deg)}
nav button.active:nth-child(even){transform:rotate(1.5deg)}
nav button.active span{transform:translateY(-1px) scale(1.1)}
nav button.active::before{display:none}

/* ---------- modal and toast ---------- */
.overlay{position:fixed;inset:0;z-index:60;display:flex;align-items:center;justify-content:center;padding:18px;background:radial-gradient(circle at 50% 40%,#0b0b10cc,#000e);animation:fade .16s}
@keyframes fade{from{opacity:0}to{opacity:1}}
.modal{position:relative;width:min(100%,440px);max-height:92dvh;overflow:auto;padding:26px 20px 20px;text-align:center;color:var(--dark);
  background:var(--paper) var(--tex-paper) center/cover;background-blend-mode:multiply;border:3px solid #000;box-shadow:8px 8px 0 #000,0 0 0 2px #ece4d0 inset;animation:pop .26s cubic-bezier(.2,1.5,.4,1)}
.modal::before{content:"";position:absolute;left:50%;top:2px;width:104px;height:32px;margin-left:-52px;z-index:2;background:url(../assets/street/tape-3.webp) center/100% 100% no-repeat;transform:rotate(-3deg);pointer-events:none}
@keyframes pop{from{opacity:0;transform:scale(.8) rotate(-3deg) translateY(14px)}to{opacity:1;transform:none}}
.modal.danger{border-color:#000;box-shadow:8px 8px 0 var(--red),0 0 0 2px #ece4d0 inset;animation:pop .26s cubic-bezier(.2,1.5,.4,1),shake .45s .12s}
.modal.danger h2{color:var(--red)}
@keyframes shake{25%{transform:translateX(-7px)}75%{transform:translateX(7px)}}
.modal h2{margin:12px 0 6px;font-family:var(--bebas);font-weight:400;font-size:38px;line-height:.95;letter-spacing:.03em;color:var(--dark)}
.modal p,.modal .muted,.modal small,.modal .sub{color:var(--dark2)}
.modal .big{font-size:64px;line-height:1.1;display:block}
.modal .btn{margin-top:12px}
.modal .btn:first-of-type{margin-top:4px}
.modal .green{color:#12994a}.modal .pink{color:#d41e78}.modal .red{color:#c81a2e}.modal .gold{color:#a87800}.modal .blue{color:#1a7fa8}
.modal .card{background:var(--paper2) var(--tex-paper) center/cover;background-blend-mode:multiply;border-color:#000;color:var(--dark)}
.modal .card h2,.modal .card h3{color:var(--dark)}
.modal .art.huge{margin:0 auto 6px}
.toast{position:fixed;z-index:80;bottom:98px;left:50%;transform:translateX(-50%) rotate(-1deg);max-width:92%;padding:12px 18px 10px;text-align:center;font-family:var(--marker);font-size:15px;color:var(--dark);
  background:#ffe86b;border:2px solid #000;box-shadow:5px 5px 0 #000;animation:toastIn .26s cubic-bezier(.2,1.4,.4,1)}
@keyframes toastIn{from{opacity:0;transform:translate(-50%,16px) rotate(4deg) scale(.9)}to{opacity:1;transform:translate(-50%,0) rotate(-1deg)}}
body:has(.overlay) .toast{bottom:auto;top:16px}
.toast.bad{background:#ff7a8a;color:#2a0509}
.float{position:fixed;z-index:90;pointer-events:none;font-family:var(--bebas);font-size:34px;text-shadow:2px 2px 0 #000;animation:floatUp 1s ease-out forwards}
@keyframes floatUp{to{transform:translateY(-80px) scale(1.15);opacity:0}}

/* ---------- misc components ---------- */
.inventory{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.inventory .card{margin:0;padding:12px}
.ending{text-align:center;padding:25px 0}
.ending .trophy{display:flex;justify-content:center;filter:drop-shadow(5px 8px 0 #000a);animation:floaty 4s ease-in-out infinite}
@keyframes floaty{50%{transform:translateY(-5px)}}
.spark{width:100%;height:60px;display:block}
.chip{display:inline-block;padding:3px 8px 1px;font-family:var(--type);font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--paper);background:#25232e;border:2px solid #4a4658;transform:rotate(-1deg)}
.chip.green{background:#0f3a22;color:var(--green);border-color:var(--green)}
.chip.red{background:#3a131c;color:#ff8d9a;border-color:var(--red)}
.chip.gold{background:#3d3208;color:var(--gold);border-color:var(--gold)}
.chip.live{animation:livepulse 1.2s ease-in-out infinite}
@keyframes livepulse{50%{transform:rotate(1deg) scale(1.08)}}
.banner{display:flex;flex-direction:column;justify-content:flex-end;min-height:100px;margin-bottom:16px;padding:14px;position:relative;overflow:hidden;
  background:linear-gradient(135deg,#3a2a6a,#143a5a);border:3px solid var(--paper);background-size:cover;background-position:center;box-shadow:var(--shadow);transform:rotate(-.5deg)}
.banner::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 30%,#0b0b10dd);pointer-events:none}
.banner>*{position:relative;z-index:1}
.banner.tall{min-height:124px}
.banner h1,.banner .sub{text-shadow:2px 2px 0 #000}
.final-day{margin-bottom:14px;padding:11px 13px 9px;font-family:var(--marker);font-size:15px;color:var(--dark);background:var(--gold);border:3px solid #000;box-shadow:4px 4px 0 #000;transform:rotate(-.6deg)}
.row{display:flex;align-items:center;gap:10px;margin:9px 0}
.row .grow small{display:block}
.row .grow{min-width:0}
.row .btn{width:auto;flex:none;min-width:88px;margin:0}
.lvl{font-family:var(--type);font-size:11px;color:var(--ink3)}
.score-row{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:9px 0;border-bottom:2px dashed #ffffff1c;font-size:13px}
.score-row:last-child{border-bottom:0}
.field{width:100%;margin-top:4px;padding:13px;color:var(--dark);font:inherit;background:var(--paper) var(--tex-paper) center/cover;background-blend-mode:multiply;border:3px solid #000;box-shadow:inset 3px 3px 0 #0003,3px 3px 0 #000;transition:box-shadow .12s}
.field:focus{outline:none;box-shadow:inset 3px 3px 0 #0003,3px 3px 0 var(--green),0 0 0 3px #000}
.addr{margin:8px 0;padding:11px;font-family:ui-monospace,Consolas,monospace;font-size:12px;word-break:break-all;color:var(--paper);background:#0a0a0e;border:2px dashed var(--blue)}

/* ---------- tournament lobby cards: ticket stubs ---------- */
.tcard{--c:var(--blue)}
.tcard::before{background:url(../assets/street/tape-1.webp) center/100% 100% no-repeat}
.tcard{border-color:var(--c)}
.tcard.t2{--c:#ff3d9a}.tcard.t5{--c:#d99a5a}.tcard.t10{--c:#d6dbe6}.tcard.t25{--c:#ffd400}.tcard.t50{--c:#b46bff}.tcard.tfree{--c:#3dff86}
.tcard.mine{box-shadow:5px 5px 0 var(--green)}
.tcard .head{display:flex;align-items:center;gap:12px}
.emblem{display:grid;place-items:center;flex:none;width:54px;height:54px;font-size:26px;position:relative;background:var(--c);border:3px solid #000;box-shadow:3px 3px 0 #000;transform:rotate(-3deg)}
.emblem .art{width:36px;height:36px;font-size:26px}
.tcard .pot{font-family:var(--type);font-size:12px;color:var(--ink2);margin:8px 0 2px;line-height:1.5}
.tcard .pot b{color:var(--gold);font-weight:400}
.meta{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.meta .chip{display:inline-flex;align-items:center;gap:4px}

@media(min-width:700px){.shell{box-shadow:0 0 0 3px #000,0 0 120px #000b}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}