@font-face{font-family:"Bricolage Grotesque";src:url("fonts/bricolage-grotesque-800.ttf") format("truetype");font-style:normal;font-weight:800;font-display:swap}
:root{font-family:Arial,Helvetica,sans-serif;color:#222;background:#fff;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-height:100svh;display:flex;flex-direction:column}button,textarea{font:inherit}button{cursor:pointer;color:inherit;-webkit-tap-highlight-color:transparent}button:disabled{cursor:default}button:focus-visible,textarea:focus-visible{outline:3px solid #4488dc;outline-offset:5px}[hidden]{display:none!important}header{height:76px;padding:0 38px;display:flex;align-items:center;justify-content:space-between;flex-shrink:0}h1{font-size:22px;letter-spacing:-1px;font-weight:700;margin:0}.brand h1{font-size:26px;line-height:1;letter-spacing:-1px}.brand p{font-size:10px;color:#777;margin:5px 0 0;line-height:1.2}.tagline{color:#777;line-height:1.4}.tools{display:flex;align-items:center;gap:17px}.quiet-button{border:0;background:transparent;color:#777;font-size:12px;padding:10px 4px;min-height:34px;text-decoration:underline;text-underline-offset:3px}.quiet-button:hover{color:#111}.quiet-button[aria-pressed=true]{color:#111}.tools #fullscreen{font-size:23px;text-decoration:none;padding:5px 8px}.quiet-button:disabled{opacity:.35}main{flex:1;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center}.play-area{position:relative;width:min(100%,1040px);height:min(600px,calc(100svh - 232px));min-height:260px;display:flex;align-items:center;justify-content:center}canvas{display:block;width:auto;height:100%;max-width:100%;aspect-ratio:1;transition:transform .35s cubic-bezier(.2,.7,.2,1)}.speech{position:absolute;left:calc(50% + 120px);top:28%;width:330px;background:white;border:2px solid #222;border-radius:23px;padding:30px 25px 13px;box-shadow:4px 5px 0 #222;z-index:2;animation:appear .22s ease-out}.speech:before{content:'';position:absolute;left:-21px;top:61%;width:32px;height:27px;background:#fff;border-left:2px solid #222;border-bottom:2px solid #222;transform:skewX(-25deg) rotate(12deg);border-bottom-left-radius:4px;z-index:-1}.speech:after{content:'';position:absolute;left:0;top:58%;width:10px;height:45px;background:#fff}.setup,.punchline{position:relative;font-size:21px;line-height:1.33;letter-spacing:-.4px;margin:0}.setup{font-weight:400}.punchline{font-weight:700;margin-top:18px;animation:line-in .18s ease-out}.speech-actions{display:flex;align-items:center;justify-content:space-between;margin-top:18px;color:#999;font-size:10px}.speech-actions .quiet-button{font-size:10px}.dismiss{position:absolute;right:9px;top:5px;display:flex;align-items:center;justify-content:center;width:30px;height:30px;border:0;background:transparent;font-size:24px;font-weight:400;color:#aaa;border-radius:50%}.dismiss:hover{background:#f3f3f3;color:#222}.controls{display:flex;flex-direction:column;align-items:center;margin-top:6px;min-height:93px}.spin-button{display:flex;align-items:center;justify-content:center;gap:28px;padding:14px 31px;min-width:183px;min-height:53px;border:2px solid #222;border-radius:9px;background:#fbd565;font-size:21px;font-weight:800;letter-spacing:.5px;box-shadow:0 5px 0 #222;transition:transform .1s,box-shadow .1s}.spin-button svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.spin-button:hover:not(:disabled){background:#ffdf84}.spin-button:active:not(:disabled){transform:translateY(4px);box-shadow:0 1px 0 #222}.spin-button:disabled{background:#eee;box-shadow:0 3px 0 #777;border-color:#777;color:#777}.controls p{font-size:11px;color:#999;margin:15px 0 0;min-height:14px}footer{display:flex;align-items:center;justify-content:space-between;gap:15px;height:41px;flex-shrink:0;padding:0 38px;font-size:10px;color:#aaa}.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#222;color:#fff;border-radius:7px;padding:11px 19px;font-size:12px;z-index:8;max-width:calc(100vw - 28px)}dialog{position:relative;border:2px solid #222;border-radius:16px;padding:25px;width:calc(100% - 30px);max-width:450px}dialog::backdrop{background:#0004}dialog h2{font-size:21px;margin-top:0}dialog textarea{display:block;width:100%;min-height:160px;padding:12px;line-height:1.5;font-size:15px;border:1px solid #ccc;margin-bottom:10px}.no-script{text-align:center}@keyframes appear{from{opacity:0;transform:translateY(8px) scale(.96)}to{opacity:1;transform:none}}@keyframes line-in{from{opacity:0;transform:translateY(3px)}to{opacity:1;transform:none}}
@media(max-width:1000px) and (min-width:701px){.speech{left:calc(50% + 80px);width:calc(50% - 100px);max-width:300px;padding:28px 21px 10px}.setup,.punchline{font-size:19px}}
@media(max-width:700px){header{height:59px;padding:0 19px}h1{font-size:19px}.tools{gap:10px}.tools .quiet-button{font-size:10px}.tools #fullscreen{font-size:20px}.play-area{height:min(590px,calc(100svh - 209px));min-height:310px;width:100%;align-items:center}canvas{width:min(98vw,440px);height:auto;max-height:100%;transition:transform .3s}.speech{width:calc(100% - 38px);max-width:370px;left:50%;top:auto;bottom:12px;transform:translateX(-50%);border-radius:19px;padding:24px 20px 9px;box-shadow:3px 4px 0 #222;animation:mobile-appear .2s ease-out}.speech:before{left:calc(50% - 8px);top:-18px;transform:rotate(130deg) skew(-12deg);width:26px;height:25px}.speech:after{top:0;left:calc(50% - 30px);width:52px;height:10px}.setup,.punchline{font-size:19px;line-height:1.25}.punchline{margin-top:12px}.speech-actions{margin-top:10px;font-size:9px}.speech-actions .quiet-button{font-size:10px;padding-block:5px;min-height:27px}.spin-button{min-height:48px;font-size:19px;padding:11px 26px;min-width:170px}.controls{margin-top:0;min-height:86px}.controls p{margin-top:14px;font-size:10px}footer{padding:0 19px;height:33px;font-size:8px}@keyframes mobile-appear{from{opacity:0;transform:translate(-50%,7px)}to{opacity:1;transform:translate(-50%,0)}}}
@media(max-width:700px) and (max-height:740px){header{height:50px}.play-area{height:calc(100svh - 199px);min-height:290px}.speech{bottom:10px;padding:23px 18px 7px}.setup,.punchline{font-size:17px;line-height:1.22}.punchline{margin-top:10px}.speech-actions{margin-top:8px}.controls{min-height:83px}footer{height:28px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

@media(max-width:700px){.brand h1{font-size:23px}.brand p{font-size:9px;margin-top:3px}footer{height:50px;flex-direction:column;justify-content:center;gap:3px;text-align:center;padding-inline:19px}.tagline{font-size:9px;max-width:360px}}

@media(max-width:700px){.play-area{align-items:flex-start}canvas{width:min(92vw,380px);margin-top:12px}}
@media(max-width:700px) and (max-height:740px){canvas{width:min(79vw,300px);margin-top:8px}}

.brand h1{font-family:"Bricolage Grotesque",Arial,sans-serif;font-weight:800;font-size:44px;line-height:.85;letter-spacing:-2.2px;font-optical-sizing:auto}.brand p{font-size:11px;margin-top:6px}footer{height:51px;justify-content:center}.tagline{font-size:14px;color:#696969;text-align:center;max-width:none;line-height:1.45}@media(max-width:700px){.brand h1{font-size:36px;letter-spacing:-1.8px}.brand p{font-size:9px;margin-top:5px}.tools{gap:8px}.tools .quiet-button{font-size:9px}footer{height:56px}.tagline{font-size:12px;max-width:360px}}

.contact{font-size:12px;color:#777;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}.contact:hover{color:#222}.contact:focus-visible{outline:3px solid #4488dc;outline-offset:5px}@media(max-width:700px){.contact{font-size:11px;line-height:1.3}}

.header-right{display:flex;align-items:center;gap:24px}.header-right .contact{order:2;color:#444}.header-right .tools{order:1}footer #privacy{font-size:11px}#privacy-dialog p{font-size:14px;line-height:1.5}#privacy-dialog a{font-size:12px;color:#555}@media(max-width:700px){.header-right{flex-direction:column;align-items:flex-end;gap:0}.header-right .contact{order:0;font-size:12px}.header-right .tools{gap:9px}.tools .quiet-button{min-height:25px;padding-block:2px}.tools #fullscreen{font-size:17px;padding-block:2px}footer{flex-direction:row;gap:10px}footer .tagline{font-size:12px}footer #privacy{font-size:10px}}

header{position:relative;z-index:5}.menu-toggle{display:none;border:0;background:transparent;padding:10px;color:#222}.menu-toggle svg{display:block;width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}@media(max-width:700px){.menu-toggle{display:block}.header-right{display:none;position:absolute;right:19px;top:calc(100% - 2px);width:190px;background:#fff;border:1.5px solid #222;border-radius:12px;padding:12px 16px;box-shadow:3px 4px 0 #222;align-items:stretch;gap:10px}.header-right.is-open{display:flex}.header-right .contact{order:2;font-size:13px;padding:10px 4px;border-top:1px solid #eee}.header-right .tools{display:flex;flex-direction:column;align-items:stretch;gap:2px;order:1}.header-right .tools .quiet-button{font-size:13px;text-align:left;padding:9px 4px;min-height:38px}.header-right .tools #fullscreen{font-size:0}.header-right .tools #fullscreen:after{content:"fullscreen";font-size:13px;text-decoration:underline;text-underline-offset:3px}}

/* Keep the mobile action area clear: longer jokes expand upward over the wheel. */
@media(max-width:700px){
  .play-area,.controls{flex-shrink:0}
  .speech{top:auto;bottom:28px}
}

.footer-meta{display:flex;align-items:center;justify-content:center;gap:12px;white-space:nowrap}.copyright{font-size:11px;color:#777}@media(max-width:700px){footer{flex-direction:column;gap:0}.footer-meta{gap:10px;line-height:1.3}.copyright{font-size:10px}footer #privacy{min-height:18px;padding:2px 4px}}