/* BTC City (ronde 10) */

  .bcity{--card:rgba(255,249,242,.9);--ink:#2b2433;--muted:#7a6a70;--accent:#d97a1a;--line:rgba(110,70,50,.14);--btn:#fff;--btn-on:#2b2433;--btn-on-ink:#fff;--shadow:0 10px 30px rgba(80,40,60,.18);
    --title:"Poppins","Segoe UI",sans-serif;--mono:"IBM Plex Mono",ui-monospace,Consolas,monospace;
    position:relative;height:100%;overflow:hidden;color:var(--ink);background:#e9e2d8;}
  .bcity[data-theme="pastel"]{--card:rgba(255,255,255,.92);--ink:#2d2a3e;--muted:#7a7590;--accent:#f08a1a;--line:rgba(120,90,170,.14);--btn-on:#8f7bff;--btn-on-ink:#fff;--shadow:0 10px 30px rgba(120,80,170,.16);background:#e8eef8;}
  .bcity[data-theme="gallery"]{--card:rgba(255,255,255,.82);--ink:#1f1f22;--muted:#77777a;--accent:#b8860b;--line:rgba(0,0,0,.08);--btn-on:#1f1f22;--btn-on-ink:#fff;--shadow:0 10px 30px rgba(0,0,0,.08);
    --title:"Cormorant Garamond",Georgia,serif;background:#ecece9;}
  .bcity canvas#view{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none;cursor:grab;}
  .bcity canvas#view.dragging{cursor:grabbing;}
  .bcity .card{background:var(--card);border-radius:16px;box-shadow:var(--shadow);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);}

  .bcity .hud{position:absolute;left:16px;top:16px;width:min(290px, calc(100% - 32px));padding:16px 18px 14px;display:grid;gap:4px;}
  .bcity .eyebrow{font-size:10.5px;font-weight:600;text-transform:uppercase;letter-spacing:.2em;color:var(--muted);}
  .bcity h1{margin:0;font-family:var(--title);font-size:30px;line-height:1.05;font-weight:700;letter-spacing:-.01em;}
  .bcity[data-theme="gallery"] h1{font-weight:500;font-size:38px;}
  .bcity .date{font-family:var(--mono);font-size:15px;font-weight:600;color:var(--accent);margin-top:2px;}
  .bcity .stats{display:grid;grid-template-columns:auto 1fr;gap:3px 12px;font-size:12.5px;margin:8px 0 0;}
  .bcity .stats dt{color:var(--muted);}
  .bcity .stats dd{margin:0;text-align:right;font-family:var(--mono);font-variant-numeric:tabular-nums;}
  .bcity .bar{height:6px;background:var(--line);border-radius:3px;overflow:hidden;margin-top:8px;}
  .bcity .bar span{display:block;height:100%;background:linear-gradient(90deg,#f7931a,#ffcc66);border-radius:3px;}
  .bcity .barlbl{display:flex;justify-content:space-between;font-size:10.5px;color:var(--muted);margin-top:3px;font-family:var(--mono);}
  .bcity #clock{display:block;width:100%;max-width:230px;aspect-ratio:1;margin:8px auto 0;}

  .bcity .looks{position:absolute;left:50%;top:16px;transform:translateX(-50%);display:flex;align-items:center;gap:6px;padding:6px;max-width:calc(100% - 32px);}
  .bcity .looks > span{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.14em;color:var(--muted);padding:0 6px 0 8px;}
  .bcity .looks button{display:flex;align-items:center;gap:8px;}
  .bcity .swatch{width:14px;height:14px;border-radius:50%;flex:none;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12);}

  .bcity .legend{position:absolute;right:16px;top:16px;width:min(300px, calc(100% - 32px));padding:14px 16px;max-height:calc(100% - 250px);overflow:auto;}
  .bcity .legend summary{cursor:pointer;font-weight:600;font-size:12px;letter-spacing:.12em;text-transform:uppercase;list-style:none;display:flex;justify-content:space-between;gap:8px;color:var(--muted);}
  .bcity .legend summary::-webkit-details-marker{display:none;}
  .bcity .legend summary::after{content:"–";}
  .bcity .legend:not([open]) summary::after{content:"+";}
  .bcity .groups{display:grid;gap:8px;margin-top:10px;}
  .bcity .grp{padding:3px 6px;border-radius:8px;}
  .bcity .grp .head{display:grid;grid-template-columns:10px 1fr auto;gap:8px;align-items:center;font-size:12.5px;font-weight:600;}
  .bcity .grp .head i{width:10px;height:10px;border-radius:50%;}
  .bcity .num{font-family:var(--mono);font-weight:500;font-variant-numeric:tabular-nums;}
  .bcity .subs{display:grid;gap:1px;margin:2px 0 0 18px;}
  .bcity .sub{display:grid;grid-template-columns:1fr auto;gap:8px;font-size:11.2px;color:var(--muted);}
  .bcity .grp.hit{animation:bchit .6s ease-out;}
  @keyframes bchit{0%{background:rgba(247,147,26,.2);}100%{background:transparent;}}
  .bcity .note{margin:8px 0 0;font-size:11px;color:var(--muted);line-height:1.45;}

  .bcity .timeline{position:absolute;left:16px;right:16px;bottom:16px;padding:10px 16px 8px;}
  .bcity .tlrow{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center;justify-content:space-between;}
  .bcity .btns{display:flex;flex-wrap:wrap;gap:4px;max-width:100%;}
  .bcity button{font:inherit;font-size:12px;color:var(--ink);background:var(--btn);border:1px solid var(--line);border-radius:999px;padding:6px 12px;cursor:pointer;}
  .bcity button:hover{border-color:var(--muted);}
  .bcity button[aria-pressed="true"]{background:var(--btn-on);border-color:var(--btn-on);color:var(--btn-on-ink);}
  .bcity button:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
  .bcity .tlhint{font-size:11px;color:var(--muted);}
  .bcity .chartwrap{position:relative;height:60px;margin-top:22px;}
  .bcity .chartwrap canvas{position:absolute;inset:0;width:100%;height:100%;display:block;border-radius:6px;}
  .bcity .chartwrap input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;}
  .bcity .chartwrap:focus-within{outline:2px solid var(--accent);outline-offset:3px;border-radius:6px;}
  .bcity .playhead{position:absolute;top:-6px;bottom:-4px;width:2px;background:var(--ink);pointer-events:none;transform:translateX(-1px);}
  .bcity .playhead::before{content:"";position:absolute;top:-5px;left:-4px;width:10px;height:10px;border-radius:50%;background:var(--ink);}
  .bcity .mk{position:absolute;top:-20px;transform:translateX(-50%);font-family:var(--mono);font-size:10px;color:var(--accent);white-space:nowrap;pointer-events:none;}
  .bcity .ev{position:absolute;bottom:-3px;width:6px;height:6px;transform:translateX(-50%) rotate(45deg);background:var(--muted);pointer-events:none;}
  .bcity .axis{position:relative;height:16px;margin-top:6px;font-family:var(--mono);font-size:10px;color:var(--muted);}
  .bcity .axis span{position:absolute;transform:translateX(-50%);}

  .bcity .toast{position:absolute;left:50%;top:78px;transform:translate(-50%,-8px);opacity:0;transition:opacity .35s, transform .35s;padding:10px 18px;text-align:center;pointer-events:none;max-width:min(460px, calc(100% - 32px));}
  .bcity .toast.show{opacity:1;transform:translate(-50%,0);}
  .bcity .toast .t1{font-weight:700;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);}
  .bcity .toast .t2{font-size:12.5px;margin-top:2px;}

  @media (max-width:1280px){ .bcity .looks > span{display:none;} .bcity .tlhint{display:none;} }
  @media (max-width:1100px){ .bcity .hud{width:250px;} .bcity #clock{max-width:170px;} }
  @media (max-width:760px){
    .bcity .hud{width:auto;max-width:calc(100% - 150px);padding:10px 14px;gap:0;border-radius:14px;}
    .bcity .hud .eyebrow, .bcity #clock, .bcity .bar, .bcity .barlbl, .bcity .hud .opt, .bcity .hud .opt2{display:none;}
    .bcity h1{font-size:21px;} .bcity[data-theme="gallery"] h1{font-size:26px;}
    .bcity .date{font-size:13px;}
    .bcity .stats{font-size:11.5px;margin-top:4px;gap:1px 10px;}
    .bcity .looks{left:auto;right:16px;transform:none;padding:5px;gap:4px;}
    .bcity .looks button{padding:7px;}
    .bcity .looks .lbl-long{display:none !important;}
    .bcity .legend{top:auto;bottom:calc(var(--tlh, 150px) + 26px);width:auto;max-width:calc(100% - 32px);max-height:45%;padding:10px 14px;}
    .bcity .toast{top:auto;bottom:calc(var(--tlh, 150px) + 76px);}
    .bcity .zoomgrp{display:none !important;}
    .bcity .timeline{padding:8px 12px 6px;}
    .bcity .btns{flex-wrap:nowrap;overflow-x:auto;}
    .bcity .btns button{flex:none;padding:6px 10px;}
  }

.bcity p,.bcity h1,.bcity dl,.bcity dd{margin:0;padding:0;border:0;max-width:none}
.bcity .note{margin-top:8px}
.bcity .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.bcity .looks .lbl-long{all:unset}
