/* Shared identity and sign-in for the story library and production workspace. */
:root{color-scheme:dark;--bg0:#04060a;--bg1:#0a1018;--panel:rgba(13,20,30,.82);--line:rgba(120,160,200,.16);--ink:#dfe7ee;--dim:#8595a5;--accent:#39d98a;--cyan:#35c4dc;--amber:#e8b83f;--red:#e8563f;--violet:#9a6bff;--gold:#ffd979;--ease:cubic-bezier(.4,0,.2,1);font-size:15px}
*{box-sizing:border-box}body{margin:0;color:var(--ink);font-family:"Avenir Next","Segoe UI",system-ui,sans-serif;background:radial-gradient(ellipse 100% 70% at 50% 105%,#0b191b 0%,var(--bg1) 48%,var(--bg0) 100%);background-attachment:fixed}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.45}input,select,textarea{color:var(--ink)}[hidden]{display:none!important}a{color:var(--cyan)}button,a,input,select,textarea,summary{outline-offset:5px}:focus-visible{outline:2px solid var(--cyan)}
#stars{position:fixed;inset:0;pointer-events:none;opacity:.55;z-index:0}
#topbar{position:fixed;inset:0 0 auto;height:58px;z-index:60;display:flex;align-items:center;gap:22px;padding:0 24px;border-bottom:1px solid var(--line);background:rgba(4,7,12,.91);backdrop-filter:blur(18px)}
#brand{display:flex;align-items:center;gap:9px;flex-shrink:0;border:0;text-decoration:none;font-size:12px;font-weight:750;letter-spacing:.14em;text-transform:uppercase;cursor:pointer;background:none;color:var(--ink)}
#brand .brand-wordmark{background:linear-gradient(100deg,var(--accent),var(--cyan),var(--violet));background-clip:text;-webkit-background-clip:text;color:transparent}
.brand-mark{width:27px;height:29px;color:var(--accent);filter:drop-shadow(0 0 7px #39d98a45)}
.workspace-nav{display:flex;align-items:center;gap:4px;height:100%;flex-shrink:0}.workspace-nav a{display:flex;align-items:center;gap:7px;height:34px;padding:0 12px;border:1px solid transparent;border-radius:8px;color:var(--dim);text-decoration:none;font-size:12px;font-weight:600;transition:color .2s var(--ease),background .2s var(--ease),border-color .2s var(--ease)}.workspace-nav a:hover{color:var(--ink);background:#ffffff06}.workspace-nav a[aria-current=page]{color:#acf2de;border-color:#39d98a32;background:linear-gradient(110deg,#39d98a10,#35c4dc10)}.workspace-nav svg{width:15px;height:15px;flex:none}
#crumb{font-size:12px;color:var(--dim);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#hudTop{margin-left:auto;color:var(--dim);font-size:10px;letter-spacing:.1em;white-space:nowrap}#hudTop b{color:var(--ink);font-weight:650}#liveDot,#hudTop+#liveDot{display:flex;align-items:center;gap:7px;margin-left:0;white-space:nowrap;color:var(--dim);font-size:10px;letter-spacing:.1em;text-transform:uppercase}#liveDot::before{content:"";width:6px;height:6px;flex:none;border-radius:50%;background:var(--accent);box-shadow:0 0 10px #39d98a70;animation:none}#liveDot[data-state=offline]::before{background:var(--amber);box-shadow:none}
#workspaceAccount{position:relative;flex-shrink:0;margin:0}#workspaceAccount summary{display:flex;align-items:center;gap:8px;list-style:none;cursor:pointer;font-size:12px;padding:3px;border-radius:8px}#workspaceAccount summary::-webkit-details-marker{display:none}.user-avatar{width:28px;height:28px;border:1px solid #35c4dc40;border-radius:50%;display:inline-grid;place-items:center;background:#35c4dc10;color:#abe9eb;font-size:11px;font-weight:700;flex:none}#userChip{font-size:12px;color:var(--ink)}.account-chevron{color:var(--dim);font-size:11px}.account-popover{position:absolute;right:0;top:43px;min-width:210px;padding:16px;border:1px solid var(--line);background:#0d151f;border-radius:12px;box-shadow:0 20px 70px #0009;display:grid;gap:10px}.account-popover small{font-size:11px;color:var(--dim)}.account-popover b{font-size:13px}.account-popover button{padding:9px 12px;border:1px solid var(--line);border-radius:7px;background:#ffffff05;color:var(--ink);text-align:left}
.workspace-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:38px;padding:9px 15px;border:1px solid var(--line);border-radius:9px;background:#ffffff04;color:var(--ink);text-decoration:none;font-size:12px;font-weight:600;transition:border-color .2s var(--ease),background .2s var(--ease),transform .2s var(--ease)}.workspace-button:hover{border-color:#8bb2c650;background:#ffffff08}.workspace-button.primary{border-color:#65e9c960;background:linear-gradient(105deg,#39d98a,#35c4dc);color:#04120f;box-shadow:0 4px 22px #39d98a15}.workspace-button.primary:hover{transform:translateY(-1px)}.workspace-button.ghost{background:transparent}.workspace-button svg{width:15px;height:15px}
.eyebrow{font-size:10px;font-weight:650;letter-spacing:.18em;text-transform:uppercase;color:var(--dim)}.gradient-title{background:linear-gradient(100deg,var(--accent),var(--cyan) 50%,var(--violet));background-clip:text;-webkit-background-clip:text;color:transparent}.muted{color:var(--dim)}
body.locked #topbar,body.locked [data-workspace-content]{visibility:hidden}
#gate.auth-gate{padding:0;border:0;background:transparent;color:var(--ink);width:min(430px,calc(100vw - 32px));max-height:calc(100dvh - 32px);overflow:auto;z-index:100}#gate::backdrop{background:rgba(2,4,8,.78);backdrop-filter:blur(9px)}.auth-card{margin:0;padding:28px 32px 25px;border:1px solid #39d98a35;border-radius:19px;background:linear-gradient(165deg,#0c1621,#080d15 75%);box-shadow:0 20px 100px #0009;color:var(--ink)}#gateGlyph{height:96px;margin:0 auto 13px;max-width:200px}#gate h1{font-size:23px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;text-align:center;margin:0 0 9px;background:linear-gradient(95deg,var(--accent),var(--cyan),var(--violet));background-clip:text;-webkit-background-clip:text;color:transparent}#gate .auth-intro{color:var(--dim);font-size:12px;line-height:1.6;letter-spacing:0;text-align:center;margin:0 0 25px}.auth-card label{display:block;font-size:12px;color:#adbbc7;margin:14px 0 6px}.auth-card input{width:100%;padding:11px 12px;border:1px solid var(--line);border-radius:9px;background:#02070c80;color:var(--ink)}.auth-card .primary{width:100%;margin-top:22px;min-height:42px;font-size:13px}.auth-card .auth-footnote{border-top:1px solid var(--line);margin:23px 0 0;padding-top:16px;text-align:center;font-size:11px;color:var(--dim)}#gateErr{color:#f9a3a3;font-size:12px;line-height:1.5;margin-top:12px}#gateErr:empty{display:none}
@media(max-width:1240px){#crumb{display:none}#topbar{gap:15px}#hudTop{font-size:9px}}
@media(max-width:900px){#hudTop{display:none}#workspaceAccount{margin-left:auto}#liveDot{margin-left:auto}}
@media(max-width:600px){#topbar{padding:0 12px;gap:10px}#brand .brand-wordmark{display:none}#brand{font-size:12px}#brand .brand-mark{width:24px}#userChip,.account-chevron,#liveDot,#hudTop{display:none}.workspace-nav{gap:2px}.workspace-nav a{padding:0 8px;font-size:11px;gap:5px}.workspace-nav svg{width:13px;height:13px}#workspaceAccount{margin-left:auto}.auth-card{padding:24px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
/* Native dialogs must keep their centering despite the library's legacy reset. */
#gate.auth-gate{position:fixed;inset:0;margin:auto;height:fit-content}#gate .auth-footnote{border-top:1px solid var(--line);margin:23px 0 0;padding-top:16px;text-align:center;font-size:11px;line-height:1.7;letter-spacing:0;color:var(--dim)}#gate input{margin:0;width:100%;padding:11px 12px;border:1px solid var(--line);border-radius:9px;background:#02070c80;color:var(--ink);font-size:15px}#gate label{margin:14px 0 6px;font-size:12px;line-height:normal;color:#adbbc7}
