/* IRIS Workspace v1.10.2 · Muted Plum / Sage
   One visual system for the existing Studio Cloud application.
   The original functional layouts and document/export styles stay in styles.css. */

:root {
  --violet:#625574; --lime:#d8e1c8; --lavender:#dcd3e7;
  --bg:#f4f1ea; --bg-2:#e9e3ef; --bg-soft:#ede8f1;
  --panel:#fffefa; --panel-2:#f6f3f8; --line:#ded7e4; --line-soft:#eee9f1;
  --ink:#302b38; --ink-dim:#655d6d; --ink-faint:#746b7c;
  --accent:#625574; --accent-light:#756687; --accent-2:#625574; --on-accent:#fff;
  --gold:#625574; --gold-light:#756687; --gold-bg:#ebe5f1; --gold-border:#d2c7df;
  --green:#28714c; --red:#bd3f4d; --blue:#625574; --flow:#8a729e;
  --tungsten:#625574; --hair:var(--line);
  --primary:#625574; --on-primary:#fff;
  --radius:12px; --radius-card:12px; --r-card:12px; --r-ctl:7px; --r-chip:5px;
  --shadow:0 4px 16px -8px rgba(22,32,50,.14);
  --shadow-rest:0 1px 3px rgba(22,32,50,.035);
  --shadow-hover:0 4px 18px -10px rgba(22,32,50,.16);
  --shadow-card-hover:var(--shadow-hover); --shadow-pcard-hover:var(--shadow-hover);
  --grad-gold:linear-gradient(var(--primary),var(--primary));
  --grad-bar:linear-gradient(90deg,var(--violet),var(--violet));
  --sans:"Archivo",-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  --serif:var(--sans); --mono:ui-monospace,"SFMono-Regular","SF Mono",Menlo,Consolas,monospace;
  --ease:cubic-bezier(.2,.7,.2,1); --ease-out:var(--ease); --spring:var(--ease); --ease-smooth:var(--ease);
  --ring:0 0 0 3px color-mix(in srgb,var(--accent) 15%,transparent);
}
html.dark {
  --bg:#211e26; --bg-2:#37303f; --bg-soft:#37303f;
  --panel:#2b2732; --panel-2:#322c3b; --line:#4c4355; --line-soft:#3e3547;
  --ink:#f3eef7; --ink-dim:#c3b8cc; --ink-faint:#b1a5bc;
  --accent:#c0afcf; --accent-light:#cfbfdc; --accent-2:#c0afcf; --on-accent:#302b38;
  --gold:#c0afcf; --gold-light:#cfbfdc; --gold-bg:#3b3048; --gold-border:#776285;
  --green:#b8cfb3; --red:#eca1ad; --blue:#c0afcf; --flow:#c6acd5;
  --primary:#d8e1c8; --on-primary:#302b38;
  --shadow:0 12px 35px -16px rgba(0,0,0,.45);
  --shadow-rest:none; --shadow-hover:0 4px 18px -10px rgba(0,0,0,.4);
}
html { -webkit-text-size-adjust:100%; color-scheme:light; }
html.dark { color-scheme:dark; }
html { overflow-x:clip; }
body { height:auto; min-height:100%; overflow-x:clip; }
body { background:var(--bg); background-image:none; color:var(--ink); font-family:var(--sans); font-size:14px; line-height:1.55; letter-spacing:0; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; }
.main > *,.card,.stat,.proj-card,.list-item { animation:none; }
button,input,select,textarea { font-family:var(--sans); }
button { -webkit-tap-highlight-color:transparent; }
button:focus-visible,a:focus-visible,summary:focus-visible,[tabindex]:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
::selection { background:color-mix(in srgb,var(--accent) 20%,transparent); }
.studio-icon { flex-shrink:0; vertical-align:middle; }
.num,.amt-income,.amt-expense,.tbl td { font-variant-numeric:tabular-nums; }
.eyebrow { font-family:var(--mono); font-size:10px; font-weight:500; color:var(--ink-faint); letter-spacing:.11em; margin-bottom:8px; }
.muted { color:var(--ink-faint); }

