


@font-face { font-family:"JetBrains Mono"; font-style:normal; font-weight:100 900;
             font-display:swap; src:url("fonts/jetbrainsmono-latin.woff2") format("woff2"); }
@font-face { font-family:"Space Grotesk"; font-style:normal; font-weight:100 900;
             font-display:swap; src:url("fonts/spacegrotesk-latin.woff2") format("woff2"); }

:root {
  --bg0:#08090B; --bg1:#0D0F12; --bg2:#14171C; --bg3:#1B1F26;
  
  --panel:rgba(13,15,18,.54); --panel-hi:rgba(20,23,28,.62);
  --panel-thin:rgba(13,15,18,.42);
  --line:rgba(255,255,255,.07); --line2:rgba(255,255,255,.13);
  --text:#E8EBEF; --muted:#7C8590; --faint:#4B525C;
  --acc:#00DC82; --green:#00DC82; --yellow:#F5B544; --red:#FF4D5E; --violet:#BC8CFF;
  --blue:#4C8DFF; --grey:#4F5763; --orange:#FF8A3D;
  --discord:#5865F2;                        
  
  --acc-rgb:0,220,130; --red-rgb:255,77,94; --yellow-rgb:245,181,68; --violet-rgb:188,140,255;
  --grey-rgb:79,87,99; --discord-rgb:88,101,242; --orange-rgb:255,138,61; --blue-rgb:76,141,255;
  --refused:#FF5A6A; --refused-rgb:255,90,106;
  
  --white:#ECEEF1; --ink:#08090B;
  
  --edge:#2A2F37; --shadow:6px 6px 0 var(--edge); --shadow-press:3px 3px 0 var(--edge);
  --shadow-lift:8px 8px 0 var(--edge);      
  --shadow-left:-6px 6px 0 var(--edge);     
  --bd:2px;                                
  
  --t-fast:.12s; --t:.16s; --ease-out:cubic-bezier(.2,.7,.3,1);
  --ui:"Space Grotesk",Inter,system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"JetBrains Mono",ui-monospace,"Cascadia Mono",Consolas,monospace;
  --topbar-h:45px;                         

  
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px; --s6:32px;

  
  
  --fs-hero:clamp(34px,6.4vw,68px); --lh-hero:1.02;
  --fs-display:34px; --lh-display:1.05;   
  --fs-lg:20px;                            
  --fs-lede:19px;                          
  --fs-body:16px;    --lh-body:1.7;
  --fs-ui:13px;
  --fs-micro:11px;   
  --fs-code:13px;
}
* { box-sizing:border-box; scrollbar-width:thin; scrollbar-color:var(--bg2) transparent; }

[hidden] { display:none !important; }
::-webkit-scrollbar { width:8px; height:8px; }
::-webkit-scrollbar-thumb { background:var(--bg2); border:1px solid var(--line); }
::-webkit-scrollbar-track { background:transparent; }
html,body { margin:0; padding:0; height:100dvh; }
body { background:var(--bg0); color:var(--text); font:var(--fs-ui)/1.5 var(--ui);
       overflow:hidden; -webkit-font-smoothing:antialiased; }
::selection { background:rgba(var(--acc-rgb),.22); }
a { color:var(--acc); text-decoration:none; }
a:hover { text-decoration:underline; }
button,input,select,textarea { font:inherit; color:inherit; }
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,
textarea:focus-visible,summary:focus-visible { outline:1px solid var(--acc); outline-offset:1px; }

.sr { position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden;
      clip-path:inset(50%); white-space:nowrap; border:0; }
.mono { font-family:var(--mono); }
.faint { color:var(--faint); }


.micro, th { font:600 var(--fs-micro)/1.4 var(--mono); letter-spacing:.08em;
             text-transform:uppercase; color:var(--muted); }

.note { font:var(--fs-micro)/1.55 var(--ui); color:var(--muted); }

.eyebrow { display:inline-flex; align-items:center; gap:var(--s2);
           font:600 var(--fs-micro)/1 var(--mono); letter-spacing:.22em;
           text-transform:uppercase; color:var(--muted); }
