:root { color-scheme: light; --ink:#17212b; --muted:#657384; --line:#dce2e8; --soft:#f4f6f8; --nav:#182630; --teal:#087f71; --red:#b42318; --amber:#a15c00; --green:#067647; }
* { box-sizing:border-box; }
body { margin:0; font-family:Inter,Segoe UI,Arial,sans-serif; color:var(--ink); background:#f7f8fa; font-size:14px; letter-spacing:0; }
a { color:var(--teal); text-decoration:none; }
a:hover { text-decoration:underline; }
button,input,select,textarea { font:inherit; letter-spacing:0; }
.app { min-height:100vh; display:grid; grid-template-columns:220px minmax(0,1fr); }
.sidebar { background:var(--nav); color:#e9f0f4; padding:20px 14px; position:sticky; top:0; height:100vh; }
.brand { display:flex; align-items:center; gap:10px; padding:4px 8px 22px; font-weight:750; font-size:18px; }
.brand-mark { width:28px; height:28px; display:grid; place-items:center; background:#12a594; color:white; border-radius:6px; font-size:13px; }
.nav-title { color:#90a3b0; font-size:11px; text-transform:uppercase; margin:16px 10px 7px; }
.nav a { color:#d7e1e7; display:flex; align-items:center; min-height:38px; padding:9px 10px; border-radius:6px; margin:2px 0; font-weight:600; }
.nav a:hover,.nav a.active { background:#263b48; color:white; text-decoration:none; }
.nav-group summary { color:#d7e1e7; display:flex; align-items:center; justify-content:space-between; min-height:38px; padding:9px 10px; border-radius:6px; margin:2px 0; font-weight:600; cursor:pointer; list-style:none; }
.nav-group summary::-webkit-details-marker { display:none; }
.nav-group summary::after { content:'›'; color:#90a3b0; transform:rotate(90deg); }
.nav-group:not([open]) summary::after { transform:rotate(0); }
.nav-group summary:hover,.nav-group summary.active { background:#263b48; color:white; }
.nav a.nav-child { min-height:34px; padding-left:25px; font-size:12px; color:#afc0c9; }
.sidebar-user { position:absolute; left:14px; right:14px; bottom:16px; border-top:1px solid #314651; padding-top:14px; }
.sidebar-user strong,.sidebar-user small { display:block; overflow:hidden; text-overflow:ellipsis; }
.sidebar-user small { color:#9fb0ba; margin-top:3px; }
.link-button { border:0; background:none; color:#bed0da; padding:8px 0; cursor:pointer; }
.main { min-width:0; }
.topbar { min-height:64px; background:white; border-bottom:1px solid var(--line); padding:14px 28px; display:flex; justify-content:space-between; align-items:center; }
.topbar h1 { margin:0; font-size:21px; }
.content { padding:24px 28px 40px; max-width:1500px; margin:0 auto; }
.page-head { display:flex; align-items:flex-end; justify-content:space-between; gap:18px; margin-bottom:20px; }
.page-head h2 { margin:0 0 5px; font-size:24px; }
.muted { color:var(--muted); }
.metrics { display:grid; grid-template-columns:repeat(4,minmax(150px,1fr)); gap:12px; margin-bottom:22px; }
.metric { background:white; border:1px solid var(--line); border-radius:7px; padding:16px; }
.metric-label { color:var(--muted); font-size:12px; text-transform:uppercase; }
.metric-value { display:block; font-size:28px; line-height:1.2; margin-top:6px; }
.panel { background:white; border:1px solid var(--line); border-radius:7px; margin-bottom:18px; overflow:hidden; }
.panel-head { padding:15px 18px; border-bottom:1px solid var(--line); display:flex; justify-content:space-between; align-items:center; gap:12px; }
.panel-head h3 { margin:0; font-size:16px; }
.panel-body { padding:18px; }
.toolbar { display:flex; gap:9px; align-items:center; flex-wrap:wrap; }
.toolbar input[type=search] { min-width:280px; }
.field { display:flex; flex-direction:column; gap:6px; min-width:0; }
.field label { font-size:12px; color:#40505d; font-weight:650; }
input,select,textarea { width:100%; min-width:0; max-width:100%; border:1px solid #bfc9d2; border-radius:5px; padding:9px 10px; background:white; color:var(--ink); min-height:38px; }
textarea { min-height:88px; resize:vertical; }
input:focus,select:focus,textarea:focus { outline:2px solid #8ad9ce; outline-offset:1px; border-color:var(--teal); }
.grid-2 { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.grid-3 { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.btn { display:inline-flex; align-items:center; justify-content:center; min-height:38px; max-width:100%; padding:8px 13px; border:1px solid transparent; border-radius:5px; font-weight:700; cursor:pointer; white-space:normal; overflow-wrap:anywhere; text-align:center; }
.btn:hover { text-decoration:none; }
.btn-primary { color:white; background:var(--teal); }
.btn-secondary { color:#283945; background:white; border-color:#bfc9d2; }
.btn-danger { color:var(--red); background:white; border-color:#e8aaa5; }
.btn-small { min-height:32px; padding:5px 9px; font-size:12px; }
.table-wrap { overflow:auto; }
table { width:100%; border-collapse:collapse; }
th,td { text-align:left; padding:11px 14px; border-bottom:1px solid #e6eaee; vertical-align:top; }
th { background:#f8f9fa; color:#52616d; font-size:11px; text-transform:uppercase; white-space:nowrap; }
tbody tr:hover { background:#fafcfc; }
.status { display:inline-flex; align-items:center; padding:3px 7px; border-radius:999px; font-size:11px; font-weight:750; text-transform:capitalize; white-space:nowrap; }
.status-online,.status-allowed,.status-resolved,.status-active { color:var(--green); background:#e8f7f0; }
.status-offline,.status-restricted,.status-critical,.status-blocked { color:var(--red); background:#fff0ef; }
.status-warning,.status-outdated,.status-inactive { color:var(--amber); background:#fff5df; }
.status-unreviewed,.status-retired,.status-info { color:#52616d; background:#edf1f3; }
.flash { border:1px solid #98d8bf; background:#ecf9f3; color:#05603a; padding:11px 14px; border-radius:6px; margin-bottom:16px; }
.errors { border:1px solid #f1b4af; background:#fff1f0; color:#8f1d14; padding:11px 14px; border-radius:6px; margin-bottom:16px; }
.errors ul { margin:0; padding-left:18px; }
.empty { text-align:center; color:var(--muted); padding:34px 18px; }
.pagination { display:flex; flex-wrap:wrap; gap:6px; padding:14px 18px; align-items:center; }
.pagination a,.pagination span { border:1px solid var(--line); padding:6px 9px; border-radius:4px; }
.pagination .current { background:var(--nav); color:white; }
.details { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:0; }
.detail { min-width:0; overflow-wrap:anywhere; padding:13px 16px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); min-height:72px; }
.detail small { display:block; color:var(--muted); margin-bottom:5px; }
.path { max-width:350px; word-break:break-all; font-size:12px; color:#52616d; }
.tabs { display:flex; gap:2px; border-bottom:1px solid var(--line); padding:0 18px; overflow:auto; }
.tab { flex:none; border:0; border-bottom:3px solid transparent; background:none; padding:12px 13px 10px; cursor:pointer; font-weight:650; color:#596874; }
.tab.active { color:var(--teal); border-color:var(--teal); }
.tab-panel { display:none; }
.tab-panel.active { display:block; }
.auth-page { min-height:100vh; display:grid; place-items:center; background:#eef2f4; padding:20px; }
.auth-box { width:min(420px,100%); background:white; border:1px solid var(--line); border-radius:7px; padding:28px; }
.auth-box h1 { margin:0 0 8px; font-size:25px; }
.auth-box .field { margin-top:14px; }
.auth-box .btn { width:100%; margin-top:18px; }
.check { display:flex; flex-direction:row; align-items:center; gap:8px; }
.check input { width:auto; min-height:auto; }
.report-row { display:grid; grid-template-columns:minmax(220px,1fr) 90px auto; align-items:center; gap:14px; padding:15px 18px; border-bottom:1px solid var(--line); }
.report-actions { display:flex; gap:6px; }
.notice-panel { display:grid; grid-template-columns:44px minmax(0,1fr); gap:14px; background:#eef8f6; border:1px solid #b7e3dc; border-radius:7px; padding:16px; margin-bottom:20px; }
.notice-panel h2 { margin:0 0 6px; font-size:18px; }
.notice-panel p { margin:0 0 10px; color:#40505d; }
.notice-icon,.assignment-icon { width:36px; height:36px; display:grid; place-items:center; border-radius:6px; background:#d6f1ed; color:#076f63; font-weight:800; font-size:11px; }
.notice-steps { margin:12px 0; }
.notice-steps ul { margin:8px 0 0; padding-left:18px; color:#40505d; }
.notice-steps li { margin:4px 0; }
.project-panel { overflow:visible; }
.project-tabs { display:flex; gap:2px; padding:0 16px; border-bottom:1px solid var(--line); }
.project-tabs button { border:0; border-bottom:3px solid transparent; background:none; padding:13px 12px 10px; cursor:pointer; font-weight:700; color:#52616d; }
.project-tabs button.active { color:var(--teal); border-color:var(--teal); }
.project-filters { display:grid; grid-template-columns:minmax(220px,1.4fr) repeat(3,minmax(150px,1fr)) auto auto auto; gap:12px; padding:16px; align-items:end; }
.project-table td:first-child,.project-table th:first-child { width:42px; }
.project-actions { white-space:nowrap; }
.project-actions a { display:inline-flex; align-items:center; justify-content:center; min-width:24px; min-height:24px; margin-right:4px; color:#52616d; font-size:11px; }
.assignment-hero { display:grid; grid-template-columns:44px minmax(0,1fr); gap:14px; padding:18px; }
.assignment-hero h2 { margin:0 0 8px; font-size:19px; }
.assignment-hero p { margin:0 0 10px; color:#40505d; max-width:900px; line-height:1.55; }
.assignment-empty { display:flex; flex-direction:column; align-items:center; gap:10px; }
.assignment-empty span { max-width:540px; }
.budget-empty { display:flex; flex-direction:column; align-items:center; gap:12px; }
.call-filters { display:grid; grid-template-columns:repeat(3,minmax(150px,1fr)) minmax(140px,auto) minmax(180px,1fr) minmax(120px,auto) auto auto; gap:12px; padding:16px; align-items:end; }
.kiosk-hero { background:white; border:1px solid var(--line); border-radius:7px; padding:28px; margin-bottom:18px; }
.kiosk-hero h1 { margin:5px 0 10px; font-size:32px; max-width:720px; }
.kiosk-hero h2 { margin:0; font-size:18px; color:var(--teal); }
.kiosk-hero p { max-width:760px; color:#40505d; line-height:1.6; }
.setup-steps { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; padding:18px; }
.setup-steps article { border:1px solid var(--line); border-radius:7px; padding:16px; }
.setup-steps h3 { margin:12px 0 7px; }
.setup-steps p { color:#40505d; min-height:54px; }
.work-days { display:grid; grid-template-columns:repeat(7,minmax(130px,1fr)); gap:10px; margin-top:14px; }
.work-days > div { border:1px solid var(--line); border-radius:7px; padding:12px; display:flex; flex-direction:column; gap:7px; }
.work-days h3 { margin:0 0 4px; }
.work-days span { color:#40505d; font-size:12px; }
.settings-list { display:grid; gap:10px; padding:18px; }
.settings-list .check { align-items:flex-start; }
.admin-log-list { display:grid; gap:0; }
.admin-log-list article { padding:15px 18px; border-bottom:1px solid var(--line); }
.admin-log-list article:last-child { border-bottom:0; }
.admin-log-list strong,.admin-log-list span { display:block; }
.admin-log-list span { color:var(--muted); margin-top:5px; font-size:12px; }
.admin-log-list p { margin:8px 0 0; color:#40505d; line-height:1.5; }
.download-body p,.faq-list p { color:#40505d; line-height:1.6; }
.download-actions { display:grid; grid-template-columns:minmax(260px,max-content) auto; gap:8px 12px; align-items:center; margin-bottom:14px; }
.install-key { font-family:Consolas,monospace; font-size:20px; font-weight:800; letter-spacing:1px; padding:14px; border:1px solid var(--line); border-radius:7px; background:#f8fafb; overflow:auto; }
.api-filters { display:grid; grid-template-columns:minmax(260px,1.5fr) repeat(2,minmax(170px,1fr)) auto; gap:12px; padding:16px; align-items:end; }
.quick-links { display:flex; align-items:center; gap:8px; flex-wrap:wrap; padding:0 16px 16px; }
.quick-links a { padding:7px 9px; border:1px solid var(--line); border-radius:5px; color:#40505d; background:#f8fafb; }
.api-code { margin:0; padding:14px 18px; background:#17212b; color:#e9f0f4; overflow:auto; }
.api-endpoints { display:grid; gap:0; }
.api-endpoints article { padding:15px 18px; border-bottom:1px solid var(--line); }
.api-endpoints article:last-child { border-bottom:0; }
.api-endpoints article > div { display:flex; align-items:center; gap:9px; flex-wrap:wrap; }
.api-endpoints code { display:block; margin-top:8px; color:#283945; background:#f4f6f8; border:1px solid var(--line); border-radius:5px; padding:8px; overflow:auto; }
.api-endpoints p { margin:8px 0 10px; color:#40505d; }
.api-method { display:inline-flex; align-items:center; min-height:24px; padding:3px 7px; border-radius:4px; font-size:11px; font-weight:800; }
.method-get { color:#075985; background:#e0f2fe; }
.method-post { color:#067647; background:#e8f7f0; }
.method-patch { color:#8a4b00; background:#fff5df; }
.method-delete { color:#b42318; background:#fff0ef; }
.support-hero { display:grid; grid-template-columns:110px minmax(0,1fr); gap:18px; align-items:center; background:white; border:1px solid var(--line); border-radius:7px; padding:20px; margin-bottom:18px; }
.support-hero img { width:100%; max-height:80px; object-fit:contain; }
.support-hero h2 { margin:0 0 7px; }
.support-hero p { margin:5px 0; color:#40505d; }
.support-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; padding:16px; }
.support-card { display:block; border:1px solid var(--line); border-radius:7px; padding:14px; color:var(--ink); background:#f8fafb; }
.support-card:hover { text-decoration:none; border-color:#9fcfc8; background:#f2fbf9; }
.support-card strong,.support-card span,.support-card small { display:block; }
.support-card span { margin-top:8px; color:var(--teal); font-weight:700; }
.support-card small { margin-top:4px; color:var(--muted); }
.code { font-family:Consolas,monospace; font-size:12px; }
.screen-panel { overflow:visible; }
.screen-stage { position:relative; display:flex; align-items:center; justify-content:center; width:100%; height:min(72vh,56.25vw); min-height:320px; background:#11181d; overflow:hidden; }
.screen-stage img { display:none; position:absolute; inset:0; margin:auto; width:auto; height:auto; max-width:100%; max-height:100%; object-fit:contain; }
.screen-stage img.visible { display:block; }
.screen-empty { display:flex; flex-direction:column; align-items:center; gap:7px; color:#d7e1e7; text-align:center; padding:30px; }
.screen-empty span { color:#93a5b0; }
.screen-loading { position:absolute; right:16px; top:16px; color:white; background:rgba(15,23,28,.82); border:1px solid #52616d; border-radius:5px; padding:8px 10px; }
.screen-status { display:flex; align-items:center; gap:9px; min-height:48px; padding:11px 16px; border-top:1px solid var(--line); background:white; }
.screen-status .muted { margin-left:auto; }
.screen-status-dot { width:8px; height:8px; border-radius:50%; background:var(--green); flex:none; }
.help-intro { background:#18313a; color:white; margin:-24px -28px 24px; padding:30px 28px 34px; }
.help-intro h2 { margin:0 0 7px; font-size:26px; }
.help-intro p { margin:0; color:#cbd9de; }
.help-search { max-width:820px; margin-top:24px; }
.help-search label { display:block; margin-bottom:7px; font-size:12px; font-weight:700; color:#e5eef1; }
.help-search-row { display:grid; grid-template-columns:minmax(0,1fr) auto auto; gap:8px; }
.help-search-row input { min-height:44px; border-color:#93a8b0; }
.help-search-row .btn { min-height:44px; }
.help-layout { display:grid; grid-template-columns:230px minmax(0,1fr); gap:20px; align-items:start; }
.help-categories { background:white; border:1px solid var(--line); border-radius:7px; padding:8px; }
.help-categories h3 { margin:7px 9px 8px; font-size:13px; }
.help-categories a { display:flex; align-items:center; justify-content:space-between; gap:10px; min-height:38px; padding:8px 9px; border-radius:5px; color:#40505d; }
.help-categories a:hover,.help-categories a.active { background:#eaf5f3; color:#076f63; text-decoration:none; }
.help-categories strong { color:var(--muted); font-size:11px; }
.help-results { background:white; border:1px solid var(--line); border-radius:7px; overflow:hidden; }
.help-results-head { min-height:66px; padding:14px 18px; border-bottom:1px solid var(--line); display:flex; align-items:center; }
.help-results-head h3 { margin:0 0 3px; font-size:17px; }
.help-article { border-bottom:1px solid var(--line); }
.help-article:last-child { border-bottom:0; }
.help-article summary { min-height:72px; padding:15px 18px; display:flex; align-items:center; justify-content:space-between; gap:20px; cursor:pointer; list-style:none; }
.help-article summary::-webkit-details-marker { display:none; }
.help-article summary:hover { background:#fafcfc; }
.help-article summary strong { display:block; color:var(--ink); line-height:1.4; }
.help-article summary small { display:block; margin-top:5px; color:var(--muted); }
.help-chevron { width:9px; height:9px; flex:none; border-right:2px solid #71808c; border-bottom:2px solid #71808c; transform:rotate(45deg); transition:transform .15s ease; }
.help-article[open] .help-chevron { transform:rotate(225deg); }
.help-article[open] summary { background:#f7fbfa; }
.help-answer { padding:0 48px 18px 18px; color:#40505d; line-height:1.65; }
.help-answer p { margin:0; max-width:900px; }
.help-empty { padding:48px 24px; text-align:center; }
.help-empty h3 { margin:0 0 7px; }
.help-empty p { margin:0 auto 18px; color:var(--muted); }
.summary-title { align-items:center; }
.summary-refresh { display:flex; align-items:center; gap:9px; color:var(--muted); font-size:12px; font-weight:700; }
.summary-refresh select { width:auto; min-width:130px; }
.summary-filters { display:grid; grid-template-columns:repeat(5,minmax(135px,1fr)) auto auto auto; gap:12px; padding:16px; align-items:end; overflow:visible; }
.summary-filter-note { min-height:38px; display:flex; flex-direction:column; justify-content:center; }
.summary-filter-note span { color:var(--muted); font-size:11px; }
.summary-filter-note strong { margin-top:4px; font-size:12px; white-space:nowrap; }
.summary-tabs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border:1px solid var(--line); border-radius:7px 7px 0 0; overflow:hidden; background:white; }
.summary-tabs a { min-height:62px; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 16px; border-right:1px solid var(--line); color:#40505d; font-weight:650; }
.summary-tabs a:last-child { border-right:0; }
.summary-tabs a:hover,.summary-tabs a.active { background:#eaf5f3; color:#076f63; text-decoration:none; }
.summary-tabs strong { font-size:18px; }
.summary-metrics { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); border:1px solid var(--line); border-top:0; background:white; margin-bottom:18px; }
.summary-metrics div { padding:13px 15px; border-right:1px solid var(--line); }
.summary-metrics div:last-child { border-right:0; }
.summary-metrics span { display:block; color:var(--muted); font-size:11px; }
.summary-metrics strong { display:block; margin-top:5px; font-size:18px; }
.summary-panel { overflow:visible; }
.summary-table-head { flex-wrap:wrap; }
.summary-warning { color:var(--amber); background:#fff5df; border-radius:5px; padding:7px 9px; font-weight:700; font-size:12px; }
.summary-actions { display:flex; gap:7px; align-items:center; margin-left:auto; flex-wrap:wrap; }
.summary-actions input[type=search] { width:210px; min-width:0; }
.summary-format { display:flex; border:1px solid #bfc9d2; border-radius:5px; overflow:hidden; }
.summary-format a { min-height:36px; display:grid; place-items:center; padding:6px 9px; color:#52616d; font-size:12px; }
.summary-format a.active { color:white; background:var(--nav); }
.column-menu { position:relative; }
.column-menu summary { list-style:none; }
.column-menu summary::-webkit-details-marker { display:none; }
.column-menu > div { position:absolute; right:0; top:43px; z-index:5; width:180px; padding:9px; background:white; border:1px solid var(--line); border-radius:6px; box-shadow:0 10px 24px rgba(23,33,43,.14); }
.column-menu label { display:flex; gap:8px; align-items:center; padding:6px; font-size:12px; }
.column-menu input { width:auto; min-height:0; }
.summary-table { min-width:1050px; }
.summary-table td:first-child { min-width:200px; }
.summary-table td small { color:#768591; }
.summary-table tfoot th { background:#eef2f4; color:var(--ink); font-size:12px; }
.percent { display:block; width:56px; height:5px; margin-bottom:5px; background:#e4e9ec; border-radius:3px; overflow:hidden; }
.percent i { display:block; height:100%; background:#11927f; }
.percent.productivity i { background:#2878a8; }
.timeline-filters { display:grid; grid-template-columns:repeat(5,minmax(140px,1fr)) auto; align-items:end; gap:12px; padding:16px; overflow:visible; }
.history-filters { grid-template-columns:minmax(220px,1.5fr) repeat(4,minmax(140px,1fr)) auto; }
.timeline-legend { display:flex; justify-content:flex-end; gap:18px; margin:-3px 0 13px; color:var(--muted); font-size:12px; }
.timeline-legend span { display:flex; align-items:center; gap:6px; }
.timeline-legend i,.status-dot { display:inline-block; width:8px; height:8px; border-radius:50%; background:#8b98a2; }
.timeline-legend i.online,.status-dot.online { background:var(--green); }
.timeline-list { display:grid; gap:10px; }
.timeline-card { display:grid; grid-template-columns:200px minmax(500px,1fr); gap:14px 20px; padding:15px 17px; background:white; border:1px solid var(--line); border-radius:7px; }
.timeline-person { display:flex; align-items:center; gap:10px; }
.timeline-person strong,.timeline-person small { display:block; }
.timeline-person small { color:var(--muted); margin-top:4px; }
.timeline-stats { display:grid; grid-template-columns:repeat(6,minmax(70px,1fr)); gap:8px; }
.timeline-stats div { border-left:1px solid var(--line); padding-left:11px; }
.timeline-stats strong,.timeline-stats span { display:block; }
.timeline-stats span { color:var(--muted); font-size:10px; margin-top:3px; text-transform:uppercase; }
.timeline-track-wrap { grid-column:1/-1; }
.timeline-track { position:relative; height:12px; border-radius:3px; background:repeating-linear-gradient(90deg,#eef1f3 0,#eef1f3 calc(16.666% - 1px),#d5dde2 calc(16.666% - 1px),#d5dde2 16.666%); overflow:hidden; }
.timeline-track i { position:absolute; top:2px; bottom:2px; border-radius:2px; background:#159885; }
.timeline-times { display:flex; justify-content:space-between; color:var(--muted); margin-top:4px; font-size:10px; }
.timeline-empty { padding:12px; background:#f6f8f9; color:var(--muted); text-align:center; border-radius:5px; }
.history-list { display:grid; gap:11px; }
.history-day { margin:0; padding:0; }
.history-day-head { min-height:60px; padding:13px 16px; display:flex; align-items:center; justify-content:space-between; gap:20px; border-bottom:1px solid var(--line); }
.history-day-head > div { display:flex; gap:20px; flex-wrap:wrap; color:var(--muted); font-size:12px; }
.history-day-head b { color:var(--ink); margin-left:4px; }
.history-day .timeline-empty { margin:14px; }
.history-track { padding:18px 16px 12px; }
.history-scale { display:grid; grid-template-columns:repeat(7,1fr); margin-top:6px; color:var(--muted); font-size:10px; }
.history-scale span:last-child { text-align:right; }
.edit-time-context { display:grid; grid-template-columns:minmax(220px,1.4fr) repeat(2,minmax(150px,1fr)) auto; gap:12px; padding:16px; align-items:end; overflow:visible; }
.permission-strip { display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:19px; color:var(--muted); }
.permission-strip strong { color:var(--ink); }
.permission-strip span { padding:5px 8px; border-radius:4px; background:#e8f7f0; color:var(--green); font-size:11px; font-weight:700; }
.permission-strip span::before { content:'✓'; margin-right:5px; }
.time-log-head { align-items:center; }
.time-totals { display:flex; gap:18px; color:var(--muted); }
.time-totals strong { color:var(--ink); margin-left:4px; }
.time-entry-form { display:grid; grid-template-columns:minmax(180px,1.5fr) repeat(5,minmax(120px,1fr)) auto; gap:11px; padding:16px; align-items:end; overflow:visible; }
.time-entry-list { display:grid; gap:10px; }
.time-entry-row { padding:14px; margin:0; overflow:visible; }
.time-entry-row > form { display:grid; grid-template-columns:110px 110px repeat(4,minmax(120px,1fr)) 85px auto; gap:9px; align-items:end; }
.time-entry-duration { min-height:38px; display:flex; flex-direction:column; justify-content:center; }
.time-entry-duration span { color:var(--muted); font-size:10px; margin-top:3px; }
.time-entry-tools { margin-top:12px; padding-top:11px; border-top:1px solid var(--line); display:flex; justify-content:flex-end; gap:8px; }
.time-entry-tools form { display:flex; align-items:center; gap:7px; }
.time-entry-tools label { display:flex; align-items:center; gap:7px; color:var(--muted); font-size:11px; }
.time-entry-tools input { width:108px; min-height:32px; }
.screenshot-filters { display:grid; grid-template-columns:minmax(220px,1.4fr) repeat(3,minmax(145px,1fr)) auto; gap:12px; padding:16px; align-items:end; overflow:visible; }
.screenshot-range { display:flex; gap:7px; align-items:center; flex-wrap:wrap; margin:0 0 15px; }
.screenshot-grid { display:grid; grid-template-columns:repeat(4,minmax(180px,1fr)); gap:12px; }
.screenshot-card { min-width:0; background:white; border:1px solid var(--line); border-radius:7px; overflow:hidden; }
.screenshot-thumb { display:block; width:100%; aspect-ratio:16/9; padding:0; border:0; border-radius:0; background:#11181d; cursor:zoom-in; overflow:hidden; }
.screenshot-thumb img { width:100%; height:100%; display:block; object-fit:contain; }
.screenshot-meta { min-height:58px; padding:10px 11px; display:flex; justify-content:space-between; gap:10px; }
.screenshot-meta div:last-child { text-align:right; }
.screenshot-meta strong,.screenshot-meta span { display:block; }
.screenshot-meta span { color:var(--muted); margin-top:3px; font-size:10px; }
.screenshot-card-foot { min-height:43px; padding:7px 10px; border-top:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; gap:8px; color:var(--muted); font-size:11px; }
.screenshot-empty { grid-column:1/-1; }
.image-dialog { width:min(1200px,94vw); max-height:92vh; padding:0; border:1px solid #71808c; border-radius:7px; background:#11181d; color:white; }
.image-dialog::backdrop { background:rgba(8,14,18,.8); }
.image-dialog img { display:block; width:auto; max-width:100%; max-height:82vh; margin:0 auto; object-fit:contain; }
.image-dialog p { margin:0; padding:11px 45px 11px 14px; }
.image-dialog-close { position:absolute; right:8px; top:8px; width:34px; height:34px; border:1px solid #7f8e97; border-radius:50%; background:rgba(17,24,29,.86); color:white; font-size:21px; cursor:pointer; }
.monitoring-toolbar { padding:13px; }
.monitoring-toolbar form { display:flex; gap:8px; align-items:center; }
.monitoring-toolbar input { max-width:330px; }
.monitoring-toolbar select { max-width:250px; }
.monitoring-list { display:grid; gap:10px; }
.monitoring-row { display:grid; grid-template-columns:210px 180px 100px minmax(280px,1fr) auto; gap:14px; align-items:center; padding:13px; margin:0; }
.monitoring-person { display:flex; align-items:center; gap:9px; }
.monitoring-person strong,.monitoring-person span,.monitoring-state small,.monitoring-activity span { display:block; }
.monitoring-person span,.monitoring-state small,.monitoring-activity span { margin-top:4px; color:var(--muted); font-size:10px; }
.monitoring-state { display:flex; flex-direction:column; align-items:flex-start; }
.monitoring-activity strong { font-size:20px; }
.monitoring-shots { display:grid; grid-template-columns:repeat(3,1fr); gap:6px; }
.monitoring-shots a,.monitoring-placeholder { aspect-ratio:16/9; display:grid; place-items:center; background:#e9edef; overflow:hidden; color:var(--muted); font-size:10px; }
.monitoring-shots img { width:100%; height:100%; object-fit:contain; background:#11181d; }
.live-filter { display:flex; align-items:end; gap:12px; padding:14px; }
.live-filter .field { min-width:220px; }
.live-filter .muted { margin-left:auto; padding-bottom:10px; }
.live-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.live-card { background:white; border:1px solid var(--line); border-radius:7px; overflow:hidden; }
.live-card-head,.live-card-meta,.live-card-actions { padding:11px 13px; display:flex; align-items:center; justify-content:space-between; gap:10px; }
.live-card-head span,.live-card-meta span { color:var(--muted); font-size:11px; }
.live-card-head div > strong,.live-card-head div > span { display:block; }
.live-preview { aspect-ratio:16/9; display:grid; place-items:center; background:#11181d; color:white; text-align:center; }
.live-preview img { width:100%; height:100%; object-fit:contain; }
.live-preview div span { display:block; margin-top:5px; color:#9fb0ba; }
.live-card-meta { border-top:1px solid var(--line); }
.live-card-meta strong { color:var(--ink); margin-left:4px; }
.live-card-actions { justify-content:flex-end; border-top:1px solid var(--line); }
.live-empty { grid-column:1/-1; }
.project-shot-group { overflow:visible; }
.project-shot-strip { display:grid; grid-template-columns:repeat(6,minmax(120px,1fr)); gap:8px; padding:12px; }
.project-shot-strip a { min-width:0; color:var(--ink); }
.project-shot-strip img { width:100%; aspect-ratio:16/9; display:block; object-fit:contain; background:#11181d; }
.project-shot-strip span { display:block; margin-top:5px; font-size:10px; text-align:center; }
.download-filters { display:grid; grid-template-columns:minmax(220px,1.4fr) repeat(3,minmax(145px,1fr)) auto; gap:12px; padding:16px; align-items:end; overflow:visible; }
.download-note { margin-top:-7px; font-size:12px; }
@media (max-width:900px) { .app{grid-template-columns:1fr}.sidebar{position:static;height:auto}.nav{display:flex;overflow:auto}.nav-title,.sidebar-user{display:none}.nav a{white-space:nowrap}.metrics,.details,.grid-3{grid-template-columns:repeat(2,minmax(0,1fr))}.content{padding:18px}.topbar{padding:14px 18px} }
@media (max-width:1200px) { .screenshot-grid{grid-template-columns:repeat(3,minmax(180px,1fr))}.monitoring-row{grid-template-columns:190px 170px 80px minmax(250px,1fr)}.monitoring-row > .btn{grid-column:4}.project-shot-strip{grid-template-columns:repeat(4,minmax(120px,1fr))} }
@media (max-width:1100px) { .summary-filters{grid-template-columns:repeat(4,minmax(135px,1fr))}.summary-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}.summary-metrics div:nth-child(3){border-right:0}.summary-metrics div:nth-child(-n+3){border-bottom:1px solid var(--line)}.timeline-filters,.history-filters{grid-template-columns:repeat(3,minmax(140px,1fr))}.timeline-card{grid-template-columns:180px minmax(500px,1fr)}.time-entry-form{grid-template-columns:repeat(3,minmax(140px,1fr))}.time-entry-row{overflow:auto}.time-entry-row > form{min-width:1000px}.screenshot-filters,.download-filters,.call-filters{grid-template-columns:repeat(3,minmax(145px,1fr))}.monitoring-row{overflow:auto}.live-grid{grid-template-columns:1fr} }
@media (max-width:900px) { .help-intro{margin:-18px -18px 20px;padding:26px 18px 30px}.help-layout{grid-template-columns:1fr}.help-categories{display:flex;overflow:auto}.help-categories h3{display:none}.help-categories a{white-space:nowrap}.help-categories strong{margin-left:6px}.summary-filters{grid-template-columns:repeat(2,minmax(0,1fr))}.summary-actions{width:100%;margin-left:0}.summary-actions input[type=search]{flex:1}.summary-tabs{overflow:auto}.summary-tabs a{min-width:190px}.nav-group{display:flex}.nav-group summary{white-space:nowrap}.timeline-card{display:block;overflow:auto}.timeline-stats{min-width:620px;margin-top:14px}.timeline-track-wrap{min-width:620px;margin-top:15px}.history-day-head{align-items:flex-start;flex-direction:column}.screenshot-grid{grid-template-columns:repeat(2,minmax(160px,1fr))}.monitoring-row{min-width:850px}.project-shot-strip{grid-template-columns:repeat(3,minmax(120px,1fr))} }
@media (max-width:600px) { .metrics,.details,.grid-2,.grid-3{grid-template-columns:1fr}.page-head{align-items:stretch;flex-direction:column}.toolbar input[type=search]{min-width:0}.report-row{grid-template-columns:1fr}.report-actions{flex-wrap:wrap}.screen-stage{min-height:210px}.screen-status{align-items:flex-start;flex-wrap:wrap}.screen-status .muted{margin-left:17px;width:100%}.help-search-row{grid-template-columns:1fr 1fr}.help-search-row input{grid-column:1/-1}.help-article summary{align-items:flex-start}.help-answer{padding-right:18px}.edit-time-context,.time-entry-form,.screenshot-filters,.download-filters,.call-filters{grid-template-columns:1fr}.time-totals{flex-direction:column;gap:5px}.screenshot-grid{grid-template-columns:1fr}.monitoring-toolbar form,.live-filter{align-items:stretch;flex-direction:column}.monitoring-toolbar input,.monitoring-toolbar select,.live-filter .field{max-width:none;width:100%}.live-filter .muted{margin-left:0}.project-shot-strip{grid-template-columns:repeat(2,minmax(100px,1fr))} }

/* Enterprise presentation layer. Existing page and workflow selectors remain intact. */
:root { --ink:#192b3b; --muted:#65778a; --line:#dce4e9; --soft:#f3f6f7; --nav:#102533; --teal:#126d69; --red:#aa3b37; --amber:#926619; --green:#147052; }
html { scroll-behavior:smooth; }
body { font-family:Segoe UI,Arial,sans-serif; background:#f3f6f7; line-height:1.45; }
a,button,input,select,textarea { transition:background-color .16s ease,border-color .16s ease,color .16s ease,box-shadow .16s ease; }
:focus-visible { outline:3px solid #c48d45 !important; outline-offset:2px; }
.skip-link { position:fixed; z-index:100; top:-60px; left:16px; padding:10px 16px; background:white; color:var(--ink); border:2px solid var(--teal); border-radius:6px; }
.skip-link:focus { top:12px; }
.app { grid-template-columns:258px minmax(0,1fr); }
.sidebar { display:flex; flex-direction:column; gap:0; padding:0; background:linear-gradient(180deg,#132d3b 0%,#102633 60%,#0d202d 100%); overflow:hidden; }
.sidebar-heading { display:flex; align-items:center; justify-content:space-between; flex:none; padding:24px 17px 15px; border-bottom:1px solid rgba(255,255,255,.11); }
.brand { padding:0; color:#fff; text-decoration:none; gap:11px; font-size:16px; line-height:1.1; }
.brand:hover { color:#fff; text-decoration:none; }
.brand-mark { width:39px; height:39px; flex:none; background:#d7ac70; color:#142b35; border-radius:8px; font-family:Georgia,serif; font-size:15px; letter-spacing:-.04em; box-shadow:inset 0 0 0 1px rgba(255,255,255,.35); }
.brand-copy strong,.brand-copy small { display:block; }
.brand-copy strong { font-family:Georgia,serif; font-size:17px; letter-spacing:.01em; }
.brand-copy small { color:#b8cbd3; font-size:10px; font-weight:500; letter-spacing:.11em; margin-top:4px; text-transform:uppercase; }
.sidebar > .nav-title { flex:none; margin:17px 20px 8px; }
.nav-title { color:#a6bbc4; font-size:10px; font-weight:750; letter-spacing:.14em; }
.nav { display:block; flex:1; min-height:0; overflow-y:auto; overflow-x:hidden; padding:0 11px 12px; scrollbar-color:#49616e transparent; scrollbar-width:thin; }
.nav a,.nav-group summary { min-height:39px; padding:9px 12px; margin:2px 0; border-radius:6px; color:#cfdae0; font-weight:550; font-size:12px; }
.nav a:hover,.nav a.active,.nav-group summary:hover,.nav-group summary.active { background:#244251; color:#fff; }
.nav a.active,.nav-group summary.active { box-shadow:inset 3px 0 0 #d9ad70; }
.nav a.nav-child { padding-left:24px; color:#bbcbd3; font-size:11px; }
.nav-group summary::after { color:#afc3ca; }
.sidebar-user { position:static; flex:none; margin:0 14px; padding:14px 5px 17px; background:#102633; border-top:1px solid rgba(255,255,255,.15); }
.sidebar-user strong { color:#fff; font-size:12px; }
.sidebar-user small { color:#b2c5ce; font-size:11px; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.sidebar-search { position:relative; flex:none; margin:14px 14px 2px; }
.sidebar-search > .nav-icon { position:absolute; top:12px; left:11px; width:15px; height:15px; color:#9bb3bf; pointer-events:none; }
.sidebar-search input { min-height:39px; padding:9px 11px 9px 34px; border-color:#3c5361; background:#1b3543; color:#f0f5f7; font-size:12px; }
.sidebar-search input::placeholder { color:#abc0cb; }
.sidebar-search input:hover { border-color:#7b94a1; }
.nav-icon { width:18px; height:18px; flex:none; opacity:.85; }
.sidebar-account { display:flex; align-items:center; gap:10px; padding:2px 5px; }
.sidebar-account > div { min-width:0; }
.sidebar-avatar { display:grid; place-items:center; width:34px; height:34px; flex:none; border:1px solid #6f6959; border-radius:9px; color:#e4c195; background:#2e3f46; font-weight:700; }
.sidebar-user .link-button { display:flex; align-items:center; gap:9px; width:100%; margin-top:8px; padding:8px 10px; border-radius:6px; text-align:left; color:#b9cbd4; }
.sidebar-user .link-button:hover { background:#244251; color:white; text-decoration:none; }
.nav-section .nav-title { margin:17px 12px 7px; font-size:9px; line-height:1.5; }
.nav a.nav-link,.nav-group > summary { justify-content:flex-start; gap:10px; min-height:41px; font-size:12px; line-height:1.4; }
.nav-label { flex:1; min-width:0; overflow-wrap:anywhere; }
.nav-count { display:grid; place-items:center; flex:none; min-width:20px; height:19px; padding:0 5px; border:1px solid #425866; border-radius:5px; color:#a9bfcb; font-size:9px; font-weight:600; }
.nav-chevron { width:6px; height:6px; margin:0 2px 0 1px; flex:none; border-right:1.5px solid #8fa9b7; border-bottom:1.5px solid #8fa9b7; transform:rotate(-45deg); }
.nav-group > summary::after { content:none; }
.nav-group[open] > summary .nav-chevron { transform:rotate(45deg); }
.nav-group[open] { margin-bottom:6px; border-radius:7px; background:rgba(255,255,255,.025); }
.nav-children { margin:2px 10px 5px 21px; padding:2px 0 4px 12px; border-left:1px solid #3b5360; list-style:none; }
.nav a.nav-child { position:relative; min-height:34px; padding:8px 9px; margin:2px 0; font-size:11px; line-height:1.45; white-space:normal; }
.nav a.nav-child.active { color:#ffe0b6; background:rgba(217,173,112,.12); box-shadow:none; }
.nav a.nav-child.active::before { content:''; position:absolute; left:-15px; top:15px; width:5px; height:5px; border-radius:50%; background:#d9ad70; }
.nav-group:not([open]) > .nav-children { display:none; }
.nav [hidden] { display:none !important; }
.nav-empty { margin:18px 7px; padding:14px 10px; color:#c3d3dc; border:1px dashed #4b6270; border-radius:6px; font-size:12px; }
.link-button { color:#e4c195; font-size:11px; font-weight:700; }
.link-button:hover { text-decoration:underline; }
.mobile-nav-toggle { display:none; border:1px solid #69818c; background:transparent; color:#fff; border-radius:6px; width:38px; height:38px; cursor:pointer; }
.topbar { min-height:78px; padding:15px 32px; border-bottom:1px solid var(--line); box-shadow:0 2px 12px rgba(15,40,54,.025); }
.topbar-eyebrow,.section-kicker { display:block; margin-bottom:5px; color:#6a7d89; font-size:10px; font-weight:750; text-transform:uppercase; letter-spacing:.14em; }
.topbar h1 { font-family:Georgia,serif; font-size:23px; font-weight:600; letter-spacing:-.02em; line-height:1.1; }
.topbar-actions { display:flex; align-items:center; gap:21px; }
.topbar-link { color:#385264; font-size:12px; font-weight:650; }
.topbar-date { color:#6b7c88; font-size:12px; padding-left:20px; border-left:1px solid var(--line); white-space:nowrap; }
.content { width:100%; max-width:1640px; padding:30px 32px 60px; }
.page-head,.panel-head { flex-wrap:wrap; }
.page-head > *,.panel-head > * { min-width:0; }
.page-head h2,.panel-head h3 { overflow-wrap:anywhere; }
.page-head { margin-bottom:24px; }
.page-head h2 { font-family:Georgia,serif; font-size:27px; font-weight:600; letter-spacing:-.025em; margin-bottom:6px; }
.page-head .muted { line-height:1.55; }
.operations-banner { display:flex; justify-content:space-between; align-items:center; gap:25px; min-height:142px; margin-bottom:17px; padding:24px 27px; color:#f3f6f4; background:linear-gradient(110deg,#173a49,#1d4d55 68%,#2b5b59); border:1px solid #1c4a53; border-radius:10px; box-shadow:0 9px 20px rgba(17,47,59,.09); }
.operations-eyebrow { color:#e0c095; font-size:10px; font-weight:750; letter-spacing:.15em; text-transform:uppercase; }
.operations-banner h3 { margin:7px 0 5px; color:#fff; font-family:Georgia,serif; font-size:24px; font-weight:500; }
.operations-banner p { margin:0; color:#d2e1e2; font-size:12px; }
.operations-actions { display:flex; gap:9px; flex-wrap:wrap; justify-content:flex-end; }
.operations-actions a { display:inline-flex; align-items:center; gap:12px; min-height:38px; padding:8px 12px; border:1px solid #77989c; border-radius:5px; color:#fff; font-size:12px; font-weight:650; white-space:nowrap; }
.operations-actions a:hover { background:#315f65; text-decoration:none; }
.metrics { gap:14px; }
.metric,.panel,.live-card,.screenshot-card,.timeline-card { border-color:var(--line); border-radius:9px; box-shadow:0 3px 12px rgba(25,51,64,.035); }
.metric { min-height:130px; position:relative; padding:19px 20px; border-top:3px solid #82929b; }
.metric-online { border-top-color:#338368; }
.metric-offline { border-top-color:#c99346; }
.metric-alert { border-top-color:#b85951; }
.metric-label { color:#536878; font-size:10px; font-weight:750; letter-spacing:.12em; }
.metric-value { margin-top:6px; color:var(--ink); font-family:Georgia,serif; font-size:33px; font-weight:600; }
.metric-online .metric-value { color:var(--green); }
.metric-alert .metric-value { color:var(--red); }
.metric-caption { display:block; margin-top:5px; color:#748694; font-size:11px; }
a.metric-caption { color:var(--teal); font-weight:700; }
.panel-head { min-height:61px; padding:15px 19px; }
.panel-head h3 { font-family:Georgia,serif; font-size:17px; font-weight:600; }
.panel-head .section-kicker { margin-bottom:2px; }
.panel-body { padding:20px; }
.btn { border-radius:5px; font-size:12px; }
.btn-primary { background:var(--teal); }
.btn-primary:hover { background:#0e5652; color:#fff; }
.btn-secondary:hover { background:#eef5f4; border-color:#83a7a4; color:#164844; }
.btn-danger:hover { background:#fff1ef; }
input,select,textarea { border-color:#c6d1d8; border-radius:5px; }
input:hover,select:hover,textarea:hover { border-color:#8fa6b2; }
th { padding:12px 14px; background:#f5f8f9; color:#586e7b; font-size:10px; letter-spacing:.09em; }
td { padding:14px; color:#304352; font-size:12px; }
tbody tr:hover { background:#f6faf9; }
.status { font-size:10px; letter-spacing:.02em; }
.auth-page { background:radial-gradient(circle at 70% 20%,#e2e9e8 0,#eff3f3 42%,#dfe9e9 100%); }
.auth-box { width:min(440px,100%); padding:36px; border-top:4px solid #d7ac70; border-radius:10px; box-shadow:0 20px 60px rgba(16,45,59,.1); }
.auth-box h1 { font-family:Georgia,serif; font-weight:600; }
.auth-box .brand { color:var(--ink) !important; }
.auth-box .brand-mark { color:#142b35; }
@media (max-width:1200px) { .operations-banner { align-items:flex-start; flex-direction:column; } .operations-actions { justify-content:flex-start; } }
@media (max-width:900px) { .app { display:block; } .sidebar { position:relative; height:auto; overflow:visible; } .sidebar-heading { padding:12px 18px; } .mobile-nav-toggle { display:block; } .sidebar > .nav-title { display:block; margin:12px 18px 5px; } .nav { display:block; max-height:48vh; overflow:auto; padding:0 12px 10px; } .nav-group { display:block; } .sidebar-user { display:block; padding:9px 5px; } .sidebar.mobile-collapsed > .nav-title,.sidebar.mobile-collapsed .nav,.sidebar.mobile-collapsed .sidebar-user { display:none; } .topbar { min-height:70px; padding:14px 18px; } .topbar h1 { font-size:20px; } .content { padding:22px 18px 40px; } }
@media (max-width:900px) { .sidebar-search { margin:12px 18px 2px; } .sidebar.mobile-collapsed .sidebar-search { display:none; } .nav-section .nav-title { margin-top:14px; } }
@media (max-width:650px) { .topbar-link { display:none; } .topbar-date { font-size:11px; padding-left:10px; } .operations-banner { padding:20px; } .operations-banner h3 { font-size:20px; } .operations-actions { width:100%; } .operations-actions a { flex:1; justify-content:space-between; } .panel-head { align-items:stretch; flex-direction:column; } .panel-head .toolbar { width:100%; } .panel-head .toolbar input,.panel-head .toolbar select { flex:1; min-width:0; } .page-head h2 { font-size:24px; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } a,button,input,select,textarea { transition:none; } }

.download-page { min-height:100vh; background:#f3f6f7; }
.download-header { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:16px max(24px,calc((100vw - 1180px)/2)); background:#102633; }
.download-header .brand { padding:0; }
.download-signin { color:#fff; font-size:12px; font-weight:700; }
.download-signin:hover { color:#e4c195; }
.download-content { width:min(1180px,calc(100% - 40px)); margin:0 auto; padding:48px 0 60px; }
.download-intro { max-width:760px; margin-bottom:29px; }
.download-intro h1 { margin:0 0 11px; font:600 clamp(27px,3vw,39px)/1.14 Georgia,serif; letter-spacing:-.025em; }
.download-intro p { margin:0; color:var(--muted); line-height:1.65; }
.download-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.download-card { display:flex; flex-direction:column; min-width:0; padding:25px; background:#fff; border:1px solid var(--line); border-top:4px solid #c8a06a; border-radius:9px; box-shadow:0 5px 17px rgba(25,51,64,.05); }
.download-card-top { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:17px; }
.download-platform { color:#446276; font-size:11px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
.download-card h2 { margin:0 0 8px; font:600 22px/1.25 Georgia,serif; }
.download-card > p { color:#5d7080; line-height:1.6; }
.download-facts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0; margin:9px 0 22px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.download-facts div { min-width:0; padding:11px 5px 11px 0; }
.download-facts div:nth-child(even) { padding-left:12px; border-left:1px solid var(--line); }
.download-facts span,.download-facts strong { display:block; overflow-wrap:anywhere; }
.download-facts span { color:var(--muted); font-size:10px; text-transform:uppercase; letter-spacing:.08em; }
.download-facts strong { margin-top:3px; font-size:12px; }
.download-cta { width:100%; margin-top:auto; }
.download-steps { margin:20px 0 12px; padding-left:20px; color:#435867; font-size:12px; line-height:1.6; }
.download-steps li { margin:0 0 8px; }
.download-steps code,.download-guidance code { overflow-wrap:anywhere; font-size:11px; background:#eef2f4; padding:2px 4px; border-radius:3px; }
.download-hash { margin:0; padding-top:11px; border-top:1px solid var(--line); font-size:10px; }
.download-hash strong,.download-hash code { display:block; overflow-wrap:anywhere; }
.download-hash strong { color:#536c79; margin-bottom:4px; }
.download-release-notes,.download-unavailable { overflow-wrap:anywhere; }
.agent-release-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.agent-release-panel { min-width:0; }
.agent-release-current { display:flex; flex-direction:column; gap:7px; padding:12px; margin-bottom:12px; background:#f5f8f7; border:1px solid var(--line); border-radius:5px; overflow-wrap:anywhere; }
.agent-release-current small { line-height:1.5; }
.agent-release-current code { overflow-wrap:anywhere; }
.agent-release-form { display:flex; flex-direction:column; gap:14px; margin-top:20px; }
.agent-release-form input,.agent-release-form textarea { width:100%; min-width:0; }
.agent-release-form .field small { color:var(--muted); }
.agent-release-form .btn { align-self:flex-start; white-space:normal; text-align:center; }
@media (max-width:1100px) { .agent-release-grid,.download-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:700px) { .agent-release-grid { grid-template-columns:1fr; } }
.download-guidance { margin-top:22px; }
.download-guidance h2 { margin:0 0 15px; font:600 20px Georgia,serif; }
.download-guidance-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.download-guidance h3 { margin:0 0 6px; font-size:13px; }
.download-guidance p { margin:0; color:#5d7080; line-height:1.6; }
@media (max-width:800px) { .download-grid,.download-guidance-grid { grid-template-columns:1fr; } .download-content { padding-top:30px; } }

/* Keep long controls and tables within the content column on narrow screens. */
.project-panel,.timeline-card,.support-hero,.support-grid { min-width:0; }
.support-hero p,.support-card { overflow-wrap:anywhere; }
@media (max-width:900px) {
  .project-filters { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .project-filters > * { min-width:0; }
  .support-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:600px) {
  .project-filters,.timeline-filters,.history-filters { grid-template-columns:minmax(0,1fr); }
  .timeline-legend { justify-content:flex-start; flex-wrap:wrap; }
  .support-hero,.support-grid { grid-template-columns:minmax(0,1fr); }
  .support-hero img { width:auto; max-width:110px; }
}

.leave-form-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:15px; margin-bottom:16px; }
.leave-form-grid > *,.leave-filter > * { min-width:0; }
.leave-form-grid input,.leave-form-grid select,.leave-filter input,.leave-filter select,.leave-note textarea { width:100%; }
.leave-note { margin-bottom:16px; }
.leave-note textarea { min-height:85px; }
.leave-check { display:flex; align-items:center; gap:9px; align-self:end; min-height:39px; color:var(--ink); font-size:12px; }
.leave-check input { width:auto; flex:none; }
.leave-filter { display:flex; align-items:end; flex-wrap:wrap; gap:14px; }
.leave-filter .field { flex:1 1 175px; }
.leave-filter .btn { min-height:39px; }
.leave-employee-picker { margin-bottom:18px; padding-bottom:18px; border-bottom:1px solid var(--line); }
.leave-tabs { display:flex; gap:6px; overflow-x:auto; padding:10px 15px; border-bottom:1px solid var(--line); }
.leave-tabs a { display:inline-flex; align-items:center; gap:8px; flex:none; min-height:37px; padding:8px 12px; color:var(--muted); border-radius:5px; font-size:12px; font-weight:650; white-space:nowrap; }
.leave-tabs a.active,.leave-tabs a:hover { background:#eaf3f1; color:var(--teal); text-decoration:none; }
.leave-tabs strong { display:inline-block; padding:2px 6px; border-radius:12px; background:#e7ecef; color:#435766; font-size:10px; }
.leave-actions form { display:flex; align-items:center; gap:7px; }
.leave-actions select,.leave-actions input { min-width:110px; max-width:155px; }
.leave-subform { border-top:1px solid var(--line); }
.leave-subform h4 { margin:0 0 15px; font-family:Georgia,serif; font-size:16px; }
.leave-export { display:flex; gap:8px; flex-wrap:wrap; }
@media (max-width:900px) { .leave-form-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:600px) { .leave-form-grid { grid-template-columns:minmax(0,1fr); } .leave-filter .field,.leave-filter .btn,.leave-export { flex-basis:100%; } .leave-export .btn { flex:1; } }

/* Account, team, and shift views share the same card and tab spacing. */
.users-page-head h2 span { display:inline-block; margin-left:8px; padding:4px 8px; border:1px solid var(--line); border-radius:999px; vertical-align:middle; color:#526879; background:#fff; font:700 11px/1.3 Segoe UI,Arial,sans-serif; letter-spacing:0; white-space:nowrap; }
.user-filters { display:flex; align-items:end; flex-wrap:wrap; gap:12px; padding:16px 20px; border-bottom:1px solid var(--line); }
.user-filters .field:first-of-type { flex:0 1 250px; }
.user-filters .field:nth-of-type(2) { flex:1 1 260px; max-width:420px; }
.user-filters .btn { flex:none; min-height:38px; }
.btn-quiet { display:inline-flex; align-items:center; justify-content:center; min-height:38px; color:var(--teal); font-weight:650; }
.btn-quiet:hover { text-decoration:underline; }
.user-result-count { padding:12px 20px; border-bottom:1px solid var(--line); color:var(--muted); font-size:12px; }
.user-filters > *,.user-search > *,.user-card > * { min-width:0; }
.user-status-tabs,.shift-view-tabs { display:flex; gap:4px; padding:0 18px; border-bottom:1px solid var(--line); overflow-x:auto; }
.user-status-tabs a,.shift-view-tabs a { display:inline-flex; align-items:center; flex:none; min-height:46px; padding:11px 13px; border-bottom:3px solid transparent; color:#5b6e7c; font-size:12px; font-weight:700; white-space:nowrap; }
.user-status-tabs a:hover,.user-status-tabs a.active,.shift-view-tabs a:hover,.shift-view-tabs a.active { border-bottom-color:var(--teal); color:var(--teal); text-decoration:none; }
.user-search { display:flex; align-items:end; gap:12px; padding:16px 20px; border-bottom:1px solid var(--line); }
.user-search .field { flex:1; max-width:420px; }
.user-search > span { margin:0 0 10px auto; color:var(--muted); font-size:12px; white-space:nowrap; }
.user-list { display:grid; }
.user-card { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:18px 20px; border-bottom:1px solid var(--line); }
.user-card:last-child { border-bottom:0; }
.user-card > div:first-child { display:grid; gap:4px; overflow-wrap:anywhere; }
.user-card > div:first-child > strong { font-size:14px; }
.user-card > div:first-child > span { color:var(--muted); font-size:12px; }
.user-card-identity small { color:var(--muted); font-size:11px; }
.user-badges { display:flex; align-items:center; justify-content:flex-end; gap:7px; flex-wrap:wrap; }
.team-filter { display:flex; align-items:end; justify-content:space-between; flex-wrap:wrap; gap:12px; padding:16px 20px; }
.team-filter-controls { display:flex; align-items:end; flex-wrap:wrap; gap:10px; }
.team-filter-controls .field { min-width:220px; }
.team-filter-controls .btn { min-height:38px; }
.team-filter > .muted { margin-bottom:10px; font-size:12px; }
.team-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.team-grid > * { min-width:0; }
.team-card { margin-bottom:0; }
.team-members { display:flex; flex-wrap:wrap; gap:8px; margin:12px 0 18px; }
.team-members > a { padding:7px 9px; border:1px solid var(--line); border-radius:5px; background:#f7faf9; font-size:12px; overflow-wrap:anywhere; }
.team-members > a:hover { border-color:#8fa6b2; background:#eaf3f1; text-decoration:none; }
.team-settings { display:grid; gap:8px; padding-top:14px; border-top:1px solid var(--line); color:var(--muted); font-size:12px; }
.shift-status { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:18px; color:var(--muted); font-size:12px; }
.shift-days { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:8px; }
.shift-days > strong { display:grid; gap:6px; min-width:0; padding:10px; border:1px solid var(--line); border-radius:5px; background:#f8fafb; font-size:12px; }
.shift-days > strong span { color:var(--muted); font-size:11px; font-weight:500; overflow-wrap:anywhere; }
.shift-meta { display:flex; flex-wrap:wrap; gap:9px 20px; margin-top:17px; padding-top:15px; border-top:1px solid var(--line); color:var(--muted); font-size:12px; }
.shift-meta strong { color:var(--ink); }
.shift-assignment-toolbar,.shift-filter-row { display:flex; align-items:center; flex-wrap:wrap; gap:10px; padding:15px 18px; border-bottom:1px solid var(--line); }
.shift-filter-row > .field { flex:1 1 170px; }
.shift-filter-row > select { width:auto; min-width:180px; }
.shift-filter-row > .muted { margin-left:auto; font-size:12px; }
.reassignment-layout { display:grid; gap:17px; max-width:940px; }
.reassignment-layout > h3,.reassignment-layout h3,.reassignment-layout p { margin:0; }
.reassignment-layout > .status { justify-self:start; }
.reassignment-layout > .btn { justify-self:start; }
.request-person { display:flex; align-items:center; gap:12px; padding:13px; border:1px solid var(--line); border-radius:6px; background:#f8fafb; }
.request-person > span { display:grid; place-items:center; flex:none; width:42px; height:42px; border-radius:50%; background:#e1eeeb; color:var(--teal); font-size:10px; }
.assignment-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.assignment-summary > span { display:grid; gap:4px; padding:12px; border:1px solid var(--line); border-radius:5px; color:var(--muted); font-size:11px; }
.assignment-summary strong { color:var(--ink); font-size:13px; }
.shift-instance-list { display:grid; gap:0; border:1px solid var(--line); border-radius:6px; overflow:hidden; }
.shift-instance-list > div { display:grid; grid-template-columns:120px 1fr 1fr 1.3fr auto; gap:10px; align-items:center; padding:11px 13px; border-bottom:1px solid var(--line); font-size:12px; }
.shift-instance-list > div:last-child { border-bottom:0; }
.shift-instance-list span { color:var(--muted); }
.notice-panel.compact { margin:0; padding:12px; }
.notice-panel.compact p { margin:0; }
.settings-form { display:grid; gap:14px; }
.settings-form > h3 { margin:0; }
.settings-form > .notice-panel { margin:0; }
.api-section { margin-bottom:18px; }
@media (max-width:900px) { .team-grid { grid-template-columns:minmax(0,1fr); } .shift-days { grid-template-columns:repeat(4,minmax(0,1fr)); } .shift-instance-list > div { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:600px) { .user-filters .field:first-of-type,.user-filters .field:nth-of-type(2),.team-filter-controls,.team-filter-controls .field { flex-basis:100%; max-width:none; width:100%; } .user-filters .btn { flex:1; } .team-filter-controls .btn { flex:1; } .user-card { align-items:flex-start; flex-direction:column; } .user-badges { justify-content:flex-start; } .shift-days { grid-template-columns:repeat(2,minmax(0,1fr)); } .shift-filter-row > select,.shift-filter-row > .field { width:100%; } .shift-filter-row > .muted { margin-left:0; } .assignment-summary { grid-template-columns:minmax(0,1fr); } }

/* Shared sizing follows the available content width, including beside the sidebar. */
.content,.download-content { overflow-wrap:anywhere; }
.panel,.panel-body,.panel-head,.toolbar,.metric,.notice-panel > *,.setup-steps > *,
.grid-2 > *,.grid-3 > *,.summary-metrics > *,.api-endpoints > *,
.monitoring-row > *,.live-card > *,.request-person > *,.shift-instance-list > div > * { min-width:0; }
.toolbar > input:not([type=checkbox]):not([type=radio]),.toolbar > select { flex:1 1 160px; width:auto; min-width:140px; }
.toolbar > input[type=search] { flex-basis:240px; }
.panel-head > form.toolbar { flex:1 1 360px; max-width:700px; }
.page-head > form.field { min-width:min(100%,160px); }
.removal-code-row { display:flex; flex-wrap:wrap; align-items:center; gap:12px; }
.removal-code-row .install-key { display:block; flex:1 1 320px; min-width:0; overflow-wrap:anywhere; }
input[type=checkbox],input[type=radio] { flex:none; width:16px; height:16px; min-height:0; padding:0; accent-color:var(--teal); }
.btn:disabled { cursor:not-allowed; opacity:.55; }
.btn-primary:disabled:hover { background:var(--teal); }
.status { max-width:100%; white-space:normal; overflow-wrap:anywhere; }
.project-tabs { overflow-x:auto; }
.project-tabs button { flex:none; }
.project-filters,.call-filters,.api-filters,.summary-filters,.timeline-filters,.history-filters,
.edit-time-context,.time-entry-form,.screenshot-filters,.download-filters {
    grid-template-columns:repeat(auto-fit,minmax(min(100%,170px),1fr));
}
.project-filters > *,.call-filters > *,.api-filters > *,.summary-filters > *,
.timeline-filters > *,.history-filters > *,.edit-time-context > *,
.time-entry-form > *,.screenshot-filters > *,.download-filters > * { min-width:0; }
.call-filters > .check { min-height:38px; }
.work-days { grid-template-columns:repeat(auto-fit,minmax(min(100%,130px),1fr)); }
.setup-steps { grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr)); }
.setup-steps p { min-height:0; }
.metrics { grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr)); }
.metric-value { overflow-wrap:anywhere; }
.field-wide { grid-column:span 2; }
.panel > .auth-box { width:min(440px,calc(100% - 36px)); }
.download-actions { grid-template-columns:minmax(0,max-content) auto; }
.api-endpoints,.api-endpoints code { min-width:0; }
.notice-panel p:last-child { margin-bottom:0; }
.time-entry-row { overflow:visible; }
.time-entry-row > form { min-width:0; grid-template-columns:repeat(auto-fit,minmax(min(100%,140px),1fr)); }
.time-entry-tools,.time-entry-tools form { flex-wrap:wrap; }
.timeline-card { grid-template-columns:minmax(140px,1fr) minmax(0,3fr); }
.timeline-stats { min-width:0; grid-template-columns:repeat(3,minmax(0,1fr)); }
.timeline-stats div { min-width:0; }
.timeline-track-wrap { min-width:0; }
.monitoring-row { min-width:0; overflow:visible; grid-template-columns:repeat(2,minmax(0,1fr)) minmax(70px,.5fr); }
.monitoring-shots { grid-column:1/-1; min-width:0; }
.monitoring-row > .btn { grid-column:1/-1; justify-self:end; }
.monitoring-person > div { min-width:0; }
.status-dot { flex:none; }
.live-preview { overflow:hidden; }
.live-preview img { min-height:0; max-height:100%; }
.live-card-head,.live-card-meta,.live-card-actions,.screenshot-meta,.screenshot-card-foot { flex-wrap:wrap; }
.topbar { gap:16px; }
.topbar-title { min-width:0; overflow-wrap:anywhere; }
.topbar-actions { flex:none; }
.download-header > .brand { min-width:0; }
.download-signin { flex:none; }
@media (min-width:1600px) {
    .monitoring-row { grid-template-columns:minmax(170px,1fr) minmax(160px,1fr) 80px minmax(240px,1.5fr) auto; }
    .monitoring-shots,.monitoring-row > .btn { grid-column:auto; }
    .timeline-stats { grid-template-columns:repeat(6,minmax(0,1fr)); }
}
@media (max-width:900px) {
    .timeline-card { display:grid; grid-template-columns:minmax(0,1fr); overflow:visible; }
    .timeline-stats { margin-top:0; }
    .timeline-track-wrap { margin-top:0; }
    .summary-tabs { display:flex; }
    .summary-tabs a { flex:1 0 190px; }
}
@media (max-width:600px) {
    .content { padding:20px 16px 36px; }
    .help-intro { margin:-20px -16px 20px; padding:24px 16px; }
    .topbar { padding:14px 16px; }
    .topbar-actions { gap:0; }
    .topbar-date { max-width:105px; white-space:normal; text-align:right; }
    .panel-head,.panel-body,.user-filters,.user-card,.user-search,.team-filter { padding:16px; }
    .page-head > .toolbar,.toolbar > input:not([type=checkbox]):not([type=radio]),.toolbar > select { width:100%; min-width:0; }
    .toolbar > input:not([type=checkbox]):not([type=radio]),.toolbar > select { flex-basis:100%; }
    .field-wide { grid-column:auto; }
    .summary-filters,.edit-time-context,.time-entry-form,.screenshot-filters,.download-filters,
    .project-filters,.call-filters,.api-filters,.timeline-filters,.history-filters { grid-template-columns:minmax(0,1fr); }
    .summary-actions { align-items:stretch; }
    .summary-actions input[type=search] { width:100%; flex:1 0 100%; }
    .summary-refresh { flex-wrap:wrap; }
    .summary-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .summary-metrics div { border-right:1px solid var(--line); border-bottom:1px solid var(--line); }
    .summary-metrics div:nth-child(2n) { border-right:0; }
    .summary-metrics div:nth-child(3) { border-right:1px solid var(--line); }
    .summary-metrics div:nth-last-child(-n+2) { border-bottom:0; }
    .column-menu > div { right:auto; left:0; }
    .monitoring-row { grid-template-columns:minmax(0,1fr); gap:14px; padding:16px; }
    .monitoring-row > .btn { justify-self:stretch; }
    .monitoring-activity { display:flex; align-items:center; gap:8px; }
    .monitoring-activity span { margin:0; }
    .monitoring-shots { grid-template-columns:repeat(3,minmax(0,1fr)); }
    .download-actions { grid-template-columns:minmax(0,1fr); gap:6px; }
    .download-actions > span { margin-bottom:12px; }
    .download-header { padding:14px 16px; gap:12px; }
    .download-content { width:calc(100% - 32px); }
    .download-card { padding:20px; }
    .auth-box { padding:24px; }
    .user-search { flex-wrap:wrap; }
    .user-search .field { flex-basis:100%; max-width:none; }
    .user-search > span { margin:0; white-space:normal; }
    .team-filter-controls .field,.live-filter .field { min-width:0; }
    .shift-instance-list > div { grid-template-columns:minmax(0,1fr); }
    .operations-actions a { white-space:normal; overflow-wrap:anywhere; }
    .screen-loading { max-width:calc(100% - 32px); }
}