.portal-back-link{display:inline-flex;align-items:center;gap:8px;margin:0 0 14px;color:#ffe7a1;text-decoration:none;border:1px solid rgba(216,173,85,.3);background:rgba(216,173,85,.08);border-radius:999px;padding:10px 13px;font-size:13px;font-weight:800}
.portal-back-link:active{transform:translateY(1px)}
:root {
  --bg0: #050505;
  --bg1: #111111;
  --panel: rgba(18, 18, 18, .94);
  --card: rgba(17, 17, 17, .86);
  --card2: #1f1f1d;
  --gold: #d5a141;
  --gold2: #ffe4a0;
  --border: rgba(214, 161, 58, .34);
  --cream: #fff4df;
  --muted: #c7b99d;
  --dim: #8c806c;
  --mint: #38f0a4;
  --bad: #ff7f8e;
  --warn: #ffca72;
}

* { box-sizing: border-box; }
html { background: var(--bg0); }
body {
  margin: 0;
  min-height: 100vh;
  font-family: -apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  color: var(--cream);
  background:
    radial-gradient(circle at 50% -10%, rgba(157, 104, 25, .42), transparent 40%),
    radial-gradient(circle at 15% 20%, rgba(70, 45, 17, .28), transparent 32%),
    linear-gradient(180deg, #101010 0%, #050505 100%);
}

.shell { width: min(560px, calc(100% - 26px)); margin: 18px auto 70px; }
.topline {
  min-height:44px;
  display: flex;
  justify-content: space-between;
  align-items:center;
  gap:12px;
  color: var(--muted);
  letter-spacing: .04em;
  font-weight: 800;
  margin: 0 8px 12px;
}
.form-card {
  border: 1px solid var(--border);
  border-radius: 44px;
  background: linear-gradient(180deg, rgba(28,28,27,.96), rgba(10,10,10,.96));
  box-shadow: 0 30px 90px rgba(0,0,0,.48), inset 0 1px 0 rgba(255,255,255,.05);
  padding: 0;
  overflow:hidden;
}
.form-card form{padding:0 22px 22px}

.intro { padding: 28px 24px 18px; border-bottom: 0; margin-bottom: 0; background:radial-gradient(circle at 80% -10%,rgba(255,224,142,.22),transparent 38%),linear-gradient(180deg,rgba(255,255,255,.05),transparent); }
.intro:after{content:"";display:block;height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent);margin:22px 0 0}
.pill {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 8px 13px;
  border: 1px solid var(--border);
  border-radius: 999px;
  color: var(--gold2);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .16em;
}
.pill span { width: 8px; height: 8px; border-radius: 99px; background: var(--mint); box-shadow: 0 0 18px var(--mint); }
h1 {
  margin: 18px 0 8px;
  font-size: clamp(42px, 7vw, 76px);
  line-height: .92;
  letter-spacing: -.055em;
}
p { color: var(--muted); font-size: 17px; line-height: 1.55; max-width: 820px; }
.step-card {
  border: 1px solid var(--border);
  border-radius: 28px;
  background: linear-gradient(180deg, rgba(18,18,18,.92), rgba(10,10,10,.84));
  padding: 18px;
  margin: 14px 0;
}
.step-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 15px;
}
h2 { margin: 0; color: var(--cream); font-size: 18px; letter-spacing: -.01em; }
.step-head strong { color: var(--gold); letter-spacing: .14em; font-size: 12px; }
.grid.two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.wide { grid-column: 1 / -1; }
label { display: grid; gap: 7px; color: #f3d99d; font-weight: 800; font-size: 13px; }
input, select, textarea, button {
  font: inherit;
  border-radius: 15px;
}
input, select, textarea {
  width: 100%;
  background: #202020;
  color: var(--cream);
  border: 1px solid rgba(214,161,58,.32);
  padding: 13px 14px;
  outline: none;
}
input::placeholder, textarea::placeholder { color: var(--dim); }
input:focus, select:focus, textarea:focus {
  border-color: var(--gold2);
  box-shadow: 0 0 0 3px rgba(214,161,58,.18);
}
.notice {
  margin-top: 14px;
  padding: 13px;
  border: 1px solid rgba(56,240,164,.25);
  border-radius: 16px;
  color: var(--mint);
  background: rgba(56,240,164,.06);
  font-weight: 800;
}
.picture-card { border-color: rgba(255,231,163,.48); background: linear-gradient(180deg, rgba(63,42,11,.48), rgba(12,10,7,.9)); }
.picture-help { margin: 0 0 14px; font-weight: 800; color: var(--gold2); }
.picture-actions { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: end; margin-bottom: 14px; }
.picture-upload {
  display: grid;
  place-items: center;
  min-height: 76px;
  border: 2px dashed rgba(255,231,163,.55);
  border-radius: 20px;
  background: rgba(255,231,163,.08);
  color: var(--gold2);
  font-size: 22px;
  text-align: center;
}
.picture-upload input { position: absolute; inline-size: 1px; block-size: 1px; opacity: 0; pointer-events: none; }
.picture-preview { margin: 8px 0 14px; border: 1px solid var(--border); border-radius: 18px; overflow: hidden; background: rgba(0,0,0,.25); }
.picture-preview img { display: block; width: 100%; max-height: 420px; object-fit: contain; }
.toolbar { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 15px; }
.toolbar.stacked button { flex: 1 1 180px; }
button {
  cursor: pointer;
  border: 1px solid var(--border);
  background: #090705;
  color: var(--gold2);
  padding: 13px 16px;
  font-weight: 900;
}
button.primary {
  color: #1b1205;
  border-color: #f7ca68;
  background: linear-gradient(90deg, #ffe7a3, #c88d2d);
}
.status {
  border-radius: 17px;
  padding: 13px 15px;
  margin-bottom: 14px;
  border: 1px solid var(--border);
  background: rgba(214,161,58,.08);
  color: var(--muted);
  font-weight: 900;
}
.status.ok { color: var(--mint); border-color: rgba(56,240,164,.45); background: rgba(56,240,164,.07); }
.status.warning { color: var(--warn); border-color: rgba(255,202,114,.5); background: rgba(255,202,114,.07); }
.status.issue { color: var(--bad); border-color: rgba(255,127,142,.5); background: rgba(255,127,142,.08); }
.table-wrap { overflow-x: auto; border: 1px solid var(--border); border-radius: 18px; -webkit-overflow-scrolling: touch; }
table { width: 100%; min-width: 1050px; border-collapse: collapse; }
th, td { border-bottom: 1px solid rgba(214,161,58,.16); padding: 9px; text-align: left; vertical-align: middle; }
th { color: var(--gold2); background: rgba(0,0,0,.35); font-size: 12px; letter-spacing: .06em; text-transform: uppercase; }
td.fixed { color: var(--cream); font-weight: 950; background: rgba(255,255,255,.025); }
td.expected { color: var(--mint); font-weight: 900; }
td input { min-width: 120px; padding: 10px 11px; }
.row-status { min-width: 220px; font-size: 12px; font-weight: 900; }
tr.ok { background: rgba(56,240,164,.035); }
tr.warning { background: rgba(255,202,114,.075); }
tr.issue { background: rgba(255,127,142,.09); }
tr.blank, tr.inactive { opacity: .42; background: rgba(255,255,255,.018); }
tr.inactive input { background: transparent; border-color: transparent; color: transparent; }
.notes { margin-top: 14px; }
.inline { display: flex; align-items: center; gap: 8px; color: var(--gold2); }
.inline input { width: auto; }

@media (max-width: 1100px) {
  .shell { width:100%; max-width:586px; margin-top:12px; padding-left:13px; padding-right:13px; }
  .grid.two { grid-template-columns: 1fr; }
  .toolbar button { width: 100%; }
  .picture-actions { grid-template-columns: 1fr; }
  .picture-upload { min-height: 88px; font-size: 24px; }
  .form-card { border-radius: 34px; padding:0; }
  .form-card form{padding:0 14px 18px}
  h1 { font-size: clamp(34px, 12vw, 52px); }

  /* Phone layout: no sideways dragging. Each lottery row becomes a card. */
  .table-wrap { overflow-x: visible; border: 0; }
  table, thead, tbody, tr, th, td { display: block; width: 100%; }
  table { min-width: 0; border-collapse: separate; border-spacing: 0; }
  thead { display: none; }
  tbody { display: grid; gap: 12px; }
  tr {
    border: 1px solid rgba(214,161,58,.28);
    border-radius: 18px;
    background: rgba(255,255,255,.035);
    padding: 12px;
  }
  th, td { border-bottom: 0; padding: 7px 0; }
  td { display: grid; grid-template-columns: 108px minmax(0, 1fr); gap: 10px; align-items: center; }
  td::before { color: var(--gold2); font-size: 11px; font-weight: 950; letter-spacing: .05em; text-transform: uppercase; }
  td:nth-child(1)::before { content: 'Bin'; }
  td:nth-child(2)::before { content: 'Game'; }
  td:nth-child(3)::before { content: 'Serial'; }
  td:nth-child(4)::before { content: '# Per'; }
  td:nth-child(5)::before { content: 'Amount'; }
  td:nth-child(6)::before { content: 'Expected'; }
  td:nth-child(7)::before { content: 'Number'; }
  td:nth-child(8)::before { content: 'Note'; }
  td:nth-child(9)::before { content: 'Status'; }
  td input { min-width: 0; width: 100%; font-size: 16px; }
  .row-status { min-width: 0; font-size: 12px; overflow-wrap: anywhere; }
  .step-head { align-items: flex-start; }

}

@media print {
  body { background: white; color: black; }
  .topline, .intro, .actions { display: none; }
  .shell { width: 100%; margin: 0; }
  .form-card, .step-card { border: none; box-shadow: none; padding: 0; background: white; }
  input, select, textarea { color: black; border: none; background: white; }
  th { color: black; background: #ddd; }
}

.manual-toggle{width:100%;margin:10px 0 4px;border-radius:20px;border-color:rgba(255,231,163,.45);background:rgba(255,231,163,.08);color:var(--gold2);font-size:17px;padding:16px}.manual-section{animation:fadeIn .18s ease-out}.modal-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.72);display:grid;place-items:center;padding:18px;z-index:9999}.modal-card{width:min(520px,100%);border:1px solid var(--border);border-radius:26px;background:linear-gradient(180deg,#24201a,#090807);box-shadow:0 30px 90px rgba(0,0,0,.65);padding:22px}.modal-card h2{font-size:24px;margin-bottom:8px}.modal-card p{font-size:15px;margin:0 0 14px}.correction-fields{display:grid;gap:12px;margin:14px 0}.correction-row-card{display:grid!important;gap:8px;padding:14px;border:2px solid rgba(255,231,163,.45);border-radius:18px;background:rgba(255,231,163,.10);font-size:15px}.correction-row-title{display:block;color:#ffe7a1;font-size:28px;font-weight:1000;letter-spacing:.04em;text-transform:uppercase}.correction-row-meta{display:block;color:#fff;font-size:16px;font-weight:800}.correction-row-help{display:block;color:#ffe7a1;font-size:15px;font-weight:900}.correction-fields input{font-size:28px;text-align:center;letter-spacing:.12em}.modal-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.modal-backdrop[hidden],.manual-section[hidden]{display:none!important}@keyframes fadeIn{from{opacity:.6;transform:translateY(-4px)}to{opacity:1;transform:none}}@media(max-width:700px){.modal-actions{grid-template-columns:1fr}.modal-card{padding:18px}.correction-row-title{font-size:25px}.correction-fields input{font-size:24px}}


.theme-toggle{appearance:none;border:1px solid rgba(216,173,85,.36);background:rgba(216,173,85,.10);color:#ffe7a1;border-radius:999px;padding:8px 11px;font:900 12px -apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Segoe UI",Roboto,Helvetica,Arial,sans-serif;letter-spacing:.02em;min-height:36px;box-shadow:none;cursor:pointer}.theme-toggle:active{transform:translateY(1px)}
body.theme-light{--bg:#fbfaf7;--ink:#181716;--muted:#6f675d;--line:rgba(35,26,15,.13);--gold:#b78631;--gold2:#7a4f12;--panel:rgba(255,255,255,.92);--panel2:rgba(249,244,235,.94);--cream:#181716;--card:#fffaf0;color:var(--ink)!important;background:radial-gradient(circle at 16% -10%,rgba(201,164,92,.20),transparent 30%),linear-gradient(135deg,#fbfaf7 0%,#f4efe6 52%,#efe7da 100%)!important}body.theme-light:before,body.theme-light.noise:before{opacity:.10;mix-blend-mode:multiply}body.theme-light .statusbar,body.theme-light .topline{color:#6f675d!important}body.theme-light .app,body.theme-light .form-card{background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(249,244,235,.94))!important;border-color:rgba(35,26,15,.13)!important;box-shadow:0 18px 60px rgba(17,17,17,.10),inset 0 1px 0 rgba(255,255,255,.72)!important}body.theme-light .hero,body.theme-light .intro{background:radial-gradient(circle at 80% -10%,rgba(201,164,92,.22),transparent 38%),linear-gradient(180deg,rgba(255,255,255,.76),transparent)!important}body.theme-light .card,body.theme-light .step-card,body.theme-light .choice,body.theme-light .food-card,body.theme-light .history-card{background:rgba(255,255,255,.88)!important;border-color:rgba(35,26,15,.13)!important;color:var(--ink)!important;box-shadow:0 10px 28px rgba(17,17,17,.055)!important}body.theme-light h1,body.theme-light h2,body.theme-light h3,body.theme-light label,body.theme-light .copy h2,body.theme-light td.fixed{color:var(--ink)!important}body.theme-light p,body.theme-light .sub,body.theme-light .history-meta,body.theme-light .item-sub,body.theme-light .row-status{color:var(--muted)!important}body.theme-light input,body.theme-light select,body.theme-light textarea{background:rgba(255,255,255,.84)!important;color:var(--ink)!important;border-color:rgba(35,26,15,.14)!important}body.theme-light input::placeholder,body.theme-light textarea::placeholder{color:#9b9285!important}body.theme-light .portal-back-link,body.theme-light .theme-toggle,body.theme-light .badge,body.theme-light .pill{background:rgba(201,164,92,.12)!important;color:#7a4f12!important;border-color:rgba(201,164,92,.34)!important}body.theme-light button:not(.primary):not([type="submit"]),body.theme-light .secondary,body.theme-light .ghost{background:rgba(24,23,22,.06)!important;color:var(--ink)!important;border-color:rgba(35,26,15,.14)!important}body.theme-light button.primary,body.theme-light button[type="submit"]{background:linear-gradient(135deg,#f4dfaa,#c9a45c)!important;color:#170f05!important;border-color:#c9a45c!important}body.theme-light .notice,body.theme-light .status{background:rgba(201,164,92,.10)!important;color:#6f675d!important;border-color:rgba(201,164,92,.24)!important}body.theme-light table,body.theme-light tr{background:rgba(255,255,255,.78)!important}body.theme-light th{background:rgba(35,26,15,.06)!important;color:#7a4f12!important}body.theme-light .footer{color:#7a4f12!important}body.theme-light .icon,.theme-light .arrow{color:#7a4f12!important}


.theme-toggle{width:auto!important;max-width:max-content!important;min-width:96px!important;height:40px!important;min-height:40px!important;padding:0 13px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important}

body,input,select,textarea,button{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Segoe UI",Roboto,Helvetica,Arial,sans-serif!important}