:root{--ink:#2f302d;--muted:#827b72;--cream:#f7f4ef;--paper:#fffdfa;--line:#e9e1d7;--peach:#fae5d6;--green:#e5f1e7;--purple:#eee8fa;--pink:#f9e1e8;--accent:#aa6f50;--shadow:0 8px 24px #44352609;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--cream);font-size:14px}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button,a,input,select,textarea{touch-action:manipulation}button{cursor:pointer;border:0;color:inherit}button:disabled{opacity:.5;cursor:wait}a{color:var(--accent);text-underline-offset:3px}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #ab87d9;outline-offset:3px}[hidden]{display:none!important}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(25px,3.3vw,36px);letter-spacing:-.045em;line-height:1.2}h2{font-size:19px;letter-spacing:-.025em}h3{font-size:14px}p{line-height:1.6}small{font-size:11px;color:var(--muted);line-height:1.5}input,select,textarea{width:100%;min-width:0;border:1px solid var(--line);border-radius:10px;padding:12px;background:#fffdfa;color:var(--ink);font-size:14px}textarea{resize:vertical;min-height:86px}input[type=checkbox]{width:18px;height:18px;margin:0}label{display:grid;gap:6px;font-size:12px;font-weight:650;color:#665f56}ul{padding-left:20px}code{font-size:11px;overflow-wrap:anywhere}.brand{display:flex;gap:10px;align-items:center;text-decoration:none;color:var(--ink)}.brand strong,.brand small{display:block}.brand strong{font-size:17px;letter-spacing:-.04em}.brand-mark{width:38px;height:38px;display:grid;place-items:center;border-radius:13px;background:var(--ink);color:#fff4df;font-size:21px}.office-root{display:grid;grid-template-columns:228px minmax(0,1fr);min-height:100vh}.sidebar{position:sticky;top:0;height:100vh;padding:28px 16px;border-right:1px solid var(--line);background:#fffaf3;display:flex;flex-direction:column;z-index:30}.sidebar .brand{padding:0 8px 22px}.sidebar nav{overflow:auto;display:grid;gap:3px}.nav-link{display:flex;align-items:center;gap:11px;padding:12px;border-radius:11px;text-decoration:none;color:#79716a;min-height:44px;font-size:12px}.nav-link.active{background:var(--pink);color:#9f526b;font-weight:750}.nav-icon{width:21px;text-align:center;font-size:17px}.sidebar-footer{margin-top:auto;padding:20px 8px 0;display:grid;gap:9px}.legacy-link{font-size:11px}.workspace{min-width:0}.topbar{position:sticky;top:0;z-index:20;min-height:78px;padding:14px 28px;display:flex;gap:12px;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);background:#f7f4eff2;backdrop-filter:blur(12px)}.topbar strong{font-size:17px}.eyebrow{display:block;font-size:9px;font-weight:750;letter-spacing:.11em;text-transform:uppercase;color:#a08b77;margin-bottom:5px}.top-actions{display:flex;align-items:center;gap:8px}.mode-chip{display:inline-flex;align-items:center;gap:5px;border-radius:20px;padding:6px 9px;font-size:9px;font-weight:750;white-space:nowrap;background:var(--green);color:#64836c}.mode-chip.offline{background:#fff1d9;color:#966a33}.icon-button{display:grid;place-items:center;width:44px;height:44px;background:transparent;border-radius:10px;font-size:21px}.soft,.primary,.danger{display:inline-flex;align-items:center;justify-content:center;gap:6px;border-radius:11px;padding:11px 14px;min-height:44px;font-size:12px;font-weight:700;text-decoration:none}.soft{background:#f2eae1;color:#7c6757}.primary{background:var(--ink);color:#fffaf0}.danger{background:#fae0dd;color:#a55a52}.mobile-only{display:none}main{padding:26px 28px 50px;max-width:1360px;margin:auto;min-width:0}.page-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:18px}.page-heading p{margin:7px 0 0;color:var(--muted);font-size:12px;max-width:690px}.actions{display:flex;gap:7px;flex-wrap:wrap}.card{background:var(--paper);border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow);padding:20px;margin-bottom:16px;min-width:0}.card-header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}.card-header h2,.card-header h3{margin:0}.notice{border-radius:12px;padding:12px 14px;background:#f1f6ee;border:1px solid #dce6d6;color:#63765f;font-size:12px;line-height:1.6;margin-bottom:16px}.notice.warning{background:#fff3df;border-color:#f0e2c6;color:#936c35}.notice.error{background:#fff0ed;border-color:#efcfc8;color:#a45349}.notice strong{display:block}.notice a{color:inherit}.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:20px}.stat{padding:17px;border-radius:17px;border:1px solid var(--line);background:var(--paper);min-width:0}.stat:nth-child(2){background:#eff4fc}.stat:nth-child(3){background:#edf6ee}.stat:nth-child(4){background:#fff2e5}.stat strong{font-size:27px;display:block;margin:8px 0 4px;letter-spacing:-.04em}.stat span{display:block;color:#736b63;font-size:11px}.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.list{display:grid;gap:10px}.record{padding:14px;border:1px solid var(--line);border-radius:13px;min-width:0}.record-top{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;margin-bottom:8px}.record-top h3{margin:0;overflow-wrap:anywhere}.record p{margin:7px 0;font-size:12px;color:#70675e;overflow-wrap:anywhere}.record small{display:block;margin-top:4px}.record .actions{margin-top:10px}.badge{display:inline-block;padding:5px 7px;border-radius:8px;background:#f0e7dd;color:#8b745d;font-size:9px;font-weight:750;white-space:nowrap}.badge.green{background:#e4f1e6;color:#567c5e}.badge.pink{background:#f7e1e9;color:#a46078}.badge.red{background:#f9e0dd;color:#a75c53}.badge.blue{background:#e5eef9;color:#627e9f}.badge.purple{background:#ece7f8;color:#75669b}.empty{padding:24px 18px;text-align:center;border:1px dashed #ded4c6;border-radius:13px;background:#fffaf5;color:#8a8074}.empty b{display:block;color:#74695e;font-size:13px;margin-bottom:5px}.empty p{font-size:12px;margin:0}.filter-row{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:15px}.filter-row input{flex:1;min-width:180px}.filter-row select{width:auto}.table-scroll{overflow:auto;border:1px solid var(--line);border-radius:12px}.data-table{width:100%;border-collapse:collapse;text-align:left;min-width:500px;font-size:12px}.data-table th{font-size:10px;color:#81766a;background:#f6f0e9;padding:12px}.data-table td{padding:12px;border-top:1px solid var(--line);vertical-align:top}.data-table small{display:block}.source-note{font-size:11px;line-height:1.5;color:var(--muted);margin-top:10px}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.form-grid .wide{grid-column:1/-1}.form-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px;justify-content:flex-end}.form-help{font-size:11px;color:#8b7d6e;line-height:1.6;margin:12px 0}.check-label{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:400}.error-text{color:#a75147;font-size:12px;line-height:1.5;margin-top:12px}.form-dialog{border:1px solid var(--line);border-radius:22px;background:var(--paper);padding:22px;width:min(590px,calc(100vw - 28px));max-height:calc(100vh - 36px);overflow:auto;color:var(--ink);box-shadow:0 25px 80px #3f2d2130}.form-dialog::backdrop{background:#352d294f;backdrop-filter:blur(3px)}.dialog-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.dialog-heading h2{margin:0}.auth-root{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 20% 20%,#fae5d64d,transparent 45%),var(--cream)}.auth-card{width:min(460px,100%);padding:30px;border:1px solid var(--line);border-radius:24px;background:var(--paper);box-shadow:0 20px 80px #6247290d}.auth-card .brand{margin-bottom:28px}.auth-card form{display:grid;gap:14px}.auth-card h1{font-size:27px;margin-bottom:10px}.auth-card p{font-size:12px;color:var(--muted)}.auth-card .primary{width:100%}.bottom-nav{display:none}.session-notice{padding:10px 28px;background:#fff0d5;color:#966c35;font-size:12px;line-height:1.5}.toast{position:fixed;left:50%;bottom:25px;transform:translate(-50%,12px);opacity:0;pointer-events:none;z-index:80;background:#2f302d;color:white;border-radius:12px;padding:12px 16px;box-shadow:var(--shadow);font-size:12px;max-width:calc(100vw - 30px);transition:.18s}.toast.show{transform:translate(-50%,0);opacity:1}.media-preview{max-width:100%;max-height:180px;border-radius:10px;object-fit:contain}.workers{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.worker{padding:14px;border-radius:14px;border:1px solid var(--line);background:#fffaf5}.worker strong{display:block;margin-bottom:5px}.worker small{display:block}.manual-link{display:block;padding:14px;border:1px solid var(--line);border-radius:13px;color:var(--ink);text-decoration:none;background:#fffaf5}.manual-link b,.manual-link small{display:block}.manual-link b{margin-bottom:5px}.number-list{list-style:none;margin:0;padding:0}.number-list li{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--line);font-size:12px}.number-list li:last-child{border-bottom:0}.audit-event{padding:10px 0;border-top:1px solid var(--line);font-size:11px;overflow-wrap:anywhere}.audit-event b{display:block}.photo-note{margin:10px 0;font-size:11px;color:#85776c}.receipt-items{font-size:11px;line-height:1.7}.worker-scope{font-size:11px;background:#f4eee7;padding:9px;border-radius:9px;line-height:1.5}.route-error{min-height:300px;display:grid;place-content:center}.drawer-scrim{position:fixed;inset:0;background:#2a211c66;z-index:25}.entry-divider{margin:18px 0;border-top:1px solid var(--line)}
@media(min-width:1400px){main{padding:30px 36px}.stats{gap:16px}.card{padding:22px}.sidebar{padding:30px 18px}}
@media(max-width:1024px){.office-root{grid-template-columns:196px minmax(0,1fr)}.sidebar{padding-left:10px;padding-right:10px}.topbar{padding:14px 20px}main{padding:24px 20px}.stats{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-2{grid-template-columns:1fr}.workers{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){.office-root{display:block}.sidebar{position:fixed;left:0;width:258px;transform:translateX(-100%);transition:transform .2s;box-shadow:5px 0 50px #3b2c2526}.sidebar.open{transform:translateX(0)}.mobile-only{display:grid}.topbar{padding:10px 13px;min-height:69px;gap:6px}.topbar strong{font-size:14px}.topbar .eyebrow{font-size:8px}.top-actions{gap:3px}.top-actions .soft{padding:9px 10px;font-size:10px}.top-actions .mode-chip{font-size:8px;padding:5px}.top-actions .icon-button{width:38px}.workspace{padding-bottom:82px}main{padding:20px 16px 30px}.page-heading{display:block}.page-heading .actions{margin-top:12px}.page-heading h1{font-size:26px}.stats{gap:9px}.stat{padding:13px}.stat strong{font-size:23px}.stat span{font-size:10px}.card{padding:16px;border-radius:17px}.form-grid{grid-template-columns:1fr}.form-grid .wide{grid-column:auto}.workers{grid-template-columns:repeat(2,minmax(0,1fr))}.form-dialog{padding:18px}.bottom-nav{position:fixed;bottom:0;left:0;right:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));padding:8px 8px calc(8px + env(safe-area-inset-bottom));min-height:70px;background:#fffdf9f5;border-top:1px solid var(--line);backdrop-filter:blur(14px);z-index:21}.bottom-nav .nav-link{display:flex;flex-direction:column;gap:3px;justify-content:center;font-size:9px;padding:5px 2px;min-height:48px}.bottom-nav .nav-icon{font-size:20px;width:auto}.bottom-nav .nav-link.active{background:transparent;color:#ab647c}.toast{bottom:89px}.session-notice{padding:10px 16px}.auth-root{padding:18px}.auth-card{padding:24px 21px}.filter-row input{min-width:0;width:100%}.filter-row select{width:100%}.record-top{gap:6px}.record-top h3{font-size:13px}.record .actions .soft,.record .actions .primary,.record .actions .danger{font-size:11px;padding:9px 11px}.form-actions{justify-content:stretch}.form-actions button{flex:1}.record .badge{max-width:145px;white-space:normal;text-align:right}.drawer-scrim:not([hidden]){display:block}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
.draft-json{white-space:pre-wrap;overflow-wrap:anywhere;font-size:12px;padding:12px;background:#f5f1ea;border-radius:10px}
.card small{display:block}
.cs-owner-teaching-thread{padding:14px;border:1px solid #e4d6bf;border-radius:13px;background:#fff7e9;margin:14px 0;overflow-wrap:anywhere}.cs-owner-teaching-thread h3{font-size:13px}.cs-owner-question{font-size:13px;line-height:1.65;margin:8px 0}.cs-owner-teaching-thread .actions{margin-top:12px}.cs-owner-answer-history{margin-top:12px}.cs-owner-answer-history summary{font-size:12px;font-weight:700;cursor:pointer;min-height:32px}.cs-owner-answer-history article{padding:9px 0;border-top:1px solid #eadcc5}.cs-owner-answer-history p,.cs-rule-template{white-space:pre-wrap;overflow-wrap:anywhere;font-size:12px;line-height:1.6}.cs-owner-answer-history p{margin:6px 0}.cs-rule-template{padding:10px;background:#f4f0e9;border-radius:9px}
.cs-safety-strip{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 17px;font-size:11px;color:#796e64}.cs-worker-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-bottom:16px}.cs-worker-card{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:8px 12px;padding:20px;border:1px solid var(--line);border-radius:19px;background:linear-gradient(135deg,#fff9f0,#faece5);min-width:0}.cs-worker-card.lala{background:linear-gradient(135deg,#fcfaff,#eeeafa)}.cs-worker-card h2{font-size:24px;margin:0 0 4px}.cs-worker-card p{margin:0;font-size:12px;color:#796e64}.cs-worker-card small{grid-column:1/-1;display:block}.cs-worker-card button{grid-column:1/-1;justify-self:start;margin-top:3px}.cs-worker-card>.badge{margin-top:5px}.cs-stats .stat strong{font-size:28px}.cs-connections{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:15px;border:1px solid var(--line);border-radius:15px;background:#fffaf3;margin-bottom:18px}.cs-connections>div{display:grid;align-content:start;gap:7px;min-width:0}.cs-connections strong{font-size:12px}.cs-connections .badge{justify-self:start}.cs-connections>div>span{display:flex;gap:5px;flex-wrap:wrap}.cs-filters{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:0 0 16px}.cs-workbench{display:grid;grid-template-columns:minmax(230px,.8fr) minmax(0,1.2fr);gap:16px;align-items:start}.cs-inbox{display:grid;gap:10px}.cs-inbox-card{width:100%;display:block;text-align:left;background:#fffaf6;border:1px solid var(--line);border-radius:13px;padding:13px;min-width:0}.cs-inbox-card.selected{border-color:#b77b99;background:#fcf1f6;box-shadow:0 0 0 1px #b77b9940}.cs-inbox-card>div{display:flex;gap:8px;justify-content:space-between;align-items:start}.cs-inbox-card strong{font-size:12px}.cs-inbox-card small{display:block;margin-top:5px;overflow-wrap:anywhere}.cs-inbox-card p{margin:8px 0;line-height:1.5;font-size:12px;overflow-wrap:anywhere}.cs-inbox-card>span{display:flex;gap:5px;flex-wrap:wrap}.cs-identity{padding-bottom:12px;border-bottom:1px solid var(--line);overflow-wrap:anywhere}.cs-identity>b{display:block;font-size:13px;margin:8px 0 4px}.cs-history{margin:16px 0}.cs-history h3{font-size:13px}.cs-message{padding:11px 13px;margin:8px 0;background:#f4efea;border-radius:12px}.cs-message strong{font-size:10px;color:#857062}.cs-message p{font-size:13px;line-height:1.65;margin:5px 0;overflow-wrap:anywhere}.cs-message small{font-size:10px}.cs-draft{padding:14px;background:#f4f7f1;border:1px solid #e0e7d9;border-radius:13px;margin:14px 0}.cs-draft-text{white-space:pre-wrap;font-size:13px;line-height:1.7;overflow-wrap:anywhere}.cs-draft .actions{margin-top:13px}.cs-facts{margin-top:14px;border-top:1px solid #dde4d6;padding-top:11px}.cs-facts summary,.cs-revision-history summary{font-size:12px;font-weight:700;cursor:pointer;min-height:32px}.cs-facts>small{margin:7px 0}.cs-facts .notice{margin:9px 0}.cs-fact-row{padding:10px 0;border-top:1px solid #e1e7da;overflow-wrap:anywhere}.cs-fact-row strong{font-size:12px;display:inline-block;margin:0 7px 5px 0}.cs-fact-row small{display:block;font-size:10px}.cs-queue-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.cs-queue-list .record small{overflow-wrap:anywhere}.cs-revision-history{margin-top:15px;padding:12px;border-radius:12px;background:#fbf5ed}.cs-revision-history p{font-size:12px;margin:9px 0;overflow-wrap:anywhere}
@media(max-width:1100px){.cs-workbench{grid-template-columns:1fr}.cs-inbox{grid-template-columns:repeat(2,minmax(0,1fr))}.cs-connections{grid-template-columns:1fr}.cs-connections>div{grid-template-columns:100px 1fr;align-items:start}.cs-connections>div>small{grid-column:1/-1}}
@media(max-width:760px){.cs-worker-grid{gap:9px}.cs-worker-card{padding:14px;grid-template-columns:1fr;gap:7px}.cs-worker-card h2{font-size:22px}.cs-worker-card>.badge{justify-self:start;margin:0}.cs-worker-card p,.cs-worker-card small{font-size:10px}.cs-worker-card button{font-size:10px;padding:9px;justify-self:stretch}.cs-safety-strip{gap:6px;font-size:10px}.cs-filters{grid-template-columns:1fr;gap:10px}.cs-inbox{grid-template-columns:1fr}.cs-queue-list{grid-template-columns:1fr}.cs-draft{padding:12px}.cs-connections{padding:13px}.cs-connections>div{grid-template-columns:80px 1fr}.cs-stats .stat strong{font-size:25px}.cs-workbench .card-header h2{font-size:18px}}

/* Visual Rebuild Phase 1. Shared tokens/shell; page composition is scoped
   to Owner Home, Worker Directory, and CS. No runtime/business state here. */
:root {
  --ink:#182337; --muted:#716655; --cream:#fff5e9; --paper:#fffdf9;
  --line:#efddcc; --peach:#ffe4cb; --pink:#ffe0eb; --green:#e2f7ec;
  --purple:#eee6ff; --accent:#2468f8; --shadow:0 5px 20px #966d4010;
  font-family:Inter,"Segoe UI",ui-sans-serif,system-ui,sans-serif; font-size:14px;
}
body { background:linear-gradient(135deg,#fff8f0,#fff0de); }
h1,h2,h3 { letter-spacing:-.025em; }
p { line-height:1.6; }
small { color:var(--muted); font-size:12px; }
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible { outline:3px solid #2468f8; outline-offset:3px; }
.primary { background:#2468f8; color:#fff; box-shadow:0 4px 12px #2468f82a; }
.soft { background:#eaf1ff; color:#175cdb; }
.danger { background:#ffe9e9; color:#ae344d; }
.primary,.soft,.danger { font-size:13px; border-radius:12px; min-height:44px; }
input,select,textarea { background:#fff; border-color:#eadfD5; font-size:14px; }
.card { background:#fffdfaee; border-radius:20px; border-color:var(--line); box-shadow:var(--shadow); }
.card-header { gap:10px; flex-wrap:wrap; }
.card-header h2 { font-size:19px; }
.record { background:#fffdf9; border-color:#f0e3d6; border-radius:14px; }
.record-top { flex-wrap:wrap; }
.record small,.record p { font-size:12px; }
.badge { font-size:10px; padding:5px 8px; max-width:100%; white-space:normal; overflow-wrap:anywhere; }
.badge.green { background:#e0f7e6; color:#16733b; }
.badge.pink { background:#ffe0e9; color:#a6305e; }
.badge.red { background:#ffe3e3; color:#ac3340; }
.badge.blue { background:#e4efff; color:#225ead; }
.badge.purple { background:#eee5ff; color:#6945a4; }
.notice { background:#edf8f1; color:#416c53; font-size:12px; }
.notice.warning { background:#fff4df; color:#87521d; }
.notice.error { background:#fff0ef; color:#a33e39; }
.empty { background:#fffaf4; border-color:#e8d5c4; }
.stats { gap:12px; }
.stat { background:#fffefb; border-color:#f0ddcc; }
.stat strong { color:var(--ink); }
.sidebar { background:#fffdf7; border-color:#edddcd; padding:24px 14px; }
.brand-mark { background:#ffebd2; color:#eb9132; border-radius:12px; }
.brand-mark svg { width:26px; height:26px; }
.sidebar .nav-link { font-size:12px; color:#716f79; gap:10px; min-height:46px; }
.nav-link.active { background:#eaf0ff; color:#2468f8; }
.nav-icon { display:grid; place-items:center; flex:0 0 22px; width:22px; }
.nav-icon svg { width:22px; height:22px; }
.sidebar-footer small { font-size:11px; }
.topbar { min-height:74px; background:#fffdfaee; border-color:var(--line); padding:12px 24px; }
.topbar strong { font-size:18px; }
.topbar .eyebrow { font-size:10px; letter-spacing:.09em; }
.mode-chip { font-size:10px; color:#287549; background:#e1f5e7; }
main { padding:24px 24px 52px; }
.page-heading { margin-bottom:20px; }
.page-heading h1 { font-size:30px; margin-bottom:6px; }
.page-heading p { font-size:13px; color:#716655; }
.page-heading .eyebrow { font-size:10px; }
.form-dialog { background:#fffdfa; border-radius:20px; }
.form-dialog .form-help { font-size:12px; }
.dialog-heading h2 { overflow-wrap:anywhere; }
.toast { bottom:24px; }
.portrait-frame { display:block; flex:none; position:relative; overflow:hidden; width:128px; height:180px; border-radius:16px; background:linear-gradient(150deg,#ffe3ed,#fff5e6); }
.staff-sprite { display:block; width:100%; height:100%; background-image:var(--staff-art); background-size:921.6px 614.4px; background-position:-134px -2px; background-repeat:no-repeat; }
.portrait-lala { background:linear-gradient(150deg,#d9eeff,#f3e8ff); }
.portrait-maya { background:linear-gradient(150deg,#ffe5c8,#ffeedf); }
.worker-initial { display:grid; place-items:center; color:#8c789f; background:linear-gradient(150deg,#f4eaf8,#fff5e4); font-size:42px; }
.official-sprite,.official-avatar { display:block; background-image:url('/v2/assets/bunbun-aces-reference.png'); background-repeat:no-repeat; }
.official-sprite { position:absolute; background-size:1536px 1024px; transform-origin:bottom left; mix-blend-mode:multiply; }
.bunbun-front { width:125px; height:340px; background-position:-31px -111px; left:28px; bottom:0; transform:scale(.82); }
.aces-front { width:122px; height:196px; background-position:-40px -603px; left:151px; bottom:0; transform:scale(1.05); }
.official-avatar { flex:none; width:64px; height:64px; border-radius:50%; background-size:768px 512px; background-position:-259px -60px; border:2px solid #fff6eb; }
.home-hero { position:relative; min-height:320px; overflow:hidden; border-radius:24px; background:#f9e3c6 url('/assets/virtual-office/environment/office-main.webp') center 9% / cover; border:1px solid #e9ccb0; margin-bottom:16px; box-shadow:var(--shadow); }
.home-hero::before { content:""; position:absolute; inset:0; background:linear-gradient(90deg,#fff7e9f7 0%,#fff7e9ed 44%,#ffefdc55 70%); }
.hero-brand { position:relative; display:flex; align-items:center; gap:9px; padding:24px 28px 8px; }
.hero-brand-icon { width:42px; height:42px; display:grid; place-items:center; color:#f4902f; background:#fff; border-radius:12px; transform:rotate(-6deg); box-shadow:0 3px 8px #a75a331a; }
.hero-brand-icon svg { width:29px; height:29px; }
.hero-brand b { display:block; font-size:24px; letter-spacing:-.035em; font-weight:900; }
.hero-brand small { display:block; color:#384756; font-size:12px; }
.hero-welcome { position:relative; width:54%; padding:25px 28px 28px; }
.hero-welcome h1 { font-size:30px; line-height:1.25; margin:8px 0; overflow-wrap:anywhere; }
.hero-welcome p { font-size:14px; max-width:420px; margin:0 0 12px; }
.hero-source { display:inline-flex; font-size:10px; padding:6px 9px; color:#69533d; background:#ffffffc9; border-radius:8px; }
.hero-art { position:absolute; right:15px; bottom:12px; width:320px; height:290px; border-radius:26px; background:linear-gradient(150deg,#fff8ee4d,#fff5e3f2 72%); }
.home-stats .stat { padding:14px 18px; display:grid; grid-template-columns:34px 1fr; gap:2px 9px; align-items:center; background:#fffefa; }
.home-stats .stat-symbol { grid-column:1; grid-row:1/3; display:grid; place-items:center; width:34px; height:36px; border-radius:10px; }
.stat-symbol svg { width:22px; height:22px; }
.stat-symbol.peach { background:#fff1d9; color:#ee950e; }
.stat-symbol.pink { background:#ffe5f0; color:#ee628d; }
.stat-symbol.green { background:#e5f9ed; color:#17a862; }
.stat-symbol.purple { background:#f1e7ff; color:#9b64e8; }
.home-stats .stat strong { grid-column:2; margin:0; font-size:27px; }
.home-stats .stat>span:not(.stat-symbol) { grid-column:1/-1; font-size:12px; color:#24344a; margin-top:4px; }
.home-stats .stat>small { grid-column:1/-1; font-size:11px; }
.home-workers { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.worker-mini { text-decoration:none; color:var(--ink); display:grid; grid-template-columns:94px 1fr; gap:5px 14px; align-content:center; background:#fff9f2; border:1px solid var(--line); border-radius:16px; overflow:hidden; padding-right:12px; }
.worker-mini .mini { width:94px; height:115px; grid-row:1/4; border-radius:0; }
.mini .staff-sprite { background-size:768px 512px; background-position:-116px -2px; }
.worker-mini strong { align-self:end; font-size:18px; }
.worker-mini small { font-size:12px; }
.worker-mini .badge { justify-self:start; align-self:start; }
.section-link { color:#2468f8; font-size:12px; text-decoration:none; font-weight:600; padding:8px 0; }
main[data-view="workers"] .workers { grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
main[data-view="workers"] .worker { display:flex; align-items:stretch; gap:14px; padding:10px; min-width:0; background:#fffbf5; border:1px solid var(--line); border-radius:20px; box-shadow:var(--shadow); }
.worker-info { min-width:0; padding:9px 4px 6px 0; }
.worker-info strong { font-size:22px; }
.worker-info .worker-role { margin:5px 0 8px; font-size:13px; line-height:1.45; color:#354356; }
.worker-info small { font-size:11px; line-height:1.5; margin-top:7px; overflow-wrap:anywhere; }
.worker-info .worker-alias { font-size:10px; color:#847567; }
.worker-chat-link { display:inline-flex; align-items:center; min-height:44px; font-size:12px; font-weight:700; color:#e9447e; text-decoration:none; margin-top:4px; }
.cs-worker-grid { gap:14px; }
.cs-worker-card { grid-template-columns:96px minmax(0,1fr) auto; padding:14px; gap:7px 14px; background:linear-gradient(110deg,#ffe3ed,#fff1f7); border-color:#f3d7e1; }
.cs-worker-card.lala { background:linear-gradient(110deg,#e2efff,#fff0e0); border-color:#dedfee; }
.cs-worker-card .cs-portrait { grid-column:1; grid-row:1/5; width:96px; height:152px; border-radius:14px; }
.cs-portrait .staff-sprite { background-size:768px 512px; background-position:-114px 0; }
.cs-worker-card>small,.cs-worker-card>button { grid-column:2/-1; font-size:12px; }
.cs-worker-card h2 { font-size:25px; }
.cs-worker-card p { font-size:12px; }
.cs-worker-card>.badge { max-width:110px; font-size:10px; }
.cs-connections { background:#fffaf3; font-size:12px; }
.cs-filters { padding:14px; background:#fffdf9; border:1px solid var(--line); border-radius:16px; }
.cs-filters label { font-size:12px; }
.cs-safety-strip { padding:10px 12px; border:1px solid var(--line); border-radius:12px; background:#fffaf4; }
.cs-workbench { grid-template-columns:minmax(240px,.65fr) minmax(0,1.35fr); gap:16px; }
.cs-inbox-card { background:#fffdfa; border-color:#eddfd1; padding:15px; min-height:44px; }
.cs-inbox-card.selected { border-color:#6c9bff; background:#eff5ff; box-shadow:inset 3px 0 #2468f8; }
.cs-inbox-card strong { font-size:13px; }
.cs-inbox-card p { font-size:13px; }
.cs-inbox-card>div { flex-wrap:wrap; }
.cs-identity { background:#fff8ee; border:1px solid #f1e0cf; padding:12px; border-radius:14px; }
.cs-identity small { font-size:11px; }
.cs-history h3 { font-size:15px; }
.cs-message { background:#e4f0ff; max-width:92%; border-radius:16px 16px 16px 5px; padding:14px; border:1px solid #d7e6f8; }
.cs-message p { font-size:14px; line-height:1.65; }
.cs-message strong { font-size:11px; color:#3b6a9b; }
.cs-message small { font-size:11px; }
.cs-draft { background:#fff0f5; border-color:#f1d6e0; border-radius:18px 18px 5px 18px; padding:16px; }
.cs-draft-text { font-size:14px; line-height:1.7; }
.cs-facts { border-color:#edd2df; }
.cs-fact-row small { font-size:11px; }
.cs-facts summary,.cs-revision-history summary,.cs-owner-answer-history summary { min-height:44px; font-size:13px; padding:10px 0; }
.cs-owner-teaching-thread { background:#fff8e9; border-color:#ecd4af; border-left:4px solid #f2b45d; padding:18px; border-radius:16px; }
.cs-owner-teaching-thread h3 { font-size:15px; }
.cs-owner-question { font-size:14px; line-height:1.65; }
.cs-owner-answer-history p { font-size:13px; }
.owner-teaching-hub { min-width:0; scroll-margin-top:90px; }
.teaching-banner { display:flex; align-items:center; gap:14px; padding:18px; margin-bottom:12px; border:1px solid #efcfbc; border-radius:18px; background:linear-gradient(110deg,#fff0de,#ffe6eb); }
.teaching-banner h2 { margin:0 0 5px; font-size:21px; }
.teaching-banner p { font-size:12px; margin:0; }
.cs-rule-template { background:#fff7ec; border:1px solid #f2e0ca; font-size:13px; }
.owner-teaching-hub .record { margin-bottom:10px; }
.owner-teaching-hub .card { padding:18px; }
@media(max-width:1100px) {
  main[data-view="workers"] .workers { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .cs-workbench { grid-template-columns:1fr; }
  .hero-art { right:8px; width:285px; }
  .hero-welcome { width:55%; }
}
@media(max-width:760px) {
  .topbar { min-height:70px; padding:9px 12px; gap:6px; }
  .topbar strong { font-size:14px; }
  .topbar .eyebrow { font-size:8px; letter-spacing:.07em; }
  .top-actions .mode-chip { font-size:9px; }
  .topbar .top-actions .icon-button { width:44px; height:44px; }
  .top-actions .soft { font-size:11px; padding:10px 9px; }
  .sidebar { width:268px; }
  .workspace { padding-bottom:88px; }
  main { padding:16px 12px 30px; }
  .page-heading h1 { font-size:24px; }
  .page-heading p { font-size:12px; line-height:1.6; }
  .page-heading .actions { margin-top:10px; }
  .card { padding:14px; border-radius:18px; }
  .card-header h2 { font-size:17px; }
  .card-header { gap:8px; }
  .bottom-nav { left:6px; right:6px; bottom:6px; padding:6px 6px calc(6px + env(safe-area-inset-bottom)); min-height:68px; border:1px solid #edddce; border-radius:19px; background:#fffdf9f5; box-shadow:0 -4px 24px #98724e0e; }
  .bottom-nav .nav-link { font-size:10px; min-height:52px; color:#7f8394; gap:3px; }
  .bottom-nav .nav-link.active { color:#2468f8; background:#f0f3ff; border-radius:14px; }
  .bottom-nav .nav-icon { width:22px; height:24px; flex:auto; }
  .bottom-nav .nav-icon svg { width:22px; height:22px; }
  .bottom-nav button.nav-link { background:transparent; }
  .toast { bottom:91px; }
  .home-hero { min-height:300px; border-radius:20px; margin-bottom:12px; background-position:center top; }
  .home-hero::before { background:linear-gradient(180deg,#fff7e936,#ffefdc8c 65%,#ffefdfef); }
  .hero-brand { padding:15px 14px; gap:8px; background:#fffaf0ad; }
  .hero-brand-icon { width:34px; height:34px; }
  .hero-brand-icon svg { width:24px; height:24px; }
  .hero-brand b { font-size:22px; }
  .hero-brand small { font-size:11px; }
  .hero-welcome { position:absolute; right:12px; top:85px; padding:13px; width:169px; border:1px solid #f1d9bf; border-radius:18px 18px 18px 5px; background:#fffdf6ee; box-shadow:0 5px 16px #62472a12; }
  .hero-welcome .eyebrow { font-size:8px; }
  .hero-welcome h1 { font-size:17px; margin:5px 0 7px; }
  .hero-welcome p { font-size:12px; line-height:1.55; margin-bottom:8px; }
  .hero-source { font-size:8px; line-height:1.4; padding:5px 6px; }
  .hero-art { right:auto; left:3px; bottom:5px; width:184px; height:222px; background:linear-gradient(180deg,#fff7ea05,#fff3e5f0 80%); border-radius:22px; }
  .bunbun-front { left:8px; bottom:0; transform:scale(.61); }
  .aces-front { left:85px; bottom:1px; transform:scale(.75); }
  .home-stats { grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px; margin-bottom:12px; }
  .home-stats .stat { padding:9px 5px; grid-template-columns:24px 1fr; gap:2px 3px; border-radius:13px; }
  .home-stats .stat strong { font-size:22px; }
  .home-stats .stat-symbol { width:24px; height:28px; border-radius:8px; }
  .stat-symbol svg { width:17px; height:17px; }
  .home-stats .stat>span:not(.stat-symbol) { font-size:10px; line-height:1.4; }
  .home-stats .stat>small { font-size:9px; line-height:1.4; }
  .home-workers { gap:7px; }
  .worker-mini { display:flex; flex-direction:column; padding:0 0 8px; align-items:center; gap:3px; border-radius:12px; text-align:center; }
  .worker-mini .mini { width:100%; height:100px; }
  .mini .staff-sprite { background-size:768px 512px; background-position:calc(50% + 262px) -2px; }
  .worker-mini strong { font-size:16px; align-self:auto; }
  .worker-mini small { font-size:10px; line-height:1.4; padding:0 4px; }
  .worker-mini .badge { font-size:9px; align-self:center; }
  main[data-view="workers"] .workers { grid-template-columns:1fr; gap:12px; }
  main[data-view="workers"] .worker { min-height:190px; }
  .worker-info strong { font-size:23px; }
  .worker-info .worker-role { font-size:13px; }
  .worker-info small { font-size:11px; }
  .cs-worker-grid { gap:8px; }
  .cs-worker-card { padding:10px; grid-template-columns:56px minmax(0,1fr); gap:6px 8px; }
  .cs-worker-card .cs-portrait { width:56px; height:83px; grid-row:1/3; }
  .cs-portrait .staff-sprite { background-size:537.6px 358.4px; background-position:-83px 0; }
  .cs-worker-card h2 { font-size:20px; }
  .cs-worker-card p { font-size:10px; }
  .cs-worker-card .eyebrow { font-size:8px; }
  .cs-worker-card>.badge { grid-column:2; justify-self:start; font-size:9px; }
  .cs-worker-card>small,.cs-worker-card>button { grid-column:1/-1; font-size:11px; }
  .cs-worker-card>button { padding:9px 8px; min-height:44px; }
  .cs-stats { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .cs-stats .stat { padding:12px; }
  .cs-stats .stat>span { font-size:11px; }
  .cs-filters { padding:12px; }
  .cs-filters select { min-height:44px; }
  .cs-identity small { font-size:11px; line-height:1.55; }
  .cs-workbench { gap:10px; }
  .cs-message { max-width:96%; }
  .cs-draft,.cs-owner-teaching-thread { padding:14px; }
  .cs-owner-teaching-thread h3 { font-size:14px; }
  .cs-draft .record-top h3 { font-size:14px; }
  .cs-draft .actions { gap:8px; }
  .cs-draft .actions button { min-height:44px; font-size:12px; }
  .teaching-banner { padding:14px; gap:10px; }
  .teaching-banner h2 { font-size:20px; }
  .owner-teaching-hub .card { padding:14px; }
  .owner-teaching-hub .card-header .actions { width:100%; }
}
@media(prefers-reduced-motion:reduce) { * { scroll-behavior:auto !important; } }


/* Owner V1A: Beranda and Tim AI only. Original official sheet unchanged. */
main[data-view="home"] .home-hero { min-height:320px; }
main[data-view="home"] .hero-welcome { z-index:2; }
main[data-view="home"] .hero-art { width:370px; height:260px; right:16px; bottom:0; background:linear-gradient(180deg,#fff4e205,#fff4e4e6 72%); border-radius:0; }
main[data-view="home"] .hero-art::before { content:""; position:absolute; left:-15px; right:-15px; bottom:6px; height:12px; background:linear-gradient(#e7bb8b,#cc986b); border-radius:5px; box-shadow:0 7px 12px #94633725; }
main[data-view="home"] .bunbun-reading { width:159px; height:162px; background-position:-834px -107px; left:20px; bottom:15px; transform:scale(1.43); }
main[data-view="home"] .aces-front { width:117px; height:191px; background-position:-41px -607px; left:230px; bottom:15px; transform:scale(.96); }
main[data-view="home"] .worker-mini .mini { height:108px; }
main[data-view="home"] .worker-mini .badge { text-align:center; line-height:1.35; }
main[data-view="workers"] .worker { min-height:180px; gap:12px; padding:10px; align-items:center; }
main[data-view="workers"] .worker-cici { background:linear-gradient(110deg,#ffe1eb,#fff6f1); }
main[data-view="workers"] .worker-lala { background:linear-gradient(110deg,#deedff,#fff5e9); }
main[data-view="workers"] .worker-maya { background:linear-gradient(110deg,#ffe5ca,#fff7ee); }
main[data-view="workers"] .worker .portrait-frame { width:120px; height:160px; background:transparent; }
main[data-view="workers"] .worker .worker-initial { background:#f2e8f4; }
main[data-view="workers"] .worker .staff-sprite { background-size:768px 512px; background-position:-108px -1px; }
main[data-view="workers"] .worker-info { padding:4px 4px 4px 0; }
main[data-view="workers"] .worker-info strong { font-size:22px; }
main[data-view="workers"] .worker-role { margin:5px 0 9px; }
main[data-view="workers"] .worker-info .badge { font-size:11px; line-height:1.4; }
main[data-view="workers"] .worker-chat-link { display:inline-flex; justify-content:center; align-items:center; gap:7px; min-height:44px; padding:9px 13px; background:#2468f8; color:white; border-radius:12px; font-size:12px; margin-top:12px; box-shadow:0 3px 8px #2468f829; }
main[data-view="workers"] .worker-chat-link svg { width:17px; height:17px; }
.worker-admin-details summary { min-height:44px; padding:12px 0; cursor:pointer; font-size:13px; font-weight:600; }
.worker-admin-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; padding-top:10px; }
.worker-admin-list article { border:1px solid var(--line); background:#fffaf4; border-radius:12px; padding:13px; min-width:0; }
.worker-admin-list strong { display:block; margin-bottom:7px; }
.worker-admin-list p { margin:8px 0; font-size:12px; }
.worker-admin-list code { font-size:11px; color:#696879; }
#workerAdministration { scroll-margin-top:90px; }
@media(max-width:760px) {
  main[data-view="home"] .home-hero { min-height:330px; }
  main[data-view="home"] .hero-brand { padding:13px 14px; }
  main[data-view="home"] .hero-welcome { position:relative; inset:auto; width:calc(100% - 24px); margin:2px 12px 0; padding:10px 12px; background:#fffaf2ed; border:1px solid #f0dcc3; border-radius:15px; box-shadow:none; }
  main[data-view="home"] .hero-welcome h1 { font-size:17px; line-height:1.25; margin:0 0 5px; }
  main[data-view="home"] .hero-welcome p { font-size:12px; line-height:1.4; margin:0; }
  main[data-view="home"] .hero-art { left:50%; right:auto; bottom:0; width:270px; height:174px; transform:translateX(-50%); }
  main[data-view="home"] .hero-art::before { left:-35px; right:-35px; bottom:3px; height:11px; }
  main[data-view="home"] .bunbun-reading { left:15px; bottom:12px; transform:scale(1.03); }
  main[data-view="home"] .aces-front { left:169px; bottom:12px; transform:scale(.78); }
  main[data-view="home"] .worker-mini .mini { height:99px; }
  main[data-view="home"] .mini .staff-sprite { background-position:calc(50% + 221px) -2px; }
  main[data-view="home"] .worker-mini .badge { font-size:9px; padding:4px 6px; min-height:20px; max-width:94%; }
  main[data-view="workers"] .page-heading p { max-width:320px; }
  main[data-view="workers"] .page-heading .actions { margin-top:8px; }
  main[data-view="workers"] .worker { min-height:176px; scroll-margin-top:85px; scroll-margin-bottom:100px; }
  main[data-view="workers"] .workers { gap:10px; }
  main[data-view="workers"] .worker .portrait-frame { width:120px; height:154px; }
  main[data-view="workers"] .worker-info .badge { font-size:11px; }
  main[data-view="workers"] .worker-role { font-size:12px; line-height:1.4; }
  main[data-view="workers"] .worker-chat-link { min-height:44px; font-size:12px; padding:9px 12px; }
  main[data-view="workers"] { padding-bottom:42px; }
  .office-root[data-view="workers"] .workspace { padding-bottom:calc(96px + env(safe-area-inset-bottom)); }
  .worker-admin-list { grid-template-columns:1fr; }
}

/* Blend the unchanged paper-backed official art into one shared office scene. */
main[data-view="home"] .hero-art { background:transparent; mix-blend-mode:multiply; }
@media(max-width:760px) {
  main[data-view="home"] .home-hero { min-height:320px; }
  main[data-view="home"] .home-hero::before { background:linear-gradient(180deg,#fff7e920,#fff0e092 58%,#fff0e5dc); }
  main[data-view="home"] .worker-mini .mini { height:94px; }
}
/* CSS silhouettes preserve the original artwork pixels and remove sheet paper. */
main[data-view="home"] .hero-art { mix-blend-mode:normal; }
main[data-view="home"] .official-sprite { mix-blend-mode:normal; mask-repeat:no-repeat; mask-size:100% 100%; }
main[data-view="home"] .bunbun-reading { mask-image:url('/v2/assets/mask-bunbun-reading.svg'); }
main[data-view="home"] .aces-front { mask-image:url('/v2/assets/mask-aces-sitting.svg'); }

/* Owner correction: direct SOT crops, full hair/head, no enlargement. */
.portrait-frame .sot-portrait { display:block; width:auto; height:auto; max-width:100%; max-height:100%; object-fit:contain; object-position:center; flex:none; }
.portrait-frame:has(.sot-portrait) { display:flex; align-items:center; justify-content:center; }
.portrait-frame.portrait-unavailable { display:flex; align-items:center; justify-content:center; background:#f7eee5; border:1px dashed #dfc9b7; color:#766252; text-align:center; }
.portrait-unavailable>span { padding:8px; font-size:11px; line-height:1.5; font-weight:400; }