:root{--ux-green:#176b54;--ux-text:#203b32}.ux-office{max-width:1250px;margin:auto}.ux-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:4px 0 24px}.ux-eyebrow{font-size:10px;letter-spacing:2px;color:var(--brand-muted)}.ux-heading h1{font-size:30px;line-height:1.3;letter-spacing:-.8px;margin:9px 0;color:var(--ux-text)}.ux-heading p{font-size:14px;color:var(--brand-muted)}.ux-map-btn{display:flex;gap:8px;align-items:center;border:1px solid var(--brand-line);background:white;border-radius:11px;padding:12px 16px;font-size:12px;color:var(--brand-muted);min-height:46px}.ux-map-btn svg{width:18px;height:18px}.ux-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.ux-kpis>button{display:flex;align-items:center;gap:12px;padding:19px;background:#fff;border:1px solid var(--brand-line);border-radius:15px;text-align:left;min-height:90px}.ux-kpis strong{font-size:28px;color:var(--brand-ink)}.ux-kpis>button>span:last-of-type{font-size:12px;color:var(--brand-muted);flex:1}.ux-kpis>button>svg{width:14px;height:14px;color:var(--brand-muted)}.ux-kpi-icon{display:grid;place-items:center;width:43px;height:43px;border-radius:12px}.ux-kpi-icon svg{width:21px;height:21px}.ux-kpi-icon.gold{background:#fff3d9;color:#b08a3f}.ux-kpi-icon.green{background:var(--brand-soft);color:var(--brand-muted)}.ux-kpi-icon.blue{background:#e8f0fa;color:#6c92b1}.ux-quick{display:flex;gap:12px;margin:18px 0 30px}.ux-quick button{display:flex;align-items:center;justify-content:center;gap:8px;min-height:49px;padding:12px 23px;border-radius:12px;background:var(--brand-soft);border:1px solid var(--brand-line);color:var(--brand-ink);font-size:14px;font-weight:600}.ux-quick button:first-child{background:var(--ux-green);color:white;border-color:var(--ux-green)}.ux-quick svg{width:20px;height:20px}.ux-section-heading,.ux-list-title{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:16px}.ux-section-heading h2,.ux-list-title h2{font-size:18px;color:var(--brand-ink);font-weight:600}.ux-section-heading>span,.ux-list-title>span{font-size:12px;color:var(--brand-muted)}.ux-dept-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:10px;margin-bottom:24px}.ux-dept-grid>button{display:flex;flex-direction:column;align-items:center;gap:7px;padding:14px 8px;border:1px solid var(--brand-line);border-radius:13px;background:#fff;min-height:110px}.ux-dept-grid>button.active{border:2px solid var(--brand-primary);background:var(--brand-tint);padding:13px 7px}.ux-dept-grid>button>span{height:31px;width:31px;border-radius:9px;display:grid;place-items:center}.ux-dept-grid svg{width:18px;height:18px}.ux-dept-grid strong{font-size:12px;color:var(--brand-ink)}.ux-dept-grid small{font-size:11px;color:var(--brand-muted)}.ux-work-layout{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}.ux-stage{overflow:hidden;border:1px solid var(--brand-line);border-radius:19px;background:var(--brand-soft);box-shadow:0 6px 25px #6d303d06}.ux-stage-top{display:flex;align-items:center;justify-content:space-between;padding:16px 18px}.ux-stage-top>span{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--brand-muted)}.ux-stage-top i{width:7px;height:7px;border-radius:50%;background:var(--brand-primary)}.ux-stage-top>button{height:38px;width:38px;border:1px solid var(--brand-line);background:#ffffffb0;border-radius:50%;display:grid;place-items:center;color:var(--brand-muted)}.ux-stage-top svg{width:16px;height:16px}.ux-room-art{height:205px;position:relative;background:linear-gradient(var(--brand-soft) 0 70%,#e1dbc8 70%);overflow:hidden}.ux-window{position:absolute;top:6px;left:11%;width:41%;height:75px;border:6px solid #fcfdf8;border-radius:4px;background:linear-gradient(150deg,#c1e1e1,#e4efe1);box-shadow:0 4px 0 #d5decb;display:flex}.ux-window span{flex:1;border-right:3px solid #fff}.ux-window span:last-child{border:0}.ux-art-plant{position:absolute;right:12%;bottom:51px;font-size:43px;filter:drop-shadow(1px 6px 1px #9dba8d25)}.ux-desk{position:absolute;bottom:29px;width:110px;height:17px;border-radius:4px;background:#cda982;box-shadow:0 4px 0 #b58c68;z-index:2}.ux-desk:before,.ux-desk:after{content:'';position:absolute;top:17px;left:7px;height:25px;width:6px;background:#aa8967}.ux-desk:after{left:auto;right:7px}.ux-work-desk{left:9%}.ux-report-desk{right:8%;width:100px}.ux-desk>span{position:absolute;bottom:18px;left:34px;color:#e6eddc;font-size:20px;background:#50705e;width:44px;height:31px;text-align:center;line-height:31px;border:3px solid #75907b;border-radius:4px}.ux-report-desk>span{background:none;border:0;font-size:30px;left:28px}.ux-desk small{position:absolute;top:5px;left:0;width:100%;text-align:center;font-size:7px;letter-spacing:.6px;color:#fff9e8}.ux-stage-actor{position:absolute;width:74px;height:100px;bottom:36px;left:calc(22% - 37px);z-index:1;transition:none}.ux-stage-actor svg{width:100%;height:100%}.ux-stage-actor.arrived{left:calc(76% - 37px)}.ux-stage-actor.walking{animation:uxWalk 5.5s linear both;z-index:3}.ux-stage-actor.returning{animation:uxWalk 5.5s linear reverse both;z-index:3}.ux-stage-actor.idle{animation:uxIdle 3s ease-in-out infinite}.ux-stage-actor.working{animation:uxIdle .65s ease-in-out infinite}.ux-stage-actor.greeting{animation:uxGreet .6s ease-in-out infinite alternate}.ux-stage-caption{padding:15px 18px;background:#ffffffa8;display:flex;flex-direction:column;gap:5px}.ux-stage-caption strong{font-size:16px;color:var(--brand-ink)}.ux-stage-caption>span{font-size:12px;color:var(--brand-muted)}.ux-stage-actions{display:grid;grid-template-columns:1fr 1.4fr;gap:10px;margin-top:12px}.ux-stage-actions .btn{justify-content:center;min-height:47px;font-size:12px;border-radius:11px}.ux-current{border:1px solid var(--brand-line);border-radius:13px;padding:17px;background:#fff;margin-top:16px;display:flex;flex-direction:column;gap:12px}.ux-current>span{font-size:10px;letter-spacing:.6px;color:var(--brand-muted)}.ux-current>strong{font-size:14px;line-height:1.7;color:var(--brand-ink);font-weight:500}.ux-current .btn{align-self:flex-start;font-size:12px;min-height:45px}.ux-list-title{margin-bottom:12px}.ux-person{border:1px solid var(--brand-line);background:#fff;border-radius:15px;padding:15px;margin-bottom:12px}.ux-person.selected{border-color:var(--brand-primary);box-shadow:0 0 0 2px #6d303d10}.ux-person-main{display:flex;gap:12px;align-items:center;width:100%;text-align:left}.ux-avatar{width:54px;height:54px;border-radius:16px;background:var(--brand-soft);overflow:hidden;display:block;flex-shrink:0}.ux-avatar svg{width:100%;height:100%}.ux-person-main>span:not(.ux-avatar):not(.pill){flex:1;min-width:0}.ux-person-main strong{font-size:14px;line-height:1.5;color:var(--brand-ink);display:block}.ux-person-main small{display:block;font-size:12px;color:var(--brand-muted);line-height:1.6;margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:230px}.ux-person-main .pill{font-size:10px;white-space:nowrap;padding:5px 7px}.ux-person-actions{display:flex;gap:9px;margin-top:15px}.ux-person-actions .btn{flex:1;justify-content:center;min-height:44px;font-size:12px;border-radius:9px}.ux-note{font-size:11px;color:var(--brand-muted);line-height:1.8;margin:22px 0}.ux-bottom-nav{display:none}.ux-map-return{margin-bottom:20px}.ux-map-return p{font-size:12px;line-height:1.7;color:var(--brand-muted);margin-top:12px}@keyframes uxWalk{0%{left:calc(22% - 37px);transform:translateY(0)}15%{transform:translateY(-4px)}30%{transform:translateY(0)}45%{transform:translateY(-4px)}60%{transform:translateY(0)}75%{transform:translateY(-4px)}100%{left:calc(76% - 37px);transform:translateY(0)}}@keyframes uxIdle{50%{transform:translateY(-2px)}}@keyframes uxGreet{to{transform:rotate(-5deg)}}@media(max-width:1100px){.ux-dept-grid{grid-template-columns:repeat(4,1fr)}.ux-work-layout{gap:16px}.ux-kpis>button{padding:14px;gap:8px}.ux-kpis>button>span:last-of-type{font-size:11px}.ux-kpi-icon{width:32px;height:32px}.ux-person-main{flex-wrap:wrap}.ux-person-main .pill{margin-left:66px}.ux-person-main small{max-width:190px}}@media(max-width:760px){html,body{max-width:100%;overflow-x:hidden}.shell{margin-left:0}.main{padding:20px 16px 105px;max-width:100%;min-width:0}.topbar{position:sticky;top:0;z-index:30;height:60px;padding:0 16px}.sidebar:not(.open){transform:translateX(-100%)}.sidebar.open{transform:translateX(0);z-index:65}.mobile-shade.visible{z-index:64}.mobile-menu{display:inline-flex}.topbar .breadcrumb strong{font-size:14px}.topbar .demo-chip{display:none}.ux-heading{align-items:flex-start;gap:8px;flex-wrap:wrap;margin:0 0 20px}.ux-eyebrow{font-size:9px}.ux-heading h1{font-size:27px;margin:8px 0}.ux-heading p{font-size:13px}.ux-map-btn{font-size:11px;padding:10px 12px;min-height:43px}.ux-kpis{gap:8px}.ux-kpis>button{padding:12px 8px;min-height:102px;display:flex;flex-direction:column;align-items:flex-start;gap:5px}.ux-kpi-icon{width:27px;height:27px;border-radius:8px}.ux-kpi-icon svg{width:15px;height:15px}.ux-kpis strong{font-size:25px;line-height:1}.ux-kpis>button>svg{display:none}.ux-kpis>button>span:last-of-type{font-size:10px}.ux-quick{display:grid;grid-template-columns:1.2fr 1fr;gap:9px;margin:14px 0 26px}.ux-quick button{font-size:14px;padding:12px;min-height:49px}.ux-section-heading{margin-bottom:12px}.ux-section-heading h2{font-size:17px}.ux-section-heading>span{font-size:10px}.ux-dept-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin-bottom:20px}.ux-dept-grid>button{padding:12px 4px;gap:6px;min-height:96px}.ux-dept-grid>button.active{padding:11px 3px}.ux-dept-grid strong{font-size:11px;white-space:nowrap}.ux-dept-grid small{font-size:10px}.ux-work-layout{display:flex;flex-direction:column;gap:25px}.ux-stage-column,.ux-staff-list{width:100%;min-width:0}.ux-room-art{height:195px}.ux-person-main{flex-wrap:nowrap;gap:10px}.ux-person-main .pill{margin-left:0;font-size:9px;padding:4px 5px}.ux-person-main strong{font-size:14px}.ux-person-main small{max-width:160px;font-size:11px}.ux-avatar{width:48px;height:48px;border-radius:13px}.ux-person{padding:14px}.ux-person-actions .btn{font-size:12px;min-height:46px}.ux-bottom-nav{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;bottom:0;left:0;right:0;z-index:50;padding:8px 7px calc(9px + env(safe-area-inset-bottom));border-top:1px solid var(--brand-line);background:#fffffff5;backdrop-filter:blur(14px);box-shadow:0 -4px 20px #6d303d07}.ux-bottom-nav>button{display:flex;flex-direction:column;gap:5px;align-items:center;justify-content:center;min-height:48px;font-size:10px;color:var(--brand-muted);border-radius:10px}.ux-bottom-nav svg{width:21px;height:21px}.ux-bottom-nav>button.active{color:var(--brand-primary);background:var(--brand-tint)}.ux-bottom-new svg{background:var(--brand-deep);color:#fff;box-sizing:content-box;padding:9px;border-radius:13px;margin-top:-21px;box-shadow:0 4px 10px #6d303d20}.btn,.icon-btn,select,button.nav-item{min-height:44px}.field input,.field select,.field textarea,input,select,textarea{font-size:16px!important;max-width:100%;box-sizing:border-box}.field label{font-size:13px}.field small{font-size:11px;line-height:1.6}.page-heading{align-items:flex-start;flex-wrap:wrap;gap:12px}.page-heading p{font-size:13px;max-width:none}.page-heading h1{font-size:25px}.page-heading .btn{font-size:13px;padding:11px 15px}.toolbar{display:flex;flex-wrap:wrap}.toolbar select{font-size:14px!important;min-height:46px;flex-basis:calc(50% - 8px)}.task-row{padding:16px 12px;gap:10px}.task-row h3{font-size:14px;line-height:1.6}.task-row .meta{font-size:11px;line-height:1.7}.task-row .pill{font-size:10px}.task-row .status-col{min-width:82px}.task-row .status-col .tiny{font-size:10px}.task-table-wrap,.table-wrap,.real-table{overflow:auto;max-width:100%}.task-table th,.task-table td{font-size:12px}.task-table{min-width:650px}.board{overflow-x:auto}.panel h2,.panel-head h2{font-size:16px}.tiny{font-size:11px}.info-note{font-size:12px;line-height:1.9}.excel-box{padding:16px}.excel-box .flex{flex-wrap:wrap}.excel-box>.btn{width:100%;font-size:14px;justify-content:center}.real-examples{grid-template-columns:1fr}.modal{max-height:94dvh;border-radius:18px 18px 0 0;width:100%;max-width:100%;margin:0}.backdrop{padding:0;align-items:flex-end}.modal-header,.modal-body,.modal-footer{padding:18px}.modal-header h2{font-size:19px}.modal-header p{font-size:12px}.modal-body{overflow:auto;min-height:0}.modal-footer{padding-bottom:calc(18px + env(safe-area-inset-bottom));flex-wrap:wrap;gap:12px}.modal-footer .btn{font-size:13px;min-height:46px}.modal-footer .checkbox-label{font-size:12px}.radio-depts{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.dept-option{font-size:12px;padding:10px 7px;min-height:44px}.form-grid{grid-template-columns:1fr}.drawer{width:100%;max-width:100%;height:100dvh}.drawer-body{padding:18px;overflow-x:hidden}.drawer-header h2{font-size:20px;line-height:1.5}.drawer-tabs{gap:10px;padding:0 14px;display:flex}.drawer-tabs button{font-size:12px;flex:1;min-height:46px}.drawer-footer .btn{font-size:12px;min-height:44px}.drawer-footer{padding-bottom:calc(14px + env(safe-area-inset-bottom))}.detail-grid{grid-template-columns:1fr}.detail-text,.detail-cell p,.document-body,.ai-prose{font-size:14px;line-height:1.9;overflow-wrap:anywhere}.document-body table{display:block;overflow:auto}.result-banner{font-size:12px;line-height:1.8}.review-card h3,.review-grid h3{font-size:16px}.review-card p,.review-grid p{font-size:13px}.settings-card p,.settings-card label{font-size:13px}.settings-card .btn{font-size:13px}.team-employees{grid-template-columns:1fr}.team-employee h3{font-size:17px}.team-employee .btn{font-size:13px}.team-employee p{font-size:13px}.team-department h2{font-size:18px}.workflow-feature p,.workflow-step p{font-size:13px}.workflow-step h3{font-size:14px}.workflow-step{min-width:100%}#toasts{bottom:95px}.toast{font-size:13px}.ux-map-return .btn{width:100%;justify-content:center}.ux-note{font-size:11px}}@media(max-width:360px){.main{padding-left:12px;padding-right:12px}.ux-dept-grid{grid-template-columns:repeat(3,1fr)}.ux-person-main{flex-wrap:wrap}.ux-person-main .pill{margin-left:58px}.ux-person-main small{max-width:190px}.ux-desk{width:95px}.ux-report-desk{width:85px}}@media(prefers-reduced-motion:reduce){.ux-office *{animation:none!important;transition:none!important}}
@media(min-width:701px) and (max-width:760px){.mobile-shade.visible{display:block;position:fixed;inset:0;background:#6d303d60}.sidebar{position:fixed}}
@media(max-width:760px){.ux-bottom-nav button:focus-visible,.ux-dept-grid button:focus-visible,.ux-person button:focus-visible{outline:3px solid var(--brand-primary);outline-offset:2px}}
