@font-face{font-family:Office Arabic;src:url('/assets/arabic-regular.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Office Arabic;src:url('/assets/arabic-semibold.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
:root{color-scheme:dark;--bg:#0b0e11;--surface:#11161b;--raised:#192129;--text:#e8eef2;--muted:#97a6b0;--accent:#2dd4bf;--bright:#5eead4;--deep:#0f766e;--gold:#dba15e;--line:#34434b;font-family:system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;font-size:16px;color:var(--text);background:var(--bg)}
*{box-sizing:border-box}body{margin:0}html[lang=ar]{font-family:Office Arabic,system-ui,sans-serif}button,select{font:inherit}button,a,select{touch-action:manipulation;outline-offset:4px}button:focus-visible,a:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--accent)}button{color:var(--text);background:var(--surface);border:1px solid var(--line);border-radius:6px;min-block-size:44px;padding:8px 14px;cursor:pointer}button:hover{background:var(--raised);border-color:#6a8789}button:disabled{color:var(--muted);cursor:default}button[aria-pressed=true]{background:var(--deep);color:#fff;border-color:var(--accent)}a{color:inherit;text-underline-offset:4px}p{line-height:1.7}h1,h2,h3,p{margin-block-start:0}[hidden]{display:none!important}.visually-hidden{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}.skip{position:absolute;inset-block-start:-100px;inset-inline-start:16px;padding:14px;background:var(--accent);color:var(--bg);z-index:50}.skip:focus{inset-block-start:8px}
.site-header{block-size:64px;display:flex;align-items:center;gap:20px;padding-inline:28px;border-block-end:1px solid #243138;background:var(--bg);position:relative;z-index:10}.brand{display:flex;align-items:center;gap:9px;font-size:22px;font-weight:600;text-decoration:none;direction:ltr}.brand-light{font-weight:400;color:var(--accent)}.brand-mark{inline-size:30px;block-size:32px;display:grid;place-items:center;background:var(--accent);color:var(--bg);font-size:24px;border-radius:3px;position:relative;font-weight:700}.brand-mark span{position:absolute;inset-inline-end:2px;inset-block-end:0;font-size:20px}.header-divider{inline-size:1px;block-size:22px;background:var(--line)}.office-caption{font-size:13px;color:var(--muted)}.preview-label{font-size:10px;padding:5px 9px;border:1px solid #765a39;background:#dba15e10;color:#e9b67d;border-radius:4px}.language-nav{display:flex;align-items:center;gap:8px;margin-inline-start:auto}.language-nav a{display:flex;align-items:center;min-block-size:44px;padding:6px 9px;text-decoration:none;font-size:12px;color:var(--muted)}.language-nav a[aria-current]{color:var(--accent)}
.office-page{overflow:hidden}.office-page .site-header{position:absolute;inset-block-start:0;inset-inline:0;background:#0b0e11e8;border:0}.full-office{position:relative;block-size:100dvh;overflow:hidden;background:#26343a}.office-topbar{position:absolute;inset-block-start:80px;inset-inline:24px;display:flex;align-items:center;justify-content:space-between;gap:16px;z-index:4;pointer-events:none}.feed-status{display:flex;align-items:center;gap:9px;font-size:11px;padding:10px 14px;border:1px solid #2b3a40;background:#11161bed;border-radius:7px;pointer-events:auto}.status-dot{inline-size:6px;block-size:6px;background:var(--muted);border-radius:50%}.feed-status[data-status=live] .status-dot{background:var(--accent);box-shadow:0 0 0 3px #2dd4bf14}#feed-age{color:var(--muted);font-size:10px}.top-actions{display:flex;gap:8px;pointer-events:auto}.top-actions button{font-size:12px;background:#11161bee}.top-actions button span{margin-inline-start:14px}.scene-frame{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;overflow:hidden;overscroll-behavior:contain}.world-wrap{position:relative;flex-shrink:0;direction:ltr}canvas{display:block;image-rendering:auto;max-inline-size:none;touch-action:pan-x pan-y}.world-labels{position:absolute;inset:0;pointer-events:none;direction:ltr;overflow:hidden}.world-label{position:absolute;inset-inline-start:0;inset-block-start:0;display:block;white-space:nowrap;font-size:8px;line-height:1;color:#d9e6e0;letter-spacing:.3px;text-shadow:0 1px #14242a;direction:ltr}.world-label span[dir=rtl]{font-family:Office Arabic,system-ui,sans-serif;letter-spacing:normal}.world-label[data-space=manager]{color:#edc896}.world-label[data-space=department\.welcome]{color:#75dccb}.snore{color:var(--gold);font-weight:600;font-size:12px;font-family:system-ui,sans-serif;line-height:1}.scene-message{position:absolute;inset-block-start:45%;inset-inline:20px;margin-inline:auto;max-inline-size:440px;padding:24px;background:#11161bf5;border:1px solid #42615f;border-radius:10px;text-align:center;z-index:3}.scene-message p{margin:0;font-size:14px}.click-hint{position:absolute;inset-block-end:68px;inset-inline:0;margin:0;text-align:center;font-size:10px;color:var(--muted);pointer-events:none}.office-bottom{position:absolute;inset-block-end:14px;inset-inline:24px;display:flex;align-items:center;gap:12px;z-index:4;pointer-events:none}.view-controls{display:flex;gap:5px;pointer-events:auto;padding:4px;border:1px solid #2a3b42;border-radius:8px;background:#11161be8}.view-controls button{font-size:11px;min-block-size:36px;padding:7px 12px;border-color:transparent;background:transparent}.view-controls button[aria-pressed=true]{background:var(--deep)}.replay-bar{display:flex;align-items:center;gap:10px;pointer-events:auto}.replay-bar>button{font-size:11px;min-block-size:44px;color:var(--bright);border-color:#216c66;background:#10322ee8}.replay-bar label{font-size:11px;background:var(--surface);padding:5px;border-radius:5px}.replay-bar select{background:var(--surface);color:var(--text);font-size:11px;border:1px solid var(--line);padding:8px;border-radius:4px;margin-inline-start:7px;min-block-size:36px}.replay-bar progress{inline-size:70px;block-size:6px;accent-color:var(--accent)}.privacy-link{margin-inline-start:auto;font-size:11px;color:var(--muted);pointer-events:auto}.motion-note{position:absolute;inset-block-end:68px;inset-inline-start:24px;padding:8px 12px;border-radius:5px;background:var(--surface);font-size:11px;color:var(--muted);z-index:4;margin:0;max-inline-size:260px}
.spaces-panel{position:absolute;inset-block-start:134px;inset-inline-end:24px;inline-size:270px;max-block-size:calc(100% - 230px);overflow:auto;background:#11161bfa;border:1px solid var(--line);border-radius:10px;padding:12px;z-index:8;box-shadow:0 16px 50px #0007}.spaces-panel nav{display:grid;gap:4px}.spaces-panel button{text-align:start;font-size:12px;border-color:transparent}.team-panel{position:absolute;inset-inline-end:24px;inset-block:136px 78px;inline-size:340px;max-inline-size:calc(100% - 32px);overflow:auto;padding:18px;background:#11161bfa;border:1px solid var(--line);border-radius:12px;box-shadow:0 16px 50px #0008;z-index:7}.panel-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-block-end:12px}.panel-heading h2{font-size:16px;margin:0;font-weight:600}.panel-heading button{font-size:22px;min-inline-size:44px;line-height:1;background:transparent;border:0}.team-list{display:grid;gap:8px}.teammate{display:flex;align-items:center;gap:10px;padding:12px;border:1px solid #293a41;border-radius:6px;background:var(--raised);min-inline-size:0}.teammate h3{font-size:12px;margin-block-end:4px}.teammate p{font-size:10px;color:var(--muted);margin-block-end:4px}.teammate span:not(.avatar){font-size:10px;color:var(--gold)}.teammate button{margin-inline-start:auto;min-inline-size:44px;border:0;background:transparent;color:var(--accent);font-size:21px}.avatar{display:grid;place-items:center;inline-size:28px;block-size:34px;flex-shrink:0;color:var(--accent);background:#244441;border-radius:3px}.static-team{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-block-start:18px}.static-team button{font-size:11px}.static-description{font-size:11px;color:var(--muted);margin-block:12px 0}.empty-state{padding:20px 0}.empty-state h3{font-size:15px}.empty-state p{font-size:12px;color:var(--muted)}.inspector{position:absolute;inset-block-start:148px;inset-inline-end:24px;inline-size:360px;max-inline-size:calc(100% - 32px);max-block-size:calc(100% - 236px);overflow:auto;padding:24px;background:#111b20fa;border:1px solid #35756d;border-radius:12px;box-shadow:0 20px 80px #000a;z-index:9}.inspector h3{font-size:22px;line-height:1.5;margin-block-end:8px}.inspector p{font-size:13px;color:var(--muted)}.inspector .detail-status{color:var(--accent)}.inspector button{margin-block-start:12px;font-size:12px}.task-list{display:grid;gap:8px;margin-block:18px}.task-card{padding:12px;background:var(--raised);border:1px solid #33494f;border-radius:7px;display:flex;justify-content:space-between;gap:12px;font-size:12px}.task-card span{color:var(--gold);font-variant-numeric:tabular-nums}.inspector .portrait{display:inline-grid;place-items:center;inline-size:48px;block-size:56px;background:#24413e;color:var(--accent);font-size:27px;border-radius:6px;margin-block-end:16px}.prose{max-inline-size:800px;margin-inline:auto;padding:60px 24px}.prose h1{font-size:36px;line-height:1.5;margin-block:24px}.prose p{color:var(--muted);font-size:16px}.site-footer{max-inline-size:800px;margin-inline:auto;padding:24px;display:flex;gap:24px;flex-wrap:wrap;font-size:12px;color:var(--muted)}.site-footer small{flex-basis:100%}.text-mode .scene-frame,.text-mode .click-hint{display:none}.text-mode .team-panel{inset-inline:24px;inline-size:auto}.text-mode .team-list{grid-template-columns:repeat(3,minmax(0,1fr))}.text-mode .static-team{max-inline-size:640px}.no-script-team{position:absolute;inset:70px 24px;overflow:auto;background:var(--bg);padding:24px;z-index:5}
@media(max-width:760px){.site-header{padding-inline:14px;gap:10px;block-size:60px}.brand{font-size:18px;gap:6px}.brand-mark{inline-size:26px;block-size:28px;font-size:21px}.header-divider,.office-caption{display:none}.preview-label{font-size:9px;padding:4px 6px;max-inline-size:110px;line-height:1.5}.language-nav{gap:0}.language-nav a{font-size:11px;padding:4px 6px}.full-office{block-size:100dvh}.office-topbar{inset-inline:12px;inset-block-start:70px;flex-wrap:wrap;gap:8px}.feed-status{font-size:10px;gap:6px;max-inline-size:100%;padding:8px 10px}#feed-age{font-size:9px}.top-actions{inline-size:100%;gap:6px}.top-actions button{font-size:11px;flex:1;min-block-size:42px}.scene-frame{padding:0;overflow:hidden}.click-hint{inset-block-end:120px;font-size:10px}.office-bottom{inset-inline:12px;inset-block-end:12px;flex-wrap:wrap;gap:8px}.view-controls{inline-size:100%;justify-content:space-between}.view-controls button{font-size:10px;padding:7px 9px;min-block-size:44px}.replay-bar>button{min-block-size:44px;font-size:10px}.replay-bar progress{inline-size:40px}.replay-bar label{font-size:10px}.privacy-link{font-size:10px}.spaces-panel{inset-block-start:164px;inset-inline:12px;inline-size:auto;max-block-size:calc(100% - 288px);display:grid}.spaces-panel nav{grid-template-columns:1fr 1fr}.spaces-panel button{font-size:11px}.team-panel{inset-block:165px 118px;inset-inline:12px;inline-size:auto;max-inline-size:none}.inspector{inset-block-start:auto;inset-block-end:112px;inset-inline:12px;inline-size:auto;max-inline-size:none;max-block-size:calc(100% - 285px);padding:20px}.inspector h3{font-size:20px}.text-mode .team-panel{inset-inline:12px}.text-mode .team-list{grid-template-columns:1fr}.motion-note{inset-block-end:120px;inset-inline-start:12px;font-size:10px;max-inline-size:220px}.world-label{letter-spacing:0}.prose{padding:32px 18px}.prose h1{font-size:28px}.scene-message{inset-block-start:40%;padding:20px}.scene-message p{font-size:12px}}
@media(max-height:540px){.team-panel,.inspector,.spaces-panel{inset-block:8px;inset-inline:8px;inline-size:auto;max-inline-size:none;max-block-size:none;block-size:auto;z-index:20}.inspector{z-index:22}.spaces-panel{z-index:21}.team-panel .panel-heading{position:sticky;inset-block-start:-18px;background:var(--surface);padding-block:8px;z-index:1}.text-mode .team-panel{inset-inline:8px}}
.task-labels{position:absolute;inset:0;direction:ltr;pointer-events:none}
.task-leaders{position:absolute;inset:0;inline-size:100%;block-size:100%;overflow:visible;pointer-events:none}
.task-leaders line{stroke:#76c9bda6;stroke-width:1;stroke-dasharray:2 3}
.task-label{position:absolute;inset-inline-start:0;inset-block-start:0;inline-size:184px;min-block-size:44px;padding:7px 9px;border:1px solid #537b75;border-radius:7px;background:#102622f5;box-shadow:0 3px 10px #07171552;pointer-events:auto;direction:ltr}
.task-label[data-overview=true]{inline-size:118px;padding:5px 7px}
.task-label:hover,.task-label[aria-expanded=true]{background:#173d35;border-color:var(--bright)}
.task-label-content{display:grid;gap:4px;text-align:start}
.task-label-role{color:#b0c9c2;font-size:10px;line-height:1.3;font-weight:400;overflow-wrap:anywhere}
.task-label-row{display:flex;align-items:baseline;gap:5px;font-size:11px;line-height:1.5}
.task-label-row strong{font-weight:600;min-inline-size:0;overflow-wrap:anywhere}
.task-label-number{color:#8ca9a1;font-size:9px;font-variant-numeric:tabular-nums}
.task-label-duration{color:#edc896;white-space:nowrap;font-size:10px;font-variant-numeric:tabular-nums;margin-inline-start:auto}
.task-label-more{color:var(--bright);font-size:10px;line-height:1.4}
.work-items{list-style:none;padding:0;margin-block:12px 0;display:grid;gap:8px;min-inline-size:0}
.work-items li{padding:8px;border:1px solid #365049;border-radius:5px;background:#112b25;min-inline-size:0}
.work-items .work-ordinal{display:block;color:#acbfb8;font-size:10px;margin-block-end:4px}
.work-line{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:4px 10px;font-size:12px;overflow-wrap:anywhere}
.work-line strong{font-weight:600;min-inline-size:0}
.work-line .work-duration{color:#edc896;font-size:11px;white-space:nowrap;font-variant-numeric:tabular-nums}
.teammate>div{flex:1;min-inline-size:0}.teammate>.avatar,.teammate>button{flex-shrink:0}.teammate{align-items:flex-start}
.teammate .work-line{font-size:11px}.teammate .work-items li{padding:6px}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
@media(forced-colors:active){button,.teammate,.inspector{border:1px solid ButtonText}.status-dot{background:ButtonText}}

.queue-labels{position:absolute;inset:0;pointer-events:none;z-index:3}.queue-label{position:absolute;inset-block-start:0;inset-inline-start:0;pointer-events:auto;font-size:.65rem;padding:.2rem .35rem;border:1px solid var(--teal,#2dd4bf);border-radius:.25rem;background:#132f30;color:#baf7e9;white-space:nowrap;max-inline-size:16rem;text-align:start}.queue-label:focus-visible{outline:2px solid #dba15e;outline-offset:3px}

.task-label-heading{display:flex;align-items:baseline;gap:4px;min-inline-size:0}.task-label-extra{margin-inline-start:auto;color:var(--bright);font-size:9px;white-space:nowrap}.task-label[data-overview=true] .task-label-row{font-size:10px;gap:3px}.task-label[data-overview=true] .task-label-number{display:none}.task-label[data-overview=true] .task-label-duration{font-size:9px}
.courier-control{position:absolute;inset-inline-end:24px;inset-block-end:84px;z-index:5;display:grid;gap:2px;max-inline-size:280px;padding:9px 14px;text-align:start;background:#172f30f5;border-color:#b7905d;box-shadow:0 4px 18px #09171940}.courier-control strong{font-size:11px;color:#edc896}.courier-control span{font-size:11px;color:#d9e6e0;overflow-wrap:anywhere}.courier-control small{font-size:10px;color:var(--muted)}
@media(max-width:760px){.courier-control{inset-inline-end:12px;inset-block-end:150px;max-inline-size:calc(100% - 24px);padding:7px 11px}.courier-control span,.courier-control strong{font-size:10px}.courier-control small{font-size:9px}.text-mode .courier-control{inset-block-end:150px}}



.text-mode .courier-control{display:none}.courier-team-control{grid-column:1/-1;display:grid;gap:3px;text-align:start;border-color:#b7905d}.courier-team-control strong{color:#edc896}.courier-team-control span{font-size:11px}.courier-team-control small{font-size:10px;color:var(--muted)}

.courier-canvas{position:absolute;inset-inline-start:0;inset-block-start:0;z-index:4;cursor:pointer}

/* The illustration uses warm daylight materials; floating controls retain the corporate palette. */
.full-office{background:#e8e4d9}
button{border-radius:12px;transition:background-color .15s,border-color .15s,box-shadow .15s}
.office-page .site-header{inset-block-start:16px;inset-inline:20px;block-size:60px;padding-inline:20px;border-radius:17px;background:#11161bf5;box-shadow:0 6px 24px #3344431a;border:1px solid #ffffff0d;gap:18px}
.brand{font-size:23px;letter-spacing:-.7px}.brand-mark{border-radius:10px;inline-size:34px;block-size:34px}.brand-light{font-weight:500}
.preview-label{border:0;background:#dba15e20;color:#f0c590;border-radius:8px;padding:6px 10px}
.office-topbar{inset-block-start:92px;inset-inline:24px}
.feed-status{border:0;border-radius:12px;padding:11px 14px;box-shadow:0 3px 12px #33444312;background:#11161bed}
.top-actions button{border-color:transparent;border-radius:12px;padding-inline:17px;box-shadow:0 3px 12px #33444312}
.world-label{font-weight:600;letter-spacing:0;color:#334443;text-shadow:none;background:#fffaf0e8;border:1px solid #3344431f;border-radius:6px;padding:4px 6px;box-shadow:0 2px 0 #3344430a}
.world-label[data-space=manager]{color:#6e4b25;background:#f5e4c4}.world-label[data-space=department\.welcome]{color:#0f766e}
.world-label.snore{padding:0;border:0;background:transparent;box-shadow:none;color:#815321;letter-spacing:3px}
.click-hint{margin-inline:auto;color:#445852;background:#fffaf0e8;inline-size:fit-content;max-inline-size:calc(100% - 32px);padding:7px 13px;border-radius:20px;font-size:11px;box-shadow:0 2px 6px #3344430a}
.view-controls{padding:5px;gap:3px;border:0;border-radius:15px;box-shadow:0 4px 16px #3344431a;background:#11161bf5}
.view-controls button{border-radius:10px;min-block-size:40px;padding-inline:15px;font-size:12px}
.replay-bar>button{border-radius:13px;background:#0f766e;border-color:#0f766e;color:#fff;box-shadow:0 4px 16px #3344431a}
.privacy-link{color:#334443;background:#fffaf0c9;padding:9px 12px;border-radius:12px}
.motion-note{border-radius:12px;box-shadow:0 3px 12px #33444312}
.spaces-panel,.team-panel{border-radius:18px;border-color:#ffffff14;box-shadow:0 12px 45px #33444340;background:#11161bfa}
.spaces-panel{padding:14px}.spaces-panel button{padding:10px 12px;border-radius:10px}
.teammate{padding:14px;border-radius:13px;border-color:#ffffff0c;gap:12px}
.teammate h3{font-size:14px}.teammate p{font-size:11px;line-height:1.6}
.avatar{inline-size:42px;block-size:48px;background:#cfdcd0;border-radius:14px;overflow:hidden}.avatar svg{inline-size:100%;block-size:100%;display:block}
.inspector{background:#11161bfa;border-color:#2dd4bf55;border-radius:20px;box-shadow:0 16px 65px #33444344}
.inspector .portrait{inline-size:72px;block-size:80px;border-radius:20px;background:#cfdcd0;overflow:hidden}.portrait svg{display:block;inline-size:100%;block-size:100%}
.task-label{background:#fffaf0f7;color:#334443;border:1px solid #b1bcae;border-radius:11px;padding:9px 11px;box-shadow:0 3px 0 #33444312,0 5px 12px #3344430e}
.task-label:hover,.task-label[aria-expanded=true]{background:#fffdf7;border-color:#0f766e;box-shadow:0 0 0 2px #0f766e22,0 4px 10px #33444312}
.task-label[data-overview=true]{padding:6px 8px;border-radius:10px}
.task-label-role{color:#52665d;font-weight:500}.task-label-row strong{color:#183d37}.task-label-duration,.task-label[data-overview=true] .task-label-duration{color:#6e4b25;background:#f2e3c7;padding:1px 5px;border-radius:5px}
.task-label-number{color:#6c7b6f}.task-label-extra,.task-label-more{color:#0f766e}
.task-leaders line{stroke:#6d9789;stroke-width:1.2;stroke-dasharray:none}
.queue-label{border-radius:9px;border-color:#adc6b2;background:#fffaf0;color:#0f766e;font-size:11px;padding:5px 8px;box-shadow:0 3px 0 #33444312}
.work-items li{border-color:#ffffff12;border-radius:9px;background:#192129;padding:10px}
.courier-control{border-radius:15px;background:#11161bf5;border-color:#dba15e66;box-shadow:0 5px 18px #3344431f;padding:11px 15px}
.courier-control strong{color:#f0c590}.courier-team-control{border-radius:12px}
@media(max-width:760px){
  .office-page .site-header{inset-block-start:10px;inset-inline:10px;block-size:54px;padding-inline:12px;gap:9px;border-radius:14px}
  .brand{font-size:19px;gap:7px}.brand-mark{inline-size:28px;block-size:30px;border-radius:8px}.preview-label{font-size:9px;padding:5px 7px}
  .office-topbar{inset-block-start:76px;inset-inline:12px;gap:8px}.feed-status{padding:8px 11px}.top-actions button{padding-inline:10px;min-block-size:44px;border-radius:11px}
  .view-controls button{font-size:10px;padding-inline:9px;min-block-size:44px}.view-controls{border-radius:13px}.office-bottom{gap:7px}
  .click-hint{font-size:10px;line-height:1.6;padding:5px 10px}.courier-control{padding:8px 12px;border-radius:12px;max-inline-size:240px}
  .world-label{padding:3px 5px;border-radius:5px}.world-label.snore{padding:0}
}
@media(prefers-reduced-motion:reduce){button{transition:none}}

/* The pixel office fills the screen; native controls keep text and touch targets readable. */
#office-canvas{touch-action:none;cursor:grab}
.camera-controls{position:absolute;inset-inline-start:24px;inset-block-end:104px;display:flex;flex-direction:column;gap:6px;z-index:5}
.camera-controls button{inline-size:44px;block-size:44px;padding:0;background:#11161bef;border:1px solid #ffffff20;font-size:24px;box-shadow:0 4px 18px #3344431a}
.camera-controls button:last-child{font-size:22px}
.text-mode .camera-controls{display:none}
.world-label{background:#fffaf0cf;border-color:#a3b6a34d;padding:6px 9px;box-shadow:0 2px 8px #3344430a;font-weight:500}
.world-label.snore{background:none;border:0;letter-spacing:5px}
@media(max-width:760px){.camera-controls{inset-inline-start:12px;inset-block-end:170px}.camera-controls button{inline-size:44px;block-size:44px}.click-hint{max-inline-size:calc(100% - 24px);font-size:9px}}
@media(max-height:540px){.camera-controls{flex-direction:row;inset-block-end:80px}.click-hint{display:none}.courier-control{max-inline-size:220px}}

.office-page .site-header{inset-inline-start:24px;inset-inline-end:auto;inline-size:fit-content;max-inline-size:calc(100% - 48px)}
@media(max-width:760px){.office-page .site-header{inset-inline:10px;inline-size:auto;max-inline-size:none}}

@media(max-height:540px){
  .office-page .site-header{inset-block-start:6px;inset-inline-start:8px;block-size:42px;padding-inline:12px;gap:10px;border-radius:12px}
  .office-page .brand{font-size:18px}.office-page .brand-mark{inline-size:26px;block-size:28px;font-size:20px}
  .office-page .header-divider,.office-page .office-caption{display:none}.office-page .preview-label{padding:4px 7px;font-size:9px}
  .office-topbar{inset-block-start:54px;inset-inline:8px;flex-wrap:nowrap;gap:6px}
  #feed-age{display:none}.feed-status{padding:8px;font-size:10px;flex-shrink:1}
  .top-actions{inline-size:auto;gap:5px}.top-actions button{padding-inline:10px;font-size:10px;min-block-size:44px}
  .office-bottom{inset-inline:8px;inset-block-end:8px;flex-wrap:nowrap;gap:8px}
  .view-controls{inline-size:auto}.view-controls button{padding-inline:9px;font-size:10px;min-block-size:44px}
  .replay-bar>button{font-size:10px}.privacy-link{font-size:10px;padding:8px}
  .camera-controls{inset-inline-start:8px;inset-block-end:76px;flex-direction:row}
  .courier-control{display:none}
}
@media(max-height:540px) and (max-width:540px){
  .office-bottom{flex-wrap:wrap}.view-controls{inline-size:100%}.camera-controls{inset-block-end:130px}
  .site-header .preview-label{display:none}.feed-status{font-size:9px}.top-actions button{font-size:9px;padding-inline:7px}
}

/* Pixel art and restrained, squared Sanad controls share one visual language. */
#office-canvas,.avatar svg,.portrait svg{image-rendering:pixelated}
.office-page button,.office-page .site-header,.office-page .brand-mark,.office-page .preview-label,.office-page .feed-status,.office-page .view-controls,.office-page .privacy-link,.office-page .click-hint,.office-page .motion-note,.office-page .spaces-panel,.office-page .team-panel,.office-page .inspector,.office-page .teammate,.office-page .work-items li,.office-page .avatar,.office-page .portrait{border-radius:3px}
.office-page .site-header,.office-page .feed-status,.office-page .top-actions button,.office-page .view-controls,.office-page .camera-controls button{border:2px solid #36564f;box-shadow:3px 3px 0 #243b432b}
.office-page .brand-mark{box-shadow:3px 3px 0 #20544f}
.office-page .world-label{border-radius:0;border:2px solid #b8c4b5;background:#fffaf0;box-shadow:2px 2px 0 #243b4326}
.office-page .world-label.snore{border:0;background:none;box-shadow:none;font-family:monospace;font-weight:700}
.office-page .inspector,.office-page .team-panel,.office-page .spaces-panel{border-width:2px;box-shadow:5px 5px 0 #243b434d}
.office-page .avatar,.office-page .portrait{background:#adc6b2}
.office-page .courier-control{box-shadow:3px 3px 0 #243b432b}

/* Name text is native, unscaled UI anchored to overhead people. */
.task-labels{z-index:2}
.office-page .person-name{position:absolute;inset-inline-start:0;inset-block-start:0;display:flex;align-items:center;gap:6px;inline-size:max-content;max-inline-size:180px;min-inline-size:44px;block-size:36px;min-block-size:36px;padding:4px 10px;direction:ltr;pointer-events:auto;color:#173d37;background:#fffaf0;border:1px solid #829d8f;border-radius:5px;box-shadow:2px 2px 0 #243b4324;font-size:14px;font-weight:600;line-height:1.5;white-space:nowrap;transition:none}
.person-name-text{overflow:hidden;text-overflow:ellipsis;min-inline-size:0}
.person-status{inline-size:6px;block-size:6px;flex:0 0 6px;background:#8b998f;box-shadow:0 0 0 2px #e3e9dc}
.person-name[data-state=working] .person-status{background:#0f766e}.person-name[data-state=finished] .person-status{background:#b37831}
.office-page .person-name:hover,.office-page .person-name[aria-expanded=true]{background:#163f3a;color:#fffaf0;border-color:#5eead4}
.person-name:focus-visible{outline:3px solid #0f766e;outline-offset:3px}
@media(max-width:760px),(pointer:coarse){.office-page .person-name{block-size:44px;min-block-size:44px}}
