body[data-palette]{--side-width:226px;transition:background-color .25s,color .25s}
body[data-palette] .sidebar{border-right:0;background:var(--side);transition:width .28s var(--ease),background-color .25s}
body[data-palette] .sidebar .brand,body[data-palette] .workspace strong,body[data-palette] .profile strong{color:#f2f5fc}
body[data-palette] .sidebar .brand-mark{background:var(--side-accent);color:var(--side)}
body[data-palette] .sidebar .workspace,body[data-palette] .sidebar .profile{border-color:var(--side-line)}
body[data-palette] .sidebar .avatar{background:var(--side-avatar);color:#e1eaf9}
body[data-palette] .nav-link[aria-current=page]{box-shadow:inset 2px 0 0 var(--side-accent)}
body[data-palette] .shell{transition:margin-left .28s var(--ease);padding-bottom:48px}
body[data-palette] .panel,body[data-palette] .metric,body[data-palette] .topbar{transition:background-color .25s,border-color .25s}
body[data-palette] .topbar{gap:12px}
.desktop-collapse{margin-left:-7px;color:var(--muted)}
.desktop-collapse .icon{transition:transform .28s var(--ease)}
.color-mode-control{display:flex;gap:2px;background:var(--canvas);padding:3px;border:1px solid var(--line);border-radius:9px}
.color-mode-control button{display:flex;align-items:center;gap:6px;padding:5px 8px;border-radius:6px;color:var(--muted);font-size:10px;min-height:27px}
.color-mode-control .icon{width:14px;height:14px}
.color-mode-control button[aria-pressed=true]{background:var(--surface);color:var(--ink);box-shadow:0 1px 4px #0000000d}
.color-mode-control button:hover{background:var(--soft)}
.color-review{position:fixed;left:var(--side-width);right:0;bottom:0;height:42px;background:var(--surface);border-top:1px solid var(--line);z-index:15;display:flex;align-items:center;justify-content:space-between;padding:4px 15px;gap:12px;transition:left .28s var(--ease),background-color .25s,border-color .25s}
.back-directions{display:flex;align-items:center;gap:5px;font-size:10px;color:var(--muted);white-space:nowrap}
.back-directions .icon{width:12px;height:12px;transform:rotate(180deg)}
.palette-options{display:flex;gap:5px;align-items:center}
.palette-options button{display:flex;align-items:center;gap:7px;font-size:11px;padding:5px 9px;border:1px solid transparent;border-radius:7px;color:var(--muted);height:31px}
.palette-options button i{height:15px;width:19px;border-radius:4px;background:var(--swatch);box-shadow:inset -6px 0 var(--swatch-accent);border:1px solid #ffffff40}
.palette-options button:hover{background:var(--soft);color:var(--ink)}
.palette-options button[aria-pressed=true]{background:var(--soft);color:var(--ink);border-color:var(--line)}
.palette-caption{font-size:10px;color:var(--muted);min-width:102px;text-align:right}
.round-link{font-size:10px;color:var(--muted);white-space:nowrap}
.round-link:hover,.back-directions:hover{color:var(--ink)}
/* Branding stays in controls and small details; the workspace remains quiet. */
body[data-collection=branding] .btn.primary{background:var(--primary);border-color:var(--primary);color:var(--primary-ink)}
body[data-collection=branding] .btn.primary:hover{filter:brightness(1.07);box-shadow:0 3px 9px color-mix(in srgb,var(--primary) 15%,transparent)}
body[data-collection=branding] .chart .plot,body[data-collection=branding] .chart .point{stroke:var(--chart)}
body[data-collection=branding] .sidebar .avatar{color:#e7e7e9}
body[data-collection=branding] .sidebar .brand,body[data-collection=branding] .workspace strong,body[data-collection=branding] .profile strong{color:#f5f5f6}
body[data-collection=branding] .avatar.peach,body[data-collection=branding] .avatar.blue,body[data-collection=branding] .avatar.green,body[data-collection=branding] .avatar.pink{background:var(--soft);color:var(--muted)}
body[data-collection=branding] .course-thumb,body[data-collection=branding] .course-cover{background:var(--soft)!important;color:var(--muted)!important}
body[data-collection=branding] .webinar-art{background:var(--soft);color:var(--muted)}
body[data-collection=branding] .mini-panel.feature{background:var(--surface);border-color:var(--line)}
body[data-collection=branding] .nav-link[aria-current=page]::after{background:var(--side-accent)}
body[data-collection=branding] .sidebar :focus-visible{outline-color:var(--side-accent)}
body[data-collection=branding][data-finish=satin] .panel,body[data-collection=branding][data-finish=satin] .metric{background-image:linear-gradient(180deg,#ffffff30,transparent 55px);box-shadow:inset 0 1px 0 #ffffff80,0 2px 4px #00000003}
body[data-collection=branding][data-finish=satin] .sidebar{background-image:linear-gradient(160deg,#ffffff09,transparent 48%)}
body[data-collection=branding][data-finish=satin] .nav-link[aria-current=page]{background-image:linear-gradient(180deg,#ffffff0d,transparent);box-shadow:inset 2px 0 0 var(--side-accent),inset 0 1px 0 #ffffff15}
body[data-appearance=dark][data-collection=branding][data-finish=satin] .panel,body[data-appearance=dark][data-collection=branding][data-finish=satin] .metric{background-image:linear-gradient(180deg,#ffffff08,transparent 65px);box-shadow:inset 0 1px 0 #ffffff0c,0 4px 12px #00000012}
body[data-appearance=dark]{color-scheme:dark}
body[data-appearance=dark]:not([data-collection=branding]) .avatar.peach,body[data-appearance=dark]:not([data-collection=branding]) .avatar.blue,body[data-appearance=dark]:not([data-collection=branding]) .avatar.green,body[data-appearance=dark]:not([data-collection=branding]) .avatar.pink{background:#343c4d;color:#d3dceb}
body[data-appearance=dark] .chart .area{opacity:.5}
body[data-appearance=dark] .btn.primary{box-shadow:none}
body[data-appearance=dark]:not([data-collection=branding]) .course-thumb,body[data-appearance=dark]:not([data-collection=branding]) .course-cover{background:#2e3b49!important;color:#b4c8df!important}
body[data-appearance=dark]:not([data-collection=branding]) .webinar-art{background:#2b354c;color:#c4d3f0}
@media(min-width:701px){
 body[data-palette].compact-menu{--side-width:76px}
 .compact-menu .sidebar{padding-left:12px;padding-right:12px}
 .compact-menu .brand{padding:0 0 22px;justify-content:center}
 .compact-menu .brand-name,.compact-menu .workspace>span:not(.avatar),.compact-menu .workspace>.icon,.compact-menu .profile>span:not(.avatar),.compact-menu .profile>.icon,.compact-menu .nav-link>span,.compact-menu .sidebar-footer .nav-link>.icon:last-child:not(:first-child){display:none}
 .compact-menu .workspace,.compact-menu .profile{justify-content:center;padding-left:0;padding-right:0}
 .compact-menu .nav-link{justify-content:center;padding-left:0;padding-right:0;min-height:37px}
 .compact-menu .nav-link[aria-current=page]::after{display:none}
 .compact-menu .nav-label{font-size:0;letter-spacing:0;margin:8px 10px;height:8px;border-bottom:1px solid var(--side-line)}
 .compact-menu .nav-label:first-child{margin-top:0}
 .compact-menu .desktop-collapse .icon{transform:rotate(180deg)}
}
@media(max-width:1050px){.palette-caption{display:none}.color-review{justify-content:center;gap:16px}.color-mode-control button span{display:none}.color-mode-control button{padding:6px}}
@media(max-width:700px){
 body[data-palette] .sidebar{transition:transform .28s var(--ease),background-color .25s}
 .desktop-collapse{display:none}.color-review{left:0;height:47px;padding:4px 6px;gap:2px;justify-content:center}.back-directions,.round-link{display:none}
 .palette-options{width:100%;justify-content:space-between;gap:0}.palette-options button{font-size:9px;padding:4px 5px;gap:4px;flex-direction:column;height:38px;border-radius:6px;min-width:55px}.palette-options button i{height:10px;width:24px}
 body[data-palette] .topbar{gap:8px}.color-mode-control{padding:2px;gap:0}.color-mode-control button{padding:5px}
 .color-mode-control .icon{width:13px;height:13px}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important}}
/* Consolidated working cabinet: appearance lives in settings. */
body[data-workspace=true] .shell{padding-bottom:24px}
.appearance-panel{margin-bottom:24px}
.appearance-panel>.panel-head{margin-bottom:20px}
.theme-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.theme-choice{display:block;text-align:left;padding:10px;border:1px solid var(--line);border-radius:12px;min-width:0;background:var(--surface)}
.theme-choice:hover{background:var(--canvas);border-color:var(--muted)}
.theme-choice[aria-pressed=true]{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.theme-mini{display:flex;height:88px;background:var(--mini-canvas);border:1px solid var(--mini-line);border-radius:7px;overflow:hidden}
.mini-nav{width:24%;background:var(--mini-side);padding:12px 7px;display:flex;flex-direction:column;gap:7px}
.mini-nav i{height:8px;width:8px;border-radius:2px;background:var(--mini-accent);margin-bottom:3px}
.mini-nav b{display:block;height:3px;background:#ffffff55;width:85%;border-radius:2px}
.mini-nav b:first-of-type{background:var(--mini-accent)}
.mini-main{flex:1;padding:12px;display:flex;flex-direction:column;gap:9px}
.mini-main>i{background:var(--mini-accent);width:33%;height:4px;border-radius:2px}
.mini-main>span{display:flex;gap:6px;height:19px}
.mini-main b{flex:1;background:var(--mini-surface);border:1px solid var(--mini-line);border-radius:3px}
.mini-main em{flex:1;background:var(--mini-surface);border:1px solid var(--mini-line);border-radius:3px}
.theme-choice-name{display:flex;align-items:center;gap:8px;margin:10px 2px 3px;font-size:13px;font-weight:500}
.theme-choice-name small{font-size:9px;background:var(--soft);color:var(--muted);padding:2px 5px;border-radius:4px}
.theme-choice-name>i{margin-left:auto;color:var(--accent);opacity:0;display:flex}
.theme-choice-name>i .icon{width:15px;height:15px}
.theme-choice[aria-pressed=true] .theme-choice-name>i{opacity:1}
.theme-choice-description{display:block;font-size:10px;color:var(--muted);margin:0 2px}
.appearance-hint{display:flex;gap:7px;align-items:center;color:var(--muted);font-size:11px;margin-top:18px}
.appearance-hint .icon{width:14px;height:14px}
@media(max-width:850px){.theme-choices{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:420px){.theme-choices{gap:12px}.theme-choice{padding:8px}.theme-choice-description{font-size:9px}.theme-mini{height:75px}.mini-main{padding:9px}}