:root{color-scheme:light;--ink: #2a1d2c;--paper: #fff8ec;--ivory: #fff3dc;--cream: #fcecdc;--cream-dark: #ead2b6;--line: #e4d8c2;--chip: #f4ead6;--gold: #ffd04a;--gold-ring: #c99a52;--gold-text: #5b4a17;--rose: #8a3f4f;--rose-hover: #73323f;--rose-shadow: #5e2a36;--rose-deep: #7a3442;--red: #8a2433;--night: #1a1228;--muted: #4a3f4c;--sage-deep: #355a3b;--font-title: "Jersey 25", "Jersey 10", "Trebuchet MS", system-ui, sans-serif;--font-pixel: "Jersey 10", "Trebuchet MS", system-ui, sans-serif;--font-body: "Nunito", "Segoe UI", system-ui, sans-serif;font-synthesis:none}.section-header-primary{font-family:var(--font-title)}.section-header-secondary,.section-header-body{font-family:var(--font-pixel)}*{box-sizing:border-box}[hidden]{display:none!important}html,body{height:100%}body{margin:0;background:var(--night);color:var(--ink);font-family:var(--font-body);font-size:16px;display:grid;place-items:center;padding-inline:16px;overflow:hidden;-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}:focus-visible{outline:3px solid var(--gold);outline-offset:2px}canvas{image-rendering:pixelated;image-rendering:crisp-edges;display:block}.sr-only{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}.frame{position:relative;height:min(calc(100% - 32px),1000px);aspect-ratio:9 / 16;max-width:100%;padding:10px;background:#120c1c;border-radius:10px;box-shadow:0 0 0 3px var(--gold-ring),0 30px 60px -20px #000000b3}.screen{position:relative;width:100%;height:100%;overflow:hidden;border-radius:4px;background:var(--night)}.screen>canvas,.layer>canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover}#game{touch-action:none}.px-btn{border:0;background:var(--paper);color:var(--ink);font-family:var(--font-pixel);font-weight:400;font-size:19px;letter-spacing:.02em;min-height:44px;padding:8px 16px;border-radius:4px;box-shadow:0 0 0 2px var(--ink),0 4px 0 2px var(--ink)}.px-btn:active{transform:translateY(3px);box-shadow:0 0 0 2px var(--ink),0 1px 0 2px var(--ink)}.px-btn.rose{background:var(--rose);color:#fff}.px-btn.rose:hover{background:var(--rose-hover)}.px-btn.big{font-size:24px;min-height:54px;padding:10px 22px}.pp{background:var(--cream);color:var(--ink);border-radius:4px;box-shadow:0 0 0 2px var(--ink),inset 0 -3px 0 var(--cream-dark),0 4px 0 2px var(--ink)}.hud-r{position:absolute;top:8px;right:8px;display:flex;gap:8px;z-index:3}.hud-r.over{z-index:6}.icon-btn{width:44px;height:44px;padding:0;display:grid;place-items:center;font-size:18px}.icon-btn[aria-pressed=false]{opacity:.7}.icon-sprite{position:absolute;width:0;height:0;overflow:hidden}.ico{width:1em;height:1em;fill:currentColor;shape-rendering:crispEdges;flex:none}.i-arrow{width:15px;height:27px}.i-heart{width:28px;height:24px}.i-menu{width:27px;height:24px}.i-note{width:21px;height:27px}.i-close{width:21px;height:21px}#b-sound{position:relative}#b-sound[aria-pressed=false]:after{content:"";position:absolute;left:50%;top:50%;width:32px;height:3px;background:var(--rose-deep);translate:-50% -50%;rotate:-45deg}.ico-t{height:.8em;vertical-align:-.05em;margin-inline:.08em}.ico-t.t-arrow{width:.45em}.ico-t.t-heart{width:.95em;color:#c8344a}.controls{position:absolute;left:0;right:0;bottom:10px;display:flex;justify-content:space-between;align-items:flex-end;padding-inline:10px;z-index:3;pointer-events:none}.pad{display:flex;gap:10px;pointer-events:auto}.pad button{width:56px;height:56px;font-size:22px;touch-action:none}.act{pointer-events:auto;width:76px;height:76px;border-radius:50%;display:grid;place-content:center;justify-items:center;gap:4px;font-size:26px;line-height:1}.act small{font:400 15px/1 var(--font-pixel);letter-spacing:.04em}.act.ready{animation:glow 1.2s ease-in-out infinite}@keyframes glow{50%{box-shadow:0 0 0 2px var(--ink),0 4px 0 2px var(--ink),0 0 22px 8px #ffdc78e6}}.hint{position:absolute;left:50%;bottom:96px;transform:translate(-50%);z-index:3;width:max-content;max-width:calc(100% - 24px);margin:0;text-align:center;font-family:var(--font-pixel);font-size:18px;background:var(--paper);padding:5px 12px;border-radius:4px;box-shadow:0 0 0 2px var(--ink)}.hud{position:absolute;top:8px;left:8px;z-index:3;display:grid;gap:3px;justify-items:start;max-width:calc(100% - 128px);margin:0;padding:7px 12px 8px;border:0;text-align:left}.hud-step{font:400 16px/1.05 var(--font-pixel);letter-spacing:.05em;color:var(--gold-text)}.hud-label{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:400 24px/1.05 var(--font-pixel);letter-spacing:.03em}.hud-pips{display:flex;flex-wrap:wrap;gap:3px;margin-top:2px}.hud-pips img{width:17px;height:15px;image-rendering:pixelated}.hud-pips img.next{animation:pip .9s steps(2) infinite}@keyframes pip{50%{transform:translateY(-2px) scale(1.15)}}.banner{position:absolute;top:60px;left:50%;z-index:3;translate:-50% 0;display:grid;gap:4px;justify-items:center;width:max-content;max-width:calc(100% - 32px);margin:0;padding:10px 18px 12px;text-align:center;animation:drop .35s cubic-bezier(.34,1.56,.64,1) both}.banner b{font:400 24px/1.05 var(--font-pixel);letter-spacing:.04em}.banner span{font:400 17px/1.15 var(--font-pixel);color:var(--gold-text)}@keyframes drop{0%{transform:translateY(-40px);opacity:0}}.sky-sign{position:absolute;left:0;right:0;z-index:2;display:grid;justify-items:center;width:max-content;max-width:calc(100% - 32px);margin:0 auto;padding:0;border:0;background:none;animation:drift 14s ease-in-out infinite alternate}.sky-sign .balloon{width:68px;height:auto;image-rendering:pixelated;animation:bob 3s ease-in-out infinite}.sky-sign .sign{position:relative;display:grid;gap:3px;justify-items:center;margin-top:12px;padding:6px 14px 8px;animation:bob 3s ease-in-out infinite}.sky-sign .sign:before{content:"";position:absolute;left:30%;right:30%;top:-14px;height:12px;border-inline:2px solid var(--ink)}.sky-sign.compact .balloon,.sky-sign.compact .sign:before{display:none}.sky-sign.compact .sign{margin-top:0}.sign-top{font:400 16px/1.05 var(--font-pixel);letter-spacing:.06em;color:var(--gold-text)}.sign-time{display:flex;gap:10px;align-items:baseline;font-variant-numeric:tabular-nums}.sign-time b{font:400 28px/1 var(--font-pixel);letter-spacing:.03em}@keyframes drift{0%{translate:-18px 0}to{translate:18px 0}}@keyframes bob{50%{transform:translateY(-4px)}}.hud.back .hud-step{color:var(--rose-deep)}.hud.back{animation:backglow 1s ease-in-out infinite}@keyframes backglow{50%{box-shadow:0 0 0 2px var(--ink),inset 0 -3px 0 var(--cream-dark),0 4px 0 2px var(--ink),0 0 0 6px #c8344a99}}.layer{position:absolute;top:0;right:0;bottom:0;left:0;z-index:5}.layer .bar-bottom{position:absolute;left:0;right:0;bottom:14px;display:flex;justify-content:center;gap:10px;flex-wrap:wrap;padding-inline:12px}#opening{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;transition:opacity .35s steps(4)}#opening.out{opacity:0}#opening>*{pointer-events:auto;position:absolute;left:50%}.nameplate{transform:translate(-50%,-100%);display:grid;justify-items:center;gap:2px;min-width:180px;max-width:calc(100% - 32px);margin:0;padding:8px 18px 10px;background:var(--ivory);border-radius:4px;box-shadow:0 0 0 3px var(--ink),0 0 0 6px var(--gold-ring),0 9px 0 3px #00000059;text-align:center}.nameplate span{font-size:16px;letter-spacing:.2em;color:var(--gold-text)}.nameplate b{font-family:var(--font-pixel);font-size:30px;font-weight:400;color:var(--ink);line-height:1.05;letter-spacing:.02em;overflow-wrap:anywhere}.seal{width:76px;height:76px;transform:translate(-50%,-50%);border-radius:50%;border:0;background:transparent}.tap-hint{transform:translate(-50%);margin:0;width:max-content;max-width:calc(100% - 32px);padding:5px 12px;border-radius:4px;background:#140d22d6;color:var(--ivory);font-family:var(--font-pixel);font-size:19px;letter-spacing:.02em;text-align:center}.brief-top{position:absolute;top:8px;left:8px;z-index:2}.skip{position:absolute;top:8px;right:60px;z-index:2}.title-html{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.title-html>*{position:absolute;left:50%;margin:0;translate:-50% 0;white-space:nowrap;opacity:0}.title-html>.in{opacity:1}.title-html>.gone{opacity:0;transition:opacity .3s}.ribbon{height:32px;display:grid;place-items:center;padding:0 22px;background:var(--red);color:var(--ivory);font:400 19px/1 var(--font-pixel);letter-spacing:.1em;box-shadow:0 0 0 2px var(--ink),inset 0 2px #b04558}.ribbon:before,.ribbon:after{content:"";position:absolute;top:7px;width:16px;height:29px;background:#5e1424}.ribbon:before{left:-18px;clip-path:polygon(0 0,100% 0,100% 100%,0 100%,45% 50%)}.ribbon:after{right:-18px;clip-path:polygon(0 0,100% 0,55% 50%,100% 100%,0 100%)}.ribbon.in{animation:unfurl .3s steps(6) both}@keyframes unfurl{0%{transform:scaleX(.08)}}.plaque{height:38px;display:grid;place-items:center;padding:0 16px;font:400 23px/1 var(--font-pixel);letter-spacing:.04em}.chip-days{height:30px;display:grid;place-items:center;padding:0 12px;background:var(--red);color:var(--ivory);font:400 20px/1 var(--font-pixel);letter-spacing:.06em;border-radius:3px;box-shadow:0 0 0 2px var(--ink)}.bubble{translate:-50% -100%;padding:7px 14px;background:#fff;color:var(--ink);font:400 19px/1.1 var(--font-pixel);letter-spacing:.02em;border-radius:6px;box-shadow:0 0 0 2px var(--ink)}.bubble:after{content:"";position:absolute;left:50%;bottom:-9px;translate:-50% 0;border:8px solid transparent;border-top-color:var(--ink);border-bottom:0}.plaque.in,.chip-days.in,.bubble.in{animation:popin .32s cubic-bezier(.34,1.56,.64,1) both}@keyframes popin{0%{transform:translateY(10px) scale(.6);opacity:0}}.select{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.select>*{pointer-events:auto}.who{position:absolute;width:72px;height:104px;transform:translate(-50%,-100%);border:0;border-radius:6px;background:transparent}.who span{position:absolute;left:50%;bottom:-29px;transform:translate(-50%);padding:2px 9px;border-radius:3px;background:var(--ivory);box-shadow:0 0 0 2px var(--ink);font:400 18px/1 var(--font-pixel);letter-spacing:.06em;color:var(--ink);white-space:nowrap}.who[aria-pressed=true] span{background:var(--gold)}.sel-bar{position:absolute;left:0;right:0;bottom:0;display:grid;justify-items:center;gap:10px;padding:34px 16px 14px;background:linear-gradient(180deg,#140d2200,#140d22e6 38%);animation:rise .35s steps(5) both}@keyframes rise{0%{transform:translateY(30px);opacity:0}}.player-chip{margin:0;display:flex;gap:8px;align-items:baseline;max-width:100%;padding:4px 12px;border-radius:3px;background:var(--ink);box-shadow:0 0 0 2px var(--gold-ring);color:var(--gold)}.player-chip span{font:400 16px/1.1 var(--font-pixel);letter-spacing:.08em;flex:none}.player-chip b{font-family:var(--font-pixel);font-weight:400;font-size:22px;letter-spacing:.02em;color:var(--ivory);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#b-start{width:min(100%,340px)}.card-note{position:absolute;left:0;right:0;margin:0 auto;width:max-content;max-width:calc(100% - 48px);padding:6px 16px 8px;font:400 20px/1.1 var(--font-pixel);letter-spacing:.06em;text-align:center;opacity:0}.card-note.in{opacity:1;animation:popin .3s cubic-bezier(.34,1.56,.64,1) both}.card-close{position:absolute;top:8px;right:8px;z-index:2;font-size:26px;line-height:1}.open-btn{position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:10px;min-height:60px;padding:10px 28px;border:0;border-radius:6px;background:var(--rose);color:#fff;font:400 27px/1 var(--font-pixel);letter-spacing:.06em;box-shadow:0 0 0 3px var(--ink),0 0 0 6px var(--gold),0 9px 0 5px var(--ink);opacity:0}.open-btn .i-heart{color:var(--gold)}.open-btn:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.5) 48%,transparent 60%);translate:-110% 0;animation:sheen 2.2s ease-in-out infinite}.open-btn.in{opacity:1;animation:popin .3s cubic-bezier(.34,1.56,.64,1) both,beckon 1.3s ease-in-out .4s infinite}.open-btn:hover{background:var(--rose-hover)}.open-btn:active,.open-btn:disabled{animation:none}.open-btn:active{transform:translateY(4px)}@keyframes beckon{50%{transform:scale(1.06)}}@keyframes sheen{55%,to{translate:110% 0}}.end-sub{position:absolute;left:0;right:0;margin:0 auto;width:max-content;max-width:calc(100% - 48px);padding:5px 14px 7px;background:#140d22d1;color:var(--ivory);font:400 21px/1.15 var(--font-pixel);letter-spacing:.04em;text-align:center;border-radius:4px}.dialog-layer{background:#1e14248c;display:flex;flex-direction:column;align-items:center;padding:14px;overflow-y:auto;z-index:8}.dialog-layer>*{margin-block:auto}.dialog-layer:not([hidden])>.dialog{animation:dlg .25s cubic-bezier(.34,1.56,.64,1) both}@keyframes dlg{0%{transform:scale(.88);opacity:0}}.dialog{width:min(100%,520px);max-height:100%;min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr);background:var(--paper);border-radius:6px;box-shadow:0 0 0 3px var(--ink),0 0 0 6px var(--gold-ring),0 20px 40px #00000080}.dialog-head{display:grid;grid-template-columns:1fr auto;align-items:center;gap:10px;padding:14px 14px 6px 18px}.dialog-tab h2{margin:0;font-family:var(--font-pixel);font-size:28px;font-weight:400;line-height:1.05;letter-spacing:.02em;text-wrap:balance}.dialog-close{width:44px;height:44px;display:grid;place-items:center;padding:0;border:0;border-radius:4px;background:var(--chip);box-shadow:0 0 0 2px var(--ink);font-size:18px}.dialog-book{min-height:0;display:grid}.dialog-body{overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;padding:8px 18px 18px;display:grid;gap:14px;align-content:start;line-height:1.55}.dialog-body p{margin:0}.senior .dialog-body{font-size:18px}.muted{color:var(--muted);font-size:.92em}.label{font:400 17px/1.2 var(--font-pixel);letter-spacing:.07em;color:var(--gold-text)}.panel{background:#fff;border-radius:4px;padding:12px;display:grid;gap:6px;box-shadow:0 0 0 2px var(--line)}.panel b{font-family:var(--font-pixel);font-weight:400;font-size:1.3em;letter-spacing:.02em}.people{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px}.person{justify-items:center;text-align:center}.person img{width:76px;height:132px;object-fit:contain;image-rendering:pixelated}.person h3{margin:0;font-family:var(--font-title);font-size:28px;font-weight:400;line-height:1.05;color:var(--rose-deep)}.countdown{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;text-align:center}.countdown div{background:var(--chip);border-radius:4px;padding:6px 2px;box-shadow:0 0 0 2px var(--line)}.countdown b{display:block;font-family:var(--font-pixel);font-weight:400;font-size:32px;line-height:1;font-variant-numeric:tabular-nums}.countdown span{font:400 15px/1.2 var(--font-pixel);letter-spacing:.06em;color:var(--muted)}.row-actions{display:flex;flex-wrap:wrap;gap:10px}.wg-btn{border:0;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:8px 14px;border-radius:4px;background:var(--rose);color:#fff;font-family:var(--font-pixel);font-size:19px;letter-spacing:.05em;box-shadow:0 4px 0 var(--rose-shadow)}.wg-btn:hover{background:var(--rose-hover)}.wg-btn.alt{background:var(--chip);color:var(--ink);box-shadow:0 0 0 2px var(--ink)}.timeline{display:grid;gap:8px}.timeline .panel{grid-template-columns:auto 1fr;column-gap:12px}.timeline .year{font-family:var(--font-pixel);font-size:26px;line-height:1;color:var(--rose-deep)}.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.gallery img{width:100%;aspect-ratio:4 / 5;object-fit:cover;border-radius:4px}.quote{font-family:var(--font-pixel);font-size:1.5em;line-height:1.2;letter-spacing:.02em;text-wrap:balance}form{display:grid;gap:10px}.field{display:grid;gap:5px}.field label,.field legend{font:400 17px/1.2 var(--font-pixel);letter-spacing:.06em;color:var(--muted)}.field input[type=text],.field textarea{font:inherit;font-size:16px;padding:9px 11px;border:0;border-radius:4px;background:#fff;color:var(--ink);box-shadow:0 0 0 2px var(--line);width:100%}.field input:focus,.field textarea:focus{outline:none;box-shadow:0 0 0 3px var(--gold-ring)}.field textarea{min-height:84px;resize:vertical}fieldset{border:0;padding:0;margin:0}.choices{display:flex;gap:8px;flex-wrap:wrap}.choice{display:flex;align-items:center;gap:6px;min-height:44px;background:#fff;border-radius:4px;box-shadow:0 0 0 2px var(--line);padding:6px 12px;cursor:pointer}.error{color:var(--rose-deep);font-weight:800;min-height:1em}.wishes{display:grid;gap:8px}.wish small{font:400 15px/1.2 var(--font-pixel);letter-spacing:.06em;color:var(--sage-deep)}.acct{grid-template-columns:1fr auto;align-items:center}.acct code{font-family:var(--font-pixel);font-size:26px;letter-spacing:.06em}.menu{display:grid;gap:8px;margin:0;padding:0;list-style:none}.menu-row,.badge-row{width:100%;border:0;padding:6px 12px 6px 6px;display:grid;grid-template-columns:48px 1fr;gap:10px;align-items:center;text-align:left;border-radius:4px;background:#fff;box-shadow:0 0 0 2px var(--line)}.menu-row:hover{box-shadow:0 0 0 2px var(--gold-ring)}.menu-icon{width:48px;height:48px;border-radius:4px;background:var(--chip);display:grid;place-items:center;overflow:hidden}.menu-icon img{width:40px;height:40px;object-fit:contain;image-rendering:pixelated}.menu-label{display:grid;gap:1px;font-family:var(--font-pixel);font-size:22px;line-height:1.05;letter-spacing:.02em}.menu-label small{font-family:var(--font-body);font-size:14px;font-weight:600;letter-spacing:0;color:var(--muted)}.menu-row.done .menu-label:after{content:"Sudah dibuka";font-family:var(--font-body);font-size:12px;font-weight:800;color:var(--sage-deep)}.talk{position:absolute;left:10px;right:10px;bottom:10px;z-index:6;background:var(--paper);border-radius:6px;padding:22px 16px 12px;display:grid;gap:10px;box-shadow:0 0 0 3px var(--ink),0 0 0 6px var(--gold-ring)}.talk-name{position:absolute;top:-15px;left:14px;padding:3px 12px;border-radius:4px;background:var(--rose);color:#fff;font:400 19px/1 var(--font-pixel);letter-spacing:.04em;box-shadow:0 0 0 2px var(--ink)}.talk-text{margin:0;font-family:var(--font-pixel);font-size:23px;line-height:1.2;letter-spacing:.02em;min-height:2.4em}.talk-actions{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}.badge-pop{position:absolute;top:64px;left:50%;transform:translate(-50%);z-index:9;display:grid;grid-template-columns:auto 1fr;gap:8px;align-items:center;padding:6px 14px 6px 8px;border-radius:4px;background:var(--paper);box-shadow:0 0 0 2px var(--ink),0 0 0 5px var(--gold-ring);width:max-content;max-width:calc(100% - 24px)}.badge-pop img{width:30px;height:26px;image-rendering:pixelated}.badge-pop small{display:block;font:400 15px/1.1 var(--font-pixel);letter-spacing:.06em;color:var(--gold-text)}.badge-pop b{font-family:var(--font-pixel);font-weight:400;font-size:21px}.wg-toast{position:absolute;left:50%;top:100px;transform:translate(-50%);max-width:calc(100% - 32px);z-index:10;margin:0;background:#1e1424f2;color:#fff8ec;font-weight:700;text-align:center;padding:7px 12px;border-radius:4px}.reward{background:#1e142480;display:flex;align-items:center;justify-content:center;padding:14px;z-index:9}.reward-card{width:min(100%,400px);text-align:center;background:var(--paper);border-radius:6px;padding:20px;display:grid;gap:10px;justify-items:center;box-shadow:0 0 0 3px var(--ink),0 0 0 6px var(--gold-ring)}.reward-card img{width:46px;height:40px;image-rendering:pixelated}.reward-card h2{margin:0;font-family:var(--font-title);font-size:34px;font-weight:400;line-height:1.05;color:var(--rose-deep)}.reward-card p{margin:0;font-weight:700}.stats{display:flex;gap:6px;justify-content:center;flex-wrap:wrap}.stats span{font:400 17px/1.1 var(--font-pixel);letter-spacing:.04em;background:var(--chip);padding:4px 10px;border-radius:4px;box-shadow:0 0 0 2px var(--line)}.loading{position:absolute;top:0;right:0;bottom:0;left:0;z-index:11;display:grid;place-items:center;padding:24px;text-align:center;text-wrap:balance;background:var(--night);color:var(--ivory);font-family:var(--font-pixel);font-size:26px;letter-spacing:.03em}@media(max-width:760px)and (orientation:portrait){body{padding-inline:0}.frame{height:100%;width:100%;aspect-ratio:auto;padding:0;border-radius:0;box-shadow:none}.screen{border-radius:0}}@media(prefers-reduced-motion:reduce){.act.ready,.sel-bar,.hud-pips img.next,.hud.back,.banner,.sky-sign,.sky-sign .balloon,.sky-sign .sign,.title-html>*,.card-note.in,.open-btn.in,.open-btn:after,.dialog-layer:not([hidden])>.dialog{animation:none}#opening,.title-html>.gone{transition:none}}