/*
 * NeuroResin Studio — visual refinement layer.
 * Loaded after studio.css to keep the existing application logic intact.
 */

:root{
  --nr2-ink:#171915;
  --nr2-muted:#77746d;
  --nr2-paper:#f5f2eb;
  --nr2-surface:#fffdf8;
  --nr2-canvas:#d5d2cb;
  --nr2-green:#18312e;
  --nr2-green-hover:#274440;
  --nr2-accent:#a64f38;
  --nr2-line:rgba(23,25,21,.1);
  --nr2-line-strong:rgba(23,25,21,.17);
  --st-panel-w:236px;
  --st-collapsed-w:72px;
}

body.studio-page{
  color:var(--nr2-ink);
  background:
    radial-gradient(circle at 82% 0,rgba(255,255,255,.3),transparent 30rem),
    var(--nr2-canvas);
}

body.studio-page .pm-alert,
body.studio-page .pr-alert,
body.studio-page--account .msg{
  border-radius:12px;
  font-size:.8rem;
  line-height:1.45;
}

body.studio-page .pm-empty,
body.studio-page .pr-empty{
  color:var(--nr2-muted);
}

body.studio-page.is-hydrating .pm-shell,
body.studio-page.is-hydrating .pr-shell,
body.studio-page.is-hydrating .account-shell{
  opacity:.72;
  transition:opacity .18s ease;
}

@media(prefers-reduced-motion:no-preference){
  body.studio-page #loading-screen .ls-block{
    animation-duration:1.15s;
  }
}

/* One-piece sidebar */
body.studio-page.has-side #app{
  padding-left:var(--st-panel-w);
}

body.studio-page.has-side.side-collapsed #app{
  padding-left:var(--st-collapsed-w);
}

.st-side{
  width:var(--st-panel-w);
  background:transparent;
}

.st-rail{
  display:none;
}

.st-panel{
  width:var(--st-panel-w);
  flex:0 0 var(--st-panel-w);
  padding:18px 14px 16px;
  overflow-x:hidden;
  background:rgba(247,244,237,.96);
  border-right:1px solid var(--nr2-line);
  box-shadow:10px 0 34px rgba(35,33,28,.07);
  transition:width .22s ease,flex-basis .22s ease,padding .22s ease;
}

.st-panel__head{
  min-height:42px;
  padding:0 4px 15px;
  border-bottom:1px solid var(--nr2-line);
}

.st-panel .studio-brand-lockup__icon{
  width:28px;
  height:28px;
  flex-basis:28px;
}

.st-panel .studio-brand-lockup__tile{
  fill:var(--nr2-green);
}

.st-panel .studio-brand-lockup__mark{
  fill:#fff;
}

body.studio-page .st-panel .studio-brand-lockup__main{
  color:var(--nr2-ink);
  font-size:.76rem;
  letter-spacing:.12em;
  opacity:1;
}

body.studio-page .st-panel .studio-brand-lockup__sub{
  color:var(--nr2-accent);
  opacity:1;
}

.st-collapse{
  width:32px;
  height:32px;
  padding:0;
  align-items:center;
  justify-content:center;
  border:1px solid var(--nr2-line);
  background:transparent;
}

.st-group{
  margin:20px 10px 7px;
  color:#9a968d;
  font-size:9px;
  letter-spacing:.12em;
}

.st-item,
.st-vbtn{
  min-height:43px;
  padding:0 11px;
  gap:12px;
  border:0;
  border-radius:12px;
  background:transparent;
  color:#625f58;
  box-shadow:none;
  font-size:13px;
}

.st-item svg,
.st-vbtn svg{
  color:#858078;
}

.st-item:hover,
.st-vbtn:hover{
  background:rgba(23,25,21,.055);
}

.st-item.is-active,
.st-vbtn.is-active{
  color:#fff;
  background:var(--nr2-green);
  box-shadow:none;
}

.st-item.is-active svg,
.st-vbtn.is-active svg{
  color:#fff;
}

.st-foot{
  padding-top:14px;
  border-color:var(--nr2-line);
}

.st-foot .pm-online-status{
  margin-left:6px;
  border:0;
  background:transparent;
  color:#56806b;
}

.st-lang{
  background:#e9e6df;
}

.st-foot__logout{
  min-height:42px;
  border-radius:12px;
  font-size:13px;
}

.side-collapsed .st-side{
  width:var(--st-collapsed-w);
}

.side-collapsed .st-panel{
  width:var(--st-collapsed-w);
  flex-basis:var(--st-collapsed-w);
  padding:16px 10px;
  opacity:1;
  overflow:hidden;
  pointer-events:auto;
}

.side-collapsed .st-panel__head{
  align-items:center;
  flex-direction:column;
  padding:0 0 14px;
}

.side-collapsed .st-panel .studio-brand-lockup__lines,
.side-collapsed .st-group,
.side-collapsed .st-item span,
.side-collapsed .st-vbtn span,
.side-collapsed .st-foot__user,
.side-collapsed .st-foot .pm-online-status,
.side-collapsed .st-lang,
.side-collapsed .st-foot__logout span{
  display:none;
}

.side-collapsed .st-views{
  margin-top:16px;
}

