:root{font-family:Inter,system-ui,sans-serif;color:#e8f2fb;background:#061422;color-scheme:dark;--accent:#12b886}
*{box-sizing:border-box}
body{margin:0}
header{height:76px;padding:14px 28px;border-bottom:1px solid #24445b;background:#071b2a;display:flex;align-items:center;justify-content:space-between}
header b{font-size:22px}
.brand{display:flex;align-items:center;gap:12px}.brand-logo{width:48px;height:48px;object-fit:contain;border-radius:10px}
header small,td small{display:block;color:#91acc1;margin-top:4px}
main{padding:24px;max-width:1600px;margin:auto}
.hidden{display:none!important}
.card{background:#0d2638;border:1px solid #24485f;border-radius:18px;padding:22px;box-shadow:0 12px 30px #0004;margin-bottom:20px}
.login{max-width:440px;margin:8vh auto}
.warning{padding:15px 18px;margin-bottom:20px;border:1px solid #a67d18;background:#332b10;color:#ffd95b;border-radius:12px;font-weight:800}
.cards{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;margin-bottom:20px}
.cards article{background:#0d2638;border:1px solid #24485f;border-radius:15px;padding:18px;min-height:98px}
.cards span{display:block;color:#91acc1;font-size:13px}
.cards b{font-size:20px;display:block;margin-top:12px}
.grid{display:grid;grid-template-columns:2fr 1fr;gap:20px}
h1,h2,h3{margin-top:0}
h2{font-size:20px}
.field{margin:18px 0}
.checks,.strategy-list{display:flex;flex-wrap:wrap;gap:9px;margin-top:10px}
.checks label,.strategy-list .strategy{border:1px solid #31546b;border-radius:10px;padding:9px;background:#081d2d}
.strategy{min-width:250px}
.strategy small{display:block;color:#9db3c4;margin:6px 0}
.strategy .risk{display:flex;gap:14px}
.form-grid,.broker-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.sheet-grid{display:grid;grid-template-columns:2fr 1fr auto;gap:12px;align-items:end}
.history-grid{display:grid;grid-template-columns:repeat(4,minmax(170px,1fr));gap:12px;align-items:end}
.history-grid button{align-self:end;margin-bottom:12px}
label{display:block;color:#b8cbda;font-weight:650;margin:12px 0}
input,select{width:100%;padding:12px;border-radius:9px;border:1px solid #31546b;background:#071a29;color:#fff;margin-top:6px}
.toggle{grid-column:span 2}
.toggle input,.checks input,.strategy input{width:auto;margin-right:7px}
button{border:0;border-radius:10px;padding:12px 17px;background:var(--accent);color:#031a17;font-weight:850;cursor:pointer}
button:hover{filter:brightness(1.08)}
button:disabled{opacity:.5;cursor:not-allowed}
.secondary{background:#18566e;color:#fff}
.danger{background:#d83b3b;color:white}
.warning-btn{background:#c98a14;color:#161008}
.ghost{background:transparent;border:1px solid #3b6179;color:#d9e9f4}
.actions,.inline,.title-row,.summary{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.inline input{max-width:380px}
.inline.compact{flex-wrap:nowrap}
.inline.compact input{min-width:280px}
.title-row{justify-content:space-between}
.title-row select{width:150px}
.msg{min-height:20px;color:#61dcff}
.pill,.summary span{display:inline-flex;border:1px solid #31546b;border-radius:99px;padding:7px 11px;color:#a9c4d6;background:#071a29}
.pill.active{border-color:#16a36f;color:#57e8ad}
.summary{margin:12px 0}
.summary b{margin-left:5px}
.table-wrap{overflow:auto;max-height:560px;border:1px solid #27475d;border-radius:10px}
.positions-table{max-height:620px}
.admin-table{margin-top:18px;max-height:420px}
table{width:100%;border-collapse:collapse;white-space:nowrap}
th,td{text-align:left;padding:12px;border-bottom:1px solid #203d51}
th{position:sticky;top:0;background:#102c40;color:#9bb4c7;z-index:2}
.secret{white-space:pre-wrap;background:#061827;padding:12px;border-radius:8px;color:#ffdf78}
.positive{color:#40e6a7}
.negative{color:#ff7777}
.broker-cards{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-top:16px}
.broker-card{display:grid;gap:5px;border:1px solid #31546b;border-radius:11px;background:#081d2d;padding:13px}
.broker-card.connected{border-color:#15a772}
.broker-card span{color:#f2c756}
.broker-card.connected span{color:#46e6a4}
.broker-card small{color:#91acc1}
.broker-card em{color:#ff8585;font-size:12px;overflow-wrap:anywhere}
details{margin-top:16px;border-top:1px solid #29475b;padding-top:14px}
summary{cursor:pointer;color:#65dff2;font-weight:800}
.layout-editing .movable-panel{outline:2px dashed var(--accent);cursor:grab;position:relative}.layout-editing .movable-panel:before{content:'↕ MOVE';position:absolute;right:16px;top:12px;color:var(--accent);font-weight:900}.dragging{opacity:.45}.layout-hidden{display:none!important}
.layout-tools{display:none;gap:6px;align-items:center;flex-wrap:wrap;margin:0 0 12px;padding:10px;border:1px dashed #527086;border-radius:10px;background:#061827}.layout-editing .layout-tools{display:flex}.layout-editing .layout-hidden{display:block!important;opacity:.5}.layout-tools button,.layout-tools select,.layout-tools input{width:auto;margin:0;padding:7px 9px}.panel-collapsed>*:not(.layout-tools):not(h2){display:none!important}.layout-editing .panel-collapsed>.layout-tools{display:flex!important}.panel-collapsed{min-height:76px!important}.panel-small{width:min(100%,380px);justify-self:start}.panel-medium{width:min(100%,760px);justify-self:start}.panel-full{width:100%}.movable-panel{transition:width .15s ease,background-color .15s ease}.mfa-qr{background:#fff;padding:14px;border-radius:12px;width:max-content;max-width:100%;color:#071a29;margin:14px 0}.mfa-qr img{display:block;width:220px;max-width:100%;height:auto}.mfa-qr p{margin:8px 0 0;font-size:12px}.secret{overflow-wrap:anywhere}
@media(max-width:1100px){.cards{grid-template-columns:repeat(3,1fr)}
.grid{grid-template-columns:1fr}
.form-grid,.broker-grid{grid-template-columns:repeat(2,1fr)}
.sheet-grid,.history-grid{grid-template-columns:repeat(2,1fr)}
.broker-cards{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:650px){main{padding:12px}
header{padding:12px;height:auto;gap:8px;flex-wrap:wrap}.brand-logo{width:40px;height:40px}
.cards{grid-template-columns:repeat(2,1fr)}
.form-grid,.broker-grid,.sheet-grid,.history-grid{grid-template-columns:1fr}
.toggle{grid-column:auto}
.broker-cards{grid-template-columns:1fr}
.inline.compact{width:100%;flex-wrap:wrap}
.inline.compact input{min-width:0}
.actions button{flex:1}
.strategy{min-width:100%}
}
.strategy .risk{display:grid;grid-template-columns:repeat(2,minmax(90px,1fr));gap:8px;align-items:end}
.strategy .risk input[type=number]{padding:8px;margin:0}
.wide{min-width:0}
.explain{white-space:pre-wrap;background:#071a29;border-radius:10px;padding:12px;color:#bfeaf3;max-height:260px;overflow:auto}
