:root{--background:#0c0c0c;--surface:#1a1a1a;--surface-2:#222;--stone:#3d3d3d;--gold:#d4af37;--gold-light:#f1e5ac;--gold-dim:#d4af371f;--text:#e0d9c1;--text-dim:#e0d9c1a3;--danger:#ffb4a8}*{box-sizing:border-box}html,body{background:var(--background);min-height:100%;color:var(--text);margin:0}body{font-family:Georgia,Times New Roman,serif}button,input,textarea{font:inherit}a{color:inherit}.app-shell{background:radial-gradient(circle at 18% 12%,#d4af3729,#0000 28rem),radial-gradient(circle at 80% 4%,#6b8cce29,#0000 26rem),linear-gradient(145deg,#0c0c0c 0%,#131313 46%,#080808 100%);min-height:100dvh;position:relative;overflow:hidden}.app-shell:before{content:"";pointer-events:none;background-image:linear-gradient(#ffffff06 1px,#0000 1px),linear-gradient(90deg,#ffffff06 1px,#0000 1px);background-size:42px 42px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#000,#0000 82%);mask-image:linear-gradient(#000,#0000 82%)}.page{z-index:1;width:min(100%,980px);margin:0 auto;padding:24px;position:relative}.hero{align-content:center;gap:22px;min-height:100dvh;padding-bottom:42px;display:grid}.brand-row{align-items:center;gap:14px;display:flex}.brand-mark{object-fit:contain;filter:drop-shadow(0 0 18px #d4af3752);width:58px;height:58px}.kicker{letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin:0;font-family:Arial,Helvetica,sans-serif;font-size:.72rem;font-weight:800}.title{letter-spacing:0;text-transform:uppercase;max-width:820px;color:var(--gold-light);margin:0;font-family:Arial,Helvetica,sans-serif;font-size:clamp(2.35rem,8vw,5.2rem);line-height:.95}.copy{max-width:680px;color:var(--text-dim);margin:0;font-size:1.08rem;line-height:1.7}.identity-tools{color:#e0d9c1a3;letter-spacing:.12em;text-transform:uppercase;flex-wrap:wrap;align-items:center;gap:10px;font-family:Arial,Helvetica,sans-serif;font-size:.72rem;font-weight:800;display:flex}.identity-tools button{min-height:2rem;color:var(--gold-light);cursor:pointer;letter-spacing:.1em;text-transform:uppercase;background:#00000038;border:1px solid #d4af3747;padding:0 .7rem;font-family:Arial,Helvetica,sans-serif;font-size:.68rem;font-weight:900}.panel{background:linear-gradient(135deg,#2d2d2ddb,#121212eb),#0a0a0acc;border:1px solid #d4af3761;width:min(100%,760px);box-shadow:0 22px 80px #0000005c}.join-panel{padding:clamp(18px,4vw,32px)}.reveal-panel{padding:clamp(16px,3vw,24px)}.reveal-panel h2{letter-spacing:0;text-transform:uppercase;color:var(--gold-light);margin:7px 0 0;font-family:Arial,Helvetica,sans-serif;font-size:clamp(1.15rem,4vw,1.7rem);line-height:1.05}.reveal-list{gap:12px;margin-top:16px;display:grid}.reveal-card{background:#0000003d;border:1px solid #d4af372e;padding:14px}.reveal-card h3{letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin:0 0 8px;font-family:Arial,Helvetica,sans-serif;font-size:.8rem;font-weight:900}.private-label{letter-spacing:.12em;text-transform:uppercase;color:#82c9ffc7;margin:0 0 8px;font-size:.72rem;font-weight:800}.reveal-card p{color:var(--text-dim);white-space:pre-wrap;margin:0;line-height:1.6}.player-map-panel{padding:clamp(16px,3vw,24px)}.player-map-panel h2{letter-spacing:0;text-transform:uppercase;color:var(--gold-light);margin:7px 0 14px;font-family:Arial,Helvetica,sans-serif;font-size:clamp(1.15rem,4vw,1.7rem);line-height:1.05}.player-map-board{aspect-ratio:1;background-color:#0000;background-image:radial-gradient(circle at 35% 22%,#d4af371f,#0000 30%),linear-gradient(135deg,#202018,#101010);background-position:50%;background-repeat:repeat,repeat;background-size:cover;background-attachment:scroll,scroll;background-origin:padding-box,padding-box;background-clip:border-box,border-box;border:1px solid #d4af373d;width:100%;position:relative;overflow:hidden}.player-map-board.grid-on:after{content:"";background-image:linear-gradient(#ffffff14 1px,#0000 1px),linear-gradient(90deg,#ffffff14 1px,#0000 1px);background-size:calc(100% / var(--grid-size,16)) calc(100% / var(--grid-size,16));opacity:.45;pointer-events:none;position:absolute;inset:0}.player-map-placeholder{color:#e0d9c16b;letter-spacing:.16em;text-transform:uppercase;place-items:center;font-family:Arial,Helvetica,sans-serif;font-size:.72rem;font-weight:900;display:grid;position:absolute;inset:0}.player-fog-region{z-index:1;pointer-events:none;background:repeating-linear-gradient(135deg,#030609e6 0 8px,#0d1217e6 8px 16px);border:1px solid #dce6f01f;place-items:center;display:grid;position:absolute;box-shadow:inset 0 0 28px #000000b3}.player-fog-region span{color:#e0d9c1a3;letter-spacing:.08em;text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap;max-width:100%;padding:2px 5px;font-family:Arial,Helvetica,sans-serif;font-size:.56rem;font-weight:900;overflow:hidden}.player-fog-region[data-shape=ellipse]{background:radial-gradient(#04070af0 0%,#080c10e6 56%,#080c1038 82%,#0000 100%);border-radius:999px;box-shadow:inset 0 0 32px #000000d1,0 0 22px #00000061}.player-map-marker{--marker-color:#d4af37;z-index:2;border:1px solid color-mix(in srgb, var(--marker-color), white 35%);max-width:9rem;color:var(--text);box-shadow:0 0 16px -5px var(--marker-color);background:#000000b8;border-radius:999px;align-items:center;gap:5px;padding:3px 7px 3px 4px;display:inline-flex;position:absolute;transform:translate(-50%,-50%)}.player-map-marker.small{--token-scale:.82}.player-map-marker.medium{--token-scale:1}.player-map-marker.large{--token-scale:1.28}.player-map-marker.huge{--token-scale:1.62}.pm-dot{width:calc(14px * var(--token-scale,1));height:calc(14px * var(--token-scale,1));background:var(--marker-color);box-shadow:0 0 14px -2px var(--marker-color);border-radius:999px;flex:none}.pm-label,.pm-hp,.pm-status{text-overflow:ellipsis;white-space:nowrap;letter-spacing:.04em;min-width:0;font-family:Arial,Helvetica,sans-serif;font-size:.66rem;font-weight:900;overflow:hidden}.pm-hp{color:var(--gold)}.pm-status{color:#e0d9c1a8;max-width:4.6rem}.field-grid{gap:14px;display:grid}.prebuilt-picker{gap:14px;margin-bottom:16px;display:grid}.prebuilt-roster{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;display:grid}.prebuilt-card{min-height:150px;color:var(--text);cursor:pointer;text-align:left;background:#00000038;border:1px solid #d4af3729;align-content:start;gap:8px;padding:13px;display:grid}.prebuilt-card[data-active=true]{border-color:var(--gold);box-shadow:0 0 0 3px var(--gold-dim);background:linear-gradient(135deg,#d4af3721,#0000002e),#00000047}.prebuilt-card span,.prebuilt-card small,.prebuilt-detail span{letter-spacing:.12em;text-transform:uppercase;font-family:Arial,Helvetica,sans-serif;font-size:.62rem;font-weight:900;line-height:1.35}.prebuilt-card span{color:#d4af37c7}.prebuilt-card strong{color:var(--gold-light);text-transform:uppercase;font-family:Arial,Helvetica,sans-serif;font-size:1rem;line-height:1.15}.prebuilt-card small{color:var(--text-dim);letter-spacing:.04em;text-transform:none;font-weight:700}.prebuilt-detail{background:#0003;border:1px solid #d4af3733;gap:16px;padding:16px;display:grid}.prebuilt-detail h3,.selected-prebuilt-panel h2{letter-spacing:0;text-transform:uppercase;color:var(--gold-light);margin:6px 0 8px;font-family:Arial,Helvetica,sans-serif;line-height:1.05}.prebuilt-detail h3{font-size:clamp(1.15rem,4vw,1.55rem)}.prebuilt-detail p,.selected-prebuilt-grid p,.selected-prebuilt-archetype{color:var(--text-dim);margin:0;line-height:1.55}.prebuilt-detail-grid,.selected-prebuilt-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;display:grid}.prebuilt-detail-grid div,.selected-prebuilt-grid div{border-top:1px solid #d4af3729;padding-top:10px}.prebuilt-detail span{color:#d4af37c7}.selected-prebuilt-panel{padding:clamp(16px,3vw,24px)}.selected-prebuilt-panel h2{font-size:clamp(1.2rem,4vw,1.85rem)}.selected-prebuilt-grid{margin-top:16px}.selected-prebuilt-grid h3{color:#d4af37c7;letter-spacing:.16em;text-transform:uppercase;margin:0 0 6px;font-family:Arial,Helvetica,sans-serif;font-size:.68rem;font-weight:900}.flow-head{justify-content:space-between;align-items:start;gap:18px;margin-bottom:16px;display:flex}.flow-head h2{letter-spacing:0;text-transform:uppercase;color:var(--gold-light);margin:7px 0 0;font-family:Arial,Helvetica,sans-serif;font-size:clamp(1.35rem,5vw,2.2rem);line-height:1.05}.step-count{color:var(--gold);border:1px solid #d4af374d;flex:none;padding:7px 9px;font-family:Arial,Helvetica,sans-serif;font-size:.72rem;font-weight:800}.progress-track{background:#ffffff14;height:4px;margin-bottom:18px}.progress-track div{background:var(--gold);height:100%;transition:width .18s}.flow-prompt{color:var(--text-dim);margin:0 0 18px;line-height:1.55}.field{gap:7px;display:grid}.field label{letter-spacing:.18em;text-transform:uppercase;color:#d4af37c7;font-family:Arial,Helvetica,sans-serif;font-size:.68rem;font-weight:800}.field p{color:var(--text-dim);margin:-2px 0 0;font-size:.92rem;line-height:1.45}.field input,.field textarea{color:#fff;background:#00000047;border:1px solid #d4af3733;border-radius:0;outline:none;width:100%;padding:13px 14px}.field textarea{resize:vertical;min-height:104px}.field input:focus,.field textarea:focus{border-color:var(--gold);box-shadow:0 0 0 3px var(--gold-dim)}.action{background:var(--gold);color:#090909;cursor:pointer;letter-spacing:.16em;text-transform:uppercase;border:0;justify-content:center;align-items:center;gap:10px;min-height:52px;padding:0 18px;font-family:Arial,Helvetica,sans-serif;font-size:.76rem;font-weight:900;display:inline-flex}.action:disabled{cursor:progress;opacity:.62}.secondary-action{min-height:52px;color:var(--text);cursor:pointer;letter-spacing:.16em;text-transform:uppercase;background:#0000003d;border:1px solid #d4af3747;justify-content:center;align-items:center;gap:10px;padding:0 18px;font-family:Arial,Helvetica,sans-serif;font-size:.76rem;font-weight:900;display:inline-flex}.secondary-action:disabled{cursor:not-allowed;opacity:.45}.flow-actions{justify-content:space-between;gap:12px;margin-top:18px;display:flex}.review-grid{gap:12px;display:grid}.review-item{background:#00000038;border:1px solid #d4af3729;padding:14px}.review-item h3{letter-spacing:.18em;text-transform:uppercase;color:#d4af37c7;margin:0 0 6px;font-family:Arial,Helvetica,sans-serif;font-size:.68rem;font-weight:800}.review-item p{color:var(--text-dim);white-space:pre-wrap;margin:0;line-height:1.55}.message{color:var(--danger);margin:8px 0 0}.success-icon{object-fit:contain;width:78px;height:78px}@media (max-width:640px){.page{padding:18px}.hero{align-content:start;padding-top:28px}.brand-mark{width:48px;height:48px}.flow-actions{flex-direction:column-reverse}.action,.secondary-action{width:100%}}