/* Glass is the control layer; content and dense board cells retain solid surfaces. */
:root{--glass-highlight:inset 0 1.2px 1px #fff,inset 1px 0 1px #ffffffa8,inset -1px -1px 1px #667c9818;--glass-shadow:0 4px 14px #263d5d0c,0 1px 3px #263d5d12;--glass-control:linear-gradient(150deg,#ffffffcc,#ffffff63 55%,#e8eef58c)}
body{background:radial-gradient(ellipse at 0 18%,#dceaffb8,transparent 38%),radial-gradient(ellipse at 99% 8%,#e7defa96,transparent 35%),radial-gradient(ellipse at 85% 92%,#e2f2ef80,transparent 36%),#f5f6fa;background-attachment:fixed}
.sidebar,.client-mode .sidebar{background:linear-gradient(155deg,#ffffffb8,#f0f5fac4);border:1px solid #ffffffdb;box-shadow:inset 0 1px #fff,0 8px 36px #2842670b;backdrop-filter:blur(36px) saturate(1.55);-webkit-backdrop-filter:blur(36px) saturate(1.55)}
.sidebar .nav,.client-mode .sidebar .nav{border:1px solid transparent;border-radius:13px;min-height:40px;gap:10px;transition:background .22s,box-shadow .22s,color .22s,transform .2s}
.sidebar .nav .icon,.client-mode .sidebar .nav .icon{color:inherit}
.sidebar .nav.active,.client-mode .sidebar .nav.active{color:#0867cd;background:radial-gradient(ellipse at var(--glass-x,26%) var(--glass-y,0%),#fffffff2,transparent 65%),linear-gradient(145deg,#ffffffa6,#d8e9fb69);border-color:#fff;box-shadow:var(--glass-highlight),0 3px 9px #3979b920,0 0 0 .5px #99b4d326;backdrop-filter:blur(14px) saturate(1.65);-webkit-backdrop-filter:blur(14px) saturate(1.65)}
.sidebar .nav:hover{color:#263e60;background:#ffffff70}.sidebar .nav:active{transform:scale(.985)}
.sidebar .side-label{padding-inline:12px}.sidebar .nav-section+.nav-section{margin-top:20px}.sidebar .studio-person{margin-inline:4px;padding:14px 8px 0}.sidebar-bottom{padding-top:15px}
.topbar{background:linear-gradient(#fafcffbc,#f7faffaa);border-bottom:1px solid #fff;box-shadow:0 3px 18px #25456b05,inset 0 -1px #b5c5d718;backdrop-filter:blur(28px) saturate(1.7);-webkit-backdrop-filter:blur(28px) saturate(1.7)}
.btn:not(.ghost),.top-client-select{background:radial-gradient(ellipse at var(--glass-x,25%) var(--glass-y,0%),#ffffffb8,transparent 70%),var(--glass-control);border-color:#ffffffed;box-shadow:var(--glass-highlight),var(--glass-shadow);backdrop-filter:blur(16px) saturate(1.45);-webkit-backdrop-filter:blur(16px) saturate(1.45);color:#334156;transition:box-shadow .2s,background .2s,transform .22s cubic-bezier(.2,.85,.2,1)}
.btn:not(.ghost):hover{border-color:#fff;box-shadow:var(--glass-highlight),0 5px 16px #2c4a751b;transform:translateY(-1px)}.btn:not(.ghost):active{transform:scale(.96);box-shadow:inset 0 2px 4px #1a407020,0 1px 3px #263d5d10}
.btn.primary,.btn.dark{background:radial-gradient(ellipse at var(--glass-x,28%) var(--glass-y,0%),#ffffff38,transparent 75%),linear-gradient(165deg,#1789f4e8,#0068d9f2);border:1px solid #ffffff7a;color:white;box-shadow:inset 0 1px 1px #ffffff75,inset 0 -1px 1px #00469938,0 3px 12px #0069d82b}
.btn.primary:hover,.btn.dark:hover{color:white;background:radial-gradient(ellipse at var(--glass-x,28%) var(--glass-y,0%),#ffffff45,transparent 75%),linear-gradient(165deg,#258ff5,#0871dc)}
.btn:disabled{transform:none!important;box-shadow:none!important;cursor:not-allowed}
.filters,.work-tabs,.task-audience-tabs,.content-categories{padding:5px;background:#dfe6f073;border:1px solid #ffffff75;border-radius:16px;box-shadow:inset 0 1px 3px #3a506509;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.filter.active,.tab.active,.work-tab.active,.content-category.active{background:linear-gradient(155deg,#ffffffed,#ffffff9c);border-radius:12px;box-shadow:var(--glass-highlight),0 2px 6px #2f4e7820;color:#1263bd}
.filter,.work-tab,.content-category{min-height:34px;padding-inline:13px;transition:background .2s,box-shadow .2s}.filter:active,.work-tab:active{transform:scale(.97)}
.chat-launcher,.chat-toggle{background:radial-gradient(ellipse at var(--glass-x,20%) var(--glass-y,0%),#ffffffdb,transparent 80%),linear-gradient(140deg,#ffffffba,#ecf2fbaa)!important;box-shadow:var(--glass-highlight),0 10px 35px #28456824!important;backdrop-filter:blur(25px) saturate(1.75);-webkit-backdrop-filter:blur(25px) saturate(1.75)}
.review-transport .btn:not([data-player=play]){background:linear-gradient(155deg,#ffffffe0,#e8f0f9c2);border:1px solid #fff;color:#344965}.review-transport [data-player=play]{background:linear-gradient(150deg,#268ef1,#076fd9);color:white}
.timeline-playhead{width:4px;background:linear-gradient(90deg,#ffffff80,#fff,#b4d8ffc9);box-shadow:0 0 0 1px #0066bd99,0 0 10px #001f6680}.timeline-playhead:before{width:13px;height:13px;left:-4.5px;background:linear-gradient(140deg,#ffffffed,#c0dbffbd);border:1px solid white;border-radius:5px;box-shadow:0 2px 5px #15396f70}
.review-scrubber:focus-visible{outline:3px solid #0071e3;outline-offset:-3px}.timeline-track:has(.review-scrubber:active) .timeline-playhead:before{transform:scale(1.2);box-shadow:0 0 0 4px #c6dfff45,0 2px 8px #15396f80}
input[type=range]:not(.review-scrubber){accent-color:#0071e3}input[type=checkbox]{accent-color:#0071e3}
/* SVG displacement gives supported browsers optical refraction behind controls.
   WebKit retains its blur/saturation fallback; text is never part of the filter. */
@supports (backdrop-filter:url("#workroom-glass-lens")) and (not (-webkit-touch-callout:none)){
 .sidebar .nav.active,.btn:not(.ghost):hover:not(:disabled),.filter.active,.work-tab.active{backdrop-filter:url("#workroom-glass-lens") blur(12px) saturate(1.5)}
}
@media(min-width:1181px){.sidebar,.client-mode .sidebar{inset:12px auto 12px 12px;width:226px;border-radius:25px;padding:23px 13px 14px}.main{margin-left:250px}.sidebar .brand{padding-inline:9px;margin-bottom:18px}.sidebar .workspace-pill{margin-bottom:10px}.content{padding-inline:30px}.topbar{padding-inline:30px}}
@media(min-width:761px) and (max-width:1180px){.sidebar,.client-mode .sidebar{inset:9px auto 9px 9px;width:202px;border-radius:23px;padding-inline:10px}.main{margin-left:221px}}
@media(max-width:760px){.sidebar,.client-mode .sidebar{inset:9px auto 9px 9px;border-radius:25px;width:280px;height:calc(100dvh - 18px);background:linear-gradient(145deg,#ffffffed,#edf3f9ed)}.sidebar.open{box-shadow:0 18px 70px #15283e38}.sidebar .nav{min-height:45px}.main{margin-left:0}.topbar{gap:12px}.btn:not(.small){min-height:42px}.filters,.work-tabs,.task-audience-tabs,.content-categories{border-radius:15px}.filter,.work-tab,.content-category{min-height:38px}.top-actions{gap:6px}}
@media(prefers-reduced-transparency:reduce){.sidebar,.client-mode .sidebar,.topbar{background:#f2f5fa!important}.btn:not(.ghost),.top-client-select,.filter.active,.work-tab.active,.sidebar .nav.active,.client-mode .sidebar .nav.active,.chat-launcher,.chat-toggle{background:#fff!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}.btn.primary,.btn.dark{background:#0671df!important;color:white!important}.filters,.work-tabs,.task-audience-tabs,.content-categories{background:#e8edf4;backdrop-filter:none;-webkit-backdrop-filter:none}}
@media(prefers-contrast:more){.sidebar,.topbar{background:#f4f7fb!important}.btn:not(.ghost),.sidebar .nav.active{border-color:#899aaf;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}.sidebar .nav.active{background:#fff!important;color:#0053a6!important}.filter.active,.work-tab.active{outline:1px solid #899aaf}.btn.primary,.btn.dark{background:#0066c9;color:white}}
@media(prefers-reduced-motion:reduce){.btn,.nav,.filter,.work-tab{transition:none!important;transform:none!important}}

@media(min-width:761px) and (max-height:800px){.sidebar,.client-mode .sidebar{padding-top:17px;padding-bottom:12px}.sidebar .brand{margin-bottom:11px}.sidebar .workspace-pill{padding-bottom:8px;margin-bottom:6px}.sidebar .nav,.client-mode .sidebar .nav{min-height:36px;padding-block:7px}.sidebar .nav-section+.nav-section{margin-top:12px}.sidebar .side-label{margin-block:6px}.sidebar-bottom{padding-top:9px}}

@media(max-width:760px){.field input,.field textarea,.field select,.search input{font-size:16px}.field input,.field select{min-height:44px}}