*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at 12% 8%,#124f5359,transparent 35%),radial-gradient(circle at 95% 95%,#27488055,transparent 40%),#101522;color:#eef4fb;font:16px/1.5 Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}main{width:min(620px,calc(100% - 32px));margin:7vh auto 5vh}.eyebrow{color:#65ddc8;font-size:12px;font-weight:800;letter-spacing:.22em;margin-bottom:24px}.eyebrow span{color:#708aa1}h1{font-size:clamp(40px,7vw,66px);line-height:1.08;letter-spacing:-.055em;margin:0 0 18px}h1 span{background:linear-gradient(100deg,#77ead4,#75a9ed);background-clip:text;-webkit-background-clip:text;color:transparent}.intro{color:#9cb0c2;font-size:16px;line-height:1.7;margin:0 0 34px;max-width:560px}.card{border:1px solid #ffffff22;border-radius:22px;background:linear-gradient(145deg,#243245ee,#1a2434f5);box-shadow:0 30px 90px #0006,inset 0 1px #ffffff16;padding:32px;backdrop-filter:blur(18px)}.card>form:before,.card>section:before{content:'TICKET INVENTORY';display:block;color:#76e4d0;font-size:11px;letter-spacing:.18em;font-weight:800;margin-bottom:22px}section p{color:#9cb0c2;margin:6px 0 20px}label{display:block;color:#c7d7e5;font-size:13px;font-weight:700;margin:18px 0 8px}input{display:block;width:100%;padding:14px 15px;margin-top:7px;background:#101a28;border:1px solid #435269;border-radius:10px;color:white;font:inherit;outline:none}input:focus{border-color:#5ae1c7;box-shadow:0 0 0 3px #5ae1c722}button{font:700 15px system-ui;cursor:pointer}.primary{width:100%;display:flex;align-items:center;justify-content:space-between;padding:15px 18px;margin-top:26px;background:linear-gradient(110deg,#63e4c0,#56c5d6);color:#0c2931;border:0;border-radius:11px;box-shadow:0 12px 30px #4adfc32c}.primary:hover{filter:brightness(1.08)}.secondary{background:transparent;color:#aabbd0;border:1px solid #ffffff29;border-radius:9px;padding:9px 13px;margin-top:17px}.secondary:hover{background:#ffffff10}button:disabled{opacity:.6;cursor:wait}.progress{margin-top:25px;border:1px solid #78dec12b;background:#11282768;padding:17px;border-radius:13px}.progress-heading,.progress-meta{display:flex;justify-content:space-between;gap:10px}.progress-heading{color:#d4f7ed;font-size:13px}.progress-heading strong:last-child{color:#75e1cd;font-variant-numeric:tabular-nums}.progress-track{height:8px;border-radius:99px;background:#344951;margin:14px 0 11px;overflow:hidden}.progress-track span{display:block;height:100%;width:0%;border-radius:inherit;background:linear-gradient(90deg,#4cd8a7,#75dced);transition:width .35s ease}.progress-meta{color:#90aaae;font-size:12px;font-variant-numeric:tabular-nums}#status{min-height:22px;margin:18px 0 0;color:#8de7c6;font-size:13px}#status.error{color:#ff9e9e}small{display:block;margin-top:22px;padding-top:18px;border-top:1px solid #ffffff19;color:#8298ad;font-size:11px}[hidden]{display:none!important}@media(max-width:560px){main{margin:35px auto}.card{padding:23px}h1{font-size:40px}}
/* Slow ambient color movement; the content remains still and readable. */
body::before,body::after{content:"";position:fixed;z-index:0;pointer-events:none;width:min(70vw,780px);height:min(70vw,780px);border-radius:50%;filter:blur(80px);opacity:.25;will-change:transform}
main{position:relative;z-index:1}
body::before{top:-30%;left:-20%;background:radial-gradient(circle,#29c8ae 0%,#1c768f 43%,transparent 70%);animation:floatA 22s ease-in-out infinite alternate}
body::after{right:-25%;bottom:-40%;background:radial-gradient(circle,#527bdf 0%,#593cb2 42%,transparent 72%);animation:floatB 27s ease-in-out infinite alternate}
@keyframes floatA{0%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(12vw,8vh,0) scale(1.1)}100%{transform:translate3d(4vw,24vh,0) scale(.94)}}
@keyframes floatB{0%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(-16vw,-14vh,0) scale(1.12)}100%{transform:translate3d(-5vw,-26vh,0) scale(.95)}}
@media(prefers-reduced-motion:reduce){body::before,body::after{animation:none}.progress-track span{transition:none}}
.music-toggle{position:fixed;right:22px;bottom:22px;z-index:5;padding:10px 15px;border:1px solid #77dccc50;border-radius:99px;background:#152737e8;color:#b1f1e0;font-size:12px;box-shadow:0 6px 24px #0004;backdrop-filter:blur(12px)}
.music-toggle:hover{background:#244253}.music-toggle[aria-pressed="true"]{color:#9baabd;border-color:#ffffff28}
@media(max-width:560px){main{padding-bottom:50px}.music-toggle{right:16px;bottom:16px}}

.video-background{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;background:#101522}.video-background iframe{position:absolute;top:50%;left:50%;width:100vw;height:56.25vw;min-width:177.78vh;min-height:100vh;transform:translate(-50%,-50%);border:0;opacity:.38}.video-background::after{content:"";position:absolute;inset:0;background:linear-gradient(140deg,#10152270,#101522bb)}body::before,body::after{z-index:1}main{z-index:2}.music-toggle{z-index:5}

.csv-card{margin-top:24px}.csv-card h2{font-size:28px;letter-spacing:-.04em;margin:0 0 10px}.csv-card p{color:#a9bfd0;font-size:14px}.csv-card .eyebrow{margin-bottom:12px}.csv-card input[type=file]{font-size:13px}.csv-card input::file-selector-button{border:0;border-radius:6px;padding:8px 12px;background:#294858;color:#c3f4e6;margin-right:12px}#expand-status.error{color:#ff9e9e}
main {
  width: min(1100px, calc(100% - 32px));
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
  align-items: start;
  margin: 35px auto;
}

/* Keep the heading above both cards */
main > .eyebrow,
main > h1,
main > .intro {
  grid-column: 1 / -1;
  margin-bottom: 0;
}

main > .csv-card {
  margin-top: 0;
}

@media (max-width: 760px) {
  main {
    grid-template-columns: 1fr;
  }
}

/* Raffle manager additions */
.manager-card{grid-column:1 / -1}.manager-actions{display:grid;grid-template-columns:2fr 1fr 1fr;gap:10px;align-items:end}.manager-actions .primary,.manager-actions .secondary{margin-top:0}.action-button{width:100%;height:100%;min-height:50px}.summary{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:22px 0}.summary>div{background:#0e1b2a99;border:1px solid #ffffff18;border-radius:12px;padding:14px}.summary span{display:block;color:#8fa7ba;font-size:11px;text-transform:uppercase;letter-spacing:.12em}.summary strong{display:block;font-size:24px;margin-top:3px}.selection-actions{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px}.selection-actions .secondary{margin-top:0}.danger{margin-left:auto;background:#5c1e27;color:#ffd8dd;border:1px solid #a94555;border-radius:9px;padding:10px 14px;font-weight:800}.danger:hover{background:#7b2633}.table-wrap{overflow:auto;max-height:62vh;border:1px solid #ffffff1d;border-radius:12px;background:#0d1622b8}.table-wrap table{width:100%;border-collapse:collapse;min-width:1050px;font-size:12px}.table-wrap th,.table-wrap td{padding:10px 11px;border-bottom:1px solid #ffffff12;text-align:left;vertical-align:top}.table-wrap th{position:sticky;top:0;background:#182536;z-index:1;color:#91adbf;text-transform:uppercase;letter-spacing:.06em;font-size:10px}.table-wrap tr:hover td{background:#ffffff05}.table-wrap input[type=checkbox]{width:auto;margin:0;accent-color:#63e4c0}.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:10px;white-space:nowrap}.row-status{white-space:nowrap}.deleted-row{opacity:.45}.failed-row td{background:#5b182329!important}.manager-card+ .csv-card{grid-column:1 / -1;max-width:620px;width:100%;justify-self:center}
@media(max-width:760px){.manager-actions{grid-template-columns:1fr}.summary{grid-template-columns:1fr 1fr 1fr}.danger{margin-left:0}.manager-card+ .csv-card{max-width:none}}


/* Final card order/layout:
   1. PLAYTIME RAFFLE CSV EXPORTER
   2. CSV ROW EXPANDER
   3. RAFFLE TICKET MANAGER */
.card-title{margin-bottom:12px}

main{
  width:min(1100px,calc(100% - 32px));
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:24px;
  align-items:stretch;
  margin:35px auto;
}

main > .eyebrow,
main > .intro{
  grid-column:1 / -1;
}

.exporter-card{
  grid-column:1;
}

.csv-card{
  grid-column:2;
  margin-top:0;
}

.exporter-card,
.csv-card{
  width:100%;
  min-width:0;
  min-height:390px;
  display:flex;
  flex-direction:column;
}

.exporter-card #export-status,
.csv-card #expand-status{
  margin-top:auto;
  padding-top:18px;
}

.manager-card{
  grid-column:1 / -1;
  width:100%;
  margin-top:0;
}

.manager-card>p{
  color:#a9bfd0;
  font-size:14px;
  margin:0 0 8px;
}

#export-status,
#manager-status{
  min-height:22px;
  margin:18px 0 0;
  color:#8de7c6;
  font-size:13px;
}

#export-status.error,
#manager-status.error{
  color:#ff9e9e;
}

.manager-card .primary{
  max-width:360px;
}

@media(max-width:760px){
  main{
    grid-template-columns:1fr;
    align-items:start;
  }

  .exporter-card,
  .csv-card,
  .manager-card{
    grid-column:1;
    min-height:0;
  }
}
