.blotto-tone-primary{background:var(--hero-field)}.blotto-tone-soft{background:var(--hero-soft)}.blotto-tone-mid{background:var(--hero-mid)}.blotto-tone-sky{background:var(--blotto-sky)}.blotto-tone-standard{background:var(--blotto-standard)}.blotto-tone-purple{background:var(--blotto-purple)}.blotto-tone-performance{background:var(--blotto-performance)}.blotto-tone-zandvoort{background:var(--blotto-zandvoort)}.blotto-tone-airstream{background:var(--blotto-airstream)}.blotto-strip-copy{color:var(--hero-muted);margin:4px 0 0;font-size:16px;line-height:1.5}.blotto-strip-label{color:var(--hero-muted);text-transform:uppercase;margin:0 0 10px;font-size:15px;font-weight:800}.blotto-strip-swatches{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;max-width:560px;display:grid}.blotto-strip-swatch{min-width:0;color:var(--hero-ink);flex-direction:column;gap:4px;font-size:16px;line-height:1.4;display:flex}.blotto-strip-swatch span{color:var(--hero-muted);font-size:15px}.blotto-strip-colour{aspect-ratio:4/3;border-radius:8px;width:100%;min-height:64px}.blotto-strip-play{background:var(--hero-field);width:100%;min-height:48px;color:var(--hero-ink);font-size:16px;font-weight:800;text-decoration:none}.blotto-strip-play:hover{background:var(--hero-mid);color:var(--hero-ink)}.spotto-upload-card{background:var(--hero-white);border:1px solid color-mix(in srgb,var(--hero-ink) 10%,transparent);scroll-snap-align:start;border-radius:18px;flex-direction:column;flex:0 0 260px;width:260px;display:flex;overflow:hidden}.spotto-upload-visual{background:var(--hero-ink);height:150px;position:relative;overflow:hidden}.spotto-upload-photo{object-fit:cover;width:100%;height:100%;display:block;position:absolute;inset:0}.spotto-upload-visual:after{content:"";background:linear-gradient(#0000,#1516559e);height:58px;position:absolute;inset:auto 0 0}.spotto-upload-badge{z-index:1;background:var(--hero-white);color:var(--hero-ink);border-radius:999px;padding:4px 10px;font-size:15px;font-weight:800;position:absolute;top:10px;left:10px}.spotto-upload-hand{z-index:1;color:var(--hero-white);text-shadow:0 1px 6px #151655bf;font-family:Caveat,cursive;font-size:22px;position:absolute;bottom:7px;left:12px}.spotto-upload-content{flex-direction:column;flex:1;gap:12px;padding:14px 16px;display:flex}.spotto-upload-content h3{text-transform:uppercase;color:var(--hero-ink);margin:0;font-family:Anton,sans-serif;font-size:22px;line-height:1.1}.spotto-upload-content p{color:var(--hero-muted);margin:0;font-size:16px;line-height:1.5}.spotto-upload-action{white-space:normal;width:100%;height:auto;min-height:48px;color:var(--hero-white);gap:6px;margin-top:auto;font-size:15px}.spotto-upload-action:hover{color:var(--hero-white)}.spotto-upload-safety{color:var(--hero-muted);font-size:15px;line-height:1.4}@media (width<=420px){.blotto-strip-swatches{grid-template-columns:repeat(2,minmax(0,1fr))}}.blotto{--bg:var(--hero-grey);--surface:var(--hero-white);--ink:var(--hero-ink);--ink-soft:var(--hero-muted);--line:var(--hero-mid);--blue:var(--hero-field);--blue-soft:var(--hero-soft);--yellow:var(--blotto-yellow);--magenta:var(--magenta-500);--on-magenta:var(--hero-white);--head-bg:var(--hero-ink);--head-fg:var(--hero-white);--head-muted:var(--hero-mid);--on-chip:var(--hero-ink);--f-display:"Anton","Impact","Arial Narrow",sans-serif;--f-hand:"Caveat","Comic Sans MS",cursive;--r:14px;background:var(--bg);color:var(--ink);min-height:70vh;padding:16px 16px 40px;font-size:15px;line-height:1.45}.blotto *{box-sizing:border-box}.blotto .wrap{flex-direction:column;gap:16px;width:100%;max-width:560px;margin:0 auto;display:flex}.blotto button{cursor:pointer;color:inherit;font-family:inherit}.blotto button:focus-visible,.blotto input:focus-visible{outline:3px solid var(--magenta);outline-offset:2px}.blotto .head{background:var(--head-bg);color:var(--head-fg);border-radius:20px;flex-direction:column;gap:6px;padding:22px 22px 0;display:flex}.blotto .eyebrow{letter-spacing:0;text-transform:uppercase;color:var(--blue);font-size:15px;font-weight:700}.blotto h1{font-family:var(--f-display);text-transform:uppercase;margin:0;font-size:56px;font-weight:400;line-height:.95}.blotto h1 .dot{color:var(--magenta)}.blotto .sub{color:var(--head-muted);font-size:15px}.blotto .tabs{gap:4px;margin-top:14px;display:flex}.blotto .tab{background:color-mix(in srgb,var(--hero-white) 12%,transparent);min-height:46px;color:var(--head-fg);border:none;border-radius:12px 12px 0 0;padding:12px 18px;font-size:15px;font-weight:700}.blotto .tab[aria-selected=true]{background:var(--bg);color:var(--ink)}.blotto .row{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}.blotto .label{letter-spacing:0;text-transform:uppercase;color:var(--ink-soft);font-size:15px;font-weight:700}.blotto .hand{font-family:var(--f-hand);font-size:22px;line-height:1.1}.blotto .players{flex-direction:column;gap:12px;display:flex}.blotto .card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);flex-direction:column;gap:12px;padding:14px;display:flex}.blotto .card.lead{border-color:var(--blue);box-shadow:0 0 0 2px var(--blue)}.blotto .ptop{align-items:center;gap:10px;display:flex}.blotto .pname{border:none;border-bottom:1px dashed var(--blue);min-width:0;color:var(--ink);background:0 0;flex:1;padding:6px 0;font-family:inherit;font-size:17px;font-weight:700}.blotto .chip{background:var(--blue);color:var(--on-chip);white-space:nowrap;border-radius:6px;padding:3px 8px;font-size:15px;font-weight:700}.blotto .score{font-family:var(--f-display);text-align:right;font-variant-numeric:tabular-nums;min-width:64px;font-size:44px;line-height:1}.blotto .score.pop{animation:.35s blottopop}@keyframes blottopop{40%{transform:scale(1.25)}to{transform:scale(1)}}.blotto .btns{grid-template-columns:repeat(2,minmax(0,1fr)) 64px;gap:8px;display:grid}.blotto .b{min-height:52px;color:var(--hero-ink);border:none;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;gap:2px;padding:6px;font-size:15px;font-weight:700;line-height:1.1;display:flex}.blotto .b small{opacity:.8;font-size:15px;font-weight:500}.blotto .b:active{transform:scale(.96)}.blotto .b-blotto{background:var(--blue)}.blotto .b-spotto{background:var(--yellow)}.blotto .b-brando{background:var(--blue-soft);color:var(--ink)}.blotto .b-oops{border:1.5px solid var(--magenta);color:var(--magenta);background:0 0}.blotto .tally{color:var(--ink-soft);flex-wrap:wrap;align-items:center;gap:12px;font-size:15px;display:flex}.blotto .x{color:var(--ink-soft);background:0 0;border:none;min-height:32px;margin-left:auto;padding:0 4px;font-size:15px;text-decoration:underline}.blotto .actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;display:grid}.blotto .ghost{background:var(--surface);border:1px dashed var(--blue);min-height:48px;color:var(--ink);border-radius:12px;font-size:15px;font-weight:700}.blotto .solid{background:var(--surface);border:1.5px solid var(--ink);min-height:48px;color:var(--ink);border-radius:12px;font-size:15px;font-weight:700}.blotto .confirm{background:var(--blue-soft);border-radius:12px;flex-wrap:wrap;align-items:center;gap:8px;padding:12px 14px;display:flex}.blotto .confirm p{flex:1;min-width:160px;margin:0;font-weight:500}.blotto .mini{border:none;border-radius:10px;min-height:44px;padding:0 16px;font-size:15px;font-weight:700}.blotto .mini.danger{background:var(--magenta);color:var(--on-magenta)}.blotto .mini.plain{background:var(--surface);color:var(--ink);border:1px solid var(--line)}.blotto .log{background:var(--surface);border-radius:var(--r);border:1px solid var(--line);flex-direction:column;gap:6px;padding:12px 14px;display:flex}.blotto .log ol{flex-direction:column;gap:4px;margin:0;padding:0;font-size:15px;list-style:none;display:flex}.blotto .log li{justify-content:space-between;gap:8px;display:flex}.blotto .log .pts{font-weight:700}.blotto .undo{border:1px solid var(--line);min-height:36px;color:var(--ink);background:0 0;border-radius:10px;padding:0 12px;font-size:15px;font-weight:700}.blotto .cta{background:var(--magenta);color:var(--on-magenta);border:none;border-radius:12px;width:100%;min-height:54px;font-size:16px;font-weight:700}.blotto .cta:disabled{opacity:.6}.blotto .note{color:var(--ink-soft);font-size:15px}.blotto .toggle{align-items:center;gap:10px;font-size:15px;font-weight:500;display:flex}.blotto .toggle input{width:22px;height:22px;accent-color:var(--magenta)}.blotto .tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;display:grid}@media (width<=420px){.blotto .tiles{grid-template-columns:1fr}}.blotto .tile{border-radius:var(--r);color:var(--hero-ink);flex-direction:column;gap:4px;padding:14px;display:flex}.blotto .tile .pts{font-family:var(--f-display);font-size:32px;line-height:1}.blotto .tile strong{font-size:15px}.blotto .tile span{font-size:15px;line-height:1.35}.blotto .t-blotto{background:var(--blue)}.blotto .t-spotto{background:var(--yellow)}.blotto .t-brando{background:var(--blue-soft);color:var(--ink)}.blotto .panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);flex-direction:column;gap:10px;padding:16px;display:flex}.blotto .panel ul{flex-direction:column;gap:6px;margin:0;padding-left:18px;font-size:15px;list-style:outside;display:flex}.blotto .rules{counter-reset:r;flex-direction:column;gap:10px;margin:0;padding:0;list-style:none;display:flex}.blotto .rules li{counter-increment:r;align-items:flex-start;gap:10px;font-size:15px;display:flex}.blotto .rules li:before{content:counter(r);background:var(--ink);height:26px;color:var(--surface);border-radius:50%;flex:0 0 26px;justify-content:center;align-items:center;font-size:15px;font-weight:700;display:flex}.blotto .rules li:first-child:before{background:var(--magenta)}.blotto .toast{left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));background:var(--ink);color:var(--surface);z-index:60;border-radius:10px;padding:10px 16px;font-size:15px;font-weight:700;position:fixed;transform:translate(-50%)}.blotto .copybox{border:1px solid var(--line);background:var(--bg);width:100%;min-height:120px;color:var(--ink);border-radius:10px;padding:10px;font-size:15px}.blotto .snap{background:var(--blue);color:var(--hero-ink);border:none;border-radius:12px;justify-content:center;align-items:center;gap:10px;width:100%;min-height:54px;font-size:16px;font-weight:700;display:flex}.blotto .nudge{background:var(--blue-soft);border-radius:10px;align-items:center;gap:8px;padding:8px 10px;font-size:15px;font-weight:500;display:flex}.blotto .nudge button{background:var(--ink);color:var(--surface);border:none;border-radius:8px;min-height:36px;padding:0 12px;font-size:15px;font-weight:700}.blotto .nudge .dismiss{color:var(--ink-soft);background:0 0;padding:0 6px}.blotto .sheet{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);flex-direction:column;gap:12px;padding:16px;display:flex}.blotto .sheet h2{font-family:var(--f-display);text-transform:uppercase;margin:0;font-size:28px;font-weight:400;line-height:1}.blotto .field{flex-direction:column;gap:4px;font-size:15px;font-weight:700;display:flex}.blotto .field input{border:1px solid var(--line);background:var(--bg);min-height:46px;color:var(--ink);border-radius:10px;padding:0 12px;font-family:inherit;font-size:15px;font-weight:400}.blotto .drop{border:2px dashed var(--blue);text-align:center;min-height:150px;color:var(--ink);cursor:pointer;border-radius:12px;justify-content:center;align-items:center;padding:12px;font-weight:700;display:flex;position:relative;overflow:hidden}.blotto .drop img{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.blotto .drop input{opacity:0;width:1px;height:1px;position:absolute}.blotto .consent{align-items:flex-start;gap:10px;font-size:15px;line-height:1.4;display:flex}.blotto .consent input{width:22px;height:22px;accent-color:var(--magenta);flex:0 0 22px;margin-top:1px}.blotto .safety{color:var(--ink-soft);text-align:center;font-size:15px}.blotto .err{color:var(--magenta);font-size:15px;font-weight:700}.blotto .wall{flex-direction:column;gap:10px;display:flex}.blotto .wall h2{font-family:var(--f-display);text-transform:uppercase;margin:0;font-size:30px;font-weight:400;line-height:1}.blotto .wallgrid{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;display:grid}.blotto .wallgrid.photos{grid-template-columns:repeat(2,minmax(0,1fr))}@media (width>=768px){.blotto .wallgrid.photos{grid-template-columns:repeat(4,minmax(0,1fr))}}@media (width<=420px){.blotto .wallgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}.blotto .wt{text-align:left;background:0 0;border:none;flex-direction:column;gap:4px;min-width:0;padding:0;display:flex}.blotto .wt .sw{aspect-ratio:4/3;border-radius:10px}.blotto .wt strong{font-size:15px}.blotto .wt span{color:var(--ink-soft);font-size:15px}.blotto .wt img{aspect-ratio:4/3;object-fit:cover;border-radius:10px;width:100%}.blotto .lightbox{background:color-mix(in srgb,var(--hero-ink) 88%,transparent);z-index:70;flex-direction:column;justify-content:center;align-items:center;gap:10px;padding:20px;display:flex;position:fixed;inset:0}.blotto .lightbox img{border-radius:12px;max-width:100%;max-height:80vh}.blotto .lightbox p{color:var(--hero-white);margin:0;font-weight:700}@media (prefers-reduced-motion:reduce){.blotto .score.pop{animation:none}.blotto .b:active{transform:none}}.blotto .cgrid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding-top:8px;display:grid}.blotto .cg{flex-direction:column;gap:6px;min-width:0;font-size:15px;font-weight:700;display:flex}.blotto .cg-sw{border:1px solid var(--line);border-radius:8px;height:56px;position:relative;overflow:hidden}.blotto .cg-sw img{object-fit:cover;border-radius:7px;width:100%;height:100%;display:block}.blotto .cg-m{border-radius:50%;justify-content:center;align-items:center;width:30px;height:30px;font-size:18px;display:flex;position:absolute;top:-8px;right:-6px}.blotto .cg-m.ok{background:var(--blotto-ok-bg);color:var(--blotto-ok)}.blotto .cg-m.no{background:var(--blotto-no-bg);color:var(--error-red)}.blotto [role=tabpanel]{gap:14px}.blotto .b{white-space:normal;height:auto}@media (width<=420px){.blotto h1{font-size:44px}.blotto .chip{padding:3px 5px}.blotto .ptop{gap:6px}.blotto .score{min-width:48px}.blotto .head{padding-inline:18px}}@media (width<=720px){.blotto-hero-card{grid-template-columns:1fr!important}.blotto-hero-card>div:last-child{min-height:220px}}