:root{color-scheme:dark;font-family:Inter,'Noto Sans TC',system-ui,sans-serif}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#101927;color:#f8f2e8}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #ffe08d;outline-offset:2px}.cg{min-height:100dvh;position:relative;isolation:isolate;padding:12px max(12px,env(safe-area-inset-right)) calc(12px + env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));display:flex;flex-direction:column;gap:10px}.cg-bg{position:fixed;inset:0;z-index:-1;background:linear-gradient(150deg,#0e2026dd,#182b35db),url('hero.png') center/cover}.cg-top{display:flex;align-items:center;justify-content:space-between;gap:8px}.cg-brand{font-weight:800;color:#ffd593;letter-spacing:.04em}.cg-top-actions{display:flex;gap:6px}.cg button{border:1px solid #ffffff55;border-radius:12px;background:#263947;color:#fff;padding:9px 12px}.cg button:hover{background:#36556a}.cg .cg-main{background:#ffc56d;color:#2f2133;border-color:#ffc56d;font-weight:800}.cg .cg-main:hover{background:#ffda91}.cg-panel{max-width:1080px;width:100%;margin:auto;background:#14242ee8;border:1px solid #ffffff40;border-radius:24px;box-shadow:0 20px 70px #0008}.cg-title{display:grid;grid-template-columns:1fr 1fr;gap:24px;overflow:hidden}.cg-title img{display:block;width:100%;height:100%;min-height:380px;object-fit:cover}.cg-title>div{padding:24px 28px 24px 0}.cg-title h1{font-size:clamp(2.5rem,5vw,5rem);line-height:1.08;margin:12px 0;color:#ffe2b2}.cg-title em{font-style:normal;color:#9ee5c7}.cg-title p,.cg-title li{line-height:1.65}.cg-title ul{padding-left:1.4em}.cg-title button{margin:8px 5px 0 0}.eyebrow{text-transform:uppercase;letter-spacing:.12em;color:#a4d9c5;font-size:.8rem;font-weight:800}.cg-play{width:min(1150px,100%);margin:auto}.cg-play[hidden],.cg-sheet[hidden],.cg-title[hidden]{display:none}.cg-hud{display:grid;grid-template-columns:1.1fr 1fr 1.4fr 1fr;gap:10px;align-items:center;background:#162835f2;border:1px solid #ffffff30;border-radius:16px;padding:10px 14px;font-size:.86rem}.cg-hud>div{display:flex;flex-direction:column;gap:3px}.cg-hud b{color:#ffda97}.cg-bars label{display:flex;align-items:center;gap:5px;white-space:nowrap}.cg-bars meter{flex:1;min-width:40px;height:12px}.cg-arena{position:relative;margin-top:8px;width:100%;border:2px solid #c9a663;border-radius:18px;overflow:hidden;background:#193641}.cg-arena canvas{display:block;width:100%;height:auto;aspect-ratio:16/9;touch-action:none}.cg-float{position:absolute;left:50%;top:12%;transform:translateX(-50%);font-weight:800;background:#102630e8;border-radius:99px;padding:9px 15px;opacity:0;transition:opacity .2s;pointer-events:none}.cg-float.on{opacity:1}.cg-bottom{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:8px 0}.cg-bottom div{display:flex;flex-direction:column;gap:3px}.cg-bottom small{opacity:.75}.cg-bottom button{min-width:130px;min-height:52px}.cg-sheet{position:fixed;inset:0;z-index:5;background:#09131add;display:grid;place-items:center;padding:14px;overflow:auto}.cg-sheet-body{width:min(580px,100%);max-height:90dvh;overflow:auto;border:1px solid #e6c58177;border-radius:22px;background:#1a2e39;padding:22px 25px;box-shadow:0 25px 70px #000b}.cg-sheet h2{font-size:clamp(1.5rem,4vw,2.3rem);margin:5px 0 12px;color:#ffe2aa}.cg-sheet p{line-height:1.6}.cg-choices{display:grid;gap:9px}.cg-choices button{text-align:left;padding:14px 15px;background:#274555;line-height:1.4}.cg-choices button:hover{background:#356274}.cg-choices button b{display:block;color:#ffe1a0}.cg-choices button small{display:block;opacity:.83;margin-top:3px}.cg footer{text-align:center;font-size:.72rem;opacity:.7;margin-top:auto;line-height:1.5}.cg footer a{color:#e8d08c}@media(max-width:760px){.cg-title{grid-template-columns:1fr}.cg-title img{height:190px;min-height:0}.cg-title>div{padding:0 18px 18px}.cg-title h1{font-size:2.3rem}.cg-title ul{margin:6px 0}.cg-hud{grid-template-columns:1fr 1fr;font-size:.75rem}.cg-top{align-items:flex-start}.cg-brand{font-size:.8rem;max-width:130px}.cg-top-actions button{padding:7px;font-size:.74rem}.cg-bottom b{font-size:.78rem}.cg-bottom small{font-size:.68rem}.cg-bottom button{min-width:100px}.cg-sheet-body{padding:18px}}@media(max-width:380px){.cg-hud{gap:4px;padding:7px}.cg-top-actions{gap:3px}.cg-top-actions button{font-size:.7rem;padding:6px}.cg-bottom button{min-width:90px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}