@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500;600&family=DM+Sans:wght@400;500;600;700&display=swap');
#overlay{z-index:3}#touch{z-index:2}#toast{z-index:4}#hud{z-index:1}
:root{color-scheme:dark;--gold:#edc782;--cream:#f4ecda;--dim:#a7b7ac}*{box-sizing:border-box}body{margin:0;background:#101e1d;color:var(--cream);font-family:'DM Sans',sans-serif;background-image:radial-gradient(ellipse at 50% 5%,#28413a 0,transparent 60%)}header{height:88px;border-bottom:1px solid #ffffff12;display:flex;align-items:center;justify-content:space-between;padding:0 6%}.brand{color:var(--gold);text-decoration:none;display:flex;gap:12px;align-items:center;font-size:26px}.brand span{font-size:12px;letter-spacing:3px}.brand small{display:block;font-size:8px;letter-spacing:4px;margin-top:5px}.edition,.eyebrow{font-size:10px;letter-spacing:3px;color:var(--gold)}button{font:inherit;cursor:pointer;border:1px solid #ffffff24;background:#ffffff05;color:var(--cream);border-radius:6px;padding:10px 17px}button:hover{background:#ffffff14}button:focus-visible{outline:3px solid var(--gold);outline-offset:3px}main{max-width:1300px;margin:auto;padding:36px 36px 20px;text-align:center}h1{font-family:'Cormorant Garamond',Georgia,serif;font-size:clamp(40px,6vw,70px);font-weight:500;margin:8px 0 0;letter-spacing:-2px}h1 em{color:var(--gold);font-size:.7em}.subtitle{color:var(--dim);font-family:Georgia,serif;font-style:italic;margin:5px 0 26px}.game-shell{border:1px solid #8d9c704a;border-radius:12px;overflow:hidden;box-shadow:0 22px 80px #0005;text-align:left}.game-top,.game-bottom{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:12px 22px;background:#182b27}.game-top>span:first-child{color:var(--gold);font-size:10px;letter-spacing:2px}.game-top>span:nth-child(2){font-size:12px;color:#c4d0c1}.game-top button{padding:5px 12px;font-size:11px}.stage{position:relative;background:#203b34}canvas{display:block;width:100%;aspect-ratio:1100/660;touch-action:none}#hud{position:absolute;top:18px;left:22px;right:22px;display:flex;gap:28px;pointer-events:none;text-shadow:0 2px 4px #000}#hud small{display:block;font-size:8px;letter-spacing:2px;color:#d3decb;margin-bottom:5px}#hud b{font-size:15px;font-weight:500}.meter{width:110px;height:6px;background:#0005;border-radius:6px;overflow:hidden;margin-top:10px}.meter i{display:block;width:100%;height:100%;background:#edc782;transition:width .2s}#toast{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);text-align:center;background:#102721ed;border:1px solid #d9bd7044;border-radius:30px;font-size:12px;padding:10px 20px;opacity:0;transition:opacity .2s;pointer-events:none;max-width:90%;width:max-content}#overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#0c1d2166;backdrop-filter:blur(3px)}#overlay.hidden{display:none}.story-card{max-width:490px;text-align:center;padding:30px;background:linear-gradient(140deg,#19352ff5,#132823f5);border:1px solid #c5ae684d;border-radius:12px;box-shadow:0 15px 60px #0006;margin:15px}h2{font-family:Georgia,serif;font-size:36px;font-weight:400;margin:14px 0}.story-card p{font-size:14px;line-height:1.8;color:#c8d2c3}.primary{background:var(--gold);color:#192a23;border:0;font-weight:700;padding:14px 28px;margin-top:12px}.primary:hover{background:#f5dba9}.secondary{display:block;border:0;margin:10px auto 0;font-size:12px;color:var(--dim)}#card-extra{color:var(--gold);font-size:12px;line-height:1.8;max-height:150px;overflow:auto}.game-bottom{font-size:10px;color:#9fae9f;padding:14px 22px}kbd{font-family:inherit;font-size:9px;padding:3px 5px;border:1px solid #ffffff25;border-radius:3px;color:#d9dfcd}.below{display:flex;align-items:center;justify-content:space-between;text-align:left;padding:16px 0}.below p{font-size:11px;line-height:1.9;color:var(--dim)}.below strong{color:#e2e4d3;font-size:13px;font-weight:500}.below button{font-size:11px;border:0;color:var(--gold)}footer{font-size:10px;color:#7c9488;margin:12px 0;line-height:2}footer small{font-size:9px}#touch{position:absolute;bottom:15px;left:15px;right:15px;display:none;justify-content:space-between;pointer-events:none}#touch button{pointer-events:auto;touch-action:none;background:#17332bcc;user-select:none;padding:13px} .dpad{display:grid;grid-template-columns:repeat(3,40px);gap:3px}.dpad button:first-child{grid-column:2}.dpad button:nth-child(2){grid-column:1}#touch>div:last-child{display:flex;gap:6px;align-items:end}@media(pointer:coarse){#touch{display:flex}#toast{bottom:115px}}@media(max-width:650px){header{height:64px}.edition{display:none}main{padding:24px 10px}.eyebrow{font-size:8px;letter-spacing:2px}.game-top{padding:10px}.game-top>span:nth-child(2){font-size:9px}.game-bottom{flex-wrap:wrap;gap:10px;padding:10px}.stage canvas{aspect-ratio:4/5;object-fit:fill}#hud{gap:16px;left:12px;top:12px}.meter{width:65px}.story-card{padding:20px}h2{font-size:26px}.story-card p{font-size:12px}.below{padding:12px 5px}#hud small{font-size:7px}}

@media(max-width:650px){#touch{display:flex}#toast{bottom:115px}}

/* Visible controls also support mouse users and touch laptops. */
#touch{display:flex}#toast{bottom:115px}#touch>div:last-child button{font-size:11px;padding:15px 12px}#touch .dpad button{padding:11px 0}