/* Studio chrome on the VERSEVA Baseline register (design-core: structure from the fundament, values from tokens only). Components come verbatim from verseva-components.css; this file adds layout and the Studio-only recipes. */
*{box-sizing:border-box}
html{background:var(--bg)}
body{margin:0;background:var(--bg);color:var(--text-1);font-family:var(--font-sans);font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased}
h1,h2,h3,p,figure,fieldset,dl,dd{margin:0}fieldset{padding:0;border:0;min-width:0}legend{padding:0;font-weight:600;font-size:.875rem}
button,input,textarea,select{font:inherit}button{cursor:pointer;color:inherit}a{color:inherit}
button,a,input,select,textarea{touch-action:manipulation}
button:disabled{cursor:not-allowed}
:where(a,summary,.text-link,.back-button,.entry-row,.request-row):focus-visible{outline:2px solid var(--focus);outline-offset:2px}
[hidden]{display:none!important}
h1{font-family:var(--font-display);font-weight:var(--display-weight);font-size:1.75rem;line-height:1.1;letter-spacing:-.015em;overflow-wrap:anywhere}
h2{font-family:var(--font-display);font-weight:var(--heading-weight);font-size:1.25rem;line-height:1.2;overflow-wrap:anywhere}
h3{font-size:1rem;font-weight:600}
.help{font-size:.75rem;color:var(--text-2)}
.break-text{overflow-wrap:anywhere}
.skip-link{position:fixed;left:var(--s-4);top:-80px;z-index:100;background:var(--surface);padding:var(--s-3);border-radius:var(--r-sm)}.skip-link:focus{top:var(--s-4)}
.session-loading{min-height:100dvh;display:flex;gap:var(--s-3);align-items:center;justify-content:center;color:var(--text-2)}
.noscript{padding:var(--s-5);text-align:center}
/* sign in */
.login{padding:var(--s-6);min-height:100dvh}
.login-main{width:min(100%,420px);margin:clamp(40px,10vh,112px) auto 0}
.login-mark{font-family:var(--font-display);font-weight:var(--display-weight);font-size:2.6rem;letter-spacing:-.02em;line-height:1;margin-bottom:var(--s-6)}
.login-form{display:grid;gap:var(--s-4)}
.login-form h1{font-size:1.5rem}
.login-form .btn{justify-content:center}
.form-error{color:var(--danger);font-size:.875rem;line-height:1.5}
.text-link{border:0;padding:var(--s-2) 0;min-height:44px;background:none;text-decoration:underline;text-underline-offset:4px;text-align:left;font-size:.875rem;color:var(--text-2)}.text-link:hover{color:var(--text-1)}
/* fields beyond the package contract */
.field input[type=checkbox]{height:auto}
.field textarea{min-height:120px}
.field input:disabled,.field select:disabled,.field textarea:disabled{background:var(--surface-2);color:var(--text-2);cursor:not-allowed}
.field-boolean{padding:var(--s-2) 0}
.field-list{display:grid;gap:var(--s-3)}
.list-rows{display:grid;gap:var(--s-3)}
.list-row{padding:var(--s-4);display:grid;gap:var(--s-3);box-shadow:none}
.list-row-head{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);flex-wrap:wrap}
.list-row-actions{display:flex;gap:var(--s-1)}
.list-row-fields{display:grid;gap:var(--s-3)}
.md-bar{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3)}
.markdown-input{font-family:var(--font-mono);font-size:.875rem;line-height:1.7;min-height:360px;tab-size:2}
.md-preview{border:1px solid var(--hairline);border-radius:var(--r-sm);padding:var(--s-4);min-height:120px;overflow-wrap:anywhere}
.md-preview img{max-width:100%;height:auto}
.image-field{display:grid;gap:var(--s-2)}
.image-preview{width:100%;max-width:320px;aspect-ratio:16/10;object-fit:cover;border-radius:var(--r-sm);background:var(--surface-2)}
.image-actions{display:flex;gap:var(--s-2);flex-wrap:wrap}
/* shell */
.studio{display:grid;grid-template-columns:240px minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);min-height:100dvh}
.topbar{grid-column:1/-1;position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:var(--s-3);height:56px;padding:0 var(--s-4);border-bottom:1px solid var(--hairline);background:var(--surface)}
.studio-mark{font-family:var(--font-display);font-weight:var(--display-weight);letter-spacing:-.01em}
.topbar-brand{margin-left:auto;font-size:.875rem;color:var(--text-2)}
.topbar-site{font-size:.875rem;color:var(--text-2);text-decoration:underline;text-underline-offset:2px}
.topbar-site:hover{color:var(--text-1)}
.topbar-site:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.menu-toggle{display:none}
.menu-toggle svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}
.sidebar{position:sticky;top:56px;align-self:start;height:calc(100dvh - 56px);display:flex;flex-direction:column;gap:var(--s-5);padding:var(--s-5) var(--s-4);border-right:1px solid var(--hairline);background:var(--bg);overflow:auto}
.brand-field select{width:100%}
.studio-nav{display:grid;gap:var(--s-4)}
.studio-nav .sgroup{margin-top:0}
.sidebar-bottom{margin-top:auto;display:grid;gap:var(--s-1)}
.account-email{font-size:.8125rem;color:var(--text-2);overflow-wrap:anywhere}
.workspace{min-width:0;padding:var(--s-6) clamp(20px,3.3vw,52px) var(--s-8);outline:none}
.page-heading{display:flex;align-items:center;justify-content:space-between;gap:var(--s-5);margin-bottom:var(--s-6);flex-wrap:wrap}
.heading-group{display:flex;align-items:baseline;gap:var(--s-3);min-width:0}
.heading-count{font-size:1rem;color:var(--text-2);font-variant-numeric:tabular-nums}
.page-actions{display:flex;align-items:center;gap:var(--s-2);flex-wrap:wrap}
.filters{display:flex;gap:var(--s-3);margin-bottom:var(--s-5);align-items:center;flex-wrap:wrap}
.filters .searchbox{flex:1;min-width:200px;max-width:440px}
.searchbox svg{fill:none;stroke:currentColor;stroke-width:1.6}
.status-filter{width:180px}
/* states trio */
.loading-state{display:grid;gap:var(--s-3);padding:var(--s-6) var(--s-5);color:var(--text-2);font-size:.875rem}
.loading-state .skel:nth-child(3){width:70%}.loading-state .skel:nth-child(4){width:45%}
.error-state{align-items:center;justify-content:space-between;flex-wrap:wrap}
.empty span{color:var(--text-2)}
/* entry rows */
.entry-row{width:100%;text-align:left;border:0;background:var(--surface);min-height:64px}
.entry-row .badge{flex:none}
/* editor */
.editor-heading{margin-bottom:var(--s-4)}
.back-button{display:inline-flex;align-items:center;gap:var(--s-2);border:0;background:none;padding:var(--s-2) 0;min-height:44px;font-size:.875rem;color:var(--text-2)}.back-button::before{content:"\2190"}.back-button:hover{color:var(--text-1)}
.save-status{font-size:.8125rem;color:var(--text-2);white-space:nowrap}.save-status[data-state=error]{color:var(--danger)}
.editor-state{display:flex;gap:var(--s-3);align-items:center;flex-wrap:wrap;margin-bottom:var(--s-5)}
.editor-title{font-size:1.5rem}
.editor-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:var(--s-5);align-items:start}
.editor-fields{display:grid;gap:var(--s-5);min-width:0}
.editor-meta{display:grid;gap:var(--s-4);min-width:0}
.meta-panel .accbody{display:grid;gap:var(--s-3);color:var(--text-1);padding-top:var(--s-2)}
.record-data{display:grid;grid-template-columns:100px minmax(0,1fr);gap:var(--s-2) var(--s-4)}
.record-data dt{color:var(--text-2);font-size:.875rem}
.record-data dd{overflow-wrap:anywhere;font-size:.9375rem}
.version-list{list-style:none;margin:0;padding:0;display:grid;gap:var(--s-2)}
.version-list li{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);min-height:44px}
.version-list li>span{display:grid}
.publish-summary{display:grid;gap:var(--s-3);overflow-wrap:anywhere}
.publish-summary strong{font-size:1.25rem}
.callout{align-items:center;flex-wrap:wrap}
.callout .btn{margin-left:auto}
/* media */
.media-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:var(--s-4)}
.media-card{display:grid;box-shadow:none}
.media-card img{width:100%;aspect-ratio:4/3;object-fit:cover;background:var(--surface-2);display:block}
.media-card figcaption{display:grid;gap:var(--s-1);padding:var(--s-3)}
.media-card b{font-size:.875rem;overflow-wrap:anywhere}
/* requests */
.request-grid{display:grid;grid-template-columns:minmax(300px,.9fr) minmax(0,1.2fr);gap:var(--s-5);align-items:start}
.request-list{list-style:none;margin:0;padding:0}
.request-list li+li{border-top:1px solid var(--hairline)}
.request-row{border:0;background:var(--surface);width:100%;text-align:left;padding:var(--s-4);display:grid;gap:var(--s-2)}
.request-row:hover{background:var(--surface-2)}
.request-row[aria-current=true]{background:var(--surface-2);box-shadow:inset 3px 0 var(--accent)}
.row-top{display:flex;gap:var(--s-3);justify-content:space-between;align-items:start}
.row-title{font-weight:600;overflow-wrap:anywhere}
.row-sub{font-size:.875rem;color:var(--text-2);overflow-wrap:anywhere}
.row-bottom{display:flex;gap:var(--s-3);align-items:center;justify-content:space-between}
.detail{padding:var(--s-5);min-width:0}
.detail-top{display:flex;align-items:start;gap:var(--s-4);justify-content:space-between;margin-bottom:var(--s-5);flex-wrap:wrap}
.detail-top .field{min-width:160px}
.record-section+.record-section{border-top:1px solid var(--hairline);margin-top:var(--s-5);padding-top:var(--s-5)}
.record-section h3{margin-bottom:var(--s-4)}
.request-message{white-space:pre-wrap;overflow-wrap:anywhere;margin-top:var(--s-4)}
.line-items{list-style:none;padding:0;margin:0;display:grid;gap:var(--s-2)}
.line-items li{display:flex;justify-content:space-between;gap:var(--s-4)}
.notes-list{padding:0;margin:0;list-style:none;display:grid;gap:var(--s-4)}
.note-body{white-space:pre-wrap;overflow-wrap:anywhere}
.note-form{display:grid;gap:var(--s-3);margin-top:var(--s-5)}
.note-form .btn{justify-self:end}
.history-list{list-style:none;margin:0;padding:0;display:grid;gap:var(--s-2)}
.history-list button{display:flex;gap:var(--s-3);justify-content:space-between;align-items:center;width:100%;background:none;border:0;padding:var(--s-2) 0;text-align:left;min-height:44px;font-size:.875rem}
.mobile-back{display:none}
/* access lists */
.access-list{list-style:none;padding:0;margin:0}
.access-row{display:grid;grid-template-columns:minmax(180px,1.2fr) minmax(120px,.7fr) auto;align-items:center;gap:var(--s-5);padding:var(--s-5);border-bottom:1px solid var(--hairline)}
.access-row:last-child{border-bottom:0}
.access-row.code-row{grid-template-columns:minmax(160px,1.2fr) minmax(128px,.8fr) minmax(112px,.7fr) auto}
.access-identity,.access-meta{display:grid;gap:var(--s-2);min-width:0}
.access-identity strong{overflow-wrap:anywhere}
.access-meta{justify-items:start}
.access-actions{display:flex;align-items:center;justify-content:flex-end;gap:var(--s-2);flex-wrap:wrap}
.code-hint{font-family:var(--font-mono);font-size:.8125rem;color:var(--text-2)}
.role-scope{padding:var(--s-3) var(--s-4);background:var(--surface-2);border-radius:var(--r-sm);font-size:.875rem;color:var(--text-2)}
.share-value{min-height:120px;font-family:var(--font-mono);font-size:.8125rem;overflow-wrap:anywhere}
/* settings */
.settings-grid{max-width:740px;display:grid;gap:var(--s-5)}
.settings-panel{padding:var(--s-6);box-shadow:none}
.settings-panel h2{margin-bottom:var(--s-5)}
.settings-panel .record-data{grid-template-columns:150px minmax(0,1fr)}
.settings-actions{margin-top:var(--s-5);display:flex;gap:var(--s-3);flex-wrap:wrap}
.password-form{display:grid;gap:var(--s-4);margin-top:var(--s-5);padding-top:var(--s-5);border-top:1px solid var(--hairline)}
.notification-errors{font-size:.875rem;color:var(--text-2);margin-top:var(--s-4);display:grid;gap:var(--s-1)}
/* toast + dialogs */
.studio-toast{position:fixed;bottom:var(--s-5);left:50%;transform:translateX(-50%);z-index:110;max-width:min(560px,calc(100% - var(--s-6)))}
.studio-toast button{min-width:44px;min-height:44px;font-size:1.25rem}
.studio-dialog{width:min(560px,calc(100% - var(--s-6)));padding:0;color:var(--text-1)}
.studio-dialog.wide{width:min(960px,calc(100% - var(--s-6)))}
.studio-dialog::backdrop{background:color-mix(in srgb,var(--text-1) 36%,transparent)}
.studio-dialog form,.studio-dialog .dialog-body{display:grid;gap:var(--s-4);padding:var(--s-5)}
.dialog-heading{display:flex;justify-content:space-between;align-items:center;gap:var(--s-4)}
.dialog-actions{display:flex;justify-content:flex-end;gap:var(--s-3);flex-wrap:wrap}
/* appearance */
.theme-seg{display:inline-flex}
/* responsive */
@media(max-width:1200px){.editor-layout{grid-template-columns:minmax(0,1fr)}.request-grid{grid-template-columns:minmax(260px,.8fr) minmax(0,1fr)}.access-row,.access-row.code-row{grid-template-columns:minmax(0,1fr) minmax(120px,.65fr)}.access-actions{grid-column:1/-1;justify-content:flex-start}}
@media(max-width:900px){.studio{grid-template-columns:minmax(0,1fr)}.menu-toggle{display:inline-flex}.sidebar{display:none;position:fixed;top:56px;left:0;right:0;height:auto;max-height:calc(100dvh - 56px);z-index:30;border-right:0;border-bottom:1px solid var(--hairline);box-shadow:var(--e-2)}.sidebar.open{display:flex}.workspace{padding:var(--s-5) var(--s-4) var(--s-7)}.request-grid{display:block}.request-grid.has-selection>.request-list-panel{display:none}.request-grid:not(.has-selection)>.request-detail-panel{display:none}.mobile-back{display:inline-flex;margin-bottom:var(--s-4)}.record-data{grid-template-columns:80px minmax(0,1fr)}.access-row,.access-row.code-row{grid-template-columns:minmax(0,1fr);padding:var(--s-4);gap:var(--s-3)}.access-actions{grid-column:auto}.studio-toast{bottom:var(--s-4)}.settings-panel{padding:var(--s-5) var(--s-4)}.settings-panel .record-data{grid-template-columns:minmax(0,1fr);gap:var(--s-1)}.dialog-actions>.btn{flex:1;justify-content:center}}
/* lens fold (Michelangelo): WCAG AA on the chrome the gate does not measure */
.metaline,.grouplabel{color:var(--text-2)}
.searchbox:focus-within{border-color:var(--focus);box-shadow:0 0 0 3px color-mix(in srgb,var(--focus) 25%,transparent)}
.field input:not([type=checkbox]),.field select,.field textarea,.searchbox,.btn-secondary{border-color:var(--text-3)}
.entry-row:focus-visible,.request-row:focus-visible{outline-offset:-2px}
[data-theme=dark] .studio-dialog::backdrop{background:color-mix(in srgb,var(--bg) 72%,transparent)}
.theme-seg button[aria-checked="true"]{background:var(--surface);color:var(--text-1);font-weight:600;box-shadow:var(--e-1)}
.md-toolbar{display:flex;flex-wrap:wrap;gap:var(--s-1)}
@media(pointer:coarse){.snav a,.btn,.btn.sm{min-height:44px}.btn.icon,.btn.sm.icon{width:44px;height:44px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.spinner{animation:dc-spin 1.4s linear infinite!important}}