/* Shell, navigation, and account */
.shell { display:grid; grid-template-columns:236px minmax(0,1fr); min-height:100dvh; }
.workspace-content { min-width:0; }
.sidebar {
  --ink:#fff; --ink-dim:#dcd3e7; --ink-faint:#ddd4e7;
  --panel:#5b4e6d; --panel-2:#716482; --line:#80738e; --bg-2:#5b4e6d;
  position:sticky; top:0; height:100dvh; display:flex; gap:0;
  padding:0; background:#625574; border-right:1px solid #5b4e6b;
  color:var(--ink); overflow:hidden; backdrop-filter:none;
}
.side-brand { height:90px; flex-shrink:0; padding:24px 22px; display:flex; gap:11px; align-items:center; border-bottom:1px solid var(--line); color:#f4f5f7; }
.side-brand img,html.dark .side-brand img { width:33px; height:27px; object-fit:contain; filter:brightness(0) invert(1); }
.side-brand strong { display:block; font-size:14px; font-weight:650; letter-spacing:.07em; white-space:nowrap; }
.side-brand small { display:block; font-size:10px; letter-spacing:.02em; margin-top:2px; color:#dcd3e7; }
.side-nav { flex:1; min-height:0; overflow-y:auto; padding:15px 13px 20px; scrollbar-width:thin; scrollbar-color:#414855 transparent; }
.nav-group { margin:0 0 10px; }
.nav-group summary { list-style:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:8px; font-size:11px; font-weight:500; letter-spacing:.025em; color:#dcd3e7; padding:8px 11px; border-radius:6px; }
.nav-group summary::-webkit-details-marker { display:none; }
.nav-group summary:hover { color:#dce1ea; background:rgba(255,255,255,.025); }
.nav-group-chevron .studio-icon { width:12px; height:12px; transition:transform .16s ease; }
.nav-group[open] .nav-group-chevron { transform:rotate(90deg); }
.nav-group-items { display:grid; gap:3px; padding-top:3px; }
.sidebar .nav-item { padding:9px 11px; min-height:37px; gap:10px; border-radius:7px; font-size:13px; font-weight:450; color:#f4f0f7; background:transparent; box-shadow:none; border:1px solid transparent; transition:background .15s,color .15s; transform:none; }
.sidebar .nav-item::before,.sidebar .nav-item::after { display:none; }
.sidebar .nav-item:not(.active):hover { color:#fff; background:#716482; transform:none; }
.sidebar .nav-item:not(.active):hover .ic { transform:none; }
.sidebar .nav-item.active { background:#d8e1c8; color:#302b38; border-color:#d8e1c8; box-shadow:none; font-weight:600; }
.sidebar .nav-item.active .ic { color:#302b38; }
.sidebar .nav-item.active .ic svg { stroke:currentColor; }
html.dark .sidebar .nav-item.active { color:#302b38; }
.sidebar .nav-item .ic { width:18px; height:18px; opacity:1; }
.sidebar .nav-item .ic svg { width:18px; height:18px; stroke-width:1.6; }
.sidebar .nav-badge { background:#80738e; border-radius:5px; font-size:10px; font-weight:600; padding:1px 6px; color:#fff; }
.sidebar .nav-item.active .nav-badge { background:#302b38; color:#d8e1c8; }
.nav-foot { flex-shrink:0; margin:0; padding:16px 14px; border-top:1px solid #80738e; display:flex; gap:8px; align-items:center; background:#584d69; }
.studio-account { flex:1; min-width:0; display:flex; align-items:center; gap:9px; padding:0; text-align:left; background:none; border:0; color:#edf0f6; }
.studio-account>span:last-child { min-width:0; }
.studio-account .avatar { background:#dcd3e7 !important; color:#514261 !important; font-family:var(--sans); font-weight:600; }
.nav-foot .uname { display:block; font-size:12px; font-weight:550; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.nav-foot .urole { display:block; font-family:var(--sans); font-size:10px; color:#dcd3e7; margin-top:2px; }
.studio-logout { color:#dcd3e7; background:none; border:0; padding:8px 4px; border-radius:5px; }
.studio-logout .studio-icon { width:17px; height:17px; }
.studio-logout:hover { color:#fff; }

/* A real header replaces the floating tool cluster and page-top blank space. */
.workspace-header { position:sticky; top:0; z-index:35; min-height:70px; padding:14px 32px; background:var(--panel); border-bottom:1px solid var(--line); display:flex; align-items:center; gap:24px; }
.workspace-crumb { display:flex; align-items:center; gap:11px; font-size:11px; color:var(--ink); white-space:nowrap; }
.workspace-crumb>span:first-child,.crumb-divider { color:var(--ink-faint); }
.workspace-header .gsearch-wrap { flex:1; max-width:470px; min-width:170px; margin:0 0 0 auto; }
.gsearch { max-width:none; }
.gsearch .gsearch-ic { left:13px; line-height:1; }
.gsearch .gsearch-ic svg { width:16px; height:16px; }
#gsearch-input { height:38px; padding:9px 54px 9px 38px; background:var(--bg); border:1px solid var(--line-soft); border-radius:7px; font-size:12px; box-shadow:none; }
#gsearch-input:focus { border-color:var(--gold-border); box-shadow:var(--ring); }
.gsearch .gsearch-k { font-family:var(--sans); font-size:10px; right:9px; padding:1px 5px; border-radius:4px; border-color:var(--line); background:var(--panel); }
.gsearch-panel { border-radius:9px; box-shadow:var(--shadow); border-color:var(--line); animation:none; }
.gs-group { font-size:11px; text-transform:none; letter-spacing:0; }
.gs-item { font-size:12px; border-radius:6px; }
.header-tools { flex-shrink:0; }
.header-tools:empty { display:none; }
.header-tools #topbar-tools { position:static; display:flex; align-items:center; gap:8px; }
body>#topbar-tools { top:20px; right:24px; display:flex; gap:8px; }
#theme-toggle,#notif-fab { height:32px; width:32px; border-radius:6px; border:1px solid transparent; background:transparent; color:var(--ink-dim); box-shadow:none; }
#theme-toggle:hover,#notif-fab:hover { background:var(--bg-2); border-color:var(--line); transform:none; }
#theme-toggle svg,#notif-fab svg { width:17px; height:17px; }
#lang-toggle { border:1px solid var(--line); padding:2px; border-radius:6px; background:var(--bg); gap:1px; }
#lang-toggle button { font-family:var(--sans); font-size:10px; padding:4px 6px; min-width:26px; border-radius:4px; color:var(--ink-dim); line-height:1.5; }
#lang-toggle button.on,html.dark #lang-toggle button.on { color:var(--ink); background:var(--panel); box-shadow:0 1px 2px rgba(0,0,0,.08); }
#presence-widget { margin-right:5px; padding-right:12px; border-right:1px solid var(--line); }
#presence-widget { order:0; }
#notif-fab { order:1; }
#theme-toggle { order:2; }
#lang-toggle { order:3; }
.pres-av { width:24px; height:24px; font-size:9px; border-color:var(--panel); box-shadow:none; }
.pres-count { font-size:10px; }

.main { padding:34px 32px 32px; max-width:1440px; width:100%; margin-inline:auto; }
.page-head { gap:16px; align-items:center; padding-top:0; margin-bottom:24px; }
.page-head > div:first-child { display:block; }
.page-head h1 { font-family:var(--sans); font-size:28px; font-weight:620; line-height:1.25; letter-spacing:-.035em; font-stretch:100%; }
.page-head p { font-size:12px; color:var(--ink-dim); margin-top:7px; line-height:1.6; }
.studio-date { padding-left:18px; margin-left:18px; border-left:1px solid var(--line); font-size:11px; color:var(--ink-faint); }
.studio-head-actions { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.app-footer { display:flex; align-items:center; justify-content:space-between; gap:12px; padding-top:20px; margin-top:32px; font-family:var(--sans); font-size:10px; letter-spacing:.03em; text-align:left; border-color:var(--line); }
.app-footer>span:last-child { display:flex; gap:16px; }
.app-footer a,.app-footer .app-ver { color:var(--ink-faint); font-family:var(--sans); }

/* Shared components across all pages */
.btn,html.dark .btn { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:36px; padding:8px 14px; border-radius:7px; background:var(--primary); color:var(--on-primary); border:1px solid var(--primary); font-size:12px; font-weight:550; box-shadow:none; letter-spacing:0; transition:background .15s,border-color .15s; }
.btn:hover,html.dark .btn:hover { filter:none; background:color-mix(in srgb,var(--primary) 90%,var(--panel)); transform:none; box-shadow:none; }
.btn::before,.btn::after { display:none; }
.btn .studio-icon { width:15px; height:15px; }
.btn.ghost,html.dark .btn.ghost { color:var(--ink-dim); background:var(--panel); border:1px solid var(--line); }
.btn.ghost:hover,html.dark .btn.ghost:hover { color:var(--ink); background:var(--bg-2); border-color:color-mix(in srgb,var(--ink) 24%,var(--line)); }
.btn.danger,html.dark .btn.danger { color:var(--red); background:transparent; border:1px solid color-mix(in srgb,var(--red) 30%,var(--line)); }
.btn.sm { font-size:11px; min-height:29px; padding:5px 10px; }
.btn:disabled { opacity:.5; transform:none; }
input,select,textarea { font-size:13px; border:1px solid var(--line); background:var(--panel); color:var(--ink); padding:9px 11px; border-radius:7px; box-shadow:none; }
input::placeholder,textarea::placeholder { color:var(--ink-faint); opacity:.9; }
input:focus,select:focus,textarea:focus { outline:none; border-color:var(--accent); box-shadow:var(--ring); }
input[type=checkbox],input[type=radio] { accent-color:var(--primary); box-shadow:none; }
input[type=file]::file-selector-button { font:inherit; padding:6px 10px; margin-right:10px; border:1px solid var(--line); border-radius:5px; background:var(--bg-2); color:var(--ink); cursor:pointer; }
label { color:var(--ink-dim); font-size:12px; letter-spacing:0; margin-bottom:6px; }
.card,.stat,.list-item,.link-card,.kan-col { background:var(--panel); background-image:none; border:1px solid var(--line); border-radius:12px; box-shadow:var(--shadow-rest); }
.card,.stat { padding:20px; }
.card:hover,.stat:hover,.list-item:hover,.proj-card:hover,.link-card:hover { transform:none; box-shadow:var(--shadow-rest); }
.card::before,.card::after,.stat::before,.stat::after,.link-card::before { display:none; }
html.dark .card,html.dark .stat,html.dark .proj-card,html.dark .list-item { border-color:var(--line); box-shadow:none; }
.stat .num { font-size:34px; font-family:var(--sans); font-weight:550; letter-spacing:-.04em; line-height:1.2; }
.stat .lbl { color:var(--ink-dim); font-size:12px; font-family:var(--sans); letter-spacing:0; }
.stat.accent,html.dark .stat.accent { background:var(--panel); }
.stat.accent .num { color:var(--accent); }
.section-title { font-size:17px; font-weight:550; font-family:var(--sans); letter-spacing:-.015em; }
.li-title { font-size:14px; font-weight:550; line-height:1.5; }
.li-sub { font-size:12px; color:var(--ink-dim); line-height:1.6; }
.list-item { padding:15px 16px; border-radius:9px; }
.tag { padding:3px 8px; font-size:10px; line-height:1.5; font-family:var(--sans); border-radius:5px; border:1px solid transparent; background:var(--bg-2); color:var(--ink-dim); }
.tag.open,.tag.income,.studio-status.active { color:var(--green); background:color-mix(in srgb,var(--green) 9%,var(--panel)); border-color:transparent; }
.tag.assigned,.studio-status.prep { color:var(--blue); background:color-mix(in srgb,var(--blue) 9%,var(--panel)); border-color:transparent; }
.tag.in_progress,.tag.review { color:var(--accent); background:var(--gold-bg); border-color:transparent; }
.tag.expense,.studio-status.cancelled { color:var(--red); background:color-mix(in srgb,var(--red) 8%,var(--panel)); border-color:transparent; }
.studio-status.on_hold { color:var(--flow); background:color-mix(in srgb,var(--flow) 10%,var(--panel)); }
.studio-status::before { content:""; width:5px; height:5px; border-radius:50%; display:inline-block; background:currentColor; margin-right:5px; vertical-align:2px; }
.pill-tabs { border:1px solid var(--line); background:var(--bg-2); border-radius:7px; padding:3px; gap:2px; }
.pill-tabs button { font-family:var(--sans); font-size:12px; padding:6px 12px; border-radius:5px; font-weight:500; }
.pill-tabs button.active,html.dark .pill-tabs button.active { color:var(--ink); background:var(--panel); box-shadow:0 1px 3px rgba(0,0,0,.07); }
.cat-filter { background:transparent; border:0; padding:0; gap:7px; margin:0 0 24px; }
.cat-filter button { border:1px solid var(--line); padding:6px 12px; color:var(--ink-dim); background:var(--panel); border-radius:6px; }
.cat-filter button.active,html.dark .cat-filter button.active { color:var(--on-primary); background:var(--primary); border-color:var(--primary); box-shadow:none; }
.cat-filter button i { width:6px; height:6px; }
table.tbl { border-collapse:collapse; }
table.tbl th { padding:11px 14px; background:var(--panel-2); color:var(--ink-dim); font-size:11px; font-weight:500; letter-spacing:0; text-transform:none; border-bottom:1px solid var(--line); }
table.tbl td { font-size:12px; padding:15px 14px; border-color:var(--line-soft); line-height:1.6; }
table.tbl tr:hover td { background:var(--panel-2); }
table.tbl tr:last-child td { border-bottom:0; }
.amt-income,.amt-expense { font-family:var(--sans); font-weight:550; }
.empty { font-family:var(--sans); font-size:13px; color:var(--ink-faint); }
.kan-col { box-shadow:none; background:var(--bg-2); border-radius:9px; padding:13px; flex-basis:245px; }
.kan-head { font-size:12px; font-weight:550; padding:0 2px 8px; border-bottom:1px solid var(--line); }
.kan-card { box-shadow:none; border-radius:7px; padding:14px; }
.kan-card:hover { border-color:var(--ink-faint); }
.cal { gap:0; border-top:1px solid var(--line); border-left:1px solid var(--line); }
.cal-h { background:var(--panel-2); padding:12px 4px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); font-family:var(--sans); font-size:11px; }
.cal-cell { min-height:110px; padding:9px; border:0; border-right:1px solid var(--line); border-bottom:1px solid var(--line); border-radius:0; background:var(--panel); }
.cal-cell.today { background:var(--gold-bg); border-color:var(--line); box-shadow:inset 0 0 0 1px var(--gold-border); }
.cal-date { font-family:var(--sans); font-size:11px; color:var(--ink-dim); }
.cal-cell.today .cal-date { color:var(--accent); font-weight:650; }
.cal-ev,.cal-proj { border-radius:4px; padding:3px 5px; font-size:10px; }

/* Workspace overview */
.studio-kpis { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin-bottom:24px; }
.studio-kpi { display:flex; flex-direction:column; align-items:stretch; min-width:0; padding:21px 22px 15px; text-align:left; cursor:pointer; transition:border-color .15s,background .15s; }
.studio-kpi:hover { border-color:color-mix(in srgb,var(--ink) 30%,var(--line)); }
.studio-kpi-top { display:flex; gap:8px; align-items:center; justify-content:space-between; }
.studio-kpi-top .lbl { margin:0; font-size:11px; }
.studio-kpi-top>.studio-icon { color:var(--ink-faint); width:18px; height:18px; }
.studio-kpi .num { margin:18px 0 18px; font-size:40px; font-weight:550; color:var(--ink); }
.studio-kpi-foot { padding-top:12px; border-top:1px solid var(--line-soft); display:flex; justify-content:space-between; align-items:center; gap:8px; color:var(--ink-faint); font-size:10px; }
.studio-kpi-foot .studio-icon { width:14px; height:14px; }
.studio-kpi-primary,html.dark .studio-kpi-primary { background:#262e3b; color:#fff; border-color:#262e3b; }
.studio-kpi-primary .num,.studio-kpi-primary .lbl { color:#fff; }
.studio-kpi-primary .studio-icon { color:#e8a47f; }
.studio-kpi-primary .studio-kpi-foot { color:#c4cbd6; border-color:#434b58; }
.studio-kpi-primary:hover,html.dark .studio-kpi-primary:hover { background:#30394a; border-color:#30394a; }
.studio-dashboard-grid { display:grid; grid-template-columns:minmax(0,1.12fr) minmax(0,1fr); gap:24px; align-items:stretch; }
.studio-panel { padding:0; overflow:hidden; }
.studio-panel-head { display:flex; justify-content:space-between; gap:16px; align-items:center; padding:21px 23px; border-bottom:1px solid var(--line-soft); }
.studio-panel-head h2 { font-size:15px; font-weight:550; letter-spacing:-.02em; margin:0; }
.studio-panel-head p { font-size:11px; color:var(--ink-faint); margin:4px 0 0; }
.studio-count { display:inline-flex; align-items:center; justify-content:center; background:var(--bg-2); border:1px solid var(--line); color:var(--ink-dim); min-width:26px; height:26px; font-size:11px; border-radius:6px; }
.studio-link { display:inline-flex; gap:8px; align-items:center; padding:4px 0; font-size:11px; font-weight:500; background:none; color:var(--ink-dim); border:0; white-space:nowrap; }
.studio-link:hover { color:var(--accent); }
.studio-link>.studio-icon { width:17px; height:17px; }
#dash-reminders>.list-item { margin:12px 20px; }
.studio-reminder { display:flex; gap:14px; align-items:center; padding:20px 23px; border-bottom:1px solid var(--line-soft); font-size:12px; line-height:1.7; }
.studio-reminder:last-child { border-bottom:0; }
.studio-reminder-index { font-family:var(--mono); font-size:10px; color:var(--ink-faint); align-self:flex-start; margin-top:3px; }
.studio-reminder>span:nth-child(2) { flex:1; min-width:0; overflow-wrap:anywhere; }
.studio-reminder-dot { width:6px; height:6px; background:var(--accent); border-radius:50%; flex-shrink:0; }
.studio-event { display:flex; align-items:center; gap:13px; padding:16px 23px; width:100%; min-width:0; text-align:left; background:none; border:0; border-bottom:1px solid var(--line-soft); color:var(--ink); }
.studio-event:last-child { border-bottom:0; }
.studio-event:hover { background:var(--panel-2); }
.studio-event-date { width:43px; height:47px; flex-shrink:0; background:var(--bg-2); border:1px solid var(--line); border-radius:6px; text-align:center; display:flex; flex-direction:column; justify-content:center; }
.studio-event-date small { font-size:8px; color:var(--ink-dim); text-transform:uppercase; letter-spacing:.08em; }
.studio-event-date strong { font-size:19px; font-weight:550; line-height:1.2; }
.studio-event-text { min-width:0; flex:1; }
.studio-event-text>strong { display:block; font-size:12px; font-weight:550; line-height:1.45; }
.studio-event-text>span { display:block; font-size:10px; color:var(--ink-faint); margin-top:4px; }
.studio-projects { grid-column:1/-1; }
.studio-project-table { min-width:690px; }
.studio-project-table td:first-child { width:47%; }
.studio-project-open { display:flex; align-items:center; gap:11px; border:0; background:none; color:var(--ink); padding:0; text-align:left; max-width:100%; }
.studio-project-open>span:last-child { min-width:0; }
.studio-project-open strong { display:block; font-size:12px; font-weight:550; }
.studio-project-open small { display:block; margin-top:4px; color:var(--ink-faint); font-size:10px; font-weight:400; }
.studio-project-symbol { display:grid; place-items:center; width:33px; height:33px; border:1px solid var(--line); border-radius:7px; color:var(--ink-dim); background:var(--bg-2); flex-shrink:0; }
.studio-project-symbol .studio-icon { width:17px; height:17px; }
.studio-table-date { white-space:nowrap; color:var(--ink-dim); font-size:11px !important; }
.studio-empty { padding:42px 24px; min-height:190px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; }
.studio-empty>span { display:grid; place-items:center; background:var(--bg-2); border:1px solid var(--line); border-radius:10px; width:43px; height:43px; margin-bottom:14px; color:var(--ink-faint); }
.studio-empty>strong { font-size:12px; font-weight:500; color:var(--ink-dim); }
.studio-empty p { font-size:11px; color:var(--ink-faint); margin-top:5px; }

/* Project archive */
.studio-project-toolbar { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:14px; border:1px solid var(--line); border-radius:9px; background:var(--panel); margin-bottom:17px; }
.studio-project-filter { display:flex; align-items:center; gap:10px; flex:1; min-width:0; }
.studio-search-field { position:relative; flex:1; max-width:360px; min-width:120px; }
.studio-search-field>.studio-icon { position:absolute; top:50%; left:10px; transform:translateY(-50%); width:15px; height:15px; color:var(--ink-faint); }
.studio-search-field input.proj-search { width:100%; max-width:none; min-width:0; margin:0; height:36px; padding-left:33px; font-size:12px; background:var(--bg); }
.studio-project-toolbar #proj-mode { flex-shrink:0; margin:0; }
.lead-filter { max-width:185px; min-width:135px; width:auto; padding:8px 10px; height:36px; font-size:12px; background:var(--panel); }
.month-head { display:flex; align-items:center; gap:10px; font-family:var(--sans); font-size:13px; font-weight:550; border-bottom:0; padding:0; margin-bottom:14px; }
.month-head .muted { font-size:10px; border:1px solid var(--line); padding:0 6px; border-radius:4px; background:var(--panel); font-weight:400; }
.month-group { margin-bottom:28px; }
.studio-project-card { position:relative; padding:21px 22px 17px; border-left:1px solid var(--line); transition:border-color .15s; }
.studio-project-card:hover,html.dark .studio-project-card:hover { border-color:color-mix(in srgb,var(--ink) 28%,var(--line)); box-shadow:var(--shadow-hover); }
.studio-project-card-top { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:17px; }
.studio-project-code { font-family:var(--mono); font-size:10px; color:var(--ink-faint); letter-spacing:.02em; }
.studio-project-card-title { display:flex; align-items:flex-start; gap:16px; justify-content:space-between; }
.studio-project-card-title h3 { font-size:17px; font-weight:550; line-height:1.4; letter-spacing:-.015em; overflow-wrap:anywhere; }
.studio-project-card-title>.studio-icon { width:18px; height:18px; color:var(--ink-faint); margin-top:3px; }
.studio-project-client { color:var(--ink-dim); font-size:11px; margin-top:7px; }
.studio-project-location { color:var(--ink-faint); font-size:11px; margin-top:5px; }
.studio-project-tags { display:flex; gap:9px; align-items:center; flex-wrap:wrap; margin:15px 0; }
.studio-category { display:inline-flex; align-items:center; gap:5px; font-size:10px; color:var(--ink-dim); }
.studio-category i { display:inline-block; width:6px; height:6px; border-radius:50%; }
.studio-project-money { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px 12px; padding:11px 12px; background:var(--panel-2); border:1px solid var(--line-soft); border-radius:6px; font-size:10px; color:var(--ink-dim); margin-bottom:15px; }
.studio-project-money>span { display:flex; gap:4px; align-items:baseline; justify-content:space-between; }
.studio-project-money b { font-size:11px; font-weight:500; }
.studio-project-card-foot { display:flex; gap:12px; justify-content:space-between; align-items:center; padding-top:13px; border-top:1px solid var(--line-soft); color:var(--ink-dim); font-size:10px; }
.studio-project-dates { display:inline-flex; align-items:center; gap:5px; flex-wrap:wrap; }
.studio-project-dates svg { width:13px; height:13px; }
.studio-project-crew { display:flex; align-items:center; gap:5px; min-width:0; text-align:right; }
.studio-crew-count { background:var(--bg-2); border:1px solid var(--line); padding:1px 5px; border-radius:4px; }
.studio-card-complete { display:inline-flex; align-items:center; gap:4px; border:0; border-radius:4px; padding:4px 7px; background:var(--panel-2); font-size:10px; color:var(--ink-faint); margin-top:12px; }
.studio-card-complete svg { width:12px; height:12px; }
.studio-card-complete:hover { color:var(--green); background:color-mix(in srgb,var(--green) 9%,var(--panel)); }

/* Dialogs and utilities */
.modal-bg { background:rgba(15,20,30,.46); backdrop-filter:blur(4px); padding:24px; }
.modal { background:var(--panel); border:1px solid var(--line); border-radius:13px; box-shadow:0 20px 70px -20px rgba(0,0,0,.3); animation:studio-modal-in .16s ease both; }
.modal-bg.is-leaving { pointer-events:none; animation:studio-modal-out .18s ease forwards; }
.modal-bg.is-leaving .modal { animation:none; }
.modal-head { padding:20px 23px 16px; border-bottom:1px solid var(--line-soft); align-items:center; gap:16px; }
.modal-head h3 { font-family:var(--sans); font-size:19px; font-weight:550; line-height:1.4; letter-spacing:-.02em; }
.modal-body { padding:22px 23px 23px; }
.modal-foot { gap:8px; padding-top:16px; }
.x { width:28px; height:28px; border-radius:6px; font-size:22px; background:var(--bg-2); color:var(--ink-dim); flex-shrink:0; }
.x:hover { transform:none; background:var(--line); }
@keyframes studio-modal-in { from { opacity:0; transform:translateY(6px); } }
@keyframes studio-modal-out { to { opacity:0; } }
.toast { border-radius:8px; background:var(--primary); color:var(--on-primary); border:1px solid transparent; box-shadow:var(--shadow); font-size:12px; max-width:calc(100vw - 32px); }
.toast.err { background:var(--panel); color:var(--red); border-color:var(--red); }
#chat-fab { width:44px; height:44px; right:22px; bottom:87px; background:var(--primary); color:var(--on-primary); box-shadow:var(--shadow); border-radius:12px; font-size:19px; }
#chat-panel { border-color:var(--line); border-radius:12px; }
#checkin-widget { font-size:11px; padding:7px 12px 7px 8px; border-radius:8px; border-color:var(--line); box-shadow:var(--shadow-rest); right:22px; bottom:20px; }
#checkin-widget .ci-icon { background:color-mix(in srgb,var(--green) 10%,var(--panel)); color:var(--green); width:26px; height:26px; font-size:13px; }
#checkin-widget .ci-text,#checkin-widget .ci-sub { font-size:10px; }
#checkin-widget .ci-text b { font-size:13px; font-weight:550; }
#checkin-dot { background:var(--panel); border:1px solid var(--line); color:var(--green); }

/* Login: editorial identity on the left, a focused form on the right. */
.login-wrap { background:var(--bg); color:var(--ink); background-image:none; }
.login-card { background:var(--panel); border:1px solid var(--line); border-radius:12px; box-shadow:var(--shadow-rest); }
.login-logo,html.dark .login-logo { filter:none; }
html.dark .login-logo { filter:brightness(0) invert(1); }
.login-studio { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); padding:0; min-height:100dvh; }
.login-editorial { position:relative; display:flex; flex-direction:column; justify-content:space-between; align-self:stretch; width:100%; min-height:100dvh; background:#625574; padding:42px 9%; color:#fff; overflow:hidden; }
.login-brand { display:flex; gap:14px; align-items:center; font-size:14px; font-weight:550; letter-spacing:.09em; }
.login-brand img { width:42px; height:32px; object-fit:contain; filter:brightness(0) invert(1); }
.login-editorial-content { padding:90px 0; position:relative; }
.login-editorial-content .eyebrow { font-size:10px; color:#aeb9ca; letter-spacing:.16em; margin-bottom:25px; }
.login-editorial h1 { font-family:"Archivo",var(--sans); font-size:clamp(44px,4.5vw,74px); letter-spacing:-.065em; font-weight:550; line-height:1.08; font-stretch:100%; }
.login-editorial h1>span { color:#d8e1c8; }
.login-editorial-content p { color:#aeb9ca; font-size:13px; line-height:1.9; margin-top:22px; }
.login-workflow { display:flex; gap:25px; margin-top:56px; padding-top:20px; border-top:1px solid #394251; font-family:var(--mono); font-size:9px; color:#9ca9bd; }
.login-workflow>span { display:flex; gap:8px; align-items:center; }
.login-workflow b { font-family:var(--sans); font-weight:450; font-size:9px; color:#ccd4df; letter-spacing:.08em; }
.login-editorial-foot { display:flex; gap:12px; justify-content:space-between; font-family:var(--mono); font-size:8px; color:#a1adc0; letter-spacing:.07em; }
.login-form-area { display:grid; place-items:center; width:100%; padding:76px 32px 52px; }
.login-studio .login-card { max-width:380px; padding:0; background:transparent; box-shadow:none; border:0; border-radius:0; }
.login-card h2 { font-size:30px; font-weight:600; line-height:1.3; letter-spacing:-.04em; }
.login-intro { font-size:12px; line-height:1.8; color:var(--ink-dim); margin:9px 0 32px; }
.login-studio .field { margin-bottom:18px; }
.login-studio input { height:43px; border-radius:7px; font-size:13px; background:var(--panel); border-color:var(--line); }
.login-studio input:focus { border-color:var(--accent); box-shadow:var(--ring); }
.password-field { position:relative; }
.password-field input { padding-right:40px; }
.password-field button { position:absolute; right:6px; top:6px; width:31px; height:31px; background:none; border:0; border-radius:5px; color:var(--ink-faint); }
.password-field svg { width:17px; height:17px; }
.captcha-row { display:flex; align-items:center; gap:8px; }
.captcha-row input { flex:1; min-width:0; text-transform:uppercase; }
#lg-captcha-img { cursor:pointer; line-height:0; border:1px solid var(--line); border-radius:6px; overflow:hidden; flex-shrink:0; background:#fff; }
#lg-captcha-img svg { height:41px; width:auto; max-width:130px; }
.captcha-row #lg-captcha-refresh { flex-shrink:0; width:34px; height:41px; min-height:41px; padding:0; font-size:20px; }
.login-options { display:flex; gap:8px; align-items:center; justify-content:space-between; margin:4px 0 23px; font-size:11px; }
.login-options .chk { font-size:11px; margin:0; color:var(--ink-dim); gap:6px; }
.login-options input { width:13px; height:13px; }
.login-options a { color:var(--ink-dim); }
.login-studio .login-submit { width:100%; min-height:44px; font-size:13px; justify-content:space-between; padding-inline:16px; }
.login-studio .login-passkey { width:100%; margin-top:12px; min-height:42px; font-size:12px; }
.login-studio .login-copyright { margin-top:40px; padding-top:21px; border-top:1px solid var(--line); font-family:var(--sans); font-size:10px; text-align:left; letter-spacing:0; color:var(--ink-faint); }
.login-mobile-brand { display:none; }

/* Creative studio identity: solid color surfaces and light graphic gestures. */
.eyebrow { color:var(--accent); }
.workspace-header { background:var(--bg); }
.studio-creative-head { position:relative; min-height:88px; }
.studio-creative-head h1 { font-size:36px; font-weight:650; }
.studio-head-art { display:flex; align-items:center; gap:20px; margin-left:auto; color:var(--accent); pointer-events:none; }
.studio-head-art svg { width:96px; height:56px; opacity:.35; transform:rotate(-9deg); }
.studio-head-art span { font-family:"Snell Roundhand","Segoe Script",cursive; font-style:italic; font-size:25px; line-height:1.1; letter-spacing:-.04em; transform:rotate(-5deg); }
.studio-kpis .studio-kpi { position:relative; overflow:hidden; isolation:isolate; border:1px solid var(--kpi-bg); background:var(--kpi-bg); color:var(--kpi-ink); }
.studio-kpi-projects { --kpi-bg:#625574; --kpi-ink:#fff; }
.studio-kpi-opportunities { --kpi-bg:#d8e1c8; --kpi-ink:#302b38; }
.studio-kpi-tasks { --kpi-bg:#dcd3e7; --kpi-ink:#302b38; }
.studio-kpi-approvals { --kpi-bg:var(--panel); --kpi-ink:var(--ink); }
.studio-kpis .studio-kpi-approvals { border-color:var(--line); }
.studio-kpis .studio-kpi .num { font-size:44px; font-weight:600; color:var(--kpi-ink); letter-spacing:-.055em; }
.studio-kpis .studio-kpi .lbl,.studio-kpis .studio-kpi .studio-icon { color:var(--kpi-ink); }
.studio-kpis .studio-kpi .studio-kpi-foot { color:var(--kpi-ink); border-color:color-mix(in srgb,var(--kpi-ink) 22%,transparent); }
.studio-kpis .studio-kpi>* { position:relative; z-index:1; }
.studio-kpis .studio-kpi::after { content:""; display:block; position:absolute; z-index:0; width:96px; height:44px; top:64px; right:-16px; border:2px solid currentColor; border-radius:50%; transform:rotate(-38deg); opacity:.12; pointer-events:none; }
.studio-kpis .studio-kpi-opportunities::after { width:110px; height:140px; border-radius:50% 50% 0 0; right:-22px; top:42px; transform:rotate(30deg); }
.studio-kpis .studio-kpi-approvals::after { width:76px; height:100px; border:0; border-radius:0; background-image:radial-gradient(currentColor 1px,transparent 1px); background-size:7px 7px; top:34px; right:8px; transform:rotate(-15deg); opacity:.10; }
.studio-kpis .studio-kpi:hover,html.dark .studio-kpis .studio-kpi:hover { background:var(--kpi-bg); border-color:var(--kpi-bg); box-shadow:0 4px 16px -8px rgba(70,53,88,.20); }
.studio-kpis .studio-kpi-approvals:hover,html.dark .studio-kpis .studio-kpi-approvals:hover { border-color:var(--accent); }
html.dark .studio-kpis .studio-kpi { background:var(--kpi-bg); border-color:var(--kpi-bg); }
html.dark .studio-kpis .studio-kpi-approvals { border-color:var(--line); }
.studio-panel-head h2 { font-weight:600; }
.studio-count { background:var(--lavender); color:#514261; border-color:var(--lavender); }
.studio-event-date { background:var(--lime); color:#302b38; border-color:var(--lime); }
.studio-event-date small,.studio-event-date strong { color:inherit; }
.studio-event .tag { background:var(--gold-bg); color:var(--accent); }
.studio-reminder-index { color:var(--accent); }
.studio-project-card { border-top:3px solid var(--violet); }
.studio-project-card-top .studio-project-code { color:var(--accent); }
.studio-project-card-title>.studio-icon { color:var(--accent); }
.studio-project-money { background:var(--panel-2); }
.studio-project-card:hover,html.dark .studio-project-card:hover { border-color:var(--accent); }
.pill-tabs button.active,html.dark .pill-tabs button.active { background:var(--lavender); color:#514261; }
.login-editorial-content .eyebrow,.login-editorial-content p { color:#dcd3e7; }
.login-workflow { color:#dcd3e7; border-color:#9789a5; }
.login-workflow b,.login-editorial-foot { color:#dcd3e7; }
.login-editorial-content::after { content:""; position:absolute; width:220px; height:90px; border:2px solid #d8e1c8; border-radius:50%; transform:rotate(-25deg); right:-35px; bottom:10px; opacity:.45; pointer-events:none; }
.login-workflow>span:first-child { background:#d8e1c8; color:#302b38; border-radius:5px; padding:5px 8px; }
.login-workflow>span:first-child b { color:#302b38; }
html.dark .sidebar { background:#4b425a; border-color:#675b78; }
html.dark .nav-foot { background:#453b52; }
@media (max-width:1200px) { .studio-head-art { gap:10px; } .studio-head-art svg { width:58px; } .studio-head-art span { font-size:20px; } }
@media (max-width:980px) { .studio-head-art { display:none; } }

/* Tablet and mobile */
@media (min-width:1800px) { .main { max-width:1580px; padding:40px 48px; } .workspace-header { padding-inline:48px; } }
@media (max-width:1200px) {
  .workspace-header { padding-inline:24px; gap:14px; }
  .workspace-crumb { display:none; }
  .main { padding:28px 24px; }
  .studio-kpis { gap:12px; }
  .studio-kpi { padding:18px 16px 14px; }
  .studio-kpi-top .lbl { font-size:10px; }
  .studio-dashboard-grid { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:18px; }
  .studio-panel-head,.studio-reminder,.studio-event { padding-inline:18px; }
}
@media (max-width:980px) and (min-width:761px) {
  .shell { grid-template-columns:210px minmax(0,1fr); }
  .side-brand { padding-inline:16px; }
  .side-brand strong { font-size:12px; }
  .main { padding:26px 20px; }
  .studio-kpis { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .studio-dashboard-grid { grid-template-columns:1fr; }
  .studio-project-toolbar { align-items:stretch; flex-direction:column; }
  .studio-project-toolbar #proj-mode { align-self:flex-end; }
  .studio-project-filter { flex-wrap:wrap; }
  .studio-date { display:block; border:0; margin:4px 0 0; padding:0; }
  .pres-count { display:none; }
  .login-editorial { padding-inline:10%; }
}
@media (max-width:760px) {
  #app,.main { overflow-x:clip; overflow-y:visible; }
  .shell { display:block; }
  .mobile-topbar { display:flex; min-height:58px; gap:10px; position:sticky; top:0; z-index:42; background:var(--panel); border-bottom:1px solid var(--line); padding:10px 16px; padding-top:max(10px,env(safe-area-inset-top)); }
  .hamburger { display:grid; place-items:center; width:30px; height:30px; padding:0; border:0; background:transparent; color:var(--ink); border-radius:6px; }
  .hamburger svg { width:20px; height:20px; }
  .mobile-wordmark { font-size:15px; font-weight:650; letter-spacing:.07em; color:var(--ink); }
  .mobile-wordmark>span { display:block; font-size:6px; line-height:1; letter-spacing:.14em; color:var(--ink-faint); }
  .sidebar { position:fixed; z-index:1002; left:0; top:0; bottom:0; width:268px; height:100dvh; transform:translateX(-100%); transition:transform .2s ease; padding:0; }
  .sidebar.open { transform:translateX(0); box-shadow:12px 0 50px rgba(0,0,0,.2); }
  .scrim.show { display:block; z-index:1001; background:rgba(10,15,24,.4); backdrop-filter:blur(2px); }
  .sidebar .nav-item { min-height:42px; font-size:14px; }
  .nav-group summary { padding-block:10px; }
  .side-brand { padding-top:max(24px,env(safe-area-inset-top)); }
  .nav-foot { padding-bottom:max(16px,env(safe-area-inset-bottom)); }
  .workspace-header { position:relative; top:auto; z-index:36; min-height:0; padding:12px 16px; background:var(--bg); border-bottom:0; }
  .workspace-header .gsearch-wrap { max-width:none; width:100%; min-width:0; }
  #gsearch-input { background:var(--panel); border:1px solid var(--line); height:40px; font-size:16px; padding:9px 12px 9px 37px; }
  .header-tools { width:0; }
  .mobile-topbar #topbar-tools { position:static; top:auto; right:auto; z-index:auto; margin-left:auto; display:flex; align-items:center; gap:6px; }
  #theme-toggle,#notif-fab { width:30px; height:30px; }
  #presence-widget { display:none; }
  #lang-toggle button { padding:4px 5px; font-size:10px; min-width:24px; }
  .main { padding:15px 16px 85px; max-width:none; }
  .page-head { margin-bottom:20px; gap:12px; align-items:flex-start; }
  .page-head > div:first-child { flex:initial; width:100%; }
  .studio-page-head { flex-direction:row; flex-wrap:wrap; }
  .studio-page-head > div:first-child { flex:1 1 180px; width:auto; }
  .studio-page-head > .btn { width:auto; }
  .page-head h1 { font-size:25px; }
  .page-head p { font-size:12px; }
  .eyebrow { font-size:9px; margin-bottom:6px; }
  .studio-date { display:block; border:0; margin:4px 0 0; padding:0; font-size:10px; }
  .studio-page-head>.btn { margin-top:20px; }
  .studio-kpis { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-bottom:20px; }
  .studio-kpi { padding:17px 15px 13px; }
  .studio-kpi-top>.studio-icon { width:15px; height:15px; }
  .studio-kpi-top .lbl { font-size:10px; line-height:1.45; }
  .studio-kpi .num { font-size:34px !important; margin:13px 0 15px; }
  .studio-kpi-foot { font-size:9px; padding-top:10px; }
  .studio-dashboard-grid { grid-template-columns:1fr; gap:18px; }
  .studio-panel-head { padding:18px; }
  .studio-panel-head h2 { font-size:15px; }
  .studio-panel-head p { font-size:10px; }
  .studio-reminder { padding:18px; font-size:12px; }
  .studio-event { padding:15px 18px; }
  .studio-empty { min-height:170px; padding:32px 20px; }
  .studio-project-toolbar { display:flex; flex-direction:column; align-items:stretch; padding:12px; gap:12px; }
  .studio-project-filter { flex-direction:column; align-items:stretch; }
  .studio-search-field { max-width:none; width:100%; }
  .studio-search-field input.proj-search { font-size:16px; }
  .studio-project-toolbar #proj-mode { align-self:flex-start; width:auto; }
  .lead-filter { max-width:none; min-width:0; width:100%; font-size:16px; }
  .cat-filter { flex-wrap:nowrap; max-width:100%; overflow:auto; margin-bottom:20px; padding-bottom:3px; }
  .cat-filter button { flex-shrink:0; }
  .studio-project-card { padding:19px 18px 16px; }
  .studio-project-card-title h3 { font-size:17px; }
  .studio-project-card-foot { align-items:flex-start; }
  .studio-project-dates { font-size:10px; max-width:70%; }
  .studio-card-complete { min-height:30px; }
  .studio-head-actions { width:100%; }
  .studio-head-actions .btn { flex:1; }
  .app-footer { flex-wrap:wrap; justify-content:flex-start; margin-top:24px; font-size:9px; padding-top:17px; }
  .btn { min-height:38px; font-size:12px; }
  input,select,textarea { font-size:16px; }
  .card { padding:16px; }
  .studio-panel { padding:0; }
  .cal-cell { padding:4px; min-height:78px; }
  .cal-h { padding:10px 2px; }
  .cal-ev,.cal-proj { font-size:9px; padding:2px 3px; }
  .modal-bg { padding:0; align-items:end; place-items:end center; overflow:hidden; }
  .modal,.modal.modal-wide,.modal.modal-xwide { width:100%; max-width:100%; margin:0; max-height:92dvh; border-radius:15px 15px 0 0; padding-bottom:env(safe-area-inset-bottom); }
  .modal::before { content:""; display:block; width:32px; height:4px; border-radius:4px; margin:8px auto 0; background:var(--line); }
  .modal-head { padding:12px 18px 15px; }
  .modal-head h3 { font-size:18px; }
  .modal-body { padding:18px; }
  .modal-foot { padding-top:12px; background:var(--panel); }
  #chat-fab { right:16px; bottom:82px; width:42px; height:42px; }
  #chat-panel { right:12px; bottom:134px; max-width:calc(100vw - 24px); }
  #checkin-widget { right:16px; bottom:20px; }
  body>#topbar-tools { top:18px; right:18px; }
  .login-studio { display:block; }
  .login-editorial { display:none; }
  .login-form-area { min-height:100dvh; padding:88px 26px 44px; align-items:center; }
  .login-mobile-brand { display:block; font-size:15px; font-weight:600; letter-spacing:.1em; margin-bottom:52px; }
  .login-mobile-brand>span { display:block; font-family:var(--mono); font-size:8px; font-weight:400; color:var(--ink-faint); letter-spacing:.16em; margin-top:4px; }
  .login-card h2 { font-size:28px; }
  .login-studio input { font-size:16px; }
  .login-studio .login-copyright { margin-top:30px; }
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; }
}

/* v1.10.1 — notices sit above modals (3000) and overlays (4000) */
.toast { z-index: 5000; }