:root { --system-void: #050914; --system-panel: rgba(10, 24, 48, .82); --system-panel-strong: #0b1934; --system-cyan: #62ddff; --system-ice: #e8f7ff; --system-violet: #9d82ff; --system-pink: #ec70c7; --system-muted: #8da5c7; --system-line: rgba(105, 214, 255, .22); --system-body: 'Segoe UI', Tahoma, sans-serif; --system-display: 'Trebuchet MS', 'Segoe UI', sans-serif; --system-mono: Consolas, 'Courier New', monospace; }
* { box-sizing: border-box; }
:root { --system-surface: #0b1428; --system-surface-raised: #101d35; --system-surface-muted: #162641; --system-row-hover: rgba(78, 159, 206, .14); --system-control: #071225; }
:root { --user-accent-primary: #67e8f9; --user-accent-secondary: #60a5fa; --user-accent-gradient: linear-gradient(115deg, #67e8f9, #60a5fa); --user-accent-soft: rgba(103, 232, 249, .14); --user-accent-border: rgba(103, 232, 249, .48); --system-cyan: var(--user-accent-primary); --system-violet: var(--user-accent-secondary); --system-pink: var(--user-accent-secondary); --system-line: var(--user-accent-border); }
html, body { margin: 0; min-width: 320px; background: var(--system-void); color: var(--system-ice); font-family: var(--system-body); font-size: 16px; }
body { background-image: linear-gradient(rgba(98, 221, 255, .018) 1px, transparent 1px), linear-gradient(90deg, rgba(98, 221, 255, .014) 1px, transparent 1px), radial-gradient(circle at 50% -10%, #122c50 0, transparent 42rem); background-size: 44px 44px, 44px 44px, auto; }
body::before { content: ""; position: fixed; inset: 0; z-index: 0; pointer-events: none; opacity: .23; background-image: radial-gradient(circle, rgba(98, 221, 255, .85) 0 1px, transparent 1.5px), radial-gradient(circle, rgba(157, 130, 255, .65) 0 1px, transparent 1.5px); background-size: 173px 211px, 257px 191px; background-position: 11% 21%, 71% 12%; animation: particle-drift 24s linear infinite; }
main, .sidebar { position: relative; z-index: 1; }
a { color: var(--system-cyan); }
a:hover { color: var(--system-ice); }
h1, h2, h3, h4, h5 { font-family: var(--system-display); font-weight: 600; letter-spacing: .04em; }
h1 { font-size: clamp(1.9rem, 4vw, 3.3rem); }
button, input, select, textarea { font-family: inherit; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid var(--system-cyan); outline-offset: 3px; }
.btn { border-radius: 0; font-family: var(--system-mono); letter-spacing: .04em; }
.btn-primary { color: #03111c; background: var(--system-cyan); border-color: var(--system-cyan); box-shadow: 0 0 16px rgba(98, 221, 255, .2); }
.btn-primary:hover { color: #03111c; background: #a2edff; border-color: #a2edff; }
.btn-outline-light, .btn-outline-primary, .btn-secondary { color: var(--system-ice); border-color: rgba(121, 203, 255, .5); background: rgba(83, 125, 185, .08); }
.btn-outline-light:hover, .btn-outline-primary:hover, .btn-secondary:hover { color: var(--system-void); background: var(--system-ice); border-color: var(--system-ice); }
.btn:disabled, .btn.disabled { color: #7890ad; border-color: rgba(121, 203, 255, .2); background: rgba(60, 85, 120, .16); opacity: .72; }
.btn-primary:focus-visible, .btn-outline-primary:focus-visible, .btn-secondary:focus-visible { box-shadow: 0 0 0 3px rgba(98, 221, 255, .22); }
.form-control, .form-select { border-radius: 0; background: rgba(2, 10, 24, .82); border: 1px solid rgba(105, 214, 255, .3); color: var(--system-ice); }
.form-control::placeholder { color: #637895; }
.form-control:focus, .form-select:focus { background: rgba(5, 18, 38, .96); color: var(--system-ice); border-color: var(--system-cyan); box-shadow: 0 0 0 3px rgba(98, 221, 255, .12), 0 0 18px rgba(98, 221, 255, .12); }
.form-select option { background: #0b1934; color: var(--system-ice); }
.management-card fieldset { min-inline-size: 0; margin: 0; padding: 0; border: 0; }
.management-card input.form-control, .management-card select.form-select { background-color: var(--system-control) !important; color: #fff !important; border-color: var(--user-accent-border); }
.management-card input.form-control::placeholder { color: rgba(255, 255, 255, .72); }
.management-card input.form-control:focus, .management-card select.form-select:focus { background-color: #0b1934 !important; color: #fff !important; border-color: var(--user-accent-primary); box-shadow: 0 0 0 3px var(--user-accent-soft), 0 0 18px var(--user-accent-soft); }
.management-card select.form-select option { background: #0b1934; color: #fff; }
.validation-message, .validation-errors { color: #ff9acb; font-family: var(--system-mono); font-size: .78rem; }
.alert { border-radius: 0; border-left: 3px solid var(--system-cyan); background: rgba(44, 91, 123, .22); color: var(--system-ice); }
.alert-danger { border-left-color: #ff78aa; background: rgba(118, 28, 70, .28); }
.alert-success { border-left-color: #78ffc8; background: rgba(25, 112, 102, .24); }
.system-kicker { color: var(--system-cyan); font: .64rem var(--system-mono); letter-spacing: .19em; text-transform: uppercase; }
.system-section-header { display: flex; justify-content: space-between; align-items: flex-end; gap: 1.5rem; margin-bottom: 2rem; animation: system-enter .45s ease both; }
.system-section-header h1 { margin: .4rem 0 .35rem; color: var(--system-ice); text-shadow: 0 0 28px rgba(98, 221, 255, .18); }
.system-section-header p { max-width: 50rem; margin: 0; color: var(--system-muted); font-size: 1.05rem; }
.system-section-header__actions { flex: 0 0 auto; }
.system-panel { position: relative; overflow: hidden; border: 1px solid var(--system-line); background: linear-gradient(135deg, rgba(16, 42, 75, .72), rgba(7, 16, 35, .92)); box-shadow: 0 15px 45px rgba(0, 0, 0, .2), inset 0 0 34px rgba(93, 186, 255, .035); animation: system-enter .5s ease both; }
.system-panel::before, .system-panel::after { content: ""; position: absolute; width: 16px; height: 16px; border-color: var(--system-cyan); pointer-events: none; opacity: .7; }
.system-panel::before { top: -1px; left: -1px; border-top: 2px solid; border-left: 2px solid; }
.system-panel::after { right: -1px; bottom: -1px; border-right: 2px solid; border-bottom: 2px solid; }
.system-panel--violet { border-color: rgba(157, 130, 255, .38); }
.system-panel--violet::before, .system-panel--violet::after { border-color: var(--system-violet); }
.system-panel--scanline::after { animation: scanline 5s linear infinite; }
.system-panel--scanline .system-panel__body::before { content: ""; position: absolute; inset: 0; height: 1px; background: linear-gradient(90deg, transparent, var(--system-cyan), transparent); box-shadow: 0 0 12px var(--system-cyan); opacity: .08; animation: scanline-sweep 6s ease-in-out infinite; pointer-events: none; }
.system-panel__header { position: relative; z-index: 1; display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1.1rem 1.35rem; border-bottom: 1px solid rgba(105, 214, 255, .14); background: rgba(6, 16, 33, .38); }
.system-panel__header h2 { margin: .3rem 0 0; font-size: 1.25rem; color: var(--system-ice); }
.system-panel__body { position: relative; z-index: 1; padding: 1.35rem; }
.system-panel__actions { display: flex; gap: .5rem; }
.system-notification { display: flex; align-items: center; gap: .75rem; padding: .8rem 1rem; border: 1px solid rgba(98, 221, 255, .35); background: rgba(33, 95, 135, .2); color: var(--system-ice); font-family: var(--system-mono); font-size: .8rem; }
.system-notification--danger { border-color: rgba(255, 120, 170, .58); background: rgba(122, 30, 72, .28); }
.system-notification--success { border-color: rgba(120, 255, 200, .5); background: rgba(30, 111, 100, .24); }
.system-notification__glyph { color: var(--system-cyan); font-size: 1.1rem; }
.system-status { display: inline-flex; align-items: center; gap: .35rem; padding: .25rem .55rem; border: 1px solid currentColor; font: .64rem var(--system-mono); letter-spacing: .05em; text-transform: uppercase; }
.system-status::before { content: ""; width: .35rem; height: .35rem; border-radius: 50%; background: currentColor; box-shadow: 0 0 7px currentColor; }
.system-status--success, .system-status--complete, .system-status--active { color: #73f5c1; }
.system-status--warning, .system-status--pending, .system-status--onhold { color: #ffd278; }
.system-status--danger, .system-status--cancelled, .system-status--blocked { color: #ff87bd; }
.system-status--neutral, .system-status--planned { color: #92b4d9; }
.system-progress { display: flex; align-items: center; gap: .7rem; min-width: 8rem; }
.system-progress__track { height: 5px; flex: 1; background: rgba(131, 171, 210, .18); overflow: hidden; }
.system-progress__value { height: 100%; background: linear-gradient(90deg, var(--system-cyan), var(--system-violet)); box-shadow: 0 0 12px var(--system-cyan); transition: width .5s ease; }
.system-progress__label { min-width: 2.7rem; color: var(--system-cyan); font: .7rem var(--system-mono); text-align: right; }
.system-table { width: 100%; margin: 0; color: var(--system-ice); border-color: rgba(105, 214, 255, .15); }
.system-table thead th { color: var(--system-cyan); border-bottom-color: rgba(105, 214, 255, .3); font: .67rem var(--system-mono); letter-spacing: .12em; text-transform: uppercase; }
.system-table td { color: #c0d4e9; border-bottom-color: rgba(105, 214, 255, .1); vertical-align: middle; }
.system-table tbody tr { transition: background .18s ease; }
.system-table tbody tr:hover { background: rgba(78, 159, 206, .09); }
.system-empty { color: var(--system-muted); padding: 1.5rem 0; font-family: var(--system-mono); }
.system-stat-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; }
.system-stat { padding: 1.1rem 1.2rem; border: 1px solid var(--system-line); background: rgba(8, 23, 47, .72); }
.system-stat__label { color: var(--system-muted); font: .64rem var(--system-mono); letter-spacing: .14em; text-transform: uppercase; }
.system-stat__value { display: block; margin-top: .35rem; color: var(--system-ice); font: 700 clamp(1.7rem, 3vw, 2.7rem) var(--system-display); }
.system-stat__meta { margin-top: .25rem; color: var(--system-muted); font-size: .82rem; }
.management-page, .projects { background: transparent; color: var(--system-ice); padding: 0; min-height: 75vh; }
.card { border: 1px solid var(--system-line); border-radius: 0; color: var(--system-ice); background: linear-gradient(135deg, var(--system-surface-raised), var(--system-surface)); box-shadow: 0 15px 45px rgba(0, 0, 0, .2), inset 0 0 34px rgba(93, 186, 255, .035); }
.card h1, .card h2, .card h3, .card h4, .card h5, .card h6 { color: var(--system-ice); }
.card .form-label, .card label { color: var(--system-muted); }
.table { --bs-table-bg: transparent; --bs-table-color: var(--system-ice); --bs-table-border-color: rgba(105, 214, 255, .14); color: var(--system-ice); background: var(--system-surface); }
.table > :not(caption) > * > * { color: inherit; background-color: transparent; border-bottom-color: rgba(105, 214, 255, .14); }
.table thead { color: var(--system-cyan); background: rgba(6, 16, 33, .7); }
.table thead th { color: var(--system-cyan); border-bottom-color: rgba(105, 214, 255, .32); font: .67rem var(--system-mono); letter-spacing: .12em; text-transform: uppercase; }
.table tbody tr { background: rgba(8, 20, 40, .72); transition: background .18s ease; }
.table tbody tr:nth-child(even) { background: rgba(16, 35, 60, .68); }
.table tbody tr:hover { background: var(--system-row-hover); }
.table tbody td { color: #cfe0f0; vertical-align: middle; }
.table-responsive { border: 1px solid rgba(105, 214, 255, .16); background: var(--system-surface); }
.form-check-input { border-radius: 0; border-color: rgba(105, 214, 255, .45); background-color: var(--system-control); }
.form-check-input:checked { border-color: var(--system-cyan); background-color: var(--system-cyan); }
.management-card, .project-panel { position: relative; overflow: hidden; border: 1px solid var(--system-line); background: linear-gradient(135deg, rgba(16, 42, 75, .72), rgba(7, 16, 35, .92)); box-shadow: 0 15px 45px rgba(0, 0, 0, .16), inset 0 0 34px rgba(93, 186, 255, .035); padding: 1.35rem; margin-top: 1.4rem; }
.management-card h2, .project-panel h2 { color: var(--system-ice); }
.management-grid, .editor-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.management-grid .wide, .description-field { grid-column: 1 / -1; }
.management-actions, .actions { display: flex; gap: .6rem; flex-wrap: wrap; margin-top: 1.2rem; }
.filter-row { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }
.filter-row h2 { margin-right: auto; }
.stat-strip { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; margin: 1.4rem 0; }
.stat-strip > div { padding: 1.1rem 1.2rem; border: 1px solid var(--system-line); background: rgba(8, 23, 47, .72); }
.stat-strip span { color: var(--system-muted); font: .64rem var(--system-mono); letter-spacing: .13em; text-transform: uppercase; }
.stat-strip strong { display: block; margin-top: .3rem; color: var(--system-ice); font: 700 1.45rem var(--system-display); }
.stat-strip small { display: block; margin-top: .45rem; color: var(--system-muted); font-size: .72rem; }
.stat-strip__empty { grid-column: 1 / -1; }
.project-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1rem; }
.project-card { position: relative; padding: 1.25rem; border: 1px solid var(--system-line); background: linear-gradient(145deg, rgba(13, 37, 70, .77), rgba(6, 15, 32, .9)); transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease; }
.project-card:hover { transform: translateY(-3px); border-color: rgba(98, 221, 255, .65); box-shadow: 0 12px 28px rgba(0, 0, 0, .25), 0 0 20px rgba(98, 221, 255, .08); }
.project-card h3 { color: var(--system-ice); }
.project-card > p, .projects > p { color: var(--system-muted); }
.badges { display: flex; flex-wrap: wrap; gap: .4rem; margin: .8rem 0; }
.badges span, .count { padding: .22rem .48rem; color: #cbeeff; border: 1px solid rgba(98, 221, 255, .28); background: rgba(68, 137, 178, .15); font: .64rem var(--system-mono); }
.badges .system-status { padding: .25rem .55rem; background: transparent; font: .64rem var(--system-mono); }
.badges .archived { color: #d5caff; border-color: rgba(157, 130, 255, .35); background: rgba(104, 75, 178, .16); }
.notice { color: #c0d4e9; padding: 1rem; border: 1px solid var(--system-line); background: rgba(33, 80, 124, .18); }
.management-page > .alert, .projects > .alert { margin-bottom: 1rem; }
.description { color: #b4c9df; white-space: pre-wrap; overflow-wrap: anywhere; }
dl { display: grid; grid-template-columns: auto 1fr; gap: .3rem 1rem; font-size: .85rem; } dt { color: var(--system-muted); } dd { margin: 0; color: #c9dced; }
.blazor-error-boundary { background: #3b1831; border: 1px solid var(--system-pink); color: var(--system-ice); }
.system-error-boundary { max-width: 52rem; margin: 4rem auto; padding: 2rem; border: 1px solid var(--system-pink); background: linear-gradient(145deg, rgba(59, 24, 49, .92), rgba(10, 17, 36, .96)); color: var(--system-ice); box-shadow: 0 0 32px rgba(235, 110, 194, .12); }
.system-error-boundary h1 { margin-top: 0; color: var(--system-ice); }
.system-error-boundary p { color: var(--system-muted); }
#blazor-error-ui { color-scheme: dark; display: none; }
.company-page { min-height: 75vh; }
.company-breadcrumbs { display: flex; align-items: center; flex-wrap: wrap; gap: .55rem; color: var(--system-muted); font: .7rem var(--system-mono); letter-spacing: .04em; margin-bottom: 1rem; }
.company-breadcrumbs a { color: var(--system-cyan); text-decoration: none; }
.company-role { padding: .2rem .45rem; border: 1px solid rgba(157, 130, 255, .35); color: var(--system-violet); }
.company-return { margin-left: auto; padding: .35rem .65rem; border: 1px solid rgba(98, 221, 255, .35); }
.company-workspace-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; padding: 1rem 0 1.1rem; border-bottom: 1px solid rgba(105, 214, 255, .18); }
.company-workspace-header h1 { margin: .3rem 0 .2rem; }
.company-workspace-header p { margin: 0; color: var(--system-muted); }
.company-workspace-header__sigil { color: var(--system-cyan); font-size: 3rem; text-shadow: 0 0 24px var(--system-cyan); }
.company-workspace-nav { display: flex; flex-wrap: wrap; gap: .35rem; padding: .8rem 0 1.2rem; border-bottom: 1px solid rgba(105, 214, 255, .13); }
.company-workspace-nav a { padding: .42rem .7rem; color: var(--system-muted); border: 1px solid transparent; text-decoration: none; font: .7rem var(--system-mono); }
.company-workspace-nav a:hover, .company-workspace-nav a.active { color: var(--system-ice); border-color: rgba(98, 221, 255, .45); background: rgba(52, 139, 187, .12); }
.company-dashboard-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(260px, .75fr); gap: 1rem; margin-top: 1rem; }
.company-quest-list { display: grid; gap: .6rem; }
.company-quest-list a { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .75rem; border-left: 2px solid var(--system-cyan); color: inherit; background: rgba(44, 111, 155, .1); text-decoration: none; }
.company-quest-list a:hover { background: rgba(44, 111, 155, .2); }
.company-quest-list strong, .company-quest-list span { display: block; }
.company-quest-list span { color: var(--system-muted); font-size: .78rem; margin-top: .2rem; }
.company-quest-list .system-progress { width: 42%; }
.company-selector-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 1rem; }
.company-selector-card { display: flex; flex-direction: column; gap: .5rem; min-height: 170px; padding: 1.35rem; border: 1px solid var(--system-line); background: linear-gradient(145deg, rgba(13, 37, 70, .78), rgba(6, 15, 32, .9)); color: var(--system-ice); text-decoration: none; transition: transform .2s ease, border-color .2s ease; }
.company-selector-card:hover { transform: translateY(-3px); border-color: var(--system-cyan); color: var(--system-ice); }
.company-selector-card strong { font-size: 1.35rem; }
.company-selector-card span:not(.system-kicker) { color: var(--system-muted); font: .75rem var(--system-mono); }
.company-selector-card b { margin-top: auto; color: var(--system-cyan); font: .72rem var(--system-mono); }
.company-stat-grid { margin-top: 1.2rem; }
.company-page .management-card { margin-top: 1rem; }
.permission-matrix { display: grid; gap: .55rem; margin-top: 1rem; }
.permission-matrix div { display: grid; grid-template-columns: minmax(150px, .4fr) 1fr; gap: 1rem; padding: .7rem; border-left: 2px solid var(--system-violet); background: rgba(90, 60, 167, .1); }
.permission-matrix strong { color: var(--system-ice); font-family: var(--system-mono); }
.permission-matrix span { color: var(--system-muted); }
.system-auth-shell { max-width: 1100px; margin: 2rem auto; }
.system-auth-brand { display: flex; align-items: center; gap: 1rem; margin-bottom: 2rem; }
.system-auth-brand strong { display: block; margin-top: .25rem; color: var(--system-ice); font: 700 1.35rem var(--system-display); letter-spacing: .1em; }
.system-auth-brand p { margin: .25rem 0 0; color: var(--system-muted); font: .72rem var(--system-mono); }
.system-auth-grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(280px, .7fr); gap: 1rem; }
.system-auth-card, .system-auth-side { border: 1px solid var(--system-line); background: linear-gradient(135deg, rgba(16, 42, 75, .72), rgba(7, 16, 35, .92)); padding: clamp(1.1rem, 3vw, 2rem); }
.system-auth-card .system-section-header { margin-bottom: 1.25rem; }
.system-auth-card .system-section-header h1 { font-size: 2.2rem; }
.system-field { display: flex; flex-direction: column-reverse; gap: .35rem; margin-bottom: 1.1rem; }
.system-field label { color: var(--system-muted); font: .68rem var(--system-mono); letter-spacing: .1em; text-transform: uppercase; }
.system-checkbox { margin: .8rem 0 1.3rem; color: var(--system-muted); }
.system-auth-card form > div:last-child { margin-top: 1.25rem; }
.system-auth-card form > div:last-child p { margin: .8rem 0 0; font-size: .82rem; }
.system-auth-card form > div:last-child a { color: var(--system-cyan); }
.system-auth-side { padding: 0; border: 0; background: transparent; }
.system-auth-side .system-panel { height: 100%; }
@media (max-width: 760px) { .system-auth-grid { grid-template-columns: 1fr; } .system-auth-shell { margin: .5rem auto; } }
@keyframes system-enter { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
@keyframes scanline { 0%, 100% { opacity: 0; } 50% { opacity: .15; } }
@keyframes scanline-sweep { 0% { top: 0; } 50% { top: 100%; } 100% { top: 0; } }
@keyframes particle-drift { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(18px, -14px, 0); } }
@media (max-width: 850px) { .system-stat-grid, .stat-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .system-section-header { align-items: flex-start; flex-direction: column; } .management-grid, .editor-grid, .system-stat-grid, .stat-strip { grid-template-columns: 1fr; } .management-grid .wide, .description-field { grid-column: auto; } .system-panel__body { padding: 1rem; } .table-responsive { border: 1px solid rgba(105, 214, 255, .15); } }
@media (max-width: 740px) { .company-dashboard-grid { grid-template-columns: 1fr; } .company-return { margin-left: 0; } .company-workspace-header__sigil { display: none; } .company-quest-list .system-progress { width: 35%; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; } }

/* Cinderfang Studio: a professional production surface kept visually separate from HQ. */
:root { --studio-bg: #11191c; --studio-panel: #182528; --studio-panel-2: #203338; --studio-line: var(--user-accent-border); --studio-teal: var(--user-accent-primary); --studio-ice: #f8fbff; --studio-muted: #fff; --studio-orange: #f2b37a; --studio-danger: #ef8e92; --studio-shadow: 0 18px 42px rgba(0, 0, 0, .2); }
.studio-shell { min-height: 100vh; display: flex; color: var(--studio-ice); background: radial-gradient(circle at 82% 0%, rgba(54, 111, 112, .2), transparent 34rem), var(--studio-bg); font-family: Inter, ui-sans-serif, system-ui, sans-serif; }
.studio-nav { width: 270px; flex: 0 0 270px; display: flex; flex-direction: column; min-height: 100vh; padding: 1.4rem 1rem 1rem; border-right: 1px solid var(--studio-line); background: rgba(13, 22, 24, .96); }
.studio-brand { display: flex; align-items: center; gap: .65rem; min-width: 0; color: var(--studio-ice); overflow: hidden; }.studio-brand__icon { flex: 0 0 2.5rem; }.studio-brand__copy { flex: 1 1 auto; min-width: 0; overflow: hidden; }.studio-brand strong { display: block; font-size: .85rem; letter-spacing: .16em; overflow-wrap: anywhere; }.studio-brand span { display: block; color: var(--studio-teal); font: .64rem ui-monospace, monospace; letter-spacing: .12em; overflow-wrap: anywhere; }.studio-brand__mark { display: grid; place-items: center; width: 2.5rem; height: 2.5rem; border: 1px solid var(--studio-teal); color: var(--studio-teal); font: 700 1rem ui-monospace, monospace; }.studio-brand__mark span { display: inline; color: var(--studio-orange); font-size: .75rem; }
.studio-nav__company { margin: 2rem .55rem .8rem; color: var(--studio-ice); font: .7rem ui-monospace, monospace; letter-spacing: .09em; text-transform: uppercase; }.studio-nav__company small { display: block; margin-top: .3rem; color: var(--studio-muted); font-size: .58rem; }
.studio-nav__body { display: flex; flex-direction: column; gap: .25rem; flex: 1; }.studio-nav__label { margin: 1.1rem .55rem .35rem; color: var(--studio-muted); font: .6rem ui-monospace, monospace; letter-spacing: .16em; }.studio-nav__link, .studio-nav__switch { display: flex; align-items: center; gap: .7rem; padding: .65rem .65rem; color: var(--studio-muted); border-left: 2px solid transparent; text-decoration: none; font-size: .82rem; }.studio-nav__link span { min-width: 1.5rem; color: #628084; font: .62rem ui-monospace, monospace; }.studio-nav__link:hover, .studio-nav__link.active, .studio-nav__switch:hover { color: var(--studio-ice); border-left-color: var(--studio-teal); background: rgba(101, 210, 200, .08); }.studio-nav__account { display: flex; flex-direction: column; gap: .2rem; margin: auto .55rem .8rem; padding: .8rem 0; border-top: 1px solid var(--studio-line); color: var(--studio-ice); font-size: .78rem; }.studio-nav__account span { color: var(--studio-teal); font: .58rem ui-monospace, monospace; }.studio-nav__logout button { width: 100%; padding: .65rem; border: 0; color: var(--studio-muted); background: transparent; text-align: left; cursor: pointer; }.studio-nav__logout button:hover { color: var(--studio-danger); }.studio-nav__footer { margin-top: 1rem; color: #5b777b; font: .58rem ui-monospace, monospace; letter-spacing: .12em; }.studio-nav__footer span { float: right; color: var(--studio-teal); }.studio-nav__toggle { display: none; }.studio-nav__toggle-button { display: none; }
.studio-main { flex: 1; min-width: 0; }.studio-topbar { display: flex; justify-content: space-between; gap: 1rem; padding: .8rem clamp(1rem, 4vw, 3rem); border-bottom: 1px solid var(--studio-line); color: var(--studio-muted); font: .62rem ui-monospace, monospace; letter-spacing: .1em; }.studio-topbar__signal i, .studio-status-pill i { display: inline-block; width: .45rem; height: .45rem; margin-right: .35rem; border-radius: 50%; background: var(--studio-teal); box-shadow: 0 0 0 .2rem rgba(101, 210, 200, .12); }.studio-content { max-width: 1500px; margin: 0 auto; }.studio-page { padding: clamp(1.2rem, 4vw, 3rem); }.studio-page--narrow { max-width: 960px; margin: 0 auto; }.studio-page-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 1.5rem; margin-bottom: 2rem; }.studio-page-heading h1 { margin: .35rem 0 .5rem; color: var(--studio-ice); font-size: clamp(2rem, 4vw, 3.4rem); letter-spacing: -.04em; }.studio-page-heading p, .studio-auth-lede { max-width: 680px; margin: 0; color: var(--studio-muted); }.studio-eyebrow { color: var(--studio-teal); font: .62rem ui-monospace, monospace; letter-spacing: .16em; text-transform: uppercase; }.studio-heading-actions { display: flex; align-items: center; gap: .7rem; }.studio-status-pill { white-space: nowrap; color: var(--studio-teal); font: .65rem ui-monospace, monospace; }.studio-button { display: inline-flex; align-items: center; justify-content: center; min-height: 2.6rem; padding: .65rem 1rem; border: 1px solid var(--studio-line); color: var(--studio-ice); background: transparent; text-decoration: none; cursor: pointer; font: 700 .7rem ui-monospace, monospace; letter-spacing: .08em; text-transform: uppercase; }.studio-button:hover { border-color: var(--studio-teal); color: var(--studio-teal); }.studio-button--primary { border-color: var(--studio-teal); color: #102021; background: var(--studio-teal); }.studio-button--primary:hover { color: #102021; background: #8ae8de; }.studio-button--ghost { border-color: rgba(173, 232, 237, .35); }
.studio-metric-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: .8rem; margin-bottom: 1rem; }.studio-metric { padding: 1rem; border: 1px solid var(--studio-line); background: linear-gradient(140deg, rgba(42, 77, 79, .6), rgba(24, 37, 40, .85)); box-shadow: var(--studio-shadow); }.studio-metric span { display: block; color: var(--studio-muted); font: .6rem ui-monospace, monospace; letter-spacing: .13em; }.studio-metric strong { display: block; margin: .5rem 0 .15rem; color: var(--studio-ice); font-size: 2rem; }.studio-metric small, .studio-list-row small, .studio-table small, .studio-work-card p, .studio-person-card small { display: block; color: var(--studio-muted); font-size: .74rem; }.studio-dashboard-grid { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(280px, .8fr); gap: 1rem; }.studio-panel { min-width: 0; margin-bottom: 1rem; padding: 1.25rem; border: 1px solid var(--studio-line); background: rgba(24, 37, 40, .86); box-shadow: var(--studio-shadow); }.studio-panel--wide { grid-row: span 2; }.studio-panel--compact { margin-top: 1rem; }.studio-panel__heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }.studio-panel__heading h2 { margin: .25rem 0 0; font-size: 1.05rem; }.studio-panel__heading a, .studio-table a, .studio-text-link { color: var(--studio-teal); text-decoration: none; font-size: .76rem; }.studio-panel__heading a:hover, .studio-table a:hover, .studio-text-link:hover { text-decoration: underline; }.studio-table-wrap { overflow-x: auto; }.studio-table { width: 100%; border-collapse: collapse; font-size: .8rem; }.studio-table th { padding: .7rem .55rem; color: var(--studio-muted); border-bottom: 1px solid var(--studio-line); font: .6rem ui-monospace, monospace; letter-spacing: .1em; text-align: left; text-transform: uppercase; }.studio-table td { padding: .8rem .55rem; border-bottom: 1px solid rgba(173, 232, 237, .08); color: var(--studio-ice); }.studio-table strong { display: block; }.studio-status { display: inline-block; padding: .25rem .45rem; border: 1px solid var(--studio-line); color: var(--studio-teal); font: .6rem ui-monospace, monospace; text-transform: uppercase; }.studio-status--blocked, .studio-status--changesrequested { color: var(--studio-danger); border-color: rgba(239, 142, 146, .4); }.studio-status--inreview, .studio-status--submitted { color: var(--studio-orange); border-color: rgba(242, 179, 122, .4); }.studio-status--done, .studio-status--approved, .studio-status--completed { color: #9fe4a9; border-color: rgba(159, 228, 169, .4); }.studio-activity { padding: .8rem 0; border-bottom: 1px solid rgba(173, 232, 237, .08); }.studio-activity:last-child { border-bottom: 0; }.studio-activity p { margin: .35rem 0; color: var(--studio-muted); font-size: .8rem; line-height: 1.5; }.studio-activity small { color: #6e898c; font: .62rem ui-monospace, monospace; }.studio-list-row { display: flex; align-items: center; gap: .65rem; padding: .65rem 0; border-bottom: 1px solid rgba(173, 232, 237, .08); }.studio-list-row strong { display: block; font-size: .8rem; }.studio-avatar { display: grid; place-items: center; width: 2rem; height: 2rem; flex: 0 0 2rem; border: 1px solid var(--studio-teal); color: var(--studio-teal); font: .62rem ui-monospace, monospace; }
.studio-nav__group { margin: .35rem .75rem; border: 1px solid rgba(173, 232, 237, .1); background: rgba(10, 20, 23, .35); }.studio-nav__group summary { padding: .65rem .75rem; color: var(--studio-muted); cursor: pointer; font: .58rem ui-monospace, monospace; letter-spacing: .12em; list-style-position: inside; }.studio-nav__group summary:focus-visible { outline: 2px solid var(--studio-ice); outline-offset: -2px; }.studio-nav__group .studio-nav__link { margin: 0; border-top: 1px solid rgba(173, 232, 237, .06); }.studio-nav__link--primary { border-color: rgba(117, 225, 215, .45); background: linear-gradient(90deg, rgba(47, 143, 140, .25), rgba(117, 83, 176, .16)); color: var(--studio-ice); }.studio-development-page { max-width: 1500px; }.studio-project-selector { display: flex; align-items: end; justify-content: space-between; gap: 1.5rem; border-color: rgba(117, 225, 215, .35); }.studio-project-selector h2, .studio-project-context h2 { margin: .25rem 0; }.studio-project-selector__control { min-width: min(100%, 360px); }.studio-development-empty { display: grid; gap: .4rem; min-height: 11rem; place-content: center; text-align: center; }.studio-project-context { display: flex; justify-content: space-between; gap: 1.5rem; margin-bottom: 1rem; padding: 1.25rem; border: 1px solid var(--studio-line); background: linear-gradient(120deg, rgba(35, 70, 72, .72), rgba(25, 29, 49, .9)); box-shadow: var(--studio-shadow); }.studio-project-context__facts { display: grid; grid-template-columns: repeat(4, minmax(90px, 1fr)); gap: .75rem; min-width: min(100%, 500px); }.studio-project-context__facts span { color: var(--studio-muted); font: .58rem ui-monospace, monospace; letter-spacing: .1em; }.studio-project-context__facts strong { display: block; margin-top: .35rem; color: var(--studio-ice); font-size: .82rem; letter-spacing: 0; }.studio-development-sections { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .6rem; margin-bottom: 1rem; }.studio-development-section { display: grid; min-height: 5.8rem; gap: .4rem; align-content: start; padding: .85rem; border: 1px solid var(--studio-line); background: rgba(24, 37, 40, .72); color: var(--studio-ice); text-decoration: none; transition: border-color .15s ease, transform .15s ease, background .15s ease; }.studio-development-section:hover, .studio-development-section:focus-visible, .studio-development-section.is-active { border-color: var(--studio-teal); background: rgba(42, 77, 79, .82); transform: translateY(-1px); }.studio-development-section span { font-size: .82rem; font-weight: 650; }.studio-development-section small { color: var(--studio-muted); font-size: .68rem; line-height: 1.35; }.studio-button--link { border: 0; background: none; color: var(--studio-teal); cursor: pointer; font: inherit; text-decoration: underline; }
.studio-project-grid, .studio-reference-grid, .studio-team-grid, .studio-card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }.studio-project-card, .studio-reference-card, .studio-person-card, .studio-workspace-card { padding: 1.25rem; border: 1px solid var(--studio-line); background: var(--studio-panel); box-shadow: var(--studio-shadow); }.studio-project-card__top { display: flex; justify-content: space-between; gap: .5rem; }.studio-card-index { color: var(--studio-muted); font: .6rem ui-monospace, monospace; letter-spacing: .12em; }.studio-project-card h2, .studio-reference-card h2 { margin: 1.2rem 0 .5rem; font-size: 1.15rem; }.studio-project-card p, .studio-reference-card p { min-height: 3.5rem; color: var(--studio-muted); font-size: .82rem; line-height: 1.55; }.studio-progress { margin: 1rem 0 1.2rem; }.studio-progress div { display: flex; justify-content: space-between; color: var(--studio-muted); font: .62rem ui-monospace, monospace; }.studio-progress b { color: var(--studio-teal); }.studio-progress progress { width: 100%; height: .35rem; accent-color: var(--studio-teal); }.studio-workspace-card { display: flex; flex-direction: column; align-items: flex-start; gap: .55rem; color: var(--studio-ice); text-align: left; cursor: pointer; }.studio-workspace-card:hover { border-color: var(--studio-teal); transform: translateY(-2px); }.studio-workspace-card strong { font-size: 1.25rem; }.studio-workspace-card span:not(.studio-card-index) { color: var(--studio-muted); font-size: .78rem; }.studio-workspace-card i { margin-top: .5rem; color: var(--studio-teal); font-size: .75rem; }.studio-reference-card__tag, .studio-activity__tag { color: var(--studio-teal); font: .6rem ui-monospace, monospace; letter-spacing: .12em; }.studio-reference-card .studio-text-link { display: block; margin-top: 1rem; }.studio-person-card { display: flex; gap: .75rem; }.studio-person-card h3 { margin: 0; font-size: .92rem; word-break: break-word; }.studio-person-card p { margin: .25rem 0; color: var(--studio-ice); font-size: .78rem; }.studio-person-card span { display: block; color: var(--studio-teal); font-size: .7rem; }.studio-person-card code { display: block; margin-top: .5rem; color: #6f898d; font-size: .6rem; word-break: break-all; }
.studio-board { display: grid; grid-template-columns: repeat(4, minmax(210px, 1fr)); gap: .75rem; overflow-x: auto; padding-bottom: .5rem; }.studio-board__column { min-height: 260px; padding: .7rem; border: 1px solid var(--studio-line); background: rgba(13, 25, 27, .72); }.studio-board__heading { display: flex; justify-content: space-between; padding: .4rem .25rem .75rem; color: var(--studio-muted); font: .62rem ui-monospace, monospace; letter-spacing: .08em; text-transform: uppercase; }.studio-board__heading b { color: var(--studio-teal); }.studio-work-card { margin-bottom: .65rem; padding: .8rem; border: 1px solid rgba(173, 232, 237, .15); background: var(--studio-panel-2); }.studio-work-card__meta { display: flex; justify-content: space-between; align-items: center; gap: .5rem; }.studio-work-card__meta small { color: var(--studio-muted); font-size: .65rem; }.studio-work-card h3 { margin: .65rem 0 .25rem; font-size: .88rem; }.studio-work-card p { margin: 0; }.studio-work-card__actions { margin-top: .7rem; }.studio-input { width: 100%; min-height: 2.5rem; padding: .55rem .65rem; border: 1px solid var(--studio-line); color: var(--studio-ice); background: #102022; }.studio-input:focus { outline: 2px solid var(--studio-teal); outline-offset: 1px; }.studio-input--compact { min-height: 2rem; padding: .3rem; font-size: .7rem; }.studio-form-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .9rem; margin-bottom: 1rem; }.studio-form-grid label, .studio-composer > form > label, .studio-panel form label { display: flex; flex-direction: column; gap: .35rem; color: var(--studio-muted); font-size: .72rem; }.studio-form-grid label { min-width: 0; }.studio-file-field input { padding: .5rem 0; color: var(--studio-ice); }.studio-check { display: flex !important; flex-direction: row !important; align-items: center; gap: .5rem !important; }.studio-inline-form { display: flex; align-items: center; flex-wrap: wrap; gap: .6rem; }.studio-inline-form .studio-input { width: 150px; }.studio-search-field { display: grid; min-width: min(240px, 100%); gap: .35rem; color: var(--studio-muted); font-size: .72rem; }.studio-muted { color: var(--studio-muted); font-size: .8rem; }.studio-alert { margin: 0 0 1rem; padding: .75rem 1rem; border: 1px solid var(--studio-line); color: var(--studio-ice); background: rgba(101, 210, 200, .08); }.studio-alert--danger { color: var(--studio-danger); border-color: rgba(239, 142, 146, .4); background: rgba(239, 142, 146, .08); }.studio-alert--success { color: #9fe4a9; border-color: rgba(159, 228, 169, .4); }.studio-empty { padding: 1.5rem; color: var(--studio-muted); border: 1px dashed var(--studio-line); text-align: center; }.studio-review-grid { display: grid; grid-template-columns: minmax(280px, .75fr) minmax(0, 1.25fr); gap: 1rem; }.studio-review-row { display: flex; align-items: center; width: 100%; gap: .7rem; padding: .75rem .4rem; border: 0; border-bottom: 1px solid rgba(173, 232, 237, .08); color: var(--studio-ice); background: transparent; text-align: left; cursor: pointer; }.studio-review-row:hover, .studio-review-row.is-selected { background: rgba(101, 210, 200, .1); }.studio-review-row span:nth-child(2) { flex: 1; }.studio-review-row strong, .studio-review-row small { display: block; }.studio-review-row small { margin-top: .25rem; color: var(--studio-muted); font-size: .68rem; }.studio-review-row i { color: var(--studio-teal); }.studio-review-meta { display: flex; flex-wrap: wrap; gap: 1rem; margin: 1rem 0; color: var(--studio-muted); font-size: .74rem; }.studio-review-meta b { display: block; margin-top: .25rem; color: var(--studio-ice); }
.studio-form-grid--library { grid-template-columns: repeat(6, minmax(0, 1fr)); }.studio-editor { min-height: 22rem; resize: vertical; font: .82rem/1.6 ui-monospace, monospace; }.studio-editor-field { display: flex; flex-direction: column; gap: .4rem; margin-bottom: 1rem; color: var(--studio-muted); font-size: .72rem; }.studio-document-meta { display: flex; flex-wrap: wrap; gap: .7rem; margin-bottom: 1rem; color: var(--studio-muted); font: .65rem ui-monospace, monospace; text-transform: uppercase; }.studio-document-meta span { padding: .35rem .5rem; border: 1px solid var(--studio-line); }.studio-document-body { min-height: 12rem; color: var(--studio-ice); line-height: 1.7; white-space: normal; }.studio-button--small { min-height: 2rem; padding: .4rem .6rem; font-size: .6rem; }.studio-button--danger { border-color: rgba(239, 142, 146, .55); color: var(--studio-danger); }.studio-button--danger:hover { border-color: var(--studio-danger); color: #ffd9da; background: rgba(239, 142, 146, .08); }.studio-table__actions { display: flex; flex-wrap: wrap; gap: .65rem; }
.studio-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 1.8rem; min-height: 1.4rem; padding: .2rem .45rem; border: 1px solid var(--studio-line); color: var(--studio-teal); font: .65rem ui-monospace, monospace; }.studio-card-meta { display: grid; gap: .25rem; margin: .8rem 0 1rem; color: var(--studio-muted); font: .65rem ui-monospace, monospace; }.studio-form-grid__wide { grid-column: span 2; }.studio-dependency-form { margin-top: 1rem; }.studio-dependency-form .studio-input { max-width: 180px; }
.studio-auth-shell { display: grid; place-items: center; min-height: 100vh; padding: 1.5rem; background: radial-gradient(circle at 50% 0%, rgba(101, 210, 200, .17), transparent 32rem), var(--studio-bg); }.studio-auth-card { width: min(100%, 540px); padding: clamp(1.5rem, 5vw, 3rem); border: 1px solid var(--studio-line); background: rgba(24, 37, 40, .95); box-shadow: var(--studio-shadow); }.studio-brand--auth { margin-bottom: 3rem; }.studio-auth-card h1 { margin: .6rem 0 .7rem; font-size: clamp(2.2rem, 6vw, 3.4rem); letter-spacing: -.05em; }.studio-auth-card form { display: grid; gap: 1rem; margin-top: 1.5rem; }.studio-auth-card label:not(.studio-check) { display: grid; gap: .35rem; color: var(--studio-muted); font-size: .75rem; }.studio-auth-foot { margin: 1.4rem 0 .7rem; color: var(--studio-muted); font-size: .75rem; line-height: 1.5; }.studio-text-link { display: inline-block; margin-top: .6rem; }.studio-auth-card .validation-message, .studio-auth-card .validation-errors { color: var(--studio-danger); font-size: .75rem; }
.studio-art-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; }.studio-art-card { display: grid; grid-template-columns: 80px 1fr; gap: 1rem; padding: .9rem; border: 1px solid var(--studio-line); background: #1d3033; }.studio-art-card__swatch { min-height: 110px; background: linear-gradient(145deg, rgba(101, 210, 200, .5), rgba(62, 77, 110, .6) 48%, rgba(242, 179, 122, .35)); }.studio-art-card h3 { margin: .5rem 0 .25rem; font-size: .95rem; }.studio-art-card p { margin: 0 0 .5rem; color: var(--studio-muted); font-size: .75rem; }.studio-art-card small { color: var(--studio-muted); font-size: .65rem; }
@media (max-width: 1050px) { .studio-nav { width: 220px; flex-basis: 220px; }.studio-metric-grid { grid-template-columns: repeat(2, 1fr); }.studio-project-grid, .studio-reference-grid, .studio-team-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 800px) { .studio-project-selector, .studio-project-context { align-items: stretch; flex-direction: column; }.studio-project-context__facts { min-width: 0; }.studio-development-sections { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.public-studio-shell { min-height: 100vh; color: #e8f7f5; background: radial-gradient(circle at 78% 12%, rgba(102, 70, 160, .2), transparent 32rem), linear-gradient(135deg, #071116, #101622 58%, #0b111c); }.public-studio-header { display: flex; align-items: center; gap: 2rem; max-width: 1280px; margin: 0 auto; padding: 1.15rem 1.5rem; border-bottom: 1px solid rgba(164, 234, 230, .12); }.public-studio-brand { display: flex; align-items: center; gap: .65rem; margin-right: auto; color: #e8f7f5; text-decoration: none; }.public-studio-brand strong, .public-studio-brand small { display: block; letter-spacing: .15em; }.public-studio-brand strong { font-size: .78rem; }.public-studio-brand small { color: #79d9d2; font-size: .55rem; }.public-studio-brand__mark { display: grid; place-items: center; width: 2.3rem; height: 2.3rem; border: 1px solid #79d9d2; color: #79d9d2; font: .8rem ui-monospace, monospace; }.public-studio-brand__mark span { color: #af8ce8; }.public-studio-header nav { display: flex; flex-wrap: wrap; gap: 1.1rem; }.public-studio-header nav a, .public-studio-footer a { color: #9db5b9; font-size: .74rem; text-decoration: none; }.public-studio-header nav a:hover, .public-studio-header nav a:focus-visible, .public-studio-footer a:hover { color: #79d9d2; }.public-studio-container { width: min(1120px, calc(100% - 3rem)); margin: 0 auto; }.public-studio-hero { display: flex; align-items: center; justify-content: space-between; min-height: 34rem; gap: 3rem; }.public-studio-hero__copy { max-width: 700px; }.public-studio-kicker { color: #79d9d2; font: .62rem ui-monospace, monospace; letter-spacing: .15em; }.public-studio-hero h1, .public-studio-page h1 { margin: 1rem 0; color: #f1fffd; font-size: clamp(2.6rem, 7vw, 5.6rem); letter-spacing: -.05em; line-height: .98; }.public-studio-hero h1 em { color: #af8ce8; font-style: normal; }.public-studio-hero p, .public-studio-lede { max-width: 650px; color: #a9c0c1; font-size: 1.05rem; line-height: 1.7; }.public-studio-hero__actions, .public-studio-heading-actions { display: flex; flex-wrap: wrap; gap: .7rem; margin-top: 1.4rem; }.public-studio-button { display: inline-flex; align-items: center; justify-content: center; min-height: 2.5rem; padding: .7rem 1rem; border: 1px solid #79d9d2; color: #e8f7f5; font-size: .72rem; text-decoration: none; transition: background .15s ease, transform .15s ease; }.public-studio-button:hover, .public-studio-button:focus-visible { transform: translateY(-1px); }.public-studio-button--primary { background: #277c7d; }.public-studio-button--ghost { background: rgba(8, 18, 23, .4); }.public-studio-hero__signal { display: grid; place-items: center; position: relative; width: 17rem; height: 17rem; border: 1px solid rgba(121, 217, 210, .55); border-radius: 50%; color: #79d9d2; box-shadow: 0 0 60px rgba(121, 217, 210, .12), inset 0 0 50px rgba(175, 140, 232, .1); }.public-studio-hero__signal span { font-size: 4rem; letter-spacing: .1em; }.public-studio-hero__signal i { position: absolute; inset: 1.2rem; border: 1px dashed rgba(175, 140, 232, .65); border-radius: 50%; }.public-studio-hero__signal b { position: absolute; right: -2rem; bottom: 1rem; color: #af8ce8; font: .6rem ui-monospace, monospace; letter-spacing: .15em; }.public-studio-section, .public-studio-page { padding: 3.5rem 0; }.public-studio-section__heading { margin-bottom: 1.2rem; }.public-studio-section h2, .public-studio-page h2 { margin: .5rem 0 1rem; color: #edfdf9; font-size: clamp(1.7rem, 4vw, 2.7rem); }.public-studio-game-card, .public-studio-download-card { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; padding: 1.4rem; border: 1px solid rgba(121, 217, 210, .28); background: rgba(16, 31, 37, .72); }.public-studio-game-card h2, .public-studio-game-card h3 { margin: .6rem 0 .4rem; }.public-studio-game-card p, .public-studio-prose p { max-width: 700px; color: #a9c0c1; line-height: 1.7; }.public-studio-game-card--muted { opacity: .7; }.public-studio-pill { color: #af8ce8; font: .6rem ui-monospace, monospace; letter-spacing: .12em; }.public-studio-section--split { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; }.public-studio-facts { display: grid; grid-template-columns: repeat(3, 1fr); gap: .7rem; align-self: center; }.public-studio-facts div, .public-studio-project-facts span { display: grid; gap: .4rem; padding: 1rem; border-left: 1px solid #79d9d2; background: rgba(16, 31, 37, .45); }.public-studio-facts strong { color: #79d9d2; }.public-studio-facts span, .public-studio-project-facts span { color: #9db5b9; font-size: .72rem; }.public-studio-page { min-height: 65vh; }.public-studio-page h1 { font-size: clamp(2.6rem, 6vw, 4.7rem); }.public-studio-game-list { display: grid; gap: .8rem; margin-top: 2rem; }.public-studio-prose { max-width: 760px; margin-top: 2rem; }.public-studio-empty { display: grid; gap: .45rem; margin-top: 2rem; padding: 1.5rem; border: 1px dashed rgba(121, 217, 210, .35); color: #a9c0c1; }.public-studio-empty strong { color: #e8f7f5; }.public-studio-note, .public-studio-checksum { color: #849b9e !important; font: .72rem ui-monospace, monospace; }.public-studio-project-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .7rem; max-width: 750px; margin: 2rem 0; }.public-studio-project-facts strong { color: #edfdf9; font-size: .85rem; }.public-studio-footer { display: flex; justify-content: space-between; max-width: 1280px; margin: 2rem auto 0; padding: 1.2rem 1.5rem; border-top: 1px solid rgba(164, 234, 230, .12); color: #71898d; font-size: .7rem; }.public-studio-footer span:last-child { display: flex; gap: 1rem; }
@media (max-width: 800px) { .public-studio-header { align-items: flex-start; flex-wrap: wrap; }.public-studio-header nav { order: 3; width: 100%; }.public-studio-hero { min-height: 0; padding: 5rem 0 3rem; flex-direction: column; align-items: flex-start; }.public-studio-hero__signal { align-self: center; width: 12rem; height: 12rem; }.public-studio-section--split { grid-template-columns: 1fr; }.public-studio-facts, .public-studio-project-facts { grid-template-columns: 1fr; }.public-studio-game-card, .public-studio-download-card { align-items: flex-start; flex-direction: column; }.public-studio-footer { flex-direction: column; gap: .8rem; } }
.public-studio-download-details { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin-top: 1.2rem; padding-top: 1rem; border-top: 1px solid rgba(121, 217, 210, .16); color: #a9c0c1; font-size: .84rem; line-height: 1.55; }
.public-studio-download-details strong { color: #e8f7f5; font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; }
.public-studio-download-details p, .public-studio-download-details ul { margin: .45rem 0 0; }
.public-studio-download-details ul { padding-left: 1.1rem; }
@media (max-width: 800px) { .public-studio-download-details { grid-template-columns: 1fr; width: 100%; } }
@media (max-width: 780px) { .studio-shell { display: block; }.studio-nav { width: 100%; min-height: auto; padding: .75rem 1rem; border-right: 0; border-bottom: 1px solid var(--studio-line); }.studio-nav__company { margin: .8rem .25rem .4rem; }.studio-nav__body { display: none; }.studio-nav__toggle:checked ~ .studio-nav__body { display: flex; }.studio-nav__toggle-button { display: flex; align-items: center; gap: .3rem; margin-left: auto; color: var(--studio-teal); cursor: pointer; font: .6rem ui-monospace, monospace; }.studio-nav__toggle-button span { display: block; width: 1rem; height: 1px; background: var(--studio-teal); }.studio-nav { position: relative; }.studio-nav__toggle-button { position: absolute; top: 1.25rem; right: 1rem; }.studio-topbar { display: none; }.studio-page-heading { align-items: flex-start; flex-direction: column; }.studio-dashboard-grid, .studio-review-grid { grid-template-columns: 1fr; }.studio-panel--wide { grid-row: auto; }.studio-board { grid-template-columns: repeat(4, 240px); }.studio-form-grid { grid-template-columns: 1fr 1fr; }.studio-art-grid { grid-template-columns: 1fr; } }
@media (max-width: 520px) { .studio-page { padding: 1rem; }.studio-metric-grid, .studio-project-grid, .studio-reference-grid, .studio-team-grid, .studio-form-grid { grid-template-columns: 1fr; }.studio-heading-actions { align-items: flex-start; flex-direction: column; }.studio-topbar__date { display: none; } }

/* Per-user account theme. Company Studio teal remains the company brand; these variables style the user's HQ and personal identity surfaces. */
.btn-primary { color: #071116; background: var(--user-accent-gradient); border-color: var(--user-accent-primary); box-shadow: 0 0 18px var(--user-accent-soft); }
.btn-primary:hover, .btn-primary:focus-visible { color: #071116; background: var(--user-accent-gradient); border-color: var(--user-accent-secondary); filter: brightness(1.08); }
.btn-outline-primary, .btn-secondary { border-color: var(--user-accent-border); background: var(--user-accent-soft); }
.btn-outline-primary:hover, .btn-secondary:hover { color: #071116; background: var(--user-accent-gradient); border-color: var(--user-accent-primary); }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline-color: var(--user-accent-primary); }
.system-nav__link:hover, .system-nav__link.active, .system-nav__switch:hover { border-left-color: var(--user-accent-primary); background: var(--user-accent-soft); }
.system-nav__link--account:hover { color: #fff; background: linear-gradient(90deg, var(--user-accent-soft), transparent); }
.system-nav__label, .system-nav__label--secondary, .system-nav__footer span { color: var(--user-accent-primary); }
.system-panel, .management-card, .project-panel, .card, .system-stat { border-color: var(--user-accent-border); }
.system-panel::before, .system-panel::after { border-color: var(--user-accent-primary); }
.system-panel--violet { border-color: var(--user-accent-border); }
.system-panel--violet::before, .system-panel--violet::after { border-color: var(--user-accent-secondary); }
.system-progress__value { background: var(--user-accent-gradient); box-shadow: 0 0 12px var(--user-accent-primary); }
.system-progress__label, .system-table thead th, .table thead th { color: var(--user-accent-primary); }
.system-table tbody tr:hover, .table tbody tr:hover { background: var(--user-accent-soft); }
.profile-editor, .profile-editor .management-card, .studio-profile-page { --profile-accent: var(--user-accent-primary); }
.profile-editor__preview, .profile-identity-grid > div, .studio-profile-page .studio-identity-grid div { border-color: var(--user-accent-primary); }
.profile-accent-chip, .profile-save-state, .studio-profile-page .studio-profile-image { border-color: var(--user-accent-primary); color: var(--user-accent-primary); }
.profile-avatar { border-color: var(--user-accent-primary); color: var(--user-accent-primary); box-shadow: 0 0 28px var(--user-accent-soft); }
.profile-editor__heading h1, .profile-editor .system-kicker, .studio-profile-page .studio-eyebrow { color: var(--user-accent-primary); }
.profile-editor .form-control, .profile-editor .form-select { border-color: var(--user-accent-border); }
.profile-editor .form-control:focus, .profile-editor .form-select:focus { border-color: var(--user-accent-primary); box-shadow: 0 0 0 3px var(--user-accent-soft), 0 0 18px var(--user-accent-soft); }
.profile-editor .profile-editor__actions .btn-primary { background: var(--user-accent-gradient); }
.profile-editor .text-muted, .profile-editor small, .profile-editor label, .profile-editor p, .profile-editor .management-card h2, .profile-editor .profile-identity-grid span, .profile-editor .profile-character-extension, .studio-profile-page p, .studio-profile-page .studio-identity-grid span { color: #fff !important; }
.system-manage-shell .system-section-header p, .system-manage-shell .management-card p, .system-manage-shell .management-card label, .system-manage-shell .management-card small, .system-manage-shell .text-muted { color: #fff !important; }
.system-manage-shell .nav-link { color: #fff; border-left: 2px solid transparent; }
.system-manage-shell .nav-link:hover, .system-manage-shell .nav-link.active { color: #fff; border-left-color: var(--user-accent-primary); background: var(--user-accent-soft); }
.profile-editor .form-control::placeholder { color: rgba(255, 255, 255, .76); }
.studio-nav__account { border-top-color: var(--user-accent-border); }
.studio-nav__avatar, .studio-profile-page .studio-profile-image { border-color: var(--user-accent-primary); color: var(--user-accent-primary); }
.studio-profile-page .studio-panel { border-color: var(--user-accent-border); }
.studio-profile-page .studio-button--primary { border-color: var(--user-accent-primary); background: var(--user-accent-gradient); color: #071116; }

.testing-environment-banner { position: sticky; top: 0; z-index: 2000; display: flex; align-items: center; justify-content: center; gap: .75rem; padding: .55rem 1rem; color: #07101f; background: linear-gradient(90deg, #ffd166, #ff9f68); font: .72rem var(--system-mono); letter-spacing: .08em; box-shadow: 0 3px 16px rgba(0, 0, 0, .28); }
.testing-environment-banner strong { font-weight: 800; }
.testing-environment-banner span { letter-spacing: .02em; }
.role-testing-center { max-width: 1500px; }
.role-testing-warning { margin: 1rem 0; padding: .9rem 1rem; border: 1px solid rgba(255, 209, 102, .5); color: #ffe4a3; background: rgba(102, 72, 14, .2); }
.role-testing-warning strong { color: #ffd166; }
.role-testing-controls { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.role-testing-controls label, .role-testing-preview h3 { display: block; color: var(--system-muted); font: .7rem var(--system-mono); letter-spacing: .08em; text-transform: uppercase; }
.role-testing-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; margin-top: 1rem; }
.role-testing-summary > div, .role-testing-facts > span { display: grid; gap: .35rem; padding: 1rem; border: 1px solid var(--system-line); background: rgba(11, 27, 49, .72); }
.role-testing-summary span, .role-testing-facts span { color: var(--system-muted); font: .65rem var(--system-mono); letter-spacing: .08em; text-transform: uppercase; }
.role-testing-summary strong, .role-testing-facts strong { color: var(--system-ice); font-size: 1rem; }
.role-testing-preview__header, .role-testing-section-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.role-testing-preview__header h2, .role-testing-section-heading h2 { margin: .25rem 0 0; color: var(--system-ice); }
.role-testing-status, .role-testing-badge { display: inline-flex; align-items: center; padding: .25rem .5rem; border: 1px solid currentColor; font: .64rem var(--system-mono); letter-spacing: .05em; text-transform: uppercase; white-space: nowrap; }
.role-testing-status, .role-testing-badge.is-allowed { color: #73f5c1; }
.role-testing-badge.is-denied { color: #ff87bd; }
.role-testing-badge.is-pending { color: #ffd166; }
.role-testing-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; margin: 1rem 0 1.25rem; }
.role-testing-table-wrap { overflow-x: auto; margin-top: 1rem; }
.role-testing-table-wrap table { min-width: 700px; }
.role-testing-table-wrap code { color: var(--system-cyan); }
.role-testing-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin-top: 1rem; }
.role-testing-list, .role-testing-workflows { display: grid; gap: .5rem; padding: 0; margin: 1rem 0 0; list-style: none; }
.role-testing-list li, .role-testing-workflows li { display: flex; justify-content: space-between; gap: 1rem; padding: .7rem .8rem; border-left: 2px solid var(--system-cyan); background: rgba(41, 96, 137, .12); color: var(--system-muted); }
.role-testing-list strong, .role-testing-workflows li span:last-child { color: var(--system-ice); }
.role-testing-empty { margin-top: 1rem; padding: 1rem; border: 1px dashed var(--system-line); color: var(--system-muted); background: rgba(4, 8, 20, .28); }
.role-testing-test-banner { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.2rem; padding: 1rem 1.2rem; border: 1px solid #ff5fa2; color: #ffd6e8; background: linear-gradient(110deg, rgba(112, 24, 74, .5), rgba(35, 31, 75, .72)); box-shadow: 0 0 24px rgba(255, 95, 162, .14); }
.role-testing-test-banner strong, .role-testing-test-banner span { display: block; }
.role-testing-test-banner strong { color: #ff9ec5; font: .86rem var(--system-mono); letter-spacing: .12em; }
.role-testing-test-banner span { margin-top: .35rem; color: #f1c9db; font-size: .78rem; }
.role-testing-dashboard__heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
.role-testing-dashboard__heading h1 { margin: .35rem 0 .5rem; color: var(--system-ice); font-size: clamp(2rem, 4vw, 3rem); }
.role-testing-dashboard__heading p { max-width: 720px; margin: 0; color: var(--system-muted); }
.role-testing-dashboard__facts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.role-testing-dashboard__facts code { color: var(--system-cyan); font-size: .78rem; }
.role-testing-dashboard-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; margin: 1rem 0; }
.role-testing-dashboard-card { min-height: 8rem; padding: 1rem; border: 1px solid var(--system-line); background: linear-gradient(145deg, rgba(21, 48, 75, .78), rgba(11, 23, 43, .9)); }
.role-testing-dashboard-card span { display: block; color: var(--system-muted); font: .65rem var(--system-mono); letter-spacing: .08em; text-transform: uppercase; }
.role-testing-dashboard-card strong { display: block; margin: .8rem 0 .5rem; color: var(--system-cyan); font: 1rem var(--system-mono); letter-spacing: .08em; }
.role-testing-dashboard-card p { margin: 0; color: var(--system-muted); font-size: .75rem; line-height: 1.45; }
.role-testing-preview-navigation { margin-top: 1rem; }
.role-testing-dashboard__footer-note { margin-top: 1rem; padding: .9rem 1rem; border-left: 2px solid #ff5fa2; color: var(--system-muted); background: rgba(67, 25, 55, .24); font-size: .76rem; line-height: 1.5; }
.role-testing-dashboard__footer-note strong { color: #ffb6d2; }
.studio-preview-tabs { display: flex; flex-wrap: wrap; gap: .4rem; margin: 0 0 1rem; padding: .55rem; border: 1px solid var(--studio-line); background: rgba(12, 28, 30, .58); }
.studio-preview-tab { padding: .45rem .7rem; border: 1px solid transparent; color: var(--studio-muted); font: .62rem ui-monospace, monospace; text-decoration: none; letter-spacing: .06em; text-transform: uppercase; }
.studio-preview-tab:hover, .studio-preview-tab:focus-visible, .studio-preview-tab.is-active { border-color: var(--studio-teal); color: var(--studio-ice); background: rgba(101, 210, 200, .1); }
.studio-preview-card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; }
.studio-panel--restricted { border-color: rgba(239, 142, 146, .55); }
@media (max-width: 800px) { .role-testing-controls, .role-testing-columns, .role-testing-facts { grid-template-columns: 1fr; } .role-testing-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); } .testing-environment-banner { align-items: flex-start; flex-direction: column; gap: .2rem; } }
@media (max-width: 900px) { .role-testing-dashboard-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 620px) { .role-testing-test-banner, .role-testing-dashboard__heading { align-items: flex-start; flex-direction: column; } .role-testing-dashboard-grid, .role-testing-dashboard__facts { grid-template-columns: 1fr; } }

/* Employee onboarding and confirmation deliberately use a Studio-only shell. */
.studio-auth-shell { display: flex; flex-direction: column; min-height: 100vh; padding: 1.5rem; }
.studio-auth-header, .studio-auth-footer { width: min(100%, 1120px); margin: 0 auto; }
.studio-auth-header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .7rem 0 1.5rem; border-bottom: 1px solid var(--studio-line); }
.studio-brand--auth-header { color: var(--studio-ice); text-decoration: none; }
.studio-brand--auth-header small { display: block; color: var(--studio-teal); font: .55rem ui-monospace, monospace; letter-spacing: .15em; }
.studio-auth-header__status { color: var(--studio-muted); font: .6rem ui-monospace, monospace; letter-spacing: .12em; }
.studio-auth-main { display: grid; flex: 1; place-items: center; width: min(100%, 1120px); margin: 0 auto; }
.studio-auth-footer { display: flex; justify-content: space-between; gap: 1rem; padding: 1.5rem 0 .5rem; color: var(--studio-muted); font: .65rem ui-monospace, monospace; }
.studio-auth-footer a { color: var(--studio-teal); }
.studio-auth-card { margin: 2rem auto; }
.studio-invitation-card { width: min(100%, 760px); }
.studio-auth-note { margin: 1rem 0; padding: .85rem 1rem; border-left: 2px solid #af8ce8; color: var(--studio-muted); background: rgba(80, 54, 130, .16); font-size: .78rem; line-height: 1.5; }
.studio-invitation-details { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .65rem; margin: 1.5rem 0; }
.studio-invitation-details span { display: grid; gap: .35rem; padding: .8rem; border: 1px solid var(--studio-line); color: var(--studio-muted); font: .62rem ui-monospace, monospace; letter-spacing: .08em; }
.studio-invitation-details strong { color: var(--studio-ice); font: 700 .78rem Inter, sans-serif; letter-spacing: 0; }
.studio-button--wide { width: 100%; }
.studio-alert--success { border-color: var(--studio-teal); color: var(--studio-teal); background: rgba(101, 210, 200, .1); }
@media (max-width: 600px) { .studio-auth-shell { padding: .75rem; } .studio-auth-header__status { display: none; } .studio-invitation-details { grid-template-columns: 1fr; } .studio-auth-footer { flex-direction: column; } }
@media (max-width: 780px) { .studio-preview-card-grid { grid-template-columns: 1fr; } }

.studio-identity-panel { margin-bottom: 1rem; padding: 1.25rem; border: 1px solid var(--studio-line); background: linear-gradient(140deg, rgba(42, 77, 79, .72), rgba(24, 37, 40, .92)); box-shadow: var(--studio-shadow); }
.studio-identity-panel__heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
.studio-identity-panel__heading h2 { margin: .3rem 0 0; color: var(--studio-ice); font-size: 1.25rem; }
.studio-identity-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .7rem; }
.studio-identity-grid div { min-width: 0; padding: .8rem; border-left: 2px solid var(--studio-teal); background: rgba(16, 32, 34, .5); }
.studio-identity-grid span { display: block; color: var(--studio-muted); font: .58rem ui-monospace, monospace; letter-spacing: .11em; }
.studio-identity-grid strong { display: block; margin-top: .35rem; color: var(--studio-ice); font-size: .88rem; overflow-wrap: anywhere; }
.studio-nav__link--disabled { cursor: not-allowed; opacity: .58; }
.studio-nav__link--disabled:hover { color: var(--studio-muted); border-left-color: transparent; background: transparent; }
@media (max-width: 780px) { .studio-identity-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .studio-identity-panel__heading { flex-direction: column; } .studio-identity-grid { grid-template-columns: 1fr; } }
.profile-editor { --profile-accent: var(--user-accent-primary); }
.profile-editor__heading { display:flex; justify-content:space-between; align-items:flex-start; gap:1rem; margin-bottom:1.5rem; }
.profile-save-state { display:inline-flex; align-items:center; min-height:2rem; padding:.35rem .65rem; border:1px solid currentColor; font: .68rem var(--system-mono); letter-spacing:.06em; text-transform:uppercase; white-space:nowrap; }
.profile-save-state--pending { color:#ffd166; background:rgba(111,78,12,.18); }
.profile-save-state--saved { color:#73f5c1; background:rgba(29,104,77,.14); }
.profile-editor__heading h1 { color: var(--profile-accent); }
.profile-editor__grid { display:grid; grid-template-columns:minmax(220px,.7fr) minmax(0,1.3fr); gap:1rem; }
.profile-editor__preview { text-align:center; border-top:2px solid var(--profile-accent); }
.profile-avatar { display:grid; place-items:center; width:5rem; height:5rem; border:2px solid var(--profile-accent); border-radius:50%; color:var(--profile-accent); background:#0b2027; font-weight:700; overflow:hidden; }
.profile-avatar--large { width:10rem; height:10rem; margin:0 auto 1rem; font-size:2rem; box-shadow:0 0 28px color-mix(in srgb, var(--profile-accent) 25%, transparent); }
.profile-avatar img { width:100%; height:100%; object-fit:cover; }
.profile-accent-chip { display:inline-block; padding:.3rem .6rem; border:1px solid var(--profile-accent); color:var(--profile-accent); border-radius:999px; font-size:.72rem; text-transform:uppercase; }
.profile-identity-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:.75rem; }
.profile-identity-grid > div { display:flex; flex-direction:column; gap:.25rem; padding:.8rem; border-left:2px solid var(--profile-accent); background:rgba(255,255,255,.03); }
.profile-identity-grid span { color:#91aeb2; font-size:.82rem; }
.profile-character-extension { border-style:dashed; }
.profile-editor__actions { display:flex; flex-wrap:wrap; align-items:center; gap:.65rem; }
.profile-editor__actions button:disabled { cursor:not-allowed; opacity:.55; }
.studio-nav__account { position:relative; padding-left:2.9rem; }
.studio-nav__avatar { position:absolute; left:0; top:.75rem; width:2rem; height:2rem; border:1px solid var(--profile-accent); border-radius:50%; object-fit:cover; color:var(--profile-accent); background:#0b2027; display:grid; place-items:center; font-size:.6rem; font-weight:700; }
.studio-nav__avatar--default { display:grid; }
.studio-profile-image { width:3.5rem; height:3.5rem; margin-bottom:.5rem; border:1px solid var(--user-accent-primary); border-radius:50%; object-fit:cover; }
@media (max-width: 760px) { .profile-editor__heading, .profile-editor__grid { display:block; } .profile-editor__preview { margin-bottom:1rem; } }

/* Studio uses the same authenticated user theme as HQ. */
.studio-shell { --studio-teal: var(--user-accent-primary); --studio-line: var(--user-accent-border); --studio-muted: #fff; }
.studio-nav__link:hover, .studio-nav__link.active, .studio-nav__switch:hover { color: #fff; border-left-color: var(--user-accent-primary); background: var(--user-accent-soft); }
.studio-nav__link span, .studio-nav__footer, .studio-nav__logout button { color: #fff; }
.studio-nav__account span, .studio-nav__footer span, .studio-nav__company small { color: var(--user-accent-primary); }
.studio-button--primary { border-color: var(--user-accent-primary); color: #071116; background: var(--user-accent-gradient); }
.studio-button--primary:hover, .studio-button--primary:focus-visible { color: #071116; border-color: var(--user-accent-secondary); background: var(--user-accent-gradient); filter: brightness(1.08); }
.studio-button:hover, .studio-button:focus-visible { border-color: var(--user-accent-primary); color: var(--user-accent-primary); }
.studio-panel__heading a, .studio-table a, .studio-text-link, .studio-eyebrow, .studio-status-pill, .studio-status, .studio-badge, .studio-avatar, .studio-progress b, .studio-reference-card__tag, .studio-activity__tag { color: var(--user-accent-primary); }
.studio-panel, .studio-metric, .studio-board__column, .studio-work-card, .studio-project-card, .studio-reference-card, .studio-person-card, .studio-workspace-card, .studio-nav__group, .studio-development-section, .studio-project-selector, .studio-review-row, .studio-art-card { border-color: var(--user-accent-border); }
.studio-panel__heading a:hover, .studio-table a:hover, .studio-text-link:hover { color: var(--user-accent-secondary); }
.studio-preview-tab:hover, .studio-preview-tab:focus-visible, .studio-preview-tab.is-active, .studio-review-row:hover, .studio-review-row.is-selected, .studio-development-section:hover, .studio-development-section:focus-visible, .studio-development-section.is-active, .studio-workspace-card:hover { border-color: var(--user-accent-primary); background: var(--user-accent-soft); }
.studio-progress progress { accent-color: var(--user-accent-primary); }
.studio-input:focus { outline-color: var(--user-accent-primary); border-color: var(--user-accent-primary); box-shadow: 0 0 0 3px var(--user-accent-soft); }
.studio-alert:not(.studio-alert--danger):not(.studio-alert--success) { background: var(--user-accent-soft); }
.studio-nav__link--primary { border-color: var(--user-accent-border); background: var(--user-accent-gradient); color: #071116; }
.studio-art-card__swatch { background: linear-gradient(145deg, var(--user-accent-primary), var(--user-accent-secondary) 48%, var(--studio-orange)); }
.studio-person-card code, .studio-activity small { color: #fff; }

.member-directory-filters { min-width: min(100%, 34rem); margin: 0; grid-template-columns: repeat(3, minmax(9rem, 1fr)); }
.member-directory-identity { display: inline-flex; align-items: center; gap: .65rem; min-width: 14rem; }
.member-directory-identity strong, .member-directory-identity small { display: block; }
.member-directory-identity small { margin-top: .2rem; color: #fff; line-height: 1.35; }
.member-directory-avatar { display: inline-grid; place-items: center; flex: 0 0 auto; width: 2.6rem; height: 2.6rem; border: 1px solid var(--user-accent-border); border-radius: 50%; object-fit: cover; color: #fff; background: var(--user-accent-soft); font-weight: 700; }
.member-directory-avatar--default { color: var(--user-accent-primary); }
.member-detail-grid { display: grid; grid-template-columns: 7rem minmax(0, 1fr); gap: 1rem; margin: 1rem 0 1.25rem; }
.member-detail-grid > div:last-child { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .65rem; }
.member-detail-grid > div:last-child > div { display: flex; flex-direction: column; gap: .2rem; padding: .75rem; border-left: 2px solid var(--user-accent-primary); background: rgba(255,255,255,.035); }
.member-detail-grid strong, .member-detail-grid span { color: #fff; }
.member-detail-grid strong { font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; }
@media (max-width: 760px) { .member-directory-filters, .member-detail-grid > div:last-child { grid-template-columns: 1fr; } .member-detail-grid { grid-template-columns: 1fr; } }
.member-management-actions, .member-mailbox-editor { display:flex; flex-wrap:wrap; align-items:center; gap:.55rem; margin:1rem 0; padding:.8rem; border:1px solid var(--user-accent-border); background:var(--user-accent-soft); }
.member-management-actions strong { color:#fff; margin-right:.35rem; }
.member-mailbox-editor { display:block; }
.member-mailbox-editor .management-actions { display:flex; flex-wrap:wrap; align-items:center; gap:.55rem; }
.member-mailbox-editor .form-control { max-width:28rem; }
.mail-layout { display:grid; grid-template-columns:minmax(13rem, .28fr) minmax(0, 1fr); gap:1rem; align-items:start; }
.mail-sidebar { margin-top:1rem; }
.mail-content { min-height:32rem; }
.mail-toolbar { margin-top:1rem; }
.mail-toolbar .management-actions { display:flex; flex-wrap:wrap; align-items:center; gap:.65rem; }
.mail-toolbar label { color:#fff; font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; }
.mail-toolbar .form-select { max-width:24rem; }
.mail-folders { display:grid; gap:.3rem; margin-top:1rem; }
.mail-folder-button { display:flex; justify-content:space-between; align-items:center; width:100%; padding:.7rem .8rem; border:1px solid transparent; color:#fff; background:rgba(255,255,255,.035); text-align:left; }
.mail-folder-button:hover, .mail-folder-button:focus-visible, .mail-folder-button.active { border-color:var(--user-accent-border); color:#fff; background:var(--user-accent-soft); }
.mail-unread-count { min-width:1.35rem; padding:.1rem .35rem; border-radius:999px; color:#071116; background:var(--user-accent-gradient); font-size:.7rem; text-align:center; }
.mail-section-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:1rem; margin-bottom:1rem; }
.mail-section-heading h2 { margin:.3rem 0 0; }
.mail-search { display:flex; gap:.5rem; width:min(100%, 25rem); }
.mail-message-list { display:grid; gap:.4rem; }
.mail-message-row { display:flex; justify-content:space-between; gap:1rem; width:100%; padding:.85rem; border:1px solid var(--system-line); color:#fff; background:rgba(2,10,24,.58); text-align:left; }
.mail-message-row:hover, .mail-message-row:focus-visible { border-color:var(--user-accent-primary); background:var(--user-accent-soft); }
.mail-message-row.unread { border-left:3px solid var(--user-accent-primary); background:rgba(90,30,130,.18); }
.mail-message-row span { display:flex; flex-direction:column; gap:.25rem; min-width:0; }
.mail-draft-open { display:flex; justify-content:space-between; gap:1rem; flex:1; border:0; color:#fff; background:transparent; text-align:left; }
.mail-message-row span:last-child { flex:1; align-items:flex-end; text-align:right; }
.mail-message-row small, .mail-message-row time { color:#fff; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mail-recipient-composer { display:flex; flex-wrap:wrap; align-items:center; gap:.4rem; min-height:2.75rem; margin:.45rem 0 .35rem; padding:.35rem; border:1px solid var(--system-line); background:rgba(2,10,24,.82); }
.mail-recipient-composer:focus-within { border-color:var(--user-accent-primary); box-shadow:0 0 0 1px var(--user-accent-border); }
.mail-recipient-chip { display:inline-flex; align-items:center; gap:.45rem; max-width:100%; padding:.35rem .45rem .35rem .65rem; border:1px solid var(--user-accent-border); color:#fff; background:var(--user-accent-soft); font-size:.75rem; }
.mail-recipient-chip span { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mail-recipient-chip small { display:block; color:#fff; font-size:.63rem; }
.mail-recipient-chip button { border:0; color:#fff; background:transparent; cursor:pointer; font-size:1rem; line-height:1; }
.mail-recipient-input { flex:1 1 12rem; min-width:10rem; border:0; outline:0; color:#fff; background:transparent; }
.mail-recipient-input::placeholder { color:rgba(255,255,255,.72); }
.mail-recipient-suggestions { display:grid; gap:.2rem; margin:.35rem 0 1rem; padding:.35rem; border:1px solid var(--user-accent-border); background:rgba(2,10,24,.96); }
.mail-recipient-suggestions button { display:grid; gap:.2rem; padding:.55rem .65rem; border:0; color:#fff; background:transparent; text-align:left; cursor:pointer; }
.mail-recipient-suggestions button:hover, .mail-recipient-suggestions button:focus-visible { outline:0; background:var(--user-accent-soft); }
.mail-recipient-suggestions small { color:#fff; font-size:.68rem; }
.mail-body-editor, .mail-message-body { min-height:14rem; color:#fff; background:rgba(2,10,24,.82); white-space:pre-wrap; }
.mail-message-body { margin:1rem 0 0; padding:1rem; border:1px solid var(--system-line); font:inherit; line-height:1.6; }
@media (max-width: 820px) { .mail-layout { grid-template-columns:1fr; } .mail-section-heading { flex-direction:column; } .mail-search { width:100%; } }
.studio-checklist { display: grid; gap: .65rem; padding: 0; margin: 1rem 0 0; list-style: none; }.studio-checklist li { display: flex; align-items: flex-start; gap: .7rem; padding: .8rem; border: 1px solid var(--studio-line); color: var(--studio-muted); }.studio-checklist li.is-complete { border-color: rgba(103, 232, 219, .45); color: var(--studio-ice); }.studio-checklist li > span { color: var(--studio-teal); font-weight: 700; }.studio-checklist li > div { flex: 1; }.studio-checklist strong { display: block; color: var(--studio-ice); }.studio-checklist small { display: block; margin-top: .25rem; line-height: 1.5; }.studio-policy { margin-top: .75rem; border: 1px solid var(--studio-line); color: var(--studio-muted); }.studio-policy summary { display: flex; justify-content: space-between; gap: 1rem; padding: .85rem 1rem; color: var(--studio-ice); cursor: pointer; }.studio-policy summary span { color: var(--studio-muted); font: .65rem ui-monospace, monospace; }.studio-policy__content { padding: 0 1rem 1rem; white-space: pre-wrap; line-height: 1.6; }.studio-panel--accent { border-color: rgba(228, 126, 255, .5); box-shadow: 0 0 2rem rgba(153, 72, 218, .1); }
.company-brand-logo { display:block; width:auto; max-width:12rem; max-height:4rem; margin:.5rem 0 1rem; object-fit:contain; }
.studio-company-brand { position:fixed; top:.8rem; right:1rem; z-index:4; display:flex; align-items:center; gap:.5rem; color:var(--studio-ice); font-size:.7rem; letter-spacing:.08em; }
.studio-company-brand img { width:auto; max-width:7rem; max-height:2.2rem; object-fit:contain; }
.company-branding-preview { display:flex; align-items:center; gap:1rem; max-width:30rem; margin:.75rem 0 1rem; padding:.75rem; border:1px solid var(--system-line); background:rgba(2,10,24,.55); }
.company-branding-preview__image { max-width:14rem; max-height:6rem; margin:0; }
.company-branding-preview small { display:block; margin-top:.25rem; color:var(--system-muted); }
.branding-upload-progress { color:var(--system-muted); }
.studio-nav__company-logo { flex:0 0 56px; width:56px; height:44px; max-width:56px; margin:0; object-fit:contain; }
@media (max-width: 1050px) { .studio-nav__company-logo { flex-basis:52px; width:52px; max-width:52px; height:40px; } }
@media (max-width: 780px) { .studio-brand { gap:.5rem; } }