/* The marketplace (docs/FRONTEND_SPEC.md §4), from design/mockups/marketplace.html — unchanged. */
:root{
  --page:#cfe8f6; --card:#fffaf0; --ink:#2e2748; --muted:#5f5879; --edge:#2e2748;
  --gold:#f5b72f; --gold-ink:#3a2a05; --mint:#23845a; --coral:#ff7a6b; --red:#c2412f;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){--page:#1c2244;--card:#241f3b;--ink:#f7f2ff;--muted:#bdb5da;--edge:#0f0c1c;--mint:#6ee0a6;--red:#ff8a7a}
}
:root[data-theme="dark"]{--page:#1c2244;--card:#241f3b;--ink:#f7f2ff;--muted:#bdb5da;--edge:#0f0c1c;--mint:#6ee0a6;--red:#ff8a7a}
*,*::before,*::after{box-sizing:inherit}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
body{margin:0;background:var(--page);color:var(--ink);font-family:Fredoka,"Trebuchet MS","Segoe UI",system-ui,sans-serif}
a{color:inherit}
.card{background:var(--card);border:2px solid var(--edge);border-radius:20px;box-shadow:0 5px 0 var(--edge)}
.wrap{max-width:1180px;margin:0 auto;padding:0 20px}
button{font:inherit}
:focus-visible{outline:3px solid var(--coral);outline-offset:3px}

header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 0}
.logo{display:flex;align-items:center;gap:10px;font-size:24px;font-weight:700;text-decoration:none}
nav{display:flex;gap:4px;padding:4px}
nav a{display:flex;align-items:center;min-height:44px;padding:0 16px;border-radius:14px;text-decoration:none;font-weight:500}
nav a[aria-current="page"]{background:var(--gold);color:var(--gold-ink);font-weight:600}

.hero{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:24px;align-items:end;padding:22px 0 8px}
.hero h1{margin:0;font-size:clamp(42px,6.5vw,68px);line-height:1;font-weight:700;letter-spacing:-0.5px}
.hero p{margin:12px 0 0;font-size:19px;color:var(--muted);max-width:44ch;line-height:1.45}
.me{padding:18px 20px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.me div{display:flex;flex-direction:column;gap:2px}
.me span{font-size:13px;color:var(--muted)}
.me b{font-size:21px;font-weight:600}
.cap{grid-column:1/-1}
.capbar{height:12px;border-radius:99px;border:2px solid var(--edge);background:color-mix(in srgb,var(--muted) 15%,transparent);overflow:hidden;margin-top:6px}
.capbar i{display:block;height:100%;background:var(--mint);transition:width .6s ease}

.how{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:26px 0 8px}
.how li{list-style:none;display:flex;gap:14px;align-items:center;padding:14px 16px}
.how ol{display:contents}
.step{flex:none;width:40px;height:40px;border-radius:12px;border:2px solid var(--edge);background:var(--gold);color:var(--gold-ink);display:grid;place-items:center;font-weight:700;font-size:18px}
.how b{display:block;font-size:17px}.how span{font-size:14px;color:var(--muted)}

.bar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:26px 0 16px;flex-wrap:wrap}
.filters{display:flex;gap:4px;padding:4px;flex-wrap:wrap}
.filters button{border:0;background:transparent;color:var(--ink);min-height:44px;padding:0 16px;border-radius:14px;font-size:15px;font-weight:500;cursor:pointer}
.filters button[aria-pressed="true"]{background:var(--gold);color:var(--gold-ink);font-weight:600}
.sort{display:flex;align-items:center;gap:8px;font-size:15px;color:var(--muted)}
.sort select{font:inherit;min-height:44px;border-radius:14px;border:2px solid var(--edge);background:var(--card);color:var(--ink);padding:0 12px}