.side-collapsed .st-item,
.side-collapsed .st-vbtn,
.side-collapsed .st-foot__logout{
  width:48px;
  min-height:48px;
  margin:0 auto;
  padding:0;
  justify-content:center;
}

.side-collapsed .st-item svg,
.side-collapsed .st-vbtn svg{
  width:20px;
  height:20px;
}

.side-collapsed .st-foot{
  align-items:center;
}

.side-collapsed .st-collapse svg{
  transform:rotate(180deg);
}

/* Shared workspace */
body.studio-page--index .pm-shell,
body.studio-page--project .pr-shell{
  width:min(1240px,calc(100% - 44px));
  margin:30px auto 48px;
  gap:14px;
}

body.studio-page--index .pm-head,
body.studio-page--project .pr-head{
  padding:0 2px;
}

body.studio-page--index .pm-head__eyebrow,
body.studio-page--project .pr-head__eyebrow{
  color:var(--nr2-accent);
  font-size:9px;
  letter-spacing:.15em;
}

body.studio-page--index .pm-head__title,
body.studio-page--project .pr-head__title{
  margin-top:7px;
  max-width:100%;
  color:var(--nr2-ink);
  font-weight:500;
  font-size:clamp(2.25rem,4vw,3.35rem);
  letter-spacing:-.06em;
  overflow-wrap:anywhere;
  word-break:break-word;
}

body.studio-page--index .pm-head__copy,
body.studio-page--project .pr-head__copy{
  max-width:620px;
  color:var(--nr2-muted);
}

body.studio-page--project .pr-head__summary{
  margin-top:20px;
  display:flex;
  align-items:stretch;
  flex-wrap:wrap;
  gap:8px;
}

body.studio-page--project .pr-head__stat{
  min-width:130px;
  padding:10px 13px;
  border:1px solid var(--nr2-line);
  border-radius:12px;
  background:rgba(255,253,248,.52);
}

body.studio-page--project .pr-head__stat span{
  display:block;
  margin-bottom:5px;
  color:#969188;
  font:500 8px/1.2 "DM Mono",monospace;
  letter-spacing:.1em;
  text-transform:uppercase;
}

body.studio-page--project .pr-head__stat strong{
  display:block;
  max-width:22ch;
  overflow:hidden;
  color:#4e4b45;
  font-size:.76rem;
  font-weight:600;
  text-overflow:ellipsis;
  white-space:nowrap;
}

body.studio-page--project .pr-workflow{
  width:min(680px,100%);
  margin-top:14px;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:5px;
}

body.studio-page--project .pr-workflow > div{
  min-width:0;
  padding:9px 8px;
  display:flex;
  align-items:center;
  gap:7px;
  border:1px solid var(--nr2-line);
  border-radius:10px;
  background:rgba(255,253,248,.48);
  color:#8d887f;
}

body.studio-page--project .pr-workflow span{
  width:20px;
  height:20px;
  flex:0 0 20px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#dfdcd4;
  font:600 8px/1 "DM Mono",monospace;
}

body.studio-page--project .pr-workflow strong{
  overflow:hidden;
  font-size:.68rem;
  text-overflow:ellipsis;
  white-space:nowrap;
}

body.studio-page--project .pr-workflow > div.is-done{
  color:#52715f;
  background:#e5ece7;
}

body.studio-page--project .pr-workflow > div.is-done span,
body.studio-page--project .pr-workflow > div.is-current span{
  background:var(--nr2-green);
  color:#fff;
}

body.studio-page--project .pr-workflow > div.is-current{
  border-color:rgba(24,49,46,.3);
  color:var(--nr2-ink);
  background:#fffdf8;
}

body.studio-page--project .pr-save-indicator.is-offline{
  background:#8d4939;
  color:#fff;
}

body.studio-page--index .pm-btn--dark,
body.studio-page--project .pr-btn--dark{
  border-color:var(--nr2-green);
  background:var(--nr2-green);
  color:#fff;
  box-shadow:none;
}

body.studio-page--index .pm-btn--dark:hover,
body.studio-page--project .pr-btn--dark:hover{
  border-color:var(--nr2-green-hover);
  background:var(--nr2-green-hover);
}

/* Dashboard */
body.studio-page--index .pm-toolbar{
  grid-template-columns:minmax(260px,1fr) 210px 44px auto;
  padding:10px;
  gap:8px;
  border:1px solid var(--nr2-line);
  border-radius:17px;
  background:rgba(245,242,235,.72);
}

body.studio-page--index .pm-search,
body.studio-page--index .pm-select,
body.studio-page--index .pm-icon-action{
  border-color:transparent;
  border-radius:11px;
  background:var(--nr2-surface);
  box-shadow:none;
}

body.studio-page--index .pm-text-action{
  text-decoration:none;
}

body.studio-page--index .ov-compact{
  grid-template-columns:1.35fr 1fr 1fr;
  gap:10px;
}

body.studio-page--index .ov-compact .ov-card{
  min-height:112px;
  padding:20px;
  border:1px solid var(--nr2-line);
  border-radius:18px;
  background:rgba(255,253,248,.78);
  box-shadow:none;
}

body.studio-page--index .ov-compact .ov-card:first-child{
  background:var(--nr2-green);
}

