:root{
  --ink:#070A08;
  --felt:#131A15;
  --felt-2:#1B241D;
  --gold:#34D399;
  --gold-dim:#1F8F63;
  --paper:#F3F6F4;
  --paper-dim:#DCE6E0;
  --ash:#D6DED9;
  --ash-dim:#7E8C84;
  --red:#E5534B;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  background-color:var(--ink);
  background-image:
    linear-gradient(180deg, #0A0F0B 0%, #050705 100%),
    repeating-linear-gradient(0deg, rgba(52,211,153,0.035) 0px, rgba(52,211,153,0.035) 1px, transparent 1px, transparent 3px),
    repeating-linear-gradient(90deg, rgba(52,211,153,0.03) 0px, rgba(52,211,153,0.03) 1px, transparent 1px, transparent 42px),
    repeating-linear-gradient(0deg, rgba(52,211,153,0.03) 0px, rgba(52,211,153,0.03) 1px, transparent 1px, transparent 42px),
    radial-gradient(circle at 15% -10%, rgba(52,211,153,0.10), transparent 42%),
    radial-gradient(circle at 95% 105%, rgba(52,211,153,0.08), transparent 45%);
  color:var(--ash);
  font-family:'Inter',sans-serif;
  min-height:100vh;
  padding:40px 24px 64px;
}
.wrap{max-width:1080px;margin:0 auto;}

header{margin-bottom:36px;display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap;}
.eyebrow{
  font-family:'IBM Plex Mono',monospace;
  font-size:11px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--gold);opacity:0.85;margin-bottom:10px;
}
h1{
  font-family:'Orbitron',sans-serif;
  font-weight:700;
  font-size:clamp(30px,4.6vw,48px);
  color:var(--paper);
  margin:0 0 10px;
  letter-spacing:.02em;
  text-shadow:0 0 22px rgba(52,211,153,0.35);
  background:linear-gradient(180deg, #FFFFFF 0%, #D7E8DC 55%, #A6C8B4 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.sub{color:var(--ash-dim);font-size:15px;max-width:540px;line-height:1.55;}
.header-link{
  font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--gold-dim);
  text-decoration:none;border:1px solid rgba(52,211,153,0.25);border-radius:7px;
  padding:7px 12px;white-space:nowrap;
}
.header-link:hover{color:var(--gold);border-color:var(--gold);}

.grid{display:grid;grid-template-columns:340px 1fr;gap:24px;align-items:start;}
@media (max-width:820px){.grid{grid-template-columns:1fr;}}

.panel{
  background:
    linear-gradient(155deg, rgba(255,255,255,0.05) 0%, rgba(255,255,255,0) 30%),
    linear-gradient(180deg, #172018 0%, #10150F 100%);
  border:1px solid rgba(52,211,153,0.22);
  border-radius:14px;
  padding:22px;
  box-shadow:
    0 0 0 1px rgba(255,255,255,0.02) inset,
    0 18px 40px rgba(0,0,0,0.35),
    0 0 24px rgba(52,211,153,0.05);
  position:relative;
}
.panel h2{
  font-family:'Orbitron',sans-serif;font-weight:600;font-size:16px;color:var(--paper);
  margin:0 0 14px;letter-spacing:.03em;
}
label.field-label{
  display:block;font-family:'IBM Plex Mono',monospace;font-size:11px;
  letter-spacing:.05em;text-transform:uppercase;color:var(--ash-dim);margin:16px 0 6px;
}
label.field-label:first-of-type{margin-top:0;}

textarea{
  width:100%;min-height:120px;resize:vertical;
  background:#0B120D;border:1px solid rgba(52,211,153,0.18);
  border-radius:8px;color:var(--paper);
  font-family:'IBM Plex Mono',monospace;font-size:12.5px;line-height:1.6;
  padding:10px 12px;
}
textarea:focus,input:focus,select:focus{outline:2px solid var(--gold);outline-offset:1px;}
input[type=text],input[type=password],select{
  width:100%;background:#0B120D;border:1px solid rgba(52,211,153,0.18);
  border-radius:8px;color:var(--paper);font-size:13px;padding:9px 12px;
  font-family:'Inter',sans-serif;
}

.file-row{display:flex;gap:10px;align-items:center;}
input[type=file]{display:none;}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-family:'Inter',sans-serif;font-weight:600;font-size:13.5px;
  padding:10px 16px;border-radius:8px;border:1px solid transparent;
  cursor:pointer;transition:transform .12s ease, background .15s ease, box-shadow .15s ease;
  white-space:nowrap;
}
.btn:active{transform:scale(0.97);}
.btn-ghost{background:rgba(52,211,153,0.06);border-color:rgba(52,211,153,0.4);color:var(--paper);}
.btn-ghost:hover{background:rgba(52,211,153,0.12);}
.btn-gold{
  background:linear-gradient(180deg, #7CEDB0 0%, #2ECC71 55%, #1B7A45 100%);
  color:#04140B;
  box-shadow:0 0 0 1px rgba(255,255,255,0.15) inset, 0 4px 14px rgba(46,204,113,0.35);
  text-shadow:0 1px 0 rgba(255,255,255,0.25);
}
.btn-gold:hover{box-shadow:0 0 0 1px rgba(255,255,255,0.2) inset, 0 0 18px rgba(52,211,153,0.55);}
.btn-gold:disabled{background:#2A323C;color:#6B7480;box-shadow:none;text-shadow:none;cursor:not-allowed;}
.btn-block{width:100%;}
.btn-sm{padding:6px 10px;font-size:12px;border-radius:6px;}

.save-row{display:flex;gap:8px;margin-top:16px;}
.save-row input{flex:1;}

.msg{
  margin-top:12px;font-size:12.5px;font-family:'IBM Plex Mono',monospace;
  padding:9px 11px;border-radius:7px;line-height:1.5;
}
.msg-ok{background:rgba(52,211,153,0.10);color:var(--gold);border:1px solid rgba(52,211,153,0.32);}
.msg-err{background:rgba(229,83,75,0.12);color:#F09088;border:1px solid rgba(229,83,75,0.4);}

.group-list{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-direction:column;gap:8px;}
.group-item{
  display:flex;align-items:center;justify-content:space-between;
  background:#0B120D;border:1px solid rgba(52,211,153,0.14);
  border-radius:8px;padding:9px 11px;cursor:pointer;
}
.group-item.active{border-color:var(--gold);background:rgba(52,211,153,0.08);box-shadow:0 0 14px rgba(52,211,153,0.15);}
.group-item .gname{font-size:13px;color:var(--paper);font-weight:500;}
.group-item .gcount{font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--ash-dim);}
.group-item .gactions{display:flex;gap:6px;align-items:center;}
.del-x{
  background:none;border:none;color:var(--ash-dim);cursor:pointer;font-size:15px;
  line-height:1;padding:2px 6px;border-radius:5px;
}
.del-x:hover{color:#F09088;background:rgba(229,83,75,0.12);}
.empty-note{font-size:12.5px;color:var(--ash-dim);padding:10px 2px;}

.draw-head{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:10px;margin-bottom:18px;}
.active-name{font-family:'Orbitron',sans-serif;font-size:18px;color:var(--paper);font-weight:600;letter-spacing:.02em;}
.active-count{font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--ash-dim);}

.draw-btn{
  width:100%;padding:18px;font-size:15px;letter-spacing:.08em;text-transform:uppercase;
  border-radius:12px;margin-bottom:22px;
}

.results-head{display:flex;align-items:center;gap:10px;margin-bottom:14px;}
.copy-status{font-family:'IBM Plex Mono',monospace;font-size:11.5px;color:var(--gold);opacity:0;transition:opacity .2s ease;}
.copy-status.show{opacity:1;}

.tickets{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
@media (max-width:640px){.tickets{grid-template-columns:repeat(2,1fr);}}
.ticket{
  position:relative;border-radius:10px;
  padding:14px 10px 12px;text-align:center;
  background:
    linear-gradient(155deg, rgba(255,255,255,0.5) 0%, rgba(255,255,255,0) 25%),
    linear-gradient(180deg, #FFFFFF 0%, #EAF2ED 55%, #CFE0D6 100%);
  border:1px solid rgba(255,255,255,0.5);
  box-shadow:0 3px 0 rgba(0,0,0,0.25), 0 0 16px rgba(52,211,153,0.12);
  opacity:0;transform:translateY(6px);
  animation:rise .38s ease forwards;
}
.ticket .num{
  font-family:'IBM Plex Mono',monospace;font-size:10px;color:var(--gold-dim);
  letter-spacing:.08em;margin-bottom:6px;
}
.ticket .word{
  font-family:'Orbitron',sans-serif;font-weight:600;font-size:14.5px;color:#0B1A11;
  word-break:break-word;
}
.perf{
  height:1px;margin:10px -10px 0;
  background-image:radial-gradient(circle, #10150F 1.4px, transparent 1.5px);
  background-size:9px 100%;background-position:0 0;
}
@keyframes rise{to{opacity:1;transform:translateY(0);}}

.placeholder-tickets{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
@media (max-width:640px){.placeholder-tickets{grid-template-columns:repeat(2,1fr);}}
.ph{border:1px dashed rgba(52,211,153,0.25);border-radius:10px;min-height:64px;background:rgba(52,211,153,0.02);}

.receipt{
  margin-top:20px;background:#0B120D;border:1px solid rgba(52,211,153,0.22);
  border-radius:10px;padding:14px 16px;
  font-family:'IBM Plex Mono',monospace;font-size:11.5px;color:var(--ash-dim);
  display:flex;flex-wrap:wrap;gap:6px 22px;
  box-shadow:0 0 20px rgba(52,211,153,0.06) inset;
}
.receipt b{color:var(--gold);font-weight:600;}
.receipt .seed{word-break:break-all;color:var(--ash);}

footer{margin-top:34px;font-size:11.5px;color:var(--ash-dim);font-family:'IBM Plex Mono',monospace;line-height:1.6;}

.draw-overlay{
  position:fixed;inset:0;z-index:999;
  background:rgba(3,8,5,0.82);
  backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);
  display:flex;align-items:center;justify-content:center;
}
.draw-modal{
  width:440px;max-width:90vw;padding:30px 28px 26px;
  background:linear-gradient(180deg, #101B12 0%, #0A100B 100%);
  border:1px solid rgba(52,211,153,0.35);border-radius:14px;
  box-shadow:0 0 0 1px rgba(255,255,255,0.02) inset, 0 0 44px rgba(52,211,153,0.16), 0 24px 60px rgba(0,0,0,0.55);
  position:relative;overflow:hidden;
}
.scan-bar{
  position:absolute;top:0;left:-40%;width:40%;height:2px;
  background:linear-gradient(90deg, transparent, rgba(52,211,153,0.9), transparent);
  animation:scan 1.5s linear infinite;
}
@keyframes scan{0%{left:-40%;}100%{left:100%;}}
.draw-lines{
  font-family:'IBM Plex Mono',monospace;font-size:13px;line-height:2.1;
  color:var(--ash-dim);min-height:150px;padding-top:6px;
}
.draw-line{
  opacity:0;transform:translateX(-6px);
  animation:lineIn .32s ease forwards;
  display:flex;gap:9px;align-items:center;
}
.draw-line .tick{color:var(--gold);flex-shrink:0;}
.draw-line.final{color:var(--gold);font-weight:600;}
.draw-line.final .tick{font-size:14px;}
@keyframes lineIn{to{opacity:1;transform:translateX(0);}}

/* --- Admin-only additions --- */
.login-wrap{max-width:380px;margin:120px auto;text-align:center;}
.brand-logo{
  width:128px;height:128px;border-radius:50%;
  object-fit:cover;display:block;margin:0 auto 22px;
  border:2px solid rgba(52,211,153,0.55);
  box-shadow:0 0 0 4px rgba(52,211,153,0.08), 0 0 28px rgba(52,211,153,0.35), 0 10px 24px rgba(0,0,0,0.4);
  background:#fff;
}
.login-wrap h1{font-size:32px;}
.login-box{margin-top:24px;text-align:left;}
.login-box .btn{width:100%;margin-top:14px;}

table.draws{width:100%;border-collapse:collapse;font-family:'IBM Plex Mono',monospace;font-size:11.5px;}
table.draws th{
  text-align:left;color:var(--gold-dim);text-transform:uppercase;letter-spacing:.05em;
  font-size:10px;padding:8px 10px;border-bottom:1px solid rgba(52,211,153,0.2);
}
table.draws td{padding:8px 10px;border-bottom:1px solid rgba(52,211,153,0.08);color:var(--ash);vertical-align:top;}
table.draws td.words{color:var(--paper);}
.table-wrap{max-height:420px;overflow:auto;border-radius:10px;border:1px solid rgba(52,211,153,0.15);}

.top-actions{display:flex;justify-content:flex-end;margin-bottom:20px;}
