:root{color-scheme:dark;--ink:#11181e;--panel:#1b252d;--paper:#f5efdf;--accent:#efca62;--muted:#b1bac1;--line:#aab4bc33;font-family:"DM Sans",Arial,sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--ink);color:var(--paper);-webkit-font-smoothing:antialiased}button,a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}button{font:inherit;color:inherit;cursor:pointer}a{color:inherit}button:focus-visible,a:focus-visible{outline:3px solid var(--paper);outline-offset:5px}h1,h2,h3,p{margin:0}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:absolute;z-index:30;left:16px;top:-100px;padding:12px;background:var(--accent);color:var(--ink)}.skip-link:focus{top:12px}
.select-screen{--character-accent:#efca62;max-width:1800px;margin:auto}.select-screen[data-character=campi]{--character-accent:#ebb381}.select-screen[data-character=scandicci]{--character-accent:#9bceda}
.site-header{height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(20px,4vw,64px);border-bottom:1px solid var(--line)}.brand img{display:block;width:112px;height:auto;filter:invert(1)}.site-header h1{font-size:14px;font-weight:600;letter-spacing:.05em}
.selection-arena{min-height:calc(100svh - 76px);display:flex;flex-direction:column}.stage{position:relative;isolation:isolate;flex:1;min-height:400px;overflow:hidden;background:radial-gradient(ellipse at 53% 50%,#34424b 0,#1b2730 48%,#11181e 82%);touch-action:pan-y}.stage:before{content:"";position:absolute;inset:0;z-index:-1;opacity:.32;background:linear-gradient(115deg,transparent 0 30%,#bcc5c80c 30% 30.2%,transparent 30.2% 68%,#bcc5c80c 68% 68.2%,transparent 68.2%),repeating-linear-gradient(0deg,transparent 0 70px,#aab4bc16 71px)}.stage:after{content:"";position:absolute;left:0;right:0;bottom:0;height:55%;background:linear-gradient(transparent,#11181e);pointer-events:none;z-index:1}
.stage-heading{position:relative;z-index:4;display:flex;align-items:center;justify-content:space-between;padding:24px clamp(20px,4vw,64px)}.stage-heading h2{font-family:"Barlow Condensed",Impact,sans-serif;font-size:clamp(26px,2.7vw,38px);font-weight:700;text-transform:uppercase;letter-spacing:.015em}.selection-status{font-size:12px;letter-spacing:.13em;color:var(--muted);border:1px solid var(--line);padding:8px 12px}
.character-name{position:absolute;left:4%;top:22%;font-family:"Barlow Condensed",Impact,sans-serif;font-size:clamp(100px,20vw,300px);font-weight:900;line-height:.82;letter-spacing:-.025em;color:var(--character-accent);opacity:.14;transform:skew(-7deg);pointer-events:none;transition:color .18s}.portrait-window{position:absolute;inset:58px 26% 0 24%;overflow:hidden;z-index:1;mask-image:linear-gradient(to right,transparent,#000 10%,#000 90%,transparent)}.hero-portrait{position:absolute;width:100%;height:100%;object-fit:contain;object-position:center bottom;opacity:0;transform:translateX(20px) scale(.98);transition:opacity .2s,transform .24s cubic-bezier(.2,.7,.2,1);mask-image:linear-gradient(#000 0 77%,transparent 100%)}.hero-portrait.is-visible{opacity:1;transform:translateX(0) scale(1)}
.direction{position:absolute;z-index:5;top:50%;width:48px;height:54px;display:grid;place-items:center;background:#11181e88;border:1px solid var(--line);transition:background .15s,border-color .15s}.direction:hover{background:#34424b;border-color:var(--character-accent)}.direction svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2}.direction-prev{left:clamp(20px,4vw,64px)}.direction-next{right:clamp(20px,4vw,64px)}
.location-panel{position:absolute;z-index:3;left:clamp(20px,4vw,64px);bottom:72px;max-width:31%}.location-label{font-size:12px;font-weight:700;letter-spacing:.15em;color:var(--character-accent)}.location-panel h3{font-family:"Barlow Condensed",Impact,sans-serif;font-size:clamp(42px,5vw,76px);line-height:1;font-weight:800;margin:8px 0 10px}.location-address{font-size:16px;color:var(--muted);line-height:1.4}.booking-mode{display:inline-block;margin-top:18px;font-size:14px;font-weight:600;border-bottom:2px solid var(--character-accent);padding-bottom:6px}.stage-footnote{position:absolute;z-index:3;left:clamp(20px,4vw,64px);right:clamp(20px,4vw,64px);bottom:18px;display:flex;justify-content:space-between;font-size:12px;letter-spacing:.14em;color:var(--muted)}
.control-deck{position:relative;z-index:6;display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,.55fr);gap:44px;align-items:center;padding:18px clamp(20px,4vw,64px) 25px;border-top:1px solid var(--line);background:linear-gradient(180deg,#23313b,#11181e)}.roster-block{min-width:0}.input-hint{font-size:12px;color:var(--muted);margin:0 0 12px}.roster{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.character-card{position:relative;display:flex;align-items:center;min-width:0;height:112px;border:1px solid #6a7780;padding:0;background:#26313a;overflow:visible;text-align:left;transition:transform .16s,border-color .16s,background .16s}.character-card:hover{border-color:var(--paper);background:#34424b}.character-card.is-selected{z-index:2;border:2px solid var(--character-accent);background:#36414a;transform:translateY(-4px);box-shadow:0 5px 0 -2px var(--character-accent)}.card-portrait{position:relative;align-self:stretch;width:42%;overflow:hidden;mask-image:linear-gradient(90deg,#000 70%,transparent)}.card-portrait img{width:150%;max-width:none;position:absolute;top:-3px;left:-22%;height:auto}.card-info{position:relative;min-width:0;padding:16px 5px 8px 0;display:flex;flex-direction:column;gap:5px;flex:1}.card-info strong{font-family:"Barlow Condensed",Impact,sans-serif;font-weight:800;font-size:clamp(22px,2.2vw,32px);line-height:1}.card-info>span{font-size:12px;line-height:1.25;color:var(--muted)}.selected-tag{display:none;position:absolute;top:-10px;right:9px;font-size:10px;font-weight:700;letter-spacing:.1em;background:var(--character-accent);color:var(--ink);padding:3px 7px}.is-selected .selected-tag{display:block}.confirm-block{padding-top:24px}.confirm-button{width:100%;min-height:64px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 23px;border:0;background:var(--character-accent);color:var(--ink);box-shadow:0 4px 0 #080d12;font-size:18px;font-weight:700;transition:background .15s,transform .15s}.confirm-button:hover{filter:brightness(1.08);transform:translateY(-1px)}.confirm-button:active{transform:translateY(2px)}.confirm-symbol{font-size:26px;font-weight:400}.confirm-hint{font-size:12px;line-height:1.4;color:var(--muted);margin-top:10px}
.confirmation{position:fixed;width:min(720px,calc(100% - 32px));max-height:calc(100svh - 32px);padding:0;border:1px solid #72828c;background:var(--ink);color:var(--paper);overflow:auto;box-shadow:0 24px 100px #000a}.confirmation[open]{display:grid;grid-template-columns:.85fr 1.15fr;animation:ready-in .2s ease-out}.confirmation::backdrop{background:#080d12c9;backdrop-filter:blur(8px)}.close-confirmation{position:absolute;z-index:2;right:12px;top:10px;min-width:44px;min-height:44px;background:var(--ink);border:1px solid var(--line);font-size:28px}.confirmation-portrait{overflow:hidden;background:#26313a}.confirmation-portrait img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 15%}.confirmation-content{padding:64px 32px 28px}.ready-label{font-size:12px;font-weight:700;letter-spacing:.1em;color:var(--accent)}.ready-label span{margin-right:6px}.confirmation h2{font-family:"Barlow Condensed",Impact,sans-serif;font-size:44px;line-height:1;margin:16px 0}.confirmation-content>p:not(.external-hint){font-size:16px;line-height:1.6;color:var(--muted)}.booking-link{display:block;margin-top:28px;padding:16px;background:var(--accent);color:var(--ink);font-size:16px;text-align:center;text-decoration:none;font-weight:700}.external-hint{font-size:12px;line-height:1.5;color:var(--muted);margin:10px 0 20px;text-align:center}.change-selection{border:0;border-bottom:1px solid var(--muted);padding:4px 0;background:none;font-size:14px}.no-script{padding:20px;display:grid;gap:16px}.selection-arena.is-changing .character-name{animation:name-in .2s ease-out}@keyframes name-in{from{opacity:.04;transform:skew(-7deg) translateX(-12px)}to{opacity:.14;transform:skew(-7deg) translateX(0)}}@keyframes ready-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@media(min-width:900px){.selection-arena{height:calc(100svh - 76px);min-height:660px}.stage{min-height:400px}.control-deck{min-height:206px}}
@media(max-width:899px){.site-header{height:60px;padding:0 20px}.brand img{width:94px}.site-header h1{font-size:12px}.selection-arena{min-height:calc(100svh - 60px)}.stage{min-height:360px}.stage-heading{padding:18px 20px}.stage-heading h2{font-size:28px}.selection-status{font-size:10px;padding:6px 8px}.character-name{left:4%;top:20%;font-size:25vw}.portrait-window{inset:45px 3% 0 10%}.direction{width:42px;height:46px;top:44%}.direction-prev{left:14px}.direction-next{right:14px}.location-panel{left:20px;right:20px;bottom:18px;max-width:none}.location-label,.stage-footnote{display:none}.location-panel h3{font-size:44px;margin:0 0 4px}.location-address{font-size:14px}.booking-mode{position:absolute;right:0;bottom:3px;margin:0;font-size:12px;padding-bottom:4px}.stage:after{height:43%;background:linear-gradient(transparent 0,#11181e 84%)}.control-deck{display:block;padding:12px 16px max(14px,env(safe-area-inset-bottom));background:var(--ink)}.input-hint{text-align:center;font-size:12px;margin-bottom:13px}.roster{gap:8px}.character-card{height:130px;flex-direction:column}.card-portrait{width:100%;flex:1;min-height:0;mask-image:linear-gradient(#000 70%,transparent)}.card-portrait img{width:100%;left:0;top:-7%}.card-info{flex:0 0 48px;width:100%;padding:0 4px 6px;align-items:center;gap:3px;text-align:center}.card-info strong{font-size:23px}.card-info>span{font-size:12px}.selected-tag{top:-9px;left:50%;right:auto;transform:translateX(-50%)}.confirm-block{padding-top:16px}.confirm-button{min-height:52px;font-size:16px;padding:12px 18px}.confirm-hint{text-align:center;margin-top:8px}.confirmation[open]{grid-template-columns:1fr}.confirmation-portrait{height:150px}.confirmation-portrait img{object-position:50% 19%}.confirmation-content{padding:24px}.confirmation h2{font-size:36px}.confirmation h2 br{display:none}.booking-link{margin-top:20px}}
@media(max-width:899px) and (min-height:640px){.selection-arena{height:calc(100svh - 60px)}.stage{min-height:0}.control-deck{flex:0 0 auto}}
@media(max-width:480px){.stage-heading h2{font-size:24px}.selection-status{font-size:9px;letter-spacing:.05em}.character-name{top:22%;font-size:28vw}.portrait-window{left:4%;right:4%}.location-panel h3{font-size:38px}.booking-mode{position:static;display:block;border:0;padding:0;margin-top:5px;font-size:12px}.location-panel{bottom:14px}.location-address{font-size:13px}.character-card{height:120px}.card-info strong{font-size:22px}.card-info>span{font-size:12px;letter-spacing:-.02em}.confirm-block{padding-top:14px}.confirmation-portrait{height:140px}}
@media(max-height:680px) and (max-width:899px){.site-header{height:52px}.selection-arena{min-height:calc(100svh - 52px)}.stage{min-height:290px}.stage-heading{padding-top:12px;padding-bottom:12px}.stage-heading h2{font-size:22px}.location-panel h3{font-size:34px}.character-card{height:104px}.input-hint{margin-bottom:11px}.control-deck{padding-top:10px;padding-bottom:10px}.confirm-block{padding-top:12px}.confirm-button{min-height:48px}.confirm-hint{margin-top:6px}.confirmation-portrait{height:110px}.confirmation-content{padding-top:20px}}
@media(max-height:540px) and (min-width:700px){.selection-arena{height:auto;min-height:680px}.stage{min-height:400px}.control-deck{display:grid;grid-template-columns:1fr .6fr}.character-card{flex-direction:row;height:96px}.card-portrait{width:42%}.card-info{align-items:flex-start;text-align:left;flex:1}.confirm-block{padding-top:24px}}
body.is-confirming{overflow:hidden}
@media(max-width:480px){.selection-status{display:none}.selected-tag{font-size:12px;letter-spacing:.03em}}
@media(max-height:680px) and (max-width:899px){.stage{min-height:270px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.hero-portrait,.hero-portrait.is-visible{transform:none}.character-card.is-selected{transform:none}}