body.studio-page--index .ov-card__lbl{
  font-size:10px;
  letter-spacing:.08em;
  text-transform:uppercase;
}

body.studio-page--index .ov-card__val{
  font-size:34px;
  letter-spacing:-.045em;
}

body.studio-page--index .pm-breakdown{
  border-color:var(--nr2-line);
  background:rgba(245,242,235,.58);
}

body.studio-page--index #activityItems{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
}

body.studio-page--index #activityItems button{
  min-height:34px;
  padding:0 10px;
  display:inline-flex;
  align-items:center;
  gap:9px;
  border:1px solid var(--nr2-line);
  border-radius:9px;
  background:#f2efe8;
  color:#514e48;
  font-size:.72rem;
}

body.studio-page--index #activityItems time{
  color:#959087;
  font:500 8px/1 "DM Mono",monospace;
}

body.studio-page--index .pm-stage-progress{
  margin-top:9px;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:3px;
}

body.studio-page--index .pm-stage-progress span{
  height:4px;
  border-radius:999px;
  background:#d8d4cc;
}

body.studio-page--index .pm-stage-progress span.is-done{background:#648574}
body.studio-page--index .pm-stage-progress span.is-current{background:var(--nr2-accent)}

.studio-sync{
  position:fixed;
  right:18px;
  bottom:18px;
  z-index:90;
  min-height:38px;
  padding:0 13px;
  display:flex;
  align-items:center;
  gap:8px;
  border:1px solid var(--nr2-line);
  border-radius:999px;
  background:rgba(255,253,248,.94);
  color:#59564f;
  box-shadow:0 12px 30px rgba(35,33,28,.14);
  font-size:.75rem;
  backdrop-filter:blur(10px);
}

.studio-sync__dot{
  width:8px;
  height:8px;
  border-radius:50%;
  background:#648574;
}

.studio-sync.is-saving .studio-sync__dot{background:#c29a48;animation:nrSyncPulse .9s infinite alternate}
.studio-sync.is-offline .studio-sync__dot,
.studio-sync.is-error .studio-sync__dot{background:#a64f38}
@keyframes nrSyncPulse{to{opacity:.35}}

.studio-skeleton-grid i,
.studio-skeleton-line,
.studio-skeleton-row{
  display:block;
  border-radius:14px;
  background:linear-gradient(90deg,#ebe7df 20%,#f8f5ef 42%,#ebe7df 64%);
  background-size:220% 100%;
  animation:nrStudioSkeleton 1.15s linear infinite;
}

.studio-skeleton-grid i{min-height:112px}
.studio-skeleton-line{min-height:92px}
.studio-skeleton-row{height:88px;margin:0 14px 10px}
@keyframes nrStudioSkeleton{to{background-position:-220% 0}}

body.studio-page--index .pm-list{
  overflow:visible;
  border:1px solid var(--nr2-line);
  border-radius:20px;
  background:rgba(255,253,248,.82);
  box-shadow:none;
}

body.studio-page--index .pm-list__top{
  padding:19px 20px 14px;
}

body.studio-page--index .pm-list__top h2{
  font-size:1.15rem;
  font-weight:600;
}

body.studio-page--index .pm-table__head,
body.studio-page--index .pm-row{
  grid-template-columns:minmax(240px,2fr) minmax(170px,1.2fr) minmax(110px,.75fr) minmax(130px,.9fr) 48px;
  column-gap:18px;
}

body.studio-page--index .pm-table__head{
  padding:10px 20px;
  border-top:1px solid var(--nr2-line);
  border-bottom:1px solid var(--nr2-line);
  background:rgba(23,25,21,.025);
}

body.studio-page--index .pm-row{
  min-height:90px;
  padding:16px 20px;
  border-bottom:1px solid var(--nr2-line);
  background:transparent;
}

body.studio-page--index .pm-row:hover{
  background:rgba(24,49,46,.035);
}

body.studio-page--index .pm-name strong{
  color:var(--nr2-ink);
  font-size:.95rem;
  font-weight:600;
}

body.studio-page--index .pm-name__client{
  display:block;
  max-width:42ch;
  margin-top:6px;
  overflow:hidden;
  color:var(--nr2-muted);
  font-size:.77rem;
  text-overflow:ellipsis;
  white-space:nowrap;
}

body.studio-page--index .pm-row__next{
  min-width:0;
}

body.studio-page--index .pm-deadline{
  margin:0;
  color:#4f4c46;
  font-size:.76rem;
}

body.studio-page--index .pm-next{
  margin-top:7px;
  color:#45665a;
  font-size:.75rem;
  white-space:normal;
}

body.studio-page--index .pm-docs{
  align-items:center;
}

body.studio-page--index .pm-progress__seg{
  width:20px;
  height:5px;
  background:#d6d2ca;
}

body.studio-page--index .pm-progress__seg.is-done{
  background:#648574;
}

body.studio-page--index .pm-row__stage{
  min-width:0;
}

body.studio-page--index .pm-pill,
body.studio-page--index .pm-pill.is-inquiry,
body.studio-page--index .pm-pill.is-quote,
body.studio-page--index .pm-pill.is-production,
body.studio-page--index .pm-pill.is-handover,
body.studio-page--index .pm-pill.is-done{
  border:0;
  background:#e5ece7;
  color:#315548;
}

body.studio-page--index .pm-value{
  margin-top:7px;
  color:#4f4c46;
  font-size:.78rem;
}

body.studio-page--index .pm-more{
  border-color:transparent;
  background:transparent;
}

body.studio-page--index .pm-more:hover{
  background:#e9e6df;
}

body.studio-page--index .pm-empty{
  min-height:260px;
  padding:45px 20px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:14px;
  color:var(--nr2-muted);
}

body.studio-page--index .pm-empty__icon{
  width:50px;
  height:50px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#e5ece7;
  color:#315548;
  font-size:25px;
}

body.studio-page--index .pm-empty strong{
  color:var(--nr2-ink);
  font-size:1rem;
}

/* Project editor */
body.studio-page--project .pr-tabs{
  padding:0;
  gap:28px;
  display:flex;
  border:0;
  border-bottom:1px solid var(--nr2-line);
  border-radius:0;
  background:transparent;
  box-shadow:none;
}

body.studio-page--project .pr-tab{
  min-height:46px;
  padding:0 2px;
  border:0;
  border-bottom:2px solid transparent;
  border-radius:0;
  background:transparent;
  color:#88847b;
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  transform:none;
}

body.studio-page--project .pr-tab.is-active{
  border-bottom-color:var(--nr2-green);
  background:transparent;
  color:var(--nr2-ink);
  box-shadow:none;
}

body.studio-page--project .pr-tab:hover{
  background:transparent;
  box-shadow:none;
  transform:none;
}

body.studio-page--project .pr-subtabs{
  padding:4px 0 0;
}

body.studio-page--project .pr-subtab{
  border-color:var(--nr2-line);
  background:rgba(245,242,235,.65);
}

body.studio-page--project .pr-subtab.is-active{
  border-color:var(--nr2-green);
  background:var(--nr2-green);
  color:#fff;
}

body.studio-page--project .pr-next{
  border-color:rgba(24,49,46,.14);
  background:#e5ece7;
}

body.studio-page--project .pr-next__cta{
  flex:0 0 auto;
  min-height:38px;
  padding:0 15px;
  border:0;
  border-radius:10px;
  background:var(--nr2-green);
  color:#fff;
  box-shadow:none;
}

body.studio-page--project .pr-next__cta:hover{
  background:var(--nr2-green-hover);
  box-shadow:none;
}

body.studio-page--project .pr-panel{
  padding:28px;
  border:1px solid var(--nr2-line);
  border-radius:20px;
  background:rgba(255,253,248,.84);
  box-shadow:none;
}

body.studio-page--project .pr-panel__title{
  color:var(--nr2-ink);
  font-size:1.22rem;
  font-weight:600;
}

body.studio-page--project .pr-panel__subtitle{
  color:var(--nr2-muted);
}

body.studio-page--project .pr-data-sections{
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr);
  gap:12px;
}

body.studio-page--project .pr-data-card{
  min-width:0;
  padding:20px;
  border:1px solid var(--nr2-line);
  border-radius:17px;
  background:rgba(245,242,235,.58);
}

body.studio-page--project .pr-data-card--wide{
  grid-column:1/-1;
}

body.studio-page--project .pr-data-card__head{
  min-height:48px;
  margin-bottom:16px;
  padding-bottom:13px;
  border-bottom:1px solid var(--nr2-line);
}

body.studio-page--project .pr-data-card__head h3{
  margin:0 0 5px;
  color:var(--nr2-ink);
  font-size:.94rem;
  font-weight:600;
  letter-spacing:-.025em;
}

body.studio-page--project .pr-data-card__head p{
  margin:0;
  color:var(--nr2-muted);
  font-size:.76rem;
  line-height:1.45;
}

body.studio-page--project .pr-grid--single{
  grid-template-columns:1fr;
}

body.studio-page--project .pr-field--wide{
  grid-column:1/-1;
}

body.studio-page--project .pr-media-grid{
  display:grid;
  grid-template-columns:minmax(260px,.8fr) minmax(0,1.2fr);
  gap:16px;
  align-items:stretch;
}

body.studio-page--project .pr-field--notes textarea{
  min-height:100%;
  resize:vertical;
}

body.studio-page--project .pr-dropzone{
  min-height:180px;
  padding:24px;
  border:1px dashed var(--nr2-line-strong);
  border-radius:14px;
  background:rgba(255,253,248,.7);
}

body.studio-page--project .pr-photo-preview{
  width:100%;
  max-width:none;
  min-height:180px;
  margin-top:0;
  border-color:var(--nr2-line);
}

body.studio-page--project .pr-photo-preview img{
  width:100%;
  height:220px;
  object-fit:cover;
}

body.studio-page--project #calcBridgeSection{
  border-color:var(--nr2-line);
  background:rgba(245,242,235,.58);
}

body.studio-page--project .pr-field input,
body.studio-page--project .pr-field select,
body.studio-page--project .pr-field textarea,
body.studio-page--project .doc-f input,
body.studio-page--project .doc-f select,
body.studio-page--project .doc-f textarea{
  border-color:transparent;
  border-radius:12px;
  background:#efede7;
  box-shadow:none;
}

body.studio-page--project .pr-module-bar{
  position:sticky;
  bottom:12px;
  z-index:20;
  margin:24px -12px -12px;
  padding:12px;
  border:1px solid var(--nr2-line);
  border-radius:15px;
  background:rgba(255,253,248,.95);
  box-shadow:0 14px 38px rgba(35,33,28,.13);
  backdrop-filter:blur(12px);
}

body.studio-page--project .pr-module-bar__status{
  margin-right:auto;
}

body.studio-page--project .doc-paper{
  border-color:var(--nr2-line);
  box-shadow:0 14px 34px rgba(35,33,28,.1);
}

body.studio-page--project .doc-layout{
  grid-template-columns:minmax(0,.92fr) minmax(390px,1.08fr);
  gap:28px;
}

body.studio-page--project .doc-form-panel{
  padding-right:0;
}

body.studio-page--project .doc-preview-panel{
  position:sticky;
  top:20px;
}

/* Account */
body.studio-page--account .account-shell{
  width:min(1180px,calc(100% - 44px));
  margin:30px auto 52px;
  display:grid;
  gap:18px;
}

body.studio-page--account .account-head{
  padding:0 2px;
}

body.studio-page--account .account-head__eyebrow,
body.studio-page--account .account-card__eyebrow{
  margin:0;
  color:var(--nr2-accent);
  font:600 9px/1.2 "DM Mono",monospace;
  letter-spacing:.15em;
  text-transform:uppercase;
}

body.studio-page--account .account-head h1{
  margin:7px 0 0;
  color:var(--nr2-ink);
  font-size:clamp(2.25rem,4vw,3.35rem);
  font-weight:500;
  line-height:1;
  letter-spacing:-.06em;
}

body.studio-page--account .account-head__copy{
  max-width:680px;
  margin:11px 0 0;
  color:var(--nr2-muted);
  font-size:.95rem;
  line-height:1.6;
}

body.studio-page--account .account-summary{
  margin-top:20px;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:8px;
}

body.studio-page--account .account-summary__item{
  min-width:0;
  min-height:70px;
  padding:11px 13px;
  border:1px solid var(--nr2-line);
  border-radius:13px;
  background:rgba(255,253,248,.55);
}

body.studio-page--account .account-summary__item span,
body.studio-page--account .field label,
body.studio-page--account .stat__label{
  display:block;
  color:#969188;
  font:600 8px/1.2 "DM Mono",monospace;
  letter-spacing:.11em;
  text-transform:uppercase;
}

body.studio-page--account .account-summary__item strong{
  display:block;
  margin-top:8px;
  overflow:hidden;
  color:#4e4b45;
  font-size:.78rem;
  font-weight:600;
  text-overflow:ellipsis;
  white-space:nowrap;
}

body.studio-page--account .account-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}

body.studio-page--account .account-card{
  min-width:0;
  padding:24px;
  border:1px solid var(--nr2-line);
  border-radius:20px;
  background:rgba(255,253,248,.84);
}

body.studio-page--account .account-card--wide{
  grid-column:1/-1;
}

body.studio-page--account .account-card__head{
  min-height:62px;
  margin-bottom:19px;
  padding-bottom:15px;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
  border-bottom:1px solid var(--nr2-line);
}

body.studio-page--account .account-card__head h2{
  margin:6px 0 0;
  color:var(--nr2-ink);
  font-size:1.12rem;
  font-weight:600;
  letter-spacing:-.035em;
}

body.studio-page--account .account-card__head p:last-child{
  max-width:620px;
  margin:6px 0 0;
  color:var(--nr2-muted);
  font-size:.79rem;
  line-height:1.5;
}

body.studio-page--account .account-form-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px 12px;
}

