:root{--bg: #0a0e13;--surface: #111820;--surface2: #19232e;--border: #1e2d3d;--accent: #00d4aa;--accent2: #ff6b35;--accent3: #ffd700;--text: #e8f0f7;--text2: #7a92a8;--text3: #3d5166;--danger: #ff4444;--radius: 10px;--font-display: "Bebas Neue", sans-serif;--font-mono: "DM Mono", monospace;--font-body: "DM Sans", sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg);color:var(--text);font-family:var(--font-body);min-height:100vh;overflow-x:hidden}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background-image:linear-gradient(var(--border) 1px,transparent 1px),linear-gradient(90deg,var(--border) 1px,transparent 1px);background-size:40px 40px;opacity:.3;pointer-events:none;z-index:0}#root{position:relative;z-index:1}.sidebar{position:fixed;left:0;top:0;bottom:0;width:220px;background:var(--surface);border-right:1px solid var(--border);display:flex;flex-direction:column;z-index:100}.sidebar-logo{padding:28px 24px 20px;border-bottom:1px solid var(--border)}.brand{font-family:var(--font-display);font-size:32px;letter-spacing:3px;color:var(--accent);line-height:1}.tagline{font-size:10px;color:var(--text3);letter-spacing:2px;text-transform:uppercase;margin-top:4px;font-family:var(--font-mono)}.nav{flex:1;padding:16px 0}.nav-item{display:flex;align-items:center;gap:10px;padding:11px 24px;cursor:pointer;color:var(--text2);font-size:13.5px;font-weight:500;transition:all .15s;border-left:3px solid transparent;letter-spacing:.3px}.nav-item:hover{color:var(--text);background:var(--surface2)}.nav-item.active{color:var(--accent);background:#00d4aa12;border-left-color:var(--accent)}.nav-item .icon{font-size:16px;width:20px;text-align:center}.status-dot{width:7px;height:7px;border-radius:50%;background:var(--text3);margin-left:auto}.status-dot.live{background:var(--accent);box-shadow:0 0 8px var(--accent);animation:pulse 2s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}.main{margin-left:220px;min-height:100vh;padding:32px 36px}.page-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:28px}.page-title{font-family:var(--font-display);font-size:36px;letter-spacing:2px;color:var(--text)}.page-title span{color:var(--accent)}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:24px;margin-bottom:20px}.card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;padding-bottom:14px;border-bottom:1px solid var(--border)}.card-title{font-family:var(--font-mono);font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--text2)}.stats-row{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:28px}.stat-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:20px 22px;position:relative;overflow:hidden}.stat-card:after{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--accent)}.stat-card:nth-child(2):after{background:var(--accent2)}.stat-card:nth-child(3):after{background:var(--accent3)}.stat-card:nth-child(4):after{background:#9b59b6}.stat-label{font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--text3);font-family:var(--font-mono);margin-bottom:8px}.stat-value{font-family:var(--font-display);font-size:36px;letter-spacing:1px;line-height:1}.btn{display:inline-flex;align-items:center;gap:7px;padding:9px 18px;border-radius:7px;border:none;cursor:pointer;font-family:var(--font-body);font-size:13px;font-weight:600;transition:all .15s;letter-spacing:.3px;text-decoration:none}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--accent);color:#0a0e13}.btn-primary:hover:not(:disabled){background:#00f0c4;transform:translateY(-1px)}.btn-danger{background:#ff444426;color:var(--danger);border:1px solid rgba(255,68,68,.3)}.btn-danger:hover:not(:disabled){background:#ff444440}.btn-ghost{background:var(--surface2);color:var(--text2);border:1px solid var(--border)}.btn-ghost:hover:not(:disabled){color:var(--text);border-color:var(--text3)}.btn-orange{background:#ff6b3526;color:var(--accent2);border:1px solid rgba(255,107,53,.3)}.btn-orange:hover:not(:disabled){background:#ff6b3540}.btn-sm{padding:6px 12px;font-size:12px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.form-grid.cols-3{grid-template-columns:1fr 1fr 1fr}.form-full{grid-column:1 / -1}.form-group{display:flex;flex-direction:column;gap:7px}label{font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:var(--text2);font-family:var(--font-mono)}input,textarea,select{background:var(--surface2);border:1px solid var(--border);border-radius:7px;padding:10px 14px;color:var(--text);font-family:var(--font-body);font-size:14px;outline:none;transition:border-color .15s;width:100%}input:focus,textarea:focus,select:focus{border-color:var(--accent)}textarea{resize:vertical;min-height:80px}select option{background:var(--surface2)}small{font-size:11px;color:var(--text3)}.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse;font-size:13.5px}th{text-align:left;padding:10px 14px;font-family:var(--font-mono);font-size:10px;letter-spacing:1.5px;text-transform:uppercase;color:var(--text3);border-bottom:1px solid var(--border)}td{padding:12px 14px;border-bottom:1px solid rgba(30,45,61,.5);color:var(--text);vertical-align:middle}tr:hover td{background:#19232e80}.badge{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;border-radius:20px;font-size:11px;font-weight:600;font-family:var(--font-mono);letter-spacing:.5px}.badge-active{background:#00d4aa1f;color:var(--accent);border:1px solid rgba(0,212,170,.25)}.badge-ended{background:#78828c1f;color:var(--text2);border:1px solid var(--border)}.badge-no-winner{background:#ff44441a;color:var(--danger);border:1px solid rgba(255,68,68,.2)}.auction-live-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;margin-bottom:16px;transition:border-color .2s}.auction-live-card:hover{border-color:var(--accent)}.alc-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--border);background:var(--surface2)}.alc-lot{font-family:var(--font-mono);font-size:11px;color:var(--text3);letter-spacing:1px;text-transform:uppercase}.alc-name{font-weight:600;font-size:15px;margin-top:2px}.alc-price{font-family:var(--font-display);font-size:30px;letter-spacing:1px;color:var(--accent)}.alc-body{padding:16px 20px}.alc-meta{display:flex;gap:24px;font-size:12px;color:var(--text2);margin-bottom:12px}.alc-meta span{font-family:var(--font-mono)}.alc-actions{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap}.countdown{font-family:var(--font-display);font-size:20px;letter-spacing:2px}.countdown.danger{color:var(--danger)}.countdown.warning{color:var(--accent3)}.countdown.ok{color:var(--accent)}.bid-list{max-height:220px;overflow-y:auto}.bid-item{display:flex;align-items:center;justify-content:space-between;padding:8px 0;border-bottom:1px solid rgba(30,45,61,.5);font-size:13px}.bid-user{color:var(--text)}.bid-time{color:var(--text3);font-family:var(--font-mono);font-size:11px}.bid-amount{font-family:var(--font-mono);font-weight:600}.winner-card{background:linear-gradient(135deg,#00d4aa14,#00d4aa05);border:1px solid rgba(0,212,170,.2);border-radius:var(--radius);padding:20px;display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:12px;gap:16px}.wc-info{flex:1}.wc-name{font-size:16px;font-weight:600}.wc-username{font-size:12px;color:var(--text2);font-family:var(--font-mono)}.wc-lot{font-size:12px;color:var(--text3);margin-top:4px}.wc-price{font-family:var(--font-display);font-size:28px;color:var(--accent);letter-spacing:1px;text-align:right;white-space:nowrap}.wc-actions{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}#toast-container{position:fixed;bottom:28px;right:28px;display:flex;flex-direction:column;gap:10px;z-index:9999}.toast{background:var(--surface2);border:1px solid var(--border);border-radius:8px;padding:12px 18px;font-size:13.5px;max-width:320px;animation:slideIn .3s ease;box-shadow:0 8px 24px #0006}.toast.success{border-left:3px solid var(--accent)}.toast.error{border-left:3px solid var(--danger)}.toast.info{border-left:3px solid #4a9eff}@keyframes slideIn{0%{transform:translate(40px);opacity:0}to{transform:translate(0);opacity:1}}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:1000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.modal{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:28px;width:90%;max-width:600px;max-height:85vh;overflow-y:auto;position:relative}.modal-title{font-family:var(--font-display);font-size:24px;letter-spacing:1px;margin-bottom:20px}.modal-close{position:absolute;top:16px;right:16px;background:var(--surface2);border:1px solid var(--border);border-radius:6px;color:var(--text2);cursor:pointer;width:32px;height:32px;display:flex;align-items:center;justify-content:center;font-size:16px}.modal-close:hover{color:var(--text)}.tabs{display:flex;gap:4px;margin-bottom:24px;border-bottom:1px solid var(--border)}.tab{padding:10px 18px;cursor:pointer;font-size:13px;font-weight:500;color:var(--text2);border-bottom:2px solid transparent;transition:all .15s;margin-bottom:-1px}.tab:hover{color:var(--text)}.tab.active{color:var(--accent);border-bottom-color:var(--accent)}.divider{border:none;border-top:1px solid var(--border);margin:20px 0}.invoice-box{background:var(--surface2);border:1px solid var(--border);border-radius:8px;padding:18px;font-family:var(--font-mono);font-size:13px;white-space:pre-line;line-height:1.8;color:var(--text)}.empty-state{text-align:center;padding:60px 20px;color:var(--text3)}.empty-state .emoji{font-size:48px;margin-bottom:12px}.conn-badge{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-family:var(--font-mono);color:var(--text3);padding:5px 10px;background:var(--surface2);border:1px solid var(--border);border-radius:20px}.conn-dot{width:6px;height:6px;border-radius:50%;background:var(--text3)}.conn-dot.connected{background:var(--accent)}code{background:var(--surface2);padding:2px 6px;border-radius:4px;font-family:var(--font-mono);font-size:12px;color:var(--accent2)}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--text3)}.mobile-header,.sidebar-overlay{display:none}@media (max-width: 768px){.mobile-header{display:flex;align-items:center;justify-content:space-between;position:fixed;top:0;left:0;right:0;height:56px;background:var(--surface);border-bottom:1px solid var(--border);padding:0 16px;z-index:200}.mobile-header .brand{font-size:22px;letter-spacing:2px}.mobile-hamburger{background:var(--surface2);border:1px solid var(--border);border-radius:7px;color:var(--text2);cursor:pointer;width:38px;height:38px;display:flex;align-items:center;justify-content:center;font-size:18px}.sidebar{transform:translate(-220px);transition:transform .25s cubic-bezier(.4,0,.2,1);z-index:300;box-shadow:none}.sidebar.mobile-open{transform:translate(0);box-shadow:4px 0 32px #0009}.sidebar-overlay{display:block;position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;z-index:250;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.main{margin-left:0;padding:72px 14px 28px}.stats-row{grid-template-columns:1fr 1fr;gap:10px}.stat-value{font-size:28px}.form-grid,.form-grid.cols-3{grid-template-columns:1fr}.card{padding:16px}.page-header{margin-bottom:18px}.page-title{font-size:28px}.alc-header{flex-wrap:wrap;gap:8px}.alc-price{font-size:24px}.alc-meta{gap:12px;flex-wrap:wrap}.winner-card{padding:14px}.wc-price{font-size:22px}.modal-overlay{align-items:flex-end}.modal{width:100%;max-width:100%;max-height:92vh;border-radius:16px 16px 0 0;padding:20px 16px 32px}#toast-container{bottom:16px;right:12px;left:12px}.toast{max-width:100%}.bid-list{max-height:180px}.table-wrap{-webkit-overflow-scrolling:touch}.btn{min-height:38px}.btn-sm{min-height:32px}.tabs{overflow-x:auto;-webkit-overflow-scrolling:touch;flex-wrap:nowrap}.tab{white-space:nowrap}.sidebar-close-btn{display:block!important}}
