*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg: #080a0c;--bg-panel: #0d1117;--bg-input: #111820;--border: #1e2a35;--border-hi: #2a3f52;--amber: #e8a020;--amber-dim: #7a5010;--green: #22c55e;--green-dim: #0f4a26;--red: #ef4444;--text-hi: #e8edf2;--text-mid: #8ba0b2;--text-lo: #3d5566;--mono: "IBM Plex Mono", monospace;--sans: "IBM Plex Sans", sans-serif;--radius: 2px;--transition: .15s ease}html{background:var(--bg);color:var(--text-hi);font-family:var(--mono);font-size:14px}body{min-height:100vh}#app{display:flex;flex-direction:column;min-height:100vh}.header{display:flex;align-items:center;justify-content:space-between;padding:16px 32px;border-bottom:1px solid var(--border);background:var(--bg-panel);position:sticky;top:0;z-index:100}.logo{font-size:13px;font-weight:600;letter-spacing:.15em;color:var(--text-hi)}.logo span{color:var(--amber)}.header-right{display:flex;align-items:center;gap:16px}.network-badge{font-size:11px;color:var(--green);letter-spacing:.08em;padding:3px 8px;border:1px solid var(--green-dim);background:#22c55e0f}.btn-connect{font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.08em;color:var(--bg);background:var(--amber);border:none;cursor:pointer;padding:7px 18px;transition:var(--transition)}.btn-connect:hover{background:#f0b030}.btn-connect.connected{background:transparent;color:var(--amber);border:1px solid var(--amber-dim)}.btn-connect.connected:hover{border-color:var(--amber)}.main{flex:1;display:grid;grid-template-columns:1fr 380px;grid-template-rows:auto 1fr;gap:1px;background:var(--border);max-width:1200px;margin:32px auto;width:calc(100% - 64px);border:1px solid var(--border)}@media (max-width: 860px){.main{grid-template-columns:1fr;width:calc(100% - 32px)}}.panel{background:var(--bg-panel);padding:24px}.panel-label{font-size:10px;letter-spacing:.18em;color:var(--text-lo);text-transform:uppercase;margin-bottom:20px;padding-bottom:12px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:8px}.panel-label:before{content:"";display:inline-block;width:6px;height:6px;background:var(--amber)}.stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--border);border:1px solid var(--border);margin-bottom:24px}.stat-cell{background:var(--bg-panel);padding:16px 18px}.stat-label{font-size:10px;letter-spacing:.12em;color:var(--text-lo);text-transform:uppercase;margin-bottom:6px}.stat-value{font-size:22px;font-weight:500;color:var(--text-hi);letter-spacing:-.01em}.stat-value.green{color:var(--green)}.stat-value.amber{color:var(--amber)}.stat-sub{font-size:11px;color:var(--text-mid);margin-top:4px}.position-panel{grid-column:1;display:flex;flex-direction:column;gap:16px}.status-row{display:flex;align-items:center;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--border)}.status-row:last-child{border-bottom:none}.status-key{font-size:11px;color:var(--text-mid);letter-spacing:.06em}.status-val{font-size:12px;color:var(--text-hi);font-weight:500}.badge{font-size:10px;letter-spacing:.1em;padding:3px 8px;font-weight:600;text-transform:uppercase}.badge.in-range{color:var(--green);background:#22c55e1a;border:1px solid var(--green-dim)}.badge.out-range{color:var(--red);background:#ef44441a;border:1px solid #4a1010}.badge.staked{color:var(--amber);background:#e8a0201a;border:1px solid var(--amber-dim)}.badge.beta{color:var(--text-mid);background:transparent;border:1px solid var(--border)}.range-bar-wrap{padding:8px 0 4px}.range-bar-label{font-size:10px;color:var(--text-lo);letter-spacing:.1em;margin-bottom:10px}.range-bar{height:4px;background:var(--bg-input);position:relative;border-radius:0}.range-bar-fill{position:absolute;top:0;bottom:0;background:linear-gradient(90deg,var(--amber-dim),var(--amber));transition:left .5s ease,right .5s ease}.range-bar-tick{position:absolute;top:-4px;width:2px;height:12px;background:var(--green);transform:translate(-50%);transition:left .5s ease}.range-ticks-label{display:flex;justify-content:space-between;font-size:10px;color:var(--text-lo);margin-top:8px}.tir-bar-wrap{margin-top:16px}.tir-bar{height:3px;background:var(--bg-input);margin-top:8px}.tir-bar-fill{height:100%;background:linear-gradient(90deg,var(--green-dim),var(--green));transition:width .8s ease}.log-panel{grid-column:1;grid-row:2;max-height:180px;overflow-y:auto}.log-line{font-size:11px;color:var(--text-mid);padding:5px 0;border-bottom:1px solid var(--border);display:flex;gap:12px;animation:fadeIn .3s ease}.log-line:last-child{border-bottom:none}.log-time{color:var(--text-lo);white-space:nowrap;flex-shrink:0}.log-msg.ok{color:var(--green)}.log-msg.err{color:var(--red)}.log-msg.info{color:var(--amber)}@keyframes fadeIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.action-panel{grid-column:2;grid-row:1 / 3;display:flex;flex-direction:column;gap:24px;border-left:1px solid var(--border)}@media (max-width: 860px){.action-panel{grid-column:1;grid-row:auto;border-left:none;border-top:1px solid var(--border)}.log-panel{grid-row:auto}}.user-balance{background:var(--bg-input);padding:14px 16px;border:1px solid var(--border)}.user-balance-label{font-size:10px;color:var(--text-lo);letter-spacing:.12em;margin-bottom:4px}.user-balance-value{font-size:20px;font-weight:500;color:var(--text-hi)}.user-balance-sub{font-size:11px;color:var(--text-mid);margin-top:2px}.tabs{display:flex;border-bottom:1px solid var(--border)}.tab{flex:1;padding:10px;font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-lo);background:transparent;border:none;cursor:pointer;border-bottom:2px solid transparent;transition:var(--transition)}.tab.active{color:var(--amber);border-bottom-color:var(--amber)}.tab:hover:not(.active){color:var(--text-mid)}.input-group{display:flex;flex-direction:column;gap:8px}.input-label{font-size:10px;letter-spacing:.12em;color:var(--text-lo);text-transform:uppercase;display:flex;justify-content:space-between}.input-label span{color:var(--text-mid)}.input-wrap{position:relative;display:flex;align-items:center}.input-field{width:100%;padding:10px 50px 10px 12px;font-family:var(--mono);font-size:14px;font-weight:500;color:var(--text-hi);background:var(--bg-input);border:1px solid var(--border);outline:none;transition:var(--transition)}.input-field:focus{border-color:var(--amber)}.input-field::placeholder{color:var(--text-lo)}.input-currency{position:absolute;right:12px;font-size:11px;color:var(--text-lo);pointer-events:none}.input-max{position:absolute;right:42px;font-size:10px;color:var(--amber);cursor:pointer;padding:2px 5px;border:1px solid var(--amber-dim);transition:var(--transition)}.input-max:hover{background:#e8a0201a}.slip-row{display:flex;justify-content:space-between;align-items:center;font-size:11px;color:var(--text-lo);padding:4px 0}.btn-action{width:100%;padding:12px;font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;background:var(--amber);color:var(--bg);border:none;cursor:pointer;transition:var(--transition);position:relative;overflow:hidden}.btn-action:hover:not(:disabled){background:#f0b030}.btn-action:disabled{opacity:.4;cursor:not-allowed}.btn-action.loading:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:repeating-linear-gradient(90deg,transparent 0,transparent 20px,rgba(0,0,0,.1) 20px,rgba(0,0,0,.1) 40px);animation:sweep 1s linear infinite}@keyframes sweep{0%{transform:translate(-40px)}to{transform:translate(0)}}.btn-action.withdraw-btn{background:transparent;color:var(--text-mid);border:1px solid var(--border)}.btn-action.withdraw-btn:hover:not(:disabled){color:var(--red);border-color:var(--red);background:#ef44440f}.disclaimer{font-size:10px;color:var(--text-lo);line-height:1.6;padding:12px;background:var(--bg-input);border:1px solid var(--border)}.disclaimer strong{color:var(--amber)}.footer{padding:16px 32px;border-top:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;font-size:10px;color:var(--text-lo);letter-spacing:.08em}.footer a{color:var(--text-lo);text-decoration:none}.footer a:hover{color:var(--amber)}.toast-container{position:fixed;bottom:24px;right:24px;display:flex;flex-direction:column;gap:8px;z-index:9999}.toast{padding:10px 16px;font-size:12px;font-family:var(--mono);border-left:3px solid var(--amber);background:var(--bg-panel);color:var(--text-hi);box-shadow:0 4px 24px #00000080;animation:toastIn .2s ease;max-width:320px}.toast.success{border-color:var(--green)}.toast.error{border-color:var(--red)}@keyframes toastIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.skeleton{background:linear-gradient(90deg,var(--bg-input) 25%,var(--border) 50%,var(--bg-input) 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:2px;display:inline-block}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:var(--bg)}::-webkit-scrollbar-thumb{background:var(--border-hi)}