body.studio-page--account .field{
  min-width:0;
  margin:0;
  display:grid;
  gap:7px;
}

body.studio-page--account .field input{
  width:100%;
  min-height:46px;
  padding:0 13px;
  border:1px solid transparent;
  border-radius:12px;
  background:#efede7;
  color:var(--nr2-ink);
  box-shadow:none;
}

body.studio-page--account .field input:focus{
  border-color:rgba(24,49,46,.35);
  box-shadow:0 0 0 3px rgba(24,49,46,.08);
}

body.studio-page--account .field input[readonly]{
  color:#6e6a63;
  background:#f4f1eb;
  opacity:1;
}

body.studio-page--account .account-field-help{
  margin:0 0 15px;
  color:var(--nr2-muted);
  font-size:.79rem;
  line-height:1.55;
}

body.studio-page--account .account-field-help--wide{
  grid-column:1/-1;
  margin:-5px 0 0;
}

body.studio-page--account .account-field--wide{
  grid-column:1/-1;
}

body.studio-page--account .account-media-field input[type="file"]{
  min-height:42px;
  padding:8px;
}

body.studio-page--account .account-media-preview{
  min-height:94px;
  display:grid;
  place-items:center;
  overflow:hidden;
  border:1px dashed var(--nr2-line-strong);
  border-radius:12px;
  background:#f4f1eb;
  color:#858077;
  font-weight:700;
}