.eyebrow::before { content:""; width:8px; height:8px; background:var(--acc); flex:none; }

.lede { font:var(--fs-body)/var(--lh-body) var(--ui); color:var(--muted);
        max-width:60ch; margin:var(--s4) 0 0; }
.lede b { color:var(--text); font-weight:600; }


.rails { position:absolute; top:0; bottom:0; left:50%; transform:translateX(-50%);
         width:var(--rails-w,100%); pointer-events:none; z-index:0; }
.rails i { position:absolute; top:0; bottom:0; width:2px; background:var(--line);
           transform-origin:top; animation:rail .8s cubic-bezier(.2,.7,.3,1) both; }
.rails i:nth-child(1) { left:0; }
.rails i:nth-child(2) { right:0; animation-delay:.08s; }
@keyframes rail { from { transform:scaleY(0); } to { transform:scaleY(1); } }

.bg { position:fixed; inset:0; z-index:-1; pointer-events:none; display:block;
      
      -webkit-mask-image:radial-gradient(125% 90% at 50% 42%, #000 60%, transparent 100%);
      mask-image:radial-gradient(125% 90% at 50% 42%, #000 60%, transparent 100%); }

.sec-rule { position:relative; height:2px; background:var(--line);
            margin:0 calc(var(--gut,0px) * -1); }
.plus { position:absolute; top:0; width:11px; height:11px; }
.plus::before, .plus::after { content:""; position:absolute; background:var(--line2); }
.plus::before { left:0; top:5px; width:11px; height:2px; }
.plus::after  { left:5px; top:0; width:2px; height:11px; }
.sec-rule .plus { top:-5px; }
.sec-rule .plus.l { left:calc(var(--gut,0px) - 5px); }
.sec-rule .plus.r { right:calc(var(--gut,0px) - 5px); }


.topbar { position:sticky; top:0; z-index:5; display:flex; align-items:center; gap:var(--s4);
          height:var(--topbar-h); padding:0 var(--s4); flex:none;
          background:var(--panel-thin); backdrop-filter:blur(10px);
          border-bottom:1px solid var(--line); }

.brand { display:flex; align-items:center; font:700 15px/1 var(--ui);
         letter-spacing:.16em; color:var(--text); }
.brand .mark { width:22px; height:22px; margin-right:10px; flex:none; }

a.brand { align-self:stretch; }
a.brand:hover { text-decoration:none; }
a.brand:hover .mark { filter:brightness(1.3); }

.metal {
  background-image:
    repeating-linear-gradient(180deg, rgba(255,255,255,.028) 0 1px, transparent 1px 2px,
      rgba(255,255,255,.012) 2px 3px, transparent 3px 5px);
  background-repeat:repeat; }

.metal.shimmer { isolation:isolate; }
.metal.shimmer::after {
  content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:linear-gradient(112deg, transparent 44%, rgba(255,255,255,.018) 50%,
                             transparent 56%) no-repeat;
  background-size:300% 100%;
  animation:shimmer 36s linear infinite; }
@keyframes shimmer { from { background-position:100% 0; } to { background-position:0 0; } }


:root { --sheen:linear-gradient(100deg, transparent 18%,
    rgba(var(--acc-rgb),.10) 38%, rgba(var(--violet-rgb),.13) 52%, transparent 74%); }
.flair {
  background-image:var(--sheen);
  background-size:220% 100%; background-repeat:no-repeat;
  animation:flairSheen 3.4s linear infinite, flairGlow 2.6s ease-in-out infinite; }
@keyframes flairSheen { from { background-position:-110% 0; } to { background-position:210% 0; } }
@keyframes flairGlow { 0%,100% { box-shadow:inset 0 0 0 0 rgba(var(--acc-rgb),0); }
                       50%     { box-shadow:inset 0 0 22px -6px rgba(var(--acc-rgb),.28); } }


:root { --foil:linear-gradient(110deg, var(--acc), #45F0D8 25%, var(--violet) 50%, #6CFFB6 75%,
                               var(--acc)); }
@keyframes foil { to { background-position:300% 0; } }
[data-flair="blue"]   { --tone:color-mix(in oklab, var(--blue), #fff 35%); --tone-rgb:var(--blue-rgb); }
[data-flair="violet"] { --tone:var(--violet); --tone-rgb:var(--violet-rgb); }
[data-flair="yellow"] { --tone:var(--yellow); --tone-rgb:var(--yellow-rgb); }
[data-flair="orange"] { --tone:var(--orange); --tone-rgb:var(--orange-rgb); }
[data-flair="foil"]   { --tone:var(--acc); --tone-rgb:var(--acc-rgb); }


button[aria-busy="true"] { position:relative; color:transparent !important; cursor:progress; }

.btn[aria-busy="true"]:disabled { opacity:1; }
button[aria-busy="true"] > :not(.busy-dots) { visibility:hidden; }
.busy-dots { position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
             gap:5px; pointer-events:none; }
.busy-dots i { width:7px; height:7px; background:var(--busy-ink, currentColor);
               animation:busyPulse .9s ease-in-out infinite; }
.busy-dots i:nth-child(2) { animation-delay:.15s; }
.busy-dots i:nth-child(3) { animation-delay:.3s; }
@keyframes busyPulse { 0%,100% { opacity:.25; transform:translateY(0); }
                       40% { opacity:1; transform:translateY(-2px); } }

.brand .suffix { color:var(--faint); font-weight:500; letter-spacing:.06em;
                 margin-left:var(--s3); }
.spacer { flex:1; }

.chip, .pill { font:600 var(--fs-micro)/1 var(--mono); letter-spacing:.04em;
               padding:var(--s1) var(--s2); border:1px solid var(--line2); color:var(--muted);
               background:transparent; white-space:nowrap; display:inline-block; }
.pill { text-transform:uppercase; letter-spacing:.06em; }
.chip-ok { color:var(--green); border-color:rgba(var(--acc-rgb),.3); background:rgba(var(--acc-rgb),.07); }
.chip-warn { color:var(--yellow); border-color:rgba(var(--yellow-rgb),.3); background:rgba(var(--yellow-rgb),.07); }
.chip-bad { color:var(--red); border-color:rgba(var(--red-rgb),.3); background:rgba(var(--red-rgb),.07); }

a.chip, button.chip { cursor:pointer; position:relative; overflow:hidden;
  transition:color var(--t-fast), border-color var(--t-fast), box-shadow var(--t), transform var(--t-fast); }
a.chip:not(.chip-go):not(.bar-tabs > *), button.chip:not(.bar-tabs > *) {
  background-image:linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.012));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06); }
a.chip:hover, button.chip:hover { border-color:rgba(var(--acc-rgb),.45); color:var(--text);
  text-decoration:none; transform:translateY(-1px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08), 0 0 0 1px rgba(var(--acc-rgb),.12),
             0 0 14px rgba(var(--acc-rgb),.16); }
a.chip::after, button.chip::after { content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(112deg, transparent 40%, rgba(255,255,255,.10) 50%, transparent 60%);
  transform:translateX(-120%); transition:transform .45s var(--ease-out); }
a.chip:hover::after, button.chip:hover::after { transform:translateX(120%); }
.chip.drawer-only::after { display:none; }


a.chip-go { color:var(--ink); border-color:var(--acc);
  background:linear-gradient(180deg,#19F09A,var(--acc));
  box-shadow:0 0 0 1px rgba(var(--acc-rgb),.25), 0 0 14px rgba(var(--acc-rgb),.3); }
a.chip-go:hover { color:var(--ink); border-color:#7BFFC8; filter:brightness(1.08);
  box-shadow:0 0 0 1px rgba(var(--acc-rgb),.45), 0 0 22px rgba(var(--acc-rgb),.55); }


.topbar { padding-right:0; }

.bar-tabs { display:flex; align-self:stretch; flex:none;
            --tone:var(--bg3); --tone-rgb:27,31,38; --on-tone:var(--text); }
.topbar .bar-tabs > .chip {
  --glass:100%;
  --tab-bg:linear-gradient(180deg,
    color-mix(in oklab, color-mix(in oklab, var(--tone), #fff 16%) var(--glass), transparent),
    color-mix(in oklab, var(--tone) var(--glass), transparent));
  position:relative; display:flex; flex-direction:column; align-items:center;
  justify-content:center; gap:3px; min-width:76px; height:auto; min-height:0;
  padding:0 var(--s4); font:700 var(--fs-micro)/1 var(--mono); letter-spacing:.1em;
  color:var(--on-tone); border:0; border-left:3px solid var(--bg0); background:var(--tab-bg);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28), 0 6px 16px -8px rgba(var(--tone-rgb),.7);
  transform:none; filter:none; transition:filter var(--t-fast), box-shadow var(--t); }
.topbar .bar-tabs > .chip.flair { background-image:var(--sheen), var(--tab-bg);
                                  background-size:220% 100%, 100% 100%; }

.bar-tabs > [data-tone="grey"]    { --tone:var(--grey);    --tone-rgb:var(--grey-rgb);    --on-tone:#fff; }
.bar-tabs > [data-tone="green"]   { --tone:var(--green);   --tone-rgb:var(--acc-rgb);     --on-tone:var(--ink); }
.bar-tabs > [data-tone="violet"]  { --tone:var(--violet);  --tone-rgb:var(--violet-rgb);  --on-tone:var(--ink); }
.bar-tabs > [data-tone="blurple"] { --tone:var(--discord); --tone-rgb:var(--discord-rgb); --on-tone:#fff; }
.bar-tabs > [data-tone="yellow"]  { --tone:var(--yellow);  --tone-rgb:var(--yellow-rgb);  --on-tone:var(--ink); }
.bar-tabs > [data-tone="orange"]  { --tone:var(--orange);  --tone-rgb:var(--orange-rgb);  --on-tone:var(--ink); }

.bar-tabs > .chip-ok   { --tone:var(--green);  --tone-rgb:var(--acc-rgb);    --on-tone:var(--ink); }
.bar-tabs > .chip-warn { --tone:var(--yellow); --tone-rgb:var(--yellow-rgb); --on-tone:var(--ink); }
.bar-tabs > .chip-bad  { --tone:var(--red);    --tone-rgb:var(--red-rgb);    --on-tone:#fff; }
.bar-tabs > .chip .ico { width:16px; height:16px; margin:0; vertical-align:0; color:inherit;
  transition:transform var(--t) var(--ease-out); }
.bar-tabs > a.chip::after, .bar-tabs > button.chip::after { display:block;
  background:linear-gradient(112deg, transparent 40%, rgba(255,255,255,.32) 50%, transparent 60%); }
.bar-tabs > a.chip:hover, .bar-tabs > button.chip:hover { color:var(--on-tone);
  text-decoration:none; transform:none; filter:brightness(1.08);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.4), 0 8px 22px -6px rgba(var(--tone-rgb),.9); }
.bar-tabs > a.chip:hover .ico, .bar-tabs > button.chip:hover .ico { transform:translateY(-1px) scale(1.08); }
.bar-tabs > .chip:focus-visible { outline:2px solid var(--text); outline-offset:-4px; }



.bar-stats { display:flex; align-items:center; gap:var(--s2); align-self:stretch; flex:none;
  min-width:0; padding:0 var(--s4) 0 var(--s3); border:solid var(--line2); border-width:0 1px;
  background:linear-gradient(180deg, rgba(var(--acc-rgb),.04), rgba(var(--acc-rgb),.13)); }

.bar-stats .globe { --h:calc(var(--fs-micro) + 3px + var(--fs-body)); width:var(--h);
  height:var(--h); flex:none; color:var(--acc); filter:drop-shadow(0 0 5px rgba(var(--acc-rgb),.6)); }
.bar-stats .cell { display:flex; flex-direction:column; justify-content:center; gap:3px; }

.bar-news { flex:1; min-width:0; align-self:stretch; padding:0 var(--s4);
  font:500 var(--fs-ui)/1 var(--mono); color:var(--text); border-right:1px solid var(--line2); }
.bar-news:not([hidden]) ~ .spacer { display:none; }
.bar-stats .k { font:600 var(--fs-micro)/1 var(--mono); letter-spacing:.08em;
  white-space:nowrap; text-transform:uppercase; color:var(--muted); }
.bar-stats .v { font:700 var(--fs-body)/1 var(--mono); color:var(--text);
  font-variant-numeric:tabular-nums; text-shadow:0 0 12px rgba(var(--acc-rgb),.45); }

.usage-btn { min-width:128px; }
.usage-btn #balance { font:700 var(--fs-body)/1 var(--mono); letter-spacing:.02em; }

.usage-btn.cool-now { animation:tabFull 1.4s var(--ease-out); }
@keyframes tabFull { 30% { box-shadow:0 0 28px 2px rgba(var(--tone-rgb),.9); } }

#usageBtn { position:relative; }
#usageBtn.deposited { animation:depositRing 1.2s var(--ease-out); }
@keyframes depositRing {
  0% { box-shadow:0 0 0 0 rgba(var(--acc-rgb),.7); }
  60% { box-shadow:0 0 0 12px rgba(var(--acc-rgb),0), 0 0 28px 2px rgba(var(--acc-rgb),.35); }
  100% { box-shadow:0 0 0 0 rgba(var(--acc-rgb),0); } }


@media (max-width:720px) {
  .topbar { gap:var(--s2); padding:0 0 0 var(--s2); }   
  
  .topbar .brand .suffix, .topbar .brand .bname { display:none; }
  .topbar .brand .mark { margin-right:0; }
  
  .topbar .bar-tabs > .nav-chip { display:none; }
  
  .bar-stats .k { display:none; }
  .bar-stats .globe { --h:var(--fs-body); }   
  .bar-stats { padding:0 var(--s3) 0 var(--s2); }
  .bar-news { display:none; }
  .bar-news:not([hidden]) ~ .spacer { display:block; }
  .usage-btn { min-width:0; }
  
  .topbar, .topbar > * { min-width:0; }
  
  .bar-tabs > .chip .ico + .lbl { display:none; }
  .topbar .bar-tabs > .chip { min-width:48px; padding:0 var(--s3); }
}


@media (pointer:coarse) {
  .chip { min-height:44px; display:inline-flex; align-items:center;
          padding:0 var(--s3); }
  .btn { min-height:44px; }
  
  input:not([type=checkbox]):not([type=radio]):not([type=range]), select, textarea {
    font-size:16px !important; }
}


.odometer { display:inline-flex; font-variant-numeric:tabular-nums; line-height:1; }
.od-face { display:inline-flex; }
.od-col { display:inline-block; height:1em; overflow:hidden; }
.od-strip { display:flex; flex-direction:column; transition:transform .38s cubic-bezier(.2,.8,.2,1); }
.od-strip.od-snap { transition:none; }   
.od-strip > span { height:1em; }



.ticker { display:flex; align-items:center; overflow:hidden; white-space:nowrap; contain:inline-size;
  -webkit-mask-image:linear-gradient(90deg, transparent, #000 3%, #000 97%, transparent);
  mask-image:linear-gradient(90deg, transparent, #000 3%, #000 97%, transparent); }
.tk-track { display:flex; flex:none; animation:tape linear infinite; }
.ticker:hover .tk-track { animation-play-state:paused; }
@keyframes tape { to { transform:translateX(-50%); } }
.tk-run { display:flex; flex:none; }
.tk-item { display:inline-flex; align-items:center; gap:var(--s2); padding-right:var(--s6); }
.tk-item::before { content:""; width:6px; height:6px; flex:none;
                   background:var(--tk-tone, var(--acc)); box-shadow:0 0 6px var(--tk-tone, var(--acc)); }
.tk-tag { font:700 var(--fs-micro)/1 var(--mono); letter-spacing:.1em; padding:3px 5px;
          background:var(--tk-tone, var(--acc)); color:var(--ink); }
.tk-b { font-weight:700; color:var(--tk-tone, var(--text)); }

.tk-item[data-tone="green"]  { --tk-tone:var(--green); }
.tk-item[data-tone="red"]    { --tk-tone:var(--red); }
.tk-item[data-tone="yellow"] { --tk-tone:var(--yellow); }
.tk-item[data-tone="orange"] { --tk-tone:var(--orange); }
.tk-item[data-tone="violet"] { --tk-tone:var(--violet); }
.tk-item[data-tone="blue"]   { --tk-tone:var(--blue); }



input:not([type=checkbox]):not([type=radio]):not([type=range]),
select,textarea {
  width:100%; background:var(--bg2); border:1px solid var(--line2); color:var(--text);
  padding:var(--s2) var(--s2); font-size:var(--fs-ui); }
input::placeholder,textarea::placeholder { color:var(--faint); }
input:focus,select:focus,textarea:focus { border-color:var(--acc); outline:none; }

input:focus-visible,select:focus-visible,textarea:focus-visible {
  outline:2px solid var(--acc); outline-offset:-1px; }
textarea { resize:vertical; font:var(--fs-ui)/1.5 var(--mono); }

.btn { position:relative; overflow:hidden;
       display:inline-block; border:var(--bd) solid var(--line2); background:transparent;
       color:var(--text); font:600 var(--fs-micro)/1 var(--ui); letter-spacing:.06em;
       text-transform:uppercase; padding:var(--s2) var(--s3); cursor:pointer;
       text-align:center; text-decoration:none;
       transition:border-color .12s, background .12s, color .12s, box-shadow .1s, transform .12s; }
.btn:hover { border-color:var(--text); background:var(--bg1); text-decoration:none; }

.btn::after { content:""; position:absolute; inset:0; pointer-events:none;
              background:linear-gradient(105deg, transparent 30%, rgba(255,255,255,.09) 50%,
                transparent 70%);
              transform:translateX(-120%); transition:transform .5s ease; }
.btn:hover::after, .btn:focus-visible::after { transform:translateX(120%); }
.btn:disabled::after { display:none; }
.btn:active:not(:disabled) { background:var(--bg3); }
.btn:focus-visible { outline:2px solid var(--acc); outline-offset:2px; }
.btn:disabled { opacity:.35; cursor:default; }
.btn-primary { background:var(--white); border-color:var(--white); color:var(--ink);
               box-shadow:var(--shadow); }
.btn-primary:hover { background:#fff; border-color:#fff; }

.btn-primary:not(.btn-sm):hover { transform:translate(-2px,-2px); box-shadow:var(--shadow-lift); }
.btn-primary:active:not(:disabled) { background:#fff; transform:translate(3px,3px);
                                     box-shadow:var(--shadow-press); }
.btn-primary:disabled { box-shadow:none; }
.btn-primary.btn-sm { box-shadow:var(--shadow-press); }
.btn-primary.btn-sm:active:not(:disabled) { transform:none; box-shadow:var(--shadow-press); }
.btn-danger { color:var(--red); border-color:rgba(var(--red-rgb),.34); }
.btn-danger:hover { border-color:var(--red); background:rgba(var(--red-rgb),.08); }
.btn-sm { padding:3px var(--s2); font-size:10px; }

.btn-lg { display:inline-flex; align-items:center; gap:var(--s2); min-height:44px;
          padding:0 var(--s5); font:600 var(--fs-ui)/1 var(--ui); letter-spacing:.01em;
          text-transform:none; }


.panel { border:var(--bd) solid var(--line); background:var(--bg1); }
.panel-h { padding:var(--s2) var(--s3); border-bottom:1px solid var(--line); }
.panel-b { padding:var(--s3); }

.tablewrap { overflow-x:auto; }
table { width:100%; border-collapse:collapse; font-size:var(--fs-ui); }

th[data-sort] { cursor:pointer; user-select:none; }
th[data-sort]:hover { color:var(--text); }
th .dir { margin-left:var(--s1); color:var(--acc); }
th { text-align:left; padding:var(--s2) var(--s3); border-bottom:1px solid var(--line);
     position:sticky; top:0; background:var(--bg1); }
td { padding:var(--s2) var(--s3); border-bottom:1px solid var(--line); vertical-align:top; }

tbody tr { transition:background .1s; }
tbody tr:hover { background:var(--bg2); box-shadow:inset 2px 0 0 var(--acc); }
.num { font-family:var(--mono); text-align:right; }


.v-good { color:var(--green); } .v-warn { color:var(--yellow); } .v-bad { color:var(--red); }


pre .tok-c { color:var(--faint); } pre .tok-s { color:var(--acc); }
pre .tok-k { color:var(--violet); } pre .tok-n { color:var(--yellow); }


.flag { position:absolute; top:0; left:var(--s3); transform:translateY(-50%);
        padding:3px var(--s2); background:var(--acc); color:var(--ink);
        font:700 var(--fs-micro)/1 var(--mono); letter-spacing:.1em; text-transform:uppercase; }


@keyframes blink { 50% { opacity:0; } }


.tag.ok, .mp-tag.rec, .prices .best, .badge {
  color:var(--acc); border:1px solid rgba(var(--acc-rgb),.34); background:rgba(var(--acc-rgb),.08); }


.actions { display:flex; gap:var(--s2); flex-wrap:wrap; align-items:center; }


.warnbox { border:1px solid rgba(var(--yellow-rgb),.3); border-left:2px solid var(--yellow);
           background:rgba(var(--yellow-rgb),.06); padding:var(--s3); font:var(--fs-ui)/1.5 var(--ui); }

.secret { font:600 var(--fs-lg)/1.5 var(--mono); letter-spacing:.10em; color:var(--acc);
          background:var(--bg2); border:1px solid var(--line2); border-left:2px solid var(--acc);
          padding:var(--s4); text-align:center; word-break:break-all; }

html:has(body.card-page), body.card-page { height:auto; min-height:100dvh; overflow:visible; }
body.card-page { display:grid; place-items:center; padding:var(--s5); }
.sheet { width:min(46ch,100%); display:grid; gap:var(--s4);
         border:var(--bd) solid var(--line); background:var(--bg1); padding:var(--s5); }
.sheet h1 { font:600 var(--fs-lg)/1.2 var(--ui); margin:0; }
.sheet p { margin:0; font:var(--fs-ui)/1.5 var(--ui); }

.empty { display:flex; align-items:center; justify-content:center; color:var(--faint);
         font-size:var(--fs-ui); padding:var(--s6); text-align:center; }

.overlay { position:fixed; inset:0; background:rgba(8,9,11,.86); display:flex;
           align-items:center; justify-content:center; z-index:100; padding:var(--s4); }
.overlay .box { width:var(--box-w, 420px); max-width:100%; max-height:90vh; overflow:auto;
                border-color:var(--line2); box-shadow:var(--shadow);
                background:linear-gradient(160deg, var(--bg2), var(--bg1) 60%); }
.overlay .panel-b > * { margin-bottom:var(--s3); }
.overlay .panel-b > *:last-child { margin-bottom:0; }
.row-split { display:flex; gap:var(--s2); }
.row-split > * { flex:1; }

.dlg-h { display:flex; align-items:center; gap:var(--s3); }
.dlg-h .micro { flex:1; }
.dlg-x { background:none; border:1px solid transparent; color:var(--muted); cursor:pointer;
         font:600 var(--fs-ui)/1 var(--ui); padding:var(--s1) var(--s2); margin:-4px -4px -4px 0; }
.dlg-x:hover { color:var(--text); border-color:var(--line2); background:var(--bg2); }

@media (max-width:720px) {
  .overlay { align-items:flex-start; overflow:auto; }
  .overlay .box { max-height:none; margin-block:auto; }
}


.toast { position:fixed; bottom:var(--s4); left:50%; transform:translateX(-50%);
         background:var(--bg3); border:var(--bd) solid var(--line2); box-shadow:var(--shadow);
         padding:var(--s2) var(--s4); font-size:var(--fs-ui); z-index:1000;
         max-width:min(520px,90vw); }
.toast.err { border-color:rgba(var(--red-rgb),.5); color:var(--red); }

@media (prefers-reduced-motion:reduce) { *, *::before, *::after { animation:none !important; transition:none !important; } }
