.office-page{max-width:none;margin:auto}.office-page .pagehead{margin-bottom:24px}.office-page .pagehead p{max-width:660px}
.office-toolbar{display:flex;align-items:end;flex-wrap:wrap;gap:10px;margin-bottom:12px}.office-toolbar label{flex:1;min-width:min(100%,300px);font-size:12px;color:var(--muted)}.office-toolbar select{width:100%;margin-top:8px}.office-toolbar button{white-space:nowrap;min-height:47px}
.office-create{display:flex;align-items:center;flex-wrap:wrap;gap:7px;margin:4px 0 17px}.office-create span{color:var(--muted);font-size:12px;margin-right:5px}.office-create button{font-size:12px;padding:8px 11px;min-height:34px;display:inline-flex;align-items:center;gap:5px}.office-create svg{width:15px;height:15px}
.office-hint{font-size:12px;color:var(--muted);margin:0 0 16px;line-height:1.45}.office-board{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;align-items:start}
.office-zone{min-width:0;border:1px solid var(--line);border-radius:17px;background:var(--panel);overflow:hidden}.office-zone-heading{height:63px;display:flex;align-items:center;gap:11px;padding:0 20px;border-bottom:1px solid var(--line)}.office-zone-heading h2{font-size:18px;margin:0}.office-zone-heading b{margin-left:auto;font-size:12px;color:var(--muted);font-weight:500}.office-zone-mark{width:9px;height:9px;border-radius:50%;background:var(--ink)}.office-zone[data-office-zone=doing] .office-zone-mark{background:var(--orange)}.office-zone[data-office-zone=waiting] .office-zone-mark{background:var(--green)}
.office-surface{position:relative;min-width:0;background-image:radial-gradient(circle at center,rgba(150,150,150,.18) 1px,transparent 1.1px);background-size:22px 22px;background-position:10px 10px}
.office-note{position:absolute;z-index:1;width:min(225px,calc(100% - 24px));min-height:149px;background:#f5f3ee;color:#191a1b;border:1px solid #d9d6cf;border-radius:5px;box-shadow:0 8px 18px #0003;display:flex;flex-direction:column;overflow:hidden;transform:rotate(-.4deg)}.office-note:nth-child(3n+2){transform:rotate(.5deg)}.office-note:nth-child(3n){transform:rotate(-.8deg)}.office-note:focus-within,.office-note:hover{z-index:3;transform:rotate(0)}.office-note.office-moving{z-index:10;transform:rotate(1deg);box-shadow:0 18px 35px #0008;cursor:grabbing}
.office-note-top{display:flex;justify-content:space-between;align-items:center;padding:7px 10px 0}.office-kind{text-transform:uppercase;letter-spacing:.12em;font-size:9px;font-weight:800;color:#62625d}.office-handle{background:transparent;border:0;color:#666b70;touch-action:none;cursor:grab;min-height:30px;min-width:33px;padding:0;font-size:23px;line-height:1}.office-handle:active{cursor:grabbing}.office-handle:focus-visible,.office-open:focus-visible,.office-remove:focus-visible{outline:2px solid #d45734;outline-offset:2px}
.office-open{display:grid;grid-template-columns:37px minmax(0,1fr);grid-template-rows:auto auto;column-gap:8px;align-items:start;text-align:left;border:0;background:transparent;color:#191a1b;padding:3px 11px 7px;min-height:72px;width:100%;cursor:pointer}.office-open strong{font-size:15px;line-height:1.15;overflow-wrap:anywhere}.office-open small{font-size:11px;line-height:1.3;color:#65625d;margin-top:5px;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.office-logo,.office-symbol{grid-row:1/3;width:35px;height:35px;border-radius:8px;object-fit:contain;background:#e7e5df;display:grid;place-items:center}.office-symbol svg{width:20px;height:20px}.office-note-foot{margin-top:auto;border-top:1px solid #dad7d0;display:flex;align-items:center;gap:5px;padding:5px 8px}.office-note-foot select{flex:1;min-width:0;font-size:10px;min-height:29px;border:0;background:transparent;color:#414345;padding:3px 4px}.office-remove{border:0;background:transparent;color:#65625d;min-width:30px;min-height:29px;font-size:20px;padding:0}.office-remove:hover{color:#9f342a}
.office-team{border-top:3px solid #171819}.office-project{border-top:3px solid #a8c5d7}.office-task{border-top:3px solid #b3caae}.office-order{border-top:3px solid #ded294}.office-idea{border-top:3px solid #c1b0db}
@media(max-width:1120px){.office-board{grid-template-columns:repeat(2,minmax(0,1fr))}.office-zone:last-child{grid-column:1/-1}}
@media(max-width:700px){.office-board{display:block}.office-zone{margin-bottom:14px}.office-zone:last-child{margin-bottom:0}.office-toolbar select{font-size:13px}.office-toolbar button{flex:1}.office-zone-heading{height:54px}.office-surface{background-size:20px 20px}}
html[data-layout=mobile] .office-board{display:block}html[data-layout=mobile] .office-zone{margin-bottom:14px}html[data-layout=mobile] .office-zone:last-child{margin-bottom:0}html[data-layout=mobile] .office-toolbar button{flex:1}
html[data-layout=mobile] .office-note select{font-size:12px;min-height:30px}.team-mockups{margin-top:18px}.team-mockup-row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;border-top:1px solid var(--line);padding:10px 0}.team-mockup-row button{border:0;background:transparent;text-align:left;color:var(--ink);padding:5px 0}.team-mockup-row button svg{width:17px;height:17px;vertical-align:middle;color:var(--orange)}.team-mockup-row small{color:var(--muted)}
/* Cozy atelier: scoped to the project office, with high-contrast paper cards. */
.office-page{--office-lilac:#c1b0eb;--office-paper:#f6f0e4;--office-dark:#171827;--office-dots:#77789925}
.office-hero{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:12px 0 24px}.office-title{display:flex;align-items:center;gap:20px}.office-mascot{width:64px;height:64px;flex-shrink:0;filter:drop-shadow(0 8px 0 #0002);animation:office-bob 5s ease-in-out infinite}.office-title>.office-mascot{width:78px;height:78px}.office-hero .eyebrow{font-size:10px;letter-spacing:.2em;color:var(--muted);margin-bottom:9px}.office-hero h1{font-size:clamp(28px,3.1vw,46px);letter-spacing:-1.6px;line-height:1.1;margin:0 0 9px}.office-hero h1 span{color:var(--orange)}.office-hero p{font-size:14px;color:var(--muted);margin:0;line-height:1.5}.office-hero>button{font-size:12px;display:flex;gap:8px;align-items:center;flex-shrink:0}
.office-toolbar{padding:15px;background:var(--panel);border:1px solid var(--line);border-radius:18px;align-items:end}.office-toolbar>label{flex:1;min-width:200px;max-width:470px}.office-toolbar select{font-size:13px;margin-top:0;padding:11px}.office-toolbar button{min-height:43px}.office-toolbar .office-create{margin:0 0 0 auto;gap:5px}.office-create button{border:1px solid var(--line);border-radius:11px;padding:8px 10px;font-size:11px}
.office-controls{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:5px 0 14px}.office-tabs{display:flex;gap:5px;flex-wrap:wrap}.office-tabs button{background:transparent;border:1px solid transparent;min-height:36px;padding:7px 11px;border-radius:10px;font-size:12px;color:var(--muted)}.office-tabs button[aria-pressed=true]{background:var(--ink);color:var(--bg)}.office-tabs b{font-size:10px;margin-left:7px}.office-search{display:flex;align-items:center;gap:7px;border-bottom:1px solid var(--line);max-width:230px}.office-search input{border:0;background:transparent;padding:8px 0;min-height:36px;font-size:12px}.office-search svg{width:16px}
.office-stage{position:relative;border:1px solid var(--line);border-radius:24px;overflow:hidden;background:var(--office-dark);box-shadow:0 20px 65px #0002}.office-viewport{height:clamp(540px,68dvh,1100px);overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#77708c #161724;cursor:grab;background:radial-gradient(ellipse at 10% 0,#8e70b52a,transparent 40%),radial-gradient(ellipse at 90% 70%,#526b9c25,transparent 50%),#121321}.office-viewport:focus-visible{outline:3px solid var(--orange);outline-offset:-4px}.office-panning{cursor:grabbing;user-select:none}.office-spacer{position:relative;min-width:100%;min-height:100%}.office-page .office-board{position:absolute;left:0;top:0;display:grid;grid-template-columns:repeat(3,704px);gap:16px;width:2160px;padding:16px 8px 90px;transform-origin:0 0;align-items:stretch}.office-page .office-zone{grid-column:auto!important;width:704px;border:1px solid #77708c44;border-radius:18px;background:#ffffff04;overflow:visible;margin:0}.office-page .office-zone-heading{height:96px;padding:0 28px;border-bottom:1px solid #77708c33;gap:14px;color:#eeeafa}.office-zone-heading small{font-size:9px;letter-spacing:.2em;color:#b5aec7}.office-zone-heading h2{font-size:25px;margin-top:7px;letter-spacing:-.5px}.office-zone-heading>b{color:#ddd2f4;font-size:13px;border:1px solid #81709266;padding:7px 11px;border-radius:9px}.office-page .office-zone-mark{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:#c1b0eb22;color:#d7c6fa;font-size:23px}.office-page .office-zone[data-office-zone=doing] .office-zone-mark{background:#ffbc8b22;color:#ffbc8b}.office-page .office-zone[data-office-zone=waiting] .office-zone-mark{background:#98d0bc22;color:#98d0bc}.office-surface{background-image:radial-gradient(circle,var(--office-dots) 1.5px,transparent 1.6px);background-size:24px 24px;min-height:1280px}.office-empty-zone{display:none;position:absolute;top:100px;width:100%;align-items:center;flex-direction:column;gap:25px;color:#b5aec7;font-size:14px;pointer-events:none}.office-is-empty .office-empty-zone{display:flex}.office-empty-zone .office-mascot{width:80px;height:80px;opacity:.65}
.office-page .office-note{width:296px;min-height:210px;border:1px solid #e6deda;border-radius:14px;background:var(--note-paper,#f5efe4);box-shadow:0 5px 0 #0003,0 15px 25px #0003;transform:none;overflow:visible;transition:box-shadow .15s}.office-note::before{content:'';position:absolute;width:50px;height:14px;left:calc(50% - 25px);top:-7px;background:#e9d8afc9;transform:rotate(-3deg);border-left:2px dotted #ae9d7880;border-right:2px dotted #ae9d7880;pointer-events:none}.office-page .office-note:hover,.office-page .office-note:focus-within{transform:none;box-shadow:0 5px 0 #0003,0 20px 40px #0005}.office-page .office-note.office-moving{transform:none;z-index:50;box-shadow:0 20px 50px #0009}.office-note[hidden]{display:none!important}.office-team{--note-paper:#e4dcfa!important}.office-project{--note-paper:#dce9f8!important}.office-task{--note-paper:#e2efde!important}.office-order{--note-paper:#fff0d1!important}.office-idea{--note-paper:#f6dfe8!important}.office-note-top{padding:10px 14px 0}.office-kind{font-size:10px;letter-spacing:.15em;color:#57515f}.office-handle{width:44px;min-height:36px;font-size:27px;background:transparent!important;color:#60596d}.office-page .office-open{grid-template-columns:60px minmax(0,1fr);gap:10px;padding:9px 16px 18px;min-height:121px;border-radius:0;background:transparent!important}.office-open strong{font-size:18px;line-height:1.2;color:#292635}.office-open small{font-size:12px;line-height:1.45;color:#5d5565;-webkit-line-clamp:3}.office-logo,.office-symbol,.office-pixel-logo{grid-column:1;grid-row:1/3;width:56px;height:56px;object-fit:contain;border-radius:9px;background:#ffffff70;padding:4px}.office-pixel-logo{image-rendering:pixelated;image-rendering:crisp-edges}.office-logo[hidden],.office-pixel-logo[hidden]{display:none}.office-symbol{color:#635373;display:grid;place-items:center;border:1px solid #ffffff90}.office-symbol svg{width:28px;height:28px}.office-note-foot{padding:8px 12px;border-color:#7e678526;border-radius:0 0 14px 14px}.office-note-foot select{font-size:12px;min-height:34px;color:#4b4256;max-width:240px;color-scheme:light}.office-note-foot select option{background:#f7f2ec;color:#272330}.office-remove{min-height:34px;min-width:34px;background:transparent!important;color:#665b70}
.office-dock{position:absolute;bottom:16px;left:50%;transform:translateX(-50%);display:flex;gap:4px;align-items:center;border:1px solid #81709266;border-radius:15px;padding:7px;background:#252334f5;color:#eeeafa;box-shadow:0 5px 25px #0005;z-index:60;white-space:nowrap}.office-dock button{border:0;background:transparent;color:inherit;border-radius:9px;min-height:36px;padding:7px 11px;font-size:12px}.office-dock button:hover{background:#ffffff15}.office-dock button[aria-pressed=true]{background:#c7b1ed;color:#252036}.office-dock output{font-variant-numeric:tabular-nums;min-width:47px;text-align:center;font-size:12px}.office-dock i{height:19px;border-left:1px solid #81709266;margin:0 4px}.office-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:12px 2px;font-size:11px;color:var(--muted)}.office-footer button{font-size:11px;min-height:30px;padding:6px 10px}.office-focus{position:fixed;inset:0;z-index:55;background:var(--bg);padding:18px 28px;overflow:auto;display:flex;flex-direction:column}.office-focus .office-hero{padding:0 0 14px}.office-focus .office-hero h1{font-size:30px}.office-focus .office-title>.office-mascot{width:55px;height:55px}.office-focus .office-stage{flex:1;min-height:300px}.office-focus .office-viewport{height:100%;position:absolute;inset:0}.office-focus .office-toolbar{padding:10px}.office-focus .office-footer{padding-bottom:0}
@keyframes office-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
@media(prefers-reduced-motion:reduce){.office-mascot{animation:none}.office-note{transition:none}}
@media(max-width:900px){.office-hero{align-items:flex-start;flex-wrap:wrap}.office-title{gap:12px}.office-title>.office-mascot{width:54px;height:54px}.office-hero h1{font-size:30px}.office-hero p{font-size:12px}.office-toolbar .office-create{margin-left:0;width:100%;flex-wrap:wrap}.office-controls{align-items:flex-start;flex-direction:column;gap:7px}.office-search{max-width:none;width:100%}.office-tabs{gap:2px}.office-tabs button{font-size:11px;padding:6px 8px}.office-viewport{height:65dvh;min-height:460px}.office-dock{max-width:calc(100% - 16px);gap:0;padding:5px;overflow-x:auto;bottom:8px}.office-dock button{padding:7px 9px;min-height:42px}.office-dock i{margin:0 2px}.office-footer>span:nth-child(2){display:none}.office-focus{padding:12px;inset:0;z-index:55}.office-focus .office-hero p,.office-focus .office-hero .eyebrow,.office-focus .office-create{display:none}.office-focus .office-toolbar{padding:8px}.office-focus .office-toolbar label{font-size:10px}.office-focus .office-hero h1{font-size:21px}.office-focus .office-hero{gap:8px}.office-focus .office-title>.office-mascot{width:38px;height:38px}.office-focus .office-hero>button{font-size:10px;padding:8px;min-height:36px}.office-focus .office-viewport{min-height:0}.office-focus .office-footer{font-size:10px}}
html[data-layout=mobile] .office-page .office-board{display:grid;grid-template-columns:repeat(3,704px)}html[data-layout=mobile] .office-page .office-zone{margin:0;grid-column:auto}html[data-layout=mobile] .office-toolbar>button{flex:0 0 auto}html[data-layout=mobile] .office-create button{flex:0 0 auto}
.office-jump{display:flex;gap:8px;align-items:center;font-size:11px}.office-jump select{width:auto;font-size:11px;padding:5px 8px;min-height:34px}.office-focus .office-jump select{min-height:30px}.office-footer>span:nth-child(3){margin-left:auto}
@media(max-width:900px){.office-footer>span:nth-child(3){display:none}.office-jump{font-size:10px}.office-jump select{font-size:11px}}