/* Studio Claude restoration 001.
   Product behavior stays server-rendered and local; this restores the visual
   baseline from the original Claude Main/Login/Home studies without claiming
   pixel identity or importing remote assets/fonts. */
:root {
  --bg:#F7F2E7; --ink:#1C1712; --muted:#4A4038; --accent:#A9822E;
  --gold-soft:#E9C77E; --line:rgba(28,23,18,.10); --paper:#FBF8F1;
  --error:#A64B3A; --focus:#76591f; --cb-work-offset:126px;
  --display:Georgia,"Times New Roman",serif;
  --serif:Georgia,"Times New Roman",serif;
  --sans:"Segoe UI",Arial,sans-serif;
  --mono:"IBM Plex Mono","Cascadia Mono",Consolas,monospace;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scrollbar-gutter:stable}
body{margin:0;min-height:100vh;background:var(--bg);color:var(--ink);font:15px/1.55 var(--sans);overflow-wrap:anywhere}
a{color:inherit;text-underline-offset:.18em}
:focus-visible{outline:2px solid var(--focus);outline-offset:4px}
.skip{position:absolute;left:-9999px}
.skip:focus{left:16px;top:8px;background:var(--paper);padding:8px 12px;z-index:10}

.wrap{min-height:100vh;display:flex;flex-direction:column}
header.top{flex:0 0 auto;padding:20px 24px;display:flex;align-items:center;justify-content:space-between;gap:14px 28px}
.brand{font:700 17px/1.1 var(--display);letter-spacing:.02em;text-decoration:none;color:var(--muted)}
.top-nav{display:flex;align-items:center;flex-wrap:wrap;gap:8px 18px;font-size:13px;color:var(--muted)}
.top-nav a,.top-nav button{color:var(--muted)}
.who{color:var(--ink)}
.admin-link{font-size:12px}
main{flex:1;display:flex;align-items:flex-start;justify-content:center;min-width:0;padding:24px 24px 48px}
footer.foot{flex:0 0 auto;padding:18px 24px 20px;text-align:center;color:rgba(74,64,56,.72);font:12px/1.5 var(--mono);letter-spacing:.03em}
footer.foot>span{display:block;text-transform:uppercase;letter-spacing:.08em}
footer.foot .changelog,footer.foot .technical{max-width:720px;margin:8px auto 0;text-align:left;letter-spacing:0;text-transform:none}
footer.foot summary{cursor:pointer;width:fit-content;margin:auto}

h1,h2{font-family:var(--display);color:var(--ink)}
h1{font-weight:800;font-size:clamp(30px,5vw,42px);line-height:1.08;margin:0}
h2{font-weight:700;font-size:clamp(23px,3.5vw,32px);line-height:1.15;margin:0 0 18px}
p{margin-top:0}
.lead{color:var(--muted);font-family:var(--serif);font-style:italic;font-size:17px;line-height:1.55}
.eyebrow{color:var(--accent);font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase}

.orbit-mark{position:relative;width:44px;height:44px;border:1px solid var(--accent);border-radius:50%;display:inline-block}
.orbit-mark:before{content:"";position:absolute;width:3px;height:3px;border-radius:50%;background:var(--accent);left:50%;top:50%;transform:translate(-50%,-50%)}
.orbit-mark span{position:absolute;width:8px;height:8px;border:1px solid var(--accent);border-radius:50%;right:-2px;top:4px}
.orbit-mark span:before,.orbit-mark span:after{content:"";position:absolute;background:var(--accent);opacity:.8}
.orbit-mark span:before{width:12px;height:1px;left:-3px;top:3px}
.orbit-mark span:after{width:1px;height:12px;left:3px;top:-3px}
.orbit-mark i{display:none}
.orbit-mark.small{width:34px;height:34px;flex:0 0 auto}
.orbit-mark.small span{width:7px;height:7px;right:-2px;top:2px}

