.btc-balance-button{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-width:54px;height:34px;padding:0 9px;border:1px solid var(--line);border-radius:8px;background:var(--panel);color:var(--text);font:500 var(--text-sm)/1 var(--font);font-variant-numeric:tabular-nums;cursor:pointer}
.btc-balance-button svg{width:18px;height:22px;fill:none;stroke:#a9d8ed;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.btc-balance-button:hover{border-color:#648a9e;background:var(--raised)}
.btc-balance-button[data-sync="error"]{border-color:var(--amber)}
.btc-balance-button:disabled{opacity:.55;cursor:default}
.btc-dialog{box-sizing:border-box;width:min(360px,calc(100vw - 32px));max-width:calc(100vw - 32px);max-height:calc(100dvh - 32px);padding:20px;border:1px solid #3b4b5b;border-radius:16px;background:var(--panel);color:var(--text);box-shadow:0 22px 80px #0008;font:var(--text-md)/1.5 var(--font);overflow:auto}
.btc-info-dialog{width:300px}
.btc-dialog::backdrop{background:#080d16b8;backdrop-filter:blur(5px)}
.btc-dialog header{position:relative;display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin:0 0 12px;padding:0;border:0}
.btc-dialog h2{margin:0;font:600 var(--text-xl)/1.4 var(--font)}
.btc-dialog p{margin:0;font-size:var(--text-sm);line-height:1.65;overflow-wrap:anywhere}
.btc-dialog .btc-close{flex:none;width:32px;height:32px;display:grid;place-items:center;padding:0;border:1px solid var(--line);border-radius:7px;background:transparent;color:var(--muted);cursor:pointer}
.btc-dialog .btc-close svg{display:block;width:18px;height:18px;flex:none}
.btc-dialog .btc-submit-label{margin-top:4px;color:var(--muted);font-size:var(--text-sm)}
.btc-heading-title{display:flex;align-items:center;gap:8px;min-height:32px}
.btc-rule-help{display:inline-flex;flex:none;align-items:center}
.btc-rule-trigger{display:grid;place-items:center;width:26px;height:26px;padding:0;border:0;border-radius:50%;background:transparent;color:var(--muted);cursor:pointer}
.btc-rule-trigger svg{display:block;width:18px;height:18px}
.btc-rule-trigger:hover,.btc-rule-trigger[aria-expanded="true"]{color:#c1e3f2;background:#223141}
.btc-rule-tip{position:absolute;z-index:2;top:36px;left:0;right:0;padding:12px 14px;border:1px solid #43576b;border-radius:9px;background:#1b2836;box-shadow:0 8px 24px #0007;color:#c1ceda;text-align:left}
.btc-rule-tip::before{content:"";position:absolute;top:-12px;left:0;right:0;height:12px}
.btc-rule-tip p+p{margin-top:7px}
.btc-card-balance{display:flex;align-items:center;justify-content:center;gap:24px;min-width:0}
/* Original PNG stays untouched. The 840 x 1351 window removes its transparent
   surround (x=92, y=54); every view uses the same undistorted registration.
   Background percentages account for the difference between image/window size. */
.btc-card-preview,.btc-consumption-scene{--btc-image-width:121.9047619%;--btc-image-height:113.6935603%;--btc-image-left:-10.9523810%;--btc-image-top:-3.9970392%;--btc-image-position:50% 29.1891892%;--btc-fallback-shape:polygon(5.6% 0,96.4% 0,100% 2.2%,100% 95.8%,93.3% 100%,3.2% 100%,0 97.7%,0 3.6%);width:calc(var(--btc-card-height) * 840 / 1351);height:var(--btc-card-height)}
.btc-card-preview{--btc-card-height:126px;position:relative;flex:none;overflow:hidden;border:0;border-radius:0;clip-path:var(--btc-fallback-shape);background:linear-gradient(135deg,#46515e,#101a27 45%,#273f55 70%,#101926)}
.btc-card-preview::after{content:"";position:absolute;inset:25% 15%;background:radial-gradient(ellipse,#ecfcff,#97e0ff 20%,#3d91cc 50%,#123853);clip-path:polygon(50% 0,60% 39%,100% 50%,60% 61%,50% 100%,40% 61%,0 50%,40% 39%)}
.btc-card-preview img{position:absolute;z-index:1;display:block;left:var(--btc-image-left);top:var(--btc-image-top);width:var(--btc-image-width);height:var(--btc-image-height);max-width:none;object-fit:contain;opacity:0}
.btc-card-preview[data-ready="true"]{background:none;clip-path:none}
.btc-card-preview[data-ready="true"] img{opacity:1}
.btc-card-preview[data-ready="true"]::after{display:none}
.btc-available>div{display:flex;align-items:baseline;gap:6px}
.btc-available strong{color:#d7ecf7;font:500 var(--text-3xl)/1.25 var(--font);font-variant-numeric:tabular-nums}
.btc-available>div>span{color:var(--muted);font-size:var(--text-sm)}
.btc-info-dialog .btc-card-balance{gap:18px}
.btc-info-dialog .btc-card-preview{--btc-card-height:96px}
.btc-info-dialog .btc-available .btc-multiply{font-size:var(--text-3xl);line-height:1.25}
.btc-confirm-dialog .btc-card-preview{--btc-card-height:96px}
.btc-dialog .btc-confirm-note{margin-top:12px;color:#bacbd8}
.btc-dialog .btc-error{color:var(--amber);margin-top:10px}
.btc-dialog .btc-sync-note{color:var(--muted);margin-top:10px}
.btc-dialog footer{display:flex;justify-content:flex-end;align-items:center;flex-wrap:wrap;gap:8px;margin-top:16px;padding:0;border:0}
.btc-dialog footer .button{font-size:var(--text-sm);min-height:36px}
.btc-dialog [hidden]{display:none!important}
.btc-dialog button:focus-visible,.btc-balance-button:focus-visible{outline:2px solid #9bdfff;outline-offset:3px}
.btc-consumption{position:fixed;inset:0;width:100%;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;overflow:hidden;z-index:10020;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;pointer-events:none;isolation:isolate;background:radial-gradient(ellipse at 50% 47%,#173b56b8 0%,#080f1ed1 48%,#050a12d9 100%);font:var(--text-md)/1.5 var(--font);animation:btc-overlay 2.1s ease both}
.btc-consumption-scene{--btc-card-height:340px;position:relative;perspective:900px;flex:none}
.btc-card-stage{position:absolute;inset:0;transform-style:preserve-3d;animation:btc-stage 2.1s cubic-bezier(.2,.65,.25,1) both}
.btc-card-piece{position:absolute;inset:0;display:block;border:0;border-radius:0;filter:drop-shadow(0 10px 18px #0009);animation:btc-fracture 2.1s cubic-bezier(.25,.7,.3,1) both}
.btc-card-piece::before{content:"";position:absolute;inset:0;background-image:url("assets/backtest-card.png"),linear-gradient(135deg,#46515e 0%,#101a27 45%,#273f55 70%,#101926 100%);background-position:var(--btc-image-position),center;background-size:var(--btc-image-width) var(--btc-image-height),100% 100%;background-repeat:no-repeat;clip-path:var(--btc-fallback-shape)}
.btc-image-ready .btc-card-piece::before{background-image:url("assets/backtest-card.png");clip-path:none}
.btc-card-piece::after{content:"";position:absolute;inset:25% 15%;background:radial-gradient(ellipse,#ecfcff 0%,#97e0ff 20%,#3d91cc 50%,#123853 100%);clip-path:polygon(50% 0,60% 39%,100% 50%,60% 61%,50% 100%,40% 61%,0 50%,40% 39%);filter:drop-shadow(0 0 12px #93e8ff)}
.btc-image-ready .btc-card-piece::after{display:none}
.btc-piece-0{clip-path:polygon(0 0,calc(56% + .4px) 0,calc(49% + .4px) calc(46% + .4px),0 calc(60% + .4px));--btc-x:-75px;--btc-y:-65px;--btc-r:-22deg}
.btc-piece-1{clip-path:polygon(calc(56% - .4px) 0,100% 0,100% calc(62% + .4px),calc(49% - .4px) calc(46% + .4px));--btc-x:80px;--btc-y:-45px;--btc-r:24deg}
.btc-piece-2{clip-path:polygon(0 calc(60% - .4px),calc(49% + .4px) calc(46% - .4px),calc(54% + .4px) 100%,0 100%);--btc-x:-68px;--btc-y:70px;--btc-r:-16deg}
.btc-piece-3{clip-path:polygon(calc(49% - .4px) calc(46% - .4px),100% calc(62% - .4px),100% 100%,calc(54% - .4px) 100%);--btc-x:78px;--btc-y:80px;--btc-r:20deg}
.btc-card-glow{position:absolute;inset:8% -20%;border-radius:50%;background:radial-gradient(ellipse,#77d5ff80,transparent 65%);filter:blur(18px);animation:btc-glow 2.1s ease both}
.btc-energy-ring{position:absolute;left:50%;top:53%;width:200px;height:200px;margin:-100px;border:2px solid #a4edff;border-radius:50%;box-shadow:0 0 28px #6bd4ffa8,inset 0 0 24px #6bd4ff70;animation:btc-ring 2.1s ease-out both}
.btc-consumption-caption{position:relative;color:#e5f6ff;text-align:center;font:600 var(--text-xl)/1.5 var(--font);text-shadow:0 0 18px #70c8ff70}
.btc-consumption-caption span{display:block;margin-top:5px;color:#a7c8dc;font:400 var(--text-sm)/1.5 var(--font)}
@keyframes btc-overlay{0%{opacity:0}12%,80%{opacity:1}100%{opacity:0}}
@keyframes btc-stage{0%{transform:translateY(30px) rotateY(-24deg) rotateX(12deg) scale(.76)}38%{transform:translateY(0) rotateY(9deg) rotateX(-4deg) scale(1.04)}63%{transform:rotateY(0) scale(1.08)}100%{transform:scale(1.12)}}
@keyframes btc-fracture{0%,56%{transform:translate3d(0,0,0) rotate(0);opacity:1;filter:drop-shadow(0 10px 18px #0009)}65%{filter:drop-shadow(0 0 15px #a5edff)}100%{transform:translate3d(var(--btc-x),var(--btc-y),70px) rotate(var(--btc-r));opacity:0}}
@keyframes btc-ring{0%,48%{transform:scale(.1);opacity:0}61%{opacity:.85}100%{transform:scale(2.3);opacity:0}}
@keyframes btc-glow{0%{opacity:.15;transform:scale(.7)}58%{opacity:1;transform:scale(1.1)}100%{opacity:0;transform:scale(1.5)}}
.btc-reduced-motion{animation:none;background:#07111ee8}
.btc-reduced-motion .btc-consumption-scene{--btc-card-height:180px}
.btc-reduced-motion .btc-card-stage,.btc-reduced-motion .btc-card-piece{animation:none;transform:none;filter:none}
.btc-reduced-motion .btc-card-glow,.btc-reduced-motion .btc-energy-ring{display:none}
@media(max-width:480px){.btc-dialog{padding:20px}.btc-dialog h2{font-size:var(--text-lg)}.btc-dialog footer{gap:7px}.btc-dialog footer .button{padding:8px 11px}.btc-consumption-scene{--btc-card-height:270px}.btc-consumption-caption{font-size:var(--text-lg)}}
@media(prefers-reduced-motion:reduce){.btc-consumption,.btc-card-stage,.btc-card-piece,.btc-card-glow,.btc-energy-ring{animation:none!important}.btc-consumption-scene{--btc-card-height:180px}.btc-card-glow,.btc-energy-ring{display:none}}
