/* My Office Sweep · shared brand + sweep page styles
   Core is fixed. The event layer is set with <body data-ground="..."> */
:root{
  --brand:#1F3FD6;
  --night:#1F3FD6; --night-2:#2A4BE8; --night-3:#3A5AF0; --mist:#DCE3FF; --outline:#8EA2FF; --nline:rgba(255,255,255,.2);
  --sun:#FFE14D; --press:#C9A800; --deep:#10206E; --ink:#10206E; --ink-2:#4A5690;
  --sand:#F2F5FF; --sand-2:#DCE3FF; --line:#D6DDF7; --paper:#fff;
  --b0:#FF5A4E; --b1:#FFE14D; --b2:#2ED47A; --b3:#FF8BD2; --b4:#56C8FF; --b5:#FF9F2E;
  --display:"Bowlby One","Arial Black",Impact,sans-serif;
  --body:"DM Sans","Helvetica Neue",Arial,sans-serif;
}
/* Event grounds: ground, surface, raised surface, muted text, line */
[data-ground="stadium"]{--night:#151B3D;--night-2:#222A55;--night-3:#2E3768;--mist:#C9CEEA;--outline:#7A84BD}
[data-ground="fairway"]{--night:#17633F;--night-2:#1E7A4E;--night-3:#258A5A;--mist:#CFE8D9;--outline:#8CC7A5}
[data-ground="lagoon"]{--night:#0B6E7A;--night-2:#0E8291;--night-3:#1193A3;--mist:#CDEEF2;--outline:#8FD3DC}
[data-ground="clay"]{--night:#A8361F;--night-2:#BE4529;--night-3:#CC5233;--mist:#F7D6CC;--outline:#F0B09F}
[data-ground="grape"]{--night:#4B2A8C;--night-2:#5B37A3;--night-3:#6A45B5;--mist:#E1D6F7;--outline:#9A80D6}

*{box-sizing:border-box}
body{margin:0;background:var(--sand);color:var(--ink);font:16px/1.5 var(--body);-webkit-font-smoothing:antialiased;font-synthesis:none}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
a{color:inherit}
.wrap{max-width:1180px;margin:0 auto;padding:0 40px}
@media (max-width:760px){.wrap{padding:0 16px}}

/* Top bar + logo */
.topbar{background:var(--night);color:#fff}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;height:68px;gap:12px}
.brand{display:flex;align-items:center;gap:10px;font-family:var(--display);font-size:20px;white-space:nowrap;color:#fff;text-decoration:none}
.brand .dot{width:32px;height:32px;border-radius:50%;background:var(--sun);box-shadow:0 4px 0 var(--press);display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.brand .dot i{width:63%;height:63%;border-radius:50%;background:#fff;color:var(--deep);display:flex;align-items:center;justify-content:center;font:13px/1 var(--display);font-style:normal}
.topbar .tag{font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--mist);font-weight:700;text-align:right}
.topbar .tag a{text-decoration:none}
@media (max-width:520px){.topbar .tag{display:none}}

/* Hero */
.hero{position:relative;overflow:hidden;color:#fff;background:var(--night)}
.hero .pat{position:absolute;inset:0;opacity:.25;pointer-events:none}
.pat.lines{background:repeating-linear-gradient(90deg,var(--outline) 0 2px,transparent 2px 84px)}
.pat.dots{background:radial-gradient(circle,var(--outline) 0 1.6px,transparent 2.2px) 0 0/22px 22px}
.pat.rings{background:repeating-radial-gradient(circle at 85% 55%,transparent 0 40px,var(--outline) 40px 42px)}
.hero .wrap{position:relative;padding-top:40px;padding-bottom:60px;display:flex;flex-wrap:wrap;gap:40px;align-items:center}
.hero .copy{flex:1 1 460px;min-width:0}
.drum{flex:0 1 340px;width:340px;max-width:100%;aspect-ratio:1;border-radius:50%;background:var(--night-2);border:10px solid #fff;position:relative;box-shadow:inset 0 -30px 60px rgba(0,0,0,.25);margin:0 auto}
.drum .ball{position:absolute;width:19%;height:19%}
.drum .ball span{font-size:13px}
@media (max-width:760px){.drum{width:240px;flex-basis:240px}.drum .ball span{font-size:10px}}
.eyebrow{display:inline-block;font-weight:700;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--deep);background:#fff;border-radius:999px;padding:7px 14px}
.hero h1{font-family:var(--display);font-weight:400;line-height:1;margin:18px 0 0;font-size:clamp(40px,6.4vw,80px);text-wrap:balance}
.hero h1 em{color:var(--sun);font-style:normal;display:block}
.hero p{max-width:540px;color:var(--mist);font-size:19px;line-height:1.55;margin:20px 0 0}
.stepsnav{display:flex;gap:10px;flex-wrap:wrap;margin-top:26px}
.stepsnav span{background:#fff;color:var(--deep);border-radius:999px;padding:10px 18px;font-weight:700;font-size:15px}
.stepsnav span i{font-style:normal;margin-right:2px}

/* Sections */
section{padding:48px 0}
.sh{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:20px}
.sh .n{font-weight:700;font-size:13px;letter-spacing:.08em;color:var(--brand);text-transform:uppercase}
.drawsec .sh .n{color:var(--sun)}
.sh h2{font-family:var(--display);font-weight:400;font-size:clamp(30px,4vw,44px);line-height:1.05;margin:8px 0 0;color:var(--brand)}
.sh p{margin:0;color:var(--ink-2);max-width:460px;font-size:15px}

/* Forms */
.card{background:var(--paper);border-radius:16px;box-shadow:0 1px 0 var(--line),0 12px 30px -18px rgba(10,22,51,.35);padding:22px}
.grid2{display:grid;grid-template-columns:1.1fr .9fr;gap:18px}
@media (max-width:900px){.grid2{grid-template-columns:1fr}}
.stack{display:flex;flex-direction:column;gap:18px;min-width:0}
label.f{display:block;font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:13px;color:var(--ink-2);margin:0 0 6px}
.row{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:16px}
@media (max-width:560px){.row{grid-template-columns:1fr}}
input[type=text],input[type=number],input[type=email],select,textarea{width:100%;border:1.5px solid var(--line);border-radius:12px;background:#fff;padding:11px 13px;outline:none;transition:border-color .15s}
input:focus,select:focus,textarea:focus{border-color:var(--brand)}
textarea{min-height:250px;resize:vertical;line-height:1.5}
textarea.fieldlist{min-height:200px;font-size:14px}
.money{position:relative}
.money span{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--ink-2);font-weight:600}
.money input{padding-left:38px}
.hint{font-size:13px;color:var(--ink-2);margin-top:6px}
details.more{margin-top:4px}
details.more summary{cursor:pointer;font-weight:700;font-size:14px;color:var(--brand)}

.split{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.split div{background:var(--sand);border-radius:12px;padding:10px;min-width:0}
.split label{display:block;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2);margin-bottom:6px}
.split .pc{display:flex;align-items:center;gap:4px}
.split input{padding:8px 10px;text-align:right;min-width:0}
.split .amt{font-family:var(--display);font-size:20px;margin-top:6px;color:var(--brand)}

.meter{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-top:14px;flex-wrap:wrap}
.meter b{font-family:var(--display);font-weight:400;font-size:36px;line-height:1;color:var(--brand)}
.meter small{color:var(--ink-2);font-weight:600}
.track{height:8px;border-radius:4px;background:var(--sand-2);overflow:hidden;margin-top:8px}
.track i{display:block;height:100%;background:var(--brand);transition:width .3s}

.rules{border-radius:16px;padding:20px;background:var(--night);color:#fff}
.rules h3{margin:0 0 10px;font-family:var(--display);font-weight:400;font-size:20px;color:var(--sun)}
.rules ul{margin:0;padding-left:18px;color:var(--mist);font-size:14px}
.rules li{margin:5px 0}
.chk{margin-top:12px;display:flex;flex-direction:column;gap:6px}
.chk div{display:flex;gap:8px;align-items:flex-start;font-size:14px;font-weight:600}
.chk .ok::before{content:"\2713";color:#7FE0A4;font-weight:800}
.chk .bad::before{content:"\2715";color:#FF8A75;font-weight:800}
.chk .warn::before{content:"!";color:var(--sun);font-weight:800;width:.6em;text-align:center}
.chk .bad{color:#FFC2B6}
.rules .fine{font-size:12px;color:var(--mist);margin-top:12px}

/* Buttons */
.pill{border-radius:999px;padding:13px 22px;font-weight:700;font-size:16px;border:2px solid var(--brand);color:var(--brand);background:transparent;transition:all .15s;white-space:nowrap;text-decoration:none;display:inline-block;min-height:48px}
.pill:hover{background:var(--brand);color:#fff}
button:focus-visible,select:focus-visible,input:focus-visible,textarea:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid var(--sun);outline-offset:3px}
.pill.solid{background:var(--sun);border-color:var(--sun);color:var(--deep);font-family:var(--display);font-weight:400;font-size:18px;padding:13px 26px;box-shadow:0 6px 0 var(--press);margin-bottom:6px}
.pill.solid:hover{background:var(--sun);color:var(--deep);transform:translateY(2px);box-shadow:0 4px 0 var(--press)}
.pill.solid:active{transform:translateY(5px);box-shadow:0 1px 0 var(--press)}
.pill:disabled{opacity:.4;cursor:not-allowed}
.pill.light{border-color:var(--outline);color:#fff}
.pill.light:hover{background:rgba(255,255,255,.1)}
.actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}

/* The draw */
.drawsec{background:var(--night);color:#fff}
.drawsec .sh h2{color:#fff}.drawsec .sh p{color:var(--mist)}
.drawbar{display:flex;gap:12px;flex-wrap:wrap;align-items:center;justify-content:space-between;background:var(--night-2);border:1px solid var(--nline);border-radius:16px;padding:14px 16px;margin-bottom:18px}
.tabs{display:flex;gap:4px;background:rgba(255,255,255,.08);border-radius:999px;padding:4px}
.tabs button{border:0;background:transparent;color:#fff;border-radius:999px;padding:9px 16px;font-weight:700;font-size:14px}
.tabs button.on{background:#fff;color:var(--deep)}
.board{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
@media (max-width:1000px){.board{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:720px){.board{grid-template-columns:repeat(2,minmax(0,1fr))}}
.tile{position:relative;background:var(--night-2);border:1px solid var(--nline);border-radius:16px;padding:14px;min-height:118px;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;transition:transform .25s,border-color .25s,opacity .25s;min-width:0}
.tile .top{display:flex;justify-content:space-between;align-items:center;gap:8px}
.bd{font-weight:700;font-size:12px;letter-spacing:.04em;padding:3px 8px;border-radius:999px;background:#fff;color:var(--deep);white-space:nowrap}
.ball{display:inline-flex;align-items:center;justify-content:center;border-radius:50%;box-shadow:inset -5px -7px 0 rgba(0,0,0,.15);flex:0 0 auto}
.ball span{width:64%;height:64%;border-radius:50%;background:#fff;color:var(--deep);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:12px;line-height:1}
.tile .ball{width:50px;height:50px}
.b0{background:var(--b0)}.b1{background:var(--b1)}.b2{background:var(--b2)}.b3{background:var(--b3)}.b4{background:var(--b4)}.b5{background:var(--b5)}
.tile .pool{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--mist);font-weight:700;text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.tile .tm{font-weight:500;font-size:15px;margin-top:10px;color:var(--mist);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tile .who{font-family:var(--display);font-size:22px;line-height:1.1;margin-top:2px;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tile .who.none{color:var(--outline)}
.tile .bonus{display:inline-block;margin-top:6px;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--deep);background:var(--sun);border-radius:999px;padding:2px 8px;font-weight:700}
.tile.new{border-color:var(--sun);transform:scale(1.04);box-shadow:0 0 0 4px var(--sun)}
.tile.out{opacity:.38}
.tile.out .tm{text-decoration:line-through}
.tile.place{border-color:var(--sun)}
.tile .medal{position:absolute;right:12px;bottom:12px;font-weight:700;font-size:12px;color:var(--deep);background:var(--sun);padding:3px 10px;border-radius:999px}
.tile .assign{margin-top:6px}
.tile .assign select{background:var(--night-3);color:#fff;border:1px solid var(--nline);border-radius:8px;padding:6px 8px;font-size:14px}
.people{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
@media (max-width:900px){.people{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.people{grid-template-columns:1fr}}
.person{background:var(--night-2);border:1px solid var(--nline);border-radius:16px;padding:16px;min-width:0}
.person h4{margin:0;font-family:var(--display);font-weight:400;font-size:22px;display:flex;justify-content:space-between;gap:8px}
.person h4 small{font-family:var(--body);font-weight:700;font-size:12px;letter-spacing:.04em;color:var(--mist);align-self:center;white-space:nowrap}
.person ul{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-direction:column;gap:6px}
.person li{display:flex;gap:8px;align-items:center;font-size:14px;flex-wrap:wrap}
.person li.out{opacity:.4;text-decoration:line-through}
.person .tagb{color:var(--sun);font-size:11px;font-weight:800;letter-spacing:.1em}
.empty{border:2px dashed var(--outline);border-radius:16px;padding:40px 20px;text-align:center;color:var(--mist)}
.empty b{display:block;font-family:var(--display);font-weight:400;font-size:28px;color:#fff;margin-bottom:6px}
.stamp{font-size:13px;color:var(--mist);margin-top:14px}

/* Squares grid */
.sqwrap{overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:6px}
.sqtable{border-collapse:separate;border-spacing:4px;min-width:640px;width:100%;table-layout:fixed}
.sqtable th,.sqtable td{text-align:center;padding:0}
.sqtable .axis{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--mist);padding:4px}
.sqtable .dg .ball{width:40px;height:40px}
.sqtable .dg .ball span{font-size:14px}
.sqtable td.cell{background:var(--night-2);border:1px solid var(--nline);border-radius:8px;height:48px;font-size:12px;font-weight:700;line-height:1.15;overflow:hidden;text-overflow:ellipsis;padding:2px 3px;word-break:break-word;transition:background .2s}
.sqtable td.cell.bonus{color:var(--sun)}
.sqtable td.cell.new{background:var(--sun);color:var(--deep)}
.sqtable td.cell.won{background:var(--sun);color:var(--deep)}
.sqtable td.cell.none{color:var(--outline)}
.sqtable .rowlab{writing-mode:vertical-rl;transform:rotate(180deg);width:22px}

/* Upsell */
.upsell{margin-top:22px;background:#fff;color:var(--ink);border-radius:16px;padding:20px;display:flex;flex-wrap:wrap;gap:18px;align-items:center;justify-content:space-between}
.upsell h3{margin:0;font-family:var(--display);font-weight:400;font-size:22px;color:var(--brand)}
.upsell p{margin:6px 0 0;color:var(--ink-2);font-size:15px;max-width:520px}
.upsell .prices{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.upsell .prices span{background:var(--sand);border-radius:999px;padding:6px 12px;font-size:14px;font-weight:700}
.upsell form{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.upsell form input{max-width:260px}
.upsell .done{font-weight:700;color:var(--brand)}

/* Results */
.res-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
@media (max-width:900px){.res-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:480px){.res-grid{grid-template-columns:1fr}}
.prize{background:#fff;border-radius:16px;padding:16px;border:2px solid var(--line);min-width:0}
.prize.won{border-color:var(--sun);background:#FFFBE0}
.prize .k{font-weight:700;letter-spacing:.08em;font-size:12px;text-transform:uppercase;color:var(--ink-2)}
.prize .v{font-family:var(--display);font-weight:400;font-size:30px;line-height:1.1;margin-top:6px;color:var(--brand)}
.prize select{margin-top:10px}
.prize .w{margin-top:10px;font-weight:700;min-height:22px}
.prize .w span:not([style]){color:var(--brand)}
.prize .sc{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}
.prize .sc label{font-size:12px;font-weight:700;color:var(--ink-2);display:block;margin-bottom:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.prize .sc input{padding:8px 10px}
.outlist{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.outlist button{border:1.5px solid var(--line);background:#fff;border-radius:999px;padding:6px 10px;font-size:13px;font-weight:600;display:flex;gap:6px;align-items:center}
.outlist button.out{background:var(--sand-2);color:var(--ink-2);text-decoration:line-through}
.outlist .bd{font-size:11px;padding:2px 6px;background:var(--sand)}

/* About (static, per event) */
.about{background:#fff}
.about .cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
@media (max-width:900px){.about .cols{grid-template-columns:1fr}}
.about h2{font-family:var(--display);font-weight:400;font-size:clamp(26px,3.4vw,36px);line-height:1.1;color:var(--brand);margin:0 0 18px}
.about h3{margin:0 0 6px;font-size:18px}
.about p{margin:0;color:var(--ink-2);font-size:15px}
.about .more-events{margin-top:28px;display:flex;flex-wrap:wrap;gap:8px}
.about .more-events a{border:1.5px solid var(--line);border-radius:999px;padding:8px 14px;font-weight:700;font-size:14px;text-decoration:none;color:var(--brand)}
.about .more-events a:hover{border-color:var(--brand)}

footer{background:var(--deep);color:var(--mist);font-size:13px;padding:26px 0}
footer .wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
footer a{color:#fff}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(20px);opacity:0;background:var(--sun);color:var(--deep);font-family:var(--display);font-weight:400;padding:12px 20px;border-radius:999px;transition:all .25s;pointer-events:none;z-index:50;max-width:90vw;text-align:center}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.viewbar{display:none;background:var(--sun);color:var(--deep);font-weight:700;font-size:14px}
.viewbar .wrap{display:flex;justify-content:space-between;align-items:center;gap:10px;padding-top:10px;padding-bottom:10px;flex-wrap:wrap}
.viewbar button{border:1.5px solid var(--deep);background:transparent;border-radius:999px;padding:6px 14px;font-weight:700}
body.viewing .viewbar{display:block}
body.viewing .setup-only{display:none !important}

@media (prefers-reduced-motion:reduce){*{transition:none !important;animation:none !important;scroll-behavior:auto !important}}

/* Print */
#printSheet,#printSlips{display:none}
@media print{
  @page{size:A4;margin:14mm}
  body{background:#fff}
  body > *:not(#printSheet):not(#printSlips){display:none !important}
  body.p-sheet #printSheet{display:block}
  body.p-slips #printSlips{display:block}
  .ps-head{background:#1F3FD6 !important;color:#fff !important;padding:16px 18px;border-radius:10px;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .ps-head .e{font-weight:700;letter-spacing:.12em;font-size:10pt;color:#FFE14D;text-transform:uppercase}
  .ps-head h1{font-family:var(--display);font-weight:400;font-size:28pt;margin:4px 0 0;line-height:1.05}
  .ps-head p{margin:6px 0 0;font-size:11pt;color:rgba(255,255,255,.85)}
  .ps-prizes{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:12px 0}
  .ps-prizes div{border:1.5px solid #D6DDF7;border-radius:8px;padding:8px}
  .ps-prizes b{display:block;font-size:9pt;letter-spacing:.1em;text-transform:uppercase;color:#4A5690}
  .ps-prizes span{font-family:var(--display);font-size:16pt}
  table.ps{width:100%;border-collapse:collapse;font-size:11pt}
  table.ps th{text-align:left;letter-spacing:.1em;text-transform:uppercase;font-size:9pt;color:#4A5690;border-bottom:2px solid #1F3FD6;padding:4px 6px}
  table.ps td{padding:4px 6px;border-bottom:1px solid #D6DDF7}
  table.ps td.code{font-weight:800}
  table.ps td.who{font-weight:700}
  table.psq{width:100%;border-collapse:collapse;table-layout:fixed;font-size:9pt;margin-top:10px}
  table.psq th,table.psq td{border:1px solid #8EA2FF;text-align:center;height:15mm;padding:1mm;overflow:hidden;word-break:break-word}
  table.psq th{background:#F2F5FF !important;font-size:12pt;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .ps-foot{margin-top:10px;font-size:9pt;color:#4A5690}
  .slips{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
  .slip{border:1px dashed #999;height:40mm;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:4mm;break-inside:avoid}
  .slip b{font-family:var(--display);font-weight:400;font-size:24pt}
  .slip span{font-size:11pt;margin-top:2px}
  .slip small{font-size:8pt;color:#666;margin-top:4px;letter-spacing:.1em;text-transform:uppercase}
}