.login-scene.claude-login{width:min(100%,420px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px;text-align:center;margin:auto}
.login-brand{margin:-8px 0 -4px;font:700 17px/1.2 var(--display);letter-spacing:.02em;color:var(--muted)}
.claude-login .lead{margin:0;max-width:390px}
.identities.claude-identities{width:100%;display:grid;gap:10px;margin-top:2px}
.identities.claude-identities button{width:100%;box-sizing:border-box;padding:14px 18px;background:var(--ink);color:var(--gold-soft);border:1px solid var(--accent);border-radius:2px;display:flex;align-items:center;justify-content:space-between;font:600 15px/1.2 var(--sans);letter-spacing:.03em;cursor:pointer;min-height:50px}
.identities.claude-identities button:hover{background:#2a231c}
.personal-login{width:100%;display:grid;gap:8px;text-align:left;margin-top:2px}
.personal-login label{margin:4px 0 0}
.personal-login input{width:100%}
.personal-login button{width:100%;margin-top:8px}
.personal-test-status{width:100%;max-width:520px;padding:20px 24px;border-left:1px solid var(--accent);color:var(--muted)}
.personal-test-status p:last-child{margin-bottom:0}
.staging-note{margin:0;color:var(--muted);font:12px/1.5 var(--mono);max-width:390px}
.login-error{width:100%;text-align:left}

.room-scene.claude-room{width:100%;max-width:900px;margin:auto}
.room-grid{display:grid;grid-template-columns:minmax(240px,380px) 1px 1fr;gap:56px;width:100%;align-items:start}
.room-column{display:flex;flex-direction:column;gap:28px}
.room-sign{margin-bottom:0}
.room-brand{display:flex;align-items:center;gap:10px}
.room-brand strong{font:800 26px/1.1 var(--display);color:var(--ink)}
.room-sign>p{margin:4px 0 0 44px;color:var(--accent);font:italic 16px/1.4 var(--serif);letter-spacing:.04em}
.room-sign-title{margin:4px 0 0 44px;color:var(--accent);font:italic 16px/1.4 var(--serif);letter-spacing:.04em}
.room-welcome{margin:-12px 0 0;color:var(--muted);font:italic 15px/1.5 var(--serif)}
.room-list{list-style:none;padding:0;margin:0}
.room-row{display:flex;align-items:baseline;gap:12px;padding:16px 0;border-bottom:1px solid var(--line)}
.room-row:last-child{border-bottom:0}
.room-dot{width:9px;height:9px;border:1px solid var(--accent);border-radius:50%;flex:0 0 auto;margin-top:4px}
.room-dot.active{background:var(--accent)}
.room-row>div{min-width:0}
.room-row a,.room-row>div>span{font:600 16px/1.3 var(--sans);color:var(--ink);text-decoration:none}
.room-row a:hover{text-decoration:underline;text-decoration-color:var(--accent)}
.room-row p{margin:2px 0 0;color:var(--muted);font:italic 16px/1.4 var(--serif)}
.room-divider{align-self:stretch;width:1px;min-height:330px;background:linear-gradient(to bottom,transparent,rgba(169,130,46,.35) 15%,rgba(169,130,46,.35) 85%,transparent)}
.room-space{min-height:300px}
.admin-entry{margin:6px 0 0;color:var(--muted);font-size:12px}
.room-technical{margin-top:-8px}

.mail-page,.message-page,.admin-page{width:min(100%,900px);min-width:0;margin:auto}
.mail-page,.message-page{margin:32px auto 0}
.mail-column,.message-column{gap:26px}
.mail-grid{grid-template-areas:"intro divider ." "list divider compose";row-gap:26px}
.mail-intro{grid-area:intro}
.mail-grid>.mail-list{grid-area:list;margin:0}
.mail-grid>.room-divider{grid-area:divider}
.mail-grid>.compose{grid-area:compose;padding:0}
.subpage-back{margin:-8px 0 0;color:var(--muted);font-size:13px}
.subpage-back a{text-decoration:none;border-bottom:1px solid rgba(169,130,46,.45)}
.subpage-back a:hover{border-color:var(--accent)}
.mail-list{margin-top:10px}
.mail-list h2,.compose h2,.reply-panel h2{font-size:24px;margin-bottom:20px}
.unread-count{display:inline-block;margin-left:12px;vertical-align:middle;color:#806019;
  font:700 12px/1.3 var(--sans);letter-spacing:.03em}
.mail-list ul{list-style:none;padding:0 16px;margin:0;border-top:1px solid var(--line);background:rgba(169,130,46,.09)}
.message-row{padding:18px 0;border-bottom:1px solid var(--line);display:flex;align-items:flex-start;gap:12px}
.message-row:last-child{border-bottom:0}
.message-row>div{min-width:0}
.message-row a{font:400 16px/1.3 var(--sans);color:var(--ink);text-decoration:none}
.message-row.is-unread a{font-weight:700}
.message-row a:hover{text-decoration:underline;text-decoration-color:var(--accent)}
.message-state{display:block;margin-top:3px;color:var(--muted);font:italic 15px/1.4 var(--serif)}
.message-row.is-unread .message-state{font-style:normal;font-weight:700;color:#806019}
.message-preview,.message-full{white-space:pre-wrap;overflow-wrap:anywhere;margin:8px 0 0;font:15px/1.5 var(--serif)}
.message-row.is-unread .message-preview{font-weight:700}
.message-expand{margin-top:8px;color:var(--muted);font-size:13px}
.message-expand summary{cursor:pointer;width:fit-content;text-decoration:underline;text-decoration-color:var(--accent)}
.message-full{color:var(--ink);padding:8px 0 0;margin:0}
.empty{padding:24px 0;color:var(--muted);border-top:1px solid var(--line)}
.compose,.reply-panel{padding-top:var(--cb-work-offset);min-width:0}
.message-text{white-space:pre-wrap;padding:24px 0;margin:6px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-size:16px;line-height:1.6}
.message-column form{margin-top:22px}
.reply-panel form{margin-top:0}

form.inline{display:inline}
button,.button{font:600 14px/1.2 var(--sans);background:var(--ink);color:var(--gold-soft);border:1px solid var(--accent);border-radius:2px;padding:12px 18px;cursor:pointer;min-height:44px}
button.quiet{background:transparent;color:var(--muted);border:0;padding:4px 0;min-height:32px}
button:disabled{opacity:.55;cursor:not-allowed}
label{display:block;font-size:13px;color:var(--muted);margin:18px 0 6px}
input[type=text],.claude-login input[type=password],select,textarea{font:inherit;width:100%;padding:10px 12px;border:1px solid rgba(169,130,46,.48);border-radius:2px;background:rgba(255,255,255,.32);color:var(--ink);min-height:44px}
textarea{min-height:140px;resize:vertical}
.compose button,.message-detail+form button,.message-detail~form button{margin-top:16px}
.note{color:var(--muted);font-size:13px}
.receipt{font:12px var(--mono)}
.technical,.changelog{color:var(--muted);font-size:12px}
.technical{margin-top:18px}
.technical summary,.changelog summary{cursor:pointer;width:fit-content}
.technical p,.changelog p{margin:10px 0 0}
.changelog ul{padding-left:18px;margin:7px 0 0}
.banner{border-left:2px solid var(--error);padding:10px 14px;margin:0;background:rgba(166,75,58,.08);color:var(--error)}
.banner.success{border-left-color:var(--accent);background:rgba(169,130,46,.10);color:var(--ink)}
.compose .banner{margin-bottom:16px}
.admin-page{margin:32px auto 0}
.admin-intro{gap:26px;margin-bottom:38px}
.admin-about{margin-top:-8px}
.generic-message{display:flex;flex-direction:column;gap:26px}
.generic-message .lead{margin:0}
.admin-band{color:var(--muted);font-size:12px;border-bottom:1px solid var(--line);padding-bottom:14px;margin-bottom:30px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:32px}
.card{border-top:1px solid var(--line);padding-top:20px;min-width:0}
.status{display:inline-block;font-size:12px;color:var(--muted)}
.status.ok{color:#526546}.status.off{color:#785e52}
ul.tools{list-style:none;padding:0;margin:0}
ul.tools li{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;padding:12px 0;border-bottom:1px solid var(--line)}
dl.ops{display:grid;grid-template-columns:max-content 1fr;gap:4px 12px;margin:0;font-size:13px}
dl.ops dt{color:var(--muted)} dl.ops dd{margin:0;font-family:var(--mono)}

@media(max-width:700px){
  header.top{padding:16px 20px}
  .top-nav{gap:6px 14px}.who{width:100%}
  main{padding:18px 20px 40px}
  .mail-page,.message-page{margin:0 auto}
  .admin-page{margin:0 auto}
  .room-grid{grid-template-columns:1fr;gap:32px}
  .mail-grid{grid-template-areas:"intro" "list" "compose"}
  .room-divider,.room-space{display:none}
  .compose,.reply-panel{padding-top:0}
}
@media(max-width:480px){
  header.top{flex-direction:column;align-items:flex-start;gap:12px}
  .brand{white-space:nowrap}
  .top-nav{width:100%;gap:8px 16px}
  .who{width:auto}
}

/* Studio Pass 002 — native accessible input, product-owned styling. */
input[type=file]{color:var(--muted);background:var(--paper)!important;border:1px solid rgba(169,130,46,.48)!important;border-radius:2px!important;padding:8px!important;min-height:54px}
input[type=file]::file-selector-button{background:var(--ink);color:var(--gold-soft);border:1px solid var(--accent);border-radius:2px;font:600 13px var(--sans);padding:8px 12px;margin-right:14px;cursor:pointer}
input[type=file]:focus-visible{outline:2px solid var(--focus);outline-offset:4px}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}}

/* Studio Pass 002 REFINE 1: a calm navigation rail with work content on the right. */
.studio002-columns {
  display:grid;
  grid-template-columns:minmax(245px,360px) 1px minmax(0,1fr);
  gap:clamp(28px,4vw,56px);
  align-items:start;
  width:100%;
}
.studio002-mail-sidebar,.studio002-files-sidebar{min-width:0;gap:23px}
.studio002-columns>.room-divider{min-height:410px}
.studio002-mail-list,.studio002-file-list{min-width:0;padding-top:0;margin:0}
.studio002-mail-list>ul,.studio002-file-list>ul{
  list-style:none;margin:0;padding:0;background:transparent;border-top:1px solid var(--line);
}
.studio002-mail-list h2,.studio002-file-list h2{font-size:clamp(22px,2.4vw,27px);margin:0 0 14px}
.studio002-sort-hint{color:var(--muted);font:italic 14px/1.4 var(--serif);margin:0 0 16px}
.studio002-mail-sidebar .compose{padding:14px 0 0;border-top:1px solid var(--line);min-width:0}
.studio002-mail-sidebar .compose h2,.studio002-files-sidebar .p02-upload-panel h2{
  font:600 21px/1.2 var(--display);margin:0 0 12px}
.studio002-contact-nav{display:grid;gap:0;border-top:1px solid var(--line);margin-top:5px}
.studio002-contact{padding:11px 2px;border-bottom:1px solid var(--line);text-decoration:none;
  color:var(--muted);font:500 14px/1.45 var(--sans);min-height:42px}
.studio002-contact:hover{color:var(--ink);text-decoration:underline;text-decoration-color:var(--accent)}
.studio002-contact.chosen{color:var(--ink);font-weight:700}
.studio002-contact.chosen::before{content:"•";color:var(--accent);padding-right:10px}
.studio002-message-time{display:block;margin-top:3px;color:var(--muted);font:12px/1.4 var(--sans)}
.studio002-mail-list .message-row{padding:14px 2px}
.studio002-mail-list .message-preview{font:15px/1.55 var(--serif)}
.studio002-files-sidebar .p02-quota{padding-top:18px;margin-top:2px}
.studio002-files-sidebar .p02-quota h2{font:600 19px/1.25 var(--display);margin:0 0 10px}
.studio002-files-sidebar .p02-upload-panel{padding-top:14px;border-top:1px solid var(--line)}
.studio002-files-sidebar .p02-upload{gap:7px}
.studio002-files-sidebar .p02-upload input[type=file]{font-size:13px;background:var(--paper)!important}
.studio002-files-sidebar .p02-upload button{margin-top:4px}
.studio002-files-sidebar .cb18-entry{margin:0;font:13px/1.5 var(--sans)}
.studio002-files-sidebar .note{line-height:1.5;margin:8px 0 0}
.studio002-quiet-detail,.studio002-recovery{color:var(--muted);font:13px/1.5 var(--sans)}
.studio002-quiet-detail summary,.studio002-recovery summary{width:fit-content;cursor:pointer;
  text-decoration:underline;text-decoration-color:rgba(169,130,46,.55);text-underline-offset:3px}
.studio002-recovery{margin-top:4px;border-top:1px solid var(--line);padding-top:18px}
.studio002-recovery .card.wide{border:0;margin:14px 0 0;padding:0}
.studio002-recovery .card.wide h2{font:600 19px/1.2 var(--display)}
.studio002-file-list .p02-files{padding:0;background:transparent}
.studio002-file-list .p02-files li{padding:14px 0}
@media(max-width:700px){
  .studio002-columns{grid-template-columns:minmax(0,1fr);gap:28px}
  .studio002-columns>.room-divider{display:none}
  .studio002-files-sidebar,.studio002-mail-sidebar{gap:20px}
  .studio002-mail-list,.studio002-file-list{margin-top:0}
}


/* Studio PASS 002, shell1: server-rendered stable left rail; full URL navigation preserved. */
.studio003-site header.top{padding:10px 28px;min-height:51px;justify-content:flex-end}
.studio003-site header.top>.brand{display:none}
.studio003-site .top-nav>a[href="/rom"],.studio003-site .top-nav .admin-link{display:none}
.studio003-site main{display:block;padding:12px clamp(20px,4vw,54px) 56px}
.studio003-shell{
  width:min(100%,1460px);margin:8px auto 0;display:grid;
  grid-template-columns:clamp(260px,29vw,362px) 1px minmax(0,1fr);
  column-gap:clamp(26px,4vw,62px);min-height:610px;align-items:stretch;
}
.studio003-rail{align-self:start;position:sticky;top:24px;display:flex;flex-direction:column;gap:28px;min-width:0}
.studio003-identity{display:grid;gap:5px}
.studio003-identity .room-brand strong{font-size:clamp(23px,2.4vw,28px)}
.studio003-room-label{margin:0 0 0 45px;color:var(--accent);font:italic 16px/1.3 var(--serif)}
.studio003-welcome{margin:18px 0 0;color:var(--muted);font:italic 16px/1.5 var(--serif)}
.studio003-nav{list-style:none;margin:8px 0 0;padding:0}
.studio003-nav-row{display:flex;align-items:baseline;gap:14px;padding:16px 4px 16px 0;border-bottom:1px solid var(--line);min-height:52px}
.studio003-nav-row:last-child{border-bottom:0}
.studio003-mark{display:block;width:8px;height:8px;flex:0 0 8px;border:1px solid var(--accent);border-radius:50%}
.studio003-mark.active{background:var(--accent)}
.studio003-nav-link,.studio003-nav-disabled{font:600 15px/1.5 var(--sans);text-decoration:none}
.studio003-nav-link:hover{text-decoration:underline;text-decoration-color:var(--accent)}
.studio003-nav-link.selected{color:var(--ink);font-weight:700}
.studio003-nav-disabled{color:var(--muted);opacity:.56}
.studio003-rail-footer{display:grid;gap:18px;margin:5px 0 0 22px;font:12px/1.4 var(--sans)}
.studio003-utility{color:var(--muted);text-decoration:underline;text-decoration-color:var(--accent);text-underline-offset:4px;width:fit-content}
.studio003-quiet{color:var(--muted);font:12px/1.5 var(--sans)}
.studio003-quiet summary{width:fit-content;cursor:pointer}
.studio003-quiet p{margin:9px 0}
.studio003-quiet code{font:11px/1.5 var(--mono);overflow-wrap:anywhere}
.studio003-divider{height:100%;min-height:530px;width:1px;
 background:linear-gradient(to bottom,transparent,rgba(169,130,46,.26) 10%,rgba(169,130,46,.26) 90%,transparent)}
.studio003-work{min-width:0;align-self:start;padding:20px 0 48px}
.studio003-work .room-scene,.studio003-work .mail-page,.studio003-work .message-page{width:100%;max-width:none;margin:0}
.studio003-work .room-scene>.room-grid{display:block}
.studio003-work .room-scene>.room-grid>.room-column,
.studio003-work .room-scene>.room-grid>.room-divider{display:none}
.studio003-work .room-space{min-height:480px}
.studio003-work .studio002-columns{width:100%;display:flex;flex-direction:column;gap:26px}
.studio003-work .studio002-columns>.room-divider{display:none}
.studio003-work .studio002-mail-sidebar,
.studio003-work .studio002-files-sidebar{display:contents}
.studio003-work .studio002-mail-sidebar .room-sign,
.studio003-work .studio002-mail-sidebar .room-welcome,
.studio003-work .studio002-mail-sidebar .subpage-back,
.studio003-work .studio002-files-sidebar .room-sign,
.studio003-work .studio002-files-sidebar .room-welcome,
.studio003-work .studio002-files-sidebar .subpage-back{display:none}
.studio003-work .studio002-mail-sidebar .studio002-contact-nav{
 order:1;margin:0;display:flex;flex-wrap:wrap;gap:4px 22px;border:0}
.studio003-work .studio002-mail-sidebar .studio002-contact{border-bottom:0}
.studio003-work .studio002-mail-list{order:2}
.studio003-work .studio002-mail-compose{order:3;border-top:1px solid var(--line);padding-top:22px}
.studio003-work .studio002-mail-compose form{max-width:560px}
.studio003-work .studio002-files-sidebar .cb18-entry{order:1}
.studio003-work .studio002-file-list{order:2}
.studio003-work .studio002-files-sidebar>.banner{order:1}
.studio003-work .studio002-files-sidebar .p02-upload-panel{order:3;padding-top:22px;border-top:1px solid var(--line)}
.studio003-work .studio002-files-sidebar .p02-quota{order:4}
.studio003-work .studio002-files-sidebar .studio002-recovery{order:5}
.studio003-work .p03-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:30px}
.studio003-work .p03-grid>.room-divider{display:none}
.studio003-work .p03-grid .mail-column .room-sign,
.studio003-work .p03-grid .mail-column .room-welcome,
.studio003-work .p03-grid .mail-column .subpage-back{display:none}
.studio003-work .p03-grid .p03-reader{padding-top:0}
.studio003-work .cb18-scene>.room-grid{display:block}
.studio003-work .cb18-scene>.room-grid>.room-column,
.studio003-work .cb18-scene>.room-grid>.room-divider{display:none}
.studio003-work .cb18-scene .cb18-work{width:100%}
.studio003-work .message-page .message-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:20px}
.studio003-work .message-page .message-grid>.room-divider{display:none}
.studio003-work .message-page .message-column .room-sign,
.studio003-work .message-page .message-column .subpage-back{display:none}
.studio003-work .message-page .reply-panel{padding-top:12px}
.studio003-work .message-page .message-column{gap:12px}
.studio003-work .message-page .message-text{margin-top:10px}
@media(max-width:900px){
 .studio003-shell{grid-template-columns:250px 1px minmax(0,1fr);gap:28px}
 .studio003-work .p03-grid{grid-template-columns:1fr;gap:22px}
}
@media(max-width:700px){
 .studio003-site main{padding:12px 20px 44px}
 .studio003-shell{grid-template-columns:minmax(0,1fr);gap:26px;margin:0}
 .studio003-rail{position:static;gap:14px}
 .studio003-identity{gap:3px}
 .studio003-welcome{margin-top:6px}
 .studio003-nav{display:flex;flex-wrap:wrap;gap:0 16px;margin:0}
 .studio003-nav-row{flex:0 0 auto;padding:10px 2px;gap:7px;border:0;min-height:44px}
 .studio003-rail-footer{display:flex;flex-wrap:wrap;gap:16px;margin:0}
 .studio003-divider{height:1px;min-height:1px;width:100%;background:var(--line)}
 .studio003-work{padding:6px 0 24px}
 .studio003-work .room-space{min-height:240px}
 .studio003-site header.top{padding:10px 20px}
 .studio003-work .studio002-mail-sidebar .studio002-contact-nav{gap:0 14px}
}