.app-desktop-shell { width: 100vw; min-height: 100dvh; height: 100dvh; overflow: hidden; background: var(--bg); } .app-desktop-stage { position: relative; width: var(--desktop-stage-width, 100vw); min-height: var(--desktop-stage-height, 100dvh); transform: scale(var(--desktop-ui-scale, 1)); transform-origin: top left; } .app { min-height: var(--desktop-stage-height, 100dvh); display: grid; grid-template-columns: 220px minmax(0, 1fr); background: var(--bg); } .boot-state { min-height: var(--desktop-stage-height, 100dvh); display: grid; place-items: center; padding: 24px; background: radial-gradient(circle at top left, rgba(16, 185, 129, 0.16), transparent 24rem), radial-gradient(circle at bottom right, rgba(59, 130, 246, 0.14), transparent 28rem), #f8fafc; } .boot-card { width: min(560px, 100%); padding: 36px; border-radius: 8px; border: 1px solid rgba(148, 163, 184, 0.22); background: rgba(255, 255, 255, 0.88); box-shadow: 0 24px 60px rgba(15, 23, 42, 0.12); display: grid; gap: 14px; } .boot-card h1 { font-size: 28px; } .boot-card p { color: var(--muted); line-height: 1.7; } .boot-badge { display: inline-flex; width: fit-content; min-height: 28px; align-items: center; padding: 0 10px; border-radius: 999px; background: rgba(16, 185, 129, 0.12); color: #059669; font-size: 12px; font-weight: 800; letter-spacing: 0.12em; } .boot-badge-error { background: rgba(239, 68, 68, 0.12); color: #b91c1c; } .boot-action { width: fit-content; min-height: 44px; padding: 0 18px; border: 1px solid transparent; border-radius: 8px; background: #0f172a; color: #fff; font-weight: 700; } .main { min-width: 0; display: grid; grid-template-rows: auto auto minmax(0, 1fr); } .main.overview-main { grid-template-rows: auto minmax(0, 1fr); } .main.workbench-main { grid-template-rows: auto minmax(0, 1fr); } .main.chat-main { height: var(--desktop-stage-height, 100dvh); grid-template-rows: auto minmax(0, 1fr); overflow: hidden; } .main.requests-main, .main.approval-main, .main.policies-main, .main.audit-main, .main.employees-main, .main.settings-main { height: var(--desktop-stage-height, 100dvh); grid-template-rows: auto minmax(0, 1fr); overflow: hidden; } .main.settings-main { grid-template-rows: minmax(0, 1fr); } .main.audit-detail-main { grid-template-rows: minmax(0, 1fr); } .workarea { overflow: auto; padding: 24px; } .workarea.chat-workarea { min-height: 0; overflow: hidden; } .workarea.requests-workarea, .workarea.approval-workarea, .workarea.policies-workarea, .workarea.audit-workarea, .workarea.employees-workarea, .workarea.settings-workarea { min-height: 0; overflow: hidden; padding: 20px 24px; } .workarea.settings-workarea { padding: 0; background: #fff; } @media (max-width: 1180px) { .app { grid-template-columns: 220px minmax(0, 1fr); } } @media (max-width: 760px) { .app { display: block; } .workarea { padding: 18px 16px 28px; } }