.public-page { --public-bg:#090b0e; --public-panel:#11191f; --public-text:#f5f1e7; --public-muted:#b8c5cb; --public-line:#33434d; --public-yellow:#ffda28; --public-cyan:#20d7e6; --public-pink:#ff67aa; margin:0; background:radial-gradient(circle at 12% 20%,#ed006129,transparent 30rem),radial-gradient(circle at 83% 70%,#00d6e71f,transparent 36rem),linear-gradient(#0009,#000e),url('/static/wallpaper.svg') center/cover fixed,var(--public-bg); color:var(--public-text); font:16px/1.6 system-ui,-apple-system,"Segoe UI",sans-serif; color-scheme:dark; }
.public-page * { box-sizing:border-box; min-width:0; }
.public-page [hidden] { display:none !important; }
.public-page a { color:inherit; text-decoration:none; }
.public-page a:hover { text-decoration:underline; text-underline-offset:4px; }
.public-page button { font:inherit; cursor:pointer; }
.public-page :is(a,button,summary):focus-visible { outline:3px solid var(--public-cyan); outline-offset:4px; }
.public-page h1,.public-page h2,.public-page h3,.public-page p { margin:0; }
.public-page h2 { font-size:clamp(1.7rem,3vw,2.5rem); line-height:1.2; letter-spacing:-.035em; }
.public-page h3 { font-size:1.1rem; line-height:1.4; }
.public-page section[id] { scroll-margin-top:1.5rem; }
.public-width { width:min(1200px,calc(100% - 4rem)); margin-inline:auto; }
.public-header { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1.2rem; padding:1.1rem max(2rem,calc((100vw - 1200px)/2)); border-bottom:1px solid var(--public-line); background:#080a0eed; }
.public-brand { display:flex; align-items:center; gap:.7rem; font-size:.9rem; font-weight:750; line-height:1.25; }
.public-mark { display:block; object-fit:cover; flex:none; width:40px; height:40px; border:1px solid var(--public-yellow); border-radius:7px; color:var(--public-yellow); font-size:.7rem; letter-spacing:-.05em; }
.public-header nav { display:flex; flex-wrap:wrap; gap:1.2rem; font-size:.84rem; }
.public-header nav a { padding:.45rem 0; }
.public-actions { display:flex; flex-wrap:wrap; gap:.6rem; align-items:center; }
.public-button { display:inline-flex; align-items:center; justify-content:center; gap:.5rem; min-height:44px; border:1px solid #435662; border-radius:6px; padding:.6rem .95rem; background:#101a21; font-size:.88rem; font-weight:650; line-height:1.3; text-align:center; }
.public-page .public-primary { background:var(--public-yellow); border-color:var(--public-yellow); color:#171300; }
.public-page .public-button:hover { background:#1a303c; text-decoration:none; }
.public-page .public-primary:hover { background:#ffe76b; }
.public-page [aria-disabled=true] { opacity:.65; cursor:not-allowed; }
.public-intro { display:grid; grid-template-columns:1fr 1fr; gap:3.5rem; align-items:center; padding-block:3.8rem 3.5rem; }
.public-eyebrow { font-size:.74rem; line-height:1.5; letter-spacing:.1em; text-transform:uppercase; color:var(--public-cyan); font-weight:750; }
.public-intro h1 { margin:.85rem 0 1.25rem; font-size:clamp(2.7rem,5vw,4.8rem); letter-spacing:-.055em; line-height:1.02; }
.public-lead { max-width:33rem; margin-bottom:1.6rem !important; color:var(--public-muted); font-size:1.08rem; }
.public-note { margin-top:1rem !important; font-size:.8rem; color:var(--public-muted); }
.public-registration-notice { margin-top:.8rem !important; color:var(--public-yellow); font-size:.85rem; }
.public-preview { border:1px solid #3c535e; border-top:3px solid var(--public-yellow); border-radius:10px; background:linear-gradient(125deg,#10242b,#18121f); overflow:hidden; box-shadow:0 15px 50px #0004; }
.public-preview > header { display:flex; align-items:center; flex-wrap:wrap; justify-content:space-between; gap:.8rem; padding:1rem; border-bottom:1px solid var(--public-line); }
.public-preview h2 { font-size:1rem; letter-spacing:0; }
.public-preview-switch { display:flex; gap:.25rem; }
.public-preview-switch button { min-height:44px; padding:.35rem .7rem; border:1px solid #4c5c65; border-radius:5px; color:var(--public-text); background:#10161c; font-size:.8rem; }
.public-preview-switch [aria-pressed=true] { border-color:var(--public-cyan); color:var(--public-cyan); background:#10313a; }
.public-preview-switch [data-preview=gm][aria-pressed=true] { border-color:var(--public-pink); color:var(--public-pink); background:#301425; }
.public-preview-panel { padding:1rem; }
.preview-context { display:flex; flex-wrap:wrap; justify-content:space-between; gap:.4rem; padding:.5rem .65rem; border:1px solid #ffda2840; background:#ffda2808; font-size:.75rem; }
.preview-context strong { color:var(--public-yellow); }
.preview-identity { margin:1rem 0; }
.preview-identity strong { font-size:1rem; color:var(--public-cyan); }
.preview-identity small,.preview-play small { display:block; color:var(--public-muted); font-size:.73rem; }
.preview-health-heading { display:flex; justify-content:space-between; gap:.5rem; font-size:.75rem; }
.preview-health { display:flex; gap:3px; margin:.45rem 0; }
.preview-health span { display:grid; place-items:center; flex:1; height:28px; background:#d51d2b; color:white; border:1px solid #ffffff55; border-radius:2px; font-size:.65rem; font-weight:750; }
.preview-health span:nth-child(2) { background:#df3427; }.preview-health span:nth-child(3) { background:#e65424; }.preview-health span:nth-child(4) { background:#e97922; }.preview-health span:nth-child(5) { background:#e99d22; }.preview-health span:nth-child(6) { background:#d7b829; }.preview-health span:nth-child(7) { background:#adc438; }
.preview-health .lost { background:#241719; color:#b49d9f; border-color:#603139; }
.preview-vitals { display:grid; grid-template-columns:1fr 1fr 1.2fr; gap:.5rem; margin:.8rem 0; }
.preview-vitals div { padding:.5rem; border:1px solid var(--public-line); border-radius:4px; background:#091016; }
.preview-vitals dt { color:var(--public-muted); font-size:.7rem; }.preview-vitals dd { margin:.15rem 0 0; font-weight:750; font-size:.95rem; }
.preview-play { display:grid; grid-template-columns:1fr 1fr; gap:.6rem; }
.preview-play section { padding:.6rem; border:1px solid var(--public-line); border-top:2px solid var(--public-cyan); border-radius:4px; background:#0b1319; }
.preview-play section:first-child { border-top-color:var(--public-yellow); }
.preview-play h3 { font-size:.8rem; margin-bottom:.5rem; }.preview-play p { margin-top:.6rem; font-size:.76rem; }
.public-preview-caption { padding:.65rem 1rem; background:#090d12; font-size:.7rem; color:var(--public-muted); }
.preview-preparation { margin:0; display:grid; gap:.6rem; }
.preview-preparation > div { padding:.65rem; border:1px solid var(--public-line); border-left:2px solid var(--public-pink); border-radius:4px; background:#15121b; }
.preview-preparation dt { color:var(--public-pink); font-size:.7rem; }
.preview-preparation dd { margin:.15rem 0 0; font-size:.83rem; }.preview-preparation dd span { display:block; color:var(--public-muted); font-size:.73rem; }
.public-benefits,.public-group,.public-start,.public-faq { padding-block:2.5rem; }
.public-benefits { border-top:1px solid var(--public-line); }
.public-page h2 + .public-three,.public-page h2 + .public-two { margin-top:1.6rem; }
.public-eyebrow + h2 { margin-top:.5rem; }
.public-three { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:2rem; }
.public-three article,.public-three li { padding-top:.5rem; }
.public-three p,.public-role p { margin-top:.7rem; color:var(--public-muted); font-size:.95rem; }
.public-index { color:var(--public-cyan); font-size:.8rem; font-weight:750; }.public-three h3 { margin-top:.4rem; }
.public-two { display:grid; grid-template-columns:1fr 1fr; gap:1.3rem; }
.public-role { padding:1.6rem; border:1px solid #20d7e64d; border-top:3px solid var(--public-cyan); border-radius:8px; background:linear-gradient(125deg,#0d2d35aa,#0c161c); }
.public-role h3 { margin-top:.65rem; font-size:1.5rem; letter-spacing:-.025em; }
.public-role ul { padding-left:1.2rem; color:var(--public-muted); font-size:.9rem; margin:1.1rem 0 1.4rem; }
.public-role li { padding:.2rem 0; }
.public-gm { border-color:#ff67aa4d; border-top-color:var(--public-pink); background:linear-gradient(125deg,#351327aa,#17111b); }
.public-gm .public-eyebrow { color:var(--public-pink); }
.public-start ol { padding:0; list-style:none; }
.public-step { display:grid; place-items:center; width:32px; height:32px; border:1px solid #ffda2870; border-radius:50%; color:var(--public-yellow); font-size:.85rem; font-weight:750; }
.public-faq { max-width:900px; }
.public-faq h2 { margin-bottom:1.2rem; }
.public-faq details { border-bottom:1px solid var(--public-line); padding:1rem 0; }
.public-faq summary { cursor:pointer; padding:.4rem 0; font-weight:650; }
.public-faq details p { color:var(--public-muted); margin:.7rem 0 .2rem; font-size:.95rem; }
.public-closing { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1rem; padding:2rem; margin-block:2rem; border:1px solid #ffda2845; border-radius:8px; background:linear-gradient(115deg,#40370c42,#18252b70); }
.public-footer { display:flex; flex-wrap:wrap; align-items:start; justify-content:space-between; gap:1.2rem; border-top:1px solid var(--public-line); padding-block:1.6rem 2rem; font-size:.75rem; color:var(--public-muted); }
.public-footer p { max-width:33rem; flex:1 1 20rem; }.public-footer a { padding:.5rem 0; }
.public-footer .public-support { display:inline-flex; align-items:center; gap:.5rem; color:var(--public-muted); text-decoration:none; min-height:44px; }
.public-support .support-cup { flex:none; width:1.25rem; height:1.25rem; }
.public-footer .public-support:hover,.public-footer .public-support:focus-visible { color:var(--public-yellow); }
.public-skip { position:absolute; left:1rem; top:-5rem; padding:.6rem; background:var(--public-yellow); color:#171300 !important; z-index:10; }.public-skip:focus { top:1rem; }
@media(max-width:1000px) { .public-header nav { order:3; justify-content:center; width:100%; }.public-intro { gap:2rem; padding-top:2.5rem; }.public-intro h1 { font-size:clamp(2.7rem,5.2vw,4.3rem); } }
@media(max-width:760px) { .public-width { width:calc(100% - 2rem); }.public-header { padding:1rem; gap:.8rem; }.public-header nav { justify-content:start; gap:.6rem 1.2rem; }.public-intro { grid-template-columns:1fr; padding-block:2rem; gap:2rem; }.public-intro h1 { font-size:clamp(2.8rem,10vw,4rem); }.public-three,.public-two { grid-template-columns:1fr; gap:1.3rem; }.public-benefits,.public-group,.public-start,.public-faq { padding-block:1.7rem; }.public-role { padding:1.2rem; }.public-closing { padding:1.3rem; }.public-header .public-actions { margin-left:auto; }.public-preview header { align-items:start; }.public-page h2 { font-size:1.8rem; } }
@media(max-width:400px) { .public-header .public-actions { width:100%; margin:0; }.public-header .public-actions > * { flex:1; }.public-header nav { font-size:.78rem; gap:.3rem 1rem; }.public-lead { font-size:1rem; }.preview-play { grid-template-columns:1fr; }.public-preview h2 { font-size:.95rem; } }
@media(prefers-reduced-motion:reduce) { .public-page * { scroll-behavior:auto !important; animation:none !important; transition:none !important; } }

/* Existing application artwork gives the public workspace its familiar identity. */
.public-logo { width:min(100%,440px); justify-self:center; border:1px solid #ffda2866; border-top:3px solid var(--public-yellow); border-radius:12px; overflow:hidden; background:#000; box-shadow:-16px 16px 60px #00d6e71a,16px -10px 60px #ed00611f; }
.public-logo img { display:block; width:100%; height:auto; aspect-ratio:1; object-fit:contain; }
.public-benefit-layout { display:grid; grid-template-columns:1fr 1fr; gap:3.5rem; align-items:start; margin-top:1.6rem; }
.public-benefit-layout .public-three { grid-template-columns:1fr; gap:1.3rem; }
@media(max-width:1000px) { .public-benefit-layout { gap:2rem; } }
@media(max-width:760px) { .public-logo { width:min(100%,320px); }.public-benefit-layout { grid-template-columns:1fr; gap:2rem; } }
