:root {
  color-scheme: light;
  --bg: #f5f6f8;
  --paper: #fff;
  --sidebar: #f1f2f4;
  --ink: #272c35;
  --sub: #626b7c;
  --muted: #737c8d;
  --line: #e7e9ee;
  --line-strong: #dce0e7;
  --accent: #5362d7;
  --accent-soft: #edf0fd;
  --primary: #23272f;
  --green: var(--accent);
  --green-deep: #4451bc;
  --green-soft: var(--accent-soft);
  --blue: #506394;
  --blue-soft: #eef2f9;
  --amber: #89672f;
  --amber-soft: #faf5eb;
  --red: #b45862;
  --red-soft: #fdf1f3;
  --radius-shell: 16px;
  --radius-card: 16px;
  --radius-control: 11px;
  --motion-fast: 140ms;
  --font: -apple-system, BlinkMacSystemFont, "PingFang SC", "Helvetica Neue", sans-serif;
  --motion-out: cubic-bezier(.22, 1, .36, 1);
  --motion-spring: cubic-bezier(.32, 1.3, .5, 1);
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--ink); font: 14px/1.6 var(--font); -webkit-font-smoothing: antialiased; }
button, input, select, textarea { font: inherit; }
button { color: inherit; cursor: pointer; }
button:disabled { opacity: .45; cursor: not-allowed; }
button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible { outline: 2px solid #929df0; outline-offset: 3px; }
a { color: var(--accent); text-decoration: none; }
a:hover, .link-btn:hover { text-decoration: underline; }
h1, h2, h3, p { margin: 0; }
h2 { font-size: 15px; font-weight: 600; }
h3 { font-size: 14px; font-weight: 600; }
small { font-size: 12px; }
svg { display: block; }
.icon { display: inline-block; width: 20px; height: 20px; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; vertical-align: middle; }
.hidden { display: none !important; }
.muted, .hint { color: var(--muted); }
.hint { font-size: 12px; }
.mono { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 12px; }
.pre-line { white-space: pre-wrap; overflow-wrap: anywhere; }
.break { overflow-wrap: anywhere; }
.spaced { display: grid; min-width: 0; gap: 20px; }
.flex { display: flex; align-items: center; gap: 8px; }
.wrap { flex-wrap: wrap; }
.between { justify-content: space-between; }
.link-btn { padding: 0; border: 0; background: none; color: var(--accent); text-align: left; font-size: inherit; }
.boot-state { display: grid; min-height: 100vh; place-content: center; justify-items: center; gap: 18px; color: var(--sub); }

/* Inset application shell */
.app-shell { min-height: 100vh; padding: 8px; }
.sidebar { position: fixed; inset: 8px auto 8px 8px; z-index: 5; display: flex; flex-direction: column; width: 224px; padding: 18px 11px 10px; border: 1px solid #e3e6ec; border-radius: var(--radius-shell); background: var(--sidebar); color: var(--sub); }
.brand { display: flex; align-items: center; gap: 10px; color: var(--ink); }
.brand:hover { text-decoration: none; }
.brand-mark { display: grid; width: 32px; height: 32px; flex: 0 0 auto; place-items: center; border: 1px solid #363c47; border-radius: 7px; background: #2a2f39; color: white; font-size: 20px; font-weight: 700; letter-spacing: -1px; }
.brand-mark .icon { width: 21px; height: 21px; }
.brand b { display: block; font-size: 16px; font-weight: 650; line-height: 1.4; }
.brand small { display: block; margin-top: 1px; color: #626b7c; font-size: 11px; }
.sidebar .brand { padding: 0 10px 22px; }
.nav-shortcut { display: flex; align-items: center; gap: 8px; width: calc(100% - 6px); min-height: 35px; margin: 0 3px 18px; padding: 7px 9px; border: 1px solid #dfe3eb; border-radius: var(--radius-control); background: #f8f9fb; color: #626b7c; text-align: left; font-size: 12px; }
.nav-shortcut:hover { background: white; border-color: #cbd3e1; color: #626b7c; }
.nav-shortcut > span { flex: 1; min-width: 0; }
.nav-shortcut .icon { width: 15px; height: 15px; color: #626b7c; }
.nav-shortcut kbd { padding: 0 4px; border: 1px solid #e0e5ee; border-radius: 3px; background: #f8f9fb; color: #626b7c; font: 11px/1.6 ui-monospace, SFMono-Regular, monospace; }
.nav-label { margin: 3px 11px 9px; color: #626b7c; font-size: 11px; font-weight: 500; letter-spacing: .5px; }
.nav { display: grid; gap: 3px; }
.nav-item { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 40px; padding: 9px 11px; border: 1px solid transparent; border-radius: var(--radius-control); background: transparent; color: #626b7c; text-align: left; font-size: 13px; line-height: 1.5; transition: background .14s; }
.nav-item:hover { background: #f8f9fb; color: #626b7c; }
.nav-item.active { border-color: #dfe4ef; background: white; color: #43516b; font-weight: 550; box-shadow: 0 1px 2px #25395c04; }
.nav-item.active .icon { color: #5362d7; }
.nav-icon, .nav-item > .icon { display: grid; width: 18px; height: 18px; flex: 0 0 auto; place-items: center; color: #626b7c; font-size: 17px; }
.nav-icon .icon { width: 18px; height: 18px; }
.nav-count { display: grid; min-width: 20px; height: 19px; margin-left: auto; place-items: center; border: 1px solid #e0e6ef; border-radius: 999px; background: #f8f9fb; color: #626b7c; font-size: 11px; font-variant-numeric: tabular-nums; }
.nav-item.active .nav-count { background: #f8f9fb; color: #626b7c; }
.nav-divider { height: 1px; margin: 16px 10px; background: #e2e7f0; }
.sidebar-bottom { margin-top: auto; padding: 18px 7px 0; }
.workspace-caption { display: flex; align-items: center; gap: 6px; color: #737c8d; font-size: 11px; }
.sidebar-bottom .workspace-caption { padding: 0 2px 13px; }
.account { display: flex; align-items: center; gap: 8px; padding: 13px 0 0; border-top: 1px solid #e0e7f1; }
.account-copy { min-width: 0; flex: 1; }
.account-copy b, .account-copy small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.account-copy b { color: #626b7c; font-size: 12px; font-weight: 550; }
.account-copy small { margin-top: 1px; color: #737c8d; font-size: 11px; }
.account .btn { min-height: 26px; padding: 4px; color: #737c8d; }
.avatar { display: inline-grid; width: 29px; height: 29px; flex: 0 0 auto; place-items: center; border: 1px solid #e0e6f1; border-radius: 50%; background: #f8f9fb; color: #626b7c; font-size: 12px; font-weight: 550; }
.avatar.alt { border-color: #e2e8f1; background: #f8f9fb; color: #626b7c; }
.avatar.warm { border-color: #ebe5dc; background: #f8f9fb; color: #626b7c; }
.main-shell { min-width: 0; min-height: calc(100vh - 16px); margin-left: 232px; overflow: clip; border: 1px solid #e2e7f0; border-radius: var(--radius-shell); background: #fff; }
.topbar { position: sticky; top: 8px; z-index: 4; display: flex; align-items: center; justify-content: space-between; gap: 14px; height: 53px; padding: 0 29px; border-bottom: 1px solid var(--line); background: #fff; }
.breadcrumbs { display: flex; align-items: center; gap: 10px; color: #737c8d; font-size: 12px; white-space: nowrap; }
.breadcrumbs b { color: #626b7c; font-weight: 500; }
.breadcrumbs .icon { width: 13px; height: 13px; }
.topbar-actions { display: flex; align-items: center; gap: 14px; }
.period-label, .sync-label { color: #737c8d; font-size: 11px; white-space: nowrap; }
.sync-label { display: flex; align-items: center; gap: 6px; }
.sync-dot { width: 5px; height: 5px; border-radius: 50%; background: #9dacc4; }
.topbar .btn { min-height: 29px; font-size: 12px; }
.topbar .btn .icon { width: 15px; height: 15px; }
.topbar .avatar { width: 25px; height: 25px; font-size: 11px; cursor: pointer; }
main { width: min(100%, 1580px); min-width: 0; margin: 0 auto; padding: 28px 29px 40px; }
.page-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; margin-bottom: 26px; }
.page-head h1 { color: #364152; font-size: 24px; font-weight: 600; line-height: 1.4; letter-spacing: -.4px; }
.page-head p { margin-top: 6px; color: #737c8d; font-size: 12px; }
.eyebrow { margin-bottom: 5px; color: #737c8d; font-size: 11px; font-weight: 500; }
.actions { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 35px; padding: 7px 12px; border: 1px solid #e0e6f0; border-radius: var(--radius-control); background: white; color: #626b7c; font-size: 13px; font-weight: 500; line-height: 1.4; white-space: nowrap; }
.btn .icon { width: 15px; height: 15px; }
.btn:hover { border-color: #becbe0; background: #f8f9fb; color: #626b7c; text-decoration: none; }
.btn.primary { border-color: #23272f; background: #23272f; color: white; }
.btn.primary:hover { border-color: #3b4350; background: #3b4350; }
.btn.small { min-height: 29px; padding: 5px 8px; font-size: 12px; }
.btn.soft { border-color: #e4eaf9; background: #f8f9fb; color: #626b7c; }
.btn.quiet { border-color: transparent; background: transparent; }
.btn.quiet:hover { background: #f8f9fb; }
.btn.danger { border-color: #f0dfe3; color: #626b7c; }
.keyboard-hint, .command-key { display: inline-flex; align-items: center; justify-content: center; min-width: 18px; min-height: 18px; padding: 1px 5px; border: 1px solid #e5eaf3; border-radius: 4px; background: #f8f9fb; color: #737c8d; font: 11px/1.3 ui-monospace, SFMono-Regular, monospace; }

/* Information surfaces and overview */
.panel { min-width: 0; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius-card); background: white; }
.panel-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 15px 17px; border-bottom: 1px solid var(--line); }
.panel-header h2 { color: #364152; font-size: 14px; font-weight: 600; }
.panel-header p { margin-top: 4px; color: #737c8d; font-size: 12px; }
.panel-body { padding: 17px; }
.panel-footer { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px; padding: 11px 17px; border-top: 1px solid var(--line); color: #737c8d; font-size: 11px; }
.panel-footer > span { display: inline-flex; align-items: center; gap: 5px; }
.panel-footer .icon { width: 13px; height: 13px; }
.overview-intro { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 22px; }
.greeting { color: #364152; font-size: 21px; font-weight: 550; line-height: 1.5; }
.overview-intro p { margin-top: 5px; color: #737c8d; font-size: 12px; }
.overview-date { color: #737c8d; font-size: 12px; white-space: nowrap; }
.overview-team { display: flex; align-items: center; gap: 9px; color: var(--muted); font-size: 12px; }
.overview-team .avatar + .avatar { margin-left: -15px; box-shadow: 0 0 0 2px white; }
.overview-team > span:last-child { margin-left: 2px; }
.overview-summary, .metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0 0 25px; border: 1px solid #e3e9f3; border-radius: var(--radius-card); background: #f8f9fb; }
.metric { display: block; min-width: 0; padding: 17px 20px; border: 0; border-right: 1px solid #e3e9f3; background: transparent; text-align: left; }
.metric:last-child { border-right: 0; }
button.metric:hover { background: #f8f9fb; }
button.metric:focus-visible { outline-offset: -3px; }
.metric-label { color: #626b7c; font-size: 12px; }
.metric-label { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.metric-label > .icon { width: 14px; height: 14px; color: #737c8d; }
.metric-value, .metric-note { display: block; }
.metric-value { margin-top: 7px; color: #364152; font-size: 25px; font-weight: 550; line-height: 1.3; }
.metric-value small { margin-left: 5px; color: #737c8d; font-size: 12px; font-weight: 400; }
.metric-note { margin-top: 4px; color: #737c8d; font-size: 11px; }
.overview-focus, .dashboard-grid { display: grid; grid-template-columns: minmax(0, 1fr) 310px; align-items: start; gap: 20px; }
.section-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 14px; }
.section-heading h2, .section-heading > b { color: #364152; font-size: 14px; font-weight: 550; }
.section-heading p, .section-kicker { margin-top: 4px; color: #737c8d; font-size: 12px; }
.list-heading { display: flex; align-items: center; justify-content: space-between; gap: 13px; min-height: 46px; padding: 11px 15px; border-bottom: 1px solid var(--line); background: #f8f9fb; color: #737c8d; font-size: 12px; }
.list-heading h2, .list-heading h3, .list-heading b { color: #626b7c; font-size: 13px; font-weight: 550; }
.task-row { display: flex; align-items: center; gap: 11px; min-height: 73px; padding: 14px 16px; border-bottom: 1px solid #eaf0f8; }
.task-row:last-child { border-bottom: 0; }
.task-icon { display: grid; width: 30px; height: 30px; flex: 0 0 auto; place-items: center; border: 1px solid #e5ecf7; border-radius: 9px; background: #f8f9fb; color: #737c8d; }
.task-icon .icon { width: 16px; height: 16px; }
.task-copy { min-width: 0; flex: 1; }
.task-copy b, .task-copy strong { display: block; color: #364152; font-size: 13px; font-weight: 550; }
.task-copy p, .task-copy small { display: block; margin-top: 5px; color: #737c8d; font-size: 12px; overflow-wrap: anywhere; }
.task-kind { color: #737c8d; font-size: 11px; white-space: nowrap; }
.overview-bottom-grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 20px; margin-top: 24px; }
.quick-links { display: grid; gap: 9px; }
.quick-link { display: flex; align-items: center; gap: 12px; min-width: 0; padding: 14px; border: 1px solid #e4ebf6; border-radius: var(--radius-card); background: #f8f9fb; color: #737c8d; text-align: left; }
.quick-link:hover { border-color: #cbd9f0; background: #f8f9fb; }
.quick-link > .icon { width: 19px; height: 19px; }
.quick-link > span { min-width: 0; flex: 1; }
.quick-link b { display: block; color: #364152; font-size: 13px; font-weight: 500; }
.quick-link small { display: block; margin-top: 3px; color: #737c8d; font-size: 12px; }
.empty-state { padding: 33px 22px; color: #737c8d; font-size: 12px; text-align: center; }
.empty-state b { display: block; margin-bottom: 7px; color: #364152; font-size: 14px; font-weight: 500; }
.empty-state p { max-width: 350px; margin: 0 auto; line-height: 1.85; }
.empty-state .btn { margin-top: 15px; }
.notice { padding: 11px 13px; border: 1px solid #e7edf7; border-radius: 12px; background: #f8f9fb; color: #737c8d; font-size: 12px; line-height: 1.85; }
.notice.amber { border-color: #e9edf5; background: #f8f9fb; color: #737c8d; }
.notice.error { border-color: #f0dfe5; background: var(--red-soft); color: #626b7c; }
.notice a, .notice button { color: inherit; }
.error-text { color: #626b7c; font-size: 12px; }
.inline-error:not(:empty) { margin-top: 12px; padding: 11px 13px; border: 1px solid #efdfe5; border-radius: 12px; background: #f8f9fb; color: #626b7c; font-size: 12px; white-space: pre-wrap; }
.status-pill, .kind-pill { display: inline-flex; align-items: center; min-height: 22px; max-width: 100%; padding: 2px 7px; border: 1px solid #e8edf5; border-radius: 999px; background: #f8f9fb; color: #737c8d; font-size: 11px; line-height: 1.5; white-space: nowrap; }
.status-approval, .status-accept { border-color: #ece4d5; background: #f8f9fb; color: #89672f; }
.status-ready { border-color: #dfe7f5; background: #f8f9fb; color: #506394; }
.status-dev { border-color: #dfe5fa; background: #f8f9fb; color: #535fc4; }
.status-live { border-color: #dfe8f2; background: #f8f9fb; color: #506394; }
.priority-high { border-color: #f0e1e6; background: #fcf3f6; color: #a75e6b; }
.priority-medium { border-color: #ece5d8; background: #f8f9fb; color: #89672f; }
.row { display: flex; align-items: center; justify-content: space-between; gap: 11px; padding: 14px 16px; border-bottom: 1px solid #edf1f8; }
.row:last-child { border-bottom: 0; }
.row-main { min-width: 0; flex: 1; }
.row-main b { display: block; color: #364152; font-size: 13px; font-weight: 500; overflow-wrap: anywhere; }
.row-main small { display: block; margin-top: 4px; color: #737c8d; font-size: 12px; }
.clickable { cursor: pointer; }
.clickable:hover, .clickable.selected { background: #f8f9fb; }
.member-row { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 9px; }

/* Grouped controls and requirement workspace */
.toolbar, .requirement-controls { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 14px; margin-bottom: 17px; }
.tabs, .requirements-tabs { display: flex; align-items: center; flex-wrap: wrap; gap: 3px; }
.tab, .requirements-tabs > button { display: inline-flex; align-items: center; gap: 6px; min-height: 33px; padding: 6px 10px; border: 1px solid transparent; border-radius: 10px; background: transparent; color: #737c8d; font-size: 12px; }
.tab:hover, .requirements-tabs > button:hover { background: #f8f9fb; color: #626b7c; }
.tab.active, .requirements-tabs > button.active { border-color: #e2e8f5; background: #f8f9fb; color: #535fc4; font-weight: 550; }
.filter-count { padding: 0 2px; color: #737c8d; font-size: 11px; font-variant-numeric: tabular-nums; }
.segmented { display: inline-flex; flex: 0 0 auto; gap: 2px; padding: 3px; border: 1px solid #e4ebf6; border-radius: var(--radius-control); background: #f8f9fb; }
.segmented button { display: inline-flex; align-items: center; gap: 6px; min-height: 29px; padding: 5px 10px; border: 1px solid transparent; border-radius: 8px; background: transparent; color: #737c8d; font-size: 12px; }
.segmented button.active, .segmented button[aria-pressed="true"] { border-color: #e2e9f4; background: white; color: #495772; box-shadow: 0 1px 2px #35538105; }
.segmented .icon { width: 14px; height: 14px; }
.filter-bar { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; min-width: 0; margin-bottom: 18px; padding: 12px 14px; border: 1px solid #e5ebf6; border-radius: var(--radius-card); background: #f8f9fb; }
.search-field { display: flex; align-items: center; gap: 8px; width: 240px; min-width: 140px; min-height: 34px; padding: 0 10px; border: 1px solid #e4ebf6; border-radius: var(--radius-control); background: white; color: #737c8d; }
.search-field .icon { width: 15px; height: 15px; }
.search-field input { min-width: 0; min-height: 32px; padding: 5px 0; border: 0; border-radius: 0; background: transparent; font-size: 12px; box-shadow: none; }
.search-field input:focus { outline: none; box-shadow: none; }
.search-field:focus-within { border-color: #b9c9ec; box-shadow: 0 0 0 2px #5362d708; }
.search-input { width: 220px; }
.filter-bar > .search-field { flex: 1 1 220px; }
.compact-filter { display: flex; align-items: center; gap: 7px; min-width: 0; color: #737c8d; font-size: 12px; }
.compact-filter > label { flex: 0 0 auto; }
.compact-filter select { width: auto; min-width: 95px; min-height: 33px; padding: 5px 26px 5px 9px; border-color: #e6edf7; font-size: 12px; }
.filter-reset { display: inline-flex; align-items: center; gap: 4px; min-height: 31px; padding: 4px 6px; border: 0; background: transparent; color: #737c8d; font-size: 12px; white-space: nowrap; }
.filter-reset:hover { color: #626b7c; }
.requirements-workspace { min-width: 0; }
.requirements-layout { display: grid; grid-template-columns: minmax(0, 1.22fr) minmax(0, 1fr); align-items: start; gap: 17px; }
.requirement-list { min-width: 0; }
.requirement-list .list-heading { display: flex; }
.requirement-list .search-field, .requirement-list .list-heading > label { min-width: 0; flex: 1; }
.requirement-list .list-heading > span { flex: 0 0 auto; font-size: 11px; }
.requirements-table { min-width: 0; }
.requirement-row { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 82px 27px; align-items: center; gap: 11px; min-height: 74px; padding: 12px 16px; border-bottom: 1px solid #edf2f9; background: white; cursor: pointer; }
.requirement-row:last-child { border-bottom: 0; }
.requirement-row:hover { background: #f8f9fb; }
.requirement-row.selected { background: #f8f9fb; }
.requirement-row.selected::before { position: absolute; inset: 0 auto 0 0; width: 2px; background: #a8bde5; content: ""; }
.req-row-main { min-width: 0; }
.req-id, .requirement-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; color: #737c8d; font-size: 11px; }
.req-id { margin-bottom: 5px; }
.req-id .mono { font-size: 11px; }
.req-priority { padding: 1px 5px; border-radius: 999px; color: #737c8d; font-size: 11px; }
.req-row-title { display: block; overflow: hidden; color: #364152; font-size: 13px; font-weight: 550; line-height: 1.65; text-overflow: ellipsis; white-space: nowrap; }
.req-row-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 5px; color: #737c8d; font-size: 11px; }
.req-owner { display: flex; align-items: center; justify-content: center; gap: 5px; color: #737c8d; font-size: 11px; }
.req-owner .avatar { width: 24px; height: 24px; font-size: 11px; }
.req-row-arrow { color: #737c8d; }
.requirement-title { font-weight: 550; }
.requirement-meta { margin-top: 5px; }
.req-id.requirement-meta { margin-top: 0; }
.requirement-detail { scroll-margin-top: 76px; position: sticky; top: 77px; min-width: 0; max-height: calc(100vh - 94px); overflow: auto; scrollbar-width: thin; scrollbar-color: #e1e9f6 transparent; }
.detail-empty { display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 10px; min-height: 440px; padding: 25px; color: #737c8d; text-align: center; }
.detail-empty > .icon { width: 29px; height: 29px; stroke-width: 1.4; }
.detail-empty .empty-state { padding: 0; }
.detail-empty h2, .detail-empty b { color: #737c8d; font-size: 14px; font-weight: 500; }
.detail-empty p { max-width: 240px; color: #737c8d; font-size: 12px; }
.detail-head { padding: 19px; border-bottom: 1px solid var(--line); }
.detail-head h2 { margin: 12px 0 7px; color: #364152; font-size: 17px; font-weight: 550; line-height: 1.65; }
.detail-head .mono { color: #737c8d; font-size: 11px; }
.detail-actions { position: sticky; top: 0; z-index: 2; display: flex; align-items: center; flex-wrap: wrap; gap: 7px; padding: 12px 18px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: #fff; }
.detail-head + .detail-actions { border-top: 0; }
.detail-actions .btn { min-height: 30px; padding: 6px 9px; font-size: 12px; }
.detail-block { padding: 17px 19px; border-bottom: 1px solid #edf2f9; }
.detail-block:last-child { border-bottom: 0; }
.detail-block h3, .detail-section-title { display: flex; align-items: center; gap: 7px; margin-bottom: 10px; color: #737c8d; font-size: 12px; font-weight: 500; }
.detail-section-title { width: 100%; margin: 0; padding: 0; border: 0; background: transparent; text-align: left; cursor: pointer; }
.detail-section-title::marker { color: #737c8d; }
.detail-section-title:hover { color: #626b7c; }
.detail-section-title .icon { width: 13px; height: 13px; }
.detail-block p, .detail-block ul { color: #526074; font-size: 13px; line-height: 1.95; overflow-wrap: anywhere; }
.detail-block p { white-space: pre-wrap; }
.detail-block ul { margin: 0; padding-left: 18px; }
.detail-block li + li { margin-top: 5px; }
.detail-meta { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; }
.detail-meta small { display: block; margin-bottom: 5px; color: #737c8d; font-size: 12px; }
.detail-meta b { color: #364152; font-size: 13px; font-weight: 500; overflow-wrap: anywhere; }
.progress-track { display: flex; gap: 4px; padding: 15px 18px; border-bottom: 1px solid var(--line); }
.progress-step { min-width: 0; flex: 1; color: #737c8d; font-size: 11px; text-align: center; white-space: nowrap; }
.progress-step::before { display: block; height: 3px; margin-bottom: 7px; border-radius: 4px; background: #f8f9fb; content: ""; }
.progress-step.done::before { background: #c7d7f0; }
.progress-step.current { color: #535fc4; font-weight: 550; }
.progress-step.current::before { background: #a4bfe9; }
.timeline { display: grid; gap: 14px; }
.timeline-item { padding-left: 13px; border-left: 1px solid #e6effa; color: #737c8d; font-size: 12px; }
.timeline-item b { font-weight: 500; }
.timeline-item small { display: block; margin-top: 3px; color: #737c8d; font-size: 11px; }
.timeline-item p { margin-top: 5px; color: #737c8d; font-size: 12px; }
.file-list { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; }
.file-link { display: inline-flex; align-items: center; gap: 6px; max-width: 100%; padding: 5px 8px; border: 1px solid #e8f0fb; border-radius: var(--radius-control); background: #f8f9fb; color: #737c8d; font-size: 12px; overflow-wrap: anywhere; }
.file-link .icon { width: 14px; height: 14px; }

/* Locally scrolling six-stage board */
.board-layout { display: grid; grid-template-columns: minmax(0, 1fr); align-items: start; gap: 17px; min-width: 0; }
.kanban-scroll { min-width: 0; overflow-x: auto; padding: 1px 1px 13px; scrollbar-width: thin; scrollbar-color: #dce8f8 #f9fbff; }
.kanban-board { display: grid; grid-template-columns: repeat(6, 232px); align-items: start; gap: 12px; min-width: max-content; }
.kanban-column { min-height: 310px; padding: 10px; border: 1px solid #e5edf9; border-radius: var(--radius-card); background: #f8f9fb; }
.kanban-column-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 4px 2px 13px; color: #526074; font-size: 12px; font-weight: 550; }
.kanban-column-head span { font-weight: 400; }
.kanban-cards { display: grid; gap: 9px; }
.kanban-card { display: block; min-width: 0; width: 100%; padding: 13px; border: 1px solid #e1ebfa; border-radius: 16px; background: white; text-align: left; box-shadow: 0 1px 2px #3a6daf03; }
.kanban-card:hover { border-color: #bdd2f0; box-shadow: 0 2px 7px #3a6daf08; }
.kanban-card.selected, .kanban-card[aria-pressed="true"] { border-color: #abc7ed; background: #f8f9fb; }
.kanban-card .requirement-meta { margin: 0 0 8px; color: #737c8d; font-size: 11px; }
.kanban-card > b { display: block; color: #364152; font-size: 13px; font-weight: 500; line-height: 1.85; overflow-wrap: anywhere; }
.kanban-card-foot { display: flex; align-items: center; justify-content: space-between; gap: 7px; margin-top: 14px; color: #737c8d; font-size: 11px; }
.kanban-card-foot .avatar { width: 22px; height: 22px; font-size: 11px; }
.kanban-empty { display: grid; min-height: 105px; place-content: center; border: 1px dashed #deebfb; border-radius: 6px; color: #737c8d; font-size: 12px; text-align: center; }
.board-layout > .requirement-detail { max-height: none; position: static; }

/* Reports, repositories and tables */
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; text-align: left; font-size: 13px; }
th { padding: 11px 14px; border-bottom: 1px solid var(--line); background: #f8f9fb; color: #737c8d; font-size: 12px; font-weight: 500; white-space: nowrap; }
td { padding: 14px; border-bottom: 1px solid #edf3fb; color: #737c8d; vertical-align: top; }
tr:last-child td { border-bottom: 0; }
.table-person { display: flex; align-items: center; gap: 8px; color: #364152; white-space: nowrap; }
.table-person b { font-weight: 500; }
.report-summary { max-width: 430px; white-space: pre-wrap; overflow-wrap: anywhere; }
.report-summary small { display: block; margin-top: 5px; color: #737c8d; font-size: 12px; }
.report-toolbar { margin-bottom: 22px; }
.report-progress { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 22px; padding: 19px 21px; border: 1px solid var(--line); border-radius: var(--radius-card); background: #f8f9fb; }
.report-progress .section-kicker { margin: 0; color: var(--muted); }
.report-progress h2 { margin-top: 5px; color: #364152; font-size: 24px; font-weight: 550; }
.report-progress h2 span { margin-left: 4px; color: var(--muted); font-size: 13px; font-weight: 400; }
.submission-steps { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.submission-step { display: inline-flex; align-items: center; gap: 6px; color: #737c8d; font-size: 12px; }
.submission-step .icon { width: 15px; height: 15px; }
.submission-step.complete { color: #626b7c; }
.report-card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; gap: 15px; }
.report-card .panel-header { align-items: flex-start; padding: 16px; }
.report-card .panel-header .avatar { width: 31px; height: 31px; }
.report-card .panel-header h2 { font-size: 14px; }
.report-card .panel-header p { margin-top: 3px; font-size: 11px; }
.report-card .panel-footer { align-items: flex-start; padding: 13px 15px; }
.report-card .panel-footer .actions { justify-content: flex-end; }
.report-card-body { display: grid; gap: 19px; }
.report-section h3 { margin-bottom: 7px; color: var(--muted); font-size: 12px; font-weight: 500; }
.report-section p { color: #526074; font-size: 13px; line-height: 1.9; overflow-wrap: anywhere; }
.report-no-blocker { padding-top: 4px; color: var(--muted); font-size: 12px; }
.report-linked { display: flex; flex-wrap: wrap; gap: 6px; }
.report-linked .kind-pill { padding: 3px 7px; }
.team-report-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; }
.team-report-card, .report-card { min-width: 0; overflow: hidden; border: 1px solid #e2edf9; border-radius: var(--radius-card); background: white; }
.report-card-head { display: flex; align-items: center; gap: 10px; padding: 16px; border-bottom: 1px solid #ecf3fb; }
.report-card-body { padding: 16px; color: #364152; font-size: 13px; line-height: 1.9; }
.report-card-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 12px 16px; border-top: 1px solid #ecf3fb; }
.repo-card { padding: 18px; border-bottom: 1px solid var(--line); }
.repo-card:last-child { border-bottom: 0; }
.repo-card h3 { color: #364152; font-size: 14px; font-weight: 550; overflow-wrap: anywhere; }
.repo-card h3 a { color: inherit; }
.repo-meta { display: flex; flex-wrap: wrap; gap: 17px; margin: 12px 0; color: #737c8d; font-size: 12px; }
.repo-meta b { color: #737c8d; font-weight: 500; }
.repo-card .notice { margin-top: 10px; }
.github-onboarding { padding: 42px 34px 32px; text-align: center; }
.github-onboarding > .icon { width: 33px; height: 33px; margin: 0 auto 18px; color: #626b7c; stroke-width: 1.5; }
.github-onboarding h2 { color: #364152; font-size: 20px; font-weight: 550; }
.github-onboarding > p { max-width: 470px; margin: 10px auto 20px; color: var(--muted); font-size: 13px; line-height: 1.9; }
.connection-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 23px; max-width: 850px; margin: 35px auto 0; padding-top: 27px; border-top: 1px solid var(--line); text-align: left; }
.connection-step > span { display: grid; width: 23px; height: 23px; margin-bottom: 12px; place-items: center; border: 1px solid #dfe5ef; border-radius: 6px; background: #f8f9fc; color: #737c8d; font: 11px ui-monospace, SFMono-Regular, monospace; }
.connection-step b { display: block; color: #58677f; font-size: 13px; font-weight: 550; }
.connection-step p { margin-top: 7px; color: var(--muted); font-size: 12px; line-height: 1.9; }
.github-repos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 15px; margin-bottom: 23px; }
.github-repos .repo-card { border: 1px solid var(--line); border-radius: var(--radius-card); background: white; }
.github-activity { margin-top: 22px; }
.event-kind { display: grid; width: 29px; height: 29px; flex: 0 0 auto; place-items: center; border: 1px solid #e7f0fb; border-radius: 9px; background: #f8f9fb; color: #737c8d; }
.event-kind .icon { width: 15px; height: 15px; }
.event-time { flex: 0 0 auto; color: #737c8d; font-size: 11px; white-space: nowrap; }
.settings-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, .74fr); align-items: start; gap: 22px; }
.audit-table td { font-size: 12px; }

/* Focused single-column assistant */
.assistant-workspace { width: min(100%, 1050px); min-width: 0; margin: 0 auto; }
.assistant-workspace .chat-panel { height: calc(100dvh - 205px); min-height: 480px; }
.chat-layout { display: grid; grid-template-columns: minmax(0, 1fr) 250px; align-items: start; gap: 20px; }
.chat-panel { display: flex; min-height: 630px; flex-direction: column; }
.chat-panel .panel-header { min-height: 66px; flex: 0 0 auto; }
.private-label { display: inline-flex; align-items: center; gap: 5px; color: #737c8d; font-size: 11px; }
.private-label .icon { width: 13px; height: 13px; }
.assistant-symbol { display: grid; width: 32px; height: 32px; place-items: center; border: 1px solid #e2e7f1; border-radius: 8px; background: #f7f9fd; color: #737c8d; }
.assistant-symbol .icon { width: 18px; height: 18px; }
.chat-messages { display: grid; flex: 1; align-content: start; gap: 25px; min-height: 0; overflow-y: auto; padding: 25px; }
.chat-messages:has(.assistant-empty) { display: flex; align-items: stretch; }
.assistant-empty { display: flex; flex: 0 0 auto; align-items: center; justify-content: flex-start; flex-direction: column; min-width: 0; width: 100%; padding: 15px 0; text-align: center; }
.assistant-empty > .icon { width: 32px; height: 32px; margin-bottom: 17px; color: #737c8d; stroke-width: 1.5; }
.assistant-hero-icon { display: grid; width: 48px; height: 48px; margin-bottom: 18px; place-items: center; border: 1px solid #e3e9f3; border-radius: 12px; background: #f8fafe; color: #737c8d; }
.assistant-hero-icon .icon { width: 26px; height: 26px; stroke-width: 1.5; }
.assistant-empty > .section-kicker { margin: 0 0 7px; }
.assistant-empty h2 { color: #364152; font-size: 20px; font-weight: 550; }
.assistant-empty > p { max-width: 440px; margin-top: 9px; color: #737c8d; font-size: 13px; line-height: 1.9; }
.prompt-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; width: 100%; margin-top: 26px; }
.prompt-card { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-content: start; gap: 9px; min-width: 0; min-height: 144px; padding: 15px; border: 1px solid #e5eaf2; border-radius: var(--radius-control); background: #f8f9fb; color: #737c8d; text-align: left; font-size: 12px; line-height: 1.8; }
.prompt-card:hover { border-color: #c5daf4; background: #f8f9fb; }
.prompt-card:disabled { opacity: .8; cursor: default; }
.prompt-card .icon { width: 16px; height: 16px; margin-top: 3px; }
.prompt-card > b, .prompt-card > span { grid-column: 1 / -1; }
.prompt-card > b { color: #53627a; font-size: 13px; font-weight: 550; }
.prompt-card > span { color: var(--muted); font-size: 12px; line-height: 1.85; }
.prompt-card > .icon:last-child { grid-column: 2; grid-row: 1; color: #737c8d; }
.chat-message { display: flex; align-items: flex-start; gap: 12px; min-width: 0; }
.chat-message > .avatar { width: 26px; height: 26px; margin-top: 2px; border-radius: 7px; font-size: 11px; }
.chat-message-content { min-width: 0; flex: 1; }
.chat-message.user .chat-message-content { padding: 12px 15px; border: 1px solid #e7f1fc; border-radius: 12px; background: #f8f9fb; }
.chat-message-name { display: flex; align-items: center; gap: 9px; margin-bottom: 7px; color: #737c8d; font-size: 11px; }
.chat-message-name b { color: #526074; font-size: 12px; font-weight: 500; }
.chat-message-text { color: #364152; font-size: 14px; line-height: 1.95; white-space: pre-wrap; overflow-wrap: anywhere; }
.chat-message-text code { font-family: ui-monospace, SFMono-Regular, monospace; }
.chat-compose { flex: 0 0 auto; margin-top: auto; padding: 17px; border-top: 1px solid var(--line); background: white; }
.chat-compose textarea { min-height: 94px; font-size: 14px; }
.compose-context-bar { display: flex; align-items: flex-start; flex-wrap: wrap; gap: 11px 20px; margin-bottom: 12px; }
.compose-context-bar > .hint { line-height: 1.4; }
.compose-context-bar .chat-contexts { margin-bottom: 0; gap: 11px 15px; }
.chat-contexts { display: flex; align-items: center; flex-wrap: wrap; gap: 15px; margin-bottom: 12px; padding: 0; }
.chat-contexts .checkbox-label { font-size: 12px; }
.compose-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 11px; }
.chat-compose .hint { font-size: 12px; }
.source-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 11px; }
.source-tags span { padding: 1px 5px; border: 1px solid #eaf3fc; border-radius: 999px; background: #f8f9fb; color: #737c8d; font-size: 11px; }
.loading-dots { color: #737c8d; font-size: 12px; }
.chat-notice { margin: 15px 17px 0; }

/* Form controls, modal and feedback */
.form-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 17px; }
.field { display: grid; min-width: 0; align-content: start; gap: 7px; }
.field.full { grid-column: 1 / -1; }
.field label { color: #364152; font-size: 13px; font-weight: 500; }
.field small { color: #737c8d; font-size: 12px; line-height: 1.85; }
input, select, textarea { width: 100%; min-width: 0; min-height: 38px; padding: 8px 10px; border: 1px solid #e0ebf9; border-radius: var(--radius-control); background: white; color: #364152; font-size: 14px; line-height: 1.6; }
input:hover, select:hover, textarea:hover { border-color: #cbdcf3; }
input:focus, select:focus, textarea:focus { border-color: #b4cdf0; outline: none; box-shadow: 0 0 0 3px #5362d70b; }
input::placeholder, textarea::placeholder { color: #737c8d; }
input:disabled, select:disabled, textarea:disabled { background: #f8f9fb; color: #737c8d; }
textarea { min-height: 105px; resize: vertical; line-height: 1.85; }
input[type="checkbox"] { width: 14px; height: 14px; min-height: 0; margin: 0; padding: 0; accent-color: var(--accent); box-shadow: none; }
input[type="file"] { padding: 7px 8px; font-size: 12px; }
input[type="file"]::file-selector-button { margin: -3px 9px -3px -3px; padding: 4px 8px; border: 1px solid #e1edfa; border-radius: 8px; background: #f8f9fb; color: #737c8d; font: inherit; cursor: pointer; }
.checkbox-label { display: inline-flex; align-items: center; gap: 7px; color: #737c8d; font-size: 12px; cursor: pointer; }
.divider { height: 1px; margin: 20px 0; background: var(--line); }
.form-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 20px; }
.modal-backdrop { position: fixed; inset: 0; z-index: 20; display: grid; place-items: center; padding: 24px; background: #28394f66; pointer-events: none; }
.modal { display: flex; flex-direction: column; width: min(660px, 100%); max-height: calc(100vh - 48px); overflow: hidden; border: 1px solid #dce9f8; border-radius: 20px; background: white; box-shadow: 0 20px 65px #253c5b25; }
.modal-backdrop > .modal { pointer-events: auto; }
.modal.wide { width: min(820px, 100%); }
.modal-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; padding: 22px 24px 18px; border-bottom: 1px solid var(--line); }
.modal-head h2 { color: #364152; font-size: 19px; font-weight: 550; }
.modal-head p { margin-top: 6px; color: #737c8d; font-size: 12px; }
.close-btn { display: grid; width: 27px; min-width: 27px; height: 27px; place-items: center; border: 1px solid #e5effb; border-radius: 8px; background: #f8f9fb; color: #737c8d; font-size: 18px; }
.close-btn:hover { background: #f8f9fb; color: #737c8d; }
.close-btn .icon { width: 14px; height: 14px; }
.modal form { display: flex; min-height: 0; flex-direction: column; }
.modal-body { overflow-y: auto; padding: 22px 24px; }
.modal-foot { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 8px; padding: 14px 24px; border-top: 1px solid var(--line); background: #f8f9fb; }
.modal-body > h3 { margin: 20px 0 8px; color: #737c8d; font-size: 13px; }
.modal-body > h3:first-child { margin-top: 0; }
.modal-body > p { color: #364152; font-size: 14px; line-height: 1.95; white-space: pre-wrap; overflow-wrap: anywhere; }
.modal-open { overflow: hidden; }
.toast-region { position: fixed; right: 25px; bottom: 22px; z-index: 40; display: grid; gap: 8px; max-width: min(440px, calc(100vw - 32px)); pointer-events: none; }
.toast { padding: 12px 16px; border: 1px solid #e2edfb; border-radius: 12px; background: white; color: #737c8d; font-size: 12px; box-shadow: 0 6px 25px #2b47701a; }
.toast.error { border-color: #efdee6; background: #f8f9fb; color: #626b7c; }

/* Authentication and command search */
.auth-page { display: grid; min-height: 100vh; place-items: center; padding: 35px 20px; background: #f8f9fb; }
.auth-card { width: min(400px, 100%); padding: 30px; border: 1px solid #e2ecf8; border-radius: var(--radius-card); background: white; box-shadow: 0 8px 35px #2c4e7d08; }
.auth-card .brand { margin-bottom: 30px; }
.auth-card h1 { color: #364152; font-size: 24px; font-weight: 550; }
.auth-card > p { margin: 10px 0 25px; color: #737c8d; font-size: 13px; line-height: 1.9; }
.auth-card form { display: grid; gap: 17px; }
.auth-card .btn { min-height: 40px; margin-top: 5px; }
.auth-foot { margin-top: 23px; color: #737c8d; font-size: 11px; text-align: center; }
.auth-page:has(> .auth-aside) { grid-template-columns: minmax(350px, 42%) minmax(0, 1fr); padding: 0; place-items: stretch; }
.auth-aside { display: flex; flex-direction: column; min-height: 100vh; padding: 44px 48px 30px; background: #f8f9fb; color: #737c8d; }
.auth-aside > .brand small { color: #737c8d; }
.auth-wordmark { margin-top: auto; padding-top: 60px; }
.auth-wordmark > .section-kicker { color: #737c8d; font-size: 12px; }
.auth-wordmark h2 { max-width: 330px; margin-top: 14px; color: #364152; font-size: 30px; font-weight: 500; line-height: 1.7; }
.auth-wordmark > p { max-width: 330px; margin-top: 16px; color: #737c8d; font-size: 13px; line-height: 2; }
.auth-feature { display: flex; align-items: center; gap: 13px; margin-top: 25px; color: #737c8d; font-size: 13px; }
.auth-feature > span:not(.auth-number) { flex: 1; }
.auth-feature > .icon { width: 17px; height: 17px; color: #737c8d; }
.auth-number { display: grid; width: 23px; height: 23px; flex: 0 0 auto; place-items: center; border: 1px solid #d8e7f9; border-radius: 5px; background: #f8f9fb; color: #737c8d; font: 11px ui-monospace, SFMono-Regular, monospace; }
.auth-bottom { margin-top: auto; padding-top: 65px; color: #737c8d; font-size: 11px; }
.auth-main { display: flex; min-width: 0; min-height: 100vh; align-items: center; justify-content: center; padding: 45px; background: white; }
.auth-main .auth-card { width: min(355px, 100%); padding: 0; border: 0; border-radius: 0; box-shadow: none; }
.auth-main .workspace-caption { display: block; margin-bottom: 23px; padding: 0; color: #737c8d; font-size: 12px; }
.command-backdrop { align-items: flex-start; padding: min(18vh, 145px) 20px 30px; background: #27394f66; backdrop-filter: blur(2px); }
.command-backdrop > .command-dialog { pointer-events: auto; }
.command-dialog { border-radius: 16px; width: min(620px, 100%); max-height: min(570px, 78vh); border-color: #d8e8fb; box-shadow: 0 20px 75px #233c5c30; }
.command-search { display: flex; align-items: center; gap: 12px; min-height: 62px; padding: 0 19px; border-bottom: 1px solid #e5effb; color: #737c8d; }
.command-search .icon { width: 19px; height: 19px; }
.command-search input { flex: 1; min-height: 60px; padding: 12px 0; border: 0; border-radius: 0; box-shadow: none; color: #737c8d; font-size: 14px; }
.command-search input:focus { box-shadow: none; }
.command-results { max-height: min(450px, 60vh); overflow-y: auto; padding: 8px; }
.command-results > .section-kicker { padding: 8px 10px 5px; color: #737c8d; font-size: 11px; }
.command-result { display: flex; align-items: center; gap: 11px; width: 100%; min-height: 51px; padding: 11px; border: 0; border-radius: var(--radius-control); background: white; color: #737c8d; text-align: left; font-size: 13px; }
.command-result .icon { width: 17px; height: 17px; color: #737c8d; }
.command-result:hover, .command-result.active, .command-result:focus-visible { outline: none; background: #f8f9fb; }
.command-result span { min-width: 0; }
.command-result b { display: block; color: #364152; font-size: 13px; font-weight: 500; }
.command-result small { display: block; margin-top: 3px; color: #737c8d; font-size: 11px; }
.command-result .command-key { margin-left: auto; }
.command-empty { padding: 35px 20px; color: #737c8d; font-size: 12px; text-align: center; }

/* Utilities and responsive limits */
/* Rounded controls and brief feedback share one motion language. */
.btn, .nav-item, .nav-shortcut, .tab, .segmented button, .filter-reset,
.quick-link, .kanban-card, .prompt-card, .command-result, .calendar-day,
.discovery-card, input, select, textarea {
  transition: background-color var(--motion-fast) var(--motion-out), border-color var(--motion-fast) var(--motion-out), color var(--motion-fast) var(--motion-out), box-shadow var(--motion-fast) var(--motion-out), transform var(--motion-fast) var(--motion-out);
}
.btn:active:not(:disabled), .nav-item:active, .nav-shortcut:active, .tab:active, .segmented button:active, .filter-reset:active, .quick-link:active, .prompt-card:active:not(:disabled), .command-result:active, .kanban-card:active, .calendar-day:active, .discovery-card:active { transform: scale(.96); transition-timing-function: var(--motion-spring); }
.quick-link:hover, .kanban-card:hover, .discovery-card:hover { transform: translateY(-1px); }
main.page-enter { animation: page-enter 190ms ease-out both; }
.modal-backdrop { animation: overlay-enter 150ms ease-out both; }
.modal-backdrop .modal { animation: modal-enter 180ms ease-out both; }
.toast { animation: modal-enter 180ms ease-out both; }
.loading-dots { animation: loading-pulse 1.35s ease-in-out infinite; }
@keyframes page-enter { from { opacity: .6; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } }
@keyframes overlay-enter { from { opacity: 0; } to { opacity: 1; } }
@keyframes modal-enter { from { opacity: .5; transform: translateY(7px); } to { opacity: 1; transform: translateY(0); } }
@keyframes loading-pulse { 0%, 100% { opacity: .6; } 50% { opacity: 1; } }
@keyframes chart-grow { from { transform: scaleY(0); } to { transform: scaleY(1); } }
.style-mini-bar i, .apple-member-meter i { transform-origin: bottom; animation: chart-grow 900ms var(--motion-out) both; }
.global-error { position: fixed; right: 20px; bottom: 20px; z-index: 60; display: flex; align-items: center; gap: 10px; max-width: min(560px, calc(100vw - 32px)); padding: 11px 13px; border: 1px solid #ffb4ad; border-radius: 12px; background: #fff4f2; color: #6f1d1b; box-shadow: 0 10px 32px rgba(80, 30, 25, .16); font-size: 12px; pointer-events: none; }
.global-error[hidden] { display: none; }
.global-error > * { pointer-events: auto; }
.global-error-label { font-weight: 650; white-space: nowrap; }
.global-error button { padding: 2px 6px; border: 0; border-radius: 6px; background: transparent; color: inherit; cursor: pointer; }
.global-error button:hover { background: rgba(190, 50, 40, .1); }

/* The calendar compares reported work, with details for a selected day. */
.reports-view-tabs { display: flex; align-items: center; gap: 5px; margin-bottom: 21px; }
.reports-view-tabs .tab { padding-right: 13px; padding-left: 13px; }
.calendar-layout { display: grid; grid-template-columns: minmax(0, 1fr) 310px; align-items: start; gap: 19px; }
.work-calendar { min-width: 0; padding: 20px; }
.calendar-header { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 13px; margin-bottom: 17px; }
.calendar-header h2 { color: #364152; font-size: 18px; font-weight: 550; }
.calendar-header .actions { gap: 5px; }
.calendar-header .btn { min-height: 31px; padding: 5px 9px; }
.calendar-header .btn .icon { width: 14px; height: 14px; }
.calendar-summary { display: flex; align-items: center; flex-wrap: wrap; gap: 11px 20px; margin-bottom: 20px; padding-bottom: 17px; border-bottom: 1px solid var(--line); color: var(--muted); font-size: 12px; }
.calendar-summary b, .calendar-summary strong { margin-right: 4px; color: #40516e; font-size: 19px; font-weight: 550; }
.calendar-summary > label { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.calendar-weekdays { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); margin-bottom: 8px; color: #737c8d; font-size: 12px; text-align: center; }
.calendar-weekdays > span { padding: 6px 0; }
.calendar-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; }
.calendar-day { position: relative; display: flex; align-items: flex-start; flex-direction: column; min-width: 0; min-height: 90px; padding: 9px 10px 8px; border: 1px solid transparent; border-radius: 11px; background: #f7f8fa; color: #737c8d; text-align: left; }
.calendar-date { display: inline-flex; align-items: center; justify-content: center; gap: 4px; min-width: 23px; height: 23px; padding: 0 4px; border-radius: 999px; font-size: 12px; line-height: 1; }
.calendar-date small { font-size: 11px; }
.calendar-hours { display: block; margin-top: 8px; color: #626b7c; font-size: 14px; font-weight: 550; white-space: nowrap; }
.calendar-hours small { margin-left: 2px; font-size: 11px; font-weight: 400; }
.calendar-no-log { margin-top: 11px; color: #a1abba; font-size: 13px; }
.calendar-count { display: block; margin-top: 2px; color: #737c8d; font-size: 11px; line-height: 1.4; }
.calendar-day.heat-0, .heat-key.heat-0 { background: #f5f6f8; }
.calendar-day.heat-1, .heat-key.heat-1 { background: #f0f2fa; }
.calendar-day.heat-2, .heat-key.heat-2 { background: #e9edf9; }
.calendar-day.heat-3, .heat-key.heat-3 { background: #e0e7f8; }
.calendar-day.heat-4, .heat-key.heat-4 { background: #d5dff6; }
.calendar-day.heat-3 .calendar-hours, .calendar-day.heat-4 .calendar-hours { color: #626b7c; }
.calendar-day:hover { border-color: #c4d0e5; box-shadow: 0 2px 6px #304b7509; transform: translateY(-1px); }
.calendar-day.outside-month { opacity: .42; }
.calendar-day.today .calendar-date { background: #303743; color: white; font-weight: 550; }
.calendar-day.selected { border-color: #a2b3d5; box-shadow: inset 0 0 0 1px #a2b3d5; }
.calendar-day.future { color: #737c8d; }
.calendar-day.future .calendar-hours, .calendar-day.future .calendar-count { opacity: .6; }
.calendar-legend { display: flex; align-items: center; justify-content: flex-end; gap: 5px; margin-top: 17px; color: #737c8d; font-size: 11px; }
.calendar-legend > span:first-child { margin-right: 3px; }
.calendar-legend > span:last-child { margin-left: 3px; }
.heat-key { display: inline-block; width: 13px; height: 13px; border: 1px solid #e2e7f0; border-radius: 4px; }
.day-summary { position: sticky; top: 77px; min-width: 0; }
.day-summary .panel-header { align-items: flex-start; }
.day-summary .panel-header h2 { font-size: 15px; }
.day-log-list { display: grid; gap: 12px; padding: 15px; }
.day-log-card { min-width: 0; padding: 13px; border: 1px solid #e7ebf2; border-radius: 16px; background: #fbfcfe; }
.day-log-card > header, .day-log-head { display: flex; align-items: center; gap: 8px; margin-bottom: 11px; }
.day-log-card > header .avatar, .day-log-head .avatar { width: 25px; height: 25px; font-size: 11px; }
.day-log-card > header b, .day-log-head b { color: #53647e; font-size: 13px; font-weight: 550; }
.day-log-card > header > span:last-child, .day-log-head > span:last-child { margin-left: auto; color: #626b7c; font-size: 12px; }
.day-log-card p { color: #626b7c; font-size: 13px; line-height: 1.85; white-space: pre-wrap; overflow-wrap: anywhere; }
.day-log-card p + p { margin-top: 10px; }
.day-log-card > .flex:first-child { gap: 8px; }
.day-log-card > .flex:first-child b { color: #53647e; font-size: 13px; font-weight: 550; }
.day-log-card > .flex:first-child .avatar { width: 25px; height: 25px; font-size: 11px; }
.day-log-hours { flex: 0 0 auto; color: #626b7c; font-size: 12px; }
.day-log-empty { display: grid; min-height: 190px; place-content: center; gap: 7px; padding: 25px; color: #737c8d; font-size: 12px; line-height: 1.8; text-align: center; }
.day-log-card .day-log-empty { display: block; min-height: 0; margin: 0; padding: 16px 0 10px; color: #8d98aa; font-size: 12px; line-height: 1.8; text-align: left; }
.day-log-empty b { color: #626b7c; font-size: 14px; font-weight: 500; }
#worklog-member-filter { width: 155px; min-height: 34px; font-size: 12px; }

/* The assistant keeps context options within the composer. */
.chat-messages:has(> .assistant-minimal-empty) { display: flex; align-items: stretch; flex-direction: column; }
.assistant-minimal-empty { display: flex; flex: 0 0 auto; align-items: center; justify-content: center; flex-direction: column; min-width: 0; width: 100%; min-height: 0; margin-block: auto; padding: 8px 20px; text-align: center; }
.assistant-minimal-empty h2 { color: #364152; font-size: 22px; font-weight: 500; letter-spacing: -.3px; }
.assistant-minimal-empty p { max-width: 390px; margin-top: 10px; color: #737c8d; font-size: 13px; line-height: 1.9; }
.assistant-workspace .chat-panel > .panel-header { min-height: 57px; padding-top: 13px; padding-bottom: 13px; }
.assistant-workspace .chat-panel > .panel-header h2 { font-size: 14px; }
.assistant-workspace .chat-panel > .panel-header p { margin-top: 2px; font-size: 12px; }
.compose-contexts-disclosure { margin-bottom: 11px; }
.compose-contexts-disclosure > summary { display: flex; align-items: center; gap: 6px; width: max-content; padding: 3px 0; color: #737c8d; font-size: 12px; list-style: none; cursor: pointer; }
.compose-contexts-disclosure > summary::-webkit-details-marker { display: none; }
.compose-contexts-disclosure > summary::after { width: 6px; height: 6px; margin: -3px 3px 0 3px; border-right: 1px solid #a7b5cd; border-bottom: 1px solid #a7b5cd; content: ""; transform: rotate(45deg); transition: transform var(--motion-fast) ease; }
.compose-contexts-disclosure[open] > summary::after { margin-top: 3px; transform: rotate(225deg); }
.compose-contexts-disclosure .chat-contexts { margin: 11px 0 4px; padding: 11px 13px; border: 1px solid #e8edf5; border-radius: 10px; background: #fafbfd; }
.inline-model-hint { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 7px; padding: 12px 17px 15px; color: #737c8d; font-size: 12px; line-height: 1.7; text-align: center; }
.inline-model-hint .btn, .inline-model-hint .link-btn { min-height: 24px; padding: 1px 3px; color: #737c8d; font-size: 12px; }
.account-grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(290px, .8fr); align-items: start; gap: 22px; }

/* Repository discovery keeps previews within a safe, local scroll region. */
.github-tabs { margin-bottom: 22px; }
.discovery-toolbar { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; margin-bottom: 15px; }
.discovery-toolbar .search-field { flex: 1 1 270px; max-width: 530px; }
.discovery-note { margin-bottom: 19px; color: #737c8d; font-size: 12px; line-height: 1.9; }
.repo-discovery-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: stretch; gap: 15px; }
.discovery-card { display: flex; min-width: 0; flex-direction: column; padding: 19px; border-radius: 16px; }
.discovery-card > header, .discovery-card-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; margin-bottom: 13px; }
.discovery-card h2, .discovery-card h3 { min-width: 0; color: #626b7c; font-size: 14px; font-weight: 550; line-height: 1.6; }
.discovery-card h2 a, .discovery-card h3 a { color: inherit; overflow-wrap: anywhere; }
.discovery-stats { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin: 11px 0; color: #737c8d; font-size: 12px; }
.discovery-stats > span { display: inline-flex; align-items: center; gap: 4px; }
.discovery-stats .icon { width: 13px; height: 13px; }
.discovery-card > p, .discovery-description { margin-bottom: 14px; color: #737c8d; font-size: 13px; line-height: 1.85; overflow-wrap: anywhere; }
.discovery-topics { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 17px; }
.discovery-topics > span { display: inline-flex; padding: 2px 7px; border: 1px solid #e6edf8; border-radius: 999px; background: #f8fafe; color: #737c8d; font-size: 11px; }
.discovery-card > .actions { margin-top: auto; padding-top: 3px; }
.repo-preview-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 17px; margin-bottom: 15px; padding-bottom: 15px; border-bottom: 1px solid var(--line); color: #737c8d; font-size: 12px; }
.repo-preview-meta a { color: #737c8d; }
.readme-preview { min-width: 0; }
.readme-preview pre { max-height: min(55vh, 600px); overflow: auto; margin: 12px 0 0; padding: 17px; border: 1px solid #e5edf8; border-radius: 12px; background: #f9fbfe; color: #737c8d; font: 12px/1.9 ui-monospace, SFMono-Regular, Consolas, monospace; white-space: pre-wrap; overflow-wrap: anywhere; tab-size: 2; }

.readme-article { max-height: min(55vh, 600px); overflow: auto; padding: 18px 20px; border: 1px solid #e5eaf2; border-radius: 12px; background: #fbfcfe; color: #596474; font-size: 13px; line-height: 1.85; overflow-wrap: anywhere; }
.readme-article h1, .readme-article h2, .readme-article h3, .readme-article h4 { margin: 21px 0 9px; color: #364152; font-weight: 600; line-height: 1.5; }
.readme-article h1 { font-size: 23px; }
.readme-article h2 { font-size: 19px; }
.readme-article h3 { font-size: 16px; }
.readme-article h4 { font-size: 14px; }
.readme-article > :first-child { margin-top: 0; }
.readme-article p, .readme-article ul, .readme-article ol, .readme-article blockquote { margin: 0 0 13px; }
.readme-article ul, .readme-article ol { padding-left: 22px; }
.readme-article li { margin-bottom: 5px; }
.readme-article blockquote { padding: 8px 13px; border-left: 3px solid #cbd4e6; background: #f3f5f9; border-radius: 0 8px 8px 0; }
.readme-article blockquote p:last-child { margin-bottom: 0; }
.readme-article a { color: #5364a6; text-decoration: underline; text-underline-offset: 3px; }
.readme-article code { padding: 2px 4px; border-radius: 4px; background: #eef1f6; font: 12px/1.7 ui-monospace, SFMono-Regular, Consolas, monospace; }
.readme-article pre { max-height: none; margin: 12px 0; padding: 12px; background: #f3f5f9; }
.readme-article pre code { padding: 0; background: none; }

.clipboard-helper { position: fixed; top: -1000px; left: -1000px; width: 1px; height: 1px; overflow: hidden; opacity: 0; pointer-events: none; }
.mobile-brand { display: none; }
.mt-5 { margin-top: 5px; }
.mt-9 { margin-top: 9px; }
.mt-10 { margin-top: 10px; }
.mt-12 { margin-top: 12px; }
.mt-18 { margin-top: 18px; }
.mt-20 { margin-top: 20px; }
.bottom-border { border-bottom: 1px solid var(--line); }
.week-select { width: 170px; min-height: 34px; font-size: 12px; }
.amber-text { color: var(--amber); }
.checkbox-field { padding-top: 28px; }
@media (min-width: 1550px) {
  main { padding: 33px 36px 44px; }
  .topbar { padding-right: 36px; padding-left: 36px; }
  .board-layout { grid-template-columns: minmax(0, 1fr) 370px; }
  .board-layout > .requirement-detail { position: sticky; top: 77px; max-height: calc(100vh - 94px); }
  .overview-focus, .dashboard-grid { grid-template-columns: minmax(0, 1fr) 350px; gap: 24px; }
}
@media (max-width: 1180px) {
  .sidebar { width: 205px; }
  .main-shell { margin-left: 213px; }
  .topbar { padding-right: 24px; padding-left: 24px; }
  main { padding: 25px 24px 36px; }
  .overview-focus, .dashboard-grid { grid-template-columns: minmax(0, 1fr) 280px; gap: 17px; }
  .requirements-layout { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 13px; }
  .requirement-row { grid-template-columns: minmax(0, 1fr) 73px 24px; gap: 7px; padding-right: 12px; padding-left: 12px; }
  .req-owner .avatar { width: 22px; height: 22px; }
  .report-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .detail-head, .detail-block, .detail-actions { padding-right: 15px; padding-left: 15px; }
  .progress-track { padding-right: 13px; padding-left: 13px; gap: 2px; }
  .progress-step { font-size: 11px; }
  .settings-grid { grid-template-columns: minmax(0, 1fr) 280px; gap: 18px; }
  .chat-layout { grid-template-columns: minmax(0, 1fr) 220px; gap: 16px; }
  .filter-bar { gap: 10px 14px; }
  .compact-filter select { min-width: 88px; }
  .calendar-layout { grid-template-columns: minmax(0, 1fr) 275px; gap: 15px; }
  .work-calendar { padding: 17px; }
  .calendar-day { min-height: 84px; padding-right: 7px; padding-left: 7px; }
  .calendar-hours { font-size: 13px; }
  .repo-discovery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 980px) {
  .sidebar { width: 190px; }
  .main-shell { margin-left: 198px; }
  .overview-focus, .dashboard-grid, .settings-grid, .chat-layout, .requirements-layout { grid-template-columns: minmax(0, 1fr); }
  .dashboard-grid > .spaced:last-child { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dashboard-grid > .spaced:last-child > .quick-links { grid-column: 1 / -1; }
  .quick-links { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .requirement-detail { position: static; max-height: none; }
  .detail-actions { top: 60px; }
  .requirement-row { grid-template-columns: minmax(0, 1fr) 84px 27px; padding: 15px; }
  .sync-label, .period-label { display: none; }
  .chat-layout > .spaced { grid-row: 1; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 15px; }
  .chat-layout > .spaced > .notice { grid-column: 1 / -1; }
  .assistant-workspace .chat-panel { height: auto; }
  .chat-messages { max-height: 510px; }
  .prompt-grid { grid-template-columns: minmax(0, 1fr); }
  .prompt-card { min-height: 0; }
  .team-report-grid, .report-card-grid { grid-template-columns: minmax(0, 1fr); }
  .report-progress { align-items: flex-start; flex-direction: column; gap: 15px; }
  .github-repos { grid-template-columns: minmax(0, 1fr); }
  .auth-page:has(> .auth-aside) { grid-template-columns: minmax(280px, 40%) minmax(0, 1fr); }
  .auth-aside { padding: 35px 28px; }
  .auth-wordmark h2 { font-size: 26px; }
  .auth-main { padding: 35px; }
  .calendar-layout, .account-grid { grid-template-columns: minmax(0, 1fr); }
  .day-summary { position: static; }
  .day-log-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .calendar-day { min-height: 91px; padding-right: 10px; padding-left: 10px; }
  .calendar-hours { font-size: 14px; }
}
@media (max-width: 760px) {
  .app-shell { padding: 0; }
  .sidebar { position: static; width: 100%; padding: 14px 15px 10px; border: 0; border-bottom: 1px solid #e1e9f5; border-radius: 0; }
  .sidebar .brand { padding: 0 3px 16px; }
  .nav-shortcut, .nav-label, .nav-divider, .sidebar-bottom { display: none; }
  .nav { display: flex; gap: 4px; overflow-x: auto; scrollbar-width: none; }
  .nav::-webkit-scrollbar { display: none; }
  .nav-item { width: auto; min-height: 36px; flex: 0 0 auto; gap: 7px; padding: 7px 10px; font-size: 13px; }
  .nav-item > .icon, .nav-icon, .nav-icon .icon { width: 16px; height: 16px; }
  .nav-count { display: none; }
  .main-shell { min-height: 80vh; margin-left: 0; overflow: clip; border: 0; border-radius: 0; }
  .topbar { top: 0; height: 48px; padding: 0 17px; }
  .breadcrumbs { gap: 7px; font-size: 11px; }
  .topbar-actions { gap: 8px; }
  .topbar .btn { font-size: 11px; }
  main { padding: 24px 17px 32px; }
  .page-head { align-items: flex-start; flex-direction: column; gap: 16px; margin-bottom: 23px; }
  .page-head h1 { font-size: 23px; }
  .overview-intro { align-items: flex-start; gap: 15px; }
  .overview-team { flex-wrap: wrap; }
  .greeting { font-size: 20px; }
  .overview-date { display: none; }
  .overview-summary, .metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .metric { padding: 15px; }
  .metric:nth-child(even) { border-right: 0; }
  .metric:nth-child(-n+2) { border-bottom: 1px solid #e3ebf6; }
  .metric-value { font-size: 24px; }
  .dashboard-grid > .spaced:last-child, .overview-bottom-grid, .quick-links { grid-template-columns: minmax(0, 1fr); }
  .task-row { flex-wrap: wrap; gap: 10px; padding: 14px; }
  .task-row .btn { margin-left: 41px; }
  .task-kind { display: none; }
  .requirement-controls { gap: 12px; }
  .requirements-tabs { gap: 1px; }
  .requirements-tabs > button, .tab { padding-right: 8px; padding-left: 8px; font-size: 12px; }
  .segmented { margin-left: auto; }
  .filter-bar { gap: 11px; padding: 12px; }
  .filter-bar > .search-field { flex-basis: 100%; }
  .compact-filter { flex: 1 1 120px; justify-content: space-between; gap: 5px; }
  .compact-filter select { min-width: 0; width: 90px; }
  .search-field, .search-input { width: 100%; }
  .requirement-row { grid-template-columns: minmax(0, 1fr) 71px 23px; gap: 7px; padding-right: 12px; padding-left: 12px; }
  .req-row-title { white-space: normal; }
  .req-row-meta { gap: 5px; }
  .req-owner .avatar { width: 21px; height: 21px; }
  .detail-empty { min-height: 270px; }
  .detail-actions { top: 48px; }
  .detail-head h2 { font-size: 16px; }
  .detail-meta { gap: 14px 10px; }
  .progress-track { padding: 13px 11px; gap: 2px; }
  .progress-step { font-size: 11px; }
  .kanban-board { grid-template-columns: repeat(6, 220px); gap: 10px; }
  .kanban-column { min-height: 270px; }
  .assistant-workspace .chat-panel { min-height: 590px; }
  .github-onboarding { padding: 30px 20px 23px; }
  .connection-steps { grid-template-columns: minmax(0, 1fr); gap: 21px; margin-top: 27px; padding-top: 23px; }
  .connection-step { display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: 0 11px; }
  .connection-step > span { grid-row: span 2; margin: 0; }
  .connection-step p { margin-top: 5px; }
  .chat-layout > .spaced { grid-template-columns: minmax(0, 1fr); }
  .chat-messages { min-height: 300px; max-height: 470px; padding: 20px 16px; }
  .assistant-empty { padding: 20px 0; }
  .assistant-empty h2 { font-size: 19px; }
  .prompt-grid { gap: 8px; margin-top: 20px; }
  .prompt-card { padding: 12px; }
  .chat-message { gap: 9px; }
  .chat-message.user .chat-message-content { padding: 10px 12px; }
  .chat-compose { padding: 14px; }
  .chat-contexts { gap: 10px 14px; }
  .compose-context-bar { gap: 9px; }
  .compose-footer { align-items: flex-start; }
  .compose-footer .hint { max-width: 200px; }
  .modal-backdrop { padding: 12px; }
  .modal { max-height: calc(100vh - 24px); border-radius: 20px; }
  .modal-head { padding: 20px 19px 17px; }
  .modal-body { padding: 19px; }
  .modal-foot { padding: 13px 19px; }
  .modal-head h2 { font-size: 18px; }
  .form-grid { grid-template-columns: minmax(0, 1fr); }
  .field.full { grid-column: auto; }
  .checkbox-field { padding-top: 0; }
  .auth-page:has(> .auth-aside) { display: block; }
  .auth-aside { display: none; }
  .auth-main { min-height: 100vh; padding: 35px 25px; }
  .auth-card { padding: 27px; }
  .command-backdrop { padding-top: 65px; }
  .command-dialog { max-height: 78vh; }
  .command-search { min-height: 56px; padding: 0 15px; }
  .command-search input { min-height: 54px; }
  .command-result .command-key { display: none; }
  .event-time { max-width: 75px; font-size: 11px; white-space: normal; text-align: right; }
  .toast-region { right: 16px; bottom: 16px; }
  .sidebar, .main-shell { border-radius: 0; }
  .modal { border-radius: 20px; }
  .calendar-header { gap: 11px; }
  .calendar-header h2 { font-size: 17px; }
  .calendar-header .actions { gap: 4px; }
  .calendar-header .btn { min-height: 29px; padding: 5px 7px; font-size: 11px; }
  .work-calendar { padding: 15px 12px; }
  .calendar-summary { gap: 8px 15px; margin-bottom: 15px; padding-bottom: 14px; }
  .calendar-summary b, .calendar-summary strong { font-size: 17px; }
  .calendar-weekdays { margin-bottom: 6px; font-size: 11px; }
  .calendar-grid { gap: 4px; }
  .calendar-day { min-height: 76px; padding: 6px 4px; border-radius: 9px; }
  .calendar-date { width: 21px; height: 21px; font-size: 11px; }
  .calendar-date small { display: none; }
  .calendar-hours { margin-top: 7px; font-size: 12px; }
  .calendar-count { margin-top: 2px; font-size: 11px; }
  .calendar-legend { gap: 4px; font-size: 11px; }
  .calendar-legend > small { max-width: 110px; margin-left: 5px; font-size: 11px; text-align: right; }
  .calendar-summary > label { margin-left: 0; }
  .heat-key { width: 11px; height: 11px; border-radius: 3px; }
  .day-log-list, .repo-discovery-grid { grid-template-columns: minmax(0, 1fr); }
  .reports-view-tabs { margin-bottom: 17px; }
  #worklog-member-filter { width: 145px; }
  .assistant-minimal-empty { padding: 12px 10px; }
  .assistant-minimal-empty h2 { font-size: 21px; }
  .assistant-minimal-empty p { max-width: 270px; font-size: 13px; }
  .compose-contexts-disclosure .chat-contexts { gap: 12px 14px; padding: 12px; }
  .inline-model-hint { padding-right: 14px; padding-left: 14px; }
  .discovery-toolbar .search-field { max-width: none; }
  .discovery-card { padding: 17px; }
  .repo-preview-meta { gap: 8px 13px; }
  .readme-preview pre { max-height: 52vh; padding: 13px; font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; }
}

/* Fit the full month and assistant content on shorter desktop windows. */
@media (min-width: 981px) and (max-height: 800px) {
  .reports-view-tabs { margin-bottom: 14px; }
  .work-calendar { padding: 14px 16px; }
  .calendar-header { gap: 8px; margin-bottom: 6px; }
  .calendar-header h2 { font-size: 17px; line-height: 1.3; }
  .calendar-header p { font-size: 11px; line-height: 1.3; }
  .calendar-header .btn { min-height: 28px; padding-top: 4px; padding-bottom: 4px; }
  .calendar-summary { gap: 7px 17px; margin-bottom: 7px; padding-bottom: 6px; }
  .calendar-summary b, .calendar-summary strong { font-size: 17px; line-height: 1.3; }
  #worklog-member-filter { min-height: 28px; padding-top: 3px; padding-bottom: 3px; }
  .calendar-weekdays { margin-bottom: 4px; line-height: 16px; }
  .calendar-weekdays > span { padding: 0; }
  .calendar-grid { gap: 4px; }
  .calendar-day { min-height: 50px; padding: 5px 8px; border-radius: 9px; }
  .calendar-date { min-width: 19px; height: 19px; font-size: 11px; }
  .calendar-hours { margin-top: 2px; font-size: 12px; line-height: 16px; }
  .calendar-no-log { margin-top: 2px; font-size: 12px; line-height: 16px; }
  .calendar-count { display: none; }
  .calendar-legend { margin-top: 6px; line-height: 16px; }
  .calendar-legend small { font-size: 11px; line-height: 16px; }
  .chat-messages { padding: 14px 24px; }
  .assistant-empty { padding: 0; }
  .assistant-empty > .assistant-hero-icon, .assistant-empty > .section-kicker, .assistant-empty > p { display: none; }
  .assistant-empty h2 { font-size: 18px; }
  .prompt-grid { margin-top: 12px; }
  .prompt-card { min-height: 96px; gap: 6px; padding: 10px 13px; }
  .prompt-card > span { display: none; }
}

/* Full-size style comparisons use the same live workspace data. */
.style-preview-page { display: grid; gap: 18px; }
.style-preview-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; }
.style-preview-heading h1 { color: #293242; font-size: 23px; font-weight: 600; line-height: 1.4; }
.style-preview-heading p, .style-preview-caption > div > p { margin-top: 5px; color: #737c8d; font-size: 12px; }
.style-preview-heading .eyebrow { margin-bottom: 5px; }
.style-look-switcher { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
.style-look-tab { display: flex; align-items: center; gap: 9px; min-width: 0; min-height: 45px; padding: 8px 11px; border: 1px solid #e4e8ef; border-radius: 11px; background: #fff; color: #566174; text-align: left; font-size: 12px; transition: border-color .16s, background .16s, color .16s, transform .16s; }
.style-look-tab:hover { border-color: #c5cfdd; transform: translateY(-1px); }
.style-look-tab.active { border-color: #4b68b1; background: #f1f5ff; color: #254f9c; font-weight: 600; }
.style-look-swatch { width: 25px; height: 25px; flex: 0 0 auto; border: 1px solid #dfe4eb; border-radius: 7px; background: linear-gradient(135deg, #fff 0 53%, #eaf0fd 53%); box-shadow: inset 8px 0 #e9ecf2; }
.swatch-product { border-color: #273340; background: linear-gradient(135deg, #f6f8f8 0 49%, #a9d5cb 49%); box-shadow: inset 8px 0 #26323c; }
.swatch-studio { border-color: #eadbd5; background: linear-gradient(135deg, #fff 0 48%, #df7660 48%); box-shadow: inset 8px 0 #d9eee4; }
.swatch-dark { border-color: #39414b; background: linear-gradient(135deg, #2a3038 0 50%, #66d1c3 50%); box-shadow: inset 8px 0 #1d2229; }
.swatch-apple { border-color: #d2d2d7; background: linear-gradient(135deg, #fbfbfd 0 53%, #007aff 53%); box-shadow: inset 8px 0 #f5f5f7; }
.style-look-tab.active[data-look="apple"] { border-color: #007aff; background: #edf5ff; color: #0066cc; }
.style-preview-caption { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 57px; }
.style-preview-title-row { display: flex; align-items: center; gap: 9px; }
.style-preview-title-row h2 { color: #293242; font-size: 15px; }
.style-choice-tag { display: inline-flex; align-items: center; min-height: 21px; padding: 2px 7px; border-radius: 999px; background: #eaf5f1; color: #24735f; font-size: 10px; }
.style-settings-panel .panel-header > .task-icon { width: 32px; height: 32px; }
.style-settings-panel .form-actions { margin-top: 15px; }
.style-mock { --mock-bg: #f3f5f8; --mock-side: #fff; --mock-surface: #fff; --mock-ink: #243044; --mock-muted: #7a8494; --mock-border: #e4e8ef; --mock-accent: #285fce; --mock-accent-soft: #edf3ff; --mock-good: #168170; --mock-good-soft: #e9f5f1; --mock-warm: #d67a39; --mock-warm-soft: #fff1e4; --mock-shadow: 0 7px 24px #172a430d; display: grid; grid-template-columns: 194px minmax(0, 1fr); min-width: 0; min-height: 510px; overflow: hidden; border: 1px solid var(--mock-border); border-radius: 14px; background: var(--mock-bg); color: var(--mock-ink); box-shadow: var(--mock-shadow); animation: style-preview-in .22s ease both; }
.style-mock[data-look="product"] { --mock-bg: #eef1f3; --mock-side: #1e2933; --mock-surface: #fff; --mock-ink: #26333c; --mock-muted: #7a8790; --mock-border: #dbe1e4; --mock-accent: #14766f; --mock-accent-soft: #e5f2ef; --mock-good: #137365; --mock-good-soft: #e3f1ed; --mock-warm: #bb6e2d; --mock-warm-soft: #fff1e2; --mock-shadow: 0 7px 24px #13212b12; }
.style-mock[data-look="studio"] { --mock-bg: #eef5f1; --mock-side: #fff; --mock-surface: #fff; --mock-ink: #293a36; --mock-muted: #7b8984; --mock-border: #dce9e2; --mock-accent: #d75f4d; --mock-accent-soft: #fff0eb; --mock-good: #19775e; --mock-good-soft: #e9f5ef; --mock-warm: #c67836; --mock-warm-soft: #fff2e6; --mock-shadow: 0 7px 24px #214b3810; }
.style-mock[data-look="dark"] { color-scheme: dark; --mock-bg: #171b20; --mock-side: #20252c; --mock-surface: #262c34; --mock-ink: #edf1f4; --mock-muted: #a0aab4; --mock-border: #39414a; --mock-accent: #68d1c3; --mock-accent-soft: #243a3a; --mock-good: #77d6b7; --mock-good-soft: #253a35; --mock-warm: #f2ad68; --mock-warm-soft: #42342a; --mock-shadow: 0 7px 26px #0005; }
.style-mock-sidebar { display: flex; flex-direction: column; min-width: 0; padding: 18px 12px 12px; border-right: 1px solid var(--mock-border); background: var(--mock-side); }
.style-mock-brand { display: flex; align-items: center; gap: 9px; padding: 0 4px 23px; color: var(--mock-ink); }
.style-mock-brand > span { display: grid; width: 29px; height: 29px; place-items: center; border-radius: 7px; background: var(--mock-ink); color: var(--mock-side); font-size: 17px; font-weight: 700; }
.style-mock-brand b, .style-mock-brand small { display: block; }
.style-mock-brand b { font-size: 13px; line-height: 1.3; }
.style-mock-brand small { margin-top: 2px; color: var(--mock-muted); font-size: 9px; font-weight: 400; }
.style-mock-nav-label { margin: 0 8px 7px; color: var(--mock-muted); font-size: 9px; }
.style-mock-nav { display: flex; align-items: center; gap: 9px; min-height: 33px; padding: 6px 8px; border-radius: 7px; color: var(--mock-muted); font-size: 10px; }
.style-mock-nav.active { background: var(--mock-accent-soft); color: var(--mock-accent); font-weight: 600; }
.style-mock-nav .icon { width: 15px; height: 15px; }
.style-mock-account { display: flex; align-items: center; gap: 8px; margin-top: auto; padding: 12px 3px 0; border-top: 1px solid var(--mock-border); }
.style-mock-account > span:last-child { min-width: 0; }
.style-mock-account b, .style-mock-account small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.style-mock-account b { font-size: 10px; }
.style-mock-account small { margin-top: 2px; color: var(--mock-muted); font-size: 9px; }
.style-mock-main { min-width: 0; background: var(--mock-bg); }
.style-mock-topbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 48px; padding: 0 22px; border-bottom: 1px solid var(--mock-border); background: var(--mock-surface); color: var(--mock-muted); font-size: 10px; }
.style-mock-topbar > span:last-child { display: flex; align-items: center; gap: 12px; white-space: nowrap; }
.style-mock-topbar b { color: var(--mock-ink); font-weight: 550; }
.style-mock-content { min-width: 0; padding: 22px; }
.style-mock-greeting { display: flex; align-items: flex-end; justify-content: space-between; gap: 15px; margin-bottom: 17px; }
.style-mock-kicker { color: var(--mock-muted); font-size: 9px; }
.style-mock-greeting h3 { margin-top: 3px; color: var(--mock-ink); font-size: 20px; font-weight: 600; }
.style-mock-greeting p { margin-top: 4px; color: var(--mock-muted); font-size: 10px; }
.style-mock-team { display: flex; align-items: center; padding-bottom: 2px; }
.style-mock-team .avatar { width: 23px; height: 23px; border-color: var(--mock-surface); background: var(--mock-accent-soft); color: var(--mock-accent); font-size: 9px; }
.style-mock-team .avatar + .avatar { margin-left: -6px; box-shadow: 0 0 0 2px var(--mock-bg); }
.style-mock-team small { margin-left: 7px; color: var(--mock-muted); font-size: 9px; white-space: nowrap; }
.style-mock-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); overflow: hidden; margin-bottom: 15px; border: 1px solid var(--mock-border); border-radius: 9px; background: var(--mock-surface); }
.style-mock-metrics > div { display: flex; flex-direction: column; min-width: 0; min-height: 90px; padding: 12px 14px; border-right: 1px solid var(--mock-border); }
.style-mock-metrics > div:last-child { border-right: 0; }
.style-mock-metrics span { color: var(--mock-muted); font-size: 9px; }
.style-mock-metrics b { margin-top: 5px; color: var(--mock-ink); font-size: 22px; font-weight: 600; line-height: 1.2; font-variant-numeric: tabular-nums; }
.style-mock-metrics b small { margin-left: 3px; color: var(--mock-muted); font-size: 9px; font-weight: 400; }
.style-mock-metrics i { margin-top: auto; color: var(--mock-good); font-size: 9px; font-style: normal; }
.style-mock-columns { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(210px, .9fr); gap: 13px; }
.style-mock-surface { min-width: 0; overflow: hidden; border: 1px solid var(--mock-border); border-radius: 9px; background: var(--mock-surface); }
.style-mock-surface > header { display: flex; align-items: center; justify-content: space-between; gap: 9px; min-height: 47px; padding: 8px 12px; border-bottom: 1px solid var(--mock-border); }
.style-mock-surface > header > span:first-child b, .style-mock-surface > header > span:first-child small { display: block; }
.style-mock-surface > header b { color: var(--mock-ink); font-size: 10px; font-weight: 600; }
.style-mock-surface > header small { margin-top: 2px; color: var(--mock-muted); font-size: 8px; }
.style-mock-link { color: var(--mock-accent); font-size: 8px; white-space: nowrap; }
.style-mock-row { display: flex; align-items: center; gap: 8px; min-width: 0; min-height: 52px; padding: 8px 11px; border-bottom: 1px solid var(--mock-border); }
.style-mock-row:last-child { border-bottom: 0; }
.style-mock-priority { width: 3px; height: 27px; flex: 0 0 auto; border-radius: 3px; background: var(--mock-good); }
.style-mock-priority.high { background: var(--mock-warm); }
.style-mock-row-copy { min-width: 0; flex: 1; }
.style-mock-row-copy b, .style-mock-row-copy small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.style-mock-row-copy b { color: var(--mock-ink); font-size: 9px; font-weight: 550; }
.style-mock-row-copy small { margin-top: 3px; color: var(--mock-muted); font-size: 8px; }
.style-mock .status-pill { min-height: 18px; padding: 1px 5px; border-color: var(--mock-border); background: var(--mock-bg); color: var(--mock-muted); font-size: 8px; }
.style-mock .status-approval, .style-mock .status-accept { border-color: color-mix(in srgb, var(--mock-warm) 26%, transparent); background: var(--mock-warm-soft); color: var(--mock-warm); }
.style-mock .status-ready, .style-mock .status-live { border-color: color-mix(in srgb, var(--mock-good) 25%, transparent); background: var(--mock-good-soft); color: var(--mock-good); }
.style-mock .status-dev { border-color: color-mix(in srgb, var(--mock-accent) 25%, transparent); background: var(--mock-accent-soft); color: var(--mock-accent); }
.style-mock-empty { padding: 22px 12px; color: var(--mock-muted); font-size: 9px; text-align: center; }
.style-mini-chart { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; height: 93px; padding: 13px 12px 7px; border-bottom: 1px solid var(--mock-border); }
.style-mini-chart > div { display: flex; flex-direction: column; align-items: center; gap: 5px; min-width: 0; }
.style-mini-bar { display: flex; align-items: flex-end; justify-content: center; width: 100%; height: 58px; overflow: hidden; border-radius: 3px; background: var(--mock-bg); }
.style-mini-bar i { display: block; width: min(14px, 72%); min-height: 3px; border-radius: 3px 3px 1px 1px; background: var(--mock-accent); }
.style-mini-chart small { color: var(--mock-muted); font-size: 8px; }
.style-mock-section-label { padding: 9px 11px 3px; color: var(--mock-muted); font-size: 8px; }
.style-mock-member { display: flex; align-items: center; gap: 7px; padding: 5px 11px; }
.style-mock-member .avatar { width: 20px; height: 20px; background: var(--mock-accent-soft); color: var(--mock-accent); font-size: 8px; }
.style-mock-member > span:nth-child(2) { min-width: 0; flex: 1; }
.style-mock-member b, .style-mock-member small { display: block; }
.style-mock-member b { color: var(--mock-ink); font-size: 8px; font-weight: 500; }
.style-mock-member small { color: var(--mock-muted); font-size: 8px; }
.style-mock-member i { width: 6px; height: 6px; border-radius: 50%; background: var(--mock-warm); }
.style-mock-member i.done { background: var(--mock-good); }
.style-mock-repo-count { display: flex; align-items: center; justify-content: space-between; gap: 7px; margin: 7px 10px 9px; padding: 7px 8px; border-radius: 6px; background: var(--mock-bg); color: var(--mock-muted); font-size: 8px; }
.style-mock-repo-count span { display: flex; align-items: center; gap: 5px; }
.style-mock-repo-count .icon { width: 13px; height: 13px; }
.style-mock-repo-count b { color: var(--mock-ink); font-size: 9px; }
.style-mock-footnote { margin-top: 10px; color: var(--mock-muted); font-size: 8px; }
.style-mock[data-look="product"] .style-mock-sidebar { color: #aab5be; }
.style-mock[data-look="product"] .style-mock-nav.active { background: #2c3a43; color: #72c4b3; }
.style-mock[data-look="product"] .style-mock-brand > span { background: #a9d5cb; color: #1c2931; }
.style-mock[data-look="product"] .style-mock-brand { color: #f0f3f5; }
.style-mock[data-look="product"] .style-mock-account { border-color: #35414a; }
.style-mock[data-look="studio"] .style-mock-content { padding: 25px 26px; }
.style-mock[data-look="studio"] .style-mock-greeting h3 { font-size: 23px; }
.style-mock[data-look="studio"] .style-mock-metrics { border: 0; gap: 8px; overflow: visible; background: transparent; }
.style-mock[data-look="studio"] .style-mock-metrics > div { min-height: 86px; border: 1px solid var(--mock-border); border-radius: 9px; background: var(--mock-surface); }
.style-mock[data-look="studio"] .style-mock-metrics > div:first-child { border-top: 3px solid var(--mock-accent); }
.style-mock[data-look="dark"] .style-mock-brand > span { background: var(--mock-accent); color: #17201f; }
.style-mock[data-look="dark"] .style-mock-nav.active { background: #2d3a3e; }
.style-mock[data-look="dark"] .style-mock-topbar { background: var(--mock-side); }
.style-mock[data-look="dark"] .avatar { border-color: var(--mock-border); background: var(--mock-accent-soft); color: var(--mock-accent); }
.style-mock[data-look="apple"] { --mock-bg: #fff; --mock-side: #f5f5f7; --mock-surface: #fff; --mock-ink: #1d1d1f; --mock-muted: #6e6e73; --mock-border: #e5e5ea; --mock-accent: #007aff; --mock-accent-soft: #e8f2ff; --mock-good: #248a3d; --mock-good-soft: #e9f6ec; --mock-warm: #bf6900; --mock-warm-soft: #fff4e5; --mock-shadow: 0 8px 28px #1d1d1f12; grid-template-columns: 214px minmax(0, 1fr); grid-template-rows: 44px minmax(0, 1fr); min-height: 650px; border-radius: 13px; font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", sans-serif; }
.style-mock[data-look="apple"]::before { display: none; content: none; }
.apple-window-bar { display: grid; grid-column: 1 / -1; grid-row: 1; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; min-width: 0; padding: 0 14px; border-bottom: 1px solid #e5e5ea; background: #f5f5f7; color: #6e6e73; font-size: 12px; }
.apple-window-bar > b { color: #424245; font-size: 12px; font-weight: 550; }
.apple-window-controls { display: flex; align-items: center; gap: 8px; }
.apple-window-controls i { width: 12px; height: 12px; border: 1px solid #00000017; border-radius: 50%; background: #ff5f57; }
.apple-window-controls i:nth-child(2) { background: #febc2e; }
.apple-window-controls i:nth-child(3) { background: #28c840; }
.apple-window-meta { display: flex; align-items: center; justify-content: flex-end; gap: 12px; min-width: 0; white-space: nowrap; }
.apple-window-meta > span { display: flex; align-items: center; gap: 5px; color: #424245; }
.apple-window-meta .avatar { width: 22px; height: 22px; background: #e8f2ff; color: #0066cc; }
.style-mock[data-look="apple"] .style-mock-main { grid-column: 2; grid-row: 2; overflow: auto; background: #fff; }
.style-mock[data-look="apple"] .style-mock-sidebar { grid-column: 1; grid-row: 2; align-items: stretch; padding: 14px 10px 12px; border-color: #e5e5ea; background: #f5f5f7; }
.apple-sidebar-brand { display: flex; align-items: center; gap: 8px; padding: 0 7px 17px; color: #3a3a3c; font-size: 12px; font-weight: 600; }
.apple-sidebar-brand > span { display: grid; width: 24px; height: 24px; place-items: center; border-radius: 7px; background: #007aff; color: #fff; font-size: 14px; font-weight: 650; }
.apple-source-group { margin: 9px 8px 5px; color: #8a8a8e; font-size: 10px; font-weight: 550; }
.style-mock[data-look="apple"] .style-mock-nav { width: auto; min-height: 32px; justify-content: flex-start; padding: 5px 8px; border-radius: 7px; color: #515154; font-size: 12px; }
.style-mock[data-look="apple"] .style-mock-nav .icon { width: 15px; height: 15px; }
.style-mock[data-look="apple"] .style-mock-nav.active { background: #e2e2e7; color: #1d1d1f; font-weight: 600; }
.style-mock[data-look="apple"] .style-mock-account { gap: 7px; padding: 11px 6px 0; border-color: #dedee3; }
.style-mock[data-look="apple"] .style-mock-account .avatar { background: #e8f2ff; color: #0066cc; }
.style-mock[data-look="apple"] .style-mock-account b { color: #3a3a3c; font-size: 11px; }
.style-mock[data-look="apple"] .style-mock-account small { color: #8a8a8e; font-size: 10px; }
.style-mock[data-look="apple"] .style-mock-content { min-height: 100%; padding: 27px 30px 20px; background: #fff; }
.apple-welcome { display: flex; align-items: flex-end; justify-content: space-between; gap: 14px; }
.apple-welcome h3 { margin-top: 4px; color: #1d1d1f; font-size: 25px; font-weight: 650; }
.apple-welcome p { margin-top: 4px; color: #6e6e73; font-size: 13px; }
.apple-team-avatars { display: flex; align-items: center; padding-bottom: 3px; }
.apple-team-avatars .avatar { width: 25px; height: 25px; border-color: #fff; background: #e8f2ff; color: #0066cc; font-size: 10px; }
.apple-team-avatars .avatar + .avatar { margin-left: -6px; }
.apple-team-avatars small { margin-left: 8px; color: #6e6e73; font-size: 11px; white-space: nowrap; }
.apple-summary-strip { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 19px 0 20px; padding: 13px 0; border-block: 1px solid #e5e5ea; }
.apple-summary-strip > div { display: flex; min-width: 0; flex-direction: column; padding: 0 14px; border-right: 1px solid #e5e5ea; }
.apple-summary-strip > div:first-child { padding-left: 0; }
.apple-summary-strip > div:last-child { padding-right: 0; border-right: 0; }
.apple-summary-strip span { color: #6e6e73; font-size: 12px; }
.apple-summary-strip b { margin-top: 3px; color: #1d1d1f; font-size: 24px; font-weight: 620; line-height: 1.2; font-variant-numeric: tabular-nums; }
.apple-summary-strip b small { margin-left: 3px; color: #6e6e73; font-size: 12px; font-weight: 400; }
.apple-summary-strip i { margin-top: 3px; color: #6e6e73; font-size: 11px; font-style: normal; }
.apple-overview-grid { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(210px, .85fr); gap: 25px; }
.apple-overview-section { min-width: 0; }
.apple-overview-section > header { display: flex; align-items: center; justify-content: space-between; gap: 9px; min-height: 41px; border-bottom: 1px solid #e5e5ea; }
.apple-overview-section > header > span:first-child b, .apple-overview-section > header > span:first-child small { display: block; }
.apple-overview-section > header b { color: #1d1d1f; font-size: 14px; font-weight: 600; }
.apple-overview-section > header small { margin-top: 2px; color: #6e6e73; font-size: 11px; }
.apple-overview-section .style-mock-link { color: #007aff; font-size: 12px; }
.style-mock[data-look="apple"] .style-mock-row { min-height: 57px; padding: 8px 2px; border-color: #e5e5ea; }
.style-mock[data-look="apple"] .style-mock-row-copy b { color: #1d1d1f; font-size: 12px; font-weight: 550; }
.style-mock[data-look="apple"] .style-mock-row-copy small { margin-top: 2px; color: #6e6e73; font-size: 11px; }
.style-mock[data-look="apple"] .status-pill { border-radius: 6px; font-size: 10px; }
.apple-team-workload { padding-left: 21px; border-left: 1px solid #e5e5ea; }
.apple-team-workload .style-mini-chart { height: 84px; padding: 10px 2px 6px; border-color: #e5e5ea; }
.apple-team-workload .style-mini-bar { background: #f5f5f7; }
.apple-team-workload .style-mini-bar i { background: #007aff; }
.apple-team-workload .style-mini-chart small { color: #6e6e73; font-size: 10px; }
.apple-member-row { display: flex; align-items: center; gap: 8px; padding: 9px 0; border-bottom: 1px solid #f0f0f2; }
.apple-member-row > .avatar { width: 25px; height: 25px; background: #f1f1f4; color: #5b5b60; font-size: 10px; }
.apple-member-detail { display: grid; min-width: 0; flex: 1; grid-template-columns: minmax(0, 1fr) auto; align-items: center; column-gap: 6px; }
.apple-member-detail b { overflow: hidden; color: #424245; font-size: 11px; font-weight: 550; text-overflow: ellipsis; white-space: nowrap; }
.apple-member-detail small { grid-column: 1 / -1; color: #8a8a8e; font-size: 10px; }
.apple-member-row > strong { color: #424245; font-size: 11px; font-weight: 550; font-variant-numeric: tabular-nums; }
.apple-member-row > strong small { margin-left: 2px; color: #8a8a8e; font-size: 9px; }
.apple-member-meter { grid-column: 1 / -1; display: block; height: 3px; margin-top: 4px; overflow: hidden; border-radius: 3px; background: #e9e9ed; }
.apple-member-meter i { display: block; height: 100%; border-radius: inherit; background: #007aff; }
.apple-github-updates { margin-top: 18px; padding-top: 5px; border-top: 1px solid #e5e5ea; }
.apple-github-updates > header { border-bottom: 0; }
.apple-github-updates .style-code-row { padding: 8px 2px; }
.style-mock[data-look="apple"] .style-code-kind { height: 22px; border-radius: 5px; }
.style-mock-nav-label { font-size: 11px; }
.style-mock-nav { font-size: 12px; }
.style-mock-account b { font-size: 12px; }
.style-mock-account small, .style-mock-topbar, .style-mock-team small, .style-mock-metrics span, .style-mock-metrics b small, .style-mock-metrics i, .style-mock-surface > header small, .style-mock-link, .style-mock-row-copy small, .style-mock .status-pill, .style-mock-empty, .style-mini-chart small, .style-mock-section-label, .style-mock-member b, .style-mock-member small, .style-mock-repo-count, .style-mock-footnote { font-size: 11px; }
.style-mock-kicker { font-size: 11px; }
.style-mock-greeting p { font-size: 12px; }
.style-mock-metrics > div { min-height: 86px; }
.style-mock-surface > header b { font-size: 13px; }
.style-mock-row-copy b { font-size: 12px; }
.style-mock-code-trail { display: none; }
.style-code-row { display: flex; align-items: center; gap: 9px; min-width: 0; padding: 9px 12px; border-bottom: 1px solid var(--mock-border); color: var(--mock-ink); text-decoration: none; }
.style-code-row:last-child { border-bottom: 0; }
.style-code-row:hover { background: var(--mock-bg); text-decoration: none; }
.style-code-kind { display: grid; width: 44px; height: 24px; flex: 0 0 auto; place-items: center; border-radius: 5px; background: var(--mock-accent-soft); color: var(--mock-accent); font: 9px/1 var(--font); font-weight: 650; }
.style-code-row > span:nth-child(2) { min-width: 0; flex: 1; }
.style-code-row b, .style-code-row small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.style-code-row b { font-size: 12px; font-weight: 550; }
.style-code-row small, .style-code-row time { color: var(--mock-muted); font-size: 11px; }
.style-code-row time { flex: 0 0 auto; }
.style-mock[data-look="product"] .style-mock-content { padding: 15px 16px; }
.style-mock[data-look="product"] .style-mock-greeting { margin-bottom: 11px; }
.style-mock[data-look="product"] .style-mock-greeting h3 { font-size: 18px; }
.style-mock[data-look="product"] .style-mock-metrics > div { min-height: 72px; padding: 9px 11px; }
.style-mock[data-look="product"] .style-mock-metrics b { font-size: 20px; }
.style-mock[data-look="product"] .style-mock-columns { grid-template-columns: minmax(0, 1.08fr) minmax(205px, .92fr); gap: 9px; }
.style-mock[data-look="product"] .style-mock-row { min-height: 45px; padding: 6px 9px; }
.style-mock[data-look="product"] .style-mock-code-trail { display: block; margin-top: 9px; }
.style-mock[data-look="apple"] .style-mock-content { padding: 22px 18px; }
.style-mock[data-look="apple"] .style-mock-greeting h3 { font-size: 21px; }
.style-mock[data-look="apple"] .style-mock-metrics > div { min-height: 78px; padding: 10px; }
.style-mock[data-look="apple"] .style-mock-metrics b { font-size: 21px; }
.style-mock[data-look="apple"] .style-mock-columns { grid-template-columns: minmax(0, 1.2fr) minmax(170px, .8fr); }
.style-mock[data-look="studio"] .style-mock-greeting { align-items: center; padding: 15px 16px; border-left: 4px solid var(--mock-accent); border-radius: 8px; background: var(--mock-surface); }
.style-mock[data-look="studio"] .style-mock-greeting h3 { font-size: 24px; }
.style-mock[data-look="studio"] .style-mock-metrics > div { min-height: 88px; padding: 13px; }
.style-mock[data-look="studio"] .style-mock-columns { gap: 15px; }
.style-mock[data-look="studio"] .style-mock-surface { border-radius: 12px; }
.style-mock[data-look="dark"] .style-mock-metrics, .style-mock[data-look="dark"] .style-mock-surface { box-shadow: inset 0 1px #ffffff06; }
@keyframes style-preview-in { from { opacity: .75; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width: 980px) {
  .style-look-switcher { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .style-mock { grid-template-columns: 58px minmax(0, 1fr); }
  .style-mock-sidebar { align-items: center; padding-right: 7px; padding-left: 7px; }
  .style-mock-brand { padding-right: 0; padding-left: 0; }
  .style-mock-brand b, .style-mock-nav-label, .style-mock-nav > span, .style-mock-account > span:last-child { display: none; }
  .style-mock-nav { justify-content: center; width: 35px; padding: 7px; }
  .style-mock-account { justify-content: center; width: 100%; }
  .style-mock-content { padding: 17px; }
  .style-mock-columns { grid-template-columns: minmax(0, 1fr); }
  .style-mock[data-look="apple"] { grid-template-columns: 176px minmax(0, 1fr); min-height: 720px; }
  .style-mock[data-look="apple"] .style-mock-sidebar { align-items: stretch; padding: 13px 8px; }
  .style-mock[data-look="apple"] .apple-sidebar-brand b, .style-mock[data-look="apple"] .apple-source-group, .style-mock[data-look="apple"] .style-mock-nav > span, .style-mock[data-look="apple"] .style-mock-account > span:last-child { display: block; }
  .style-mock[data-look="apple"] .style-mock-nav { width: auto; justify-content: flex-start; padding: 5px 7px; }
  .style-mock[data-look="apple"] .style-mock-account { justify-content: flex-start; }
  .style-mock[data-look="apple"] .apple-overview-grid { grid-template-columns: minmax(0, 1fr); gap: 9px; }
  .style-mock[data-look="apple"] .apple-team-workload { padding: 12px 0 0; border-top: 1px solid #e5e5ea; border-left: 0; }
  .style-mock[data-look="apple"] .apple-team-workload .style-mini-chart { max-width: 420px; }
}
@media (max-width: 640px) {
  .style-preview-heading { align-items: flex-start; }
  .style-preview-heading h1 { font-size: 19px; }
  .style-preview-heading p { max-width: 300px; }
  .style-preview-heading > .btn { flex: 0 0 auto; }
  .style-look-switcher { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
  .style-look-tab { gap: 6px; padding: 7px; font-size: 11px; }
  .style-look-swatch { width: 21px; height: 21px; }
  .style-preview-caption { align-items: flex-start; }
  .style-preview-caption > .btn { flex: 0 0 auto; }
  .style-mock { grid-template-columns: 42px minmax(0, 1fr); }
  .style-mock-sidebar { padding: 12px 3px 8px; }
  .style-mock-brand > span { width: 25px; height: 25px; font-size: 15px; }
  .style-mock-nav { width: 31px; min-height: 31px; }
  .style-mock-nav .icon { width: 14px; height: 14px; }
  .style-mock-account .avatar { width: 24px; height: 24px; }
  .style-mock-topbar { min-height: 41px; padding: 0 9px; font-size: 10px; }
  .style-mock-topbar > span:last-child { gap: 5px; }
  .style-mock-content { padding: 12px 9px; }
  .style-mock-greeting { align-items: flex-start; }
  .style-mock-greeting h3 { font-size: 16px; }
  .style-mock-greeting p { max-width: 205px; line-height: 1.5; }
  .style-mock-team { display: none; }
  .style-mock-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .style-mock-metrics > div { min-height: 73px; padding: 8px; }
  .style-mock-metrics > div:nth-child(2) { border-right: 0; }
  .style-mock-metrics > div:nth-child(-n + 2) { border-bottom: 1px solid var(--mock-border); }
  .style-mock-metrics b { font-size: 18px; }
  .style-mock[data-look="studio"] .style-mock-metrics { gap: 5px; }
  .style-mock[data-look="studio"] .style-mock-metrics > div { min-height: 72px; }
  .style-mock[data-look="product"] .style-mock-columns { grid-template-columns: minmax(0, 1fr); }
  .style-mock[data-look="apple"] .style-mock-content { padding: 13px 10px; }
  .style-mock[data-look="apple"] .style-mock-greeting h3 { font-size: 17px; }
  .style-mock[data-look="apple"] .style-mock-columns { grid-template-columns: minmax(0, 1fr); }
  .style-mock[data-look="apple"] { grid-template-columns: 42px minmax(0, 1fr); grid-template-rows: 38px minmax(0, 1fr); min-height: 700px; }
  .style-mock[data-look="apple"] .apple-window-bar { padding: 0 7px; }
  .style-mock[data-look="apple"] .apple-window-controls { gap: 5px; }
  .style-mock[data-look="apple"] .apple-window-controls i { width: 9px; height: 9px; }
  .style-mock[data-look="apple"] .apple-window-bar > b { font-size: 10px; }
  .style-mock[data-look="apple"] .apple-window-meta { display: none; }
  .style-mock[data-look="apple"] .style-mock-sidebar { align-items: center; padding: 10px 3px; }
  .style-mock[data-look="apple"] .apple-sidebar-brand { padding: 0 0 12px; }
  .style-mock[data-look="apple"] .apple-sidebar-brand b, .style-mock[data-look="apple"] .apple-source-group, .style-mock[data-look="apple"] .style-mock-nav > span, .style-mock[data-look="apple"] .style-mock-account > span:last-child { display: none; }
  .style-mock[data-look="apple"] .style-mock-nav { width: 31px; justify-content: center; padding: 6px; }
  .style-mock[data-look="apple"] .style-mock-account { justify-content: center; padding-right: 0; padding-left: 0; }
  .style-mock[data-look="apple"] .apple-overview-grid { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .style-mock[data-look="apple"] .apple-team-workload { padding-left: 0; border-left: 0; }
  .style-mock[data-look="apple"] .style-mock-content { padding: 13px 10px; }
  .style-mock[data-look="apple"] .apple-welcome { align-items: flex-start; }
  .style-mock[data-look="apple"] .apple-welcome h3 { font-size: 18px; }
  .style-mock[data-look="apple"] .apple-welcome p { font-size: 11px; }
  .style-mock[data-look="apple"] .apple-team-avatars { display: none; }
  .style-mock[data-look="apple"] .apple-summary-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 11px; }
  .style-mock[data-look="apple"] .apple-summary-strip > div { padding: 0 8px; }
  .style-mock[data-look="apple"] .apple-summary-strip > div:nth-child(2) { border-right: 0; }
  .style-mock[data-look="apple"] .apple-summary-strip > div:nth-child(3) { padding-left: 0; }
  .style-mock[data-look="apple"] .apple-summary-strip b { font-size: 19px; }
  .style-mock[data-look="apple"] .apple-summary-strip i { font-size: 10px; }
  .style-code-row { gap: 6px; padding: 8px; }
  .style-code-row time { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .style-look-tab { transition: none; }
  .style-mock { animation: none; }
}

/* Apple workspace: translucent chrome over a quiet desktop surface. */
:root[data-theme="apple"] {
  color-scheme: light;
  --bg: #edf0f4;
  --paper: #fff;
  --sidebar: rgba(248, 249, 251, .86);
  --ink: #1d1d1f;
  --sub: #424245;
  --muted: #6e6e73;
  --line: #e5e5ea;
  --line-strong: #d2d2d7;
  --accent: #007aff;
  --accent-soft: #eaf3ff;
  --primary: #007aff;
  --green: #248a3d;
  --green-deep: #1f7a36;
  --green-soft: #eaf6ec;
  --blue: #0066cc;
  --blue-soft: #eaf3ff;
  --amber: #9a6700;
  --amber-soft: #fff5df;
  --red: #c93434;
  --red-soft: #fff0ef;
  --radius-shell: 18px;
  --radius-card: 13px;
  --radius-control: 9px;
  --motion-fast: 180ms;
  --type-display: 30px;
  --type-title: 22px;
  --type-section: 16px;
  --type-body: 14px;
  --type-caption: 12px;
}
:root[data-theme="apple"] body {
  background:
    radial-gradient(ellipse 52% 44% at 100% 0%, rgba(177, 198, 225, .24), transparent 68%),
    #eef1f5;
  color: #1d1d1f;
}
:root[data-theme="apple"] .app-shell { padding: 12px; }
:root[data-theme="apple"] .sidebar {
  inset: 12px auto 12px 12px;
  border-color: rgba(255, 255, 255, .8);
  background: rgba(248, 249, 251, .9);
  box-shadow: 0 12px 36px rgba(31, 41, 55, .08), inset 0 1px rgba(255, 255, 255, .9);
  color: #424245;
  transition: background var(--motion-fast) ease, box-shadow var(--motion-fast) ease;
}
:root[data-theme="apple"] .brand-mark {
  border-color: #007aff;
  border-radius: 9px;
  background: #007aff;
  letter-spacing: 0;
}
:root[data-theme="apple"] .nav-label,
:root[data-theme="apple"] .assistant-minimal-empty h2 { letter-spacing: 0; }
:root[data-theme="apple"] button:focus-visible,
:root[data-theme="apple"] a:focus-visible { outline-color: rgba(0, 122, 255, .62); }
:root[data-theme="apple"] .brand small,
:root[data-theme="apple"] .nav-label,
:root[data-theme="apple"] .nav-shortcut,
:root[data-theme="apple"] .nav-item,
:root[data-theme="apple"] .account-copy b { color: #6e6e73; }
:root[data-theme="apple"] .nav-shortcut { border-color: rgba(60, 60, 67, .12); background: rgba(255, 255, 255, .52); }
:root[data-theme="apple"] .nav-shortcut:hover,
:root[data-theme="apple"] .nav-item:hover { background: rgba(255, 255, 255, .72); }
:root[data-theme="apple"] .nav-item { border-radius: 9px; }
:root[data-theme="apple"] .nav-item.active {
  border-color: rgba(0, 122, 255, .12);
  background: rgba(255, 255, 255, .88);
  color: #0066cc;
  box-shadow: 0 1px 3px rgba(31, 41, 55, .06);
}
:root[data-theme="apple"] .nav-item.active .icon { color: #007aff; }
:root[data-theme="apple"] .nav-divider,
:root[data-theme="apple"] .account { border-color: rgba(60, 60, 67, .12); }
:root[data-theme="apple"] .nav-divider { background: rgba(60, 60, 67, .12); }
:root[data-theme="apple"] .nav-count { border-color: #e5e5ea; background: #f5f5f7; color: #6e6e73; }
:root[data-theme="apple"] .main-shell {
  min-height: calc(100vh - 24px);
  border-color: rgba(255, 255, 255, .88);
  background: rgba(255, 255, 255, .86);
  box-shadow: 0 12px 40px rgba(31, 41, 55, .06), inset 0 1px rgba(255, 255, 255, .95);
}
:root[data-theme="apple"] .topbar {
  top: 12px;
  border-color: rgba(60, 60, 67, .1);
  background: rgba(255, 255, 255, .84);
  box-shadow: inset 0 1px rgba(255, 255, 255, .78), 0 1px rgba(255, 255, 255, .45);
}
:root[data-theme="apple"] .breadcrumbs,
:root[data-theme="apple"] .period-label,
:root[data-theme="apple"] .sync-label { color: #6e6e73; }
:root[data-theme="apple"] .breadcrumbs b { color: #1d1d1f; }
:root[data-theme="apple"] .page-head h1,
:root[data-theme="apple"] .greeting,
:root[data-theme="apple"] .panel-header h2,
:root[data-theme="apple"] .section-heading h2,
:root[data-theme="apple"] .section-heading > b,
:root[data-theme="apple"] .task-copy b,
:root[data-theme="apple"] .task-copy strong,
:root[data-theme="apple"] .metric-value,
:root[data-theme="apple"] .calendar-header h2 { color: #1d1d1f; letter-spacing: 0; }
:root[data-theme="apple"] .page-head p,
:root[data-theme="apple"] .overview-intro p,
:root[data-theme="apple"] .eyebrow,
:root[data-theme="apple"] .panel-header p,
:root[data-theme="apple"] .metric-note,
:root[data-theme="apple"] .metric-label { color: #6e6e73; }
:root[data-theme="apple"] .btn.primary {
  border-color: #007aff;
  background: #007aff;
  color: #fff;
  box-shadow: 0 1px 2px rgba(0, 64, 140, .16);
}
:root[data-theme="apple"] .btn.primary:hover { border-color: #0066d6; background: #0066d6; }
:root[data-theme="apple"] .btn:not(.primary) { border-color: rgba(60, 60, 67, .14); color: #424245; }
:root[data-theme="apple"] .btn:not(.primary):hover { border-color: rgba(0, 122, 255, .28); background: #f5f9ff; }
:root[data-theme="apple"] .btn.quiet { border-color: transparent; }
:root[data-theme="apple"] .panel,
:root[data-theme="apple"] .team-report-card,
:root[data-theme="apple"] .report-card {
  border-color: rgba(60, 60, 67, .11);
  border-radius: 13px;
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 2px 10px rgba(31, 41, 55, .025);
}
:root[data-theme="apple"] .panel-header,
:root[data-theme="apple"] .panel-footer,
:root[data-theme="apple"] .list-heading,
:root[data-theme="apple"] .report-card-head,
:root[data-theme="apple"] .report-card-foot { border-color: rgba(60, 60, 67, .1); }
:root[data-theme="apple"] .panel-header h2,
:root[data-theme="apple"] .list-heading h2,
:root[data-theme="apple"] .list-heading h3,
:root[data-theme="apple"] .list-heading b { color: #1d1d1f; }
:root[data-theme="apple"] .list-heading,
:root[data-theme="apple"] .metric,
:root[data-theme="apple"] .report-progress,
:root[data-theme="apple"] .calendar-day.heat-0 { background: #f5f5f7; }
:root[data-theme="apple"] .overview-summary,
:root[data-theme="apple"] .metrics { border-color: #e5e5ea; background: #f5f5f7; }
:root[data-theme="apple"] .metric { border-color: #e5e5ea; }
:root[data-theme="apple"] .metric-value { color: #1d1d1f; }
:root[data-theme="apple"] .task-icon,
:root[data-theme="apple"] .avatar { border-color: #e5e5ea; background: #f1f2f4; color: #424245; }
:root[data-theme="apple"] .avatar.alt { background: #eaf3ff; color: #0066cc; }
:root[data-theme="apple"] .avatar.warm { background: #fff3e8; color: #9a5b16; }
:root[data-theme="apple"] .quick-link,
:root[data-theme="apple"] .notice,
:root[data-theme="apple"] .notice.amber { border-color: #e5e5ea; background: #f5f5f7; }
:root[data-theme="apple"] .calendar-day.heat-1 { background: #edf5ff; }
:root[data-theme="apple"] .calendar-day.heat-2 { background: #dcecff; }
:root[data-theme="apple"] .calendar-day.heat-3 { background: #c8e0ff; }
:root[data-theme="apple"] .calendar-day.heat-4 { background: #a9ceff; }
:root[data-theme="apple"] .calendar-day.today .calendar-date { background: #007aff; }
:root[data-theme="apple"] .calendar-day.selected { border-color: #007aff; box-shadow: inset 0 0 0 1px #007aff; }
:root[data-theme="apple"] .calendar-day:hover { border-color: rgba(0, 122, 255, .42); box-shadow: 0 3px 10px rgba(0, 64, 140, .08); }
:root[data-theme="apple"] .chat-compose { border-color: rgba(60, 60, 67, .1); background: #fff; }
:root[data-theme="apple"] .chat-message.user .chat-message-content { border-color: #e5e5ea; background: #f5f5f7; }
:root[data-theme="apple"] input,
:root[data-theme="apple"] select,
:root[data-theme="apple"] textarea { border-color: #d2d2d7; color: #1d1d1f; }
:root[data-theme="apple"] input:focus,
:root[data-theme="apple"] select:focus,
:root[data-theme="apple"] textarea:focus { border-color: #007aff; box-shadow: 0 0 0 3px rgba(0, 122, 255, .13); }
:root[data-theme="apple"] input[type="checkbox"] { accent-color: #007aff; }
:root[data-theme="apple"] .requirement-detail { border: 1px solid rgba(60, 60, 67, .11); border-radius: 13px; background: rgba(255, 255, 255, .96); box-shadow: 0 2px 10px rgba(31, 41, 55, .025); }
:root[data-theme="apple"] .detail-actions {
  border-color: rgba(60, 60, 67, .1);
  background: rgba(248, 249, 251, .92);
  box-shadow: inset 0 1px rgba(255, 255, 255, .72);
}
:root[data-theme="apple"] .modal-backdrop,
:root[data-theme="apple"] .command-backdrop { background: rgba(22, 28, 38, .32); }
:root[data-theme="apple"] .modal {
  border-color: rgba(255, 255, 255, .78);
  border-radius: 17px;
  background: rgba(255, 255, 255, .9);
  box-shadow: 0 24px 80px rgba(15, 23, 42, .2), inset 0 1px rgba(255, 255, 255, .9);
}
:root[data-theme="apple"] .modal-head,
:root[data-theme="apple"] .modal-foot { border-color: rgba(60, 60, 67, .1); }
:root[data-theme="apple"] .modal-head h2 { color: #1d1d1f; }
:root[data-theme="apple"] .modal-foot { background: rgba(245, 245, 247, .78); }
:root[data-theme="apple"] .toast { border-color: rgba(255, 255, 255, .72); background: rgba(255, 255, 255, .88); color: #424245; }
:root[data-theme="apple"] .style-mock[data-look="apple"] {
  border-color: #dce1e8;
  background: linear-gradient(135deg, #e9edf4, #f7f8fa 55%, #e8edf3);
}
:root[data-theme="apple"] .style-mock[data-look="apple"] .apple-window-bar,
:root[data-theme="apple"] .style-mock[data-look="apple"] .style-mock-sidebar {
  border-color: rgba(255, 255, 255, .72);
  background: rgba(246, 247, 250, .84);
  box-shadow: inset 0 1px rgba(255, 255, 255, .8);
}
:root[data-theme="apple"] .style-mock[data-look="apple"] .style-mock-main { background: #fff; }
:root[data-theme="apple"] .calendar-day,
:root[data-theme="apple"] .nav-item,
:root[data-theme="apple"] .btn,
:root[data-theme="apple"] .panel,
:root[data-theme="apple"] .sidebar { transition-duration: var(--motion-fast); }
:root[data-theme="apple"] .metric-value,
:root[data-theme="apple"] .report-progress h2,
:root[data-theme="apple"] .calendar-summary b,
:root[data-theme="apple"] .calendar-summary strong,
:root[data-theme="apple"] .calendar-date,
:root[data-theme="apple"] .calendar-hours,
:root[data-theme="apple"] .calendar-count,
:root[data-theme="apple"] .day-log-hours,
:root[data-theme="apple"] .event-time,
:root[data-theme="apple"] .apple-summary-strip b,
:root[data-theme="apple"] .apple-member-row > strong { font-variant-numeric: tabular-nums; font-feature-settings: "tnum" 1; }
:root[data-theme="apple"] .page-head h1 { font-size: var(--type-title); }
:root[data-theme="apple"] .assistant-minimal-empty h2 { font-size: var(--type-title); }
:root[data-theme="apple"] .panel-header h2,
:root[data-theme="apple"] .section-heading h2,
:root[data-theme="apple"] .section-heading > b,
:root[data-theme="apple"] .calendar-header h2 { font-size: var(--type-section); }
:root[data-theme="apple"] body,
:root[data-theme="apple"] .chat-message-text,
:root[data-theme="apple"] .detail-block p { font-size: var(--type-body); }
:root[data-theme="apple"] .hint,
:root[data-theme="apple"] .page-head p,
:root[data-theme="apple"] .panel-header p,
:root[data-theme="apple"] .breadcrumbs,
:root[data-theme="apple"] .sync-label { font-size: var(--type-caption); }
:root[data-theme="apple"] .style-mock[data-look="apple"] { font-family: var(--font); }
:root[data-theme="apple"] .modal-backdrop,
:root[data-theme="apple"] .command-backdrop { pointer-events: none; }
:root[data-theme="apple"] .command-backdrop > .modal { pointer-events: auto; }
:root[data-theme="apple"] .global-error { border-color: rgba(209, 52, 46, .22); background: rgba(255, 247, 246, .92); color: #8f2622; }

@keyframes page-enter-apple { from { opacity: .92; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }
@keyframes overlay-enter-apple { from { opacity: 0; } to { opacity: 1; } }
@keyframes modal-enter-apple { from { opacity: .92; transform: translateY(6px) scale(.99); } to { opacity: 1; transform: translateY(0) scale(1); } }
:root[data-theme="apple"] main.page-enter { animation: page-enter-apple 210ms var(--motion-out) both; }
:root[data-theme="apple"] .modal-backdrop { animation: overlay-enter-apple 180ms var(--motion-out) both; }
:root[data-theme="apple"] .modal-backdrop .modal { animation: modal-enter-apple 230ms var(--motion-out) both; }
:root[data-theme="apple"] .toast { animation: modal-enter-apple 230ms var(--motion-out) both; }
:root[data-theme="apple"] .style-mini-bar i,
:root[data-theme="apple"] .apple-member-meter i { animation-delay: calc(var(--bar-index, 0) * 55ms); }

@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  :root[data-theme="apple"] .sidebar,
  :root[data-theme="apple"] .topbar,
  :root[data-theme="apple"] .detail-actions,
  :root[data-theme="apple"] .modal,
  :root[data-theme="apple"] .toast,
  :root[data-theme="apple"] .style-mock[data-look="apple"] .apple-window-bar,
  :root[data-theme="apple"] .style-mock[data-look="apple"] .style-mock-sidebar {
    -webkit-backdrop-filter: blur(24px) saturate(160%);
    backdrop-filter: blur(24px) saturate(160%);
  }
  :root[data-theme="apple"] .main-shell {
    -webkit-backdrop-filter: blur(18px) saturate(135%);
    backdrop-filter: blur(18px) saturate(135%);
  }
  :root[data-theme="apple"] .modal-backdrop,
  :root[data-theme="apple"] .command-backdrop {
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
  }
}
@media (prefers-reduced-transparency: reduce) {
  :root[data-theme="apple"] .sidebar,
  :root[data-theme="apple"] .style-mock[data-look="apple"] .style-mock-sidebar { background: #f5f5f7; }
  :root[data-theme="apple"] .main-shell { background: #fff; }
  :root[data-theme="apple"] .topbar,
  :root[data-theme="apple"] .detail-actions,
  :root[data-theme="apple"] .modal,
  :root[data-theme="apple"] .toast,
  :root[data-theme="apple"] .style-mock[data-look="apple"] .apple-window-bar { background: #fff; }
  :root[data-theme="apple"] .modal-foot { background: #f5f5f7; }
  :root[data-theme="apple"] .modal-backdrop,
  :root[data-theme="apple"] .command-backdrop { background: rgba(22, 28, 38, .48); }
  :root[data-theme="apple"] .sidebar,
  :root[data-theme="apple"] .topbar,
  :root[data-theme="apple"] .detail-actions,
  :root[data-theme="apple"] .modal,
  :root[data-theme="apple"] .toast,
  :root[data-theme="apple"] .main-shell,
  :root[data-theme="apple"] .modal-backdrop,
  :root[data-theme="apple"] .command-backdrop,
  :root[data-theme="apple"] .style-mock[data-look="apple"] .apple-window-bar,
  :root[data-theme="apple"] .style-mock[data-look="apple"] .style-mock-sidebar { -webkit-backdrop-filter: none; backdrop-filter: none; }
}
@media (prefers-reduced-motion: reduce) {
  :root[data-theme="apple"] *, :root[data-theme="apple"] *::before, :root[data-theme="apple"] *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}
@media (max-width: 760px) {
  :root[data-theme="apple"] .app-shell { padding: 0; }
  :root[data-theme="apple"] .sidebar { inset: auto; border-radius: 0; }
  :root[data-theme="apple"] .main-shell { min-height: 80vh; margin-left: 0; border: 0; border-radius: 0; }
  :root[data-theme="apple"] .topbar { top: 0; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation: none !important;
    transition: none !important;
  }
  :root[data-theme="apple"] .btn:active:not(:disabled),
  :root[data-theme="apple"] .nav-item:active,
  :root[data-theme="apple"] .quick-link:active,
  :root[data-theme="apple"] .calendar-day:active { transform: none !important; }
}