@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Noto+Sans+SC:wght@400;500;600;700;800;900&display=swap');

:root{font-family:'Noto Sans SC',sans-serif;color:#201d1a;background:#f5f0e6;font-synthesis:none;overflow-x:clip}
*{box-sizing:border-box}
body{margin:0;min-width:320px;overflow-x:clip;background:radial-gradient(circle at 15% 10%,#fff8e7 0,transparent 32%),#f5f0e6}
button{font:inherit;cursor:pointer}
button:focus-visible,a:focus-visible{outline:3px solid #fc6f39;outline-offset:4px}
.app-shell{max-width:1440px;margin:auto;padding:0 42px}
.topbar{height:94px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #bfb9ab}
.brand{display:flex;align-items:center;gap:10px;font-size:28px;font-weight:900;letter-spacing:-.09em;color:#201d1a;text-decoration:none;white-space:nowrap}
.brand-mark{width:34px;height:34px;display:grid;place-items:center;background:#f8be32;border:2px solid #201d1a;border-radius:50%;font-size:26px;line-height:1;transform:rotate(-18deg)}
.brand-dot{color:#ed663c}
.topbar-edition,.sound-toggle,.eyebrow,.panel-caption,.arcade-bottom,footer,.overlay-kicker,.overlay-footnote,.challenge-notice{font-family:'DM Mono','Noto Sans SC',monospace}
.topbar-edition{font-size:12px;letter-spacing:.04em;color:#666055}
.topbar-edition b{color:#201d1a;margin-left:8px}
.sound-toggle{background:none;border:1px solid #aaa394;border-radius:50px;padding:9px 14px;font-size:11px;font-weight:500;letter-spacing:.03em;min-width:91px}
.sound-toggle:hover{background:#201d1a;color:#fff}
.headline{display:flex;justify-content:space-between;gap:30px;padding:52px 0 34px;align-items:end}
.eyebrow{font-size:12px;font-weight:500;letter-spacing:.1em;margin-bottom:20px;display:flex;align-items:center;gap:9px}
.live-dot{width:9px;height:9px;border-radius:50%;background:#ed663c;box-shadow:0 0 0 4px #ed663c25}
h1{font-size:clamp(46px,6vw,86px);letter-spacing:-.095em;line-height:1.1;margin:0;font-weight:900}
h1 em{font-style:normal;color:#ee6940}
.headline-side{display:flex;align-items:end;gap:38px;margin-bottom:6px}
.headline-side p{font-size:15px;line-height:1.8;color:#5f5a50;margin:0 0 12px;white-space:nowrap}
.hero-play{align-self:end;margin-bottom:15px;background:#201d1a;color:#fff8e9;border:2px solid #201d1a;border-radius:50px;padding:11px 19px;white-space:nowrap;font-size:12px;font-weight:800;box-shadow:3px 3px 0 #ed663c}.hero-play span{color:#f8be32;margin-left:11px}.hero-play:hover{transform:translate(-2px,-2px);box-shadow:5px 5px 0 #ed663c}
.headline-stamp{border:2px solid #201d1a;border-radius:50%;width:118px;height:118px;transform:rotate(12deg);display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;font-size:18px;font-weight:900;line-height:1.2;background:#f8be32;box-shadow:4px 4px 0 #201d1a}
.headline-stamp span{color:#f0673d}.headline-stamp small{font-size:10px;margin-top:6px;letter-spacing:.02em}
.arcade-scene{position:relative;isolation:isolate}
.arcade{position:relative;z-index:1;background:#201d1a;border:3px solid #201d1a;border-radius:17px;box-shadow:10px 12px 0 #d8d0bf;overflow:hidden}
.side-meme{position:absolute;display:block;z-index:0;width:270px;height:270px;object-fit:cover;pointer-events:none;mix-blend-mode:multiply;mask-image:radial-gradient(ellipse at center,#000 42%,transparent 76%);opacity:.18;filter:grayscale(.3) sepia(.2) saturate(.65)}
.side-meme-left{top:12%;left:-190px;transform:rotate(-11deg)}
.side-meme-right{top:49%;right:-190px;object-position:38% center;transform:rotate(11deg)}
.arcade-top{height:80px;display:flex;align-items:center;justify-content:space-between;color:#fff9e9;padding:0 24px;gap:18px}
.level-label,.stat{display:flex;flex-direction:column;gap:5px}.level-label strong{font-size:17px;letter-spacing:-.04em}.panel-caption{font-size:10px;color:#bbb5a6;letter-spacing:.1em;text-transform:uppercase}
.stats{display:flex;gap:44px}.stat strong{font-size:20px;line-height:1}.stat:last-child strong{font-size:16px;letter-spacing:.1em;color:#f7c248}
.canvas-wrap{position:relative;aspect-ratio:16 / 9;overflow:hidden;background:#f3c95f;touch-action:none}
canvas{display:block;width:100%;height:100%;touch-action:none;cursor:crosshair}
.floating-tip{position:absolute;left:7%;bottom:9%;font-size:13px;font-weight:800;color:#211d18;pointer-events:none;background:#fff5d7;border:2px solid #211d18;border-radius:50px;padding:10px 14px;box-shadow:3px 3px 0 #211d18}
.floating-tip>span:not(.tip-lean){font-size:19px;margin-left:5px}
.floating-tip .tip-lean{position:absolute;right:-28px;bottom:calc(100% - 4px);width:116px;height:104px;overflow:hidden;transform:rotate(12deg);mask-image:radial-gradient(ellipse at 46% 57%,#000 37%,transparent 74%);pointer-events:none}
.tip-lean img{position:absolute;left:-26px;top:0;height:100%;width:auto;max-width:none;opacity:.88;filter:grayscale(.3) contrast(1.12);mix-blend-mode:multiply}
.game-toast{position:absolute;left:50%;top:21%;transform:translateX(-50%) translateY(15px) rotate(-5deg);color:#201d1a;font-size:clamp(24px,4vw,53px);font-weight:900;letter-spacing:-.08em;text-shadow:3px 3px 0 #fff3cd;opacity:0;pointer-events:none;white-space:nowrap;transition:opacity .15s,transform .25s}
.game-toast.show{opacity:1;transform:translateX(-50%) translateY(0) rotate(-5deg)}
.flap-button{position:absolute;right:24px;bottom:24px;background:#f7c248;border:3px solid #201d1a;box-shadow:5px 5px 0 #201d1a;color:#201d1a;border-radius:100px;padding:14px 20px;font-size:18px;font-weight:900;touch-action:manipulation}
.flap-button span{font-family:'DM Mono',monospace;font-size:13px;margin-left:7px}
.flap-button:active{transform:translate(3px,3px);box-shadow:2px 2px 0 #201d1a}
.arcade-bottom{display:flex;justify-content:space-between;gap:15px;align-items:center;color:#d6cfbd;font-size:11px;letter-spacing:.01em;padding:17px 24px}
.arcade-bottom b{color:#f8c248;margin-right:12px;font-weight:500}.arcade-bottom kbd{font:inherit;border:1px solid #9e9688;border-radius:4px;padding:2px 6px;margin:0 4px}.arcade-bottom i{color:#f8c248;font-style:normal;font-size:16px;margin-left:16px}
.overlay{position:absolute;inset:0;background:rgba(24,25,23,.89);color:#fff9e9;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:22px;backdrop-filter:blur(7px);z-index:4;overflow-y:auto}
.overlay[hidden],.flap-button[hidden],.challenge-notice[hidden],.contact-card[hidden]{display:none!important}
.overlay-kicker{font-size:11px;color:#f7c248;letter-spacing:.13em;font-weight:500;margin:12px 0 10px}
.overlay h2{font-size:clamp(42px,6vw,78px);line-height:1.1;letter-spacing:-.09em;margin:0;font-weight:900}
.overlay-copy{font-size:14px;line-height:1.8;color:#e3dccd;margin:17px 0 22px}
.primary-button,.secondary-button{border-radius:100px;padding:13px 25px;min-height:50px;font-weight:900;transition:transform .15s,box-shadow .15s}
.primary-button{border:2px solid #f7c248;background:#f7c248;color:#211d18;box-shadow:4px 4px 0 #ee6840;min-width:170px;font-size:18px}.primary-button span{margin-left:26px}.primary-button:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 #ee6840}
.secondary-button{border:2px solid #fff3d5;background:transparent;color:#fff3d5;font-size:13px}.secondary-button:hover{background:#fff3d5;color:#201d1a}
.challenge-notice{font-size:11px;color:#f7c248;margin:20px 0 0}
.upgrade-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px;width:min(720px,100%);margin:4px 0 12px}
.upgrade-card{background:#fff6df;color:#201d1a;border:3px solid #201d1a;box-shadow:4px 4px 0 #ef6d42;border-radius:12px;text-align:left;padding:14px;min-height:135px;display:flex;flex-direction:column;gap:7px;transition:transform .15s,box-shadow .15s}
.upgrade-card:hover{transform:translateY(-5px);box-shadow:5px 9px 0 #ef6d42}.upgrade-icon{font-size:24px;line-height:1}.upgrade-card strong{font-size:16px}.upgrade-card small{font-size:11px;line-height:1.5;color:#675f55}
.overlay-footnote{color:#aaa494;font-size:10px;margin:8px 0 0}.end-score{margin:10px 0 0;color:#f7c248;font-family:'DM Mono',monospace;font-size:clamp(46px,7vw,82px);font-weight:500;line-height:1}.end-score small{font-size:22px;margin-left:7px}.end-actions{display:flex;gap:10px;align-items:center;justify-content:center;flex-wrap:wrap;margin-bottom:10px}
.contact-card{width:min(420px,100%);background:#f9f0d9;color:#201d1a;border-radius:10px;padding:11px 14px;margin:8px auto 6px;display:flex;align-items:center;justify-content:center;gap:5px;flex-wrap:wrap}.contact-card span{font:500 9px 'DM Mono','Noto Sans SC',monospace;color:#72695a;width:100%}.contact-card strong{font-size:13px}.contact-card button{border:0;border-bottom:1px solid #201d1a;background:transparent;color:#201d1a;font-size:11px;font-weight:800;padding:2px 0}.contact-card button:hover{color:#de5836;border-color:#de5836}
.meme-wash{position:relative;height:390px;margin-top:25px;overflow:hidden;pointer-events:none}
.meme-wash img{position:absolute;display:block;mix-blend-mode:multiply;mask-image:radial-gradient(ellipse at center,#000 42%,transparent 76%)}
.meme-wash-chicken{width:min(48vw,520px);left:7%;top:-48px;opacity:.19;filter:grayscale(.25) sepia(.2) saturate(.65);transform:rotate(-12deg)}
.meme-wash-player{width:min(38vw,430px);height:440px;right:8%;top:-24px;object-fit:cover;object-position:center;opacity:.17;filter:grayscale(.35) sepia(.2) brightness(1.15);transform:rotate(13deg)}
.has-intro{overflow:hidden}
.start-screen{position:fixed;inset:0;z-index:20;display:grid;place-items:center;overflow-y:auto;padding:24px;background:radial-gradient(circle at 15% 20%,#60503b 0,transparent 31%),#201d1a;color:#201d1a}
.start-screen[hidden],.start-visual [hidden]{display:none!important}
.start-card{width:min(990px,100%);display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);background:#fff7e7;border:3px solid #f8c248;border-radius:18px;box-shadow:14px 14px 0 #e3653b;overflow:hidden}
.start-visual{position:relative;min-height:495px;background:#282420;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px 20px;overflow:hidden}
.start-visual::before{content:'';position:absolute;width:360px;height:360px;border:24px solid #f4bd47;border-radius:50%;opacity:.12;transform:rotate(-22deg)}
.start-visual img{position:relative;display:block;width:min(100%,440px);max-height:355px;object-fit:contain;background:#eee9ff;border:7px solid #fff7e7;box-shadow:9px 9px 0 #e3653b;transform:rotate(-3deg)}
.start-progress{position:absolute;bottom:0;left:0;height:7px;width:100%;background:#f8c248;transform-origin:left;animation:intro-progress 5.5s linear both}
.start-content{padding:44px clamp(28px,4vw,55px) 36px;display:flex;flex-direction:column;align-items:flex-start}
.start-kicker,.start-meta,.start-rules b,.start-music{font-family:'DM Mono','Noto Sans SC',monospace}.start-kicker{margin:0 0 13px;color:#b44e32;font-size:11px;letter-spacing:.07em}.start-content h2{font-size:clamp(55px,6vw,88px);line-height:1;letter-spacing:-.1em;margin:0;font-weight:900}.start-content h2 span{font-size:.38em;color:#ed6844;vertical-align:top;margin-left:8px;letter-spacing:0}.start-lede{font-size:17px;font-weight:800;margin:17px 0 24px;letter-spacing:-.04em}
.start-rules{width:100%;border-top:2px solid #201d1a}.start-rules p{display:grid;grid-template-columns:38px 1fr;gap:10px;align-items:start;margin:0;padding:13px 0;border-bottom:1px solid #d6cbb7;font-size:12px;line-height:1.65}.start-rules b{color:#e3653b;font-size:13px}.start-rules strong{color:#a53e25;font-weight:900}
.start-meta{margin:18px 0 21px;color:#6d6153;font-size:11px}.start-actions{display:flex;align-items:center;gap:18px;flex-wrap:wrap}.start-music{border:0;background:transparent;color:#8b4934;font-size:11px;text-decoration:underline;text-underline-offset:4px;padding:9px 0}.start-music:hover{color:#d75633}.start-content .challenge-notice{margin:17px 0 0;color:#a53e25}
@keyframes intro-progress{from{transform:scaleX(0)}to{transform:scaleX(1)}}
footer{border-top:1px solid #bfb9ab;display:flex;justify-content:space-between;padding:24px 0 34px;font-size:11px;color:#777066}footer b{color:#e9653b;margin-left:12px;font-size:18px}
@media(max-width:1450px){.side-meme{display:none}}
@media(max-width:900px){.app-shell{padding:0 22px}.topbar{height:72px}.topbar-edition{display:none}.headline{padding:35px 0 30px}.headline-side{gap:16px}.headline-stamp{width:93px;height:93px;font-size:14px}.headline-stamp small{font-size:8px}.headline-side p{font-size:12px}.hero-play{display:none}.stats{gap:18px}.arcade-top{height:68px;padding:0 15px}.level-label strong{font-size:13px}.stat strong{font-size:16px}.arcade-bottom{font-size:10px}.arcade-bottom-right{display:none}}
@media(max-width:760px){.app-shell{padding:0 12px}.topbar{height:60px}.brand{font-size:22px}.brand-mark{width:29px;height:29px;font-size:20px}.sound-toggle{font-size:10px;padding:7px 10px}.headline{padding:30px 5px 22px;align-items:start}.headline-side p{display:none}.headline-stamp{width:69px;height:69px;font-size:11px;box-shadow:2px 2px 0 #201d1a}.headline-stamp small{font-size:7px;margin-top:2px}.eyebrow{font-size:10px;margin-bottom:13px}h1{font-size:clamp(39px,10vw,60px)}.arcade{border-width:2px;border-radius:11px;box-shadow:5px 6px 0 #d8d0bf}.arcade-top{height:59px;padding:0 9px}.panel-caption{font-size:8px}.level-label strong{font-size:10px}.stats{gap:9px}.stat strong{font-size:12px}.stat:last-child strong{font-size:9px}.canvas-wrap{aspect-ratio:4 / 5}.canvas-wrap canvas{width:100%;height:100%;object-fit:cover}.floating-tip{font-size:10px;left:3%;bottom:9%;padding:7px 9px}.floating-tip>span:not(.tip-lean){font-size:14px}.floating-tip .tip-lean{width:86px;height:77px;right:-16px;bottom:calc(100% - 2px)}.tip-lean img{left:-20px}.flap-button{right:12px;bottom:12px;padding:10px 13px;font-size:13px;box-shadow:3px 3px 0 #201d1a}.arcade-bottom{padding:12px;font-size:9px}.arcade-bottom b{margin-right:5px}.overlay{padding:13px}.overlay h2{font-size:42px}.overlay-copy{font-size:11px;margin:11px 0 15px}.primary-button,.secondary-button{min-height:42px;padding:9px 16px}.primary-button{font-size:14px;min-width:145px}.primary-button span{margin-left:13px}.upgrade-grid{gap:5px}.upgrade-card{padding:8px;border-width:2px;min-height:102px;box-shadow:2px 2px 0 #ef6d42}.upgrade-icon{font-size:18px}.upgrade-card strong{font-size:11px}.upgrade-card small{font-size:9px}.end-score{font-size:49px}.end-actions{gap:7px}.secondary-button{font-size:11px}footer{padding:19px 4px;font-size:9px}}
@media(max-width:760px){.meme-wash{height:250px;margin-top:14px}.meme-wash-chicken{width:62vw;left:-7%;top:8px}.meme-wash-player{width:47vw;height:260px;right:-2%;top:0}}
@media(max-width:760px){.start-screen{display:block;padding:12px}.start-card{grid-template-columns:1fr;margin:auto;box-shadow:6px 6px 0 #e3653b}.start-visual{min-height:0;height:245px;padding:25px}.start-visual img{width:auto;max-width:100%;height:185px;border-width:4px;box-shadow:5px 5px 0 #e3653b}.start-content{padding:24px 23px 26px}.start-kicker{font-size:9px;margin-bottom:9px}.start-content h2{font-size:56px}.start-lede{font-size:13px;margin:10px 0 14px}.start-rules p{padding:9px 0;font-size:11px}.start-meta{margin:13px 0 15px}.start-actions{gap:10px}.start-content .primary-button{min-width:120px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
