@font-face{font-family:Atkinson Hyperlegible;font-style:normal;font-display:swap;font-weight:400;src:url(../media/atkinson-hyperlegible-latin-ext-400-normal.2f849img-7b6d.woff2)format("woff2"),url(../media/atkinson-hyperlegible-latin-ext-400-normal.3rh1rylag55x1.woff)format("woff");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Atkinson Hyperlegible;font-style:normal;font-display:swap;font-weight:400;src:url(../media/atkinson-hyperlegible-latin-400-normal.3kiu02q1_kqh0.woff2)format("woff2"),url(../media/atkinson-hyperlegible-latin-400-normal.1oa7hikx3rep8.woff)format("woff");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Atkinson Hyperlegible;font-style:normal;font-display:swap;font-weight:700;src:url(../media/atkinson-hyperlegible-latin-ext-700-normal.2n79xw2utfk64.woff2)format("woff2"),url(../media/atkinson-hyperlegible-latin-ext-700-normal.3rrhy5n1_o3ma.woff)format("woff");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Atkinson Hyperlegible;font-style:normal;font-display:swap;font-weight:700;src:url(../media/atkinson-hyperlegible-latin-700-normal.417-y-7y4nwlv.woff2)format("woff2"),url(../media/atkinson-hyperlegible-latin-700-normal.0i9r-tkp8wzyy.woff)format("woff");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
:root{--ink:#2a1e19;--ink-soft:#4a3a30;--paper:#fffdf6;--cream:#fff4d9;--cream-2:#fde9b8;--kaya:#f7c948;--kaya-deep:#e8a92a;--caramel:#c77b30;--caramel-deep:#9a5a1c;--sky:#9ad8f5;--sky-light:#d8f1fc;--mint:#bfeadf;--teal:#1f7d78;--chilli:#d9433b;--chilli-deep:#b3312a;--muted:#6a5646;--font:"Atkinson Hyperlegible", "Trebuchet MS", system-ui, sans-serif;--font-display:var(--font);--font-num:var(--font);--shadow:4px 4px 0 var(--ink);--shadow-sm:3px 3px 0 var(--ink);--radius:0;--max:1120px}*,:before,:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:before,:after{transition:none!important;animation:none!important}}body{background:var(--cream);color:var(--ink);font-family:var(--font);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;margin:0;font-size:18px;line-height:1.6}img{max-width:100%;height:auto}.pixel{image-rendering:pixelated;image-rendering:crisp-edges}a{color:var(--caramel-deep);text-underline-offset:3px;text-decoration-thickness:2px}a:hover{color:var(--chilli-deep)}:focus-visible{outline:3px solid var(--teal);outline-offset:3px}h1,h2,h3{margin:0 0 .6em;line-height:1.3}h1,h2{font-family:var(--font-display);font-weight:700}h1{font-size:clamp(1.9rem,5.5vw,2.8rem)}h2{font-size:clamp(1.5rem,4vw,2rem)}h3{font-size:1.2rem;font-weight:700}p{margin:0 0 1em}.container{width:min(var(--max), 100% - 32px);margin-inline:auto}.skip-link{z-index:100;background:var(--paper);border:2px solid var(--ink);padding:8px 12px;position:absolute;top:-60px;left:8px}.skip-link:focus{top:8px}.panel{background:var(--paper);border:2px solid var(--ink);box-shadow:var(--shadow)}.btn{border:2px solid var(--ink);background:var(--paper);min-height:44px;color:var(--ink);box-shadow:var(--shadow-sm), inset -3px -4px 0 #00000024, inset 3px 3px 0 #fff9;font-family:var(--font);cursor:pointer;justify-content:center;align-items:center;gap:10px;padding:10px 18px;font-size:1.05rem;font-weight:700;text-decoration:none;transition:transform 80ms steps(2,end);display:inline-flex}.btn:hover{color:var(--ink);box-shadow:4px 4px 0 var(--ink), inset -3px -4px 0 #00000024, inset 3px 3px 0 #fff9;transform:translate(-1px,-1px)}.btn:active{box-shadow:1px 1px 0 var(--ink);transform:translate(2px,2px)}.btn-play{background:var(--kaya)}.btn-big{min-height:56px;padding:14px 26px;font-size:1.2rem}.btn-cup{background:var(--paper);border:2px solid var(--ink);border-top:4px solid var(--caramel);flex-shrink:0;width:16px;height:14px;position:relative}.btn-cup:after{content:"";border:2px solid var(--ink);border-left:0;width:4px;height:5px;position:absolute;top:1px;right:-7px}.site-header{z-index:50;background:var(--kaya);border-bottom:3px solid var(--ink);box-shadow:0 3px 0 var(--caramel);position:sticky;top:0}.header-inner{align-items:center;gap:16px;min-height:64px;display:flex}.logo{color:var(--ink);align-items:center;gap:10px;text-decoration:none;display:inline-flex}.logo-club{letter-spacing:3px;color:var(--chilli-deep);margin-top:2px;font-size:.62rem;line-height:1;display:block}.hero-club{background:var(--chilli);color:var(--paper);border:2px solid var(--ink);box-shadow:var(--shadow-sm);letter-spacing:6px;margin:10px 0 0;padding:4px 16px;font-size:clamp(1rem,3.4vw,1.6rem);font-weight:700;display:inline-block}.story-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;margin-top:20px;display:grid}.story-card{padding:18px}.story-card h3{color:var(--caramel-deep)}.gallery{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px;margin:0;padding:0;list-style:none;display:grid}.gallery figure{background:var(--paper);border:2px solid var(--ink);box-shadow:var(--shadow);margin:0;padding:10px}.gallery figcaption{padding-top:8px;font-weight:700}.gallery figcaption span{color:var(--muted);font-weight:400;display:block}.logo-text{font-family:var(--font-display);letter-spacing:.5px;white-space:nowrap;font-size:1.05rem;font-weight:700}.logo-kopi{color:var(--ink)}.logo-kaki{color:var(--chilli-deep)}.nav-desktop ul,.nav-mobile ul,.site-footer ul{margin:0;padding:0;list-style:none}.nav-desktop{margin-left:auto}.nav-desktop ul{gap:4px;display:flex}.nav-desktop a{color:var(--ink);border:2px solid #0000;padding:8px 10px;font-weight:700;text-decoration:none;display:block}.nav-desktop a:hover{border-color:var(--ink);background:var(--paper)}.nav-mobile{margin-left:auto;display:none;position:relative}.nav-mobile summary{cursor:pointer;background:var(--paper);border:2px solid var(--ink);min-height:44px;box-shadow:var(--shadow-sm);align-items:center;gap:8px;padding:6px 12px;font-weight:700;list-style:none;display:inline-flex}.nav-mobile summary::-webkit-details-marker{display:none}.burger,.burger:before,.burger:after{background:var(--ink);width:16px;height:3px;display:block}.burger{position:relative}.burger:before,.burger:after{content:"";position:absolute;left:0}.burger:before{top:-6px}.burger:after{top:6px}.nav-mobile nav{background:var(--paper);border:2px solid var(--ink);min-width:220px;box-shadow:var(--shadow);position:absolute;top:calc(100% + 10px);right:0}.nav-mobile a{color:var(--ink);border-bottom:2px dashed var(--cream-2);padding:12px 16px;font-weight:700;text-decoration:none;display:block}.header-play .btn{min-height:40px;padding:6px 14px;font-size:1rem}@media (max-width:900px){.nav-desktop{display:none}.nav-mobile{display:block}.header-play{margin-left:auto}.nav-mobile{margin-left:8px}}.header-play .btn{white-space:nowrap}@media (max-width:520px){.header-inner{gap:8px}.logo{gap:6px}.logo-cup{width:28px;height:28px}.logo-text{font-size:.72rem}.header-play .btn{padding:6px 10px}.header-play .btn-cup,.menu-label{display:none}.nav-mobile{margin-left:0}.nav-mobile summary{padding:6px 12px}}section[id]{scroll-margin-top:76px}.site-footer{background:var(--ink);color:var(--cream);margin-top:0;padding:40px 0 28px}.site-footer .logo{color:var(--cream)}.site-footer .logo-kopi{color:var(--kaya)}.site-footer .logo-kaki{color:var(--cream)}.footer-inner{grid-template-columns:1.3fr 1fr;gap:24px;display:grid}.footer-tag{color:#e9dcc3;margin-top:12px}.site-footer ul{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 16px;display:grid}.site-footer a{color:var(--kaya)}.footer-small{color:#e9dcc3;border-top:2px dashed #5a4a3e;grid-column:1/-1;margin:0;padding-top:16px;font-size:.92rem}@media (max-width:700px){.footer-inner{grid-template-columns:1fr}}.hero{background:linear-gradient(var(--sky) 0%, var(--sky-light) 62%, var(--cream-2) 62%, var(--cream-2) 100%);border-bottom:3px solid var(--ink);padding:48px 0 0;position:relative;overflow:hidden}.hero:before,.hero:after{content:"";opacity:.95;background:#fff;width:96px;height:24px;position:absolute;box-shadow:24px -16px #fff,48px -16px #fff,72px 0 #fff,-24px 0 #fff}.hero:before{top:60px;left:6%}.hero:after{top:120px;right:10%;transform:scale(.8)}@media (max-width:760px){.hero:before{top:14px;left:-40px;transform:scale(.6)}.hero:after{top:auto;bottom:46%;right:-60px;transform:scale(.5)}}.hero-inner{z-index:1;text-align:center;gap:20px;display:grid;position:relative}.hero-logo{letter-spacing:2px;flex-wrap:wrap;justify-content:center;gap:0 .35em;margin:0;font-size:clamp(2.6rem,10vw,5rem);font-weight:700;line-height:1.1;display:flex}.hero-logo span{text-shadow:4px 4px 0 var(--ink), -2px -2px 0 var(--ink), 2px -2px 0 var(--ink), -2px 2px 0 var(--ink), 2px 2px 0 var(--ink)}.hero-logo .kopi{color:var(--kaya)}.hero-logo .kaki{color:var(--paper)}.hero-sub{max-width:44ch;margin:0 auto;font-size:clamp(1.05rem,2.6vw,1.3rem);font-weight:700}.hero-sub strong{background:var(--paper);border:2px solid var(--ink);white-space:nowrap;padding:0 6px}.hero-cta{flex-wrap:wrap;justify-content:center;align-items:center;gap:12px;display:flex}.hero-note{color:var(--ink-soft);margin:0;font-size:.95rem}.hero-art{justify-content:center;margin-top:8px;display:flex}.hero-art img{filter:drop-shadow(0 6px #2a1e192e);display:block}.section{border-bottom:3px solid var(--ink);padding:64px 0}.section-plain{background:var(--cream)}.section-sky{background:var(--sky-light)}.section-kaya{background:var(--cream-2)}.section-mint{background:var(--mint)}.kicker{background:var(--chilli);color:var(--paper);border:2px solid var(--ink);margin:0 0 12px;padding:2px 10px;font-size:.95rem;font-weight:700;display:inline-block}.section-title{max-width:30ch}.lead{max-width:62ch;font-size:1.15rem}.what-grid{grid-template-columns:1.1fr .9fr;align-items:start;gap:32px;display:grid}@media (max-width:860px){.what-grid{grid-template-columns:1fr}}.facts{margin:0;padding:8px 18px;display:grid}.fact{border-bottom:2px dashed var(--cream-2);grid-template-columns:7.5em 1fr;gap:12px;padding:10px 0;display:grid}.fact:last-child{border-bottom:0}.fact dt{color:var(--caramel-deep);font-weight:700}.fact dd{margin:0}.feature-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:22px;margin-top:28px;display:grid}.feature-card{flex-direction:column;padding:0;display:flex;overflow:hidden}.feature-card .art{background:linear-gradient(var(--sky-light), var(--cream));border-bottom:2px solid var(--ink);justify-content:center;align-items:center;height:220px;display:flex;overflow:hidden}.feature-card .art img{flex-shrink:0;max-width:none}.feature-card .body{padding:16px 18px 18px}.feature-card h3{margin-bottom:6px}.feature-card p{margin:0}.steps{counter-reset:step;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin:28px 0 0;padding:0;list-style:none;display:grid}.step{padding:26px 18px 18px;position:relative}.step:before{counter-increment:step;content:counter(step);background:var(--kaya);border:2px solid var(--ink);width:38px;height:38px;box-shadow:var(--shadow-sm);font-family:var(--font-display);place-items:center;font-size:.95rem;display:grid;position:absolute;top:-18px;left:16px}@media (max-width:760px){.steps{grid-template-columns:1fr;gap:30px}}.chips{flex-wrap:wrap;gap:10px;margin:20px 0 0;padding:0;list-style:none;display:flex}.chips li{background:var(--paper);border:2px solid var(--ink);box-shadow:var(--shadow-sm);padding:6px 12px;font-weight:700}.sg-art{background:linear-gradient(var(--sky-light), var(--cream));padding:18px 12px 10px;overflow-x:auto}.sg-art img{max-width:none;margin-inline:auto;display:block}.safety-grid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:18px;margin-top:24px;display:grid}.safety-card{padding:16px 18px}.safety-card h3{align-items:center;gap:10px;display:flex}.safety-card h3:before{content:"";background:var(--teal);border:2px solid var(--ink);flex-shrink:0;width:14px;height:14px}.faq{gap:12px;margin-top:20px;display:grid}.faq-item{padding:0}.faq-item summary{cursor:pointer;align-items:center;gap:12px;min-height:52px;padding:14px 18px;list-style:none;display:flex}.faq-item summary::-webkit-details-marker{display:none}.faq-item summary:after{content:"+";font-family:var(--font-display);color:var(--caramel-deep);margin-left:auto;font-size:.9rem}.faq-item[open] summary:after{content:"-"}.faq-q{font-family:var(--font);letter-spacing:0;margin:0;font-size:1.1rem;font-weight:700;line-height:1.35}.faq-item p{margin:0;padding:0 18px 16px}.cta-band{background:var(--kaya);border-bottom:3px solid var(--ink);padding:48px 0}.cta-inner{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:18px 32px;display:flex}.cta-band h2{margin-bottom:6px}.cta-band p{margin:0;font-weight:700}.page-header{background:linear-gradient(var(--sky), var(--sky-light));border-bottom:3px solid var(--ink);padding:36px 0 30px}.breadcrumbs ol{flex-wrap:wrap;gap:6px;margin:0 0 14px;padding:0;font-size:.95rem;list-style:none;display:flex}.breadcrumbs li+li:before{content:"›";color:var(--ink-soft);margin-right:6px}.breadcrumbs a{color:var(--ink)}.prose{max-width:72ch}.prose h2{margin-top:1.6em}.prose ul{padding-left:1.2em}.prose li{margin-bottom:.4em}.feature-detail{border-bottom:2px dashed var(--cream-2);grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:32px;padding:36px 0;display:grid}.feature-detail:nth-child(2n) .feature-detail-art{order:-1}.feature-detail-art{background:linear-gradient(var(--sky-light), var(--cream));justify-content:center;align-items:center;max-height:440px;padding:16px;display:flex;overflow:hidden}.feature-detail-art img{flex-shrink:0;max-width:none}@media (max-width:820px){.feature-detail{grid-template-columns:1fr}.feature-detail:nth-child(2n) .feature-detail-art{order:0}}.controls{border-collapse:collapse;width:100%;margin-top:18px}.controls th,.controls td{border:2px solid var(--ink);text-align:left;vertical-align:top;padding:12px 14px}.controls th{background:var(--cream-2);width:34%}.controls td{background:var(--paper)}.template-note{background:var(--cream-2);border:2px dashed var(--caramel);margin:0 0 24px;padding:12px 16px;font-weight:700}.not-found{text-align:center;padding:72px 0}.num{font-family:var(--font-num);font-variant-numeric:tabular-nums}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.stack-top{margin-top:20px}code{background:var(--paper);border:2px solid var(--ink);padding:1px 6px;font-size:.95em}