:root { --bg:#070b11; --surface:#101722; --line:rgba(220,204,170,.18); --paper:#e8dfca; --paper-strong:#fff7e8; --muted:#8e99a2; --gold:#d4ad6b; --serif:"Noto Serif SC",serif; --sans:"Noto Sans SC",sans-serif; }
* { box-sizing:border-box; }
[hidden] { display:none !important; }
html, body { min-width:320px; min-height:100%; margin:0; }
body { background:var(--bg); color:var(--paper); font-family:var(--sans); }
button, a { font:inherit; color:inherit; }
a { text-decoration:none; }
button:focus-visible, a:focus-visible { outline:2px solid var(--gold); outline-offset:3px; }
.player-header { position:fixed; z-index:20; inset:0 0 auto; height:64px; display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:18px; padding:0 22px; border-bottom:1px solid var(--line); background:rgba(7,11,17,.9); backdrop-filter:blur(18px); }
.player-header a { min-width:44px; min-height:44px; display:flex; align-items:center; gap:10px; }.player-header a span { width:32px; height:32px; display:grid; place-items:center; border:1px solid var(--line); border-radius:50%; color:var(--gold); }.player-header a strong { font:600 13px/1 var(--serif); letter-spacing:.1em; }
.player-page summary,.player-page label:has(input[type="checkbox"]),.player-page label:has(input[type="radio"]){min-height:44px}
.player-view-tabs { justify-self:center; display:flex; border:1px solid var(--line); background:rgba(255,255,255,.02); }
.player-view-tabs button { min-height:34px; padding:0 15px; border:0; border-right:1px solid var(--line); background:transparent; color:var(--muted); font-size:8px; cursor:pointer; }
.player-view-tabs button:last-child { border-right:0; }
.player-view-tabs button.active { background:rgba(212,173,107,.12); color:var(--paper-strong); }
.player-view-tabs button:disabled { cursor:not-allowed; opacity:.38; }
.player-header-tools { justify-self:end; display:flex; align-items:center; gap:8px; }
.player-header-tools > button { min-width:44px; min-height:44px; padding:0 13px; border:1px solid var(--line); background:transparent; color:var(--muted); font-size:10px; cursor:pointer; }.player-header-tools > button span{display:none}.player-header-tools > button b{font:inherit}
.player-stage { min-height:100vh; padding-top:64px; }
.curtain { position:relative; min-height:calc(100vh - 64px); display:grid; place-items:center; overflow:hidden; }
.curtain[hidden] { display:none; }
.curtain > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:68% center; filter:saturate(.7) brightness(.55); }
.curtain::after { position:absolute; inset:0; background:linear-gradient(90deg,rgba(5,8,13,.9),rgba(5,8,13,.2)),linear-gradient(0deg,rgba(5,8,13,.72),transparent); content:""; }
.curtain div { position:relative; z-index:2; width:min(580px,calc(100% - 44px)); margin-right:auto; margin-left:max(22px,8vw); }
.curtain span { color:var(--gold); font-size:9px; letter-spacing:.24em; }.curtain h1 { margin:14px 0 16px; color:var(--paper-strong); font:750 clamp(34px,6vw,65px)/1.25 var(--serif); }.curtain p { max-width:500px; margin:0; color:#b1b8ba; font:400 12px/2 var(--serif); }
.curtain-map-action { width:min(390px,100%); min-height:64px; display:grid; grid-template-columns:1fr auto; grid-template-rows:auto auto; gap:4px 18px; align-items:center; margin-top:26px; padding:12px 14px 12px 17px; border:1px solid rgba(212,173,107,.46); background:rgba(12,17,24,.72); box-shadow:0 12px 34px rgba(0,0,0,.3); color:var(--paper-strong); text-align:left; cursor:pointer; backdrop-filter:blur(12px); transition:border-color .2s,background .2s,transform .2s; }
.curtain-map-action strong { font:600 14px/1.4 var(--serif); letter-spacing:.06em; }
.curtain-map-action small { color:var(--muted); font-size:8px; line-height:1.5; }
.curtain-map-action i { grid-column:2; grid-row:1 / 3; color:var(--gold); font:400 20px/1 var(--serif); }
.curtain-map-action:hover,.curtain-map-action:focus-visible { border-color:var(--gold); background:rgba(212,173,107,.1); transform:translateY(-2px); }
.handout-view { min-height:calc(100vh - 64px); display:grid; grid-template-columns:minmax(0,1.08fr) minmax(390px,.92fr); align-items:start; }
.handout-view[hidden] { display:none; }
.handout-view figure { position:sticky; top:64px; min-height:calc(100vh - 64px); display:grid; place-items:center; margin:0; padding:28px; border-right:1px solid var(--line); background:radial-gradient(circle at 50% 50%,#182231,var(--bg) 62%); }
.handout-view figure img { max-width:100%; max-height:calc(100vh - 120px); object-fit:contain; box-shadow:0 30px 100px rgba(0,0,0,.5); }
.handout-copy { width:min(720px,100%); align-self:center; padding:clamp(34px,5vw,68px); }
.handout-copy > p:first-child { margin:0; color:var(--gold); font-size:8px; letter-spacing:.2em; }
.handout-copy h1 { margin:10px 0 9px; color:var(--paper-strong); font:700 clamp(30px,4vw,48px)/1.35 var(--serif); }
.handout-source { margin:0 0 20px; color:#c3a977; font:500 9px/1.7 var(--sans); letter-spacing:.08em; }
.gold-rule { width:44px; height:1px; margin:0 0 23px; background:var(--gold); }
.handout-body { margin:0; color:#c8ced0; font:500 14px/2 var(--serif); }
.handout-facts { margin-top:30px; padding-top:25px; border-top:1px solid var(--line); }
.handout-facts[hidden], .handout-prompt[hidden] { display:none; }
.handout-facts h2 { margin:0 0 14px; color:var(--paper-strong); font:600 17px/1.5 var(--serif); }
.handout-facts ul { display:grid; gap:9px; margin:0; padding:0; list-style:none; }
.handout-facts li { position:relative; padding:11px 13px 11px 28px; border:1px solid rgba(220,204,170,.12); background:rgba(255,255,255,.025); color:#aeb6ba; font:400 12px/1.85 var(--serif); }
.handout-facts li::before { position:absolute; left:12px; top:17px; width:5px; height:5px; border:1px solid var(--gold); border-radius:50%; content:""; }
.handout-prompt { margin-top:24px; padding:17px 18px; border-left:2px solid var(--gold); background:rgba(212,173,107,.07); }
.handout-prompt span { color:var(--gold); font-size:8px; letter-spacing:.14em; }
.handout-prompt p { margin:7px 0 0; color:#c2c7c7; font:500 11px/1.9 var(--serif); }
.player-map-view { min-height:calc(100vh - 64px); padding:clamp(22px,3vw,42px); background:radial-gradient(circle at 40% 20%,rgba(35,57,67,.25),transparent 45%),var(--bg); }
.player-map-view[hidden] { display:none; }
.player-map-heading { max-width:1500px; display:flex; justify-content:space-between; gap:28px; align-items:end; margin:0 auto 18px; }
.player-map-heading p { margin:0 0 7px; color:var(--gold); font-size:8px; letter-spacing:.2em; }
.player-map-heading h1 { margin:0; color:var(--paper-strong); font:700 clamp(28px,4vw,48px)/1.3 var(--serif); }
.player-map-heading > div > span { display:block; max-width:760px; margin-top:9px; color:#aab3b6; font:400 10px/1.75 var(--serif); }
.player-map-counts { display:grid; grid-template-columns:auto auto; gap:4px 9px; align-items:baseline; flex:0 0 auto; padding:12px 14px; border:1px solid var(--line); background:rgba(0,0,0,.14); }
.player-map-counts strong { color:var(--gold); font:700 19px/1 var(--serif); text-align:right; }
.player-map-counts span { color:var(--muted); font-size:7px; }
.player-map-layout { max-width:1500px; display:grid; grid-template-columns:minmax(0,1fr) minmax(330px,390px); align-items:start; margin:0 auto; border:1px solid var(--line); background:var(--surface); }
.player-atlas { position:relative; aspect-ratio:1586 / 992; overflow:hidden; border-right:1px solid var(--line); background:#05080d; }
.player-atlas > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter:saturate(.82) brightness(.7); }
.player-map-hotspots { position:absolute; inset:0; }
.player-map-hotspot { position:absolute; z-index:2; width:44px; height:44px; display:grid; place-items:center; padding:0; transform:translate(calc(-50% + var(--pin-x,0px)),calc(-50% + var(--pin-y,0px))); border:1px solid rgba(212,173,107,.68); border-radius:50%; background:rgba(6,10,15,.92); color:var(--gold); box-shadow:0 0 0 4px rgba(212,173,107,.07),0 7px 22px rgba(0,0,0,.55); cursor:pointer; transition:border-color .2s,background .2s,color .2s,box-shadow .2s,transform .2s; }
.player-map-hotspot .player-map-pin { width:100%; height:100%; display:grid; place-items:center; border-radius:inherit; }
.player-map-hotspot .player-map-pin svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.45; stroke-linecap:round; stroke-linejoin:round; }
.player-map-hotspot::after { position:absolute; top:49px; left:50%; width:max-content; max-width:190px; padding:7px 9px; transform:translateX(-50%) translateY(-3px); border:1px solid var(--line); background:rgba(7,11,17,.97); color:var(--paper); box-shadow:0 8px 26px rgba(0,0,0,.52); font:500 8px/1.5 var(--serif); text-align:center; white-space:normal; content:attr(data-tooltip); opacity:0; pointer-events:none; transition:.2s; }
.player-map-hotspot:hover,.player-map-hotspot:focus-visible,.player-map-hotspot.active { z-index:9; transform:translate(calc(-50% + var(--pin-x,0px)),calc(-50% + var(--pin-y,0px))) scale(1.1); border-color:#e9c989; background:#18130c; color:#ffe7b8; box-shadow:0 0 0 5px rgba(212,173,107,.14),0 10px 28px rgba(0,0,0,.65); }
.player-map-hotspot:hover::after,.player-map-hotspot:focus-visible::after,.player-map-hotspot.active::after { opacity:1; transform:translateX(-50%) translateY(0); }
.player-map-hotspot.current { border-color:#d76c73; color:#f0b6b9; box-shadow:0 0 0 5px rgba(215,108,115,.12),0 0 26px rgba(215,108,115,.22); }
.player-map-hotspot.visited::before { position:absolute; right:-3px; top:-3px; width:9px; height:9px; border:2px solid #070b11; border-radius:50%; background:#69a98a; content:""; }
.player-map-presence { position:absolute; right:-10px; bottom:-7px; min-width:19px; height:19px; display:grid; place-items:center; padding:0 4px; border:2px solid #070b11; border-radius:10px; background:#69aeb5; color:#061012; box-shadow:0 4px 12px rgba(0,0,0,.42); font:700 8px/1 var(--sans); }
.player-map-legend { position:absolute; z-index:3; left:14px; bottom:14px; display:flex; flex-wrap:wrap; gap:10px; padding:8px 10px; border:1px solid var(--line); background:rgba(7,11,17,.84); color:#aeb5b7; font-size:7px; pointer-events:none; }
.player-map-legend span { display:flex; align-items:center; gap:5px; }.player-map-legend i { width:8px;height:8px;border:1px solid var(--gold);border-radius:50%; }.player-map-legend i.current{border-color:#d76c73}.player-map-legend i.visited{border-color:#69a98a;background:#69a98a}.player-map-legend i.presence{border-color:#69aeb5;background:#69aeb5}
.player-map-detail { position:sticky; top:82px; max-height:calc(100vh - 100px); min-height:440px; padding:25px 23px 34px; overflow-y:auto; background:linear-gradient(180deg,#111a26,#0d141e); }
.player-map-detail > p { margin:0 0 8px; color:var(--gold); font-size:7px; letter-spacing:.18em; }
.player-map-detail > h2 { margin:0 0 12px; color:var(--paper-strong); font:650 24px/1.4 var(--serif); }
.player-map-detail > span,.player-map-detail-copy { display:block; color:#aeb7ba; font:400 10px/1.85 var(--serif); }
.player-map-tags { display:flex; flex-wrap:wrap; gap:5px; margin:14px 0; }
.player-map-tags span { padding:5px 7px; border:1px solid var(--line); color:#c8c0ae; font-size:7px; }
.player-route-note { margin:14px 0 0; padding:11px 12px; border-left:2px solid var(--gold); background:rgba(212,173,107,.07); color:#c4c9c8; font:400 9px/1.75 var(--serif); }
.player-map-presence-panel { display:grid; gap:8px; margin-top:18px; }
.player-map-presence-panel > header,.player-map-intel > header { display:flex; align-items:center; justify-content:space-between; gap:12px; color:var(--muted); font-size:7px; letter-spacing:.12em; }
.player-map-presence-panel > header b { color:#8fcdd0; font-weight:600; }
.player-map-character { min-height:58px; display:grid; grid-template-columns:42px minmax(0,1fr); gap:10px; align-items:center; padding:8px 10px; border:1px solid rgba(105,174,181,.25); background:rgba(105,174,181,.055); }
.player-map-character img { width:42px; height:42px; object-fit:cover; object-position:center 24%; border:1px solid rgba(105,174,181,.32); border-radius:50%; background:#090e15; }
.player-map-character strong { display:block; color:var(--paper-strong); font:600 11px/1.4 var(--serif); }
.player-map-character small { display:block; margin-top:2px; color:#86bfc2; font-size:6px; letter-spacing:.1em; }
.player-map-character p { margin:5px 0 0; color:#aeb9bb; font:400 8px/1.55 var(--serif); }
.player-map-intel { display:grid; gap:7px; margin-top:18px; padding:12px; border:1px solid rgba(105,174,181,.22); background:rgba(105,174,181,.04); }
.player-map-intel > header b { color:#8fcdd0; font-weight:600; }
.player-map-intel ul { display:grid; gap:6px; margin:0; padding:0; list-style:none; }
.player-map-intel li { position:relative; padding:7px 8px 7px 22px; color:#c2d3d4; font:400 8px/1.65 var(--serif); }
.player-map-intel li::before { position:absolute; left:6px; top:9px; color:#87c5c8; content:"⌁"; }
.player-map-scenes { display:grid; gap:9px; margin-top:20px; }
.player-map-scenes > header { display:flex; justify-content:space-between; gap:12px; color:var(--muted); font-size:7px; letter-spacing:.12em; }
.player-map-scene { padding:13px; border:1px solid var(--line); background:rgba(0,0,0,.14); }
.player-map-scene.active { border-color:rgba(212,173,107,.55); }.player-map-scene.completed { box-shadow:inset 2px 0 0 #69a98a; }
.player-map-scene > header { display:flex; justify-content:space-between; gap:10px; align-items:start; }
.player-map-scene h3 { margin:0; color:var(--paper-strong); font:600 13px/1.45 var(--serif); }
.player-map-scene time { color:var(--gold); font-size:7px; white-space:nowrap; }
.player-map-scene p { margin:8px 0 0; color:#aeb6b9; font:400 9px/1.75 var(--serif); }
.player-map-clues { display:grid; gap:6px; margin:11px 0 0; padding:0; list-style:none; }
.player-map-clues li { position:relative; padding:8px 9px 8px 25px; border:1px solid rgba(105,174,181,.22); background:rgba(105,174,181,.055); color:#c2d3d4; font:400 8px/1.6 var(--serif); }
.player-map-clues li::before { position:absolute; left:9px; top:11px; color:#87c5c8; content:"✓"; }
.player-map-empty { margin-top:18px; padding:14px; border:1px dashed var(--line); color:var(--muted); font:400 9px/1.7 var(--serif); }
.player-map-list-wrap { max-width:1500px; margin:12px auto 0; border:1px solid var(--line); background:var(--surface); }
.player-map-list-wrap summary { padding:13px 16px; color:var(--muted); font-size:9px; cursor:pointer; }
.player-map-list { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; padding:0 12px 12px; }
.player-map-list button { min-height:46px; display:flex; justify-content:space-between; gap:8px; align-items:center; padding:8px 10px; border:1px solid var(--line); background:transparent; color:#b9c0c1; font-size:8px; text-align:left; cursor:pointer; }.player-map-list button small{color:var(--muted);font-size:6px}.player-map-list button:hover,.player-map-list button.active{border-color:var(--gold);color:var(--paper-strong)}
.projection-note { position:fixed; z-index:22; left:16px; bottom:14px; padding:7px 10px; border:1px solid var(--line); background:rgba(7,11,17,.8); color:var(--muted); font-size:7px; letter-spacing:.1em; }
@media(max-width:980px){.player-map-layout{grid-template-columns:1fr}.player-atlas{border-right:0;border-bottom:1px solid var(--line)}.player-map-detail{position:relative;top:auto;max-height:none;min-height:0}.player-map-list{grid-template-columns:1fr 1fr}}
@media(max-width:760px){ .player-header { grid-template-columns:auto minmax(0,1fr) auto auto;gap:8px;padding:0 10px}.player-header a strong{display:none}.player-view-tabs button{padding:0 7px;font-size:7px}.player-header-tools>button{padding:0}.player-header-tools>button span{display:inline}.player-header-tools>button b{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.handout-view{grid-template-columns:1fr}.handout-view figure{position:relative;top:auto;min-height:52vh;border-right:0;border-bottom:1px solid var(--line)}.handout-view figure img{max-height:48vh}.handout-copy{padding:30px 23px 72px}.handout-facts li{padding-right:11px}.curtain div{margin-left:24px}.projection-note{display:none}.player-map-heading{align-items:start}.player-map-counts{display:none}.player-map-view{padding:18px 10px 40px}.player-map-hotspot{width:35px;height:35px}.player-map-hotspot .player-map-pin svg{width:14px;height:14px}.player-map-hotspot::after{top:40px;max-width:130px;font-size:7px}.player-map-presence{right:-8px;bottom:-7px;min-width:17px;height:17px;font-size:7px}.player-map-legend{display:none}.player-map-list{grid-template-columns:1fr}.player-map-detail{padding:20px 17px 28px} }
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}

.player-tools { padding: clamp(28px,5vw,64px); border-top: 1px solid var(--line); background: linear-gradient(180deg,#0b111a,#070b11 40%); }
.player-tools-heading { display: flex; justify-content: space-between; gap: 24px; align-items: end; max-width: 1420px; margin: 0 auto 14px; }
.player-tools-heading p { margin: 0 0 7px; color: var(--gold); font-size: 8px; letter-spacing: .2em; }
.player-tools-heading h2 { margin: 0; color: var(--paper-strong); font: 700 clamp(28px,4vw,44px)/1.35 var(--serif); }
.player-tools-heading > span { max-width: 360px; color: var(--muted); font-size: 9px; line-height: 1.7; text-align: right; }
.player-local-note { max-width: 1420px; margin: 0 auto 18px; padding: 11px 14px; border: 1px solid rgba(212,173,107,.22); background: rgba(212,173,107,.055); color: #aeb5b7; font-size: 9px; line-height: 1.7; }
.player-live-state { max-width:1420px; display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:12px; margin:0 auto 18px; }
.player-live-state > article { min-width:0; padding:16px 18px; border:1px solid var(--line); background:linear-gradient(135deg,rgba(212,173,107,.065),rgba(16,23,34,.8)); }
.player-live-state > article > span { color:var(--gold); font-size:12px; letter-spacing:.14em; }
.player-live-state h3 { margin:7px 0 5px; color:var(--paper-strong); font:600 18px/1.45 var(--serif); }
.player-live-state p { margin:0; color:#b7c0c2; font:400 14px/1.75 var(--serif); }
.player-live-state ul { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; margin:13px 0 0; padding:0; list-style:none; }
.player-live-state li { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:3px 10px; padding:10px 11px; border:1px solid rgba(220,204,170,.14); background:rgba(0,0,0,.16); }
.player-live-state li.active { border-color:var(--gold); background:rgba(212,173,107,.1); }
.player-live-state li strong { overflow:hidden; color:var(--paper-strong); font:600 14px/1.4 var(--serif); text-overflow:ellipsis; white-space:nowrap; }
.player-live-state li span { color:var(--gold); font-size:12px; white-space:nowrap; }
.player-live-state li small { grid-column:1 / -1; color:var(--muted); font-size:12px; line-height:1.5; }
.player-tools-grid { max-width: 1420px; display: grid; grid-template-columns: minmax(0,1.2fr) minmax(320px,.8fr); gap: 16px; align-items: start; margin: 0 auto; }
.player-tool-card { min-width: 0; border: 1px solid var(--line); background: var(--surface); }
.player-tool-card > header { min-height: 76px; display: flex; justify-content: space-between; gap: 16px; align-items: center; padding: 15px 18px; border-bottom: 1px solid var(--line); }
.player-tool-card > header span { color: var(--gold); font-size: 7px; letter-spacing: .16em; }
.player-tool-card > header h3 { margin: 5px 0 0; color: var(--paper-strong); font: 600 19px/1.35 var(--serif); }
.player-tool-card > header small { color: var(--muted); font-size: 8px; }
.player-tool-card > header button { min-height: 32px; padding: 0 10px; border: 1px solid var(--line); background: transparent; color: var(--muted); font-size: 8px; cursor: pointer; }
.character-editor { grid-row: 1 / span 2; }
.result-inbox-card { grid-column: 1 / -1; }
#player-character-form, #player-check-request-form { display: grid; gap: 13px; padding: 18px; }
#player-character-form label, #player-check-request-form label { display: grid; gap: 7px; min-width: 0; }
#player-character-form label > span, #player-check-request-form label > span { color: var(--gold); font-size: 7px; letter-spacing: .1em; }
.player-form-grid { display: grid; gap: 10px; }
.player-form-grid.two-columns { grid-template-columns: repeat(2,minmax(0,1fr)); }
.player-form-grid.three-columns { grid-template-columns: repeat(3,minmax(0,1fr)); }
.resource-fields label[hidden] { display: none; }
.resource-fields label small { color: var(--muted); font-size: 7px; line-height: 1.45; }
#player-character-form input, #player-character-form select, #player-character-form textarea, #player-check-request-form input, #player-check-request-form select, #player-check-request-form textarea { width: 100%; min-height: 42px; padding: 9px 10px; border: 1px solid var(--line); border-radius: 0; outline: 0; background: #090e16; color: var(--paper-strong); font: 400 10px/1.55 var(--sans); resize: vertical; }
#player-character-form textarea, #player-check-request-form textarea { min-height: 64px; }
#player-character-form input:focus, #player-character-form select:focus, #player-character-form textarea:focus, #player-check-request-form input:focus, #player-check-request-form select:focus, #player-check-request-form textarea:focus { border-color: var(--gold); box-shadow: 0 0 0 2px rgba(212,173,107,.08); }
.approach-editor, .specialty-editor { margin: 0; padding: 14px; border: 1px solid var(--line); }
.approach-editor legend, .specialty-editor legend { padding: 0 7px; color: var(--paper-strong); font: 600 13px/1 var(--serif); }
.approach-editor > p, .specialty-editor > p { margin: 0 0 11px; color: var(--muted); font-size: 8px; }
.approach-inputs { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 7px; }
.approach-inputs label { text-align: center; }
.approach-inputs label span { min-height: 22px; }
.approach-inputs input { text-align: center; }
.player-character-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.player-character-actions button, .player-primary { min-height: 42px; padding: 0 14px; border: 1px solid var(--line); background: transparent; color: var(--muted-strong); font-size: 9px; cursor: pointer; }
.player-character-actions .player-primary, .player-primary { border-color: var(--gold); background: var(--gold); color: #111; font-weight: 700; }
.player-primary.full-width { width: 100%; }
.player-result-list { display: grid; margin: 0; padding: 0; list-style: none; }
.player-result-empty { padding: 28px 20px; color: var(--muted); font: 400 11px/1.8 var(--serif); }
.player-result-item { display: grid; grid-template-columns: 110px minmax(0,1fr) auto; gap: 16px; align-items: start; padding: 18px; border-top: 1px solid var(--line); }
.player-result-item:first-child { border-top: 0; }
.player-result-tier { min-height: 70px; display: grid; place-items: center; align-content: center; padding: 9px; border: 1px solid var(--line); text-align: center; }
.player-result-tier strong { color: var(--paper-strong); font: 700 22px/1 var(--serif); }
.player-result-tier span { margin-top: 7px; color: var(--gold); font-size: 8px; }
.player-result-tier.exceptional { border-color: rgba(102,190,153,.5); background: rgba(102,190,153,.08); }
.player-result-tier.success { border-color: rgba(124,164,203,.45); background: rgba(124,164,203,.07); }
.player-result-tier.costly { border-color: rgba(212,173,107,.45); background: rgba(212,173,107,.08); }
.player-result-tier.severe { border-color: rgba(190,93,82,.45); background: rgba(190,93,82,.08); }
.player-result-copy h4 { margin: 0; color: var(--paper-strong); font: 600 15px/1.5 var(--serif); }
.player-result-copy > span { display: block; margin-top: 4px; color: var(--gold); font-size: 8px; }
.player-result-copy p { margin: 8px 0 0; color: #aeb6ba; font: 400 10px/1.75 var(--serif); }
.player-result-time { color: var(--muted); font-size: 7px; white-space: nowrap; }
body.projection-mode .player-tools { display: none; }

body.builder-mode .player-stage,
body.builder-mode .player-local-note,
body.builder-mode .check-request-card,
body.builder-mode .result-inbox-card { display: none; }
body.builder-mode .player-tools { min-height: 100vh; padding-top: 108px; border-top: 0; }
body.builder-mode .player-tools-grid { grid-template-columns: minmax(0, 1fr); max-width: 1160px; }
body.builder-mode .character-editor { grid-column: 1; grid-row: auto; }

.builder-progress { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); border-bottom: 1px solid var(--line); background: #0b111a; }
.builder-progress button { position: relative; display: grid; grid-template-columns: 28px 1fr; grid-template-rows: auto auto; column-gap: 9px; min-height: 68px; align-content: center; padding: 10px 12px; border: 0; border-right: 1px solid var(--line); background: transparent; color: var(--muted); text-align: left; cursor: pointer; }
.builder-progress button:last-child { border-right: 0; }
.builder-progress button > span { grid-row: 1 / 3; display: grid; width: 26px; height: 26px; place-items: center; align-self: center; border: 1px solid var(--line); border-radius: 50%; color: var(--muted); font: 600 9px var(--sans); }
.builder-progress button b { color: #c1c8ca; font: 600 10px/1.3 var(--serif); }
.builder-progress button i { margin-top: 3px; color: var(--muted); font: normal 7px/1.3 var(--sans); }
.builder-progress button.active { background: rgba(212,173,107,.08); }
.builder-progress button.active::after { position: absolute; right: 0; bottom: -1px; left: 0; height: 2px; background: var(--gold); content: ""; }
.builder-progress button.active > span { border-color: var(--gold); background: var(--gold); color: #111; }
.builder-progress button.active b { color: var(--paper-strong); }
.builder-progress button.complete > span { border-color: rgba(102,190,153,.5); color: #77c7a5; }
.builder-progress button.complete > span::before { content: "✓"; }
.builder-progress button.complete > span { font-size: 0; }
.builder-progress button.complete > span::before { font-size: 9px; }

.builder-assurance { display: grid; grid-template-columns: 36px 1fr auto; gap: 13px; align-items: center; margin: 18px 18px 0; padding: 13px 15px; border: 1px solid rgba(102,190,153,.28); background: rgba(102,190,153,.055); }
.builder-assurance > span { display: grid; width: 32px; height: 32px; place-items: center; border: 1px solid rgba(102,190,153,.42); border-radius: 50%; color: #77c7a5; }
.builder-assurance p { margin: 0; color: #aeb9b8; font-size: 11px; line-height: 1.65; }
.builder-assurance p strong { color: #dce7df; }
.builder-assurance > b { color: #77c7a5; font-size: 10px; white-space: nowrap; }
.builder-error { margin: 12px 18px 0; padding: 12px 14px; border: 1px solid rgba(207,105,91,.4); background: rgba(207,105,91,.08); color: #e0a097; font-size: 11px; line-height: 1.7; }

.builder-step { display: none; padding: clamp(24px,4vw,44px); }
.builder-step.active { display: block; }
.builder-step-heading { margin-bottom: 28px; }
.builder-step-heading > p { margin: 0 0 7px; color: var(--gold); font-size: 9px; letter-spacing: .18em; }
.builder-step-heading h4 { margin: 0; color: var(--paper-strong); font: 700 clamp(25px,3vw,36px)/1.35 var(--serif); }
.builder-step-heading > span { display: block; margin-top: 9px; color: var(--muted); font-size: 12px; line-height: 1.7; }

.archetype-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
.archetype-grid > button { position: relative; display: grid; grid-template-columns: 50px 1fr; gap: 15px; min-height: 170px; align-content: start; padding: 23px 20px; border: 1px solid var(--line); background: #0a1018; color: var(--paper); text-align: left; cursor: pointer; transition: .18s ease; }
.archetype-grid > button:hover { border-color: rgba(212,173,107,.45); transform: translateY(-2px); }
.archetype-grid > button.selected { border-color: var(--gold); background: rgba(212,173,107,.075); box-shadow: inset 0 0 0 1px rgba(212,173,107,.13); }
.archetype-grid > button > span { display: grid; width: 50px; height: 50px; place-items: center; border: 1px solid var(--line); border-radius: 50%; color: var(--gold); font: 600 17px var(--serif); }
.archetype-grid > button.selected > span { border-color: var(--gold); background: var(--gold); color: #111; }
.archetype-grid strong,.archetype-grid small { display: block; }
.archetype-grid strong { color: var(--paper-strong); font: 600 16px var(--serif); }
.archetype-grid small { margin-top: 5px; color: var(--gold); font-size: 9px; }
.archetype-grid p { margin: 13px 0 0; color: #a3adb1; font-size: 11px; line-height: 1.75; }
.archetype-grid > button > i { position: absolute; top: 12px; right: 12px; padding: 4px 7px; border: 1px solid var(--line); color: var(--muted); font: normal 8px var(--sans); }
.archetype-grid > button.selected > i { border-color: var(--gold); color: var(--gold); }
.quickstart-box { display: flex; justify-content: space-between; gap: 24px; align-items: center; margin-top: 16px; padding: 20px; border: 1px solid rgba(212,173,107,.27); background: linear-gradient(90deg,rgba(212,173,107,.08),rgba(212,173,107,.025)); }
.quickstart-box strong { color: var(--paper-strong); font: 600 15px var(--serif); }
.quickstart-box p { margin: 5px 0 0; color: var(--muted); font-size: 10px; line-height: 1.7; }
.quickstart-box button { min-height: 44px; padding: 0 17px; border: 1px solid var(--gold); background: var(--gold); color: #111; font-size: 10px; font-weight: 700; white-space: nowrap; }
.master-module-choice { grid-template-columns: 26px 1fr !important; gap: 12px !important; align-items: center; margin-top: 14px; padding: 15px 17px; border: 1px solid var(--line); background: rgba(255,255,255,.018); cursor: pointer; }
.master-module-choice input { width: 20px !important; min-height: 20px !important; accent-color: var(--gold); }
.master-module-choice span strong,.master-module-choice span small { display: block; }
.master-module-choice span strong { color: var(--paper-strong); font: 600 13px var(--serif); }
.master-module-choice span small { margin-top: 4px; color: var(--muted); font-size: 9px; line-height: 1.6; }

.builder-fields label > span,.builder-long-field > span,.story-question label > span,.custom-specialty label > span,.runtime-state label > span { color: var(--gold) !important; font-size: 10px !important; letter-spacing: .04em !important; }
.builder-fields input,.builder-long-field textarea,.story-question textarea,.custom-specialty input { min-height: 48px !important; padding: 12px 13px !important; font-size: 13px !important; line-height: 1.65 !important; }
.builder-long-field { display: grid; gap: 8px; margin-top: 20px; }
.suggestion-row { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 10px; }
.suggestion-row::before { align-self: center; margin-right: 3px; color: var(--muted); font-size: 8px; content: "不知道怎么写？点一个："; }
.suggestion-row button { padding: 7px 10px; border: 1px solid var(--line); background: rgba(255,255,255,.018); color: #afb8ba; font-size: 9px; line-height: 1.4; cursor: pointer; }
.suggestion-row button:hover { border-color: var(--gold); color: var(--gold); }
.story-question { margin-top: 14px; padding: 20px; border: 1px solid var(--line); background: rgba(255,255,255,.015); }
.story-question:first-of-type { margin-top: 0; }
.story-question label { display: grid; gap: 9px; }
.compact-story-question { margin-top: 18px; }

.approach-presets { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 8px; }
.approach-presets button { display: grid; min-height: 112px; place-items: center; align-content: center; padding: 12px 8px; border: 1px solid var(--line); background: #0a1018; color: var(--muted); text-align: center; cursor: pointer; }
.approach-presets button:hover,.approach-presets button.selected { border-color: var(--gold); background: rgba(212,173,107,.07); }
.approach-presets button > span { display: grid; width: 34px; height: 34px; place-items: center; margin-bottom: 8px; border: 1px solid var(--line); border-radius: 50%; color: var(--gold); font: 600 13px var(--serif); }
.approach-presets button.selected > span { background: var(--gold); color: #111; }
.approach-presets strong { color: var(--paper-strong); font: 600 12px var(--serif); }
.approach-presets small { margin-top: 5px; color: var(--muted); font-size: 8px; line-height: 1.5; }
.approach-result { display: flex; justify-content: space-between; gap: 20px; align-items: center; margin-top: 20px; padding: 13px 15px; border: 1px solid var(--line); }
.approach-result strong { color: var(--paper-strong); font-size: 12px; }
.approach-result p { margin: 4px 0 0; color: var(--muted); font-size: 9px; }
.approach-result > span { color: #77c7a5; font-size: 9px; }
.approach-ranking { display: grid; gap: 7px; margin-top: 10px; }
.approach-ranking button { display: grid; grid-template-columns: 34px 1fr auto; gap: 13px; align-items: center; min-height: 65px; padding: 10px 14px; border: 1px solid var(--line); background: #090e16; color: var(--paper); text-align: left; cursor: pointer; }
.approach-ranking button:hover { border-color: rgba(212,173,107,.42); }
.approach-ranking button.pending { opacity: .6; border-style: dashed; }
.approach-ranking button > span { display: grid; width: 30px; height: 30px; place-items: center; border: 1px solid var(--line); border-radius: 50%; color: var(--gold); font-size: 9px; }
.approach-ranking strong { font: 600 13px var(--serif); }.approach-ranking strong b { color: var(--gold); }
.approach-ranking small { display: block; margin-top: 3px; color: var(--muted); font-size: 8px; }
.approach-ranking i { color: var(--muted); font: normal 8px var(--sans); }

.specialty-counter { display: flex; align-items: center; gap: 11px; margin-bottom: 12px; padding: 13px 15px; border: 1px solid var(--line); }
.specialty-counter span { color: var(--muted); font-size: 9px; }.specialty-counter strong { color: var(--gold); font: 600 16px var(--serif); }
.specialty-counter button { margin-left: auto; padding: 6px 9px; border: 1px solid var(--line); background: transparent; color: var(--muted); font-size: 8px; }
.specialty-option-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
.specialty-option-grid button { display: grid; grid-template-columns: 1fr auto; gap: 5px 10px; min-height: 75px; align-content: center; padding: 12px 14px; border: 1px solid var(--line); background: #090e16; color: var(--paper); text-align: left; cursor: pointer; }
.specialty-option-grid button strong { font: 600 12px var(--serif); }.specialty-option-grid button small { grid-column: 1; color: var(--muted); font-size: 8px; line-height: 1.5; }.specialty-option-grid button > span { grid-column: 2; grid-row: 1 / 3; align-self: center; color: var(--gold); font-size: 15px; }
.specialty-option-grid button:hover:not(:disabled),.specialty-option-grid button.selected { border-color: var(--gold); background: rgba(212,173,107,.07); }
.specialty-option-grid button:disabled { opacity: .34; cursor: not-allowed; }
.custom-specialty { display: grid; grid-template-columns: 1fr auto; gap: 9px; align-items: end; margin-top: 14px; padding: 14px; border: 1px dashed var(--line); }
.custom-specialty label { display: grid; gap: 7px; }.custom-specialty button { min-height: 48px; padding: 0 13px; border: 1px solid var(--line); background: transparent; color: var(--gold); font-size: 9px; }
.selected-specialties { display: flex; flex-wrap: wrap; gap: 8px; min-height: 40px; margin-top: 13px; }
.selected-specialties > button { padding: 8px 10px; border: 1px solid rgba(102,190,153,.4); background: rgba(102,190,153,.06); color: #a9d8c4; font-size: 9px; }.selected-specialties > button span { margin-left: 7px; }.selected-specialties p { color: var(--muted); font-size: 9px; }

.budget-meter { display: flex; justify-content: space-between; gap: 16px; align-items: center; min-height: 54px; margin: 15px 0 10px; padding: 12px 15px; border: 1px solid var(--line); background: rgba(255,255,255,.018); color: #bbc3c4; font-size: 10px; line-height: 1.6; }
.budget-meter strong { color: var(--paper-strong); font: 600 15px var(--serif); }
.budget-meter.ready { border-color: rgba(102,190,153,.34); background: rgba(102,190,153,.05); }
.budget-meter.ready strong,.budget-meter.ready b { color: #86cfaf; }
.budget-meter.warning { border-color: rgba(212,173,107,.4); background: rgba(212,173,107,.055); }
.budget-meter.invalid { border-color: rgba(207,105,91,.42); background: rgba(207,105,91,.065); }
.budget-meter.invalid strong,.budget-meter.invalid b { color: #e0a097; }
.builder-inline-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 11px; }
.builder-inline-actions button,.resource-catalog-toolbar button { min-height: 38px; padding: 0 12px; border: 1px solid var(--line); background: transparent; color: var(--muted); font-size: 9px; cursor: pointer; }
.builder-inline-actions button:hover,.resource-catalog-toolbar button:hover { border-color: var(--gold); color: var(--gold); }
.builder-inline-actions small { margin-left: auto; color: var(--muted); font-size: 8px; line-height: 1.6; }

.attribute-point-grid { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); gap: 8px; }
.attribute-point-card { display: grid; min-width: 0; padding: 13px 10px; border: 1px solid var(--line); background: #090e16; text-align: center; }
.attribute-point-card > span { color: var(--gold); font: 600 12px var(--serif); }
.attribute-point-card > small { min-height: 34px; margin-top: 5px; color: var(--muted); font-size: 7px; line-height: 1.45; }
.attribute-controls { display: grid; grid-template-columns: 30px 1fr 30px; gap: 4px; align-items: center; margin-top: 10px; }
.attribute-controls button { width: 30px; height: 34px; border: 1px solid var(--line); background: transparent; color: var(--gold); cursor: pointer; }
.attribute-controls input { min-width: 0; min-height: 34px !important; padding: 4px !important; text-align: center; }
.attribute-point-card > b { margin-top: 8px; color: var(--paper-strong); font-size: 10px; }
.attribute-point-card > i { margin-top: 4px; color: var(--muted); font: normal 7px var(--sans); }

.skill-training-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
.skill-training-card { display: grid; grid-template-columns: 1fr 118px; gap: 12px; align-items: center; min-height: 82px; padding: 12px 14px; border: 1px solid var(--line); background: #090e16; }
.skill-training-card strong { color: var(--paper-strong); font: 600 12px var(--serif); }
.skill-training-card small { display: block; margin-top: 5px; color: var(--muted); font-size: 8px; line-height: 1.55; }
.skill-training-card select { min-height: 38px !important; padding: 7px 8px !important; }

.identity-resource-panel { display: grid; gap: 14px; }
.identity-resource-panel + .identity-resource-panel { margin-top: 20px; }
.resource-section-heading { padding: 15px 17px; border-left: 2px solid var(--gold); background: rgba(212,173,107,.055); }
.resource-section-heading span { color: var(--gold); font-size: 8px; letter-spacing: .16em; }
.resource-section-heading h5 { margin: 6px 0 0; color: var(--paper-strong); font: 600 18px var(--serif); }
.resource-section-heading p { margin: 6px 0 0; color: var(--muted); font-size: 9px; line-height: 1.7; }
.lineage-choice-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 7px; }
.lineage-choice-grid button { min-height: 52px; padding: 9px 11px; border: 1px solid var(--line); background: #090e16; color: #b8c0c2; text-align: left; cursor: pointer; }
.lineage-choice-grid button strong,.lineage-choice-grid button small { display: block; }
.lineage-choice-grid button strong { color: var(--paper-strong); font: 600 11px var(--serif); }
.lineage-choice-grid button small { margin-top: 3px; color: var(--muted); font-size: 7px; }
.lineage-choice-grid button.selected { border-color: var(--gold); background: rgba(212,173,107,.07); }
.resource-catalog-toolbar { display: flex; justify-content: space-between; gap: 12px; align-items: end; }
.resource-catalog-toolbar label { width: min(360px,100%); }
.resource-catalog { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px; max-height: 560px; overflow: auto; padding-right: 4px; }
.resource-catalog-card { display: grid; grid-template-columns: 1fr auto; gap: 8px; min-height: 104px; padding: 13px; border: 1px solid var(--line); background: #090e16; color: var(--paper); text-align: left; cursor: pointer; }
.resource-catalog-card:hover,.resource-catalog-card.selected { border-color: var(--gold); background: rgba(212,173,107,.055); }
.resource-catalog-card strong { color: var(--paper-strong); font: 600 12px var(--serif); }
.resource-catalog-card em { color: var(--gold); font: normal 8px var(--sans); }
.resource-catalog-card p { grid-column: 1 / -1; margin: 0; color: var(--muted); font-size: 8px; line-height: 1.65; }
.resource-catalog-card span { align-self: start; color: var(--gold); font-size: 14px; }
.selected-resource-list { display: grid; gap: 6px; }
.selected-resource-list > article { display: grid; grid-template-columns: 1fr auto; gap: 7px; align-items: center; padding: 10px 12px; border: 1px solid rgba(102,190,153,.26); background: rgba(102,190,153,.035); }
.selected-resource-list strong { color: #bfe3d4; font-size: 10px; }
.selected-resource-list small { display: block; margin-top: 3px; color: var(--muted); font-size: 8px; }
.selected-resource-list button { border: 0; background: transparent; color: #e0a097; cursor: pointer; }
.resource-warning { min-height: 18px; margin: 0; color: #d6b77d; font-size: 9px; line-height: 1.6; }
.class-trait-card { padding: 14px 16px; border: 1px solid rgba(212,173,107,.32); background: rgba(212,173,107,.045); color: #b9c1c2; font-size: 9px; line-height: 1.75; }
.class-trait-card strong { display: block; margin-bottom: 4px; color: var(--paper-strong); font: 600 13px var(--serif); }
.retained-skill-list { display: grid; gap: 8px; }
.retained-skill-row { display: grid; grid-template-columns: minmax(170px,.65fr) 110px minmax(0,1.35fr); gap: 8px; align-items: start; padding: 12px; border: 1px solid var(--line); background: #090e16; }
.retained-skill-row label > span { font-size: 8px !important; }
.noble-phantasm-card { display: grid; gap: 10px; padding: 15px; border: 1px solid rgba(212,173,107,.35); background: rgba(212,173,107,.035); }
.master-contract-panel { margin-top: 25px !important; padding-top: 25px; border-top: 1px solid var(--line); }

.review-stat-table { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 6px; }
.review-stat-table span { display: flex; justify-content: space-between; gap: 8px; padding: 7px 8px; border: 1px solid var(--line); color: var(--muted); font-size: 8px; }
.review-stat-table b { color: var(--paper-strong); }
.builder-checklist .warning { border-color: rgba(212,173,107,.4); }
.builder-checklist .warning > span,.builder-checklist .warning small { color: #d6b77d; }

.builder-review { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }
.builder-review article { min-height: 230px; padding: 20px; border: 1px solid var(--line); background: #0a1018; }
.builder-review article > p { margin: 0; color: var(--gold); font-size: 7px; letter-spacing: .15em; }
.builder-review h5 { margin: 0 0 15px; color: var(--paper-strong); font: 600 16px var(--serif); }.builder-review .review-identity h5 { margin: 7px 0 5px; font-size: 24px; }.builder-review .review-identity > strong,.builder-review .review-identity > small { display: block; }.builder-review .review-identity > strong { color: var(--gold); }.builder-review .review-identity > small { margin-top: 5px; color: var(--muted); }.builder-review blockquote { margin: 20px 0 0; padding-left: 12px; border-left: 1px solid var(--gold); color: #b9c0c1; font: 400 11px/1.8 var(--serif); }
.builder-review dl { margin: 0; }.builder-review dl div { padding: 10px 0; border-top: 1px solid var(--line); }.builder-review dt { color: var(--gold); font-size: 8px; }.builder-review dd { margin: 5px 0 0; color: #b6bec0; font-size: 9px; line-height: 1.65; }
.review-chips { display: flex; flex-wrap: wrap; gap: 6px; }.review-chips span { padding: 6px 8px; border: 1px solid var(--line); color: #bdc5c6; font-size: 8px; }.review-chips span b { color: var(--gold); }.review-chips.specialties span { border-color: rgba(102,190,153,.28); color: #a9d8c4; }
.builder-checklist { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 7px; margin-top: 12px; }.builder-checklist > div { display: grid; grid-template-columns: 24px 1fr; gap: 8px; min-height: 65px; align-content: center; padding: 10px; border: 1px solid var(--line); }.builder-checklist > div > span { grid-row: 1 / 3; display: grid; width: 22px; height: 22px; place-items: center; border: 1px solid var(--line); border-radius: 50%; }.builder-checklist strong { font-size: 8px; }.builder-checklist small { color: var(--muted); font-size: 7px; }.builder-checklist .ready { border-color: rgba(102,190,153,.28); }.builder-checklist .ready > span,.builder-checklist .ready small { color: #77c7a5; }.builder-checklist .missing { border-color: rgba(207,105,91,.35); }.builder-checklist .missing > span,.builder-checklist .missing small { color: #e0a097; }
.runtime-state { margin-top: 14px; padding: 0 16px 16px; border: 1px solid var(--line); }.runtime-state summary { padding: 14px 0; color: var(--muted); font-size: 9px; cursor: pointer; }.runtime-state > p { color: var(--muted); font-size: 9px; }.runtime-state > label { display: grid; gap: 7px; margin-top: 10px; }
.final-actions { margin-top: 14px; }.final-actions button:disabled { opacity: .4; cursor: not-allowed; }
.builder-navigation { display: grid; grid-template-columns: 1fr auto 1fr; gap: 20px; align-items: center; min-height: 78px; padding: 14px 18px; border-top: 1px solid var(--line); background: #0b111a; }.builder-navigation > button { min-height: 43px; justify-self: start; padding: 0 15px; border: 1px solid var(--line); background: transparent; color: var(--muted-strong); font-size: 9px; }.builder-navigation > button:last-child { justify-self: end; border-color: var(--gold); background: var(--gold); color: #111; }.builder-navigation > button:disabled { opacity: .35; cursor: not-allowed; }.builder-navigation p { margin: 0; text-align: center; }.builder-navigation p span,.builder-navigation p small { display: block; }.builder-navigation p span { color: var(--paper-strong); font-size: 9px; }.builder-navigation p small { margin-top: 4px; color: var(--muted); font-size: 7px; }

@media(max-width:980px){.player-tools-grid{grid-template-columns:1fr}.character-editor,.result-inbox-card{grid-column:1;grid-row:auto}.approach-inputs{grid-template-columns:repeat(5,1fr)}}
@media(max-width:980px){.builder-progress{grid-template-columns:repeat(3,1fr)}.builder-progress button{border-bottom:1px solid var(--line)}.archetype-grid{grid-template-columns:1fr}.approach-presets{grid-template-columns:repeat(3,1fr)}.attribute-point-grid{grid-template-columns:repeat(4,1fr)}.skill-training-grid{grid-template-columns:repeat(2,1fr)}.builder-review{grid-template-columns:1fr}.builder-checklist{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.player-tools{padding:30px 14px 86px}body.builder-mode .player-tools{padding:82px 10px 70px}.player-tools-heading{align-items:flex-start;flex-direction:column}.player-tools-heading>span{text-align:left}.player-form-grid.two-columns,.player-form-grid.three-columns{grid-template-columns:1fr}.approach-inputs{grid-template-columns:repeat(5,minmax(48px,1fr));overflow-x:auto}.player-character-actions{display:grid;grid-template-columns:1fr}.player-result-item{grid-template-columns:82px 1fr;padding:13px 12px}.player-result-time{grid-column:2}.resource-fields{grid-template-columns:repeat(3,1fr)!important}.builder-progress{display:flex;overflow-x:auto}.builder-progress button{min-width:160px}.builder-assurance{grid-template-columns:32px 1fr;margin:12px 12px 0}.builder-assurance>b{grid-column:2}.builder-step{padding:25px 14px}.quickstart-box,.approach-result,.resource-catalog-toolbar{align-items:flex-start;flex-direction:column}.quickstart-box button,.resource-catalog-toolbar label,.resource-catalog-toolbar button{width:100%}.approach-presets,.lineage-choice-grid{grid-template-columns:repeat(2,1fr)}.attribute-point-grid{grid-template-columns:repeat(2,1fr)}.skill-training-grid,.resource-catalog{grid-template-columns:1fr}.retained-skill-row{grid-template-columns:1fr}.specialty-option-grid{grid-template-columns:1fr}.custom-specialty{grid-template-columns:1fr}.builder-inline-actions small{width:100%;margin-left:0}.builder-checklist{grid-template-columns:1fr}.builder-navigation{grid-template-columns:1fr 1fr}.builder-navigation p{grid-column:1/-1;grid-row:1}.builder-navigation>button{grid-row:2}.suggestion-row button{width:100%;text-align:left}.resource-fields{grid-template-columns:1fr!important}}

/* PLAYER CLUE JOURNAL START — local-only; deliberately separate from projection/map styles. */
.clue-journal-view { min-height:calc(100vh - 64px); padding:clamp(24px,4vw,54px); background:radial-gradient(circle at 82% 0,rgba(74,92,80,.2),transparent 42%),linear-gradient(180deg,#0b1119,#070b11); }
.clue-journal-heading { width:min(1500px,100%); display:flex; justify-content:space-between; gap:28px; align-items:end; margin:0 auto 18px; }
.clue-journal-heading p,.clue-journal-form header span,.clue-journal-records > header span { margin:0 0 7px; color:#78bfa2; font-size:8px; letter-spacing:.18em; }
.clue-journal-heading h1 { margin:0; color:var(--paper-strong); font:700 clamp(30px,4.5vw,52px)/1.25 var(--serif); }
.clue-journal-heading > div > span { display:block; max-width:760px; margin-top:9px; color:#aeb6b7; font:400 10px/1.8 var(--serif); }
.clue-journal-toolbar { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px; }
.clue-journal-toolbar button,.clue-journal-form footer button,.clue-journal-entry-actions button { min-height:38px; padding:0 13px; border:1px solid var(--line); background:#0b121b; color:#b8c1c1; font-size:8px; cursor:pointer; }
.clue-journal-toolbar button:hover,.clue-journal-toolbar button:focus-visible,.clue-journal-form footer button:hover,.clue-journal-entry-actions button:hover { border-color:var(--gold); color:var(--paper-strong); }
.clue-journal-workspace { width:min(1500px,100%); display:grid; gap:16px; margin:0 auto; }
.clue-journal-form,.clue-journal-records { border:1px solid var(--line); background:var(--surface); }
.clue-journal-form > header,.clue-journal-records > header { min-height:75px; display:flex; justify-content:space-between; gap:20px; align-items:center; padding:15px 18px; border-bottom:1px solid var(--line); }
.clue-journal-form h2,.clue-journal-records h2 { margin:0; color:var(--paper-strong); font:600 20px/1.35 var(--serif); }
.clue-journal-form > header small { max-width:340px; color:var(--muted); font-size:8px; line-height:1.6; text-align:right; }
.clue-journal-form-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); }
.clue-journal-form-grid label { min-width:0; display:grid; grid-template-rows:auto 1fr; gap:8px; padding:16px; border-right:1px solid var(--line); }
.clue-journal-form-grid label:last-child { border-right:0; }
.clue-journal-form-grid label > span { color:var(--gold); font-size:8px; letter-spacing:.08em; }
.clue-journal-form-grid textarea { width:100%; min-height:128px; padding:11px 12px; border:1px solid var(--line); border-radius:0; outline:0; background:#090e16; color:var(--paper-strong); font:400 10px/1.7 var(--sans); resize:vertical; }
.clue-journal-form-grid textarea:focus { border-color:#78bfa2; box-shadow:0 0 0 2px rgba(120,191,162,.09); }
.clue-journal-form > footer { min-height:64px; display:flex; justify-content:space-between; gap:18px; align-items:center; padding:11px 16px; border-top:1px solid var(--line); }
.clue-journal-form > footer p { margin:0; color:var(--muted); font-size:8px; line-height:1.6; }
.clue-journal-form > footer p.error { color:#e0a097; }
.clue-journal-form > footer > div { display:flex; gap:8px; }
.clue-journal-form footer .clue-journal-primary { border-color:#78bfa2; background:#78bfa2; color:#08110d; font-weight:700; }
.clue-journal-records > header strong { color:#78bfa2; font:600 13px/1 var(--serif); }
.clue-journal-list { display:grid; gap:10px; padding:14px; }
.clue-journal-empty { margin:0; padding:34px 20px; border:1px dashed var(--line); color:var(--muted); font:400 10px/1.8 var(--serif); text-align:center; }
.clue-journal-entry { border:1px solid var(--line); background:#0a1018; }
.clue-journal-entry > header { min-height:43px; display:flex; justify-content:space-between; gap:16px; align-items:center; padding:9px 12px; border-bottom:1px solid var(--line); }
.clue-journal-entry > header strong { color:#9ccdb9; font:600 10px/1 var(--serif); }
.clue-journal-entry > header time { color:var(--muted); font-size:7px; }
.clue-journal-entry-fields { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); margin:0; }
.clue-journal-entry-fields > div { min-width:0; min-height:130px; padding:14px; border-right:1px solid var(--line); }
.clue-journal-entry-fields > div:last-child { border-right:0; }
.clue-journal-entry-fields dt { color:var(--gold); font-size:7px; letter-spacing:.08em; }
.clue-journal-entry-fields dd { margin:9px 0 0; color:#bdc5c5; font:400 10px/1.78 var(--serif); white-space:pre-wrap; overflow-wrap:anywhere; }
.clue-journal-entry-fields dd.clue-journal-blank { color:#626e75; font-style:italic; }
.clue-journal-entry-actions { display:flex; justify-content:flex-end; gap:8px; padding:9px 11px; border-top:1px solid var(--line); }
.clue-journal-entry-actions button[data-action="delete"] { color:#d79c92; }
body.clue-journal-open .player-tools { display:none; }
@media(max-width:1080px){.clue-journal-form-grid,.clue-journal-entry-fields{grid-template-columns:repeat(2,minmax(0,1fr))}.clue-journal-form-grid label:nth-child(2){border-right:0}.clue-journal-form-grid label:nth-child(-n+2){border-bottom:1px solid var(--line)}.clue-journal-entry-fields>div:nth-child(2){border-right:0}.clue-journal-entry-fields>div:nth-child(-n+2){border-bottom:1px solid var(--line)}}
@media(max-width:700px){.clue-journal-view{padding:22px 10px 70px}.clue-journal-heading{align-items:flex-start;flex-direction:column}.clue-journal-toolbar{width:100%;justify-content:stretch}.clue-journal-toolbar button{flex:1}.clue-journal-form>header,.clue-journal-records>header{align-items:flex-start}.clue-journal-form>header small{display:none}.clue-journal-form-grid,.clue-journal-entry-fields{grid-template-columns:1fr}.clue-journal-form-grid label,.clue-journal-form-grid label:nth-child(2),.clue-journal-entry-fields>div,.clue-journal-entry-fields>div:nth-child(2){border-right:0;border-bottom:1px solid var(--line)}.clue-journal-form-grid label:last-child,.clue-journal-entry-fields>div:last-child{border-bottom:0}.clue-journal-form>footer{align-items:flex-start;flex-direction:column}.clue-journal-form>footer>div{width:100%}.clue-journal-form>footer button{flex:1}.clue-journal-entry-fields>div{min-height:0}.clue-journal-entry>header{align-items:flex-start;flex-direction:column}.player-view-tabs{max-width:190px;overflow-x:auto}.player-view-tabs button{flex:0 0 auto;padding:0 8px}}
/* PLAYER CLUE JOURNAL END */

/* Online room connection and all-member chat. */
.player-header { grid-template-columns:auto 1fr auto auto; }
.room-connection-status { min-height:30px; display:inline-flex; align-items:center; padding:2px 9px; border:1px solid rgba(212,173,107,.28); color:var(--gold-soft); font-size:11px; white-space:nowrap; }
.room-connection-status.state-online { border-color:rgba(102,190,153,.45); color:#a8ddc6; }.room-connection-status.state-offline,.room-connection-status.state-failed { border-color:rgba(220,98,105,.52); color:#efaaad; }
.campaign-chat-shell { position:fixed; z-index:190; right:max(16px,env(safe-area-inset-right)); bottom:max(16px,env(safe-area-inset-bottom)); font-family:var(--sans); }
.campaign-chat-toggle { min-height:46px; display:flex; gap:9px; align-items:center; margin-left:auto; padding:0 14px; border:1px solid var(--line-strong); background:#111925; color:var(--paper-strong); box-shadow:0 14px 38px rgba(0,0,0,.4); cursor:pointer; }.campaign-chat-toggle b { min-width:19px;height:19px;display:grid;place-items:center;border-radius:50%;background:#a94b50;color:#fff;font-size:10px }
.campaign-chat-panel { width:min(410px,calc(100vw - 24px)); height:min(620px,calc(100svh - 90px)); display:grid; grid-template-rows:auto auto 1fr auto; margin-bottom:8px; border:1px solid var(--line-strong); background:#0a1018; box-shadow:0 24px 75px rgba(0,0,0,.62); }.campaign-chat-panel[hidden]{display:none}
.campaign-chat-panel>header{min-height:66px;display:grid;grid-template-columns:1fr auto auto;gap:10px;align-items:center;padding:11px 13px;border-bottom:1px solid var(--line);background:#101824}.campaign-chat-panel>header small,.campaign-chat-panel>header strong{display:block}.campaign-chat-panel>header small{color:var(--gold);font-size:10px;letter-spacing:.12em}.campaign-chat-panel>header strong{margin-top:3px;color:var(--paper-strong);font:600 16px var(--serif)}.campaign-chat-panel>header>span{color:var(--muted);font-size:11px}.campaign-chat-panel>header button{width:44px;min-width:44px;height:44px;border:0;background:transparent;color:var(--muted);font-size:20px;cursor:pointer}
.campaign-chat-earlier{min-height:40px;border:0;border-bottom:1px solid var(--line);background:#0c131d;color:var(--muted);font-size:11px;cursor:pointer}.campaign-chat-messages{min-height:0;display:flex;flex-direction:column;gap:8px;overflow:auto;margin:0;padding:12px;list-style:none}.campaign-chat-messages li{position:relative;padding:10px 11px;border:1px solid var(--line);background:#0e1620}.campaign-chat-messages li>header{display:flex;justify-content:space-between;gap:12px}.campaign-chat-messages li strong{color:var(--gold-soft);font-size:12px}.campaign-chat-messages li time{color:var(--muted);font-size:10px}.campaign-chat-messages li p{margin:7px 0 0;color:#c8cdca;font-size:13px!important;line-height:1.7;white-space:pre-wrap;overflow-wrap:anywhere}.campaign-chat-messages li.deleted p{color:#737e83;font-style:italic}.campaign-chat-empty{color:var(--muted);text-align:center}
.campaign-chat-panel form{padding:10px;border-top:1px solid var(--line);background:#0d141e}.campaign-chat-panel textarea{width:100%;min-height:66px;padding:9px 10px;border:1px solid var(--line);border-radius:0;outline:0;resize:none;background:#070c12;color:var(--paper-strong);font:400 13px/1.55 var(--sans)}.campaign-chat-panel textarea:focus{border-color:var(--gold)}.campaign-chat-panel form footer{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-top:7px}.campaign-chat-panel form footer small{color:var(--muted);font-size:10px}.campaign-chat-panel form footer button{min-height:40px;padding:0 15px;border:1px solid var(--gold);background:var(--gold);color:#15120c;font-size:12px;font-weight:700;cursor:pointer}.campaign-chat-panel form>p{margin:7px 0 0;color:#efaaad;font-size:11px!important}body.room-offline .campaign-chat-toggle{border-color:rgba(220,98,105,.5)}
@media(max-width:900px){.player-header .room-connection-status{position:fixed;z-index:21;top:70px;right:8px;background:rgba(7,11,17,.94)}}
@media(max-width:760px){.campaign-chat-shell{right:8px;bottom:8px}.campaign-chat-panel{height:min(570px,calc(100svh - 85px))}}
@media(max-width:760px){.player-live-state{grid-template-columns:1fr}.player-live-state ul{grid-template-columns:1fr}}