html,body{height:100%}body{background:var(--app-bg);overflow:hidden}canvas.pixel{image-rendering:pixelated;display:block}#app{height:100vh;width:100vw;overflow:hidden;position:relative}.screen{position:absolute;inset:0;overflow:auto;display:none}.screen.is-active{display:block}.screen__scroll{min-height:100%}.appbar{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:14px;padding:12px 28px;background:var(--ink-800);border-bottom:2px solid #000}.brand{font-family:var(--font-pixel);font-size:18px;color:var(--parchment-50);display:flex;align-items:center;gap:8px}.brand small{font-family:var(--font-pixel-sm);font-size:10px;color:var(--parchment-200);letter-spacing:.1em}.wrap{max-width:1100px;margin:0 auto;padding:32px 28px 80px}.wrap--wide{max-width:1280px}.page-kicker{font-family:var(--font-pixel-sm);font-size:12px;color:var(--parchment-200);letter-spacing:.08em}.page-title{font-family:var(--font-pixel);font-size:28px;color:var(--parchment-50);margin:6px 0 4px}.page-lead{color:#c9bcd0;max-width:720px;margin:0 0 24px;font-size:15px}.filters{display:flex;flex-wrap:wrap;gap:20px;margin-bottom:24px}.filter-group{display:flex;align-items:center;gap:8px}.filter-group>.ds-label{margin:0;color:var(--parchment-200)}.chip{font-family:var(--font-pixel-sm);font-size:12px;cursor:pointer;padding:6px 11px;border:2px solid var(--ink-950);border-radius:3px;background:var(--parchment-50);color:var(--ink-950);-webkit-user-select:none;user-select:none}.chip:hover{background:var(--parchment-100)}.chip.is-on{background:var(--mana-400);border-color:var(--mana-700)}.scn-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.scn-card{cursor:pointer;transition:transform .08s}.scn-card:hover{transform:translate(-1px,-1px)}.scn-card.is-dim{opacity:.32;filter:grayscale(.6);pointer-events:none}.scn-cover{width:100%;height:150px;object-fit:cover;border-bottom:2px solid #000;background:var(--moss-800)}.scn-cover canvas{width:100%;height:100%}.seg{display:inline-flex;border:2px solid var(--ink-950);border-radius:4px;overflow:hidden;box-shadow:var(--pixel-shadow-sm)}.seg button{font-family:var(--font-pixel-sm);font-size:13px;cursor:pointer;padding:9px 16px;border:0;border-right:2px solid var(--ink-950);background:var(--parchment-50);color:var(--ink-950)}.seg button:last-child{border-right:0}.seg button.is-on{background:var(--ember-500);color:var(--parchment-50)}.seg button:not(.is-on):hover{background:var(--parchment-100)}.persona-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.persona{cursor:pointer}.persona.is-on{border-color:var(--mana-700);box-shadow:4px 4px 0 var(--mana-700)}.persona.is-on .pp__title{background:var(--mana-400);border-bottom-color:var(--mana-700)}:where(.btn,.chip,.seg button,.arch,.persona,[role=button]):focus-visible{outline:3px solid var(--mana-400);outline-offset:2px}.field{width:100%;font-family:var(--font-body);font-size:15px;padding:10px 12px;border:2px solid #000;border-radius:4px;background:#fff}.field:focus-visible{outline:3px solid var(--mana-400);outline-offset:2px}.copybox{display:flex;gap:8px;align-items:stretch}.copybox .field{font-family:var(--font-mono);font-size:13px;background:var(--parchment-50)}.arch-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.arch{cursor:pointer;text-align:center}.arch.is-on{border-color:var(--mana-700);box-shadow:4px 4px 0 var(--mana-700);background:var(--parchment-50)}.arch canvas{width:48px;height:48px;margin:4px auto 2px}.arch__name{font-family:var(--font-pixel-sm);font-size:12px}.arch__role{font-size:11px;color:var(--ink-800)}.overlay{position:fixed;inset:0;background:#0a070ea8;z-index:40;display:none;align-items:center;justify-content:center;padding:24px}.overlay.is-open{display:flex}.modal{width:640px;max-width:100%;max-height:92vh;overflow:auto}.drawer-wrap{position:fixed;inset:0;z-index:45;display:none}.drawer-wrap.is-open{display:block}.drawer-scrim{position:absolute;inset:0;background:#0a070e80}.drawer{position:absolute;top:0;right:0;height:100%;width:380px;max-width:92vw;background:var(--panel-bg);border-left:3px solid #000;box-shadow:-8px 0 0 var(--panel-shadow);transform:translate(100%);transition:transform .22s ease;overflow:auto}.drawer-wrap.is-open .drawer{transform:translate(0)}#screen-game{background:var(--app-bg)}.table-shell{height:100vh;display:flex;flex-direction:column;padding:10px;gap:10px}.t-header{flex:0 0 auto}.t-grid{flex:1 1 auto;min-height:0;overflow:hidden;display:grid;gap:10px;grid-template-columns:232px 1fr 286px;grid-template-rows:1fr auto;grid-template-areas:"left center right" "players players players"}.t-left{grid-area:left;display:flex;flex-direction:column;gap:10px;min-height:0}.t-center{grid-area:center;display:flex;flex-direction:column;gap:10px;min-width:0;min-height:0}.t-right{grid-area:right;display:flex;flex-direction:column;gap:10px;min-height:0}.t-players{grid-area:players}.gm-bar{display:flex;align-items:center;gap:12px;padding:8px 12px;flex-wrap:wrap}.gm-bar .spacer{margin-left:auto}.scene-pp{padding:0;overflow:hidden;box-shadow:var(--pixel-shadow);flex:1 1 auto;min-height:150px}.scene-frame{position:relative;width:100%;height:100%;background:var(--moss-800)}.scene-frame canvas{width:100%;height:100%;object-fit:cover;display:block}.scene-overlay{position:absolute;left:10px;right:10px;bottom:10px}.scene-meta{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;padding:8px 12px;align-items:center}.scene-meta b{font-family:var(--font-pixel-sm)}.known-fact{display:none}.known-fact.is-on{display:flex;align-items:center;gap:6px}.gm-panel{flex:0 0 auto}.gm-row{display:flex;gap:12px}.gm-avatar{flex:0 0 56px;display:flex;flex-direction:column;align-items:center;gap:5px}.gm-avatar canvas{width:56px;height:56px;border:2px solid #000;border-radius:3px}.gm-speech{flex:1;min-width:0;box-shadow:none;font-size:15px}.npc-line{margin-top:8px;padding:8px 12px;background:var(--ink-950);border:2px solid #000;border-radius:4px;color:var(--parchment-100);font-size:14px;display:flex;gap:8px;align-items:flex-start}.npc-line .npc-name{color:var(--mana-400);font-family:var(--font-pixel-sm);font-size:11px;white-space:nowrap;padding-top:2px}.action-bar{flex:0 0 auto}.suggestions{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}.action-input-row{display:flex;gap:8px}.action-input-row .btn{flex:0 0 auto;white-space:nowrap}.dice-row{display:flex;gap:6px;margin-bottom:8px}.pending-roll{display:none}.pending-roll.is-on{display:block}.roll-result{display:none}.roll-result.is-on{display:block}.dice-stage{display:flex;align-items:center;gap:10px}.dice-stage canvas{width:54px;height:54px}.log-body{display:flex;flex-direction:column;gap:6px;font-size:12px;overflow:auto}.log-item{justify-content:flex-start;gap:6px;align-items:flex-start}.log-item .badge{flex:0 0 auto}@keyframes logIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}.log-item.is-new{animation:logIn .25s ease-out both}.players-row{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.pcard .pp__body{padding:9px}.mini-char{display:flex;gap:8px;align-items:center}.mini-char canvas{width:42px;height:42px;flex:0 0 42px;border:2px solid #000;border-radius:3px}.mini-meters{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}.mini-meters .nm{font-family:var(--font-pixel-sm);font-size:12px;display:flex;align-items:center;gap:5px}.pcard-actions{display:flex;gap:5px;margin-top:7px;flex-wrap:wrap}.thinking{display:none;align-items:center;gap:8px;font-family:var(--font-pixel-sm);color:var(--parchment-100)}.thinking.is-on{display:flex}.safety-banner{display:none}.safety-banner.is-on{display:flex}.toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%) translateY(20px);background:var(--ink-800);color:var(--parchment-50);border:2px solid #000;box-shadow:var(--pixel-shadow);font-family:var(--font-pixel-sm);font-size:13px;padding:10px 16px;border-radius:4px;z-index:80;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s}.toast.is-on{opacity:1;transform:translate(-50%) translateY(0)}.asset-credits-trigger{position:fixed;top:14px;right:14px;z-index:30}.runtime-status{position:fixed;top:14px;right:104px;z-index:30;max-width:min(42vw,220px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border:2px solid #000;border-radius:3px;box-shadow:var(--pixel-shadow-sm);padding:6px 10px;background:var(--parchment-50);color:var(--ink-950);font-family:var(--font-pixel-sm);font-size:11px}.runtime-status--ok{background:var(--success-600);color:var(--parchment-50)}.runtime-status--checking{background:var(--mana-400)}.runtime-status--degraded{background:var(--ember-500);color:var(--parchment-50)}.runtime-status--offline{background:var(--danger-600);color:var(--parchment-50)}.runtime-status--demo{background:var(--parchment-100)}.asset-credits-scrim{border:0;padding:0;cursor:default}.asset-credits-drawer .pp__title{display:flex;align-items:center;justify-content:space-between;gap:10px}.credit-summary{display:flex;flex-wrap:wrap;gap:6px}.asset-credit-list{display:flex;flex-direction:column;gap:8px}.asset-credit-item{border:2px solid var(--ink-950);border-radius:4px;background:var(--parchment-50);padding:9px;box-shadow:var(--pixel-shadow-sm)}.asset-credit-main{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.asset-credit-main a{color:var(--ink-950);font-family:var(--font-pixel-sm);font-size:12px}.asset-credit-item p{margin:6px 0;font-size:12px}.asset-gate-panel{border:2px solid var(--ink-950);border-radius:4px;background:var(--parchment-100);padding:10px}.asset-gate-panel h3{margin:0 0 6px;font-family:var(--font-pixel-sm);font-size:13px}.asset-gate-panel ul{display:flex;flex-direction:column;gap:6px;list-style:none;margin:8px 0 0;padding:0}.asset-gate-panel li{display:flex;justify-content:space-between;gap:8px;align-items:flex-start;font-size:12px}.flow-steps{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.muted{color:var(--ink-800)}.stack{display:flex;flex-direction:column;gap:10px}.two-col{display:grid;grid-template-columns:1.1fr .9fr;gap:18px;align-items:start}.detail-cover{width:100%;height:220px;border:2px solid #000;border-radius:4px;overflow:hidden;box-shadow:var(--pixel-shadow)}.detail-cover canvas{width:100%;height:100%}.warnbox{display:flex;gap:8px;align-items:flex-start;font-size:14px}@media(max-width:1080px){body{overflow:auto}#app{height:auto;min-height:100vh}.screen{position:relative;overflow:visible}.table-shell{height:auto;min-height:100vh}.t-grid{grid-template-columns:1fr;grid-template-rows:none;grid-template-areas:"center" "left" "right" "players"}.scn-grid,.persona-grid{grid-template-columns:1fr}.arch-grid{grid-template-columns:repeat(2,1fr)}.two-col{grid-template-columns:1fr}.mobile-hint{display:block!important}}.mobile-hint{display:none}