.office-welcome{background:#fff;border:1px solid var(--line,#ddd);border-radius:18px;padding:24px;margin-bottom:24px}.office-welcome h2{margin:6px 0 10px;font-size:25px;letter-spacing:-.6px}.office-welcome p{color:var(--muted,#666);line-height:1.6;max-width:800px}.office-shortcuts{display:flex;gap:10px;flex-wrap:wrap;margin:16px 0}.office-shortcuts>button,.office-shortcuts>span{padding:9px 13px;border-radius:10px;border:1px solid #e8e3db;background:#faf8f4;font-size:12px}.office-shortcuts input{width:auto}.office-section{margin:28px 0}.office-section h3{font-size:15px;margin:0 0 12px}.office-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(225px,1fr));gap:12px}.office-grid>button{position:relative;text-align:left;background:white;border:1px solid #e6e3dd;border-radius:14px;padding:20px 36px 20px 18px;min-height:110px;color:#222;cursor:pointer}.office-grid>button:hover{border-color:#f7941d;background:#fffcf8}.office-grid strong{display:block;font-size:15px;margin-bottom:8px}.office-grid span{display:block;font-size:12px;color:#777;line-height:1.5}.office-grid b{position:absolute;right:15px;top:20px;color:#d67c11}.office-posts{display:grid;grid-template-columns:repeat(auto-fill,minmax(245px,1fr));gap:18px}.office-post{padding:18px;border:1px solid #ddd;border-radius:15px;text-align:left;background:#fff;overflow:hidden;cursor:pointer}.office-post>img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:10px;margin-bottom:12px}.office-post>strong{display:block;font-size:17px;margin-top:10px}.office-post p{white-space:pre-wrap;line-height:1.5}.office-photo-picker{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:10px;max-height:260px;overflow-y:auto;margin-bottom:20px}.office-photo-picker label{position:relative}.office-photo-picker input{position:absolute;left:6px;top:6px;width:auto}.office-photo-picker img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:9px}@media(max-width:520px){.office-welcome{padding:18px}.office-grid{grid-template-columns:1fr 1fr;gap:9px}.office-grid>button{padding:16px 14px;min-height:125px}.office-grid b{display:none}.office-grid strong{font-size:14px}.office-posts{grid-template-columns:1fr}}

/* Office phone layout: keep the existing cards, routes and icons readable. */
@media screen and (max-width:680px){
 body[data-workspace-page="office"] #topActions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;gap:8px}
 body[data-workspace-page="office"] #topActions>.btn{min-width:0;min-height:44px;margin:0;padding:10px 8px;justify-content:center}
 body[data-workspace-page="office"] #topActions>.btn:last-child:nth-child(odd){grid-column:1/-1}
 body[data-workspace-page="office"] .office-welcome{padding:16px;margin-bottom:18px;min-width:0}
 body[data-workspace-page="office"] .office-welcome h2{font-size:22px;line-height:1.25;overflow-wrap:anywhere}
 body[data-workspace-page="office"] .office-welcome p{font-size:13px;line-height:1.5;margin:8px 0}
 body[data-workspace-page="office"] .office-shortcuts{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;margin:14px 0 0}
 body[data-workspace-page="office"] .office-shortcuts>button{min-width:0;min-height:44px;text-align:left;white-space:normal;overflow-wrap:anywhere;font:inherit;font-size:13px}
 body[data-workspace-page="office"] .office-section{margin:22px 0}
 body[data-workspace-page="office"] .office-section>h3{font-size:14px;line-height:1.4;margin-bottom:10px}
 body[data-workspace-page="office"] .office-grid{grid-template-columns:minmax(0,1fr);gap:8px}
 body[data-workspace-page="office"] .office-grid>button{min-width:0;min-height:76px;padding:14px 38px 14px 15px;font:inherit;white-space:normal;overflow-wrap:anywhere}
 body[data-workspace-page="office"] .office-grid strong{font-size:14px;line-height:1.4;margin-bottom:4px}
 body[data-workspace-page="office"] .office-grid span{font-size:12px;line-height:1.45}
 body[data-workspace-page="office"] .office-grid b{display:block;right:15px;top:50%;transform:translateY(-50%)}
 body[data-workspace-page="office"] .office-grid>button:focus-visible,body[data-workspace-page="office"] .office-shortcuts>button:focus-visible{outline:2px solid var(--ws-accent,#439d8a);outline-offset:2px}
}

/* Approved Office-only visual polish for human office work. */
body[data-workspace-page="office"] .office-welcome{background:linear-gradient(125deg,#fff8eb,#fff);border-color:#e9d9ba;box-shadow:0 4px 18px #4b351307;padding:22px}
body[data-workspace-page="office"] .office-section{--section-tint:#eef4fb;--section-border:#dce6f1;background:#f8fafc;border:1px solid var(--section-border);border-radius:20px;overflow:hidden;margin:20px 0}
body[data-workspace-page="office"] .office-section:nth-of-type(3n){--section-tint:#f0eaf8;--section-border:#e4d9ef}
body[data-workspace-page="office"] .office-section:nth-of-type(3n + 1){--section-tint:#edf5ee;--section-border:#d9e7db}
body[data-workspace-page="office"] .office-section h3{margin:0;padding:16px 18px;background:var(--section-tint);color:#283344;font-size:15px;border-bottom:1px solid var(--section-border)}
body[data-workspace-page="office"] .office-grid{padding:14px;gap:12px;grid-template-columns:repeat(2,minmax(0,1fr))}
body[data-workspace-page="office"] .office-grid>button{display:flex;align-items:center;gap:14px;min-height:94px;border-radius:15px;border-color:#e1e6eb;padding:16px 34px 16px 16px;box-shadow:0 2px 6px #22334404}
body[data-workspace-page="office"] .office-grid .office-tool-icon{display:flex;align-items:center;justify-content:center;flex:0 0 44px;height:44px;border-radius:13px;background:var(--section-tint);font-size:25px;line-height:1}
body[data-workspace-page="office"] .office-grid .office-tool-copy{min-width:0;flex:1}
body[data-workspace-page="office"] .office-grid strong{margin:0 0 5px;color:#263345;line-height:1.35}
body[data-workspace-page="office"] .office-grid .office-tool-copy>span{color:#607084;font-size:12px;line-height:1.5}
body[data-workspace-page="office"] .office-grid b{top:50%;transform:translateY(-50%);color:#77869a}
body[data-workspace-page="office"] .office-grid>button:focus-visible{outline:3px solid #b194d1;outline-offset:2px}
@media(max-width:620px){body[data-workspace-page="office"] .office-grid{grid-template-columns:1fr;padding:12px}body[data-workspace-page="office"] .office-grid>button{min-height:86px;padding:14px}body[data-workspace-page="office"] .office-welcome h2{font-size:23px}}

/* Office month preview uses the same compact calendar as the schedule page. */
body[data-workspace-page="office"] .office-month-calendar{width:min(100%,380px);margin:0 0 20px;}
body[data-workspace-page="office"] .office-month-calendar .cal-side-head{padding:14px 16px;gap:12px;font-size:15px;}
body[data-workspace-page="office"] .office-month-calendar .cal-side-body{padding:10px 14px 14px;}
body[data-workspace-page="office"] .office-month-calendar .cal-mini-dow{font-size:12px;}
body[data-workspace-page="office"] .office-month-calendar .cal-mini-day{position:relative;font-size:14px;min-height:38px;aspect-ratio:1;}
body[data-workspace-page="office"] .office-month-calendar .office-outside-month{opacity:.4;}
body[data-workspace-page="office"] .office-month-calendar .office-has-jobs{box-shadow:inset 0 0 0 1px var(--ws-accent,#439d8a);}
body[data-workspace-page="office"] .office-month-calendar .cal-mini-day i{position:absolute;bottom:5px;width:4px;height:4px;border-radius:50%;background:currentColor;}
body[data-workspace-page="office"] .office-month-calendar button:focus-visible{outline:2px solid var(--ws-accent,#439d8a);outline-offset:2px;}

/* Desktop Office overview: place the compact month beside operations. */
@media screen and (min-width:900px){
 body[data-workspace-page="office"] #content{display:grid;grid-template-columns:minmax(260px,320px) minmax(0,1fr);gap:20px;align-items:stretch;}
 body[data-workspace-page="office"] #content>.office-month-calendar{width:100%;margin:0;}
 body[data-workspace-page="office"] #content>.office-welcome{margin:0;min-width:0;display:flex;flex-direction:column;justify-content:center;}
 body[data-workspace-page="office"] #content>.office-welcome .office-shortcuts{margin-top:22px;}
 body[data-workspace-page="office"] #content>.office-section{grid-column:1/-1;margin:0;}
}
