*{box-sizing:border-box}html,body{margin:0}body{color:#0f172a;-webkit-tap-highlight-color:transparent;background:#f8fafc;font-family:system-ui,-apple-system,Segoe UI,Noto Sans Thai,sans-serif}button{font:inherit;cursor:pointer}:focus-visible{outline-offset:2px;outline:3px solid #2563eb}#home{max-width:640px;margin:0 auto;padding:32px 20px 56px}h1{margin:0;font-size:2rem;line-height:1.2}h2{margin:40px 0 4px;font-size:1.25rem}header p{color:#475569;margin:8px 0 0;font-size:1.1rem}.tip{color:#475569;margin:8px 0 0;font-size:.95rem}.notice{color:#78350f;background:#fffbeb;border:1px solid #fcd34d;border-radius:12px;margin:20px 0 0;padding:14px 16px}#decks{border:0;flex-wrap:wrap;gap:10px;margin:24px 0 0;padding:0;display:flex}#decks legend{margin-bottom:8px;padding:0;font-weight:600}#decks label{cursor:pointer}#decks input{opacity:0;position:absolute}#decks span{background:#fff;border:2px solid #cbd5e1;border-radius:999px;padding:10px 18px;font-weight:600;display:inline-block}#decks input:checked+span{color:#fff;background:#0f172a;border-color:#0f172a}#decks input:focus-visible+span{outline-offset:2px;outline:3px solid #2563eb}.primary{color:#fff;background:#2563eb;border:0;border-radius:16px;width:100%;margin-top:20px;padding:18px 20px;font-size:1.2rem;font-weight:700;display:block}.primary:disabled{opacity:.6;cursor:wait}#grid{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:14px;margin:16px 0 0;padding:0;list-style:none;display:grid}#grid button{text-align:left;background:#fff;border:1px solid #e2e8f0;border-radius:14px;width:100%;padding:0;overflow:hidden}#grid img{aspect-ratio:9/16;object-fit:cover;background:#e2e8f0;width:100%;display:block}#grid span{padding:8px 10px 10px;font-size:.95rem;font-weight:600;display:block}#grid small{color:#64748b;font-weight:400;display:block}#ar{z-index:10;background:#000;position:fixed;inset:0}#stage{position:absolute;inset:0;overflow:hidden}#hud{pointer-events:none;position:absolute;inset:0}#hud>*{pointer-events:auto}#status{top:max(16px, env(safe-area-inset-top));color:#fff;pointer-events:none;background:#0f172ac7;border-radius:999px;width:fit-content;max-width:calc(100% - 88px);margin:0;padding:10px 16px;font-weight:600;position:absolute;left:16px;right:72px}#close{top:max(16px, env(safe-area-inset-top));color:#fff;background:#0f172ac7;border:0;border-radius:50%;width:44px;height:44px;font-size:1.2rem;position:absolute;right:16px}#sound{left:50%;bottom:max(28px, env(safe-area-inset-bottom));color:#0f172a;background:#fff;border:0;border-radius:999px;padding:14px 24px;font-size:1.05rem;font-weight:700;position:absolute;transform:translate(-50%);box-shadow:0 6px 24px #0006}dialog{background:#000;border:0;border-radius:16px;width:min(92vw,420px);padding:0;overflow:hidden}dialog::backdrop{background:#0f172acc}dialog video{width:100%;max-height:86vh;display:block}#player-close{color:#fff;background:#0f172ac7;border:0;border-radius:50%;width:40px;height:40px;font-size:1.1rem;position:absolute;top:10px;right:10px}@media (prefers-reduced-motion:no-preference){.primary{transition:transform .1s}.primary:active{transform:scale(.98)}}