body.studio-page--account .account-media-preview img{
  width:100%;
  height:110px;
  object-fit:contain;
}

body.studio-page--account .account-actions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

body.studio-page--account .account-btn{
  min-height:42px;
  padding:0 17px;
  border:1px solid var(--nr2-line-strong);
  border-radius:11px;
  background:#f2efe9;
  color:var(--nr2-ink);
  box-shadow:none;
  font:600 10px/1.2 "DM Mono",monospace;
  letter-spacing:.08em;
  text-transform:uppercase;
}

body.studio-page--account .account-btn:hover{
  border-color:rgba(24,49,46,.3);
  background:#fffdf8;
  box-shadow:none;
}

body.studio-page--account .account-btn--primary{
  border-color:var(--nr2-green);
  background:var(--nr2-green);
  color:#fff;
}

body.studio-page--account .account-btn--primary:hover{
  border-color:var(--nr2-green-hover);
  background:var(--nr2-green-hover);
}

body.studio-page--account .account-btn--danger{
  border-color:rgba(166,79,56,.35);
  background:rgba(166,79,56,.08);
  color:#913f2c;
}

body.studio-page--account .msg{
  min-height:0;
  margin:12px 0;
  font-size:.8rem;
}

body.studio-page--account .msg:empty{
  display:none;
}

