@font-face{font-family:'Duck Chalk';src:url('./assets/fonts/caveat-latin.woff') format('woff');font-style:normal;font-weight:400 700;font-display:swap}
:root{--backdrop:#245da8;--ink:#fffaf0;--paper:#f5e8c8;--coral:#ff754b;--blue:#203e62;--chalk:'Duck Chalk',cursive;color-scheme:light}
*{box-sizing:border-box}
html,body{width:100%;min-height:100%;margin:0}
html{height:100%;overflow:hidden}
body{height:100%;background:var(--backdrop);color:var(--ink);font-family:var(--chalk);font-weight:500;-webkit-tap-highlight-color:transparent}
button,input{font:inherit;color:inherit}
button{cursor:pointer}button:disabled{cursor:default;opacity:.55}
button:focus-visible,input:focus-visible,summary:focus-visible{outline:2px dashed var(--ink);outline-offset:5px}
.chalk-definitions{position:absolute;width:0;height:0;overflow:hidden;pointer-events:none}
.chalk-text,.chalk-drawing{filter:url(#chalk-grain)}
.chalk-icon{width:30px;height:34px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;filter:url(#chalk-grain)}
.shot-fill{fill:var(--shot-fill,transparent);stroke:none}
#dancefloor{height:100vh;height:100svh;width:100%;position:relative;overflow:hidden;isolation:isolate}
#stage{position:absolute;inset:0;touch-action:none;outline:none;user-select:none;-webkit-user-select:none}
#stage.over-duck{cursor:grab}#stage.dragging{cursor:grabbing}
#stage:focus-visible{outline:2px dashed var(--ink);outline-offset:-8px}
#stage canvas{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity .5s ease}
#stage.ready canvas{opacity:1}
#duck-fallback,#duck-front{position:absolute;max-width:none;pointer-events:none;object-fit:contain;object-position:bottom;transform-origin:58% 100%;transition:opacity .5s ease}
#duck-front{opacity:0}#stage.ready #duck-fallback,#stage.ready #duck-front{opacity:0!important}
.signature{position:absolute;right:3%;bottom:max(5%,env(safe-area-inset-bottom));pointer-events:none}
.wordmark{display:block;width:clamp(52px,5vw,82px);height:auto;user-select:none;filter:url(#chalk-grain)}

/* A folded note, with the story written directly beneath it. */
.side-left{position:absolute;left:3%;top:10.5%;width:35%;z-index:2}
.story-trigger{position:relative;display:flex;align-items:center;justify-content:space-between;gap:20px;width:clamp(240px,22.5vw,378px);height:clamp(54px,8vh,76px);border:0;background:none;padding:6px 28px 5px 23px;color:#22221b;isolation:isolate;transform:rotate(-1deg);transition:transform .2s}
.question-paper{position:absolute;inset:0;z-index:-1;background:linear-gradient(115deg,#fff5da,#f0e2bf 65%,#fff0cf);clip-path:polygon(0 14%,5% 4%,91% 0,100% 34%,100% 91%,94% 98%,2% 96%);filter:drop-shadow(1px 3px 1px #12385c33)}
.question-paper::before{content:'';position:absolute;inset:0;opacity:.13;filter:url(#chalk-grain);background:repeating-linear-gradient(124deg,transparent 0 23px,#b5a68528 24px 25px,transparent 27px 48px)}
.question-paper::after{content:'';position:absolute;right:0;top:0;width:10%;height:39%;background:var(--coral);clip-path:polygon(0 0,100% 100%,18% 100%)}
#story-prompt{font-size:clamp(27px,2.3vw,39px);line-height:1;font-weight:600;white-space:nowrap}
.story-toggle-mark{font-size:34px;line-height:1;font-weight:500;padding-top:4px}
.question-rays{position:absolute;left:calc(100% + 11px);top:0;width:40px;height:100%;stroke:var(--ink);stroke-width:3;stroke-linecap:round;pointer-events:none}
.story-trigger:hover{transform:rotate(0) translateY(-1px)}.story-trigger:active{transform:rotate(0) translateY(1px)}
.story-trigger:focus-visible{outline-color:var(--paper)}
.story-lines{padding:15px 0 0 6px;animation:story-in .2s ease-out both}
.story-copy{font-size:clamp(22px,1.9vw,32px);line-height:1.22;letter-spacing:.35px}
.story-copy p{margin:0 0 10px;white-space:nowrap}.story-copy .story-answer{font-weight:600}.story-copy .last-line{margin-top:23px;margin-bottom:0}
.story-keyword{display:inline;border:0;padding:0;background:none;line-height:inherit;letter-spacing:inherit;position:relative;transition:color .18s}
.story-keyword:hover,.story-keyword:focus-visible{color:#ffc5a1}.story-keyword:focus-visible{outline-offset:2px}
.help-words{position:relative;display:inline-block}
.help-words::after{content:'';position:absolute;left:0;right:-3px;bottom:-5px;height:4px;background:var(--coral);border-radius:45% 30% 40% 25%;transform:rotate(-.4deg) scaleX(0);transform-origin:left;transition:transform .4s ease;pointer-events:none}
.is-written .help-words::after{transform:rotate(-.4deg) scaleX(1)}
.ink-word{display:inline-block;white-space:nowrap}.ink-char{display:inline-block;white-space:pre;clip-path:inset(-10% 100% -15% 0);animation:letter-write var(--duration,.12s) linear var(--delay,0s) both}

/* The matching action moves a few pixels when a story keyword is used. */
.duck-tab{position:absolute;right:2.5%;top:11.5%;width:20%;max-width:334px;z-index:3;font-size:clamp(20px,1.85vw,31px)}
.stat-label{margin:0 0 8px;line-height:1.1}
.shot-row{display:flex;align-items:center;justify-content:space-between;gap:15px}
.shot-glasses{display:flex;justify-content:space-between;gap:clamp(7px,1vw,17px);flex:1}
.shot-glasses .chalk-icon{width:clamp(24px,2.3vw,39px);height:clamp(36px,5.5vh,52px)}
.shot-glasses .is-filled{--shot-fill:var(--coral)}
#drinks-count{font-size:1.3em;font-weight:500;line-height:1;padding:0 5px}
.night-fund{margin:26px 3px 0}
.fund-heading{display:flex;justify-content:space-between;gap:10px;margin-bottom:9px;font-size:.96em;white-space:nowrap}
.fund-meter{height:clamp(22px,3.5vh,34px);border:2.5px solid var(--ink);transform:rotate(.3deg);border-radius:1px 2px 1px 3px;overflow:hidden}
.fund-meter>span{display:block;height:100%;width:0;background:var(--coral)}
.support-actions{display:flex;flex-direction:column;gap:26px;margin-top:36px}
.support-button{display:flex;align-items:center;justify-content:center;gap:14px;width:100%;min-height:clamp(52px,7.4vh,70px);padding:9px 12px;background:none;border:0;font-size:inherit;font-weight:500;line-height:1.15;white-space:nowrap;transition:background .2s,box-shadow .2s,color .2s;transform-origin:center}
.support-button .chalk-icon{width:clamp(26px,2.5vw,42px);height:clamp(33px,4.6vh,44px)}
.shot-button{background:var(--coral);border-radius:18px 16px 17px 15px;box-shadow:1px 3px 5px #153c5f22;color:#fffaf1}
.shot-button:hover,.shot-button.is-linked{background:#ff8b5f;box-shadow:0 0 0 3px #ffb28b55,1px 3px 6px #153c5f22}
.ticket-button{border:2.5px solid var(--paper);border-radius:12px 13px 9px 14px}
.ticket-button:hover,.ticket-button.is-linked{background:#ffffff12;box-shadow:0 0 0 3px #f5e8c829}
.action-caption{margin:12px 3px 0;font-size:.93em;line-height:1.1}
.merch-button{justify-content:flex-start;padding:5px 2px;gap:18px;min-height:62px}
.merch-button .chalk-icon{width:clamp(36px,3.6vw,60px);height:clamp(36px,5.4vh,52px)}
.merch-button>span{border-bottom:1.5px solid var(--ink);padding:4px 0}
.merch-button .merch-arrow{width:30px;height:30px;margin-left:auto}
.merch-button:hover,.merch-button.is-linked{color:#ffd9b2}.merch-button.is-linked>span{border-bottom-color:var(--coral)}

/* Support details use the same right-hand space. */
.duck-tab.help-open>.daily-shots,.duck-tab.help-open>.night-fund,.duck-tab.help-open>.support-actions{display:none}
.help-panels{max-height:77svh;overflow:auto;scrollbar-width:thin;scrollbar-color:#fff7 transparent;padding:0 5px 12px}
.help-close{display:block;min-height:35px;margin:0 0 17px auto;padding:3px 0 3px 10px;background:none;border:0;font-size:22px}
.help-close span{margin-left:6px;font-size:28px}
.inline-fund,.inline-shop{animation:story-in .2s ease-out both}
.inline-fund h2,.inline-shop h2{font-size:clamp(25px,2vw,32px);font-weight:600;line-height:1.1;margin:0 0 20px;outline:none}
.fund-options{display:flex;gap:9px;border:0;padding:0;margin:0 0 12px}
.fund-options label{flex:1;min-width:0;position:relative;cursor:pointer}
.fund-options input{position:absolute;width:1px;height:1px;opacity:0}
.fund-option{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:76px;padding:8px 3px;border:1.5px solid #f8f4e978;border-radius:39% 45% 36% 42% / 15% 20% 12% 14%;transition:background .2s,color .2s}
.fund-option strong{font-size:31px;font-weight:650;line-height:1.05}.fund-option>span{font-size:17px;font-weight:500;white-space:nowrap}
.fund-options input:checked+.fund-option{background:var(--paper);color:var(--blue);border-color:var(--paper)}
.fund-options input:focus-visible+.fund-option{outline:2px dashed var(--ink);outline-offset:4px}
.fund-caption{font-size:23px;line-height:1.2;min-height:48px;margin:16px 0;font-weight:500}
.checkout-button{width:100%;min-height:45px;border:1px solid var(--ink);background:var(--paper);color:var(--blue);font-size:24px;border-radius:3px}
.checkout-button:disabled{background:transparent;color:var(--ink);border-style:dashed}
.payment-note{font:10px/1.65 Arial,sans-serif;opacity:.67;margin:12px 0 0;text-align:center}
.preview-shot{display:block;margin:14px auto 0;padding:7px 10px;background:none;border:0;border-bottom:1px dashed #ffffff80;font-size:23px;line-height:1.1}
.preview-shot:hover{color:#ffd9b2}.shot-status{margin:9px 0 0;text-align:center;font:10px/1.45 Arial,sans-serif;opacity:.8}
.shop-products{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:0 0 12px}
.product{min-width:0}.product-art{display:grid;place-items:center;aspect-ratio:4/5;width:100%;position:relative;overflow:hidden;background:#e6dcc7}
.mini-poster{width:71%;height:82%;background:#395b92;position:relative;overflow:hidden;box-shadow:3px 5px 9px #243f5924;transform:rotate(-5deg)}
.poster-duck{position:absolute;width:160%;max-width:none;left:-26%;bottom:-7%;height:102%;object-fit:cover;object-position:50% 50%}
.poster-mark{position:absolute;left:10%;top:9%;width:28%;height:auto}
.shirt-art{background:#dcd8ca}.shirt-mockup{width:100%;height:100%;transform:rotate(4deg)}
.product h3{font-size:23px;font-weight:600;line-height:1;margin:12px 0 6px}.product p{font:10px/1.5 Arial,sans-serif;opacity:.75;margin:0;min-height:30px}
.product button{padding:5px 0;border:0;background:none;font-size:20px;min-height:35px}

/* The little cream cassette keeps all existing playback controls. */
.music-player{position:absolute;left:3.4%;bottom:4.8%;width:17.3%;max-width:290px;z-index:4;color:var(--paper)}
.music-label{font-size:clamp(20px,1.6vw,27px);margin:0 0 8px;line-height:1.1}
.song-picker{position:relative}
.song-picker summary{position:relative;display:block;list-style:none;cursor:pointer;line-height:1}
.song-picker summary::-webkit-details-marker{display:none}
.cassette-art{display:block;width:100%;height:auto}
.cassette-title{position:absolute;top:9%;left:5%;width:90%;display:flex;align-items:center;justify-content:center;gap:15px;color:#202820;font-size:clamp(20px,1.8vw,30px);white-space:nowrap;font-weight:600}
#song-title{overflow:hidden;text-overflow:ellipsis}
.cassette-title>svg{width:19px;height:19px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;transition:transform .2s}
.song-picker[open] .cassette-title>svg{transform:rotate(180deg)}
.cassette-reel{animation:cassette-turn 3s linear infinite;animation-play-state:paused}
.is-playing .cassette-reel{animation-play-state:running}
.song-menu{position:absolute;bottom:calc(100% + 14px);left:-8px;min-width:280px;padding:12px 14px 10px;background:var(--backdrop);box-shadow:0 4px 24px #16335133;border:1px solid #ffffff70;border-radius:2px}
.song-choice{display:flex;justify-content:space-between;align-items:center;gap:20px;width:100%;padding:7px 2px;border:0;background:none;text-align:left;font-size:24px}
.song-choice small{font:10px Arial,sans-serif;opacity:.8}
.song-choice[aria-pressed="true"] span{text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}
.song-choice:hover{color:#ffd9b2}.song-menu>a{display:block;padding-top:12px;margin-top:5px;border-top:1px dashed #ffffff45;font:10px/1.4 Arial,sans-serif;color:inherit;text-decoration:none;opacity:.85}
.song-progress{display:block;appearance:none;-webkit-appearance:none;width:100%;height:22px;margin:8px 0 0;border:0;border-radius:0;background:none;cursor:pointer;--played:0%}
.song-progress::-webkit-slider-runnable-track{height:3px;background:var(--paper);border-radius:2px}
.song-progress::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:12px;height:12px;border:0;border-radius:50%;background:var(--paper);margin-top:-4.5px}
.song-progress::-moz-range-track{height:3px;background:var(--paper)}.song-progress::-moz-range-progress{height:3px;background:var(--paper)}.song-progress::-moz-range-thumb{width:12px;height:12px;border:0;border-radius:50%;background:var(--paper)}
.song-progress:disabled{cursor:default;opacity:.8}
.player-controls{display:flex;align-items:center;justify-content:space-between;margin:1px 0 7px}
.player-controls button{display:grid;place-items:center;width:38px;height:40px;padding:5px;border:0;background:none;transition:transform .2s}
.player-controls button:first-child{margin-left:-6px}.player-controls button:last-of-type{margin-right:-6px}
.player-controls button:hover{transform:scale(1.1)}.player-controls button:active{transform:scale(.95)}
.player-controls svg{width:29px;height:29px;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;fill:currentColor}
.song-time{display:none}
.player-note{font-size:clamp(16px,1.45vw,24px);margin:0;line-height:1.15;white-space:nowrap}
.player-status{font:10px/1.4 Arial,sans-serif;margin:5px 0 0}.player-status:empty{display:none}
.is-loading .play-button{animation:loading-audio 1s ease-in-out infinite alternate}
[hidden]{display:none!important}.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}
@keyframes letter-write{from{clip-path:inset(-10% 100% -15% 0)}to{clip-path:inset(-10% -5% -15% 0)}}
@keyframes story-in{from{opacity:0;transform:translateY(-3px)}to{opacity:1;transform:none}}
@keyframes cassette-turn{to{transform:rotate(360deg)}}
@keyframes loading-audio{to{opacity:.35}}

@media(min-width:701px) and (max-width:1100px){
  .side-left{left:3%;top:8%;width:40%}.story-trigger{width:245px;padding-left:18px;padding-right:20px}#story-prompt{font-size:29px}.question-rays{width:27px;left:calc(100% + 7px)}
  .story-copy{font-size:22px;letter-spacing:0}.story-copy p{margin-bottom:8px}.story-copy .last-line{margin-top:17px}
  .duck-tab{right:2.5%;top:10%;width:24%;font-size:22px}.support-actions{gap:19px;margin-top:25px}.support-button{gap:8px;padding:8px}.merch-button{gap:10px}.merch-button .merch-arrow{width:23px}.shot-glasses{gap:5px}
  .music-player{width:23%;left:3.4%}.cassette-title{font-size:23px}.player-note{font-size:18px}.music-label{font-size:22px}
}
@media(min-width:701px) and (max-height:720px){
  .side-left{top:6%}.story-trigger{height:55px}.story-lines{padding-top:12px}.story-copy{font-size:23px}.story-copy p{margin-bottom:6px}.story-copy .last-line{margin-top:16px}
  .duck-tab{top:7%;font-size:22px}.shot-glasses .chalk-icon{height:34px}.night-fund{margin-top:18px}.fund-heading{margin-bottom:6px}.fund-meter{height:23px}.support-actions{margin-top:22px;gap:18px}.support-button{min-height:48px}.support-button .chalk-icon{height:32px}.action-caption{margin-top:8px}.merch-button{min-height:42px}.merch-button .chalk-icon{height:36px}
  .music-player{bottom:4%;width:18%;min-width:170px}.music-label{font-size:20px;margin-bottom:5px}.cassette-title{font-size:22px}.player-controls{margin-bottom:3px}.player-controls button{height:32px}.player-controls svg{height:23px;width:23px}.song-progress{margin-top:4px;height:18px}.player-note{font-size:17px}.wordmark{width:52px}
}
@media(max-width:700px) and (orientation:portrait){
  html{overflow:auto}body{height:auto;overflow-x:hidden}#dancefloor{min-height:760px}
  .side-left{top:26px;left:16px;width:calc(100% - 32px)}.story-trigger{height:54px;width:245px;padding:6px 22px 5px 17px}#story-prompt{font-size:29px}.story-toggle-mark{font-size:28px}.question-rays{height:48px;width:29px;left:calc(100% + 9px)}
  .story-lines{padding:13px 0 0 2px}.story-copy{font-size:clamp(20px,5.5vw,25px);line-height:1.25;letter-spacing:0}.story-copy p{margin-bottom:7px}.story-copy .last-line{margin-top:15px}.help-words::after{height:3px;bottom:-3px}
  .duck-tab{width:45%;max-width:235px;right:16px;top:auto;bottom:16%;font-size:clamp(17px,4.6vw,23px)}.stat-label{margin-bottom:6px}.shot-row{gap:8px}.shot-glasses{gap:5px}.shot-glasses .chalk-icon{width:clamp(17px,4.3vw,26px);height:30px}#drinks-count{padding:0;font-size:1.3em}
  .night-fund{margin:16px 1px 0}.fund-heading{gap:8px;margin-bottom:6px;font-size:.95em}.fund-meter{height:18px;border-width:2px}.support-actions{margin-top:20px;gap:17px}.support-button{min-height:44px;padding:7px 5px;gap:7px;border-radius:9px}.support-button .chalk-icon{width:23px;height:27px}.ticket-button{border-width:2px}.action-caption{font-size:.94em;margin:8px 1px 0}.merch-button{gap:8px;min-height:38px;padding:1px}.merch-button .chalk-icon{width:28px;height:30px}.merch-button .merch-arrow{width:19px;height:23px}.merch-button>span{padding:2px 0}
  .music-player{width:43%;max-width:235px;left:16px;bottom:28px}.music-label{font-size:20px;margin-bottom:7px}.cassette-title{font-size:clamp(17px,4.7vw,24px);gap:7px;top:9%}.cassette-title>svg{width:13px;height:13px}.song-progress{height:19px;margin-top:4px}.song-progress::-webkit-slider-thumb{width:9px;height:9px;margin-top:-3px}.song-progress::-moz-range-thumb{width:9px;height:9px}.player-controls{margin:0 0 5px}.player-controls button{width:34px;height:34px;padding:6px}.player-controls svg{width:22px;height:22px}.player-note{font-size:clamp(13px,3.8vw,18px)}
  .song-menu{min-width:260px;left:0}.song-choice{font-size:22px}.signature{right:21px;bottom:28px}.wordmark{width:46px}
  .duck-tab.help-open{top:38%;bottom:auto;max-width:none;width:calc(100% - 32px);padding:16px 18px 20px;background:#245da8f5;border:1px solid #fff7;border-radius:4px}.help-panels{max-height:42svh;padding-bottom:3px}.help-close{font-size:21px;margin-bottom:8px}.inline-fund h2,.inline-shop h2{font-size:27px;margin-bottom:17px}.fund-caption{font-size:22px;min-height:0}.payment-note{font-size:9px}.shop-products{max-width:300px}.product-art{max-height:160px}
}
@media(max-width:900px) and (orientation:landscape) and (max-height:500px){
  html{overflow:auto}body{height:auto}#dancefloor{min-height:540px}.side-left{top:28px}.story-trigger{width:220px;height:50px}#story-prompt{font-size:27px}.story-copy{font-size:21px}.story-copy p{margin-bottom:5px}.story-copy .last-line{margin-top:10px}.duck-tab{top:35px;font-size:20px;width:24%}.support-actions{gap:13px}.support-button{min-height:44px;gap:6px}.action-caption{font-size:18px}.merch-button .chalk-icon{width:30px}.merch-button .merch-arrow{width:18px}.music-player{width:180px}.player-note{font-size:16px}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.ink-char{clip-path:none}}