/* Apple-inspired materials: translucent chrome, steady readable content.
   Reference: https://developer.apple.com/design/human-interface-guidelines/materials
   The material is functional hierarchy: navigation floats above the workspace;
   the roster uses a denser surface than the toolbar. */
:root{
  --faint:var(--muted);
  --glass-ground:#e9eef3;
  --glass-light:#c8dcf1;
  --glass-warm:#eee5d3;
  --glass-tint:#dce7ec;
  --glass-chrome:rgba(255,255,255,.64);
  --glass-panel:rgba(255,255,255,.68);
  --glass-content:rgba(255,255,255,.86);
  --glass-field:rgba(255,255,255,.9);
  --glass-edge:rgba(255,255,255,.82);
  --glass-divider:rgba(61,77,97,.1);
  --glass-highlight:rgba(255,255,255,.84);
  --glass-shadow:0 12px 32px rgba(31,47,66,.075);
  --glass-raised-shadow:0 18px 48px rgba(28,43,65,.14);
  --glass-filter:blur(26px) saturate(155%);
  --glass-content-filter:blur(18px) saturate(125%);
  --glass-accent-fill:color-mix(in srgb,var(--summary-accent) 38%,var(--glass-panel));
  --glass-selected:color-mix(in srgb,var(--selected) 88%,transparent);
}
:root[data-theme="blue"]{--glass-ground:#e7eef7;--glass-light:#c2d5ee;--glass-warm:#e8e9ec;--glass-tint:#d3e1f2;--glass-accent-fill:rgba(216,231,253,.8)}
:root[data-theme="teal"]{--glass-ground:#e7f0ed;--glass-light:#c3ded8;--glass-warm:#ece8d9;--glass-tint:#d2e5de;--glass-accent-fill:rgba(195,236,224,.8)}
:root[data-theme="indigo"]{--glass-ground:#edecf5;--glass-light:#d1d4ef;--glass-warm:#eee7e0;--glass-tint:#dfe0f1;--glass-accent-fill:rgba(224,222,251,.82)}
:root[data-theme="dark"]{
  --glass-ground:#111823;--glass-light:#24384e;--glass-warm:#292d32;--glass-tint:#233d37;
  --glass-chrome:rgba(29,39,54,.72);--glass-panel:rgba(28,38,53,.7);
  --glass-content:rgba(22,32,47,.9);--glass-field:rgba(20,29,43,.96);
  --glass-edge:rgba(225,237,255,.12);--glass-divider:rgba(218,232,255,.11);
  --glass-highlight:rgba(235,244,255,.15);
  --glass-shadow:0 12px 32px rgba(0,0,0,.2);--glass-raised-shadow:0 20px 56px rgba(0,0,0,.34);
  --glass-accent-fill:rgba(35,78,61,.84);
}
body{
  background-color:var(--glass-ground);
  background-image:radial-gradient(ellipse at 86% 5%,color-mix(in srgb,var(--glass-light) 78%,transparent),transparent 58%),radial-gradient(ellipse at 6% 92%,color-mix(in srgb,var(--glass-warm) 76%,transparent),transparent 62%);
  background-attachment:fixed;
}
.sidebar{
  background:var(--glass-chrome);color:var(--ink);border:1px solid var(--glass-edge);
  box-shadow:var(--glass-shadow),inset 0 1px 0 var(--glass-highlight);
  -webkit-backdrop-filter:var(--glass-filter);backdrop-filter:var(--glass-filter);
  border-radius:1.25rem;
}
.sidebar .brand-mark{color:var(--accent-ink)}
.sidebar .nav-item,.sidebar .nav-item svg{color:var(--muted)}
.sidebar .nav-item:hover{background:color-mix(in srgb,var(--surface) 54%,transparent);color:var(--ink)}
.sidebar .nav-item.active{background:var(--glass-accent-fill);color:var(--ink);box-shadow:inset 0 1px 0 var(--glass-highlight)}
.sidebar .nav-item.active svg{color:inherit}
.sidebar .user-avatar{background:var(--glass-content);color:var(--ink);box-shadow:inset 0 0 0 1px var(--glass-edge)}
.brand strong{color:var(--ink)}
.topbar{
  position:sticky;top:.875rem;z-index:12;min-height:3.125rem;
  padding:.4375rem .625rem .4375rem .875rem;margin-bottom:1.125rem;
  background:var(--glass-chrome);border:1px solid var(--glass-edge);border-radius:1.125rem;
  box-shadow:0 6px 24px rgba(33,50,72,.045),inset 0 1px 0 var(--glass-highlight);
  -webkit-backdrop-filter:var(--glass-filter);backdrop-filter:var(--glass-filter);
}
.breadcrumbs{color:var(--muted)}.breadcrumbs strong{color:var(--ink)}
.material-label{font-size:.75rem;color:var(--muted);padding:.1875rem .4375rem;background:var(--glass-field);border-radius:.375rem;white-space:nowrap}
.layout-switch{background:color-mix(in srgb,var(--surface-subtle) 68%,transparent);border:0;box-shadow:inset 0 0 0 1px var(--glass-divider);padding:.1875rem;border-radius:.75rem}
.layout-switch button{border-radius:.5625rem}
.layout-switch button[aria-pressed="true"]{background:var(--glass-field);box-shadow:0 2px 6px rgba(20,34,54,.07);color:var(--ink)}
.theme-toggle{background:var(--glass-field);border-color:var(--glass-edge);border-radius:.625rem}
.activity-header{margin-bottom:1.125rem}
.activity-heading h1{letter-spacing:-.025em}
.soft-tag{background:var(--glass-content);color:var(--muted)}
.activity-actions .button:not(.primary){background:var(--glass-chrome);border-color:var(--glass-edge);box-shadow:0 3px 12px rgba(28,44,63,.045);-webkit-backdrop-filter:blur(16px) saturate(140%);backdrop-filter:blur(16px) saturate(140%)}
.button.primary{box-shadow:0 4px 14px color-mix(in srgb,var(--button-bg) 16%,transparent)}
.overview{gap:.875rem;margin-bottom:1rem}
.summary-card,.profession-bar{
  background:var(--glass-panel);color:var(--ink);border:1px solid var(--glass-edge);
  border-radius:1.125rem;box-shadow:var(--glass-shadow),inset 0 1px 0 var(--glass-highlight);
  -webkit-backdrop-filter:var(--glass-filter);backdrop-filter:var(--glass-filter);
}
.summary-card{padding:.875rem 1rem}
.summary-card.arranged{background:var(--glass-accent-fill);color:var(--ink)}
.summary-card.unassigned{background:color-mix(in srgb,var(--glass-tint) 24%,var(--glass-panel));color:var(--ink)}
.summary-card p{color:var(--muted);opacity:1}
.summary-card.arranged p{color:var(--ink);opacity:.8}
.summary-number{letter-spacing:-.025em}
.profession-bar{padding:.875rem 1rem}
.career-counter{background:transparent;border-color:transparent;border-radius:.5rem}
.career-counter:hover,.career-counter.selected{background:var(--glass-field);border-color:var(--glass-edge);box-shadow:0 2px 8px rgba(30,46,64,.04)}
.career-counter.full{border-color:var(--warning-line);background:var(--warning-bg)}
.career-counter strong{font-weight:500}
.workspace-controls{margin-bottom:.875rem}
.segmented{background:var(--glass-panel);border-color:var(--glass-edge);border-radius:.6875rem;-webkit-backdrop-filter:blur(18px) saturate(140%);backdrop-filter:blur(18px) saturate(140%)}
.segmented button{border-radius:.5rem}
.segmented button.active{background:var(--glass-field);box-shadow:0 1px 5px rgba(31,47,66,.06)}
.board-section-heading{background:color-mix(in srgb,var(--glass-chrome) 78%,transparent);border:1px solid var(--glass-edge);border-radius:.6875rem;box-shadow:inset 0 1px 0 var(--glass-highlight);-webkit-backdrop-filter:blur(16px) saturate(135%);backdrop-filter:blur(16px) saturate(135%)}
.people-panel,.detail-profile,.detail-history,.data-view{
  background:var(--glass-panel);color:var(--ink);border:1px solid var(--glass-edge);
  border-radius:1.125rem;box-shadow:var(--glass-shadow),inset 0 1px 0 var(--glass-highlight);
  -webkit-backdrop-filter:var(--glass-filter);backdrop-filter:var(--glass-filter);
}
.people-panel{padding-top:.1875rem}
.people-list{scrollbar-color:var(--glass-divider) transparent}
.person-row{background:var(--glass-content);border-color:transparent;border-radius:.625rem}
.person-row:hover{background:var(--glass-field)}
.person-row.selected{background:var(--glass-selected);border-color:var(--accent-line)}
.person-plus{background:var(--glass-field);border-color:var(--glass-divider);border-radius:.4375rem}
.person-plus:hover{background:var(--selected)}
.search-field,.people-filters select,.detail-fields select,.detail-section textarea,.data-filters input,.data-filters select{background:var(--glass-field);border-color:var(--glass-divider);border-radius:.625rem}
.search-field input{background:transparent}
.panel-footnote{border-color:var(--glass-divider)}
.team-card{
  background:var(--glass-content);border-color:var(--glass-edge);border-radius:.875rem;
  box-shadow:0 5px 16px rgba(32,49,68,.035),inset 0 1px 0 var(--glass-highlight);
}
.team-heading,.team-row{border-color:var(--glass-divider)}
.team-row.selected{background:var(--glass-selected);border-color:transparent}
.team-row:hover{background:color-mix(in srgb,var(--hover) 72%,transparent)}
.team-row .remove-member{background:var(--glass-field);border-radius:.375rem}
.team-card.drop-active{background:var(--selected);box-shadow:0 0 0 2px var(--focus-ring)}
.detail-head,.detail-section{background:transparent}
.detail-avatar{background:color-mix(in srgb,var(--avatar-bg) 82%,var(--glass-field));box-shadow:inset 0 1px 0 var(--glass-highlight);border-radius:.9375rem}
.detail-history{padding:.75rem}
.history-heading{color:var(--ink)}
.history-heading>span{color:var(--muted)}
.history-content{background:transparent;padding:.625rem .25rem .125rem}
.detail-footer{border-color:var(--glass-divider)}
.detail-footer .text-button{background:var(--glass-field);border-color:var(--glass-edge);border-radius:.5rem}
.rank-label strong{color:var(--ink)}
.data-view-head,.data-table th,.data-table td,.pagination{border-color:var(--glass-divider)}
.data-table th{background:var(--glass-content)}
.stats-summary,.table-caption{background:color-mix(in srgb,var(--glass-content) 72%,transparent)}
.data-table tbody tr:hover{background:var(--glass-field)}
.app-note{color:var(--muted)}
dialog{
  background:var(--glass-chrome);border-color:var(--glass-edge);border-radius:1.25rem;
  box-shadow:var(--glass-raised-shadow),inset 0 1px 0 var(--glass-highlight);
  -webkit-backdrop-filter:blur(32px) saturate(150%);backdrop-filter:blur(32px) saturate(150%);
}
dialog::backdrop{background:color-mix(in srgb,var(--ink) 16%,transparent);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.dialog-header{background:var(--glass-content);border-color:var(--glass-divider)}
.dialog-actions{background:var(--glass-content);border-color:var(--glass-divider)}
.dialog-field>input,.dialog-field>select,.dialog-field>textarea{background:var(--glass-field);border-color:var(--glass-divider)}
.dialog-list .team-option,.theme-option{background:var(--glass-content);border-color:var(--glass-divider);border-radius:.75rem}
.preview-list,.preview-row{border-color:var(--glass-divider)}
.file-summary{background:var(--glass-content)}
.toast{background:color-mix(in srgb,var(--toast-bg) 92%,transparent);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}
.toast.error{background:var(--toast-error)}
:root[data-layout="canvas"] .overview{background:var(--glass-panel);border-color:var(--glass-edge);box-shadow:var(--glass-shadow),inset 0 1px 0 var(--glass-highlight);-webkit-backdrop-filter:var(--glass-filter);backdrop-filter:var(--glass-filter);border-radius:1.125rem}
:root[data-layout="canvas"] .summary-card{background:transparent;border:0;border-right:1px solid var(--glass-divider);box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;border-radius:0}
:root[data-layout="canvas"] .summary-card:last-child{border-right:0}
:root[data-layout="canvas"] .profession-bar{background:transparent;border:0;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
:root[data-layout="canvas"] .career-counter{background:transparent}
:root[data-layout="canvas"] .career-counter.selected,:root[data-layout="canvas"] .career-counter:hover{background:var(--glass-field)}
:root[data-layout="canvas"] .inspector-shell{background:var(--glass-chrome);border-color:var(--glass-edge);border-radius:1.25rem;box-shadow:var(--glass-raised-shadow),inset 0 1px 0 var(--glass-highlight);-webkit-backdrop-filter:blur(36px) saturate(150%);backdrop-filter:blur(36px) saturate(150%)}
:root[data-layout="canvas"] .inspector-shell .detail-profile,:root[data-layout="canvas"] .inspector-shell .detail-history{background:transparent;border:0;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
:root[data-layout="canvas"] .inspector-shell .detail-history{border-top:1px solid var(--glass-divider);border-radius:0}
:root[data-theme]{--faint:var(--muted);--sidebar-bg:var(--surface);--sidebar-ink:var(--ink);--sidebar-muted:var(--muted);--sidebar-active-ink:var(--ink)}
:root[data-theme="dark"] .topbar{box-shadow:var(--glass-shadow),inset 0 1px 0 var(--glass-highlight)}
:root[data-theme="dark"] .team-card{box-shadow:0 6px 20px rgba(0,0,0,.09),inset 0 1px 0 var(--glass-highlight)}
@media(max-width:960px){.material-label{display:none}.topbar{gap:.625rem}}
@media(max-width:760px){body{background-attachment:scroll}.sidebar{border-radius:1.125rem}.topbar{position:relative;top:auto;padding:.625rem .75rem;margin-bottom:1rem;border-radius:1rem;gap:.625rem}.layout-switch{background:color-mix(in srgb,var(--surface-subtle) 76%,transparent)}.summary-card{padding:.75rem .625rem;border-radius:.9375rem}.profession-bar{padding:.75rem}.people-panel,.detail-profile,.detail-history,.data-view{border-radius:1rem}.career-counter strong{font-weight:400}.team-card{border-radius:.75rem}}
/* Users who need solid surfaces get the same hierarchy without transparency. */
@media(prefers-reduced-transparency:reduce),(prefers-contrast:more){
  :root,:root[data-theme]{--glass-ground:var(--bg);--glass-chrome:var(--surface);--glass-panel:var(--surface);--glass-content:var(--surface);--glass-field:var(--surface);--glass-edge:var(--line);--glass-divider:var(--line);--glass-highlight:transparent;--glass-filter:none;--glass-content-filter:none;--glass-accent-fill:var(--accent-bg);--glass-selected:var(--selected);--glass-shadow:0 0 0 transparent;--glass-raised-shadow:0 0 0 transparent}
  body{background-image:none}
  .summary-card.unassigned{background:var(--surface)}
  .sidebar,.topbar,.summary-card,.profession-bar,.segmented,.board-section-heading,.people-panel,.detail-profile,.detail-history,.data-view,.activity-actions .button:not(.primary),dialog,dialog::backdrop,.toast,:root[data-layout="canvas"] .overview,:root[data-layout="canvas"] .inspector-shell{-webkit-backdrop-filter:none;backdrop-filter:none}
  .board-section-heading,.stats-summary,.table-caption{background:var(--surface-subtle)}
  .sidebar .nav-item.active{background:var(--selected)}
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  :root,:root[data-theme]{--glass-ground:var(--bg);--glass-chrome:var(--surface);--glass-panel:var(--surface);--glass-content:var(--surface);--glass-field:var(--surface);--glass-edge:var(--line);--glass-divider:var(--line);--glass-filter:none;--glass-content-filter:none;--glass-accent-fill:var(--accent-bg)}
  body{background-image:none}
  .summary-card.unassigned{background:var(--surface)}
}
@media(forced-colors:active){
  body{background:Canvas}
  .sidebar,.topbar,.summary-card,.profession-bar,.people-panel,.team-card,.detail-profile,.detail-history,.data-view,dialog{background:Canvas;color:CanvasText;border:1px solid CanvasText;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
}