:root{--ob-bg: #070b14;--ob-surface: #0e1522;--ob-surface-2: #141d2e;--ob-border: rgba(235, 240, 250, .1);--ob-text: #ebf0fa;--ob-dim: rgba(235, 240, 250, .55);--ob-dimmer: rgba(235, 240, 250, .32);--ob-accent: #5b8cff;--ob-green: #3edc9c;--ob-amber: #f2a33c;--ob-radius: 14px;--ob-sidebar: 250px}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--ob-bg);color:var(--ob-text);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}.brand{font-weight:700;font-size:18px;letter-spacing:-.02em}.brand span{color:var(--ob-accent)}.muted{color:var(--ob-dim)}.auth-shell{min-height:100%;display:grid;place-items:center;padding:24px;background:radial-gradient(1200px 600px at 50% -10%,rgba(91,140,255,.12),transparent 60%),var(--ob-bg)}.auth-card{width:100%;max-width:360px;background:var(--ob-surface);border:1px solid var(--ob-border);border-radius:var(--ob-radius);padding:28px 24px;display:flex;flex-direction:column;gap:10px;box-shadow:0 24px 60px #00000073}.auth-card .brand{font-size:22px}.auth-card p{margin:0 0 8px}label{font-size:13px;color:var(--ob-dim);margin-top:6px}input{width:100%;padding:12px 14px;border-radius:10px;border:1px solid var(--ob-border);background:var(--ob-bg);color:var(--ob-text);font-size:15px;outline:none;transition:border-color .15s ease,box-shadow .15s ease}input:focus{border-color:var(--ob-accent);box-shadow:0 0 0 3px #5b8cff2e}button{margin-top:12px;padding:12px 16px;border-radius:10px;border:none;background:var(--ob-accent);color:#0a1020;font-weight:600;font-size:15px;cursor:pointer;transition:filter .15s ease,opacity .15s ease}button:hover:not(:disabled){filter:brightness(1.08)}button:disabled{opacity:.5;cursor:not-allowed}button.ghost{margin:0;display:inline-flex;align-items:center;justify-content:center;gap:8px;background:transparent;color:var(--ob-dim);border:1px solid var(--ob-border);font-weight:500;padding:9px 14px;font-size:13px}button.ghost:hover:not(:disabled){color:var(--ob-text);filter:none;border-color:var(--ob-dim)}.error{margin-top:6px;padding:10px 12px;border-radius:10px;background:#f2a33c1f;border:1px solid rgba(242,163,60,.3);color:var(--ob-amber);font-size:13px}.layout{display:flex;height:100%}.sidebar{width:var(--ob-sidebar);flex-shrink:0;height:100vh;position:sticky;top:0;display:flex;flex-direction:column;padding:22px 16px;border-right:1px solid var(--ob-border);background:radial-gradient(420px 220px at 20% -5%,rgba(91,140,255,.1),transparent 70%),var(--ob-surface)}.sidebar-brand{font-size:20px;padding:4px 10px 20px}.nav{display:flex;flex-direction:column;gap:4px}.nav-item{margin:0;display:flex;align-items:center;gap:12px;width:100%;padding:10px 12px;border-radius:10px;border:none;background:transparent;color:var(--ob-dim);font-size:14px;font-weight:500;cursor:pointer;text-align:left;transition:background .14s ease,color .14s ease}.nav-item:hover{background:var(--ob-surface-2);color:var(--ob-text);filter:none}.nav-item.is-active{background:#5b8cff24;color:var(--ob-text);box-shadow:inset 2px 0 0 var(--ob-accent)}.nav-item.is-active .nav-icon{color:var(--ob-accent)}.nav-icon{display:inline-flex;color:var(--ob-dimmer)}.nav-item:hover .nav-icon{color:inherit}.nav-label{flex:1}.nav-soon{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--ob-dimmer);border:1px solid var(--ob-border);padding:2px 7px;border-radius:999px}.sidebar-foot{margin-top:auto;padding-top:16px;border-top:1px solid var(--ob-border);display:flex;flex-direction:column;gap:12px}.who{display:flex;align-items:center;gap:8px;font-size:13px;padding:0 4px}.who-dot{width:8px;height:8px;border-radius:50%;background:var(--ob-green);box-shadow:0 0 0 4px #3edc9c29;flex-shrink:0}.main{flex:1;min-width:0;height:100vh;overflow-y:auto}.page{max-width:1140px;margin:0 auto;padding:30px 36px 64px}.page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:24px}h1{font-size:26px;letter-spacing:-.02em;margin:0 0 4px}.page-sub{margin:0;color:var(--ob-dim);font-size:14px}.pill{display:inline-flex;align-items:center;gap:8px;flex-shrink:0;font-size:12px;color:var(--ob-dim);background:var(--ob-surface);border:1px solid var(--ob-border);padding:7px 13px;border-radius:999px}.dot{width:7px;height:7px;border-radius:50%;background:var(--ob-green);box-shadow:0 0 0 3px #3edc9c29}.kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:16px;margin-bottom:16px}.kpi-card{position:relative;overflow:hidden;background:var(--ob-surface);border:1px solid var(--ob-border);border-radius:var(--ob-radius);padding:18px}.kpi-card:before{content:"";position:absolute;inset:0 0 auto 0;height:2px;background:var(--kc, var(--ob-accent));opacity:.8}.accent-blue{--kc: var(--ob-accent)}.accent-green{--kc: var(--ob-green)}.accent-amber{--kc: var(--ob-amber)}.kpi-top{display:flex;align-items:center;justify-content:space-between}.kpi-label{font-size:13px;color:var(--ob-dim)}.delta{font-size:12px;font-weight:600}.delta.up{color:var(--ob-green)}.delta.down{color:var(--ob-amber)}.kpi-value{font-size:30px;font-weight:700;letter-spacing:-.02em;margin:10px 0 14px}.kpi-bottom{display:flex;align-items:flex-end;justify-content:space-between;gap:10px}.kpi-bottom .muted{font-size:12px}.spark{flex-shrink:0}.panels{display:grid;grid-template-columns:1.5fr 1fr;gap:16px}.panel{display:flex;flex-direction:column;background:var(--ob-surface);border:1px solid var(--ob-border);border-radius:var(--ob-radius);padding:20px}.panel-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:18px}.panel-head h2{font-size:15px;margin:0}.panel-head .muted{font-size:12px}.chart{flex:1;display:flex;flex-direction:column}.bars{flex:1;display:flex;align-items:flex-end;gap:7px;min-height:190px}.bar-col{flex:1;height:100%;display:flex;align-items:flex-end}.bar{width:100%;min-height:3px;border-radius:5px 5px 0 0;background:linear-gradient(180deg,var(--ob-accent),rgba(91,140,255,.22))}.bar.is-today{background:linear-gradient(180deg,var(--ob-green),rgba(62,220,156,.22))}.bars-x{display:flex;gap:7px;margin-top:8px}.bar-x{flex:1;text-align:center;font-size:10px;color:var(--ob-dimmer)}.activity{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}.activity li{display:flex;align-items:center;gap:12px;padding:11px 0;border-top:1px solid var(--ob-border)}.activity li:first-child{border-top:none}.avatar{width:34px;height:34px;flex-shrink:0;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:600;color:var(--ob-accent);background:#5b8cff24}.act-main{display:flex;flex-direction:column;min-width:0}.act-main strong{font-weight:600;font-size:14px}.act-main .muted{font-size:12px}.act-right{margin-left:auto;display:flex;flex-direction:column;align-items:flex-end;gap:3px}.amount{font-weight:600;font-size:14px}.act-meta{display:flex;align-items:center;gap:8px}.act-meta .muted{font-size:11px}.status{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;padding:2px 8px;border-radius:999px}.status.succeeded{color:var(--ob-green);background:#3edc9c21}.status.pending{color:var(--ob-amber);background:#f2a33c21}.status.refunded{color:var(--ob-dim);background:#ebf0fa14}.empty-card{text-align:center;padding:56px 24px;border:1px dashed var(--ob-border);border-radius:var(--ob-radius);background:var(--ob-surface)}.empty-badge{display:inline-block;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--ob-accent);background:#5b8cff1f;border:1px solid rgba(91,140,255,.3);padding:4px 10px;border-radius:999px;margin-bottom:14px}.empty-card h2{margin:0 0 6px;font-size:18px}.empty-card p{margin:0}.table-panel{padding:6px 6px 0}.ptable{width:100%;border-collapse:collapse;font-size:14px}.ptable th{text-align:left;font-weight:600;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--ob-dimmer);padding:12px 14px;border-bottom:1px solid var(--ob-border)}.ptable th.num,.ptable td.num{text-align:right}.ptable td{padding:13px 14px;border-bottom:1px solid var(--ob-border)}.ptable tbody tr{cursor:pointer;transition:background .12s ease}.ptable tbody tr:hover{background:var(--ob-surface-2)}.ptable tbody tr:focus-visible{outline:2px solid var(--ob-accent);outline-offset:-2px}.ptable tbody tr:last-child td{border-bottom:none}.ptable td.amount{font-weight:600}.nowrap{white-space:nowrap}.table-foot{display:flex;justify-content:center;padding:14px}.loading-row{padding:28px 6px}.status.ok{color:var(--ob-green);background:#3edc9c21}.status.warn{color:var(--ob-amber);background:#f2a33c21}.status.bad{color:#ff6b6b;background:#ff6b6b1f}.back{margin:0 0 10px;padding:4px 0;background:none;border:none;color:var(--ob-accent);font-size:13px;font-weight:600;cursor:pointer}.back:hover:not(:disabled){filter:brightness(1.12)}.mono{font-family:ui-monospace,SF Mono,Menlo,Consolas,monospace;font-size:13px}.detail-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:16px;align-items:start}.detail-card{background:var(--ob-surface);border:1px solid var(--ob-border);border-radius:var(--ob-radius);padding:16px 20px}.detail-card-title{margin:0 0 4px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--ob-dimmer)}.detail-card .field{display:flex;justify-content:space-between;gap:16px;padding:11px 0;border-bottom:1px solid var(--ob-border)}.detail-card .field:last-child{border-bottom:none}.field-label{color:var(--ob-dim);font-size:13px}.field-value{text-align:right;word-break:break-word}.detail-meta{padding:14px 4px 4px}.meta-list{margin-top:10px;display:flex;flex-direction:column;gap:8px}.meta-row{display:flex;justify-content:space-between;gap:16px}.refund-area{margin-top:18px;display:flex;flex-direction:column;gap:12px}button.danger{margin:0;align-self:flex-start;background:var(--ob-amber);color:#1a1206}.confirm-panel{gap:8px;border-color:#f2a33c66}.confirm-panel h2{margin:0;font-size:16px}.confirm-panel p{margin:0 0 4px;color:var(--ob-dim)}.confirm-panel strong{color:var(--ob-text)}.confirm-panel select{width:100%;padding:10px 12px;border-radius:10px;border:1px solid var(--ob-border);background:var(--ob-bg);color:var(--ob-text);font-size:14px}.confirm-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:6px}.confirm-actions button{margin:0}.refunded-note{color:var(--ob-amber);font-size:14px;font-weight:500}.refund-ok{padding:10px 12px;border-radius:10px;font-size:13px;background:#3edc9c1f;border:1px solid rgba(62,220,156,.3);color:var(--ob-green)}@keyframes rise{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes growUp{0%{transform:scaleY(0)}to{transform:scaleY(1)}}@keyframes drawLine{to{stroke-dashoffset:0}}.rise{animation:rise .5s cubic-bezier(.2,.7,.2,1) backwards;animation-delay:calc(var(--i, 0) * 55ms)}.kpi-card,.detail-card{transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease}.kpi-card:hover,.detail-card:hover{transform:translateY(-3px);box-shadow:0 10px 26px #00000059;border-color:#ebf0fa2e}.bar{transform-origin:bottom;animation:growUp .6s cubic-bezier(.2,.7,.2,1) backwards;animation-delay:calc(var(--i, 0) * 28ms)}.spark-line{stroke-dasharray:1;stroke-dashoffset:1;animation:drawLine 1.1s ease .15s forwards}.ptable tbody tr.prow{animation:fadeIn .4s ease backwards;animation-delay:calc(var(--i, 0) * 28ms)}.confirm-panel{animation:rise .26s ease backwards}@media (prefers-reduced-motion: reduce){.rise,.bar,.ptable tbody tr.prow,.confirm-panel{animation:none}.spark-line{animation:none;stroke-dashoffset:0}.kpi-card,.detail-card{transition:none}.kpi-card:hover,.detail-card:hover{transform:none;box-shadow:none}}@media (max-width: 880px){.layout{flex-direction:column;height:auto}.sidebar{width:100%;height:auto;position:static;flex-direction:row;align-items:center;gap:12px;padding:12px 16px;overflow-x:auto}.sidebar-brand{padding:0 8px 0 4px}.nav{flex-direction:row;flex:1}.nav-soon{display:none}.sidebar-foot{margin:0 0 0 auto;flex-direction:row;align-items:center;gap:14px;padding:0;border-top:none}.who{display:none}.main{height:auto}.page{padding:22px 18px 48px}.panels{grid-template-columns:1fr}.table-panel{overflow-x:auto}.ptable{min-width:520px}}