*,:before,:after,::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#3b82f680;--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }*,:before,:after{box-sizing:border-box;border:0 solid #e5e7eb}:before,:after{--tw-content:""}html,:host{-webkit-text-size-adjust:100%;tab-size:4;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;line-height:1.5}body{line-height:inherit;margin:0}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-feature-settings:normal;font-variation-settings:normal;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-feature-settings:inherit;font-variation-settings:inherit;font-family:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:#0000;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{margin:0;padding:0;list-style:none}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder{opacity:1;color:#9ca3af}textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}.visible{visibility:visible}.collapse{visibility:collapse}.static{position:static}.fixed{position:fixed}.relative{position:relative}.block{display:block}.inline{display:inline}.flex{display:flex}.grid{display:grid}.contents{display:contents}.hidden{display:none}.resize{resize:both}.border{border-width:1px}.shadow{--tw-shadow:0 1px 3px 0 #0000001a, 0 1px 2px -1px #0000001a;--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000), var(--tw-ring-shadow,0 0 #0000), var(--tw-shadow)}.ring{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow,0 0 #0000)}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}:root{--fs-display:32px;--fs-title:21px;--fs-heading:17px;--fs-subhead:15px;--fs-body:14px;--fs-caption:12px;--fs-micro:11px;--icon-sm:16px;--icon-md:18px;--icon-lg:20px;--icon-xl:26px;--icon-2xl:64px;--fw-regular:400;--fw-medium:500;--fw-semibold:600;--fw-bold:700;--fw-black:800;--lh-tight:1.2;--lh-normal:1.45;--lh-loose:1.6;--track-caps:.06em;--track-normal:0;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-pill:999px;--radius-circle:50%;--space-half:2px;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--space-14:56px;--dur-fast:.12s;--dur-slow:.22s;--ease:cubic-bezier(.2, 0, .2, 1);--op-disabled:.45;--op-muted:.65;--op-subtle:.85}:root,html[data-theme=dark]{--bg:#0b141a;--panel:#111b21;--panel-2:#1a252c;--panel-3:#24313a;--bubble-in:#202c33;--bubble-out:#3d2b20;--wash-1:#14242c;--wash-2:#122029;--wall-dot:#e9edef0b;--text:#e9edef;--text-dim:#93a0ad;--text-faint:#6b7883;--line:#6d7a86;--line-faint:#26333b;--color-brand:#e8a57c;--color-brand-hover:#f2bc97;--color-brand-text:#e8a57c;--color-brand-soft:#3a2418;--color-on-brand:#241207;--color-success:#12b76a;--color-success-soft:#0d2e20;--color-info:#79aeef;--color-info-soft:#152838;--color-warning:#e0bf3a;--color-warning-soft:#3a2c0d;--color-neutral:#93a0ad;--color-error:#f2777f;--color-error-soft:#3a191c;--accent:var(--color-brand);--accent-hover:var(--color-brand-hover);--accent-text:var(--color-brand-text);--accent-soft:var(--color-brand-soft);--on-accent:var(--color-on-brand);--status-online:var(--color-success);--status-online-soft:var(--color-success-soft);--status-working:var(--color-info);--status-working-soft:var(--color-info-soft);--status-awaiting:var(--color-warning);--status-awaiting-mark:var(--color-warning);--status-awaiting-soft:var(--color-warning-soft);--status-away:var(--color-neutral);--danger:var(--color-error);--danger-soft:var(--color-error-soft);--tick:#4fb0f0;--avatar-keyline:#e9edef1a;--surface-portrait:#2a241d;--on-avatar:#1b1624;--shadow-1:#00000052;--shadow-2:#00000073;--shadow-3:#0009;--scrim:#03070ab3;--sender-0:#c88961;--sender-1:#41ab5b;--sender-2:#c58d2e;--sender-3:#c48a65;--sender-4:#739aca;--sender-5:#cf837f;--sender-6:#ab88d2;--sender-7:#c7886c;--sender-8:#53a1be;--sender-9:#b59345}html[data-theme=light]{--bg:#ece6db;--panel:#faf8f4;--panel-2:#f1ece2;--panel-3:#e9e1d4;--bubble-in:#fff;--bubble-out:#f6e7da;--wash-1:#f0e6d3;--wash-2:#ebe0c8;--wall-dot:#5a40200d;--text:#241d16;--text-dim:#5f5346;--text-faint:#7a6d5c;--line:#8a7d6c;--line-faint:#ece3d5;--color-brand:#b0552e;--color-brand-hover:#8f4522;--color-brand-text:#97481f;--color-brand-soft:#f7eae3;--color-on-brand:#fff;--color-success:#0b7a45;--color-success-soft:#e4f6ed;--color-info:#2169c8;--color-info-soft:#e9f1fb;--color-warning:#7a6200;--color-warning-strong:#a38300;--color-warning-soft:#f7eed4;--color-neutral:#576271;--color-error:#c2202b;--color-error-soft:#fae5e6;--accent:var(--color-brand);--accent-hover:var(--color-brand-hover);--accent-text:var(--color-brand-text);--accent-soft:var(--color-brand-soft);--on-accent:var(--color-on-brand);--status-online:var(--color-success);--status-online-soft:var(--color-success-soft);--status-working:var(--color-info);--status-working-soft:var(--color-info-soft);--status-awaiting:var(--color-warning);--status-awaiting-mark:var(--color-warning-strong);--status-awaiting-soft:var(--color-warning-soft);--status-away:var(--color-neutral);--danger:var(--color-error);--danger-soft:var(--color-error-soft);--tick:#0e6da8;--avatar-keyline:#3c281414;--surface-portrait:#f3ece1;--on-avatar:#1b1624;--shadow-1:#281c1014;--shadow-2:#281c1030;--shadow-3:#281c1047;--scrim:#1e140c8c;--sender-0:#a8643a;--sender-1:#39844b;--sender-2:#996d24;--sender-3:#a06844;--sender-4:#4b77ae;--sender-5:#b65a55;--sender-6:#8c62bc;--sender-7:#a66547;--sender-8:#3f7d94;--sender-9:#8a723b}html[data-palette=material3][data-theme=dark]{--bg:#131316;--panel:#1a191d;--panel-2:#242327;--panel-3:#2f2f33;--bubble-in:#2a2a2e;--bubble-out:#000da0;--wash-1:#222225;--wash-2:#1e1e21;--wall-dot:#eeecf00b;--text:#efebf0;--text-dim:#a09ea2;--text-faint:#77767a;--line:#79787c;--line-faint:#313134;--color-brand:#bec2ff;--color-brand-hover:#d9daff;--color-brand-text:#e0e0ff;--color-brand-soft:#222fc2;--color-on-brand:#000da4;--color-success:#85d98e;--color-success-soft:#003913;--color-info:#4cd9e0;--color-info-soft:#003739;--color-warning:#ecc148;--color-warning-soft:#3e2e00;--color-neutral:#c5c4dd;--color-error:#ffb4ab;--color-error-soft:#93000a;--accent:var(--color-brand);--accent-hover:var(--color-brand-hover);--accent-text:var(--color-brand-text);--accent-soft:var(--color-brand-soft);--on-accent:var(--color-on-brand);--status-online:var(--color-success);--status-online-soft:var(--color-success-soft);--status-working:var(--color-info);--status-working-soft:var(--color-info-soft);--status-awaiting:var(--color-warning);--status-awaiting-mark:var(--color-warning);--status-awaiting-soft:var(--color-warning-soft);--status-away:var(--color-neutral);--danger:var(--color-error);--danger-soft:var(--color-error-soft);--tick:#13bac0;--avatar-keyline:#eeecf01a;--surface-portrait:#252528;--on-avatar:#1b1624;--shadow-1:#00000052;--shadow-2:#00000073;--shadow-3:#0009;--scrim:#060609b3;--sender-0:#f98a9c;--sender-1:#f79159;--sender-2:#d9a22f;--sender-3:#a5b347;--sender-4:#66bd7e;--sender-5:#25beb5;--sender-6:#3cb8e1;--sender-7:#7cacfa;--sender-8:#b49df8;--sender-9:#e090d7}html[data-palette=material3][data-theme=light]{--bg:#e9e5ea;--panel:#fbf7fc;--panel-2:#efebf0;--panel-3:#e4e1e6;--bubble-in:#fff;--bubble-out:#e8e7ff;--wash-1:#e9e6eb;--wash-2:#e3e0e4;--wall-dot:#4545480d;--text:#1e1e21;--text-dim:#555458;--text-faint:#706e72;--line:#807e82;--line-faint:#e6e3e8;--color-brand:#3f4cda;--color-brand-hover:#2835c6;--color-brand-text:#000569;--color-brand-soft:#e0e0ff;--color-on-brand:#fff;--color-success:#00531e;--color-success-soft:#c6ffc6;--color-info:#00696d;--color-info-soft:#bdfcff;--color-warning:#594400;--color-warning-strong:#937300;--color-warning-soft:#ffefcf;--color-neutral:#5c5d72;--color-error:#ba1a1a;--color-error-soft:#ffdad6;--accent:var(--color-brand);--accent-hover:var(--color-brand-hover);--accent-text:var(--color-brand-text);--accent-soft:var(--color-brand-soft);--on-accent:var(--color-on-brand);--status-online:var(--color-success);--status-online-soft:var(--color-success-soft);--status-working:var(--color-info);--status-working-soft:var(--color-info-soft);--status-awaiting:var(--color-warning);--status-awaiting-mark:var(--color-warning-strong);--status-awaiting-soft:var(--color-warning-soft);--status-away:var(--color-neutral);--danger:var(--color-error);--danger-soft:var(--color-error-soft);--tick:#007478;--avatar-keyline:#2c2c2f14;--surface-portrait:#efecf0;--on-avatar:#1b1624;--shadow-1:#281c1014;--shadow-2:#281c1030;--shadow-3:#281c1047;--scrim:#1516198c;--sender-0:#9b4051;--sender-1:#984715;--sender-2:#7c5800;--sender-3:#596400;--sender-4:#056d37;--sender-5:#006a64;--sender-6:#006782;--sender-7:#275ea7;--sender-8:#6650a5;--sender-9:#8a4485}:root{--elev-1:0 1px 2px var(--shadow-1);--elev-2:0 4px 12px var(--shadow-2);--elev-3:0 8px 40px var(--shadow-3)}*{box-sizing:border-box}[hidden]{display:none!important}html,body{background:var(--bg);height:100%;color:var(--text);transition:background var(--dur-slow) var(--ease), color var(--dur-slow) var(--ease);font-family:-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;overflow:hidden}body{flex-direction:column;height:100dvh;margin:0;display:flex}button{font-family:inherit}:where(button,a,input,[role=button],[tabindex="0"]):focus-visible{outline:2px solid var(--accent);outline-offset:2px}.u-truncate{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.u-clamp-2{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.u-clamp-3{-webkit-line-clamp:3;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.app{flex:1;min-height:0;display:flex}.rail{background:var(--panel);border-right:1px solid var(--line);align-items:center;gap:var(--space-2);flex-direction:column;width:72px;padding:14px 0;display:flex}.rail-btn{width:56px;color:var(--text-dim);border-radius:var(--radius-md);cursor:pointer;font-size:var(--fs-micro);background:0 0;border:none;flex-direction:column;align-items:center;gap:3px;padding:10px 0;display:flex}.rail-btn .rail-ico{font-size:var(--icon-lg)}.rail-btn:hover{background:var(--panel-2);color:var(--text)}.rail-btn.active{background:var(--panel-3);color:var(--accent-text)}.rail-spacer{flex:1}.chat-intro{text-align:center;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-lg);max-width:380px;box-shadow:var(--elev-1);flex-direction:column;align-self:center;align-items:center;gap:2px;margin:4px 0 10px;padding:14px 20px 12px;display:flex}.chat-intro .avatar{margin-bottom:2px}.ci-name{font-size:var(--fs-subhead);font-weight:var(--fw-bold);color:var(--text)}.ci-role{font-size:var(--fs-caption);color:var(--accent-text);font-weight:var(--fw-semibold)}.ci-can{font-size:var(--fs-caption);color:var(--text-dim);line-height:var(--lh-normal);margin-top:2px}.ci-tags{justify-content:center;margin-top:4px}.ci-tags .chip{font-size:var(--fs-caption);padding:4px 10px}.ci-members{flex-wrap:wrap;justify-content:center;gap:6px;margin-top:8px;display:flex}.ci-member{font-size:var(--fs-caption);background:var(--panel-2);border:1px solid var(--line);border-radius:var(--radius-md);cursor:pointer;color:var(--text);max-width:100%;padding:3px 9px}.ci-member:hover{border-color:var(--accent)}.voice-note{align-items:center;gap:8px;min-width:190px;padding:4px 2px 6px;display:flex}.vn-play{border-radius:var(--radius-circle);background:var(--accent);width:28px;height:28px;color:var(--on-accent);cursor:pointer;border:none;flex-shrink:0;justify-content:center;align-items:center;display:flex}.vn-play:hover{background:var(--accent-hover)}.vn-wave{flex:1;align-items:center;gap:2px;min-width:0;height:24px;display:flex}.vn-bar{background:var(--text-faint);min-width:2px;max-width:3px;transition:background var(--dur-fast) var(--ease);border-radius:2px;flex:1}.vn-bar.played{background:var(--accent-text)}.vn-dur{font-size:var(--fs-micro);color:var(--text-dim);font-variant-numeric:tabular-nums;flex-shrink:0}.msg-img-wrap{flex-direction:column;gap:6px;max-width:100%;margin-bottom:4px;display:flex}.img-slot{border-radius:var(--radius-sm);border:1px solid var(--line);background:var(--panel-2);justify-content:center;align-items:center;width:260px;max-width:100%;height:180px;display:flex}.img-slot-ico{opacity:var(--op-muted)}.img-slot-label{font-size:var(--fs-micro);color:var(--text-dim)}.persona-logo{background:var(--surface-portrait);border-radius:var(--radius-circle);flex-shrink:0;width:36px;height:36px;padding:0;overflow:hidden}.persona-logo svg,.persona-logo img{-o-object-fit:cover;object-fit:cover;width:100%;height:100%;display:block}.window{flex:1;min-width:0;min-height:0;display:none}.window.active{display:flex}.sidebar{background:var(--panel);border-right:1px solid var(--line);flex-direction:column;width:340px;min-width:340px;display:flex}.sidebar-head{justify-content:space-between;align-items:center;padding:16px 16px 10px;display:flex}.icon-btn{background:var(--panel-3);color:var(--text);border-radius:var(--radius-sm);cursor:pointer;width:34px;height:34px;font-size:var(--icon-sm);border:none;flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.icon-btn:hover{background:var(--accent);color:var(--on-accent)}.search{padding:4px 12px 10px}.search input{background:var(--panel-2);border:1px solid var(--line);border-radius:var(--radius-md);width:100%;color:var(--text);font-size:var(--fs-body);transition:border-color var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease);padding:8px 16px}.search input:focus-visible{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-soft);outline:none}.chat-list{flex:1;overflow-y:auto}.section-label{font-size:var(--fs-micro);text-transform:uppercase;letter-spacing:var(--track-caps);color:var(--text-dim);padding:12px 16px 6px}.chat-item{border-bottom:1px solid var(--line-faint);align-items:center;padding-right:6px;display:flex}.chat-item:hover{background:var(--panel-2)}.chat-item.active{background:var(--panel-3)}.chat-item-main{cursor:pointer;flex:1;align-items:center;gap:12px;min-width:0;padding:11px 14px;display:flex}.chat-item .meta{flex:1;min-width:0}.chat-item .name{font-size:var(--fs-subhead);font-weight:var(--fw-semibold)}.chat-item .preview{font-size:var(--fs-body);color:var(--text-dim);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.avatar{border-radius:var(--radius-circle);font-weight:var(--fw-bold);color:var(--on-avatar);box-shadow:inset 0 0 0 1px var(--avatar-keyline);flex-shrink:0;justify-content:center;align-items:center;display:flex;position:relative}.avatar.group{border-radius:var(--radius-lg)}.presence-dot{border-radius:var(--radius-circle);border:2px solid var(--panel);position:absolute;bottom:-1px;right:-1px}.presence-dot.online{background:var(--status-online)}.presence-dot.working{background:var(--status-working)}.presence-dot.away{background:var(--status-away)}.presence-dot.awaiting{background:var(--status-awaiting-mark);box-shadow:0 0 0 3px var(--status-awaiting-soft);transform:scale(1.15)}.presence-text{font-size:var(--fs-caption)}.conversation{background:radial-gradient(circle at 20% 30%, var(--wash-1) 0, transparent 40%), radial-gradient(circle at 80% 70%, var(--wash-2) 0, transparent 40%), var(--bg);flex-direction:column;flex:1;min-width:0;display:flex}.empty-state{text-align:center;color:var(--text-dim);flex-direction:column;flex:1;justify-content:center;align-items:center;gap:8px;padding:0 40px;display:flex}.empty-illustration{font-size:var(--icon-2xl);opacity:var(--op-muted)}.empty-state h2{color:var(--text);font-weight:var(--fw-bold);margin:0}.empty-state b{color:var(--accent-text)}.chat-view{flex-direction:column;flex:1;min-height:0;display:flex}.chat-head{background:var(--panel);border-bottom:1px solid var(--line);align-items:center;gap:12px;padding:10px 148px 10px 16px;display:flex}.chat-head-id{cursor:pointer;flex:1;align-items:center;gap:12px;min-width:0;display:flex}.chat-head-id .avatar{width:40px;height:40px;font-size:var(--fs-subhead)}.chat-head-text{min-width:0}.chat-head-name{font-size:var(--fs-subhead);font-weight:var(--fw-bold);text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.chat-head-sub{font-size:var(--fs-caption);color:var(--text-dim);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.presence-text.online{color:var(--status-online)}.presence-text.working{color:var(--status-working)}.presence-text.awaiting{color:var(--status-awaiting)}.presence-text.away,.presence-text.offline{color:var(--text-dim)}.messages{flex-direction:column;flex:1;gap:6px;padding:20px 8%;display:flex;overflow-y:auto}.jump-latest{z-index:2;background:var(--panel);border:1px solid var(--line);color:var(--text);border-radius:var(--radius-pill);box-shadow:var(--elev-2);font-size:var(--fs-caption);font-weight:var(--fw-semibold);cursor:pointer;align-self:center;align-items:center;gap:6px;margin-top:4px;padding:8px 14px;display:inline-flex;position:sticky;bottom:12px}.jump-latest:hover{border-color:var(--accent);color:var(--accent-text)}.jump-latest-ico{transform:rotate(90deg)}.msg{border-radius:var(--radius-md);max-width:66%;font-size:var(--fs-body);line-height:var(--lh-normal);word-wrap:break-word;white-space:pre-wrap;box-shadow:var(--elev-1);padding:8px 12px;position:relative}.msg.out{background:var(--bubble-out);align-self:flex-end}.msg.in{background:var(--bubble-in);align-self:flex-start}.msg .sender{font-size:var(--fs-caption);font-weight:var(--fw-bold);cursor:pointer;text-overflow:ellipsis;white-space:nowrap;max-width:100%;margin-bottom:2px;overflow:hidden}.sender-0{color:var(--sender-0)}.sender-1{color:var(--sender-1)}.sender-2{color:var(--sender-2)}.sender-3{color:var(--sender-3)}.sender-4{color:var(--sender-4)}.sender-5{color:var(--sender-5)}.sender-6{color:var(--sender-6)}.sender-7{color:var(--sender-7)}.sender-8{color:var(--sender-8)}.sender-9{color:var(--sender-9)}.day-empty{color:var(--text-dim);font-size:var(--fs-body);background:var(--panel-2);border-radius:var(--radius-pill);align-self:center;margin:auto 0;padding:6px 14px}.system-line{color:var(--text-dim);font-size:var(--fs-caption);background:var(--panel-2);border-radius:var(--radius-pill);align-self:center;margin:4px 0;padding:4px 12px}.chat-card{background:var(--panel-2);border:1px solid var(--line);border-radius:var(--radius-md);max-width:78%;padding:var(--space-4);font-size:var(--fs-body);border-left:3px solid #0000;flex-direction:column;align-self:flex-start;gap:8px;display:flex}.chat-card.rail-amber{border-left-color:var(--status-awaiting-mark)}.chat-card.rail-green{border-left-color:var(--status-online)}.chat-card.rail-red{border-left-color:var(--danger)}.chat-card.rail-accent{border-left-color:var(--accent)}.cc-title{font-weight:var(--fw-bold);line-height:var(--lh-normal)}.cc-detail{font-size:var(--fs-caption);color:var(--text-dim);line-height:var(--lh-normal);margin-top:-4px}.cc-outcome{font-size:var(--fs-caption);color:var(--accent-text);font-weight:var(--fw-semibold)}.cc-approve{justify-content:space-between;align-items:center;gap:10px;display:flex}.cc-ask{font-size:var(--fs-caption);color:var(--text-dim);line-height:var(--lh-normal)}.cc-approve-btns{flex-shrink:0;gap:6px;display:flex}.cc-btn{border-radius:var(--radius-sm);font-size:var(--fs-caption);font-weight:var(--fw-bold);cursor:pointer;border:1px solid var(--line);background:var(--panel);color:var(--text);padding:6px 16px}.cc-btn.yes{border-color:var(--accent);color:var(--accent-text)}.cc-btn.yes:hover{background:var(--accent-soft)}.cc-btn.no{border-color:var(--danger);color:var(--danger)}.cc-btn.no:hover{background:var(--danger-soft)}.cc-options{flex-direction:column;gap:6px;display:flex}.cc-option{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-sm);cursor:pointer;transition:border-color var(--dur-fast) var(--ease), opacity var(--dur-fast) var(--ease);align-items:center;gap:8px;padding:8px 10px;display:flex}.cc-option:hover{border-color:var(--accent)}.cc-option.chosen{border-color:var(--accent);background:var(--accent-soft)}.cc-option.dimmed{opacity:var(--op-disabled);cursor:default}.cc-option.dimmed:hover{border-color:var(--line)}.cc-opt-label{font-size:var(--fs-body);font-weight:var(--fw-medium);line-height:var(--lh-normal);flex:1}.cc-opt-meta{font-size:var(--fs-micro);color:var(--text-dim);line-height:var(--lh-normal);flex-shrink:0}.cc-opt-check{color:var(--accent-text);flex-shrink:0}.cc-steps{flex-direction:column;gap:7px;display:flex}.cc-step{font-size:var(--fs-caption);color:var(--text-dim);line-height:var(--lh-normal);align-items:center;gap:8px;display:flex}.cc-step.done{color:var(--text)}.cc-step-ico{width:16px;height:16px;color:var(--status-online);flex-shrink:0;justify-content:center;align-items:center;display:flex}.cc-spinner{border:1.5px solid var(--status-working-soft);border-top-color:var(--status-working);border-radius:50%;width:9px;height:9px;animation:.7s linear infinite ccSpin}@keyframes ccSpin{to{transform:rotate(360deg)}}.cc-step-label{min-width:0;line-height:var(--lh-normal)}.cc-reminder{justify-content:space-between;align-items:center;gap:10px;display:flex}.cc-when{font-size:var(--fs-caption);color:var(--accent-text);font-weight:var(--fw-semibold);line-height:var(--lh-normal);align-items:center;gap:5px;display:inline-flex}.cc-edit-btn{color:var(--text-dim);font-size:var(--fs-micro);border-radius:var(--radius-sm);cursor:not-allowed;background:0 0;border:none;align-items:center;gap:4px;padding:4px 8px;display:inline-flex}.cc-edit-btn:hover{background:var(--panel-3);color:var(--text)}@keyframes ccNudge{25%{transform:translate(-2px)}75%{transform:translate(2px)}}.cc-reminder.nudged{animation:.18s 2 ccNudge}.composer{background:var(--panel);border-top:1px solid var(--line);flex-shrink:0;padding:10px 16px 6px}.comp-row{align-items:center;gap:8px;display:flex}.comp-btn{border-radius:var(--radius-circle);width:38px;height:38px;color:var(--text-dim);font-size:var(--icon-md);cursor:not-allowed;transition:background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);background:0 0;border:none;flex-shrink:0;justify-content:center;align-items:center;display:flex}.comp-btn:hover{background:var(--panel-3);color:var(--text)}.comp-btn:active{transform:scale(.94)}.comp-field{background:var(--panel-2);border:1px solid var(--line);border-radius:var(--radius-pill);min-width:0;transition:border-color var(--dur-fast) var(--ease);flex:1;align-items:center;padding:0 36px 0 16px;display:flex;position:relative}.comp-field:focus-within{border-color:var(--accent)}.comp-input{min-width:0;color:var(--text);font:inherit;font-size:var(--fs-body);cursor:default;background:0 0;border:none;outline:none;flex:1;padding:11px 0}.comp-input::placeholder{color:var(--text-dim)}.comp-lock{font-size:var(--fs-caption);opacity:var(--op-muted);pointer-events:none;position:absolute;right:14px}.comp-send{border-radius:var(--radius-circle);background:var(--accent);width:42px;height:42px;color:var(--on-accent);font-size:var(--icon-md);cursor:not-allowed;border:none;flex-shrink:0;justify-content:center;align-items:center;display:flex}.comp-send:hover{background:var(--accent-hover)}@keyframes compNudge{25%{transform:translate(-2px)}75%{transform:translate(2px)}}.composer.nudged .comp-field{animation:.18s 2 compNudge}.sheet-backdrop{background:var(--scrim);z-index:60;position:fixed;inset:0}.settings-sheet{z-index:61;background:var(--panel);border-left:1px solid var(--line);width:420px;max-width:94vw;box-shadow:var(--elev-3);flex-direction:column;display:flex;position:fixed;top:0;bottom:0;right:0}.sheet-head{border-bottom:1px solid var(--line);font-weight:var(--fw-semibold);flex-shrink:0;align-items:center;gap:14px;padding:16px;display:flex}.sheet-body{flex:1;padding:18px;overflow-y:auto}.profile-card{text-align:center;padding-bottom:8px}.profile-card .avatar{margin:0 auto 12px}.profile-card .p-name{font-size:var(--fs-title);font-weight:var(--fw-bold)}.profile-card .p-role{color:var(--text-dim);margin-top:3px}.profile-card .p-presence{font-size:var(--fs-caption);color:var(--text-dim);margin-top:4px}.profile-card .p-can{font-size:var(--fs-body);color:var(--text-dim);line-height:var(--lh-normal);margin-top:8px}.profile-card .p-tags{justify-content:center;margin-top:12px}.set-group{margin-top:22px}.set-group>h4{font-size:var(--fs-micro);text-transform:uppercase;letter-spacing:var(--track-caps);color:var(--accent-text);margin:0 0 10px}.dial{margin-bottom:14px}.dial-labels{font-size:var(--fs-caption);color:var(--text-dim);justify-content:space-between;margin-bottom:4px;display:flex}.auth-meter{background:var(--panel-3);border-radius:var(--radius-pill);height:6px;overflow:hidden}.auth-fill{background:var(--accent);border-radius:var(--radius-pill);height:100%;transition:width var(--dur-slow) var(--ease)}.preview-line{background:var(--panel-2);border-radius:var(--radius-md);font-size:var(--fs-body);color:var(--text);line-height:var(--lh-normal);margin-top:6px;padding:12px 14px}.preview-line b{color:var(--accent-text)}.agent-tasks{flex-direction:column;gap:8px;display:flex}.agent-task-row{background:var(--panel-2);border:1px solid var(--line);border-radius:var(--radius-md);cursor:pointer;transition:border-color var(--dur-fast) var(--ease);justify-content:space-between;align-items:center;gap:10px;padding:10px 12px;display:flex}.agent-task-row:hover{border-color:var(--accent)}.agent-task-title{font-size:var(--fs-body);color:var(--text);line-height:var(--lh-normal)}.seg{flex-wrap:wrap;gap:6px;display:flex}.seg button{border:1px solid var(--line);background:var(--panel-2);min-width:90px;color:var(--text);border-radius:var(--radius-md);cursor:pointer;font-size:var(--fs-caption);flex:1;padding:9px 8px}.seg button.active{background:var(--accent);color:var(--on-accent);border-color:var(--accent);font-weight:var(--fw-semibold)}.seg-help{font-size:var(--fs-caption);color:var(--text-dim);margin-top:6px}.scope-row{border-radius:var(--radius-md);background:var(--panel-2);border:1px solid var(--line);font-size:var(--fs-body);color:var(--text);line-height:var(--lh-normal);align-items:flex-start;gap:10px;margin-bottom:8px;padding:10px 12px;display:flex}.scope-row .scope-ico{flex-shrink:0}.roster-list{flex-direction:column;gap:2px;display:flex}.roster-row{border-radius:var(--radius-md);align-items:center;display:flex}.roster-row:hover{background:var(--panel-2)}.roster-row-main{cursor:pointer;flex:1;align-items:center;gap:12px;min-width:0;padding:9px 6px;display:flex}.roster-row-text{flex-direction:column;flex:1;min-width:0;display:flex}.roster-row-text b{font-size:var(--fs-body);color:var(--text);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.roster-row-text span{font-size:var(--fs-caption);color:var(--text-dim);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.roster-row-main:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}.chips{flex-wrap:wrap;gap:8px;display:flex}.chip{border-radius:var(--radius-pill);background:var(--panel-2);border:1px solid var(--line);max-width:220px;font-size:var(--fs-body);cursor:pointer;-webkit-user-select:none;user-select:none;text-overflow:ellipsis;white-space:nowrap;padding:7px 12px;overflow:hidden}.chip.on{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}.chip.chip-with-icon{align-items:center;gap:4px;display:inline-flex}.chip .lock{font-size:var(--fs-micro);opacity:var(--op-subtle)}.chip.static{cursor:default}.know-list{flex-direction:column;gap:6px;display:flex}.text-link{color:var(--accent-text);font-size:var(--fs-body);font-weight:var(--fw-semibold);cursor:pointer;text-underline-offset:2px;background:0 0;border:none;padding:0;text-decoration:underline}.text-link:hover{color:var(--accent-hover)}.sheet-actions{gap:10px;margin-top:24px;display:flex}.btn{border-radius:var(--radius-sm);cursor:pointer;font-size:var(--fs-body);font-weight:var(--fw-semibold);border:none;flex:1;padding:11px 16px}.btn.btn-with-icon{justify-content:center;align-items:center;gap:6px;display:inline-flex}.btn.primary{background:var(--accent);color:var(--on-accent)}.btn.primary:hover{background:var(--accent-hover)}.btn.ghost{background:var(--panel-3);color:var(--text)}.sheet-body .section-label{margin-top:22px;padding-left:0;padding-right:0}.settings-cats{flex-direction:column;gap:10px;margin-top:22px;display:flex}.section-label+.settings-cats{margin-top:10px}.settings-cat{border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--panel);overflow:hidden}.settings-cat-head{cursor:pointer;text-align:left;width:100%;color:inherit;font:inherit;background:0 0;border:none;align-items:center;gap:12px;padding:14px 16px;display:flex}.settings-cat-head:hover{background:var(--panel-2)}.settings-cat.open .settings-cat-head{border-bottom:1px solid var(--line)}.cat-ico{border-radius:var(--radius-md);background:var(--panel-2);border:1px solid var(--line);width:38px;height:38px;font-size:var(--icon-md);flex-shrink:0;justify-content:center;align-items:center;display:flex}.cat-text{flex:1;min-width:0}.cat-text b{font-size:var(--fs-body);color:var(--text);text-overflow:ellipsis;white-space:nowrap;display:block;overflow:hidden}.cat-text span{font-size:var(--fs-caption);color:var(--text-dim);text-overflow:ellipsis;white-space:nowrap;margin-top:2px;display:block;overflow:hidden}.cat-badge{font-size:var(--fs-micro);font-weight:var(--fw-bold);color:var(--text-dim);background:var(--panel-2);border:1px solid var(--line);border-radius:var(--radius-pill);flex-shrink:0;padding:2px 9px}.cat-chevron{color:var(--text-dim);font-size:var(--fs-subhead);transition:transform var(--dur-slow) var(--ease);flex-shrink:0}.settings-cat.open .cat-chevron{transform:rotate(90deg)}.settings-cat-body{padding:14px 16px 16px}.settings-cat-body>.set-group:first-child{margin-top:0}.set-rows{border:1px solid var(--line);border-radius:var(--radius-md);background:var(--panel-2);overflow:hidden}.set-row{font-size:var(--fs-body);border-bottom:1px solid var(--line-faint);justify-content:space-between;align-items:center;gap:12px;padding:10px 12px;display:flex}.set-row:last-child{border-bottom:none}.set-row span{color:var(--text-dim)}.set-row b{color:var(--text);font-weight:var(--fw-semibold);text-align:right;text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.kbd{font-family:-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;font-size:var(--fs-caption);font-weight:var(--fw-semibold);color:var(--text);background:var(--panel-3);border:1px solid var(--line);border-radius:var(--radius-sm);padding:2px 7px}.set-toggle-row{border-bottom:1px solid var(--line-faint);align-items:center;gap:12px;padding:10px 0;display:flex}.set-toggle-row:last-child{border-bottom:none}.stt-text{flex:1;min-width:0}.stt-text b{font-size:var(--fs-body);color:var(--text);font-weight:var(--fw-semibold);line-height:var(--lh-normal);display:block}.stt-text span{font-size:var(--fs-caption);color:var(--text-dim);line-height:var(--lh-normal);margin-top:2px;display:block}.switch{flex-shrink:0;width:40px;height:24px;display:inline-block;position:relative}.switch input{opacity:0;cursor:pointer;width:100%;height:100%;margin:0;position:absolute}.switch .slider{background:var(--panel-3);border:1px solid var(--line);border-radius:var(--radius-pill);transition:background var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease);pointer-events:none;position:absolute;inset:0}.switch .slider:before{content:"";background:var(--panel);border-radius:var(--radius-circle);width:18px;height:18px;box-shadow:var(--elev-1);transition:transform var(--dur-fast) var(--ease);position:absolute;top:2px;left:2px}.switch input:checked+.slider{background:var(--accent);border-color:var(--accent)}.switch input:checked+.slider:before{transform:translate(16px)}.switch input:focus-visible+.slider{outline:2px solid var(--accent);outline-offset:2px}.plan-card{background:var(--panel-2);border:1px solid var(--line);border-radius:var(--radius-md);margin-bottom:16px;padding:14px 16px}.plan-card-top{justify-content:space-between;align-items:center;gap:10px;display:flex}.plan-card-top b{font-size:var(--fs-heading);color:var(--text)}.plan-card-sub{font-size:var(--fs-caption);color:var(--text-dim);line-height:var(--lh-normal);margin-top:5px}.pill{font-size:var(--fs-micro);font-weight:var(--fw-bold);letter-spacing:var(--track-caps);text-transform:uppercase;border-radius:var(--radius-pill);flex-shrink:0;padding:3px 9px}.pill.trial{color:var(--status-awaiting);background:var(--status-awaiting-soft)}.pill.paid{color:var(--accent-text);border:1px solid var(--accent);background:0 0}.invoice-row{border-bottom:1px solid var(--line-faint);font-size:var(--fs-body);align-items:center;gap:10px;padding:9px 0;display:flex}.invoice-row:last-child{border-bottom:none}.invoice-row .inv-date{color:var(--text);flex:1}.invoice-row .inv-amt{color:var(--text-dim);flex-shrink:0}.row-menu{flex-shrink:0;position:relative}.row-menu-btn{color:var(--text-dim);border-radius:var(--radius-sm);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;padding:6px 9px;display:inline-flex}.row-menu-btn:hover{background:var(--panel-3);color:var(--text)}.row-menu-pop{z-index:70;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--radius-md);min-width:200px;max-width:280px;box-shadow:var(--elev-2);flex-direction:column;gap:1px;padding:6px;display:flex;position:absolute;top:calc(100% + 4px);right:0}.row-menu-item{text-align:left;color:var(--text);font-size:var(--fs-body);border-radius:var(--radius-sm);cursor:pointer;text-overflow:ellipsis;white-space:nowrap;background:0 0;border:none;padding:9px 10px;overflow:hidden}.row-menu-item:hover{background:var(--panel-3)}.row-menu-item.danger{color:var(--danger)}.workspace-window{background:var(--bg);flex-direction:column;overflow:hidden}.ws-head{border-bottom:1px solid var(--line);background:var(--panel);flex-shrink:0;justify-content:space-between;align-items:center;padding:16px 156px 16px 26px;display:flex}.ws-head h1{font-size:var(--fs-title);font-weight:var(--fw-bold);margin:0}.ws-sub{font-size:var(--fs-body);color:var(--text-dim);font-weight:var(--fw-regular);text-overflow:ellipsis;white-space:nowrap;margin-left:8px;overflow:hidden}.dash-stats{color:var(--text-dim);font-size:var(--fs-subhead)}.ws-tabs{background:var(--panel);border-bottom:1px solid var(--line);flex-shrink:0;gap:4px;padding:10px 20px 0;display:flex;overflow-x:auto}.ws-tab{color:var(--text-dim);cursor:pointer;border-radius:var(--radius-md) var(--radius-md) 0 0;font-size:var(--fs-body);white-space:nowrap;background:0 0;border:none;align-items:center;gap:6px;padding:10px 14px;display:inline-flex}.ws-tab:hover{color:var(--text)}.ws-tab.active{color:var(--accent-text);background:var(--bg);font-weight:var(--fw-semibold)}.ws-body{flex:1;overflow:hidden}.ws-pane{height:100%;padding:var(--space-6);overflow-y:auto}.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-lg);padding:var(--space-4)}.card-head{justify-content:space-between;align-items:center;margin-bottom:14px;display:flex}.card-head h2{font-size:var(--fs-heading);font-weight:var(--fw-bold);margin:0}.dash-filters{background:var(--panel);border-bottom:1px solid var(--line);flex-wrap:wrap;flex-shrink:0;justify-content:space-between;align-items:center;gap:12px;padding:12px 26px;display:flex}.dash-areas{flex-wrap:wrap;gap:6px;display:flex}.dash-chip{background:var(--panel-2);border:1px solid var(--line);color:var(--text-dim);border-radius:var(--radius-pill);font-size:var(--fs-caption);font-weight:var(--fw-medium);cursor:pointer;white-space:nowrap;align-items:center;gap:5px;padding:6px 12px;font-family:inherit;display:inline-flex}.dash-chip:hover{border-color:var(--accent);color:var(--text)}.dash-chip.active{background:var(--panel-3);border-color:var(--accent);color:var(--accent-text);font-weight:var(--fw-semibold)}.dash-chip-n{opacity:var(--op-muted)}.dash-controls{gap:8px;display:flex}.dash-select{background:var(--panel-2);border:1px solid var(--line);color:var(--text);border-radius:var(--radius-md);font:inherit;font-size:var(--fs-caption);cursor:pointer;padding:6px 10px}.dash-list{grid-template-columns:1.6fr 1fr;align-items:start;gap:26px;max-width:1080px;display:grid}.dash-list-main,.dash-list-feed{min-width:0}.dash-section{margin-bottom:22px}.dash-section-h3{font-size:var(--fs-heading);font-weight:var(--fw-bold);color:var(--text);align-items:center;gap:6px;margin:0 0 10px;display:flex}.dash-count{font-size:var(--fs-caption);font-weight:var(--fw-regular);color:var(--text-dim)}.dash-section-rows{flex-direction:column;gap:8px;display:flex}.dash-card{cursor:pointer;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-md);transition:border-color var(--dur-fast) var(--ease), transform var(--dur-fast) var(--ease);border-left:3px solid #0000;flex-direction:column;gap:6px;padding:12px 14px;display:flex;position:relative}.dash-card:hover{border-color:var(--accent);transform:translateY(-1px)}.dash-card.status-awaiting{border-left-color:var(--status-awaiting-mark)}.dash-card.status-running{border-left-color:var(--status-working)}.dash-card.status-scheduled{border-left-color:var(--status-away)}.dash-card.status-done{border-left-color:var(--status-online)}.dash-card.status-declined,.dash-card.status-blocked{border-left-color:var(--danger)}.dc-top{align-items:flex-start;gap:8px;display:flex}.dc-kind-ico{color:var(--text-dim);flex-shrink:0;margin-top:2px}.dc-title{font-size:var(--fs-body);font-weight:var(--fw-semibold);color:var(--text);line-height:var(--lh-normal);flex:1}.dc-status{font-size:var(--fs-micro);font-weight:var(--fw-semibold);border-radius:var(--radius-pill);white-space:nowrap;flex-shrink:0;padding:3px 9px}.dc-status.awaiting{background:var(--status-awaiting-soft);color:var(--status-awaiting)}.dc-status.running{background:var(--status-working-soft);color:var(--status-working)}.dc-status.scheduled{background:var(--panel-3);color:var(--status-away)}.dc-status.done{background:var(--status-online-soft);color:var(--status-online)}.dc-status.declined,.dc-status.blocked{background:var(--danger-soft);color:var(--danger)}.dc-second{font-size:var(--fs-caption);color:var(--text-dim);line-height:var(--lh-normal)}.dc-tags{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.dc-tag{border-radius:var(--radius-pill);min-width:0;max-width:60%;font-size:var(--fs-micro);font-weight:var(--fw-medium);background:var(--panel-2);border:1px solid var(--line);color:var(--text-dim);align-items:center;gap:5px;padding:3px 9px 3px 4px;display:inline-flex}.dc-tag.dc-owner{cursor:pointer}.dc-tag.dc-owner:hover{border-color:var(--accent);color:var(--text)}.dc-tag.dc-area{text-transform:uppercase;letter-spacing:var(--track-caps);padding-left:9px}.dc-tag.dc-physical{background:var(--status-awaiting-soft);border-color:var(--status-awaiting-mark);color:var(--status-awaiting);padding-left:9px}.dc-approve{gap:6px;margin-top:2px;display:flex}.dc-approve-btn{border-radius:var(--radius-sm);font-size:var(--fs-caption);font-weight:var(--fw-bold);cursor:pointer;border:1px solid var(--line);background:var(--panel-2);color:var(--text);flex:1;padding:6px 0}.dc-approve-btn.yes{border-color:var(--accent);color:var(--accent-text)}.dc-approve-btn.yes:hover{background:var(--accent-soft)}.dc-approve-btn.no{border-color:var(--danger);color:var(--danger)}.dc-approve-btn.no:hover{background:var(--danger-soft)}.now-feed{flex-direction:column;gap:10px;display:flex}.now-item{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-md);align-items:center;gap:12px;padding:12px 14px;display:flex}.now-item .now-text{font-size:var(--fs-body);line-height:var(--lh-normal);flex:1}.now-item .now-time{font-size:var(--fs-caption);color:var(--text-dim)}.pane-empty{color:var(--text-dim);font-size:var(--fs-body);padding:20px 0}.board{scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;gap:14px;min-height:100%;display:flex;overflow-x:auto}.board-show-empty{background:var(--panel-2);border:1px dashed var(--line);color:var(--text-dim);border-radius:var(--radius-pill);font-size:var(--fs-caption);cursor:pointer;margin:14px auto 0;padding:7px 16px;display:block}.board-show-empty:hover{border-color:var(--accent);color:var(--accent-text)}.board-col{scroll-snap-align:start;border-radius:var(--radius-lg);width:230px;transition:background var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease);flex-shrink:0;padding:4px}.board-col h3{font-size:var(--fs-micro);text-transform:uppercase;letter-spacing:var(--track-caps);color:var(--text-dim);justify-content:space-between;margin:0 0 10px;display:flex}.board-col.awaiting h3{color:var(--status-awaiting)}.board-col.drag-over{background:var(--panel-2);outline:2px dashed var(--accent);outline-offset:-2px}.col-cards{flex-direction:column;gap:10px;min-height:60px;display:flex}.col-empty{border:1px dashed var(--line);border-radius:var(--radius-md);text-align:center;font-size:var(--fs-caption);color:var(--text-dim);padding:14px}.task-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-md);cursor:grab;transition:transform var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease);padding:12px;position:relative}.task-card:active{cursor:grabbing}.task-card:hover{border-color:var(--accent);transform:translateY(-1px)}.task-card.dragging{opacity:var(--op-disabled)}.board-col.awaiting .task-card{border-color:var(--status-awaiting-mark)}.task-card .tc-head{align-items:flex-start;gap:6px;display:flex}.task-card .tc-title{font-size:var(--fs-body);font-weight:var(--fw-semibold);line-height:var(--lh-normal);flex:1;margin-bottom:10px}.tc-tags{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.tc-tag{border-radius:var(--radius-pill);min-width:0;font-size:var(--fs-micro);font-weight:var(--fw-semibold);background:var(--panel-2);border:1px solid var(--line);color:var(--text-dim);align-items:center;gap:5px;padding:3px 9px;display:inline-flex}.tc-tag.tc-owner-tag{text-overflow:ellipsis;white-space:nowrap;max-width:60%;padding-left:4px;overflow:hidden}.tc-status.awaiting{background:var(--status-awaiting-soft);border-color:var(--status-awaiting-mark);color:var(--status-awaiting)}.tc-status.running{background:var(--status-working-soft);border-color:var(--status-working);color:var(--status-working)}.tc-status.scheduled{background:var(--panel-3);border-color:var(--line);color:var(--status-away)}.tc-status.declined,.tc-status.blocked{background:var(--danger-soft);border-color:var(--danger);color:var(--danger)}.tc-status.done{color:var(--text-dim)}.tc-tag.tc-physical{background:var(--status-awaiting-soft);border-color:var(--status-awaiting-mark);color:var(--status-awaiting)}.tc-approve{gap:6px;margin-top:10px;display:flex}.tc-approve-btn{border-radius:var(--radius-sm);font-size:var(--fs-caption);font-weight:var(--fw-bold);cursor:pointer;border:1px solid var(--line);background:var(--panel-2);color:var(--text);flex:1;padding:6px 0}.tc-approve-btn.yes{border-color:var(--accent);color:var(--accent-text)}.tc-approve-btn.yes:hover{background:var(--accent-soft)}.tc-approve-btn.no{border-color:var(--danger);color:var(--danger)}.tc-approve-btn.no:hover{background:var(--danger-soft)}.calendar-card{max-width:560px}.calendar{grid-template-columns:repeat(7,1fr);gap:6px;display:grid}.cal-dow{text-align:center;font-size:var(--fs-micro);color:var(--text-dim);text-transform:uppercase;padding:4px 0}.cal-day{aspect-ratio:1;border-radius:var(--radius-md);font-size:var(--fs-body);color:inherit;cursor:pointer;transition:background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);background:0 0;border:none;justify-content:center;align-items:center;padding:0;font-family:inherit;display:flex;position:relative}.cal-day.muted{color:var(--text-faint);cursor:default}.cal-day:not(.muted):hover{background:var(--panel-2)}.cal-day.today{background:var(--accent);color:var(--on-accent);font-weight:var(--fw-bold)}.cal-day.selected{background:var(--panel-2);font-weight:var(--fw-bold);box-shadow:inset 0 0 0 2px var(--accent)}.cal-day.today.selected{background:var(--accent);color:var(--on-accent)}.cal-day.has-event:after{content:"";border-radius:var(--radius-circle);background:var(--status-awaiting-mark);width:5px;height:5px;position:absolute;bottom:5px}.cal-day.today.has-event:after{background:var(--on-accent)}.cal-count{font-size:var(--fs-micro);font-weight:var(--fw-semibold);color:var(--text-dim);line-height:1;position:absolute;top:3px;right:4px}.cal-day.today .cal-count,.cal-day.selected .cal-count{color:inherit}.cal-list-head{border-bottom:1px solid var(--line);font-size:var(--fs-caption);font-weight:var(--fw-semibold);color:var(--text-dim);justify-content:space-between;align-items:center;gap:10px;margin-top:18px;padding-bottom:8px;display:flex}.cal-clear{color:var(--accent-text);font:inherit;font-size:var(--fs-caption);cursor:pointer;border-radius:var(--radius-sm);background:0 0;border:none;padding:2px 4px}.cal-clear:hover{background:var(--panel-2)}.cal-events{flex-direction:column;gap:8px;margin-top:12px;display:flex}.cal-event{background:var(--panel-2);border-radius:var(--radius-md);font-size:var(--fs-body);transition:border-color var(--dur-fast) var(--ease), transform var(--dur-fast) var(--ease);border:1px solid #0000;align-items:center;gap:10px;padding:10px 12px;display:flex}.cal-event .ce-when{color:var(--accent-text);font-weight:var(--fw-semibold);font-size:var(--fs-caption);flex-shrink:0;min-width:54px}.cal-event .ce-title{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.cal-event .ce-by{font-size:var(--fs-caption);color:var(--text-dim);text-overflow:ellipsis;white-space:nowrap;flex-shrink:0;max-width:40%;margin-left:auto;overflow:hidden}.cal-event[role=button]:hover{border-color:var(--accent);transform:translate(2px)}.cal-event[role=button]:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.rail-ico{position:relative}.rail-badge{border-radius:var(--radius-md);min-width:17px;height:17px;font-size:var(--fs-micro);font-weight:var(--fw-bold);justify-content:center;align-items:center;padding:0 4px;display:inline-flex;position:absolute;top:-6px;right:-12px}.rail-badge.green{background:var(--accent);color:var(--on-accent)}.rail-badge.amber{background:var(--status-awaiting);color:var(--on-accent)}.sb-brand{min-width:0;color:inherit;align-items:center;gap:10px;text-decoration:none;display:flex}.sb-title{line-height:var(--lh-tight);flex-direction:column;min-width:0;display:flex}.sb-title strong{font-size:var(--fs-heading);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.sb-title span{font-size:var(--fs-micro);color:var(--text-dim);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.chat-item .row1{justify-content:space-between;align-items:baseline;gap:8px;display:flex}.chat-item .row1 .name{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.chat-item .row2{justify-content:space-between;align-items:center;gap:8px;display:flex}.chat-item .last-time{font-size:var(--fs-micro);color:var(--text-dim);flex-shrink:0}.chat-item .last-time.has-unread{color:var(--accent-text);font-weight:var(--fw-bold)}.unread-badge{background:var(--accent);color:var(--on-accent);border-radius:var(--radius-md);min-width:20px;height:20px;font-size:var(--fs-micro);font-weight:var(--fw-bold);flex-shrink:0;justify-content:center;align-items:center;padding:0 6px;display:inline-flex}.messages{background-image:radial-gradient(var(--wall-dot) 1.1px, transparent 1.3px);background-size:22px 22px}.msg-img{border-radius:var(--radius-sm);max-width:260px;max-height:260px;margin-bottom:4px;display:block}.date-pill{font-size:var(--fs-caption);color:var(--text-dim);background:var(--panel);border-radius:var(--radius-sm);box-shadow:var(--elev-1);text-transform:uppercase;letter-spacing:var(--track-caps);align-self:center;margin-bottom:8px;padding:5px 12px}.msg.first{border-top-left-radius:var(--radius-md);border-top-right-radius:var(--radius-md);margin-top:8px}.msg.in.first{border-top-left-radius:0}.msg.out.first{border-top-right-radius:0}.msg.in.first:before,.msg.out.first:before{content:"";border-top:8px solid;border-top-color:inherit;width:0;height:0;position:absolute;top:0}.msg.in.first:before{border-left:8px solid #0000;border-top-color:var(--bubble-in);left:-7px}.msg.out.first:before{border-right:8px solid #0000;border-top-color:var(--bubble-out);right:-7px}.msg-meta{font-size:var(--fs-micro);color:var(--text-dim);float:right;align-items:center;gap:3px;margin-top:6px;margin-left:8px;display:inline-flex}.msg-meta .tick{align-items:center;display:inline-flex}.msg-meta .tick.sent,.msg-meta .tick.delivered{color:var(--text-dim)}.msg-meta .tick.read{color:var(--tick)}.in-row{align-items:flex-start;gap:8px;display:flex}.in-row .mini-av{flex-shrink:0;width:28px;padding-top:2px}.in-row .msg{max-width:calc(66% - 36px)}.discover-window{background:var(--bg);flex-direction:column;overflow:hidden}.disc-body{padding:var(--space-6);flex:1;overflow-y:auto}.disc-grid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px;max-width:1100px;display:grid}.disc-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-lg);cursor:pointer;transition:border-color var(--dur-fast) var(--ease), transform var(--dur-fast) var(--ease);flex-direction:column;gap:10px;padding:16px;display:flex;position:relative}.disc-card:hover{border-color:var(--accent);transform:translateY(-2px)}.disc-card:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.disc-card.just-hired{border-color:var(--accent);cursor:default}.disc-top{align-items:flex-start;gap:12px;padding-right:34px;display:flex}.disc-text{flex:1;min-width:0}.disc-quick-hire{border-radius:var(--radius-circle);background:var(--accent);width:28px;height:28px;color:var(--on-accent);cursor:pointer;transition:background var(--dur-fast) var(--ease), transform var(--dur-fast) var(--ease);border:none;flex-shrink:0;justify-content:center;align-items:center;display:flex;position:absolute;top:12px;right:12px}.disc-quick-hire:hover{background:var(--accent-hover);transform:scale(1.08)}.disc-hired-badge{font-size:var(--fs-micro);font-weight:var(--fw-bold);color:var(--accent-text);background:var(--accent-soft);border:1px solid var(--accent);border-radius:var(--radius-pill);white-space:nowrap;align-items:center;padding:3px 9px;display:inline-flex;position:absolute;top:12px;right:12px}.disc-top b{font-size:var(--fs-subhead);text-overflow:ellipsis;white-space:nowrap;display:block;overflow:hidden}.disc-blurb{font-size:var(--fs-body);color:var(--text);line-height:var(--lh-normal);flex:1;margin:0}.disc-skills{flex-wrap:wrap;gap:6px;display:flex}.disc-section-h{font-size:var(--fs-micro);text-transform:uppercase;letter-spacing:var(--track-caps);color:var(--accent-text);margin:4px 0 12px}.hire-done{background:var(--panel-2);border:1px solid var(--accent);border-left:3px solid var(--accent);border-radius:var(--radius-md);font-size:var(--fs-body);color:var(--text);line-height:var(--lh-loose);padding:12px 14px}.msg-wrap{align-self:flex-start;align-items:flex-start;min-width:0;max-width:100%;display:flex;position:relative}.msg-wrap.mine{flex-direction:row-reverse;align-self:flex-end}.in-row .msg-wrap{flex:1;align-self:auto;min-width:0}.msg-wrap .msg{min-width:0}.story-start{font-size:var(--fs-caption);color:var(--text-dim);letter-spacing:0;align-self:center;margin:2px 0 10px}.ai-chip{font-size:var(--fs-micro);font-weight:var(--fw-bold);letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--accent-text);border-radius:var(--radius-sm);background:var(--accent-soft);flex-shrink:0;padding:1px 5px}.rail-switch{flex-direction:column;align-items:center;gap:8px;margin-bottom:12px;display:flex}.rail-face{border-radius:var(--radius-circle);width:28px;height:28px;opacity:var(--op-muted);transition:opacity var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease), transform var(--dur-fast) var(--ease);border:2px solid #0000;display:block;overflow:hidden}.rail-face:hover{opacity:1;transform:scale(1.12)}.rail-face.current{opacity:1;border-color:var(--accent)}.rail-face img,.rail-face svg{-o-object-fit:cover;object-fit:cover;width:100%;height:100%;display:block}.rail-face:focus-visible{outline:2px solid var(--accent);outline-offset:2px}@keyframes sheetIn{0%{opacity:0;transform:translate(44px)}}@keyframes backdropIn{0%{opacity:0}}@keyframes paneIn{0%{opacity:0;transform:translateY(6px)}}.settings-sheet{animation:sheetIn var(--dur-slow) ease-out}.sheet-backdrop{animation:backdropIn var(--dur-slow) ease-out}.messages{animation:paneIn var(--dur-slow) ease-out}.ci-member:hover{text-underline-offset:2px;text-decoration:underline}.chat-item-main:focus-visible,.rail-btn:focus-visible,.ws-tab:focus-visible,.ci-member:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.messages,.chat-list,.ws-pane,.disc-body,.sheet-body{scrollbar-width:thin;scrollbar-color:var(--panel-3) transparent}.messages::-webkit-scrollbar{width:6px}.chat-list::-webkit-scrollbar{width:6px}.ws-pane::-webkit-scrollbar{width:6px}.disc-body::-webkit-scrollbar{width:6px}.sheet-body::-webkit-scrollbar{width:6px}.messages::-webkit-scrollbar-thumb{background:var(--panel-3);border-radius:var(--radius-sm)}.chat-list::-webkit-scrollbar-thumb{background:var(--panel-3);border-radius:var(--radius-sm)}.ws-pane::-webkit-scrollbar-thumb{background:var(--panel-3);border-radius:var(--radius-sm)}.disc-body::-webkit-scrollbar-thumb{background:var(--panel-3);border-radius:var(--radius-sm)}.sheet-body::-webkit-scrollbar-thumb{background:var(--panel-3);border-radius:var(--radius-sm)}.messages::-webkit-scrollbar-track{background:0 0}.chat-list::-webkit-scrollbar-track{background:0 0}.ws-pane::-webkit-scrollbar-track{background:0 0}.disc-body::-webkit-scrollbar-track{background:0 0}.sheet-body::-webkit-scrollbar-track{background:0 0}@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}.back-btn{color:var(--text);font-size:var(--icon-xl);cursor:pointer;background:0 0;border:none;padding:0 6px 2px 0;line-height:1;display:none}@media (max-width:700px){.settings-sheet{width:100%}.app{flex-direction:column-reverse}.rail-switch{display:none}.rail{border-right:none;border-top:1px solid var(--line);flex-direction:row;justify-content:space-around;gap:0;width:100%;height:62px;padding:4px 6px 6px}.rail-btn{flex:1;gap:2px;width:auto;padding:4px 0}.rail-btn .rail-ico{font-size:var(--icon-lg)}.rail-btn .rail-label{font-size:var(--fs-micro)}.rail-spacer,.chat-window.mobile-chat .sidebar,.chat-window.mobile-list .conversation{display:none}.sidebar{border-right:none;width:100%;min-width:0}.back-btn{display:block}.chat-head{padding-right:120px}.messages{padding:14px 10px}.msg,.in-row .msg{max-width:82%}.in-row .msg{max-width:calc(82% - 36px)}.chat-card{max-width:94%}.composer{padding:8px 8px 5px}.comp-row{gap:6px}.comp-btn{width:34px;height:34px;font-size:var(--icon-md)}.comp-send{width:38px;height:38px}.ws-head{padding:12px 120px 12px 14px}.ws-head h1{font-size:var(--fs-heading)}.ws-sub{display:none}.ws-pane{padding:14px}.board-col{width:200px}.disc-body,.sheet-body{padding:14px}.dash-filters{padding:10px 14px}.dash-list{grid-template-columns:1fr;gap:22px}}.board-hint{font-size:var(--fs-body);color:var(--text-dim);justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px;display:flex}.board-hint b{color:var(--text)}.board-reset{background:var(--panel-2);border:1px solid var(--line);color:var(--text);border-radius:var(--radius-pill);font:inherit;font-size:var(--fs-caption);cursor:pointer;flex-shrink:0;align-items:center;gap:5px;padding:5px 12px;display:inline-flex}.board-reset:hover{border-color:var(--accent);color:var(--accent-text)}.cal-head-right{align-items:center;gap:6px;display:flex}.cal-today-btn{background:var(--panel-2);border:1px solid var(--line);color:var(--text);border-radius:var(--radius-pill);font:inherit;font-size:var(--fs-caption);cursor:pointer;padding:4px 11px}.cal-today-btn:hover{border-color:var(--accent);color:var(--accent-text)}.tour-spot{border-radius:var(--radius-lg);pointer-events:none;z-index:899;box-shadow:0 0 0 9999px var(--scrim);outline:2px solid var(--accent);outline-offset:0;transition:top var(--dur-slow) ease, left var(--dur-slow) ease, width var(--dur-slow) ease, height var(--dur-slow) ease;position:fixed}.tour-backdrop-only{z-index:899;background:var(--scrim);position:fixed;inset:0}.tour-click-guard{z-index:900;position:fixed;inset:0}.tour-card{z-index:901;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-lg);width:320px;max-width:calc(100vw - 24px);box-shadow:var(--elev-3);padding:18px 20px;position:fixed}.tour-card.centered{top:50%;left:50%;transform:translate(-50%,-50%)}.tour-eyebrow{font-size:var(--fs-micro);text-transform:uppercase;letter-spacing:var(--track-caps);color:var(--accent-text);font-weight:var(--fw-bold);margin-bottom:6px}.tour-card h3{font-size:var(--fs-heading);color:var(--text);margin:0 0 8px}.tour-card p{font-size:var(--fs-body);color:var(--text-dim);line-height:var(--lh-loose);margin:0}.tour-card p+p{margin-top:8px}.tour-hint{border-radius:var(--radius-md);background:var(--status-awaiting-soft);color:var(--text);font-size:var(--fs-body);line-height:var(--lh-normal);margin-top:10px;padding:9px 11px}.tour-foot{justify-content:space-between;align-items:center;gap:10px;margin-top:16px;display:flex}.tour-dots{gap:5px;display:flex}.tour-dot{border-radius:var(--radius-circle);background:var(--line);width:6px;height:6px}.tour-dot.on{background:var(--accent)}.tour-actions{gap:8px;display:flex}.tour-btn{border-radius:var(--radius-sm);font-size:var(--fs-body);font-weight:var(--fw-semibold);cursor:pointer;border:none;padding:8px 14px;font-family:inherit}.tour-btn.primary{background:var(--accent);color:var(--on-accent)}.tour-btn.ghost{background:var(--panel-3);color:var(--text-dim)}.tour-btn.ghost:hover{color:var(--text)}.tour-skip{color:var(--text-dim);font-size:var(--fs-caption);cursor:pointer;text-underline-offset:2px;background:0 0;border:none;padding:4px;text-decoration:underline}.exit-btn{z-index:950;border-radius:var(--radius-pill);background:var(--panel);border:1px solid var(--line);color:var(--text-dim);font-weight:var(--fw-semibold);cursor:pointer;box-shadow:var(--elev-2);align-items:center;gap:6px;padding:8px 14px;display:inline-flex;position:fixed;top:14px;right:16px}.exit-btn-label{font-size:var(--fs-micro)}.exit-btn:hover{color:var(--text);background:var(--panel-2)}.confirm-backdrop{z-index:950;background:var(--scrim);position:fixed;inset:0}.confirm-dialog{z-index:951;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-lg);width:340px;max-width:calc(100vw - 32px);box-shadow:var(--elev-3);padding:20px;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}.confirm-dialog h3{font-size:var(--fs-heading);color:var(--text);margin:0 0 8px}.confirm-dialog p{font-size:var(--fs-body);color:var(--text-dim);line-height:var(--lh-loose);margin:0}.confirm-actions{gap:8px;margin-top:18px;display:flex}.confirm-actions .btn{flex:1}@media (max-width:700px){.exit-btn{padding:6px 10px;top:10px;right:10px}}@media (max-width:560px){.tour-card:not(.centered){width:auto;max-width:none;inset:auto 12px 74px}}.landing{flex:1;justify-content:center;min-height:0;display:flex;overflow-y:auto}.landing-inner{width:100%;max-width:1040px;padding:var(--space-14) var(--space-6) var(--space-10)}.landing-head{text-align:center;max-width:560px;margin:0 auto 40px}.landing-mark{border-radius:var(--radius-lg);background:var(--accent);width:56px;height:56px;color:var(--on-accent);font-size:var(--icon-xl);justify-content:center;align-items:center;margin:0 auto 16px;display:flex}.landing-head h1{font-size:var(--fs-display);font-weight:var(--fw-black);color:var(--text);margin:0 0 12px}.landing-head p{font-size:var(--fs-subhead);line-height:var(--lh-loose);color:var(--text-dim);margin:0}.landing-grid{grid-template-columns:repeat(3,1fr);gap:16px;display:grid}.persona-card{border-radius:var(--radius-lg);background:var(--panel);border:1px solid var(--line);color:inherit;transition:border-color var(--dur-fast) var(--ease), transform var(--dur-fast) var(--ease);flex-direction:column;align-items:flex-start;gap:6px;padding:22px;text-decoration:none;display:flex}.persona-card:hover{border-color:var(--accent);transform:translateY(-2px)}.persona-card:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.persona-card-avatar{border-radius:var(--radius-circle);background:var(--surface-portrait);flex-shrink:0;width:56px;height:56px;margin-bottom:10px;overflow:hidden}.persona-card-avatar img,.persona-card-avatar svg{-o-object-fit:cover;object-fit:cover;width:100%;height:100%;display:block}.persona-card-name{font-size:var(--fs-heading);font-weight:var(--fw-bold);color:var(--text)}.persona-card-tagline{font-size:var(--fs-caption);font-weight:var(--fw-semibold);color:var(--accent-text)}.persona-card-blurb{font-size:var(--fs-body);line-height:var(--lh-normal);color:var(--text-dim);flex:1;margin-top:2px}.persona-card-stats{font-size:var(--fs-micro);color:var(--text-dim);text-transform:uppercase;letter-spacing:var(--track-caps);margin-top:6px}.persona-card-cta{font-size:var(--fs-body);font-weight:var(--fw-semibold);color:var(--accent-text);margin-top:10px}@media (max-width:860px){.landing-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:560px){.landing-grid{grid-template-columns:1fr}} /* === CORE TEAM WORKSPACE THEME (generated — edit build/theme/workspace.css) === */ /* ============================================================================ Core Team — "Workspace" theme ---------------------------------------------------------------------------- A third selectable palette for the demo app, alongside Terracotta and Material 3. Implements the UI revamp brief: calm legible workspace, neutral structure, one accent, semantic colour for state only. Everything is scoped to [data-palette=workspace] so the other two palettes are untouched. Appended to the compiled stylesheet by apply.py — edit THIS file, never the compiled one. The app exposes 62 theme variables; all of them are redefined here so nothing silently falls back to Terracotta. Structural rules below that use the app's own (unhashed, semantic) class names. ========================================================================= */ /* ---------------------------------------------------------------- tokens -- */ [data-palette=workspace] { /* type — the brief's stack. Inter if the OS has it, system UI otherwise; the demo ships no webfonts and shouldn't start now. */ --ws-font: "Instrument Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; /* geometry */ --ws-radius-sm: 8px; --ws-radius-md: 12px; --ws-radius-lg: 16px; --ws-control-h: 36px; --ws-touch: 44px; --ws-conversation-max: 820px; /* motion */ --ws-ease: cubic-bezier(.2, 0, 0, 1); --ws-fast: 120ms; --ws-standard: 180ms; } [data-palette=workspace][data-theme=light], html[data-palette=workspace][data-theme=light] { color-scheme: light; /* brief token → app variable */ --bg: #F5F1E8; /* shared Core Team paper canvas */ --panel: #FFFDF8; /* warm white surface */ --panel-2: #F0EBE1; /* quiet inset */ --panel-3: #E7E0D4; /* hover / pressed */ --bubble-in: #FFFDF8; --bubble-out: #E8F0EC; /* user bubble = quiet brand tint */ --wash-1: #EBE4D6; --wash-2: #F0EBE1; --wall-dot: #142a2508; --text: #142A25; --text-dim: #46564F; /* The brief's text-tertiary (#858C96) is 3.39:1 on white — below AA for normal text. Kept as the token for genuinely redundant/decorative text, but the app renders real metadata (timestamps, counts) with --text-faint, so that one is darkened to clear 4.5:1 on both canvas and surface. */ --text-tertiary: #7B827E; /* decorative only */ /* Corrected a second time: the original #6B7280 (4.83:1 on surface, 4.52:1 on canvas) was never checked against --bubble-out, which is the actual background .msg-meta renders on for outgoing messages — and there it's only 4.32:1, below AA. --bubble-out equals --panel-2 exactly in this palette, so darkened once more to clear all three surfaces at once. */ --text-faint: #59665F; --line: #B8B0A2; /* border-strong — separators */ --line-faint: #DED7CA; /* border-subtle */ /* Separators may be low-contrast (principle 4), but a boundary that defines a control must clear 3:1 per WCAG 1.4.11. border-strong is 1.60:1, so control outlines use this instead. */ --ws-control-border: #7C817B; --color-brand: #36715C; --color-brand-hover: #285B49; --color-brand-text: #285B49; --color-brand-soft: #E0EEE7; /* shared website mint */ --color-on-brand: #FFFDF8; --color-success: #19734A; --color-success-soft: #E3F2EA; --color-info: #2E68A9; --color-info-soft: #E4EEF8; --color-warning: #875400; --color-warning-strong: #754900; --color-warning-soft: #F7EDBD; --color-neutral: #626872; --color-error: #B42318; --color-error-soft: #FBE6E4; --ws-focus: #C95F4E; --ws-selected: #E0EEE7; --accent: var(--color-brand); --accent-hover: var(--color-brand-hover); --accent-text: var(--color-brand-text); --accent-soft: var(--color-brand-soft); --on-accent: var(--color-on-brand); /* Deliberately its own colour, not var(--color-success): the base app's .presence-dot.online reads --status-online, and .rail-green/.status-done work-cards read --color-success (Doc 1 §7.3's own Completed value). Aliasing the two made "agent is online" and "this work is done" literally the same green — exactly the collision Doc 1 §3.8 forbids ("a green presence dot must never be used to mean a completed task"). A teal, checked separately for 4.5:1 text contrast since .presence-text.online reads this as real label colour, not just a dot. */ --status-online: #0E7C7B; /* 5.01:1 on white */ --status-online-soft: #E3F2F1; --status-working: var(--color-info); --status-working-soft: var(--color-info-soft); --status-awaiting: var(--color-warning); --status-awaiting-mark: var(--color-warning-strong); --status-awaiting-soft: var(--color-warning-soft); --status-away: var(--color-neutral); --danger: var(--color-error); --danger-soft: var(--color-error-soft); /* Ported from core-theme (D10) — Scheduled reused --status-away here, making it visually identical to "agent is away", a real semantic collision (two unrelated facts sharing one colour). Core's own values, re-checked for 4.5:1 against THIS palette's panel/soft tones, not just assumed: 5.65:1 (text on white), 4.79:1 (text on its own soft pill). */ --ws-scheduled: #7256B5; --ws-scheduled-soft: #EFEAF8; --tick: #2E68A9; --avatar-keyline: #1b1d2214; --surface-portrait: #EBE4D6; --on-avatar: #142A25; --shadow-1: #142a2512; --shadow-2: #142a2524; --shadow-3: #142a2538; --scrim: #142a2599; /* sender identity — desaturated so no single one reads as a second accent */ --sender-0: #8A4B57; --sender-1: #8A5A32; --sender-2: #6F5B23; --sender-3: #4F6136; --sender-4: #2F6650; --sender-5: #2A6266; --sender-6: #305F77; --sender-7: #3A5980; --sender-8: #5A5286; --sender-9: #7A4A72; } [data-palette=workspace][data-theme=dark], html[data-palette=workspace][data-theme=dark] { color-scheme: dark; --bg: #15171A; --panel: #1D2024; --panel-2: #25292E; --panel-3: #2C3137; --bubble-in: #1D2024; --bubble-out: #25292E; --wash-1: #111315; --wash-2: #191B1E; --wall-dot: #f4f5f60a; --text: #F4F5F6; --text-dim: #B4BBC4; --text-tertiary: #89919B; /* 5.13:1 on surface — clears AA as-is */ --text-faint: #89919B; --line: #4A535E; /* separators */ --line-faint: #323840; --ws-control-border: #6A7480; /* 3.44:1 on surface — control boundaries */ --color-brand: #73C6A3; --color-brand-hover: #91D5B8; --color-brand-text: #A9DFC7; --color-brand-soft: #173D31; --color-on-brand: #092218; --color-success: #65C995; --color-success-soft: #14372A; --color-info: #78B7F0; --color-info-soft: #16304A; --color-warning: #F0B85B; --color-warning-strong: #F5C97D; --color-warning-soft: #3A2E14; --color-neutral: #B4BBC4; --color-error: #FF8B83; --color-error-soft: #4A1F1C; --ws-focus: #F09B88; --ws-selected: #163E31; --accent: var(--color-brand); --accent-hover: var(--color-brand-hover); --accent-text: var(--color-brand-text); --accent-soft: var(--color-brand-soft); --on-accent: var(--color-on-brand); /* see the light-theme block above for why this isn't var(--color-success) */ --status-online: #4FC7C4; /* 8.02:1 on panel */ --status-online-soft: #123632; --status-working: var(--color-info); --status-working-soft: var(--color-info-soft); --status-awaiting: var(--color-warning); --status-awaiting-mark: var(--color-warning-strong); --status-awaiting-soft: var(--color-warning-soft); --status-away: var(--color-neutral); --danger: var(--color-error); --danger-soft: var(--color-error-soft); /* see the light-theme block above — same D10 port, dark-checked values: 6.97:1 (text on panel), 6.55:1 (text on its own soft pill). */ --ws-scheduled: #B89AF3; --ws-scheduled-soft: #291F41; --tick: #78B7F0; --avatar-keyline: #f4f5f61a; --surface-portrait: #25292E; --on-avatar: #F4F5F6; --shadow-1: #00000052; --shadow-2: #00000073; --shadow-3: #0009; --scrim: #0b0d0fb3; --sender-0: #E79AA6; --sender-1: #E3A472; --sender-2: #CBB463; --sender-3: #A8BE7C; --sender-4: #7FCCA6; --sender-5: #6FC7C9; --sender-6: #7BBEDA; --sender-7: #93B4E4; --sender-8: #B0A6E0; --sender-9: #D69ACB; } /* ------------------------------------------------------------ typography -- */ [data-palette=workspace] .app, [data-palette=workspace] .app input, [data-palette=workspace] .app button, [data-palette=workspace] .app textarea { font-family: var(--ws-font); } html[data-palette=workspace] body, [data-palette=workspace] .exit-btn, [data-palette=workspace] .tour-card, [data-palette=workspace] .confirm-dialog, [data-palette=workspace] .settings-sheet { font-family: var(--ws-font); } /* time, counts and dates line up */ [data-palette=workspace] .last-time, [data-palette=workspace] .msg-meta, [data-palette=workspace] .date-pill, [data-palette=workspace] .cc-when, [data-palette=workspace] .dash-count, [data-palette=workspace] .dash-chip-n, [data-palette=workspace] .unread-badge, [data-palette=workspace] .rail-badge { font-variant-numeric: tabular-nums; } /* thread title is prominent once, not twice */ [data-palette=workspace] .chat-head-name { font-size: 16px; font-weight: 650; line-height: 1.2; } [data-palette=workspace] .chat-head-sub { font-size: 12px; color: var(--text-dim); } [data-palette=workspace] .section-label { font-size: 11px; font-weight: 600; letter-spacing: .05em; color: var(--text-faint); } /* --------------------------------------------------------------- layout -- */ /* Cap the reading column and keep the composer on the same measure, so a wide display doesn't stretch message lines to the full pane. Was `.messages > *` — every message and date divider is wrapped in `
`, confirmed live (getComputedStyle: display: contents). A `display:contents` element generates no box of its own, so max-width/margin/width on it are discarded outright — this rule capped nothing, ever. It also matched `.chat-intro` (a real box, also a direct child of `.messages`), where its 820px beat the base app's own 380px and ballooned the team-intro card. Targeting `.messages` itself instead — the actual flex column, base padding and all — caps the real reading column and leaves `.chat-intro` alone (fixed on its own line below). */ [data-palette=workspace] .messages, [data-palette=workspace] .comp-row { max-width: var(--ws-conversation-max); margin-left: auto; margin-right: auto; width: 100%; } /* sticky, compact thread header */ [data-palette=workspace] .chat-head { position: sticky; top: 0; z-index: 5; min-height: 60px; background: var(--panel); border-bottom: 1px solid var(--line-faint); } /* the big group intro panel becomes quiet reference material rather than a second hero. (A true collapsible disclosure needs the React source — see the README's scope note.) max-width pinned explicitly — doc's own first-visit-summary spec caps this at 560px, and it can no longer inherit a (wrong) width from the .messages fix above. Without its own line here it would fall back to the base app's 380px, which is too narrow for this panel's now-denser content (name, purpose, member chips) and was the reason the old, broken 820px rule went unnoticed for as long as it did — it was accidentally making an under-sized panel look reasonable. */ [data-palette=workspace] .chat-intro { max-width: 560px; margin: 0 auto; background: var(--panel); border: 1px solid var(--line); border-top: 3px solid var(--accent); border-radius: var(--ws-radius-md); box-shadow: 0 8px 24px #142a2512; padding: 18px 24px 16px; } [data-palette=workspace] .chat-intro .ci-name { font-size: 15px; font-weight: 600; } [data-palette=workspace] .chat-intro .ci-role { color: var(--accent-text); font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; } [data-palette=workspace] .chat-intro .ci-can { color: var(--text-dim); max-width: 470px; } [data-palette=workspace] .chat-intro .ci-member { background: var(--accent-soft); border-color: #9ebdaf; } /* ---------------------------------------------------- conversation rows -- */ [data-palette=workspace] .chat-item { min-height: 64px; border-radius: var(--ws-radius-sm); transition: background var(--ws-fast) var(--ws-ease); } [data-palette=workspace] .chat-item:hover { background: var(--panel-3); } /* one-line preview, ellipsis — a message paragraph must not set row height */ [data-palette=workspace] .preview { display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; font-weight: 400; color: var(--text-dim); } /* selected = subtle fill + left bar, never a saturated block */ [data-palette=workspace] .chat-item.active { background: var(--ws-selected); box-shadow: inset 3px 0 0 0 var(--accent); } /* unread weights the name only; it does not stack a second saturated marker */ [data-palette=workspace] .chat-item.has-unread .name { font-weight: 650; } [data-palette=workspace] .chat-item.active.has-unread .name { font-weight: 650; } /* ----------------------------------------------------------- global rail -- */ [data-palette=workspace] .rail { background: var(--panel); border-right: 1px solid var(--line-faint); min-width: 84px; width: 84px; } [data-palette=workspace] .rail-btn { width: 72px; min-height: var(--ws-touch); border-radius: var(--ws-radius-sm); color: var(--text-dim); } [data-palette=workspace] .rail-btn:hover { background: var(--panel-3); color: var(--text); } [data-palette=workspace] .rail-btn.active { background: var(--ws-selected); color: var(--accent-text); box-shadow: inset 4px 0 0 0 var(--accent); } [data-palette=workspace] .rail-label { font-size: 10px; font-weight: 650; line-height: 1.15; max-width: 100%; white-space: nowrap; } [data-palette=workspace] .rail-badge { background: var(--accent); color: var(--on-accent); } [data-palette=workspace] .sidebar { background: var(--panel); border-right: 1px solid var(--line-faint); } [data-palette=workspace] .sidebar-head { border-bottom: 1px solid var(--line-faint); } /* ------------------------------------------------------------- messages -- */ /* Incoming agent messages: no filled bubble (authorship is already carried by the sender name + avatar, not by a background tint), but WITH a visible outline — fully borderless read as a wall of undifferentiated text with no visible message boundary at all, confirmed live and reverted per direct feedback. Outgoing keeps its tinted bubble so authorship stays obvious there too. Targets .msg.in / .msg.out directly, not "&.msg-wrap" — .msg-wrap is the ANCESTOR of .msg (confirmed live: a .msg's own parentElement is ".msg-wrap mine"), so the original descendant selector matched nothing and this whole treatment never rendered a single pixel until fixed. */ [data-palette=workspace] .msg.in { background: var(--panel); border: 1px solid var(--line-faint); box-shadow: none; } [data-palette=workspace] .msg.out, [data-palette=workspace] .msg.mine { background: var(--bubble-out); border: 1px solid var(--line-faint); box-shadow: none; max-width: 75%; } [data-palette=workspace] .msg-meta { color: var(--text-faint); font-size: 11px; } [data-palette=workspace] .msg.in.first::before { border-top-color: var(--panel); } [data-palette=workspace] .msg.out.first::before { border-top-color: var(--bubble-out); } /* Orchestration events are machine-readable state changes, not chat bubbles. */ [data-palette=workspace] .system-line { align-self: center; background: transparent; border: 0; border-left: 2px solid var(--color-info); border-radius: 0; color: var(--text-dim); font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; font-size: 10px; font-weight: 600; letter-spacing: .025em; line-height: 1.55; margin: 8px auto; max-width: 620px; padding: 5px 10px; width: calc(100% - 36px); } /* date separator: quiet label on a rule */ [data-palette=workspace] .date-pill { background: var(--panel-2); color: var(--text-dim); border: 1px solid var(--line-faint); font-size: 12px; font-weight: 500; } /* --------------------------------------------------- structured work cards -- */ /* A card means "interactive work object". Colour is paired with the card's own text label in the markup, never carrying the meaning alone. */ [data-palette=workspace] .chat-card { background: var(--panel); border: 1px solid var(--line-faint); border-radius: var(--ws-radius-md); box-shadow: 0 8px 24px var(--shadow-1); } /* awaiting a decision — the one persistent high-emphasis state */ [data-palette=workspace] .chat-card.rail-accent { border-left: 3px solid var(--status-awaiting); background: var(--panel); } /* completed — reads as history, loses its weight. --status-success was never defined anywhere — not in this file, not in the base app (confirmed: 0 declarations) — so the invalid custom property made the whole border-left shorthand invalid, unsetting even border-left-style. Verified live: completed cards rendered with no left rail at all, in both themes. --status-* names are reserved for Presence (Doc 1 §3.8 — online/working/away), a different concept from work status; using --color-success directly here keeps that distinction real rather than reusing a presence token for a status colour, which is the exact collision §3.8 warns against. */ [data-palette=workspace] .chat-card.rail-green { border-left: 3px solid var(--color-success); background: var(--panel-2); box-shadow: none; } [data-palette=workspace] .ws-context-link { appearance: none; border: 0; border-top: 1px solid color-mix(in srgb, var(--border) 72%, transparent); background: transparent; color: var(--accent); cursor: pointer; display: block; font: 600 11px/1.2 "Instrument Sans", sans-serif; letter-spacing: .01em; margin: 9px -10px -9px; padding: 8px 10px 7px; text-align: left; width: calc(100% + 20px); } [data-palette=workspace] .ws-context-link:hover { background: var(--accent-soft); } [data-palette=workspace] .ws-context-link:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: -2px; } [data-palette=workspace] .ws-card-arrival { animation: ws-card-arrival 1.8s ease-out; } @keyframes ws-card-arrival { 0%, 35% { box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent) 34%, transparent), var(--shadow-sm); transform: translateY(-2px); } 100% { box-shadow: var(--shadow-sm); transform: none; } } [data-palette=workspace] .ws-presence-legend { border-top: 1px solid var(--border); color: var(--text-muted); display: flex; flex-wrap: wrap; font-size: 10px; gap: 7px 10px; margin: 10px 12px 4px; padding-top: 10px; } [data-palette=workspace] .ws-presence-legend span { align-items: center; display: inline-flex; gap: 4px; } [data-palette=workspace] .ws-presence-legend .presence-dot { position: static; width: 7px; height: 7px; } [data-palette=workspace] .presence-dot.online { background: var(--status-online); } [data-palette=workspace] .presence-dot.working { background: var(--status-working); } [data-palette=workspace] .presence-dot.offline { background: var(--text-faint); } [data-palette=workspace] .avatar { overflow: visible; position: relative; } [data-palette=workspace] .avatar .agent-portrait { border-radius: inherit; height: 100%; inset: 0; object-fit: cover; position: absolute; width: 100%; z-index: 1; } /* Team chats use the same people as their individual conversations. The overlapping portrait stack makes that relationship visible without inventing a second set of team mascots. */ [data-palette=workspace] .avatar .team-portrait { position: absolute; inset: 0; z-index: 1; display: flex; align-items: center; justify-content: center; padding: 3px; overflow: hidden; border-radius: inherit; background: var(--panel-2); } [data-palette=workspace] .avatar .team-portrait img { width: 62%; height: 62%; min-width: 0; margin-left: -22%; object-fit: cover; border: 2px solid var(--panel); border-radius: 50%; box-shadow: 0 1px 3px rgba(20, 45, 37, .16); } [data-palette=workspace] .avatar .team-portrait img:first-child { margin-left: 0; } [data-palette=workspace] .avatar .presence-dot { z-index: 2; } [data-palette=workspace] .memory-list { display: grid; gap: 8px; } [data-palette=workspace] .memory-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 12px; background: var(--panel); } [data-palette=workspace] .memory-text { line-height: 1.35; } [data-palette=workspace] .memory-text[contenteditable="true"] { padding: 4px 6px; outline: 2px solid var(--green); border-radius: 6px; background: var(--panel-2); } [data-palette=workspace] .memory-actions { display: flex; gap: 10px; } [data-palette=workspace] .memory-actions .text-link { margin: 0; font-size: 12px; } [data-palette=workspace] .cc-outcome { color: var(--text-dim); } [data-palette=workspace] .cc-title { font-size: 14px; font-weight: 600; } [data-palette=workspace] .cc-detail { color: var(--text-dim); font-size: 13px; } /* dashboard aggregation of the same objects */ [data-palette=workspace] .dash-card { background: var(--panel); border: 1px solid var(--line-faint); border-radius: var(--ws-radius-md); box-shadow: 0 6px 18px var(--shadow-1); } /* One shared interaction shape across the website and product. Buttons that are intentionally circular or pill-shaped keep their stronger base shape. */ [data-palette=workspace] :where(.btn, .tour-btn, .cc-btn, .dc-approve-btn, .tc-approve-btn, .board-reset, .cal-today-btn) { border-radius: var(--ws-radius-sm); transition-duration: var(--ws-fast); transition-timing-function: var(--ws-ease); } [data-palette=workspace] .exit-btn { background: color-mix(in srgb, var(--panel) 94%, transparent); border-color: var(--line); color: var(--text-dim); backdrop-filter: blur(14px); } [data-palette=workspace] .exit-btn:hover { background: var(--panel-2); border-color: var(--accent); color: var(--accent-text); } [data-palette=workspace] .dash-card.status-awaiting { border-left: 3px solid var(--status-awaiting); } [data-palette=workspace] .dash-card.status-running { border-left: 3px solid var(--status-working); } [data-palette=workspace] .dash-card.status-scheduled { border-left: 3px solid var(--ws-scheduled); } /* Blocked and declined were missed when the per-status rails above were first written, and the `border` shorthand on .dash-card two rules up silently swallowed the base app's own red — equal specificity, declared later, so it won. The result was a failure state wearing the same neutral hairline as everything else, which is the one status that must never be quiet. Caught by the anonymous workspace, which is the first persona whose data actually exercises both. */ [data-palette=workspace] .dash-card.status-blocked, [data-palette=workspace] .dash-card.status-declined { border-left: 3px solid var(--danger); } /* base app's own .dc-status.scheduled / .tc-status.scheduled read var(--status-away) for their text colour — confirmed straight from the compiled CSS — so the Scheduled pill in both Dashboard and Board read as literally the same colour as an agent's "away" presence dot. */ [data-palette=workspace] .dc-status.scheduled { background: var(--ws-scheduled-soft); color: var(--ws-scheduled); } [data-palette=workspace] .tc-status.scheduled { background: var(--ws-scheduled-soft); border-color: var(--ws-scheduled); color: var(--ws-scheduled); } [data-palette=workspace] .board-col.scheduled > h3 { color: var(--ws-scheduled); } [data-palette=workspace] .dash-card.status-done { border-left: 3px solid var(--color-success); background: var(--panel-2); } [data-palette=workspace] .dash-chip { border-radius: var(--ws-radius-pill, 999px); border: 1px solid var(--line-faint); background: var(--panel); min-height: 32px; } /* Board's horizontal-scrolling column strip never got a styled scrollbar from the base app, unlike every other scrollable pane (.messages, .chat-list, .ws-pane, .disc-body, .sheet-body all get a thin 6px one) — confirmed via the compiled CSS: no `.board::-webkit-scrollbar` rule exists anywhere, for any palette. Left as the unstyled OS default, it's part of why panning it reads as broken rather than as a normal control. Wheel-to-horizontal remapping is the other half of that fix in Core (core-theme/enhance.js); this palette has no JS layer, so this is the piece reachable here. */ [data-palette=workspace] .board::-webkit-scrollbar { height: 12px; } [data-palette=workspace] .board::-webkit-scrollbar-thumb { background: var(--ws-control-border); border-radius: 999px; } [data-palette=workspace] .board::-webkit-scrollbar-track { background: transparent; } [data-palette=workspace] .board { scrollbar-width: auto; scrollbar-color: var(--accent) var(--panel-2); scrollbar-gutter: stable; overscroll-behavior-inline: contain; scroll-snap-type: x proximity; padding-bottom: 10px; } [data-palette=workspace] .board:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; } [data-palette=workspace] .board-col { scroll-snap-align: start; } /* Multiple events belong to the date; they are not unread notifications. Keep the date dominant and render the count as quiet calendar metadata. */ [data-palette=workspace] .cal-day .cal-count { background: transparent; color: var(--accent-text); font-size: 9px; font-variant-numeric: tabular-nums; inset: auto 50% 1px auto; letter-spacing: .02em; transform: translateX(50%); } [data-palette=workspace] .cal-day:has(.cal-count)::after { display: none; } [data-palette=workspace] .dash-chip.active { background: var(--ws-selected); border-color: var(--accent); color: var(--accent-text); } /* Dashboard view, area, owner and sort controls form one toolbar. */ [data-palette=workspace] .dash-filters { align-items: center; gap: 10px 14px; padding-block: 10px; } [data-palette=workspace] .dash-controls { align-items: center; flex-wrap: wrap; justify-content: flex-end; } [data-palette=workspace] .ws-tabs.ws-view-switch { background: var(--panel-2); border: 1px solid var(--ws-control-border); border-radius: 10px; gap: 2px; overflow: visible; padding: 3px; width: 360px; } [data-palette=workspace] .ws-view-switch .ws-tab { border: 0; border-radius: 7px; font-size: 12px; gap: 5px; min-height: 34px; padding: 6px 9px; flex: 1; justify-content: center; } [data-palette=workspace] .ws-view-switch .ws-tab.active { background: var(--panel); box-shadow: 0 1px 3px #142a251a; color: var(--accent-text); } [data-palette=workspace] .ws-view-switch .ws-tab:hover { background: var(--panel); } /* Work-state hierarchy: action surfaces are white; completed work recedes. */ [data-palette=workspace] .dash-card { background: #FFFEFB; border-color: #C9C1B3; } [data-palette=workspace] .dash-card.status-done, [data-palette=workspace] .dash-card.status-declined { background: #F0EDE6; border-color: #D7D0C4; box-shadow: none; } [data-palette=workspace] .dash-card.status-done .dc-title, [data-palette=workspace] .dash-card.status-declined .dc-title { color: var(--text-dim); } /* --------------------------------------------------------------- composer -- */ [data-palette=workspace] .composer { background: var(--panel); border-top: 1px solid var(--line-faint); min-height: 48px; } [data-palette=workspace] .comp-field { background: var(--panel-2); border: 1px solid var(--ws-control-border); border-radius: var(--ws-radius-lg); min-height: 44px; overflow: hidden; } /* other control boundaries held to the same 3:1 floor */ [data-palette=workspace] .search input, [data-palette=workspace] .dash-select, [data-palette=workspace] .ws-tab { border-color: var(--ws-control-border); } /* reads as deliberately unavailable, not broken */ [data-palette=workspace] .comp-input { border-radius: inherit; color: var(--text-dim); height: 100%; inset: 0; padding: 0 42px 0 16px; position: absolute; width: 100%; } [data-palette=workspace] .comp-lock { color: var(--text-faint); } [data-palette=workspace] .comp-btn { min-width: var(--ws-touch); min-height: var(--ws-touch); color: var(--text-dim); } [data-palette=workspace] .comp-btn:hover { color: var(--text); background: var(--panel-3); } [data-palette=workspace] .comp-send { background: var(--accent); color: var(--on-accent); } /* --------------------------------------------------------- state contract -- */ /* No border-radius here on purpose — an earlier version forced every focused element to a fixed 6px corner regardless of its own shape, which visibly squared off pill badges (.unread-badge, .dash-chip) and round avatars the instant they were focused. Modern browsers already draw the outline along the focused element's own border-radius; setting one here only overrides it with the wrong shape. */ [data-palette=workspace] :focus-visible { outline: 2px solid var(--ws-focus); outline-offset: 2px; } [data-palette=workspace] [aria-disabled=true], [data-palette=workspace] button:disabled { opacity: .5; } /* touch targets */ [data-palette=workspace] .row-menu-btn, [data-palette=workspace] .cc-edit-btn, [data-palette=workspace] .back-btn, [data-palette=workspace] .exit-btn { min-height: var(--ws-control-h); } @media (max-width: 767px) { [data-palette=workspace] .rail-btn, [data-palette=workspace] .row-menu-btn, [data-palette=workspace] .cc-edit-btn, [data-palette=workspace] .back-btn, [data-palette=workspace] .exit-btn { min-height: var(--ws-touch); } } @media (max-width: 700px) { [data-palette=workspace] .discover-window .disc-body > .chips { display: flex; flex-wrap: nowrap; gap: 8px; margin-inline: -14px; padding: 2px 14px 10px; overflow-x: auto; overscroll-behavior-inline: contain; scroll-snap-type: x proximity; scrollbar-width: none; } [data-palette=workspace] .discover-window .disc-body > .chips::-webkit-scrollbar { display: none; } [data-palette=workspace] .discover-window .disc-body > .chips .chip { flex: 0 0 auto; scroll-snap-align: start; white-space: nowrap; } [data-palette=workspace] .discover-window .disc-section-h { margin-top: 10px; } [data-palette=workspace] .rail { min-width: 0; width: 100%; } [data-palette=workspace] .rail-btn { width: auto; } [data-palette=workspace] .dash-filters { align-items: stretch; padding: 10px 12px; } [data-palette=workspace] .dash-areas { flex-wrap: nowrap; margin-inline: -2px; overflow-x: auto; padding: 2px; scrollbar-width: none; width: calc(100vw - 24px); } [data-palette=workspace] .dash-areas::-webkit-scrollbar { display: none; } [data-palette=workspace] .dash-controls { display: grid; grid-template-columns: 1fr 1fr; justify-content: stretch; width: 100%; } [data-palette=workspace] .ws-tabs.ws-view-switch { grid-column: 1 / -1; min-width: 0; order: -1; width: 100%; } [data-palette=workspace] .ws-view-switch .ws-tab { font-size: 12px; min-height: 42px; } [data-palette=workspace] .dash-select { min-width: 0; width: 100%; } } /* Dashboard header: base app's own mobile breakpoint (confirmed in the compiled CSS) reserves 120px of .ws-head's right padding for the fixed "Exit demo" pill, which isn't a flex child and doesn't shrink — combined with the smaller 14px left padding at this width, the h1 + .dash-stats pair (justify-content:space-between, no gap) had as little as ~2px of slack between "Dashboard" and a stats string like "2 need input · 11 open" — both items technically still fit on one line, so flex-wrap alone (tried first) never triggers; the ~2px really is there, just far too thin to read as a gap at normal viewing size. Column-stacking sidesteps the whole "how much slack is there" question rather than tuning a gap value that could still run thin if the stats string (need-input/open counts vary per persona) grows a little longer. Safe as a blanket rule: `.ws-head` is shared by two other headers (Chat, Discover), and both only ever render a single child — flex-direction has no visible effect with one item. */ @media (max-width: 700px) { [data-palette=workspace] .ws-head { /* base app's align-items:center / justify-content:space-between are cross-axis/main-axis for a ROW; both need an explicit reset here — switching to column silently repurposes them (center would centre the title/stats horizontally instead of left-aligning them, and space-between would apply down the now-vertical axis instead). */ flex-direction: column; align-items: flex-start; justify-content: flex-start; row-gap: 2px; } } /* motion is opt-out */ @media (prefers-reduced-motion: reduce) { [data-palette=workspace] *, [data-palette=workspace] *::before, [data-palette=workspace] *::after { transition-duration: .001ms !important; animation-duration: .001ms !important; } } /* ------------------------------------------------------- D10: ported from core-theme, with fixes. The base app ships every decision-card Approve/ Decline pair as two identical grey outline buttons — no primary/ secondary distinction, confirmed straight from the compiled CSS (.cc-btn, .dc-approve-btn and .tc-approve-btn are all one shared outline rule). Filled buttons here instead — Chat, Dashboard and Board all get the same treatment, same reasoning as the consequence-label fix these buttons already carry (one work-item field, three renderers, must read as one fact). Core's own version of this had a real bug: its filled-yes rule has the same specificity as the base app's OWN .yes:hover rule and is appended later in the cascade, so on an equal-specificity tie the later rule wins even while hovering — the fill just silently never changed on hover. Explicit :hover overrides below avoid repeating that. */ [data-palette=workspace] .cc-btn.yes, [data-palette=workspace] .dc-approve-btn.yes, [data-palette=workspace] .tc-approve-btn.yes { background: var(--accent); border-color: var(--accent); color: var(--on-accent); } [data-palette=workspace] .cc-btn.yes:hover, [data-palette=workspace] .dc-approve-btn.yes:hover, [data-palette=workspace] .tc-approve-btn.yes:hover { background: var(--accent-hover); } [data-palette=workspace] .cc-btn.no, [data-palette=workspace] .dc-approve-btn.no, [data-palette=workspace] .tc-approve-btn.no { background: var(--panel); border-color: var(--ws-control-border); color: var(--text); } [data-palette=workspace] .cc-btn.no:hover, [data-palette=workspace] .dc-approve-btn.no:hover, [data-palette=workspace] .tc-approve-btn.no:hover { background: var(--panel-2); } /* base app's .btn.ghost is a solid var(--panel-3) fill with no hover state of its own — and panel-3 is the same token this app's own hover-tint convention uses elsewhere (e.g. .cal-event:hover), so a ghost button reads as permanently mid-hover, then does nothing further when it actually is. Outline instead, with a real hover state. Used by this session's own work-detail drawer ("Open full conversation"), not just ported cosmetics. */ [data-palette=workspace] .btn.ghost { background: var(--panel); border: 1px solid var(--ws-control-border); color: var(--text); } [data-palette=workspace] .btn.ghost:hover { background: var(--panel-2); } /* List section disclosure (Doc 3 §7.1) — supports demo-theme/enhance.js's renderSectionCollapse, which wraps each section's row list in a .ws-section-body and toggles .ws-section-collapsed on the section. 0fr/1fr grid, not max-height, so no content-height guess is needed. */ [data-palette=workspace] .dash-section-h3 { cursor: pointer; user-select: none; position: relative; padding-left: 20px; } [data-palette=workspace] .dash-section-h3::before { content: ""; position: absolute; left: 2px; top: 50%; width: 8px; height: 8px; border-right: 2px solid var(--text-faint); border-bottom: 2px solid var(--text-faint); transform: translateY(-70%) rotate(45deg); transition: transform 160ms ease; } [data-palette=workspace] .ws-section-collapsed .dash-section-h3::before { transform: translateY(-30%) rotate(-45deg); } [data-palette=workspace] .ws-section-body { display: grid; grid-template-rows: 1fr; opacity: 1; transition: grid-template-rows 160ms ease, opacity 160ms ease; } [data-palette=workspace] .ws-section-body > * { overflow: hidden; min-height: 0; } [data-palette=workspace] .ws-section-collapsed .ws-section-body { grid-template-rows: 0fr; opacity: 0; } /* the 0fr/1fr collapse trick needs overflow:hidden on the direct child — but with it, an outward-drawn focus ring (this file's own default: outline-offset: 2px) on an edge card gets sliced off, since the wrapper's box is sized exactly to the content with no spare room for the ring. Drawing the ring inward instead keeps it fully inside the card's own box regardless of the wrapper's size. */ [data-palette=workspace] .ws-section-body :focus-visible { outline-offset: -2px; } /* === CORE TEAM GLOBAL TWEAKS (generated — edit global-tweaks/global.css) === */ /* ============================================================================ Core Team — global tweaks ---------------------------------------------------------------------------- Small changes that apply regardless of the active palette (Terracotta, Material 3, Workspace, Core) — unlike demo-theme/ and core-theme/, this file is NOT scoped to a [data-palette=...] selector. Keep it that way: if a future change should only affect one palette, it belongs in that palette's own folder instead. ========================================================================= */ /* "Jump to latest" removed from every chat, per request — was a floating button over the message feed that scrolls to the newest message. The button itself still exists in the compiled component; this only hides it, the same technique used for dead composer controls in core-theme/. */ .jump-latest { display: none !important; } /* Release accessibility pass: preserve compact visuals with reliable targets. */ .row-menu-btn { min-width: 44px !important; min-height: 44px !important; } .tour-btn, .tour-skip, .rail-btn, .icon-btn, .text-link { min-height: 44px; } .tour-skip { min-width: 44px; padding-inline: 8px; }