/* Presentation layer. Layout/semantic tokens override the legacy Shinoda palette. */
:root{--brand-radius:6px;--brand-width:1680px;--brand-logo-width:152px;--brand-primary:#edb337;--brand-secondary:#e86b2e;--brand-button-text:#160d03;--brand-font:system-ui,sans-serif;--brand-heading-font:Georgia,serif;--brand-image:none;--brand-watermark:none;--brand-overlay:.85;--console-bg:#07111a;--console-text:#c4e5ff;--console-accent:#62beff;--editor-bg:#101112;--editor-text:#d6e4ee}
html,body{font-family:var(--brand-font);background:var(--bg);color:var(--text)}
body{background-image:linear-gradient(color-mix(in srgb,var(--bg) calc(var(--brand-overlay)*100%),transparent),color-mix(in srgb,var(--bg) calc(var(--brand-overlay)*100%),transparent)),var(--brand-image);background-size:cover;background-attachment:fixed;overflow-x:clip}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:-1}
body[data-background="glow"]{background-image:radial-gradient(ellipse at 0 0,color-mix(in srgb,var(--brand-primary) 12%,transparent),transparent 50%),radial-gradient(ellipse at 100% 30%,color-mix(in srgb,var(--brand-secondary) 10%,transparent),transparent 50%),linear-gradient(color-mix(in srgb,var(--bg) calc(var(--brand-overlay)*100%),transparent),color-mix(in srgb,var(--bg) calc(var(--brand-overlay)*100%),transparent)),var(--brand-image)}
body[data-background="grid"]{background-image:linear-gradient(color-mix(in srgb,var(--text) 3%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--text) 3%,transparent) 1px,transparent 1px),linear-gradient(color-mix(in srgb,var(--bg) calc(var(--brand-overlay)*100%),transparent),color-mix(in srgb,var(--bg) calc(var(--brand-overlay)*100%),transparent)),var(--brand-image);background-size:40px 40px,40px 40px,cover,cover}
.login-shell{background:transparent}.login-shell::before{background-image:var(--brand-watermark)}
.login-card{background:var(--surface);border-color:var(--line);border-radius:var(--brand-radius)}
.login-card::before,.settings-card::before,.file-card::before,.warning-vault::before{display:none}
.login-card h1,.page-heading h2,.operations-pane-heading h3,.operations-console-heading h3,.warning-card h3,.dev-activity-card h3{color:var(--text);font-family:var(--brand-heading-font);text-shadow:none}
.login-copy,.page-heading p:not(.eyebrow),.secure-note,.operations-pane-heading p:not(.eyebrow),.operations-console-heading p:not(.eyebrow){color:var(--muted)}
.topbar{background:var(--surface);border-color:var(--line);height:auto;min-height:76px;flex-wrap:wrap;gap:10px;padding:10px 22px}
.brand{min-width:0;flex:0 1 auto}.brand-logo{width:var(--brand-logo-width);max-width:var(--brand-logo-width);height:52px;object-fit:contain;flex:none}.brand-logo[hidden],.login-logo[hidden]{display:none!important}
.brand .brand-panel{max-width:170px;overflow-wrap:anywhere;color:var(--brand-primary);font-weight:850;font-size:10px;letter-spacing:.1em}
.login-logo{width:min(310px,100%);height:112px;object-fit:contain}.tabs{flex:1 1 500px;height:48px;min-width:0;margin-left:14px;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;white-space:nowrap;gap:1px}
.tab{padding:0 12px;flex:none;color:var(--muted)}.tab.active,.tab:hover{color:var(--text)}.tab::after{background:linear-gradient(90deg,var(--brand-primary),var(--brand-secondary))}
.account-area{gap:8px;flex-wrap:wrap}.scope-badge{background:var(--surface-2);border-color:var(--line);color:var(--brand-primary)}
.workspace,.workspace.operations-mode{width:min(var(--brand-width),100%);min-width:0}.panel-view{min-width:0}
.operations-layout{grid-template-columns:minmax(0,1.7fr) minmax(360px,1fr)}
.operations-pane-heading{border-bottom-color:var(--line);border-left-color:var(--brand-primary)}
.operations-console-heading{border-bottom-color:var(--line);border-left-color:var(--console-accent)}
.file-card,.settings-card,.task-column,.warning-vault,.forum-sidebar,.forum-main,.journal-archive,.security-profile,.security-alert,.pole-card,.account-stat,.account-record,.warning-card,.task-card,.modal-card,.forum-thread,.forum-post{background:var(--surface);border-color:var(--line);border-radius:var(--brand-radius);color:var(--text)}
.toolbar,.data-table th,.task-column>header,.forum-sidebar-head,.vault-head,.log-day-head,.accounts-toolbar,.account-create-card>summary,.account-record[open],.account-record.inactive,.profile-editor,.profile-editor-footer,.task-meta span,.task-count,.forum-thread-head,.forum-post-head{background:var(--surface-2);border-color:var(--line);color:var(--text)}
.data-table td,.account-record,.task-controls,.warning-controls,.forum-category-group,.forum-thread-row,.forum-post,.profile-editor-section,.account-create-form,.profile-editor-fields,.account-record .profile-editor{border-color:var(--line)}
.account-record .profile-editor,.profile-editor-fields,.account-record-body,.warning-evidence{background:var(--surface)}
.data-table tbody tr:hover,.account-record-summary:hover,.account-create-card>summary:hover,.forum-nav.active,.forum-category.active,.forum-nav:hover,.forum-category:hover,.crumb:hover,.crumb:last-child{background:var(--surface-2);color:var(--text)}
.account-stat strong,.account-summary-action,.account-chevron,.account-avatar,.archive-title,.file-icon,.file-icon.config,.eyebrow,.forum-seal,.vault-icon{color:var(--brand-primary)}
.account-stat span,.account-create-card>summary small,.account-identity small,.account-access-summary,.account-field small,.profile-editor-footer>span,.account-list-summary,.account-empty,.field-help,.task-description,.task-meta,.task-empty,.warning-reason,.warning-meta,.warning-evidence p,.forum-category,.forum-nav,.forum-category.child,.forum-post-meta,.forum-thread-meta,.dev-activity-empty{color:var(--muted)}
.account-field,.grade-section-heading,.profile-editor-section h5,.settings-card label,.login-card label,.warning-category,.warning-reference,.forum-post-content,.forum-thread-description{color:var(--text)}
.account-avatar,.account-create-icon,.forum-seal,.vault-icon,.warning-category,.forum-category b,.forum-nav b,.priority-badge,.task-meta span{background:var(--surface-2);border-color:var(--line)}
.button,.icon-button,.space-switcher,.space-button,.permission-chip,.row-button,.studio-field input,.studio-field select{border-radius:var(--brand-radius)}
.button.primary,.space-button.active,.vscode-footer .button.primary{background:linear-gradient(120deg,var(--brand-primary),var(--brand-secondary));color:var(--brand-button-text);border-color:var(--brand-primary);box-shadow:none}
.button.primary:hover,.vscode-footer .button.primary:hover{background:var(--brand-primary);filter:brightness(1.08)}
.button.secondary,.icon-button,.space-switcher{background:var(--surface-2);border-color:var(--line);color:var(--text)}
.button.secondary:hover,.button.ghost:hover,.icon-button:hover,.row-button:hover{background:color-mix(in srgb,var(--surface-2) 88%,var(--text));border-color:var(--brand-primary);color:var(--text)}
.button.ghost{color:var(--text);border-color:var(--line)}
.button.danger,.toast.error{color:var(--red);background:color-mix(in srgb,var(--red) 12%,var(--surface));border-color:var(--red)}
.permission-chip.on,.integrity-card.good,.account-status.active{color:var(--green);border-color:var(--green);background:color-mix(in srgb,var(--green) 10%,var(--surface))}
.warning-note,.warning-level,.confidential-badge{color:var(--amber);border-color:var(--amber);background:color-mix(in srgb,var(--amber) 10%,var(--surface))}
.integrity-dot{background:var(--green);box-shadow:0 0 10px var(--green)}.outcome.success{color:var(--green)}.outcome.started{color:var(--amber)}
.role-badge,.role-badge.admin,.role-badge.dev,.role-badge.resp_dev,.role-badge.resp_modo,.role-badge.modeler,.role-badge.gd{background:var(--surface-2);color:var(--brand-primary)}
.grade-choice{background:var(--surface);border-color:var(--line);color:var(--text)}
.grade-choice:has(input:checked),.grade-choice:has(input[value="modeler"]:checked){background:var(--surface-2);border-color:var(--brand-primary);box-shadow:inset 3px 0 var(--brand-primary)}
body input:not([type="checkbox"]):not([type="color"]):not([type="file"]),body select,body textarea:not(#editorContent){background:var(--bg);color:var(--text);border-color:var(--line);border-radius:var(--brand-radius)}
body input::placeholder,body textarea::placeholder{color:var(--muted);opacity:.8}
body input[type="checkbox"]{accent-color:var(--brand-primary)}
body input:focus-visible,body textarea:focus-visible,body select:focus-visible,body button:focus-visible,body summary:focus-visible{outline:2px solid var(--brand-primary);outline-offset:3px;box-shadow:none}
.operations-console-pane .console-card,.operations-console-pane .console-live,.dev-activity-card{border-color:var(--console-accent);background:var(--console-bg);color:var(--console-text);border-radius:var(--brand-radius)}
.operations-console-pane .console-toolbar,.operations-console-pane .console-footer,.dev-activity-card>header{background:color-mix(in srgb,var(--console-bg) 92%,var(--console-accent));border-color:color-mix(in srgb,var(--console-bg) 60%,var(--console-accent));color:var(--console-text)}
.operations-console-pane .console-viewport{background:var(--console-bg);scrollbar-color:var(--console-accent) var(--console-bg)}
.console-line{color:var(--console-text)}.console-line.command,.operations-console-pane .console-readonly,.console-heading code,.operations-console-heading code{color:var(--console-accent)}
.console-line.error{color:var(--console-error)}.console-line.warning{color:var(--console-warning)}.console-line.connection,.console-line.success{color:var(--console-success)}
.console-source strong,.dev-activity-row strong,.dev-activity-card h3{color:var(--console-text)}
.console-source small,.console-live small,.console-footer,.dev-activity-row time,.dev-activity-row>div span{color:color-mix(in srgb,var(--console-text) 65%,var(--console-bg))}
.operations-console-pane .console-source>span,.dev-activity-status{color:var(--console-accent);border-color:var(--console-accent);background:var(--console-bg)}
.operations-console-pane .console-live-dot.online{background:var(--green);box-shadow:0 0 10px var(--green)}
.editor-modal .vscode-shell,.vscode-titlebar,.vscode-tabs,.vscode-tab,.vscode-editor-pane,.vscode-body,.vscode-footer,.editor-modal .editor-tools,.vscode-breadcrumb,.editor-modal .editor-workspace,.editor-code-pane,.editor-modal .editor-workspace pre{background:var(--editor-bg);border-color:color-mix(in srgb,var(--editor-text) 20%,var(--editor-bg));color:var(--editor-text)}
.editor-modal .vscode-shell{border-radius:var(--brand-radius)}
.editor-overlay-line{color:var(--editor-text)}
.syntax-key{color:var(--syntax-key)}.syntax-value{color:var(--syntax-value)}.syntax-string{color:var(--syntax-string)}.syntax-number{color:var(--syntax-number)}.syntax-boolean{color:var(--syntax-boolean)}.syntax-variable{color:var(--syntax-variable)}.syntax-punctuation{color:var(--syntax-punctuation)}.syntax-comment{color:var(--syntax-comment)}
/* The textarea remains transparent: the virtualized highlight layer renders the text. */
.editor-modal .editor-workspace textarea,.editor-modal .editor-workspace textarea[readonly]{background:transparent;color:transparent;caret-color:var(--editor-text)}
.vscode-statusbar{background:var(--brand-primary);color:var(--brand-button-text)}
.vscode-title,.vscode-title strong,.vscode-breadcrumb span:last-child,.vscode-footer>span,.editor-search-count{color:var(--editor-text)}
.vscode-tab.active::before,.vscode-app-mark{background:var(--brand-primary)}
.toast{background:var(--surface-2);border-color:var(--brand-primary);color:var(--text);border-radius:var(--brand-radius)}
.brand-footer{text-align:center;padding:16px 24px 30px;color:var(--muted);font-size:12px;overflow-wrap:anywhere}.brand-footer:empty{display:none}
.brand-recovery-notice{position:relative;z-index:30;margin:0;padding:10px 20px;background:#fff2c5;color:#332710;font:13px/1.5 system-ui,sans-serif;text-align:center}

/* Original customization studio — inspired by modular CMS administration, not its artwork. */
.studio-hero{display:flex;align-items:center;justify-content:space-between;gap:24px;margin:0 0 26px;padding:16px 0 26px;border-bottom:1px solid var(--line)}
.studio-hero h2{font:600 clamp(28px,3vw,42px)/1.2 var(--brand-heading-font);letter-spacing:-.03em;color:var(--text);margin:10px 0}.studio-hero p:not(.eyebrow){color:var(--muted);max-width:640px;line-height:1.6;margin:0}
.studio-badge{white-space:nowrap;padding:9px 13px;border:1px solid var(--line);border-radius:999px;font-size:10px;letter-spacing:.1em;color:var(--brand-primary)}
.studio-actions{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-bottom:18px;padding:14px 18px;background:var(--surface);border:1px solid var(--line);border-radius:var(--brand-radius)}
.studio-actions>span{font-size:12px;color:var(--muted)}.studio-actions>div{display:flex;gap:8px;flex-wrap:wrap}
.studio-layout{display:grid;grid-template-columns:220px minmax(0,1fr) 250px;gap:24px;align-items:start}.studio-form{min-width:0;display:grid;gap:18px}
.studio-sections{display:grid;gap:7px;position:sticky;top:110px}.studio-sections .button{text-align:left;padding:14px;border-color:transparent;background:transparent;color:var(--muted);font-size:12px}
.studio-sections .button.selected{background:var(--surface);border-color:var(--line);color:var(--brand-primary);box-shadow:inset 3px 0 var(--brand-primary)}
.studio-card{background:var(--surface);padding:24px;border:1px solid var(--line);border-radius:var(--brand-radius);min-width:0}.studio-card h3{font-size:18px;margin:0 0 9px;color:var(--text)}
.studio-copy,.studio-help p,.studio-help li{color:var(--muted);font-size:12px;line-height:1.7}.studio-card .studio-copy{margin:0 0 22px}.studio-card>.button{margin:12px 8px 0 0}
.studio-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}.studio-field{display:grid;gap:8px;margin:0 0 18px;min-width:0;color:var(--text);font-size:12px}.studio-field input,.studio-field textarea,.studio-field select,.studio-nav-row>input{width:100%;min-width:0;border:1px solid var(--line);padding:11px 12px;font:inherit}.studio-field small{font-size:11px;color:var(--muted);line-height:1.5}.studio-field textarea{resize:vertical;min-height:80px}.studio-field input[type="color"]{padding:4px;height:42px;background:var(--bg);cursor:pointer}
.studio-help{position:sticky;top:110px;border-left:1px solid var(--line);padding:10px 0 10px 22px}.studio-help h3{font-size:20px;line-height:1.45;margin:14px 0}.studio-help ol{padding-left:18px}.studio-help li{margin-bottom:10px}.studio-help hr{border:0;border-top:1px solid var(--line);margin:24px 0}.studio-help h4{font-size:13px;margin:0 0 8px}
.studio-presets{display:grid;grid-template-columns:1fr 1fr;gap:10px}.studio-presets>.button{display:grid;gap:8px;text-align:left;padding:16px;background:var(--bg);border-color:var(--line)}.studio-presets strong{font-size:14px}.studio-presets small{color:var(--muted);font-weight:400;line-height:1.5}.studio-swatches{display:flex;gap:5px}.studio-swatches i{height:19px;width:19px;border-radius:50%;border:1px solid var(--line)}
.studio-image-sample{min-height:110px;background:var(--bg);border:1px dashed var(--line);border-radius:var(--brand-radius);display:grid;place-items:center;padding:18px;margin:14px 0;color:var(--muted);font-size:12px}.studio-image-sample img{display:block;width:auto;max-width:100%;height:100px;object-fit:contain}.studio-card input[type="file"]{max-width:100%;font-size:12px;color:var(--muted)}
.studio-nav-row{display:grid;grid-template-columns:140px minmax(100px,1fr) 38px 38px;align-items:center;gap:8px;padding:13px 0;border-bottom:1px solid var(--line)}.studio-nav-row:last-child{border:0}.studio-visibility{display:flex;align-items:center;gap:8px;font-size:12px}.studio-nav-row .button{padding:8px}
.brand-preview-bar{position:fixed;bottom:14px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:12px;z-index:300;max-width:calc(100% - 24px);padding:12px 18px;background:#f5f6fa;color:#172136;border:2px solid #435ab0;border-radius:10px;box-shadow:0 10px 50px #0008;font:12px system-ui,sans-serif}.brand-preview-bar .button{background:#e4e8f2;color:#172136;border-color:#a4b0cb;border-radius:6px}.brand-preview-bar strong{white-space:nowrap}
body[data-density="compact"] .data-table td{padding-block:9px}body[data-density="compact"] .account-record-summary{padding-block:9px}body[data-density="compact"] .task-card{padding:9px}
@media(min-width:1280px){body[data-navigation="sidebar"] .topbar{position:fixed;inset:0 auto 0 0;width:245px;max-height:100dvh;overflow-y:auto;display:flex;flex-direction:column;align-items:stretch;flex-wrap:nowrap;padding:24px 16px;border-right:1px solid var(--line);border-bottom:0;gap:18px}body[data-navigation="sidebar"] .brand{flex:none;flex-direction:column;align-items:flex-start;gap:8px}body[data-navigation="sidebar"] .brand-logo{max-width:205px}body[data-navigation="sidebar"] .tabs{flex:1 0 auto;flex-direction:column;width:100%;height:auto;overflow:visible;margin:0;gap:6px;white-space:normal}body[data-navigation="sidebar"] .tab{height:44px;text-align:left;border-radius:var(--brand-radius)}body[data-navigation="sidebar"] .tab.active{background:var(--surface-2)}body[data-navigation="sidebar"] .account-area{margin:0;flex:none;border-top:1px solid var(--line);padding-top:18px;font-size:11px}body[data-navigation="sidebar"] .workspace{margin-left:245px;margin-right:0;width:min(var(--brand-width),calc(100% - 245px))}body[data-navigation="sidebar"] .operations-layout{grid-template-columns:minmax(0,1.5fr) minmax(350px,1fr)}body[data-navigation="sidebar"] .studio-layout{grid-template-columns:185px minmax(0,1fr)}body[data-navigation="sidebar"] .studio-help{position:static;grid-column:2}body[data-navigation="sidebar"] .studio-sections{top:24px}}
@media(max-width:1450px){.studio-layout{grid-template-columns:190px minmax(0,1fr)}.studio-help{position:static;grid-column:2}.operations-layout{grid-template-columns:minmax(0,1fr)}.operations-console-pane{position:static}}
@media(max-width:1050px){.topbar{padding:10px 14px}.tabs{order:3;flex-basis:100%;width:100%;margin:0;height:44px}.studio-actions{align-items:flex-start;flex-direction:column}.studio-layout{grid-template-columns:1fr}.studio-sections{position:static;display:flex;overflow-x:auto;gap:5px}.studio-sections .button{white-space:nowrap;flex:none}.studio-help{grid-column:auto}.studio-hero{gap:12px}.studio-badge{display:none}}
@media(max-width:650px){.studio-grid,.studio-presets{grid-template-columns:1fr}.studio-card{padding:18px}.studio-nav-row{grid-template-columns:1fr 38px 38px}.studio-visibility{grid-column:1/-1}.studio-hero h2{font-size:29px}.studio-actions .button{font-size:11px}.brand-preview-bar{flex-wrap:wrap;width:calc(100% - 24px);gap:7px}.brand-preview-bar strong{width:100%}.operations-layout{display:block}.operations-console-pane{margin-top:20px}.studio-sections .button{padding:11px}.brand .brand-panel{max-width:100px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}