:root { color-scheme: dark; font-family: Arial, Helvetica, sans-serif; background: #000; color: #d8e8e5; }
* { box-sizing: border-box; }
html, body { margin: 0; width: 100%; height: 100%; overflow: hidden; }
#stage { position: fixed; inset: 0; background: #000; }
ruffle-player { display: block; width: 100%; height: 100%; }
#entry { position: fixed; inset: 0; display: grid; place-items: center; padding: 24px; background: #070b0b; }
#entry[hidden], [hidden] { display: none !important; }
.intro { max-width: 620px; text-align: center; }
.eyebrow { font-size: 10px; letter-spacing: .28em; color: #80aaa3; }
h1 { margin: 25px 0 8px; color: #d4eee8; font-size: clamp(64px, 17vw, 132px); line-height: 1; font-weight: 900; letter-spacing: -.07em; }
.season { margin: 20px 0 46px; font-size: 11px; letter-spacing: .2em; color: #80aaa3; }
button { cursor: pointer; font: inherit; border-radius: 0; }
#play { width: min(290px, 100%); padding: 18px 24px; border: 1px solid #80aaa3; background: transparent; color: #d4eee8; font-size: 12px; letter-spacing: .15em; }
#play span { margin-left: 30px; }
#play:hover, #play:focus-visible { background: #d4eee8; color: #070b0b; }
#play:disabled { opacity: .6; cursor: wait; }
.hint { margin-top: 24px; color: #81918e; font-size: 12px; line-height: 1.6; }
#status { min-height: 2em; color: #d4eee8; font-size: 13px; line-height: 1.6; }
#fullscreen { position: fixed; right: 12px; top: 10px; border: 1px solid #35413f; background: #070b0be6; color: #9ebbb5; padding: 8px 10px; font-size: 9px; letter-spacing: .08em; opacity: .65; }
#fullscreen:hover, #fullscreen:focus-visible { opacity: 1; }
:root { --mint:#92c8bf; --ink:#070c0c; }
#test-bar {position:fixed;bottom:0;left:0;right:0;display:flex;align-items:center;justify-content:center;gap:18px;min-height:30px;padding:5px 12px;background:#101816ed;border-top:1px solid #283c37;color:#9cb4ad;font:9px/1.5 Arial,sans-serif;letter-spacing:.12em;z-index:5}
#test-bar button {border:0;background:none;color:#c9dcd7;font-size:10px;text-decoration:underline;text-underline-offset:3px;padding:4px}
#stage{bottom:30px} #fullscreen{z-index:6}
#unlock {border:1px solid #416b62;padding:0;background:#0b1110;color:#e2eee9;width:min(550px,calc(100% - 28px));max-height:calc(100% - 32px);box-shadow:0 18px 100px #000a;}
#unlock::backdrop {background:#020605dd;backdrop-filter:blur(7px)}
.unlock-card {padding:26px 40px 28px;background:radial-gradient(ellipse at 100% 0,#28403955,transparent 55%)}
.card-top {display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #32463f;padding-bottom:17px;margin-bottom:34px;font-size:10px;letter-spacing:.14em;color:#8ea59d}
#close-unlock {font-size:27px;line-height:1;color:#a5bcb4;background:transparent;border:0;padding:0 0 0 12px}
#unlock h2 {margin:13px 0 20px;font-size:clamp(40px,7vw,61px);line-height:1.04;letter-spacing:-.045em;font-weight:800}
#unlock-description {max-width:390px;color:#bccbc5;font-size:15px;line-height:1.65}
.purchase {display:flex;align-items:center;justify-content:space-between;border-top:1px solid #32463f;border-bottom:1px solid #32463f;padding:23px 0 17px;margin-top:26px}
.purchase strong {font-size:44px;letter-spacing:-.04em;font-weight:500}.purchase strong span {font-size:12px;letter-spacing:.1em;color:#9bb8ac}
.purchase p {color:#a6b7ae;font-size:12px;margin:8px 0}.episode-label {font:31px/1 monospace;color:#5c8879}
.support-note {font-size:12px;line-height:1.7;color:#98aea3;margin:20px 0 24px}
.primary {width:100%;background:#b1d9c8;border:1px solid #b1d9c8;color:#0d241b;padding:17px 20px;font-size:14px;font-weight:700;display:flex;justify-content:space-between}.primary:hover{background:#d4eee1}.primary:disabled{opacity:.45;cursor:default}
.sandbox-note {font-size:9px;letter-spacing:.12em;color:#c5b487;text-align:center;margin-top:16px}
#payment-status {font-size:12px;color:#c5d6cd;line-height:1.6;text-align:center;min-height:18px}
.text-button {display:block;margin:19px auto 0;background:none;border:0;color:#9ab6a8;font-size:12px;text-decoration:underline;text-underline-offset:4px}
button:focus-visible {outline:2px solid #d1efdd;outline-offset:5px}
@media(max-width:600px){.unlock-card{padding:20px 24px}.card-top{margin-bottom:24px}.purchase{padding:16px 0 12px;margin-top:20px}.support-note{margin:14px 0 18px}#test-bar{gap:9px;font-size:8px}#test-bar button{font-size:9px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}

#access-dialog{border:1px solid #416b62;padding:0;background:#0b1110;color:#e2eee9;width:min(550px,calc(100% - 28px));max-height:calc(100% - 32px);box-shadow:0 18px 100px #000a}#access-dialog::backdrop{background:#020605dd;backdrop-filter:blur(7px)}#access-dialog h2{font-size:42px;letter-spacing:-.04em;margin:14px 0}.access-copy{font-size:14px;line-height:1.7;color:#bccbc5}.close-button{font-size:27px;color:#a5bcb4;background:none;border:0}.field-label{display:block;font-size:12px;color:#c9dcd7;margin:18px 0 8px}input{width:100%;padding:13px 14px;background:#060c0a;border:1px solid #416b62;color:#e2eee9;font:16px Arial,sans-serif;border-radius:0}input:focus-visible{outline:2px solid #d1efdd;outline-offset:2px}.field-note{font-size:11px;line-height:1.65;color:#98aea3}#access-form .primary{margin-top:24px}details{margin-top:22px;font-size:12px;color:#b1d9c8}summary{cursor:pointer;padding:8px 0}#access-status{font-size:13px;line-height:1.7;color:#c5d6cd;min-height:20px}#unlock{overflow-y:auto}#test-bar{flex-wrap:wrap}#purchase-email{font-size:14px}#gate-access{margin-top:14px}#return-free{margin-top:14px}

@media(max-width:600px){#test-bar{height:70px;display:grid;grid-template-columns:1fr 1fr;gap:0 8px;text-align:center}#stage{bottom:70px}#access-dialog h2{font-size:34px}}

.updates-opt-in{display:flex;gap:10px;align-items:flex-start;color:#b9cdc3;font-size:13px;line-height:1.6;margin:18px 0}.updates-opt-in input{width:18px;height:18px;flex:0 0 18px;margin:3px 0;accent-color:#b0ddcb}