body.studio-page--account .account-status{
  flex:0 0 auto;
  padding:7px 10px;
  border-radius:999px;
  background:#ece9e2;
  color:#77736b;
  font:600 9px/1 "DM Mono",monospace;
  letter-spacing:.08em;
  text-transform:uppercase;
}

body.studio-page--account .account-status.is-ok{
  background:#e3ece6;
  color:#46725a;
}

body.studio-page--account .account-security-ok{
  margin:0 0 16px;
  padding:12px 13px;
  border-radius:12px;
  background:#e3ece6;
  color:#46725a;
  font-size:.84rem;
  font-weight:600;
}

body.studio-page--account .account-twofa-qr{
  margin-bottom:16px;
  text-align:left;
}

body.studio-page--account .twofa-manual{
  padding:13px;
  border:1px solid var(--nr2-line);
  border-radius:12px;
  background:#f1eee8;
}

body.studio-page--account .twofa-manual span{
  display:block;
  margin-top:8px;
  overflow-wrap:anywhere;
  color:#6e6a63;
  font:500 11px/1.5 "DM Mono",monospace;
}

body.studio-page--account .account-backup{
  margin-top:16px;
  padding:14px;
  border:1px solid rgba(166,79,56,.22);
  border-radius:12px;
  background:rgba(166,79,56,.06);
}

body.studio-page--account .account-backup p{
  margin:0 0 8px;
  font-weight:600;
}

body.studio-page--account #twofaCodesList{
  white-space:pre-wrap;
  color:#5d554f;
  font:600 .8rem/1.75 "DM Mono",monospace;
  letter-spacing:.08em;
}

body.studio-page--account .divider{
  background:var(--nr2-line);
}

body.studio-page--account .stats-grid{
  margin:0;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}

body.studio-page--account .stat{
  min-height:96px;
  padding:17px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  border:1px solid var(--nr2-line);
  border-radius:14px;
  background:#f1eee8;
  text-align:left;
}

body.studio-page--account .stat__num{
  color:var(--nr2-ink);
  font-size:1.8rem;
  font-weight:500;
}

body.studio-page--account .stat__label{
  margin-top:8px;
}

/* Loading and empty states */
body.studio-page--index #loading-screen .ls-sidebar-skeleton{
  width:var(--st-panel-w);
  flex-basis:var(--st-panel-w);
}

body.studio-page--index #loading-screen .ls-panel-sk{
  width:100%;
  flex:1;
  background:rgba(247,244,237,.9);
}

body.studio-page--index #loading-screen .ls-kpis--three{
  grid-template-columns:repeat(3,minmax(0,1fr));
}

@media(max-width:1000px){
  body.studio-page--index .pm-table__head,
  body.studio-page--index .pm-row{
    grid-template-columns:minmax(220px,1.7fr) minmax(150px,1fr) minmax(100px,.7fr) minmax(120px,.8fr) 44px;
    column-gap:12px;
  }

  body.studio-page--project .pr-data-sections{
    grid-template-columns:1fr;
  }

  body.studio-page--project .pr-data-card--wide{
    grid-column:auto;
  }

  body.studio-page--project .pr-media-grid{
    grid-template-columns:1fr;
  }

  body.studio-page--project .pr-field--notes textarea{
    min-height:150px;
  }
}

