/* Twinflame shared base. */
:root{
  --tf-bg:#120B1F;--tf-surface:#1b1230;--tf-line:#3b2a63;--tf-text:#f1ebff;--tf-muted:#9d90bd;
  --tf-accent:#FFB627;--tf-accent-ink:#1a0f00;--tf-font:ui-monospace,Menlo,Consolas,monospace;
  --tf-head:var(--tf-font);--tf-radius:0;--tf-bw:3px;
}
*{box-sizing:border-box}
.px,canvas[data-flame],canvas[data-scene],canvas[data-avatar]{image-rendering:pixelated;image-rendering:crisp-edges;display:block;max-width:100%}
.spark{display:block}
:focus-visible{outline:3px solid var(--tf-accent);outline-offset:2px}
.od-d{display:inline-block;min-width:.62em;text-align:center}
.od-flip{animation:odflip .42s steps(3) 1}
@keyframes odflip{0%{transform:translateY(-35%);opacity:.2}100%{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* wallet */
[data-wallet]{cursor:pointer;font:inherit;display:inline-flex;align-items:center;gap:8px}
[data-wallet] canvas{flex:none}
.tfw-caret{width:0;height:0;border:4px solid transparent;border-top-color:currentColor;border-bottom:0;margin-left:2px}
body.tfw-lock{overflow:hidden}
.tfw-back{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:16px;background:rgba(0,0,0,.66)}
.tfw-back[hidden]{display:none}
.tfw-modal{position:relative;width:min(380px,100%);background:var(--tf-surface);color:var(--tf-text);border:var(--tf-bw) solid var(--tf-line);border-radius:var(--tf-radius);padding:20px;font-family:var(--tf-font);box-shadow:6px 6px 0 rgba(0,0,0,.5)}
.tfw-title{font:400 15px/1.3 var(--tf-head);margin:0 36px 14px 0}
.tfw-x{position:absolute;top:10px;right:10px;width:34px;height:34px;background:none;border:var(--tf-bw) solid var(--tf-line);color:var(--tf-text);font-size:20px;line-height:1;cursor:pointer;border-radius:var(--tf-radius)}
.tfw-body{display:grid;gap:8px}
.tfw-opt{display:flex;align-items:center;gap:12px;width:100%;padding:10px 12px;background:transparent;border:var(--tf-bw) solid var(--tf-line);color:inherit;font:inherit;text-align:left;cursor:pointer;border-radius:var(--tf-radius)}
.tfw-opt:hover:not([disabled]){border-color:var(--tf-accent)}
.tfw-opt[disabled]{opacity:.5;cursor:default}
.tfw-name{flex:1}
.tfw-tag{font-size:11px;color:var(--tf-accent)}
.tfw-wait{display:grid;justify-items:center;gap:14px;padding:18px 0 4px;text-align:center}
.tfw-wait p{margin:0}
.tfw-err{color:#ff7a7a}
.tfw-spin{width:28px;height:28px;background:conic-gradient(var(--tf-accent) 0 25%,transparent 0 100%);animation:tfspin .8s steps(4) infinite}
@keyframes tfspin{to{transform:rotate(360deg)}}
.tfw-cancel,.tfw-copy,.tfw-dc{font:inherit;color:inherit;background:none;border:var(--tf-bw) solid var(--tf-line);padding:8px 12px;cursor:pointer;border-radius:var(--tf-radius)}
.tfw-cancel:hover,.tfw-copy:hover,.tfw-dc:hover{border-color:var(--tf-accent)}
.tfw-foot{margin:14px 0 0;font-size:12px;color:var(--tf-muted)}
.tfw-pop{position:absolute;z-index:90;width:min(290px,calc(100vw - 16px));background:var(--tf-surface);color:var(--tf-text);border:var(--tf-bw) solid var(--tf-line);padding:14px;display:grid;gap:10px;font:13px/1.4 var(--tf-font);border-radius:var(--tf-radius);box-shadow:6px 6px 0 rgba(0,0,0,.5)}
.tfw-badge{justify-self:start;font-size:11px;padding:2px 8px;border:2px solid var(--tf-accent);color:var(--tf-accent)}
.tfw-addr{word-break:break-all;color:var(--tf-muted)}
.tfw-bal{display:flex;justify-content:space-between;align-items:baseline}
.tfw-bal span{color:var(--tf-muted)}
.tfw-exp{color:var(--tf-accent)}
.tfw-toast{position:fixed;left:50%;bottom:20px;transform:translate(-50%,16px);opacity:0;pointer-events:none;background:var(--tf-accent);color:var(--tf-accent-ink);padding:10px 16px;font:13px var(--tf-font);z-index:120;transition:opacity .2s steps(3),transform .2s steps(3)}
.tfw-toast.on{opacity:1;transform:translate(-50%,0)}
