:root{
  --bg:#15181B; --panel:#1E2226; --panel-raised:#262B30;
  --accent:#F2A63C; --accent-dim:#7A5B26; --accent-2:#3FA796; --warn:#E1543A;
  --text:#ECE9E2; --text-muted:#8D949B; --border:#33393F; --border-soft:#2A2F34;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{background:var(--bg); color:var(--text); font-family:'IBM Plex Sans',sans-serif; min-height:100vh;}
.mono{font-family:'IBM Plex Mono',monospace;}
h1,h2,h3,.disp{font-family:'Oswald',sans-serif; letter-spacing:.02em; text-transform:uppercase; margin:0;}
.app{max-width:1100px; margin:0 auto; padding:18px 16px 60px;}

.brand-mark{width:38px;height:38px; border-radius:4px; background:repeating-linear-gradient(135deg, var(--accent) 0 6px, #1a1d20 6px 12px); box-shadow:0 0 0 2px var(--border);}

/* login */
.login-screen{min-height:100vh; display:flex; align-items:center; justify-content:center; padding:20px;}
.login-card{background:var(--panel); border:1px solid var(--border); border-radius:10px; padding:30px 26px; width:100%; max-width:340px;}
.login-sub{text-align:center; color:var(--text-muted); font-size:12.5px; margin:0 0 22px;}
.login-error{background:rgba(225,84,58,.12); border:1px solid var(--warn); color:#ffb3a4; font-size:12.5px; padding:8px 10px; border-radius:5px; margin-bottom:12px;}

.topbar{display:flex; align-items:center; justify-content:space-between; margin-bottom:18px; flex-wrap:wrap; gap:10px;}
.brand{display:flex; align-items:center; gap:12px;}
.brand h1{font-size:19px; color:var(--text);}
.brand span{display:block; font-family:'IBM Plex Mono',monospace; font-size:11px; color:var(--text-muted); text-transform:none; letter-spacing:0; margin-top:1px;}
.who{font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--text-muted); text-align:right;}
.who b{color:var(--accent);}
.who a{color:var(--text-muted); cursor:pointer; text-decoration:underline; margin-left:8px;}

.tabs{display:flex; gap:4px; margin-bottom:18px; border-bottom:2px solid var(--border); flex-wrap:wrap;}
.tab{font-family:'Oswald',sans-serif; text-transform:uppercase; letter-spacing:.04em; font-size:13px; color:var(--text-muted); background:var(--panel); padding:10px 16px 9px; border:1px solid var(--border); border-bottom:none; border-radius:6px 6px 0 0; cursor:pointer; position:relative; top:2px;}
.tab.active{color:var(--bg); background:var(--accent); border-color:var(--accent); font-weight:600;}
.tab:hover:not(.active){color:var(--text);}

.panel{background:var(--panel); border:1px solid var(--border); border-radius:8px; padding:20px;}
.section-title{font-size:15px; color:var(--accent); margin-bottom:14px; display:flex; align-items:center; gap:8px;}
.section-title .n{font-family:'IBM Plex Mono',monospace; font-size:11px; color:var(--bg); background:var(--accent); width:20px;height:20px; border-radius:3px; display:inline-flex; align-items:center; justify-content:center;}

.grid{display:grid; grid-template-columns:1fr 1fr; gap:14px;}
.grid3{display:grid; grid-template-columns:1fr 1fr 1fr; gap:14px;}
@media(max-width:700px){.grid,.grid3{grid-template-columns:1fr;}}

label{display:block; font-size:11px; text-transform:uppercase; letter-spacing:.05em; color:var(--text-muted); margin-bottom:5px;}
.field{margin-bottom:14px;}
input[type=text],input[type=password],input[type=number],input[type=datetime-local],select,textarea{
  width:100%; background:var(--panel-raised); border:1px solid var(--border); color:var(--text);
  padding:9px 10px; border-radius:5px; font-family:'IBM Plex Sans',sans-serif; font-size:13.5px;
}
input:focus,select:focus,textarea:focus{outline:2px solid var(--accent); outline-offset:1px; border-color:var(--accent);}
textarea{resize:vertical; min-height:56px;}

.btn{font-family:'IBM Plex Sans',sans-serif; font-weight:600; font-size:13px; letter-spacing:.02em; border:1px solid var(--accent); background:transparent; color:var(--accent); padding:8px 14px; border-radius:5px; cursor:pointer;}
.btn:hover{background:rgba(242,166,60,.12);}
.btn.solid{background:var(--accent); color:var(--bg);}
.btn.solid:hover{background:#ffb84f;}
.btn.ghost{border-color:var(--border); color:var(--text-muted);}
.btn.ghost:hover{color:var(--text); border-color:var(--text-muted);}
.btn.danger{border-color:var(--warn); color:var(--warn);}
.btn.danger:hover{background:rgba(225,84,58,.12);}
.btn.small{padding:5px 10px; font-size:11.5px;}
.btn:disabled{opacity:.4; cursor:not-allowed;}

.chiprow{display:flex; flex-wrap:wrap; gap:6px; margin-top:8px;}
.chip{background:var(--panel-raised); border:1px solid var(--border); border-radius:20px; padding:4px 6px 4px 12px; font-size:12.5px; display:flex; align-items:center; gap:8px;}
.chip button{background:none; border:none; color:var(--text-muted); cursor:pointer; font-size:14px; line-height:1; padding:2px 4px;}
.chip button:hover{color:var(--warn);}
.addrow{display:flex; gap:8px;}
.addrow input{flex:1;}

.ticket{display:inline-flex; align-items:center; gap:6px; font-family:'IBM Plex Mono',monospace; font-size:12.5px; color:var(--accent); background:var(--panel-raised); border:1px dashed var(--accent-dim); border-radius:4px; padding:3px 9px;}
.divider{border:none; border-top:1px dashed var(--border); margin:18px 0;}

.act-row{display:grid; grid-template-columns:1fr 90px 32px; gap:8px; align-items:center; margin-bottom:8px;}
.act-total{display:flex; justify-content:space-between; align-items:center; margin-top:10px; padding-top:10px; border-top:1px solid var(--border); font-family:'IBM Plex Mono',monospace;}
.act-total b{color:var(--accent); font-size:16px;}
.actions-row{display:flex; gap:10px; justify-content:flex-end; margin-top:18px; flex-wrap:wrap;}

.filters{display:flex; gap:10px; flex-wrap:wrap; margin-bottom:16px;}
.filters input,.filters select{width:auto; min-width:150px;}
.order-card{background:var(--panel-raised); border:1px solid var(--border); border-radius:7px; padding:14px 16px; margin-bottom:10px; cursor:pointer; transition:border-color .15s;}
.order-card:hover{border-color:var(--accent-dim);}
.order-top{display:flex; justify-content:space-between; align-items:flex-start; gap:12px; flex-wrap:wrap;}
.order-client{font-weight:600; font-size:14.5px;}
.order-meta{font-size:12px; color:var(--text-muted); margin-top:3px;}
.badge{font-family:'IBM Plex Mono',monospace; font-size:10.5px; text-transform:uppercase; letter-spacing:.04em; padding:3px 8px; border-radius:3px; border:1px solid; white-space:nowrap;}
.badge.recibido{color:var(--text-muted); border-color:var(--border);}
.badge.proceso{color:var(--accent); border-color:var(--accent-dim); background:rgba(242,166,60,.08);}
.badge.terminado{color:var(--accent-2); border-color:#215048; background:rgba(63,167,150,.1);}
.empty{color:var(--text-muted); font-size:13px; text-align:center; padding:30px 10px;}
.timer{font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--accent); margin-top:6px;}

.modal-bg{position:fixed; inset:0; background:rgba(0,0,0,.6); display:flex; align-items:flex-start; justify-content:center; padding:30px 14px; overflow-y:auto; z-index:50;}
.modal{background:var(--panel); border:1px solid var(--border); border-radius:8px; padding:22px; width:100%; max-width:640px;}
.modal-close{float:right; background:none; border:none; color:var(--text-muted); font-size:20px; cursor:pointer;}
.hist-item{font-size:12px; color:var(--text-muted); padding:7px 0; border-bottom:1px solid var(--border-soft);}
.hist-item b{color:var(--text);}

table{width:100%; border-collapse:collapse; font-size:13px;}
th,td{text-align:left; padding:8px 10px; border-bottom:1px solid var(--border-soft);}
th{color:var(--text-muted); font-weight:500; text-transform:uppercase; font-size:10.5px; letter-spacing:.04em;}
tr:hover td{background:rgba(255,255,255,.02);}

.stat-card{background:var(--panel-raised); border:1px solid var(--border); border-radius:7px; padding:16px;}
.stat-num{font-family:'IBM Plex Mono',monospace; font-size:26px; color:var(--accent); font-weight:600;}
.stat-label{font-size:11px; color:var(--text-muted); text-transform:uppercase; letter-spacing:.04em; margin-top:4px;}

.rank-row{display:flex; align-items:center; gap:14px; padding:12px 0; border-bottom:1px solid var(--border-soft);}
.rank-pos{font-family:'Oswald',sans-serif; font-size:20px; width:34px; height:34px; border-radius:50%; display:flex; align-items:center; justify-content:center; flex:0 0 auto; font-weight:600;}
.rank-1{background:var(--accent); color:var(--bg);}
.rank-2{background:#B0B6BB; color:var(--bg);}
.rank-3{background:#8C6A3F; color:var(--bg);}
.rank-name{font-weight:600; flex:1;}
.rank-score{font-family:'IBM Plex Mono',monospace; color:var(--text-muted); font-size:12px;}
.rank-bonus{font-family:'IBM Plex Mono',monospace; color:var(--accent-2); font-weight:600; font-size:13.5px;}

.note{font-size:12px; color:var(--text-muted); background:var(--panel-raised); border-left:2px solid var(--accent-dim); padding:9px 12px; border-radius:0 4px 4px 0; margin-top:14px;}
.toast{position:fixed; bottom:20px; left:50%; transform:translateX(-50%); background:var(--panel-raised); border:1px solid var(--accent-dim); color:var(--text); padding:10px 18px; border-radius:6px; font-size:13px; z-index:100; box-shadow:0 4px 20px rgba(0,0,0,.4);}
