*{margin:0;padding:0;box-sizing:border-box}html,body{width:100%;height:100%;background:#1b2430;overflow:hidden;font-family:Trebuchet MS,Segoe UI,sans-serif}#game{width:100%;height:100%;display:flex;align-items:center;justify-content:center}#game canvas{display:block;image-rendering:auto}.gameplay-open #game canvas{outline:3px solid transparent;outline-offset:-3px}.gameplay-open #game canvas:focus-visible{outline-color:#f2cc6e}.gameplay-open:after{display:none}@media(orientation:portrait)and (max-width:700px){.gameplay-open:after{position:fixed;top:20%;left:50%;z-index:10;display:block;width:max-content;max-width:calc(100% - 40px);padding:10px 14px;content:"↻  PUTAR PONSEL KE POSISI MENDATAR";color:#f6f8f1;border:1px solid #f6f8f155;border-radius:999px;background:#254b40;box-shadow:0 4px #17382f;font:700 10px/1.2 DM Sans,Segoe UI,sans-serif;letter-spacing:1px;pointer-events:none;transform:translate(-50%)}}:root{--scroll-thumb: #a3b09b;--scroll-track: #f6f8f1;--scroll-hover: #7d9276;--scroll-active: #254b40;scrollbar-color:var(--scroll-thumb) var(--scroll-track);scrollbar-width:thin}*{scrollbar-width:thin;scrollbar-color:var(--scroll-thumb) var(--scroll-track)}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--scroll-track)}::-webkit-scrollbar-thumb{background:var(--scroll-thumb);border:2px solid var(--scroll-track);border-radius:8px}::-webkit-scrollbar-thumb:hover{background:var(--scroll-hover)}::-webkit-scrollbar-thumb:active{background:var(--scroll-active)}@media(forced-colors:active){*{scrollbar-color:auto}}@font-face{font-family:Barlow Condensed;src:url(/fonts/barlow-condensed-black-italic.ttf) format("truetype");font-style:italic;font-weight:900;font-display:block}@font-face{font-family:DM Sans;src:url(/fonts/dm-sans-regular.ttf) format("truetype");font-style:normal;font-weight:400 500;font-display:block}@font-face{font-family:DM Sans;src:url(/fonts/dm-sans-bold.ttf) format("truetype");font-style:normal;font-weight:600 900;font-display:block}.auth-shell{--auth-paper: #f6f8f1;--auth-white: #ffffff;--auth-ink: #254b40;--auth-ink-deep: #17382f;--auth-muted: #647269;--auth-primary: #d93827;--auth-primary-hover: #be2e20;--auth-line: #dce3d8;--auth-gold: #f2cc6e;--auth-display: "Barlow Condensed", "Arial Narrow", Impact, sans-serif;--auth-body: "DM Sans", "Segoe UI", sans-serif;position:fixed;inset:0;z-index:40;display:grid;place-items:center;overflow:auto;padding:24px 16px;color:var(--auth-ink);background:var(--auth-paper);font-family:var(--auth-body);font-size:14px;line-height:1.55;-webkit-font-smoothing:antialiased}.auth-shell:before{position:fixed;top:0;left:0;right:0;height:6px;content:"";background:repeating-linear-gradient(90deg,var(--auth-primary) 0 32px,var(--auth-white) 32px 64px);pointer-events:none}.auth-card{position:relative;width:min(420px,100%);padding:32px 28px 28px;border:2px solid var(--auth-ink);border-radius:16px;background:var(--auth-white);box-shadow:0 10px 0 var(--auth-ink-deep);text-align:center}.auth-brand{display:inline-flex;gap:9px;align-items:center;margin-bottom:18px;color:var(--auth-ink);font-family:var(--auth-display);font-size:22px;font-style:italic;letter-spacing:.5px;text-transform:uppercase}.auth-brand svg{width:30px;height:30px}.auth-eyebrow{margin-bottom:6px;color:var(--auth-primary);font-size:10px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase}.auth-card h1{margin-bottom:10px;white-space:pre-line;font-family:var(--auth-display);font-size:34px;font-style:italic;line-height:1.02;letter-spacing:.4px;text-transform:uppercase}.auth-message{margin-bottom:22px;color:var(--auth-muted);font-size:13px}.auth-button{display:inline-flex;gap:10px;align-items:center;justify-content:center;width:100%;min-height:48px;padding:12px 20px;color:var(--auth-white);border:0;border-radius:999px;background:var(--auth-primary);box-shadow:0 4px #8f2216;font-family:var(--auth-body);font-size:14px;font-weight:700;cursor:pointer;transition:background .16s ease,transform .16s ease,box-shadow .16s ease}.auth-button:hover:not(:disabled){background:var(--auth-primary-hover)}.auth-button:active:not(:disabled){box-shadow:0 1px #8f2216;transform:translateY(3px)}.auth-button:disabled{opacity:.55;cursor:progress}.auth-button:focus-visible{outline:3px solid var(--auth-gold);outline-offset:3px}.auth-button--ghost{color:var(--auth-ink);background:transparent;border:2px solid var(--auth-line);box-shadow:none}.auth-button--ghost:hover:not(:disabled){background:var(--auth-paper)}.auth-button--ghost:active:not(:disabled){box-shadow:none;transform:translateY(1px)}.auth-actions{display:grid;gap:10px}.auth-note{margin-top:18px;padding-top:16px;border-top:1px dashed var(--auth-line);color:var(--auth-muted);font-size:11px;line-height:1.6}.auth-alert{margin-bottom:20px;padding:12px 14px;color:#7a1d12;border:1px solid #f3c9c2;border-radius:10px;background:#fff1eb;font-size:12px;text-align:left}.auth-alert code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px}.auth-spinner{display:inline-block;width:17px;height:17px;border:2.5px solid #ffffff66;border-top-color:var(--auth-white);border-radius:50%;animation:auth-spin .72s linear infinite}.auth-card--status .auth-spinner{width:30px;height:30px;margin-bottom:18px;border-color:var(--auth-line);border-top-color:var(--auth-primary)}@keyframes auth-spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.auth-spinner{animation-duration:2.4s}.auth-button{transition:none}.auth-button:active:not(:disabled){transform:none}}@media(max-width:420px){.auth-card{padding:26px 20px 22px}.auth-card h1{font-size:28px}}