:root { color-scheme:dark; --bg:#06101b; --panel:#0d1b2d; --line:#203853; --text:#eff8ff; --muted:#8ba1b8; --green:#38df9b; --red:#ff7f8d; --blue:#4aa8ff; --gold:#f4c756; }
* { box-sizing:border-box; } body { margin:0; min-height:100vh; background:radial-gradient(circle at 82% 0,#163b61 0,transparent 35%),var(--bg); color:var(--text); font-family:Inter,ui-sans-serif,system-ui,sans-serif; }
.both-shell { width:min(1180px,calc(100% - 32px)); margin:auto; padding:28px 0 52px; }.both-hero,.both-summary,.both-leg,.method-panel { border:1px solid var(--line); background:rgba(13,27,45,.94); box-shadow:0 18px 45px rgba(0,0,0,.22); }
.both-hero { display:grid; grid-template-columns:1.4fr .8fr; gap:28px; align-items:end; padding:28px; border-radius:24px; }.both-hero a,.both-leg a { color:#8bc8ff; font-weight:850; text-decoration:none; }.both-hero span,.method-panel>span,.both-leg>div>span { display:block; margin-top:18px; color:var(--green); font-size:10px; font-weight:950; letter-spacing:.14em; }.both-hero h1 { margin:5px 0 8px; font-size:clamp(40px,7vw,72px); line-height:.95; }.both-hero p,.method-panel p { color:var(--muted); line-height:1.55; }
form label { display:block; margin-bottom:7px; color:var(--muted); font-size:11px; font-weight:900; text-transform:uppercase; } form>div { display:flex; gap:8px; } input { min-width:0; flex:1; border:1px solid var(--line); border-radius:11px; padding:13px 14px; background:#071321; color:var(--text); font-size:18px; font-weight:900; } button { border:0; border-radius:11px; padding:12px 15px; background:var(--green); color:#04130d; font-weight:900; cursor:pointer; } button:disabled { opacity:.55; cursor:wait; }
.global-reset-test { position:fixed; top:12px; right:14px; z-index:10000; min-height:40px; border:1px solid #ff9aa5; background:#531e28; color:#ffd8dc; box-shadow:0 8px 24px rgba(0,0,0,.3); font-size:11px; }.global-reset-test:hover { background:#712a36; }
.both-status { margin:18px 0; padding:12px 15px; border:1px solid var(--line); border-radius:12px; background:#091626; color:var(--muted); }.both-status.live { color:#9ff0c9; }.both-status.error { border-color:#713841; color:#ffc1c8; }
.both-summary { display:grid; grid-template-columns:repeat(4,1fr); border-radius:20px; overflow:hidden; }.both-summary div { min-height:112px; padding:19px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); }.both-summary span,.leg-grid b { display:block; color:var(--muted); font-size:10px; font-weight:900; text-transform:uppercase; letter-spacing:.07em; }.both-summary strong { display:block; margin-top:8px; font-size:27px; }.both-summary small { display:block; margin-top:5px; color:var(--muted); }.gain { color:var(--green)!important; }.loss { color:var(--red)!important; }
.both-legs { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin:18px 0; }.both-leg { padding:22px; border-radius:20px; color:var(--text)!important; }.both-leg.gain { border-color:#256c50; }.both-leg.loss { border-color:#713841; }.both-leg h2 { margin:5px 0; }.both-leg p { color:var(--muted); font:12px ui-monospace,Consolas,monospace; overflow-wrap:anywhere; }.both-leg>strong { display:block; margin:14px 0; font-size:42px; }.leg-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-bottom:18px; }.leg-grid span { padding:11px; border:1px solid var(--line); border-radius:11px; }.leg-grid b { margin-bottom:4px; }.leg-grid em { font-style:normal; font-weight:900; }.method-panel { padding:22px; border-radius:20px; }.method-panel>span { margin:0; }.method-panel h2 { margin:5px 0; }
.both-test-button { width:100%; min-height:42px; margin-top:10px; border:1px solid #256c50; background:#0c3f2e; color:#9ff0c9; }
.both-test-button.selected { background:var(--green); color:#04130d; }
@media (max-width:800px) { .both-hero { grid-template-columns:1fr; }.both-summary { grid-template-columns:1fr 1fr; }.both-legs { grid-template-columns:1fr; } } @media (max-width:480px) { .both-shell { width:calc(100% - 20px); }.both-summary,.leg-grid { grid-template-columns:1fr; } form>div { flex-direction:column; } }