.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:20px;padding-bottom:10px}
.item{display:flex;flex-direction:column;overflow:hidden;cursor:pointer;text-align:left;padding:0;color:var(--ink);transition:transform .15s}
.item:hover{transform:translateY(-3px)}
.photo{position:relative;aspect-ratio:4/3;border-bottom:2px solid var(--edge);display:grid;place-items:center;overflow:hidden}
.photo img{width:100%;height:100%;object-fit:contain;display:block}
.photo img.art{padding:6%;filter:drop-shadow(0 8px 8px rgba(46,39,72,.18))}
.photo .ph{font-size:14px;color:var(--gold-ink);opacity:.7}
.ribbon{position:absolute;top:10px;left:10px;font-size:13px;font-weight:600;padding:3px 10px;border-radius:99px;border:2px solid var(--edge);background:var(--card);color:var(--ink)}
.ribbon.ltd{background:var(--coral);color:#2b0c08}
.ribbon.own{left:auto;right:10px;background:var(--mint);color:#fff}
.meta{padding:14px 16px 16px;display:flex;flex-direction:column;gap:8px;flex:1}
.meta h3{margin:0;font-size:20px;font-weight:600}
.meta .desc{font-size:14px;color:var(--muted);line-height:1.4;flex:1}
.row{display:flex;justify-content:space-between;align-items:center;gap:8px}
.price{font-weight:600;font-size:16px;white-space:nowrap}
.gain{white-space:nowrap;font-weight:600;font-size:15px;padding:3px 10px;border-radius:10px;border:2px solid var(--edge)}
.gain.rent{background:#c9f2dc;color:#0f4a2f}.gain.score{background:#e6ddff;color:#2e2060}

.ribbon.rar{font-weight:700}
.rar.common{background:#eceaf2;color:#3d3752}.rar.rare{background:#bfe0ff;color:#0f3a66}.rar.epic{background:#dccbff;color:#3a1f7a}
.rar.legendary{background:linear-gradient(135deg,#ffe08a,#f5b72f);color:#4a3200}
.rar.mythic{background:linear-gradient(135deg,#9be8ff,#b99cff,#ff8fd1);color:#2a1450}
.item.r-legendary{border-color:#c98a10;box-shadow:0 5px 0 #8a5b00,0 0 0 3px rgba(245,183,47,.35)}
.item.r-mythic{border:2px solid transparent;background:linear-gradient(var(--card),var(--card)) padding-box,conic-gradient(from var(--ang,0deg),#9be8ff,#b99cff,#ff8fd1,#ffe08a,#9be8ff) border-box;box-shadow:0 5px 0 #3a2a70,0 0 18px rgba(155,120,255,.35)}
@property --ang{syntax:'<angle>';initial-value:0deg;inherits:false}
@media (prefers-reduced-motion:no-preference){.item.r-mythic{animation:spinb 5s linear infinite}@keyframes spinb{to{--ang:360deg}}}
.capline{font-size:13px;font-weight:600;color:#8a5b00;background:rgba(245,183,47,.18);border-radius:8px;padding:3px 8px;align-self:flex-start}
.box.sig{border-style:solid;border-width:2px}.box.sig.legendary{border-color:#e0a13b;background:rgba(245,183,47,.1)}.box.sig.mythic{border-color:#9b7bff;background:rgba(155,120,255,.1)}
.vault{margin:34px 0 10px;padding:26px 24px 28px;border-radius:28px;border:2px solid #0d0f1c;box-shadow:0 6px 0 #0d0f1c;color:#f3efff;
  background:radial-gradient(900px 300px at 15% -10%,rgba(95,227,200,.18),transparent 60%),radial-gradient(800px 320px at 95% 0%,rgba(176,108,255,.22),transparent 60%),
  repeating-linear-gradient(45deg,rgba(255,255,255,.025) 0 12px,transparent 12px 24px),#1b1f36}
.vhead{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;margin-bottom:22px}
.vt{margin:0;font-family:"Lilita One",Fredoka,sans-serif;font-weight:400;font-size:clamp(40px,6vw,60px);letter-spacing:1.5px;line-height:1;
  background:linear-gradient(180deg,#fff3b0 0%,#ffcc4d 45%,#f08a1c 100%);-webkit-background-clip:text;background-clip:text;color:transparent;
  -webkit-text-stroke:2px #3a1e05;filter:drop-shadow(0 4px 0 #0d0f1c)}
.vsub{margin:8px 0 0;max-width:52ch;color:#c9c3e6;font-size:16px;line-height:1.45}
.vstats{display:flex;gap:8px;flex-wrap:wrap}
.vpill{display:flex;flex-direction:column;align-items:flex-start;gap:0;padding:8px 14px;border-radius:14px;background:#12152a;border:2px solid #2d3360}
.vpill b{font-family:"Lilita One",Fredoka,sans-serif;font-weight:400;font-size:22px;color:#fff;letter-spacing:.5px}.vpill span{font-size:12px;color:#9d97c2}
.vgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.vc{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:6px;text-align:left;cursor:pointer;color:inherit;padding:0;border-radius:22px;overflow:hidden;
  background:#171a30;border:3px solid var(--rc);box-shadow:0 5px 0 #0d0f1c,0 0 24px -4px var(--rg),inset 0 0 0 2px rgba(255,255,255,.05);transition:transform .15s}
.vc:hover{transform:translateY(-3px)}
.vc.legendary{--rc:#ffcc4d;--rg:rgba(255,204,77,.55);--r1:#ffcc4d;--r2:#f08a1c}
.vc.mythic{--rc:#c77dff;--rg:rgba(199,125,255,.65);--r1:#5fe3ff;--r2:#ff5fd2}
.vc.mythic{border-color:transparent;background:linear-gradient(#171a30,#171a30) padding-box,conic-gradient(from var(--ang,0deg),#5fe3ff,#b06cff,#ff5fd2,#ffcc4d,#5fe3ff) border-box}
@media (prefers-reduced-motion:no-preference){.vc.mythic{animation:spinb 5s linear infinite}}
.vart{position:relative;min-height:230px;display:grid;place-items:center;background:radial-gradient(circle at 50% 60%,var(--rg),transparent 62%)}
.vart::after{content:"";position:absolute;left:14%;right:14%;bottom:16px;height:18px;border-radius:50%;background:rgba(0,0,0,.35);filter:blur(6px)}
.vart img{position:relative;z-index:1;width:100%;height:100%;max-height:250px;object-fit:contain;filter:drop-shadow(0 10px 14px rgba(0,0,0,.45))}
.vtag{position:absolute;top:12px;left:12px;z-index:2;font-family:"Lilita One",Fredoka,sans-serif;font-size:15px;letter-spacing:1.5px;padding:4px 12px;border-radius:10px;color:#1b1030;
  background:linear-gradient(90deg,var(--r1),var(--r2));border:2px solid #0d0f1c;box-shadow:0 3px 0 #0d0f1c}
.vinfo{padding:18px 18px 16px 4px;display:flex;flex-direction:column;gap:10px}
.vname{margin:0;font-family:"Lilita One",Fredoka,sans-serif;font-weight:400;font-size:28px;letter-spacing:.5px;color:#fff;line-height:1.05;text-shadow:0 3px 0 #0d0f1c}
.vperks{display:flex;gap:6px;flex-wrap:wrap}
.vperk{font-size:13px;font-weight:600;padding:4px 9px;border-radius:9px;background:#23284a;border:1.5px solid #3a4180;color:#e8e4ff}
.vperk.g{color:#9ff5c9;border-color:#2f7a5a;background:#173a30}.vperk.c{color:#ffe08a;border-color:#8a6a1c;background:#3a2f12}
.vsig{font-size:14px;line-height:1.4;color:#c9c3e6}
.vsupply{display:flex;flex-direction:column;gap:5px}
.vsupply .lbl{display:flex;justify-content:space-between;font-size:13px;color:#9d97c2}.vsupply .lbl b{color:#fff}
.vmeter{height:10px;border-radius:99px;background:#0f1226;border:1.5px solid #2d3360;overflow:hidden}.vmeter i{display:block;height:100%;background:linear-gradient(90deg,var(--r1),var(--r2))}
.vfoot{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:auto}
.vprice{font-family:"Lilita One",Fredoka,sans-serif;font-size:24px;letter-spacing:.5px;color:#ffe08a;text-shadow:0 2px 0 #0d0f1c}.vprice small{font-family:Fredoka,sans-serif;font-size:13px;color:#9d97c2;margin-left:4px}
.vbtn{font-family:"Lilita One",Fredoka,sans-serif;font-size:16px;letter-spacing:1px;padding:0 16px;min-height:44px;display:inline-flex;align-items:center;border-radius:12px;color:#1b1030;background:linear-gradient(180deg,var(--r1),var(--r2));border:2px solid #0d0f1c;box-shadow:0 3px 0 #0d0f1c}
.vc .owned{position:absolute;top:12px;right:12px;z-index:2;font-size:13px;font-weight:700;background:#2fb57a;color:#fff;border:2px solid #0d0f1c;border-radius:10px;padding:3px 10px}
@media (max-width:980px){.vgrid{grid-template-columns:1fr}}
@media (max-width:560px){.vc{grid-template-columns:1fr}.vinfo{padding:4px 16px 16px}.vart{min-height:200px}}
/* premium dialog */
.sheet.prem{background:#1b1f36;color:#f3efff;border-color:#0d0f1c}
.sheet.prem .info p,.sheet.prem .box ul{color:#c9c3e6}.sheet.prem .box{border-color:#3a4180}.sheet.prem .box h4,.sheet.prem .big,.sheet.prem .row span{color:#fff}
.sheet.prem h2{font-family:"Lilita One",Fredoka,sans-serif;font-weight:400;letter-spacing:1px;background:linear-gradient(180deg,#fff3b0,#ffcc4d 50%,#f08a1c);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-stroke:1.5px #3a1e05}
.sheet.prem.mythic h2{background:linear-gradient(90deg,#9ff0ff,#d7a6ff,#ff9ae4);-webkit-background-clip:text;background-clip:text;-webkit-text-stroke:1.5px #2a1450}
.sheet.prem .stage3d{border-color:#0d0f1c}.sheet.prem .okline{color:#9ff5c9}.sheet.prem .warn{color:#ff9a8a}.sheet.prem .box.sig p{color:#f3efff!important}
.sheet.prem .stage3d .hint{background:#23284a;color:#e8e4ff;border-color:#3a4180}
.sheet.prem .ghost{color:#f3efff;border-color:#3a4180}.sheet.prem .chip{border-color:#0d0f1c}

/* ===== full dark game theme ===== */
:root{--page:#121528;--card:#1b1f36;--ink:#f3efff;--muted:#a8a2cc;--edge:#0d0f1c;--mint:#7fe9b8;--red:#ff8a7a}
body{background:radial-gradient(1200px 500px at 20% -10%,rgba(95,227,200,.14),transparent 60%),radial-gradient(1000px 500px at 100% 0%,rgba(176,108,255,.16),transparent 60%),repeating-linear-gradient(45deg,rgba(255,255,255,.02) 0 12px,transparent 12px 24px),var(--page)}
.card{box-shadow:0 5px 0 var(--edge),0 0 0 1px rgba(255,255,255,.04) inset}
.logo{color:#fff}
nav a[aria-current="page"]{background:linear-gradient(180deg,#ffe08a,#f5b72f)}
.hero h1{font-family:"Lilita One",Fredoka,sans-serif;font-weight:400;letter-spacing:1.5px;background:linear-gradient(180deg,#fff3b0 0%,#ffcc4d 45%,#f08a1c 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-stroke:2px #3a1e05;filter:drop-shadow(0 4px 0 #0d0f1c)}
.me b{font-family:"Lilita One",Fredoka,sans-serif;font-weight:400;letter-spacing:.5px;color:#fff}
.capbar{background:#0f1226;border-color:#2d3360}.capbar i{background:linear-gradient(90deg,#5fe3c8,#9ff5c9)}
.step{background:linear-gradient(180deg,#ffe08a,#f5b72f)}
.filters button[aria-pressed="true"]{background:linear-gradient(180deg,#ffe08a,#f5b72f)}
.sort select{background:#1b1f36;color:#fff;border-color:#2d3360}
.vault{margin-top:26px}
.item{--rc:#3a4180;--rg:rgba(95,227,200,.35);--r1:#5fe3c8;--r2:#2fb57a;border:3px solid var(--rc);box-shadow:0 5px 0 #0d0f1c,0 0 22px -6px var(--rg)}
.item.r-common{--rc:#2f8f7a;--rg:rgba(95,227,200,.4);--r1:#5fe3c8;--r2:#2fb57a}
.item.r-rare{--rc:#3f7fd6;--rg:rgba(90,160,255,.5);--r1:#8fd0ff;--r2:#3f7fd6}
.item.r-epic{--rc:#9b5cff;--rg:rgba(176,108,255,.55);--r1:#d7a6ff;--r2:#7a3ff0}
.item.r-legendary{--rc:#ffcc4d;--rg:rgba(255,204,77,.55);--r1:#ffcc4d;--r2:#f08a1c;box-shadow:0 5px 0 #0d0f1c,0 0 22px -4px var(--rg)}
.photo{background:radial-gradient(circle at 50% 62%,var(--rg),transparent 62%),#141730!important;border-bottom:2px solid #0d0f1c}
.photo::after{content:"";position:absolute;left:18%;right:18%;bottom:10px;height:14px;border-radius:50%;background:rgba(0,0,0,.4);filter:blur(6px)}
.photo img{position:relative;z-index:1;filter:drop-shadow(0 8px 10px rgba(0,0,0,.45))}
.ribbon{background:#12152a;color:#e8e4ff;border-color:#0d0f1c}
.ribbon.rar{color:#1b1030;background:linear-gradient(90deg,var(--r1),var(--r2));font-family:"Lilita One",Fredoka,sans-serif;font-weight:400;letter-spacing:1px;font-size:13px}
.ribbon.ltd{background:#ff5fd2;color:#2b0c30}
.meta h3{font-family:"Lilita One",Fredoka,sans-serif;font-weight:400;letter-spacing:.5px;color:#fff;font-size:22px}
.price{font-family:"Lilita One",Fredoka,sans-serif;font-weight:400;font-size:19px;color:#ffe08a;letter-spacing:.5px}
.gain{border-color:#0d0f1c}.gain.rent{background:#173a30;color:#9ff5c9}.gain.score{background:#2a2160;color:#d7c8ff}
.capline{background:#3a2f12;color:#ffe08a}
.note{color:#8f89b5}
dialog::backdrop{background:rgba(6,8,20,.7)}
.sheet{background:#1b1f36;color:#f3efff;border-color:#0d0f1c}
.info p,.box ul{color:#c9c3e6}.box{border-color:#3a4180}.box h4,.big,.row span{color:#fff}
.info h2{font-family:"Lilita One",Fredoka,sans-serif;font-weight:400;letter-spacing:1px;color:#fff;text-shadow:0 3px 0 #0d0f1c}
.stage3d{border-color:#0d0f1c}.stage3d .hint{background:#23284a;color:#e8e4ff;border-color:#3a4180}
.okline{color:#9ff5c9}.warn{color:#ff9a8a}.box.sig p{color:#f3efff!important}.ghost{color:#f3efff;border-color:#3a4180}
.chip{border-color:#0d0f1c;background:#23284a;color:#e8e4ff}
.close{background:#23284a;color:#fff;border-color:#0d0f1c}
.check{color:#f3efff}
.btn{background:linear-gradient(180deg,#ffe08a,#f5b72f)}
.done a{color:#1b1030}
.note{text-align:center;color:var(--muted);font-size:14px;line-height:1.5;padding:26px 0 60px}

dialog{border:0;padding:0;background:transparent;max-width:min(1000px,calc(100vw - 24px));width:100%;color:var(--ink)}
dialog:focus,dialog:focus-visible,.sheet:focus-visible{outline:none}
dialog::backdrop{background:rgba(24,20,48,.45)}
.sheet{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);overflow:hidden;border-radius:26px;box-shadow:0 7px 0 var(--edge)}
.stage3d{position:relative;min-height:440px;border-right:2px solid var(--edge);cursor:grab;touch-action:none}
.stage3d canvas{position:absolute;inset:0;width:100%!important;height:100%!important}
.stage3d img.art{position:absolute;inset:6%;width:88%;height:88%;object-fit:contain;filter:drop-shadow(0 12px 10px rgba(46,39,72,.18))}
.stage3d .hint{position:absolute;left:14px;bottom:12px;font-size:13px;background:var(--card);border:2px solid var(--edge);border-radius:99px;padding:3px 10px}
.info{padding:26px 26px 22px;display:flex;flex-direction:column;gap:14px;max-height:min(84vh,720px);overflow:auto}
.info h2{margin:0;font-size:34px;font-weight:700;line-height:1.1}
.chips{display:flex;gap:8px;flex-wrap:wrap}
.chip{font-size:13px;font-weight:600;padding:3px 10px;border-radius:99px;border:2px solid var(--edge)}
.info p{margin:0;font-size:16px;line-height:1.5;color:var(--muted)}
.box{border:2px dashed var(--muted);border-radius:16px;padding:14px 16px}
.box h4{margin:0 0 8px;font-size:15px}
.box ul{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:6px;font-size:15px;line-height:1.4}
.big{font-size:22px;font-weight:700}
.btn{min-height:54px;padding:0 22px;border-radius:16px;border:2px solid var(--edge);background:var(--gold);color:var(--gold-ink);box-shadow:0 4px 0 var(--edge);font-weight:600;font-size:17px;cursor:pointer;width:100%}
.btn:active{transform:translateY(3px);box-shadow:0 1px 0 var(--edge)}
.btn:disabled{opacity:.45;cursor:not-allowed}
.ghost{min-height:48px;border:2px solid var(--edge);background:transparent;color:var(--ink);border-radius:14px;padding:0 16px;font-weight:500;cursor:pointer}
.close{position:absolute;right:14px;top:14px;width:44px;height:44px;border-radius:12px;border:2px solid var(--edge);background:var(--card);color:var(--ink);font-size:22px;cursor:pointer;z-index:2}
.warn{color:var(--red);font-weight:600;font-size:15px}
.okline{color:var(--mint);font-weight:600;font-size:15px}
.check{display:flex;gap:10px;align-items:flex-start;font-size:15px;line-height:1.4}
.check input{width:22px;height:22px;margin-top:1px;accent-color:#f5b72f}
.spinner{width:48px;height:48px;border-radius:50%;border:6px solid color-mix(in srgb,var(--gold) 30%,transparent);border-top-color:var(--gold);animation:spin .9s linear infinite;margin:6px 0}
@keyframes spin{to{transform:rotate(360deg)}}
.done{display:flex;flex-direction:column;gap:12px}
.done a{text-decoration:none;text-align:center;display:flex;align-items:center;justify-content:center}
@media (max-width:860px){
  .hero{grid-template-columns:1fr}
  .how{grid-template-columns:1fr}
  .sheet{grid-template-columns:1fr}
  .stage3d{min-height:280px;border-right:0;border-bottom:2px solid var(--edge)}
  .info{max-height:none}
}
@media (max-width:640px){header{flex-direction:column;align-items:stretch}nav{justify-content:space-between}nav a{padding:0 12px}.me{grid-template-columns:1fr 1fr}}
@media (prefers-reduced-motion:reduce){.item{transition:none}.spinner{animation:none}.capbar i{transition:none}}

/* ---- additions for the real page (not visual changes) ---- */
.me .signin{grid-column:1/-1;font-size:15px;color:var(--muted)}
.me .rentline{grid-column:1/-1;margin:0;font-size:15px;font-weight:500}.me .rentline b{font-family:"Lilita One",Fredoka,sans-serif;font-weight:400;color:#ffcc4d;letter-spacing:.3px}.me .rentline[hidden]{display:none}
.me .signin a{color:#ffe08a;font-weight:600}
.done code.sig{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;overflow-wrap:anywhere;user-select:all}

/* ---------- after a burn: the celebration (web/js/celebrate.js) and the congrats ---------- */
.burnedTotal{margin:14px 0 0!important;font-size:16px!important;color:var(--muted)}
.burnedTotal b{font-family:"Lilita One",Fredoka,sans-serif;font-weight:400;font-size:22px;letter-spacing:.5px;color:#ffcc4d;margin:0 4px}
.burnedTotal[hidden]{display:none}
.stage3d .burnCount{position:absolute;transform:translate(0,-50%);pointer-events:none;display:flex;flex-direction:column;gap:2px;text-shadow:0 2px 0 #0d0f1c}
.stage3d .burnCount b{font-family:"Lilita One",Fredoka,sans-serif;font-weight:400;font-size:34px;letter-spacing:1px;color:#ffcc4d;font-variant-numeric:tabular-nums}
.stage3d .burnCount span{font-size:14px;font-weight:600;color:#ffe3a3}
.stage3d .burnCount.done{align-items:center;transform:translate(-50%,-50%);transition:left .45s ease-out,top .45s ease-out,transform .45s ease-out,opacity .6s 2.2s;opacity:0}
.stage3d .burnCount.done b{display:none}.stage3d .burnCount.done span{font-size:16px;color:#fff}
.stage3d .skipHint{position:absolute;right:12px;bottom:12px;font-size:13px;color:#c9c3e6;opacity:.8;pointer-events:none}
.stage3d .burnFlash{position:absolute;inset:0;background:#fff;opacity:.95;pointer-events:none;transition:opacity .45s ease-out}
.stage3d .burnFlash.go{opacity:0}
.stage3d .burst{position:absolute;left:50%;top:55%;width:0;height:0;pointer-events:none}
.stage3d .burst i{position:absolute;width:9px;height:14px;border-radius:2px;animation:burstFly 1.6s cubic-bezier(.15,.7,.3,1) forwards}
@keyframes burstFly{0%{transform:translate(0,0) rotate(0);opacity:1}80%{opacity:1}100%{transform:translate(var(--dx),calc(var(--dy) + 140px)) rotate(var(--r));opacity:0}}
.sheet.shake{animation:sheetShake .45s linear}
@keyframes sheetShake{0%,100%{transform:translate(0,0)}20%{transform:translate(-6px,3px)}40%{transform:translate(5px,-4px)}60%{transform:translate(-4px,-2px)}80%{transform:translate(3px,3px)}}
.won{display:flex;flex-direction:column;gap:12px}
.won.in{animation:wonIn .5s ease-out}
@keyframes wonIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.won.fade{animation:wonFade .6s ease-out}
@keyframes wonFade{from{opacity:0}to{opacity:1}}
.won .wow{margin:0;font-family:"Lilita One",Fredoka,sans-serif;font-weight:400;font-size:clamp(44px,6vw,64px);letter-spacing:1.5px;line-height:1;
  background:linear-gradient(180deg,#fff3b0,#ffcc4d 50%,#f08a1c);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-stroke:1.5px #3a2a05;text-shadow:none}
.won .lead{font-size:22px;margin:0;color:#fff}
.won .lead b{color:#ffcc4d}
.won p{margin:0;line-height:1.45}
.won .tx{font-size:15px}
.won .tx a{color:#ffe08a}
.won .tx code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:14px}
.won .acts{display:flex;flex-wrap:wrap;gap:10px;margin-top:4px}
.won .acts .btn,.won .acts .ghost{flex:1 1 180px;display:flex;align-items:center;justify-content:center;text-decoration:none}
.shareBox{display:flex;flex-direction:column;gap:10px;margin-top:6px}
.shareBox[hidden]{display:none}
.shareImg{width:100%;height:auto;border-radius:14px;border:2px solid #3a4180}
.shareBox .fine{font-size:13px;color:#a8a2cc}
@media (prefers-reduced-motion:reduce){.sheet.shake{animation:none}.won.in{animation:none}.stage3d .burst{display:none}}

/* Start rent: the one step after building. */
.box.startRent{border-color:#f5b72f}.box.startRent p{margin:6px 0 12px}.box.startRent .btn{width:100%}.okline.rentOn{font-weight:600}