@media(max-width:900px){
  body.studio-page.has-side #app,
  body.studio-page.has-side.side-collapsed #app{
    padding-left:0;
  }

  .st-side,
  .side-collapsed .st-side{
    width:min(86vw,310px);
    max-width:310px;
  }

  .st-panel,
  .side-collapsed .st-panel{
    width:100%;
    flex-basis:100%;
    padding:18px 14px;
    opacity:1;
    overflow-y:auto;
  }

  .side-collapsed .st-panel__head{
    align-items:center;
    flex-direction:row;
  }

  .side-collapsed .st-panel .studio-brand-lockup__lines,
  .side-collapsed .st-item span,
  .side-collapsed .st-vbtn span,
  .side-collapsed .st-foot__user,
  .side-collapsed .st-foot .pm-online-status,
  .side-collapsed .st-foot__logout span{
    display:flex;
  }

  .side-collapsed .st-group{display:block}
  .side-collapsed .st-lang{display:flex}
  .side-collapsed .st-item span,
  .side-collapsed .st-vbtn span,
  .side-collapsed .st-foot__logout span{display:inline}
  .side-collapsed .st-foot__user,
  .side-collapsed .st-foot .pm-online-status{display:block}

  .side-collapsed .st-item,
  .side-collapsed .st-vbtn,
  .side-collapsed .st-foot__logout{
    width:100%;
    min-height:43px;
    margin:0;
    padding:0 11px;
    justify-content:flex-start;
  }

  body.studio-page--index .pm-shell,
  body.studio-page--project .pr-shell,
  body.studio-page--account .account-shell{
    width:calc(100vw - 28px);
  }

  body.studio-page--index .pm-table__head{
    display:none;
  }

  body.studio-page--index .pm-row{
    grid-template-columns:1fr auto;
    gap:15px;
  }

  body.studio-page--index .pm-row__next,
  body.studio-page--index .pm-docs,
  body.studio-page--index .pm-row__stage{
    grid-column:1;
  }

  body.studio-page--index .pm-actions{
    grid-column:2;
    grid-row:1;
  }
}

@media(max-width:720px){
  body.studio-page--index .ov-compact{
    grid-template-columns:1fr 1fr;
  }

  body.studio-page--index .ov-compact .ov-card:first-child{
    grid-column:1/-1;
  }

  body.studio-page--index .pm-toolbar{
    padding:8px;
  }

  body.studio-page--project .pr-tabs{
    gap:18px;
    overflow-x:auto;
  }

  body.studio-page--project .pr-tab{
    flex:0 0 auto;
  }

  body.studio-page--project .pr-head,
  body.studio-page--project .pr-head > div:first-child{
    min-width:0;
    width:100%;
  }

  body.studio-page--project .pr-head__title{
    font-size:clamp(1.85rem,9vw,2.35rem);
    letter-spacing:-.055em;
  }

  body.studio-page--project .pr-head__actions{
    width:100%;
    justify-content:flex-start;
  }

  body.studio-page--project .pr-panel{
    padding:20px 16px;
  }

  body.studio-page--project .pr-head__summary{
    display:grid;
    grid-template-columns:1fr 1fr;
  }

  body.studio-page--project .pr-head__stat{
    min-width:0;
  }

  body.studio-page--project .pr-next{
    align-items:stretch;
    flex-direction:column;
  }

  body.studio-page--project .pr-next > div{
    min-width:0;
  }

  body.studio-page--project .pr-next__cta{
    width:100%;
  }

  body.studio-page--project .pr-data-card{
    padding:17px 14px;
  }

  body.studio-page--project .pr-data-card .pr-grid{
    grid-template-columns:1fr;
  }

  body.studio-page--project .pr-field--wide{
    grid-column:auto;
  }

  body.studio-page--project .doc-preview-panel{
    position:static;
  }

  body.studio-page--project .pr-module-bar{
    position:static;
    margin:22px 0 0;
  }

  body.studio-page--account .account-head h1{
    font-size:clamp(2rem,10vw,2.7rem);
  }

  body.studio-page--account .account-summary{
    grid-template-columns:1fr 1fr;
  }

  body.studio-page--account .account-grid,
  body.studio-page--account .account-form-grid{
    grid-template-columns:1fr;
  }

  body.studio-page--account .account-card--wide,
  body.studio-page--account .account-field-help--wide,
  body.studio-page--account .account-field--wide{
    grid-column:auto;
  }

  body.studio-page--account .account-card{
    padding:18px 15px;
  }

  body.studio-page--account .account-card__head{
    flex-direction:column;
  }

  body.studio-page--account .account-actions{
    display:grid;
  }

  body.studio-page--account .account-btn{
    width:100%;
  }

  body.studio-page--index #loading-screen .ls-kpis--three{
    grid-template-columns:1fr;
  }
}

/*
 * Mobile containment.
 * Keep every Studio workspace within the real viewport. Wide tab strips may
 * scroll inside their own card, never the page.
 */
