:root{font-family:Inter,'Segoe UI',Arial,sans-serif;color:#233c37;background:#f6f7f3;--green:#285b54;--muted:#7a8981;--line:#e1e7de;--paper:#fdfefa;--soft:#edf2e9;--blue:#547f9e}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer;border:0}button:disabled{opacity:.5;cursor:wait}button:hover,a:hover{filter:brightness(.97)}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,a:focus-visible{outline:3px solid #7196b5;outline-offset:3px}[hidden]{display:none!important}button svg{width:21px;height:21px;flex-shrink:0}a{color:var(--green)}.boot{padding:35vh 20px;text-align:center;color:var(--muted)}.primary{background:var(--green);color:white;border-radius:9px;padding:12px 18px;font-size:13px;font-weight:600}.secondary{background:var(--soft);color:var(--green);padding:10px 15px;border-radius:9px;font-size:12px;font-weight:600}.ghost{padding:9px;background:none;color:var(--muted);border-radius:8px;font-size:12px}.danger{background:#ae5351;color:white;border-radius:8px;padding:9px 13px}.small{font-size:11px}.eyebrow{font-size:10px;letter-spacing:1.7px;text-transform:uppercase;color:#839486;font-weight:600}.muted{color:var(--muted)}.error{background:#f8e9e5;border:1px solid #efd0c7;color:#9b4e43;border-radius:8px;padding:12px;font-size:12px;line-height:1.6}.note{background:#eef3e9;color:#677a67;padding:13px;border-radius:9px;font-size:12px;line-height:1.7}.empty{text-align:center;padding:35px 15px;color:var(--muted);font-size:13px;line-height:1.8}.empty svg{width:36px;height:36px;display:block;margin:0 auto 15px;color:#a4b6a2}.pill{display:inline-flex;background:#edf2e9;border:1px solid #dde5d6;color:#657a60;font-size:10px;padding:5px 8px;border-radius:20px;align-items:center;gap:5px}.row{display:flex;align-items:center;gap:10px}.between{display:flex;align-items:center;justify-content:space-between;gap:10px}.field{display:block;font-size:12px;font-weight:500;color:#546b5f;margin:17px 0}.field input,.field select,.field textarea{display:block;width:100%;background:#f9fbf7;border:1px solid #dbe4d7;border-radius:8px;margin-top:7px;padding:11px 12px;font-size:13px;min-width:0}.field textarea{min-height:80px;resize:vertical}.field input[type=checkbox]{display:inline-block;width:auto;margin:0 6px 0 0}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}.stack{display:grid;gap:12px}.brand{display:flex;align-items:center;gap:9px}.brand img{width:33px;height:33px}.brand strong{font-size:14px;letter-spacing:-.3px}.brand small{display:block;font-size:9px;letter-spacing:1.8px;margin-top:2px;color:#7b9181}.auth{min-height:100dvh;display:grid;grid-template-columns:minmax(310px,440px) 1fr}.auth-form{padding:42px 45px;display:flex;flex-direction:column;justify-content:center;background:#fdfefa}.auth-form h1{font-size:32px;font-weight:600;letter-spacing:-1.5px;margin:44px 0 12px}.auth-form>p{font-size:13px;line-height:1.8;color:var(--muted);margin:0 0 15px}.auth-form .primary{width:100%;margin-top:8px}.auth-image{background:#ebe3da url('/assets/office.png') center / cover no-repeat;position:relative}.auth-caption{position:absolute;left:35px;right:35px;bottom:40px;padding:22px 27px;background:#ffffffe6;border:1px solid white;backdrop-filter:blur(12px);border-radius:15px}.auth-caption strong{font-size:22px;letter-spacing:-.7px}.auth-caption p{font-size:12px;color:#76877a;line-height:1.8;margin-bottom:0}.auth-note{margin-top:28px;font-size:10px;color:#91a08f;line-height:1.8}.shell{height:100dvh;display:grid;grid-template-columns:78px minmax(0,1fr)}.rail{padding:22px 8px;background:var(--paper);border-right:1px solid var(--line);display:flex;flex-direction:column;align-items:center;z-index:3}.rail-logo{width:39px;height:39px;margin-bottom:35px}.rail nav{display:grid;gap:9px;width:100%}.nav{background:none;border-radius:10px;height:57px;color:#83918a;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:4px}.nav span{font-size:9px}.nav.active{color:var(--green);background:#e7eee3}.profile-button{margin-top:auto;background:#e7eee3;width:41px;height:41px;border-radius:50%;padding:0;overflow:hidden}.profile-button svg{width:100%;height:100%}.main{min-width:0;display:flex;flex-direction:column;position:relative}.topbar{height:72px;flex-shrink:0;background:var(--paper);border-bottom:1px solid var(--line);padding:0 28px;display:flex;align-items:center;gap:22px}.topbar .brand img{display:none}.search{margin-left:auto;width:min(340px,35vw);position:relative}.search svg{position:absolute;left:12px;top:10px;width:17px;height:17px;color:#8a9a8b}.search input{width:100%;border:1px solid var(--line);background:#f5f7f1;border-radius:8px;padding:10px 12px 10px 37px;font-size:12px}.icon-button{position:relative;background:none;border:1px solid var(--line);border-radius:9px;display:grid;place-items:center;padding:8px}.badge{position:absolute;right:-5px;top:-6px;min-width:16px;height:16px;border-radius:12px;background:#c98969;color:white;font-size:9px;display:grid;place-items:center;padding:0 3px}.connection{font-size:10px;color:#6c8774;display:flex;align-items:center;gap:6px;white-space:nowrap}.dot{width:6px;height:6px;border-radius:50%;background:#76a27a;display:inline-block}.dot.off{background:#b0b7ad}.dot.busy{background:#c5a06e}.content{flex:1;min-height:0;display:flex;overflow:hidden}.page{min-width:0;flex:1;overflow:auto;padding:28px 32px}.page-heading{margin:0 0 24px;display:flex;justify-content:space-between;align-items:center;gap:15px}.page-heading h1{font-size:28px;font-weight:600;letter-spacing:-1px;margin:5px 0 6px}.page-heading p{font-size:12px;color:var(--muted);margin:0;line-height:1.6}.map-page{padding:22px 27px 16px;display:flex;flex-direction:column;overflow:hidden}.map-page .page-heading{margin-bottom:10px}.map-page .page-heading h1{font-size:26px}.map-frame{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;overflow:auto;border-radius:15px;background:#e9ded5}.office{position:relative;width:100%;aspect-ratio:3/2;max-height:100%;background:url('/assets/office.png') center/100% 100% no-repeat;border-radius:13px;overflow:hidden;container-type:inline-size}.map-tag{position:absolute;transform:translate(-50%,-50%);background:#fffbefed;border:1px solid #fff8e4;box-shadow:0 3px 10px #33452b24;backdrop-filter:blur(3px);padding:5px 10px;border-radius:9px;font-size:clamp(8px,1.1cqw,13px);font-weight:650;white-space:nowrap}.map-tag:hover{background:#e9f3e4}.map-tag.locked{color:#8b8a7c}.map-tag svg{width:12px;height:12px;vertical-align:middle;margin-right:3px}.map-person{position:absolute;transform:translate(-50%,-50%);width:5.5%;min-width:30px;padding:0;background:none;filter:drop-shadow(0 3px 4px #21342944)}.map-person svg{width:100%;height:100%;display:block}.map-person .person-dot{position:absolute;right:0;bottom:8%;width:10px;height:10px;border:2px solid white;border-radius:50%;background:#99a295}.map-person .person-dot.online{background:#69a777}.map-person .person-dot.busy{background:#c79758}.map-person .map-name{position:absolute;left:50%;bottom:-10px;transform:translateX(-50%);font-size:9px;background:#fffdf1f2;padding:3px 7px;border-radius:7px;white-space:nowrap;color:#344b3d;box-shadow:0 2px 8px #243b3220}.office-footer{display:flex;align-items:center;justify-content:space-between;gap:13px;font-size:11px;color:var(--muted);padding:13px 3px 0}.office-footer select{border:0;background:var(--soft);border-radius:6px;padding:7px;font-size:11px;margin-left:10px}.map-instruction{font-size:10px}.vacant{border:1px dashed #d4c7b3;background:#ffffffc9;padding:5px 9px;border-radius:10px;font-size:9px;position:absolute;transform:translate(-50%,-50%);color:#7d8273;white-space:nowrap}.desk-unassigned{font-size:10px}.directory{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:15px}.person-card,.channel-card,.task-card,.file-card,.meeting-card{background:var(--paper);border:1px solid var(--line);border-radius:13px;padding:18px;min-width:0}.person-card{display:flex;gap:14px;align-items:center;text-align:left}.person-card .portrait{width:58px;height:64px;background:#e9f0e5;border-radius:13px;flex-shrink:0}.person-card strong{display:block;font-size:14px;font-weight:600}.person-card small{display:block;font-size:10px;color:var(--muted);margin-top:5px}.person-card .state{font-size:10px;display:flex;align-items:center;gap:5px;margin-top:9px}.section-label{font-size:11px;color:#7b8d7d;text-transform:uppercase;letter-spacing:1.3px;margin:26px 0 12px}.channel-card{text-align:left;display:flex;gap:14px;align-items:center}.channel-card svg{width:24px;height:24px;color:#8da28c}.channel-card strong{display:block;font-size:14px;font-weight:600}.channel-card small{display:block;font-size:10px;color:var(--muted);margin-top:6px}.count{margin-left:auto;border-radius:20px;padding:4px 7px;background:#dcebd9;color:#386748;font-size:10px}.drawer{width:420px;max-width:100%;background:var(--paper);border-left:1px solid var(--line);display:flex;flex-direction:column;min-height:0;box-shadow:-8px 0 25px #263c2905;z-index:4}.drawer-header{padding:21px 23px 14px;border-bottom:1px solid var(--line)}.drawer-header h2{font-size:19px;letter-spacing:-.5px;margin:0 0 5px}.drawer-header p{font-size:10px;margin:0;color:var(--muted);line-height:1.6}.close{height:29px;width:29px;display:grid;place-items:center;background:#eff3ea;border-radius:50%;font-size:22px;flex-shrink:0}.topics{display:flex;gap:6px;overflow-x:auto;margin-top:15px;padding-bottom:3px}.topic{white-space:nowrap;background:#edf2e8;color:#71856f;border-radius:6px;padding:7px 9px;font-size:10px}.topic.active{background:var(--green);color:white}.drawer-body{padding:15px 21px;flex:1;overflow:auto;scroll-behavior:smooth}.msg{margin-bottom:17px;max-width:94%}.msg.mine{margin-left:auto}.msg-header{font-size:10px;color:#6e8475;display:flex;gap:8px;align-items:center;margin-bottom:5px}.msg-header time{font-size:9px;color:#9ba698}.msg-body{white-space:pre-wrap;overflow-wrap:anywhere;background:#edf1e8;border-radius:2px 11px 11px;padding:11px 13px;font-size:12px;line-height:1.75}.msg.mine .msg-body{background:#dce9e2;border-radius:11px 2px 11px 11px}.msg.pinned .msg-body{box-shadow:inset 3px 0 #a4ac7f}.msg-actions{display:flex;gap:10px;margin-top:5px}.msg-actions button{background:none;padding:2px 0;font-size:9px;color:#7a8d78}.msg-actions button:hover{color:#315e45;text-decoration:underline}.thread-banner{background:#e7eee1;font-size:11px;padding:10px 13px;border-radius:8px;margin-bottom:13px}.thread-banner button{background:none;font-size:11px;font-weight:600}.composer-zone{padding:10px 20px 16px;border-top:1px solid var(--line)}.composer{border:1px solid #d3ddce;border-radius:10px;overflow:hidden}.composer textarea{width:100%;min-height:75px;max-height:160px;resize:vertical;border:0;background:none;outline:none;padding:12px;font-size:12px}.composer-tools{display:flex;align-items:center;padding:6px 9px;gap:7px;background:#f6f8f1}.composer-tools select{font-size:10px;max-width:180px;border:0;background:transparent;min-width:0}.composer-tools .send{background:var(--green);color:#fff;border-radius:7px;padding:7px 13px;margin-left:auto;font-size:11px}.compose-help{font-size:9px;color:#96a28e;margin-top:7px}.mention-chips{display:flex;gap:4px;padding:0 7px 5px;flex-wrap:wrap}.mention-chip{font-size:9px;background:#e6eedf;border-radius:5px;padding:4px;color:#698164}.split-actions{display:flex;gap:8px;margin:15px 0;flex-wrap:wrap}.filters{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:20px}.filter{background:#edf2e8;border:1px solid #e0e7d8;padding:7px 12px;border-radius:20px;font-size:11px}.filter.active{background:#315b4e;color:white;border-color:#315b4e}.tasks-grid{display:grid;grid-template-columns:repeat(3,minmax(190px,1fr));gap:16px}.task-column{background:#edf1e8;border-radius:13px;padding:13px}.task-column h2{font-size:12px;margin:1px 0 13px;color:#6a816c;font-weight:600}.task-card{margin-bottom:10px;padding:14px}.task-card h3{font-size:13px;margin:8px 0 12px;line-height:1.6;font-weight:600;overflow-wrap:anywhere}.task-meta{font-size:10px;display:flex;justify-content:space-between;color:var(--muted);gap:8px;margin-top:10px}.overdue{color:#b67c59}.task-card select{width:100%;background:#f4f7ef;border:1px solid var(--line);border-radius:6px;font-size:10px;padding:7px;margin-top:10px}.task-card .ghost{padding:10px 0 0;font-size:10px}.file-card h3,.meeting-card h3{font-size:15px;font-weight:600;line-height:1.5;margin:12px 0 8px;overflow-wrap:anywhere}.file-card p,.meeting-card p{font-size:11px;color:var(--muted);line-height:1.8}.file-card>a{display:inline-block;text-decoration:none;margin-top:5px;font-size:11px;font-weight:600;padding:9px 13px;background:#e9f0e3;border-radius:7px}.file-card .file-type{font-size:10px;text-transform:uppercase;color:#97a28d;letter-spacing:1px}.notifications-list{display:grid;gap:10px}.notification{padding:15px;text-align:left;border:1px solid var(--line);border-radius:10px;background:var(--paper)}.notification.unread{background:#eaf2e5;border-color:#ccdcbc}.notification b{font-size:13px;display:block}.notification small{font-size:10px;color:var(--muted);display:block;margin-top:7px}.search-result{padding:16px;background:var(--paper);border:1px solid var(--line);border-radius:10px;text-align:left;margin-bottom:10px;display:block;width:100%}.search-result p{font-size:12px;white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.7}.search-result small{font-size:10px;color:var(--muted)}.profile-form{max-width:620px}.avatar-picker{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}.avatar-option{width:62px;height:76px;border:2px solid transparent;border-radius:11px;background:#e9efe3;padding:4px}.avatar-option.selected{border-color:var(--green);background:#d8e9dc}.avatar-option svg{width:100%;height:100%}.checks{display:flex;flex-wrap:wrap;gap:12px;margin:14px 0}.checks label{font-size:12px;display:flex;align-items:center;gap:5px}.team-table{width:100%;border-collapse:collapse;background:var(--paper);font-size:12px}.team-table th{text-align:left;font-size:10px;color:var(--muted);padding:12px;border-bottom:1px solid var(--line)}.team-table td{padding:14px 12px;border-bottom:1px solid var(--line)}.team-table small{display:block;font-size:10px;color:var(--muted);margin-top:5px}.table-scroll{overflow:auto}.invite-url{width:100%;border:1px solid #d8e3d0;background:#f3f7ed;padding:12px;border-radius:8px;font-size:12px;overflow-wrap:anywhere;min-height:85px}.dialog-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:20px}dialog{border:1px solid var(--line);border-radius:18px;width:510px;max-width:calc(100% - 28px);max-height:90dvh;padding:25px;color:#294638;box-shadow:0 25px 100px #1d3b3030}dialog::backdrop{background:#18392f55;backdrop-filter:blur(4px)}dialog h2{font-size:23px;font-weight:600;letter-spacing:-.8px;margin:0 0 6px}dialog .subtitle{font-size:12px;color:var(--muted);line-height:1.7}#toast{position:fixed;bottom:26px;left:50%;transform:translate(-50%,15px);opacity:0;pointer-events:none;z-index:20;background:#285b54;color:white;padding:13px 22px;border-radius:10px;box-shadow:0 8px 40px #23493330;max-width:90vw;font-size:12px;line-height:1.5;transition:opacity .2s,transform .2s}#toast.show{opacity:1;transform:translate(-50%,0)}#call{position:fixed;bottom:20px;right:20px;width:560px;max-width:calc(100% - 30px);background:#213c36;border:1px solid #658075;border-radius:16px;z-index:10;padding:15px;box-shadow:0 20px 70px #182e3566;color:white}.call-top{display:flex;align-items:center;gap:12px;margin-bottom:12px}.call-top strong{font-size:13px}.call-top span{font-size:10px;color:#b6cfc1;margin-left:auto}.call-top button{font-size:11px}#videos{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}#videos figure{position:relative;margin:0;min-height:100px;background:#132d25;border-radius:10px;overflow:hidden}#videos video{width:100%;height:150px;object-fit:cover;display:block}#videos figcaption{position:absolute;bottom:6px;left:8px;font-size:10px;background:#122b26c9;padding:4px 6px;border-radius:5px}.call-controls{display:flex;gap:7px;margin-top:12px;flex-wrap:wrap}.call-controls button{font-size:10px;background:#3c5b50;color:white;padding:8px 10px;border-radius:7px}.sync-warning{background:#fff0db;color:#9b783e;padding:9px 15px;font-size:11px}.mobile-switch{display:none}.tour-steps{padding-left:20px;font-size:12px;line-height:2.1;color:#687d6a}@media(min-width:1500px){.drawer{width:460px}.page{padding:32px 40px}.map-page{padding:24px 30px 14px}}@media(max-width:1100px){.drawer{width:360px}.page{padding:24px}.topbar{padding:0 22px;gap:14px}.topbar .brand strong{font-size:12px}.connection{display:none}.map-instruction{display:none}.tasks-grid{grid-template-columns:repeat(2,minmax(190px,1fr))}}@media(max-width:800px){.auth{grid-template-columns:1fr}.auth-image{display:none}.auth-form{min-height:100dvh;padding:30px max(25px,10vw)}.shell{grid-template-columns:60px 1fr}.rail{padding:18px 5px}.rail-logo{width:32px;height:32px;margin-bottom:24px}.nav{height:52px}.nav span{font-size:8px}.nav svg{width:19px;height:19px}.topbar{height:62px;padding:0 14px;gap:10px}.topbar .brand strong{font-size:11px}.topbar .brand small{font-size:8px}.topbar .search{width:auto;flex:1;min-width:40px}.search input{font-size:10px;padding-right:5px}.page{padding:22px 17px}.page-heading{align-items:flex-start;flex-wrap:wrap}.page-heading h1{font-size:25px}.page-heading .primary{font-size:11px;padding:10px 12px}.directory{grid-template-columns:1fr}.tasks-grid{grid-template-columns:1fr}.drawer{position:fixed;top:62px;right:0;bottom:0;width:calc(100% - 60px);max-width:500px;box-shadow:-25px 0 80px #183e3633}.drawer-header{padding:18px 17px 12px}.drawer-body{padding:15px}.composer-zone{padding:10px 15px 15px}.map-page{padding:19px 12px 14px}.map-frame{overflow:auto;display:block}.office{width:850px;height:567px;max-height:none;flex-shrink:0}.map-person .map-name{font-size:9px}.mobile-switch{display:inline-block}.office-footer{align-items:flex-start;font-size:9px;flex-wrap:wrap}.office-footer select{font-size:10px;margin-left:3px}.form-grid{grid-template-columns:1fr}.team-table td{padding:10px}.map-page .page-heading h1{font-size:22px}.map-page .page-heading p{font-size:10px}#call{bottom:10px;right:10px}.call-top{flex-wrap:wrap}.call-top span{margin:0}.call-top button{margin-left:auto}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

/* Animal Cells: blue navigation, green actions, clear conversation hierarchy */
:root{--green:#008c26;--blue:#1972bd;--muted:#607789;--line:#dbe6ee;--paper:#fff;--soft:#edf5fb;color:#203b50;background:#f3f7fb}
.rail{background:#125d9d}.nav{color:#dcecf9}.nav.active{background:#ffffff;color:#155f9e}.nav:hover{background:#ffffff22}.nav.active:hover{background:#edf5fb}.topbar{border-bottom:3px solid #008c26;background:white}.brand{gap:15px}.brand img{width:143px;height:59px;object-fit:contain}.brand-office{font-size:11px;color:#1972bd;border-left:1px solid #dbe6ee;padding-left:13px}.rail-logo{width:60px;height:54px;object-fit:contain;background:white;border-radius:9px;padding:4px}.primary,.send{background:#008124;color:white}.primary:hover,.send:hover{background:#006f1f}.secondary,.topic{background:#eaf3fb;color:#155f9e}.topic.active{background:#1972bd;color:white}.count{background:#e2f5e7;color:#006b20}.pill,.note{background:#edf8f0;color:#28653d}.dot,.person-dot.online{background:#008c26}.search input,.field input,.field select,.field textarea{background:#f7fafc;border-color:#dbe6ee}.channel-card svg{color:#1972bd}.map-tag{border-color:#c2dfed;background:#fffffff0;color:#145e98}.map-tag:hover{background:#e9f6ee}.map-tag.locked{color:#697c89}.drawer{width:460px}.drawer-header h2{color:#155f9e}.topic-directory{padding:4px 0}.topic-directory h3{font-size:16px;margin:0}.topic-directory h3 span{font-size:12px;color:#607789}.topic-directory .primary{font-size:11px;padding:10px 12px}.topic-intro{font-size:12px;line-height:1.6;color:#607789}.topic-search{display:block;font-size:11px;color:#607789;margin:20px 0 15px}.topic-search input{display:block;width:100%;padding:11px;border:1px solid #dbe6ee;border-radius:8px;margin-top:6px;background:#f7fafc}.topic-card{display:block;width:100%;text-align:left;padding:17px;margin-bottom:11px;border:1px solid #dbe6ee;border-left:3px solid #1972bd;border-radius:10px;background:white}.topic-card:hover{border-color:#1972bd;background:#f4f9fd}.topic-card strong{font-size:14px;color:#145e98;overflow-wrap:anywhere}.topic-card p{font-size:12px;line-height:1.5;margin:10px 0;color:#607789;overflow-wrap:anywhere}.topic-card small{font-size:10px;color:#607789}.topic-card .count{white-space:nowrap;font-size:9px}.current-topic{margin-top:14px;border-top:1px solid #dbe6ee;padding-top:13px}.current-topic span{font-size:9px;letter-spacing:1.2px;color:#607789}.current-topic h3{margin:6px 0 0;color:#145e98;font-size:17px;overflow-wrap:anywhere}.auth-form .brand img{width:220px;height:100px}.auth-form .brand-office{display:none}
@media(max-width:800px){.brand img{width:111px;height:48px}.brand-office{display:none}.drawer{width:100%}.topic-directory .between{gap:8px}.topic-directory h3{font-size:14px}.rail-logo{display:none}}

.topbar .brand img{display:block;width:126px;height:66px}.topbar{height:82px}.msg-body{background:#edf4fa}.msg.mine .msg-body{background:#e9f6ec}.thread-banner{background:#edf5fb;color:#155f9e}.auth-form{background:#fff}.brand-office{white-space:nowrap}@media(max-width:800px){.topbar{height:68px}.topbar .brand img{width:88px;height:54px}.drawer-body{padding:15px}.topic-directory .primary{font-size:10px;padding:10px}}

@media(max-width:800px){.drawer{top:68px;width:calc(100% - 60px);max-width:none}}

.topic-tabs{margin:18px 0 8px}.topic-tabs .active{background:#1972bd;color:white}.topic-controls{display:flex;gap:8px;flex-wrap:wrap;margin-top:13px}.topic-controls button{font-size:11px;padding:9px 11px}.resolve-button{border-radius:8px;background:#008124;color:white}.resolved-notice{padding:17px;background:#edf8f0;color:#21633a;font-size:12px;line-height:1.5;border-radius:10px}.resolved-notice small{display:block;margin-top:5px;color:#607789}.search-result mark{background:#ffed9c;color:#263c48;border-radius:2px}.search-hit{outline:2px solid #1972bd;outline-offset:5px;border-radius:8px}.search-result .pill{margin:0 6px 5px 0}.search{width:min(380px,40vw)}

.selection-task-bar{padding:12px 18px;background:#eaf6ee;border-bottom:1px solid #cce6d4;display:grid;gap:9px;flex-shrink:0}.selection-task-bar span{font-size:12px;color:#285c3b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.selection-task-bar button{font-size:11px;padding:9px 12px;justify-self:start}.msg-body::selection,.composer textarea::selection{background:#bbdfef;color:#173c55}

/* Illustrated office objects: depth without changing button names or actions. */
.office-icon{width:28px;height:30px;flex-shrink:0;overflow:visible;vertical-align:middle;filter:drop-shadow(0 2px 1px #102b4318)}
.rail{min-height:0}.rail nav{min-height:0;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:#ffffff55 transparent;padding:3px 0;gap:5px}
.rail-logo,.profile-button{flex-shrink:0}.profile-button{margin-top:12px}
.nav{min-height:61px;height:61px;gap:2px;flex-shrink:0;transition:background .16s ease}
.nav .office-icon{width:35px;height:37px;transition:transform .16s ease;filter:drop-shadow(0 2px 2px #072b4d40)}
.nav span{font-size:9px;font-weight:600;line-height:13px}.nav.active{box-shadow:inset 0 -2px 0 #c9e0d6}
.nav:hover .office-icon,.nav:focus-visible .office-icon{transform:translateY(-2px) rotate(-3deg)}
.icon-button .office-icon{width:25px;height:27px}.search .office-icon{width:23px;height:25px;top:6px;left:9px}
.channel-card .office-icon{width:39px;height:42px}.empty .office-icon{width:54px;height:58px}
.map-tag .office-icon{width:16px;height:18px}
@media(max-width:800px){.nav{height:57px;min-height:57px}.nav .office-icon{width:30px;height:32px}.nav span{font-size:8px}.rail nav{gap:3px}.icon-button{padding:6px}.icon-button .office-icon{width:22px;height:24px}}
@media(prefers-reduced-motion:reduce){.nav:hover .office-icon,.nav:focus-visible .office-icon{transform:none}}


/* Supabase: botón de acceso con Google (única adición al diseño original) */
.google-login{display:inline-flex;align-items:center;justify-content:center;gap:12px;width:100%}.google-login svg{background:#fff;border-radius:50%;padding:2px;width:24px;height:24px}

/* Supabase: burbujas del croquis, caja para escribir/grabar y reproductor de notas de voz */
#map-bubbles{position:absolute;inset:0;pointer-events:none}
.map-bubble{position:absolute;z-index:3;transform:translate(-50%,calc(-100% - 30px));display:flex;align-items:center;gap:6px;max-width:min(240px,32cqw);background:#fff;border:1px solid #d9e6ef;border-radius:14px;padding:6px 10px;box-shadow:0 6px 18px #12324a2e;pointer-events:auto;animation:bubble-in .25s ease-out}
.map-bubble::after{content:'';position:absolute;left:50%;bottom:-7px;width:12px;height:12px;background:#fff;border-right:1px solid #d9e6ef;border-bottom:1px solid #d9e6ef;transform:translateX(-50%) rotate(45deg)}
.map-bubble.voice{background:#eef7f0;border-color:#cfe6d5}.map-bubble.voice::after{background:#eef7f0;border-color:#cfe6d5}
.bubble-text{border:0;background:none;padding:0;text-align:left;font-size:clamp(10px,1.15cqw,13px);line-height:1.3;color:#203b50;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.bubble-text strong{color:#155f9e}
.bubble-play{flex-shrink:0;width:28px;height:28px;border-radius:50%;border:0;background:#008c26;color:#fff;font-size:12px;display:grid;place-items:center;padding:0}
.bubble-play:hover{background:#007a21}
.bubble-composer{display:flex;gap:8px;align-items:center;margin-top:12px}
.bubble-composer input{flex:1;min-width:0;border:1px solid var(--line);border-radius:10px;padding:10px 12px;background:#fff}
.bubble-composer input:focus{outline:none;border-color:#1972bd;box-shadow:0 0 0 3px #1972bd22}
.bubble-composer .recording{background:#b3261e;color:#fff;border-color:#b3261e}
.voice-note{display:flex;align-items:center;gap:8px;margin:6px 0 2px;font-size:12px;color:var(--muted)}
@keyframes bubble-in{from{opacity:0;transform:translate(-50%,calc(-100% - 22px))}to{opacity:1;transform:translate(-50%,calc(-100% - 30px))}}
@media(max-width:800px){.bubble-composer{flex-wrap:wrap}.bubble-composer input{flex-basis:100%}.map-bubble{max-width:60vw}}
@media(prefers-reduced-motion:reduce){.map-bubble{animation:none}}
.map-bubble.below{transform:translate(-50%,30px);animation:none}
.map-bubble.below::after{bottom:auto;top:-7px;transform:translateX(-50%) rotate(225deg)}

/* Supabase: editor de avatar modular (Mi perfil) */
.avatar-editor{display:grid;grid-template-columns:200px minmax(0,1fr);gap:22px;margin:18px 0 22px;padding:18px;background:#fff;border:1px solid var(--line);border-radius:16px}
.avatar-stage{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center}
.avatar-big{width:180px;height:210px;border-radius:18px;background:radial-gradient(circle at 50% 35%,#ffffff 0,#eaf3f9 55%,#d6e6f1 100%);display:grid;place-items:center;box-shadow:inset 0 -10px 24px #1972bd14}
.avatar-big svg{width:150px;height:176px;filter:drop-shadow(0 6px 8px #12324a22)}
.avatar-tabs{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.avatar-tabs .topic.active{background:#1972bd;color:#fff;border-color:#1972bd}
.avatar-choices{display:grid;grid-template-columns:repeat(auto-fill,minmax(84px,1fr));gap:8px}
.avatar-choices.swatches{grid-template-columns:repeat(auto-fill,minmax(92px,1fr))}
.avatar-choice{display:flex;flex-direction:column;align-items:center;gap:4px;padding:6px 4px;border:2px solid transparent;border-radius:12px;background:#f2f6f9;font-size:11px;color:var(--ink)}
.avatar-choice:hover{border-color:#bcd4e6}
.avatar-choice.selected{border-color:var(--green);background:#e6f4ea}
.avatar-choice .mini{width:52px;height:61px;display:block}
.avatar-choice .mini svg{width:100%;height:100%}
.avatar-choice .swatch{width:34px;height:34px;border-radius:50%;box-shadow:inset 0 -4px 8px #0000002e,inset 0 3px 6px #ffffff66,0 1px 3px #0003}
.choice-label{line-height:1.2;text-align:center}
@media(max-width:800px){.avatar-editor{grid-template-columns:1fr;padding:12px}.avatar-big{width:150px;height:176px}.avatar-big svg{width:126px;height:148px}}