.shell{display:grid;grid-template-columns:300px 1fr;min-height:100vh;min-height:100dvh;background:var(--color-paper-50)}.shell :focus-visible{outline:2px solid var(--color-focus-ring);outline-offset:2px;border-radius:var(--radius-small)}.sidebar{background:var(--color-petrol-900);color:var(--color-ink-700);border-right:1px solid var(--color-border-subtle);overflow-y:auto;height:100vh;height:100dvh;position:sticky;top:0}.brand{padding:var(--space-24) var(--space-20) var(--space-16);border-bottom:1px solid var(--color-border-subtle)}.brandEyebrow{font-family:var(--font-ui);font-size:var(--text-caption);font-weight:var(--weight-semibold);letter-spacing:.08em;text-transform:uppercase;color:var(--color-aqua-500);margin:0 0 var(--space-4)}.brandName{font-family:var(--font-display);font-weight:var(--weight-display);font-size:var(--text-h2);line-height:var(--leading-tight);color:var(--color-ink-900);margin:0}.brandSub{margin:var(--space-4) 0 0;font-size:var(--text-caption);color:var(--color-ink-700)}.roles{padding:var(--space-16) var(--space-16) var(--space-8)}.rolesLabel{font-family:var(--font-ui);font-size:var(--text-caption);font-weight:var(--weight-semibold);letter-spacing:.14em;text-transform:uppercase;color:var(--color-ink-700);margin:0 0 var(--space-8)}.roleBtns{display:grid;grid-template-columns:1fr 1fr 1fr;gap:var(--space-8)}.roleBtn{background:var(--color-surface);border:1px solid var(--color-border-subtle);color:var(--color-ink-700);border-radius:var(--radius-medium);padding:var(--space-8) var(--space-4);font-family:var(--font-ui);font-size:var(--text-secondary);font-weight:var(--weight-semibold);line-height:var(--leading-snug);cursor:pointer;text-align:center;min-height:44px;transition:background .18s,border-color .18s,color .18s}.roleBtn:hover:not(:disabled){border-color:var(--color-border-default)}.roleBtn:disabled{cursor:default;opacity:.6}.roleBtnActive{background:var(--color-teal-500);border-color:var(--color-teal-500);color:var(--color-on-teal-fill)}.identityCard{margin:0 var(--space-16) var(--space-16);padding:var(--space-12);background:var(--color-teal-100);border:1px solid var(--color-teal-600);border-radius:var(--radius-medium);font-size:var(--text-caption);line-height:var(--leading-normal)}.identityName{color:var(--color-ink-900);font-weight:var(--weight-semibold);font-size:var(--text-secondary);margin:0 0 2px}.identityMeta{color:var(--color-ink-700);margin:0}.rolesHint{line-height:var(--leading-normal)}.clearRoleFilter,.rolesHint{color:var(--color-ink-700);font-size:var(--text-caption);margin:0 var(--space-16) var(--space-16)}.clearRoleFilter{display:block;width:calc(100% - var(--space-16) * 2);padding:var(--space-8) 0;background:none;border:none;border-top:1px solid var(--color-border-subtle);font-family:var(--font-ui);text-align:left;cursor:pointer}.clearRoleFilter:hover{color:var(--color-ink-900)}.identityError{margin:0 var(--space-16) var(--space-16);padding:var(--space-12);background:rgba(239,68,68,.12);border:1px solid var(--color-error-600);border-radius:var(--radius-medium);color:var(--color-error-text);font-size:var(--text-caption)}.nav{padding:var(--space-8) var(--space-8) var(--space-40)}.navGroup{margin-top:var(--space-16)}.navGroupLabel{display:flex;align-items:center;gap:var(--space-8);font-family:var(--font-ui);font-size:var(--text-caption);font-weight:var(--weight-semibold);letter-spacing:.14em;text-transform:uppercase;color:var(--color-aqua-500);padding:var(--space-8) var(--space-8) var(--space-4);margin:0}.navGroupLabel:after{content:"";flex:1 1;height:1px;background:var(--color-border-subtle)}.navItem{display:block;width:100%;text-align:left;background:none;border:0;color:var(--color-ink-700);cursor:pointer;padding:var(--space-8) var(--space-12);border-radius:var(--radius-small);font-family:var(--font-ui);font-size:var(--text-secondary);font-weight:var(--weight-regular);line-height:var(--leading-snug);min-height:44px}.navItem:hover{background:rgba(255,255,255,.06);color:var(--color-ink-900)}.navItemActive{background:rgba(20,184,166,.16);color:var(--color-ink-900);box-shadow:inset 2px 0 0 var(--color-teal-500)}.navItemMeta{display:block;color:var(--color-ink-700);font-size:var(--text-caption);line-height:var(--leading-snug);margin-top:var(--space-4)}.navItemUnavailable{opacity:.55}.main{flex-direction:column;height:100vh;height:100dvh;overflow:hidden}.bar,.main{display:flex}.bar{align-items:center;gap:var(--space-16);padding:var(--space-12) var(--space-20);background:var(--color-surface);border-bottom:1px solid var(--color-border-subtle);flex:none}.barText{flex:1 1;min-width:0}.barTitle{display:block;font-family:var(--font-display);font-weight:var(--weight-display);color:var(--color-ink-900);font-size:var(--text-h3);line-height:var(--leading-tight);margin:0}.barRole{display:inline-block;margin-top:var(--space-4);font-size:var(--text-caption);font-weight:var(--weight-semibold);letter-spacing:.08em;text-transform:uppercase;color:var(--color-aqua-500)}.seg{display:flex;background:var(--color-surface-sunk);border:1px solid var(--color-border-subtle);border-radius:var(--radius-pill);padding:3px;flex:none}.segBtn{background:none;border:0;border-radius:var(--radius-pill);padding:var(--space-8) var(--space-16);font-family:var(--font-ui);font-size:var(--text-caption);font-weight:var(--weight-semibold);color:var(--color-ink-700);cursor:pointer;min-height:36px}.segBtnActive{background:var(--color-teal-500);color:var(--color-on-teal-fill)}.openLink{background:var(--color-surface-sunk);border:1px solid var(--color-border-default);color:var(--color-ink-900);border-radius:var(--radius-pill);padding:var(--space-8) var(--space-16);font-family:var(--font-ui);font-size:var(--text-secondary);font-weight:var(--weight-semibold);text-decoration:none;white-space:nowrap}.openLink:hover{border-color:var(--color-teal-500)}.stage{flex:1 1;overflow:auto;padding:var(--space-24);display:grid;place-items:start center}.stageInner{width:100%;max-width:1080px}.screenIntro{margin:0 0 var(--space-16);max-width:60ch}.screenWhy{color:var(--color-ink-900);font-weight:var(--weight-regular);font-size:var(--text-body);margin:0 0 var(--space-8)}.screenWhat,.screenWhy{line-height:var(--leading-normal)}.screenWhat{color:var(--color-ink-700);font-size:var(--text-secondary);margin:0}.frameWrap{display:flex;justify-content:center}.frame{background:var(--color-surface);border-radius:var(--radius-large);box-shadow:var(--elevation-3);overflow:hidden}.frameDesktop{width:100%}.frameMobile{width:390px;border:9px solid #1d1d1f;border-radius:26px}.frameImg{display:block;width:100%;height:auto}.comingSoon{padding:var(--space-48) var(--space-24);background:var(--color-surface);border:1px solid var(--color-border-subtle);border-radius:var(--radius-large);width:100%}.captureNote,.comingSoon{text-align:center;color:var(--color-ink-700)}.captureNote{margin:var(--space-12) 0 0;font-size:var(--text-caption)}.hamb{display:none;align-items:center;justify-content:center;width:44px;height:44px;flex:none;background:var(--color-surface-sunk);border:1px solid var(--color-border-subtle);border-radius:var(--radius-medium);cursor:pointer}.hamb svg{width:20px;height:20px;stroke:var(--color-ink-900);fill:none;stroke-width:2;stroke-linecap:round}.scrim{display:none}@media (max-width:900px){.shell{display:block}.sidebar{position:fixed;top:0;left:0;z-index:60;width:min(300px,86vw);transform:translateX(-100%);transition:transform .25s ease;box-shadow:0 0 44px rgba(0,0,0,.45)}.drawerOpen .sidebar{transform:translateX(0)}.scrim{display:block;position:fixed;inset:0;background:rgba(8,18,32,.55);z-index:50;opacity:0;pointer-events:none;transition:opacity .25s}.drawerOpen .scrim{opacity:1;pointer-events:auto}.main{height:100vh;height:100dvh}.hamb{display:inline-flex}.bar{padding:var(--space-8) var(--space-12);gap:var(--space-8)}.barTitle{font-size:var(--text-body)}.seg{display:none}.stage{padding:var(--space-12)}.frameMobile{width:100%;max-width:390px}}