@media(max-width:900px){
  html:has(body.studio-page.has-side),
  body.studio-page.has-side{
    width:100%;
    max-width:100%;
    overflow-x:hidden;
  }

  body.studio-page.has-side #app,
  body.studio-page.has-side.side-collapsed #app{
    width:100%;
    max-width:100%;
    min-width:0;
    overflow-x:clip;
  }

  body.studio-page.has-side .pm-shell,
  body.studio-page.has-side .pr-shell,
  body.studio-page.has-side .account-shell{
    width:auto;
    max-width:none;
    min-width:0;
    margin-right:14px;
    margin-left:14px;
  }

  body.studio-page.has-side .account-shell{
    margin-top:72px;
  }

  body.studio-page.has-side .pm-shell > *,
  body.studio-page.has-side .pr-shell > *,
  body.studio-page.has-side .account-shell > *,
  body.studio-page.has-side .pm-head > *,
  body.studio-page.has-side .pr-head > *,
  body.studio-page.has-side .account-head > *{
    min-width:0;
    max-width:100%;
  }

  body.studio-page.has-side h1,
  body.studio-page.has-side h2,
  body.studio-page.has-side h3,
  body.studio-page.has-side p,
  body.studio-page.has-side strong,
  body.studio-page.has-side span{
    overflow-wrap:anywhere;
  }

  body.studio-page--index .pm-head,
  body.studio-page--project .pr-head{
    display:grid;
    grid-template-columns:minmax(0,1fr);
    align-items:start;
  }

  body.studio-page--index .pm-head__actions,
  body.studio-page--project .pr-head__actions{
    min-width:0;
    max-width:100%;
  }

  body.studio-page--index .pm-toolbar,
  body.studio-page--index .ov-compact,
  body.studio-page--index .pm-list,
  body.studio-page--index .pm-rows,
  body.studio-page--index .pm-row,
  body.studio-page--index .pm-breakdown,
  body.studio-page--project .pr-panel,
  body.studio-page--project .pr-data-sections,
  body.studio-page--project .pr-data-card,
  body.studio-page--account .account-grid,
  body.studio-page--account .account-card{
    min-width:0;
    max-width:100%;
  }

  body.studio-page--project .pr-tabs,
  body.studio-page--project .pr-subtabs{
    overscroll-behavior-x:contain;
  }
}

@media(max-width:520px){
  body.studio-page.has-side .pm-shell,
  body.studio-page.has-side .pr-shell,
  body.studio-page.has-side .account-shell{
    margin-right:10px;
    margin-left:10px;
  }

  body.studio-page--index .pm-head__title,
  body.studio-page--project .pr-head__title,
  body.studio-page--account .account-head h1{
    max-width:100%;
    font-size:clamp(1.85rem,9.5vw,2.35rem);
    line-height:1.02;
    letter-spacing:-.055em;
    overflow-wrap:anywhere;
    word-break:break-word;
  }

  body.studio-page--index .pm-head__copy,
  body.studio-page--project .pr-head__copy,
  body.studio-page--account .account-head__copy{
    font-size:.88rem;
    line-height:1.55;
  }

  body.studio-page--index .pm-head__actions{
    display:grid;
    grid-template-columns:1fr;
    width:100%;
  }

  body.studio-page--index .pm-head__actions .pm-btn{
    width:100%;
    min-width:0;
    flex:none;
    white-space:normal;
    text-align:center;
  }

  body.studio-page--index .pm-toolbar{
    width:100%;
    grid-template-columns:minmax(0,1fr) 46px;
  }

  body.studio-page--index .pm-toolbar .pm-search,
  body.studio-page--index .pm-toolbar .pm-select,
  body.studio-page--index .pm-toolbar .pm-text-action,
  body.studio-page--index .pm-toolbar .pm-icon-action{
    min-width:0;
    max-width:100%;
  }

  body.studio-page--index .pm-text-action{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  body.studio-page--index .ov-compact,
  body.studio-page--index .ov-compact .ov-card:first-child{
    grid-template-columns:1fr;
    grid-column:auto;
  }

  body.studio-page--index .ov-compact .ov-card{
    width:100%;
    min-width:0;
  }

  body.studio-page--index .pm-list{
    overflow:hidden;
    border:0;
    background:transparent;
  }

  body.studio-page--index .pm-list__top{
    align-items:flex-start;
    flex-direction:column;
  }

  body.studio-page--index .pm-row{
    width:100%;
    grid-template-columns:minmax(0,1fr) 40px;
    column-gap:10px;
    padding:16px;
    margin-bottom:10px;
    border:1px solid var(--nr2-line);
    border-radius:16px;
    background:rgba(255,253,248,.86);
  }

  body.studio-page--index .pm-name,
  body.studio-page--index .pm-row__next,
  body.studio-page--index .pm-docs,
  body.studio-page--index .pm-row__stage{
    min-width:0;
    max-width:100%;
  }

  body.studio-page--index .pm-name strong,
  body.studio-page--index .pm-name__client{
    white-space:normal;
    overflow-wrap:anywhere;
  }

  body.studio-page--index .pm-actions{
    width:40px;
    min-width:40px;
  }

  body.studio-page--index .pm-row-menu{
    right:0;
    left:auto;
    width:min(180px,calc(100vw - 48px));
  }

  body.studio-page--project .pr-tabs{
    width:100%;
    max-width:100%;
  }

  body.studio-page--project .pr-head__summary,
  body.studio-page--account .account-summary,
  body.studio-page--account .stats-grid{
    grid-template-columns:1fr;
  }

  body.studio-page--project .pr-workflow{
    grid-template-columns:1fr 1fr;
  }

  body.studio-page--project .pr-head__stat,
  body.studio-page--account .account-summary__item,
  body.studio-page--account .stat{
    width:100%;
    min-width:0;
  }

  body.studio-page--project .pr-head__stat strong,
  body.studio-page--account .account-summary__item strong{
    max-width:100%;
    white-space:normal;
  }

  body.studio-page--project .doc-paper{
    max-width:100%;
  }

  body.studio-page--project .doc-toast{
    right:10px;
    left:10px;
    width:auto;
    min-width:0;
    max-width:none;
  }

  body.studio-page--account .account-card__head{
    min-width:0;
  }

  .studio-sync{
    right:10px;
    bottom:10px;
  }
}