:root{--header-height:72px;--rail-width:90px;--panel-width:314px;--color-header:#0e3b2e;--color-workspace:#f0f1f1;--color-accent:#50bc87;--color-nav-selected:#cdd0d1;--control-height:46px;--control-cell-width:44px;--color-control-fill:#e3e5e6;--color-announcement:#c00000;--color-desk-free-border:#50bc87;--color-desk-free-fill:#b3dcc5;--color-desk-taken-border:#5b5b5b;--color-desk-taken-fill:#a5a7a9}*{box-sizing:border-box}body{margin:0;font-family:Arial,sans-serif}.app{grid-template-columns:var(--rail-width) 1fr var(--panel-width);grid-template-rows:var(--header-height) 1fr;grid-template-areas:"header header header""nav workspace panel";min-height:100vh;display:grid}.header{background:var(--color-header);color:#fff;grid-area:header;justify-content:space-between;align-items:center;padding:0 24px 0 32px;display:flex}.header-toggle{border:1px solid var(--color-accent);width:44px;height:44px;color:var(--color-accent);cursor:pointer;background:0 0;border-radius:4px;justify-content:center;align-items:center;padding:0;display:none}.header-text{flex:1}.header-title{margin:0;font-size:24px;font-weight:700}.header-subtitle{color:var(--color-accent);margin:2px 0 0;font-size:16px}.header-home{border:1px solid var(--color-accent);width:44px;height:44px;color:var(--color-accent);cursor:pointer;background:0 0;border-radius:4px;justify-content:center;align-items:center;padding:0;display:flex}.nav{background:#fff;flex-direction:column;grid-area:nav;display:flex;box-shadow:2px 0 4px #00000026}.nav-buildings{cursor:pointer;background:0 0;border:0;flex-direction:column;align-items:center;gap:4px;padding:16px 0;font-family:inherit;font-size:12px;display:flex}.floor{cursor:pointer;background:0 0;border:0;border-left:4px solid #0000;flex-direction:column;align-items:center;padding:10px 0;font-family:inherit;display:flex;position:relative}.floor[aria-current=true]{background:var(--color-nav-selected);border-left:4px solid var(--color-accent)}.floor-number{font-size:28px}.floor-label{font-size:12px;font-weight:700}.floor-badge{background:var(--color-accent);color:#fff;text-align:center;border-radius:8px;min-width:20px;padding:1px 5px;font-size:12px;font-weight:700;position:absolute;top:4px;right:8px}.workspace{background:var(--color-workspace);flex-direction:column;grid-area:workspace;align-items:center;padding:16px 24px 24px;display:flex;position:relative}.announcement{color:var(--color-announcement);align-self:stretch;margin:0 40px 16px 0;font-size:12px;font-style:italic;line-height:1.4}.list-button{color:#333;cursor:pointer;background:#fff;border:0;border-radius:4px;justify-content:center;align-items:center;width:32px;height:32px;padding:0;display:flex;position:absolute;top:16px;right:16px;box-shadow:0 1px 2px #0003}.floor-plan{aspect-ratio:540/975;width:540px;max-width:100%;height:auto}.plan-wall,.plan-door{stroke:#9a9c9e;stroke-width:1.5px}.plan-door{stroke:var(--color-workspace);stroke-width:3px}.plan-room,.plan-furniture,.plan-stairs,.plan-elevator{fill:none;stroke:#b4b6b8;stroke-width:1px}.plan-label{fill:#8a8c8e;font-size:8px}.desk{stroke-width:1px;cursor:pointer}.desk[data-available=true]{stroke:var(--color-desk-free-border);fill:var(--color-desk-free-fill)}.desk[data-available=false]{stroke:var(--color-desk-taken-border);fill:var(--color-desk-taken-fill)}.desk-label{fill:#222;pointer-events:none;font-size:8px}.panel{background:#fff;flex-direction:column;grid-area:panel;gap:16px;padding:24px;display:flex}.panel-heading{margin:0;font-size:18px;font-weight:700}.field{flex-direction:column;gap:6px;display:flex}.field-label{font-size:14px}.control{min-height:var(--control-height);background:var(--color-control-fill);border-radius:4px;display:flex;overflow:hidden}.control select,.control input{background:0 0;border:0;flex:1;min-width:0;padding:0 12px;font-family:inherit;font-size:16px}.control select{appearance:none}.control-cell{width:var(--control-cell-width);color:var(--color-accent);pointer-events:none;background:#fff;border:0;justify-content:center;align-items:center;display:flex;box-shadow:0 1px 2px #0003}button.control-cell{pointer-events:auto;cursor:pointer}.slot{min-height:var(--control-height);background:var(--color-control-fill);cursor:pointer;border:0;border-radius:4px;justify-content:space-between;align-items:center;padding:0 12px;font-family:inherit;font-size:14px;display:flex}.slot[aria-pressed=true]{color:var(--color-accent);background:#fff;box-shadow:0 1px 3px #0000004d}.slot-label,.slot-range{font-weight:700}.radios{flex-direction:column;gap:8px;font-size:14px;display:flex}.radios label{align-items:center;gap:8px;display:flex}.radios input{accent-color:#1a73e8}.nav-building-name{clip:rect(0 0 0 0);width:1px;height:1px;position:absolute;overflow:hidden}.nav-building-list{top:var(--header-height);left:var(--rail-width);z-index:1;background:#fff;margin:0;padding:4px 0;font-size:14px;list-style:none;position:absolute;box-shadow:0 2px 6px #00000040}.nav-building-list [role=option]{white-space:nowrap;cursor:pointer;padding:8px 16px}.nav-building-list [aria-selected=true]{font-weight:700}.date-picker{opacity:0;pointer-events:none;width:1px;height:1px;position:absolute}.notice{border-left:4px solid var(--color-accent);background:#fff;margin:0;padding:12px 20px;font-size:14px;position:fixed;bottom:24px;left:50%;transform:translate(-50%);box-shadow:0 2px 8px #0003}.dialog{background:#fff;flex-direction:column;gap:16px;width:320px;padding:24px;display:flex;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 4px 16px #0000004d}.dialog-title{margin:0;font-size:20px}.dialog-details{grid-template-columns:auto 1fr;gap:8px 16px;margin:0;font-size:14px;display:grid}.dialog-details dt{color:#5b5b5b}.dialog-details dd{margin:0;font-weight:600}.dialog-actions{justify-content:flex-end;gap:8px;display:flex}.dialog-actions button{border:1px solid var(--color-accent);height:40px;font:inherit;cursor:pointer;padding:0 20px}.dialog-primary{background:var(--color-accent);color:#fff}.dialog-secondary{color:var(--color-accent);background:#fff}@media (width<=1100px){.app{grid-template-columns:1fr;grid-template-areas:"header""workspace";position:relative}.header{gap:12px}.header-toggle{display:flex}.nav,.panel{top:var(--header-height);z-index:2;display:none;position:absolute;bottom:0}.nav{width:var(--rail-width);left:0}.panel{width:var(--panel-width);right:0;box-shadow:-2px 0 4px #00000026}.nav[data-open=true],.panel[data-open=true]{display:flex}}