/* Appearance system: palette tokens + deliberate material variants. */
body{--appearance-hue:151;background:var(--paper)}
.sidebar,.topbar{background:var(--paper);color:var(--ink)}
.brand small,.dark .brand small{color:var(--muted)!important}.brand-mark{background:var(--green);color:var(--white)}
.theme-toggle{margin-top:24px;padding:10px 12px;gap:9px;min-height:48px;color:var(--ink)}
#themeIcon{display:flex;min-width:22px;color:var(--green)}#themeIcon svg{width:21px;height:21px}
.theme-toggle>span:nth-child(2){flex:1;text-align:left;font-size:12px}
.theme-toggle .celestial-switch{position:relative;display:flex;align-items:center;justify-content:space-around;width:52px;height:28px;flex:0 0 52px;padding:3px;background:var(--surface-soft);border:1px solid var(--line);border-radius:20px}
.celestial-switch .ui-icon{width:14px;height:14px;z-index:1;color:var(--muted)}.celestial-switch b{position:absolute;left:3px;top:3px;width:20px;height:20px;border-radius:50%;background:var(--white);box-shadow:0 1px 4px #10251b25;transition:transform .25s ease}.dark .celestial-switch b{transform:translateX(23px)}
.appearance-open{width:100%;display:flex;align-items:center;gap:10px;padding:11px 12px;margin-top:8px;border:0;border-radius:10px;background:transparent;color:var(--muted);text-align:left;font-size:13px!important}.appearance-open:hover{background:var(--green-light);color:var(--green)}.appearance-open .ui-icon{width:20px;height:20px}.appearance-top-open{display:none;flex-shrink:0}
.appearance-dialog{width:min(980px,calc(100vw - 48px));max-width:980px;max-height:calc(100dvh - 48px);padding:0;border-radius:18px;background:var(--white);color:var(--ink);overflow:auto;border:1px solid var(--line)}
.appearance-dialog::backdrop{background:#12261fc2;backdrop-filter:blur(6px)}
.appearance-header{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding:26px 28px 22px;border-bottom:1px solid var(--line)}.appearance-header h2{font-size:24px!important;letter-spacing:-.03em;margin:0 0 7px;line-height:1.35}.appearance-header p{font-size:13px;color:var(--muted);margin:0;line-height:1.6;max-width:58ch}
.appearance-close{width:40px;height:40px;min-width:40px;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;background:var(--white);color:var(--ink)}
.appearance-body{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:28px;padding:24px 28px}.appearance-options{min-width:0}.appearance-options section+section{margin-top:26px;padding-top:22px;border-top:1px solid var(--line)}.appearance-options h3{font-size:15px!important;margin:0 0 14px;letter-spacing:0}
.appearance-styles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.style-option{position:relative;min-width:0;display:flex;flex-direction:column;text-align:left;padding:10px;border:1px solid var(--line);border-radius:12px;background:var(--white);color:var(--ink);font-size:13px!important}.style-option:hover{background:var(--paper)}.style-option[aria-pressed=true]{border-color:var(--green);background:var(--green-light)}.style-option strong{font-weight:650;margin:10px 0 3px}.style-option small{font-size:11px!important;font-weight:400;color:var(--muted);line-height:1.5}.option-check{position:absolute;top:12px;right:12px;display:none;width:22px;height:22px;place-items:center;border-radius:50%;background:var(--green);color:var(--white)}.option-check svg{width:14px;height:14px}.style-option[aria-pressed=true] .option-check{display:grid}
.style-thumbnail{height:68px;width:100%;position:relative;border-radius:7px;overflow:hidden;background:#edf1ed}.style-thumbnail i{position:absolute;left:12%;top:16%;width:18%;height:70%;border-radius:5px;background:#fff}.style-thumbnail b{position:absolute;left:36%;top:22%;width:48%;height:20%;border-radius:4px;background:#789d8a}.style-thumbnail em{position:absolute;left:36%;top:50%;width:48%;height:30%;border-radius:4px;background:#fff}.thumb-sculpt{background:#193f33}.thumb-sculpt b{background:#47755f;box-shadow:0 3px 5px #0003}.thumb-sculpt em{background:#315b49;box-shadow:inset 0 1px #ffffff3b,0 3px 5px #0002}.thumb-glass{background:linear-gradient(130deg,#a3c9cf,#dcd9f2 60%,#c0d4c2)}.thumb-glass i,.thumb-glass em{background:#ffffff70;border:1px solid #fff8;box-shadow:0 3px 9px #5b758529}.thumb-glass b{background:#ffffffa0}.thumb-minimal{background:#f7f7f7}.thumb-minimal i,.thumb-minimal em{border:1px solid #d5ddd7;border-radius:2px}.thumb-minimal b{background:#334f42;border-radius:2px}.thumb-soft{background:#e6ece8}.thumb-soft i,.thumb-soft em{background:#e6ece8;box-shadow:4px 4px 6px #bcc8c2,-4px -4px 6px #fff}.thumb-soft b{background:#a0b9aa;border-radius:5px}
.palette-options{display:grid;grid-template-columns:1fr 1fr;gap:8px}.palette-options button{display:flex;align-items:center;gap:8px;padding:9px 10px;text-align:left;background:var(--white);border:1px solid var(--line);border-radius:8px;color:var(--ink);font-size:12px!important;min-width:0}.palette-options i{width:18px;height:18px;border-radius:50%;background:var(--swatch);flex-shrink:0}.palette-options button>.ui-icon{width:15px;height:15px;margin-left:auto;visibility:hidden}.palette-options [aria-pressed=true]{border-color:var(--green);background:var(--green-light)}.palette-options [aria-pressed=true]>.ui-icon{visibility:visible}
.appearance-field{display:grid;gap:8px;font-size:12px;color:var(--muted)}.appearance-field select{max-width:100%;width:100%;background:var(--white);color:var(--ink);padding:11px;border:1px solid var(--line);border-radius:8px;font-size:13px}
.appearance-setting-row{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:13px;margin-top:12px;min-height:44px}.appearance-segment{display:flex;padding:3px;border:1px solid var(--line);border-radius:9px;background:var(--paper)}.appearance-segment button{border:0;border-radius:6px;background:transparent;color:var(--muted);padding:7px 10px;min-height:34px;font-size:12px!important}.appearance-segment [aria-pressed=true]{background:var(--white);color:var(--green);box-shadow:0 1px 3px #10251b15}
.appearance-check{display:flex;justify-content:space-between;gap:16px;align-items:center;font-size:13px;min-height:60px}.appearance-check small{display:block;font-size:11px!important;color:var(--muted);margin-top:4px}.appearance-check input{width:20px;height:20px;min-height:20px;accent-color:var(--green);flex-shrink:0}.appearance-note{font-size:11px!important;line-height:1.7;color:var(--muted)}
.appearance-preview{position:sticky;top:18px;align-self:start;min-width:0;padding:16px;background:var(--paper);border:1px solid var(--line);border-radius:14px}.preview-label{font-size:11px;font-weight:600;color:var(--muted);margin-bottom:14px}.preview-window{border:1px solid var(--line);border-radius:11px;overflow:hidden;background:var(--white)}.preview-bar{display:flex;gap:6px;align-items:center;border-bottom:1px solid var(--line);padding:12px;font-size:14px}.preview-brand{display:grid;place-items:center;width:22px;height:22px;border-radius:6px;background:var(--green);color:var(--white);font-size:18px;font-weight:700}.preview-dot{margin-left:auto;width:6px;height:6px;border-radius:50%;background:var(--green)}.preview-content{padding:14px}.preview-content h3{font-size:16px!important;line-height:1.5;letter-spacing:-.02em;margin:0}.preview-content>p{font-size:11px;color:var(--muted);line-height:1.6;margin:6px 0 16px}.preview-metric{position:relative;background:var(--green-dark);color:#fff;padding:14px;border-radius:9px}.preview-metric small{display:block;font-size:11px!important}.preview-metric strong{display:block;font-size:28px;margin-top:4px}.preview-metric>span{position:absolute;right:18px;top:24px}.preview-metric svg{width:32px;height:32px;opacity:.75}.preview-rows{margin-top:12px;font-size:10px}.preview-rows>div{display:flex;justify-content:space-between;gap:8px;padding:12px 0;border-bottom:1px solid var(--line)}.preview-rows b{font-size:9px;color:var(--green);font-weight:500}.preview-content>.primary-button{width:100%;font-size:11px!important;min-height:38px;margin-top:14px;opacity:1}.preview-type{display:flex;gap:12px;align-items:center;margin-top:20px}.preview-type>span{font-size:34px;letter-spacing:-.03em}.preview-type strong{font-size:12px}.preview-type p{font-size:11px;color:var(--muted);margin:5px 0}.preview-theme{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;border:1px solid var(--line);background:var(--white);color:var(--ink);border-radius:9px;padding:10px;font-size:12px!important}.preview-theme svg{width:18px}
.appearance-footer{position:sticky;bottom:0;z-index:4;display:flex;align-items:center;gap:14px;padding:16px 28px;background:var(--white);border-top:1px solid var(--line)}.appearance-footer>span{margin-left:auto;font-size:11px;color:var(--muted)}.appearance-reset{padding:8px 0;border:0;background:transparent;color:var(--muted);font-size:12px!important}.appearance-reset:hover{color:var(--green)}.appearance-footer .primary-button{font-size:13px!important;padding:9px 22px}
/* Global material layers. Numeric tables remain opaque. */
body[data-style=glass]{background:radial-gradient(ellipse at 85% 0%,hsl(var(--appearance-hue) 45% 86% / .8),transparent 55%),radial-gradient(ellipse at 0 90%,#d8dcf0,transparent 55%),var(--paper);background-attachment:fixed}
body[data-style=glass] .sidebar,body[data-style=glass] .topbar,body[data-style=glass] .subnav{background:color-mix(in srgb,var(--white) 72%,transparent);backdrop-filter:blur(22px) saturate(1.35);-webkit-backdrop-filter:blur(22px) saturate(1.35);border:1px solid color-mix(in srgb,var(--white) 75%,var(--line));box-shadow:inset 0 1px 0 #ffffff8a,0 8px 24px #2338480a}
body[data-style=glass] .content-wrap{background:color-mix(in srgb,var(--white) 88%,transparent);border-color:color-mix(in srgb,var(--white) 80%,var(--line))}
body[data-style=glass] #teachingMetrics .metric-card{background:linear-gradient(135deg,hsl(var(--appearance-hue) 30% 30% / .9),hsl(var(--appearance-hue) 35% 18% / .96));border:1px solid #ffffff4a;box-shadow:inset 0 1px 0 #ffffff75,0 10px 20px #18382918}
body[data-style=glass] .preview-window{background:color-mix(in srgb,var(--white) 72%,transparent);box-shadow:inset 0 1px #ffffff80,0 6px 18px #10251b13}.dark[data-style=glass]{background:radial-gradient(ellipse at 90% 0%,hsl(var(--appearance-hue) 30% 23%),transparent 65%),var(--paper)}
body[data-style=minimal] #teachingMetrics .metric-card{background:var(--white);box-shadow:none;border:1px solid var(--line);border-radius:8px}body[data-style=minimal] #teachingMetrics .metric-copy small{color:var(--muted)}body[data-style=minimal] #teachingMetrics .metric-copy strong{color:var(--ink)}body[data-style=minimal] .metric-sculpture{filter:none;opacity:.9}body[data-style=minimal] .content-wrap{border-radius:8px}body[data-style=minimal] .workflow-next,body[data-style=minimal] .preview-metric{box-shadow:none;border-radius:6px}
body[data-style=soft] .content-wrap{background:var(--paper);border:0}body[data-style=soft] .subnav,body[data-style=soft] .preview-window{background:var(--paper);box-shadow:6px 6px 15px #193f3412,-5px -5px 14px #ffffff80;border-color:transparent}body[data-style=soft] #teachingMetrics .metric-card{background:var(--paper);box-shadow:6px 6px 14px #193f341a,-5px -5px 14px #ffffffa0}body[data-style=soft] #teachingMetrics .metric-copy small{color:var(--muted)}body[data-style=soft] #teachingMetrics .metric-copy strong{color:var(--ink)}.dark[data-style=soft] .subnav,.dark[data-style=soft] #teachingMetrics .metric-card{box-shadow:6px 6px 15px #0004,-4px -4px 12px #ffffff06}
body[data-palette] #teachingMetrics .metric-card{--metric-start:hsl(var(--appearance-hue) 30% 27%);--metric-end:hsl(var(--appearance-hue) 38% 15%)}body[data-style=sculpt] #teachingMetrics .metric-card{background:linear-gradient(125deg,var(--metric-start),var(--metric-end))}body[data-style=sculpt] #teachingMetrics .metric-card:nth-child(2){background:linear-gradient(125deg,hsl(var(--appearance-hue) 25% 33%),var(--metric-end))}
body[data-palette] .workflow-next{background:var(--green-dark)}body.dark[data-palette] .workflow-next{background:var(--green);color:#142820}body[data-palette] .nav-item.active{background:var(--green-light);color:var(--green)}
body[data-density=compact] .content-wrap{padding-top:24px}body[data-density=compact] .collection-table td{padding-block:10px}body[data-density=compact] .session-list .session-student{min-height:58px;padding-block:6px}body[data-density=compact] #teachingMetrics .metric-card{min-height:108px}body[data-density=compact] .page-title-row{margin-bottom:18px}body[data-density=compact] .subnav{margin-top:16px}
body[data-size=large]{--text-base:17px;--text-button:15px;--text-xs:14px}body[data-size=large] .collection-table td{font-size:15px!important}body[data-size=large] .page-subtitle{font-size:16px}body[data-size=large] .session-student>b{font-size:16px!important}body[data-size=large] .appearance-note{font-size:12px!important}
body[data-motion=false] *,body[data-motion=false] *::before,body[data-motion=false] *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
body[data-transparency=false] .sidebar,body[data-transparency=false] .topbar,body[data-transparency=false] .subnav,body[data-transparency=false] .content-wrap{background:var(--white);backdrop-filter:none;-webkit-backdrop-filter:none}
@media(min-width:1101px){body[data-layout=top] .sidebar{position:fixed;inset:0 0 auto;width:100%;height:78px;padding:12px 28px;display:flex;align-items:center;gap:28px;overflow:visible;z-index:25;border-bottom:1px solid var(--line)}body[data-layout=top] .brand{padding:0;flex-shrink:0;font-size:22px!important}body[data-layout=top] .brand small{display:none}body[data-layout=top] .side-label,body[data-layout=top] .sidebar-bottom,body[data-layout=top] .appearance-open{display:none}body[data-layout=top] .nav-list{display:flex;flex-direction:row;gap:6px;margin:0;flex:1}body[data-layout=top] .nav-item{font-size:12px!important;white-space:nowrap;padding:10px}body[data-layout=top] .theme-toggle{margin:0;width:58px;padding:8px;border:0;background:transparent}body[data-layout=top] .theme-toggle>span{display:none}body[data-layout=top] .main-area{margin-left:0;padding-top:78px}body[data-layout=top] .topbar{position:relative}body[data-layout=top] .appearance-top-open{display:grid}body[data-layout=top] .content-wrap{margin-inline:auto}}
@media(max-width:1100px){.appearance-top-open{display:grid}.appearance-body{grid-template-columns:minmax(0,1fr) 260px;gap:20px}}
@media(max-width:760px){.appearance-dialog{width:calc(100vw - 20px);max-height:calc(100dvh - 20px);border-radius:14px}.appearance-header{padding:20px 18px;gap:10px}.appearance-header h2{font-size:21px!important}.appearance-header p{font-size:12px}.appearance-body{display:flex;flex-direction:column;padding:18px;gap:24px}.appearance-preview{position:static;max-width:none;width:100%}.appearance-options{width:100%}.appearance-footer{padding:12px 18px;flex-wrap:wrap;gap:8px}.appearance-footer>span{font-size:10px;margin-left:auto}.appearance-footer>.primary-button{margin-left:auto}.appearance-setting-row{align-items:flex-start}.appearance-segment button{min-height:40px}.style-option small{font-size:11px!important}.appearance-top-open{width:40px;height:40px;min-height:40px;border:0}.top-actions{gap:3px}.appearance-note{font-size:11px!important}body[data-density=compact] #teachingMetrics .metric-card{min-height:146px}}
@media(max-width:380px){.palette-options{grid-template-columns:1fr}.appearance-footer>span{flex-basis:100%;order:3;text-align:center}.appearance-styles{gap:8px}.appearance-header h2{font-size:19px!important}.style-option{padding:8px}.appearance-segment button{padding-inline:8px}.appearance-setting-row{gap:7px}.appearance-preview{padding:12px}}
@media(prefers-reduced-motion:reduce){.celestial-switch b{transition:none}}@media(prefers-reduced-transparency:reduce){body[data-style=glass] .sidebar,body[data-style=glass] .topbar,body[data-style=glass] .subnav,body[data-style=glass] .content-wrap{background:var(--white);backdrop-filter:none}}
@media(forced-colors:active){.style-option[aria-pressed=true],.palette-options [aria-pressed=true],.appearance-segment [aria-pressed=true]{outline:2px solid Highlight}.style-thumbnail{border:1px solid CanvasText}}
@media(min-width:1101px){body[data-layout=top] .sidebar{flex-direction:row!important}body[data-layout=top] .sidebar .brand{width:auto;margin:0}body[data-layout=top] .sidebar .nav-list{align-items:center}body[data-layout=top] .sidebar .theme-toggle{flex-shrink:0}body[data-layout=top] .topbar{z-index:10}}
body[data-style=minimal] .preview-metric{background:var(--paper);color:var(--ink);border:1px solid var(--line)}body[data-style=soft] .preview-metric{background:var(--paper);color:var(--ink);box-shadow:4px 4px 8px #183e3215,-4px -4px 8px #ffffff70}body[data-style=glass] .preview-metric{background:linear-gradient(130deg,hsl(var(--appearance-hue) 30% 30% / .86),hsl(var(--appearance-hue) 40% 20% / .95));box-shadow:inset 0 1px 0 #ffffff55,0 4px 10px #10251b13}
/* Material-aware artwork: only Nếp 3D uses the ceramic sculpture atlas. */
.metric-vector,.finance-style-icon{display:none}
body:not([data-style=sculpt]) .metric-sculpture{background-image:none;display:grid;place-items:center;filter:none}
body:not([data-style=sculpt]) .metric-vector{display:grid;place-items:center;width:72px;height:72px;color:var(--green)}
.metric-vector>.ui-icon{width:45px;height:45px;stroke-width:1.4}
body[data-style=glass] #teachingMetrics .metric-card{background:color-mix(in srgb,var(--white) 78%,transparent);border-color:color-mix(in srgb,var(--white) 80%,var(--line));box-shadow:inset 0 1px 0 #ffffffb0,0 8px 20px #15374410;backdrop-filter:blur(18px)}
body[data-style=glass] #teachingMetrics .metric-copy strong{color:var(--ink)}body[data-style=glass] #teachingMetrics .metric-copy small{color:var(--muted)}
body[data-style=glass] .metric-vector,body[data-style=glass] .finance-style-icon{border:1px solid color-mix(in srgb,var(--green) 25%,var(--white));border-radius:21px;background:linear-gradient(140deg,color-mix(in srgb,var(--white) 90%,transparent),color-mix(in srgb,var(--green-light) 62%,transparent));box-shadow:inset 0 1px 0 #ffffffd0,inset 0 -2px 4px #ffffff20,0 6px 12px #122f3612;transform:rotate(-7deg)}
body[data-style=glass] .metric-vector>.ui-icon{filter:drop-shadow(0 2px 1px #ffffff99)}
body[data-style=minimal] .metric-vector{color:var(--green);width:62px;height:62px;border:0;background:none}
body[data-style=minimal] .metric-vector>.ui-icon{width:46px;height:46px;stroke-width:1.2}
body[data-style=soft] .metric-vector,body[data-style=soft] .finance-style-icon{border-radius:22px;background:var(--paper);box-shadow:5px 5px 12px #183f321c,-5px -5px 12px #ffffffa0}
.dark[data-style=soft] .metric-vector,.dark[data-style=soft] .finance-style-icon{box-shadow:5px 5px 12px #0004,-4px -4px 10px #ffffff08}
body:not([data-style=sculpt]) .finance-art-scene .finance-ledger-art,body:not([data-style=sculpt]) .finance-art-scene .finance-art-spark,body:not([data-style=sculpt]) .finance-art-scene .finance-art-shadow{display:none}
body:not([data-style=sculpt]) .finance-style-icon{display:grid;place-items:center;width:66px;height:66px;color:var(--green)}.finance-style-icon>.ui-icon{width:38px;height:38px;stroke-width:1.5}
body:not([data-style=sculpt]) .tuition-column-icon .ui-icon{transform:none;filter:none}
body[data-style=glass] .tuition-column-icon .ui-icon{filter:drop-shadow(0 1px 1px #ffffff90)}
body[data-style=soft] .tuition-column-icon .ui-icon{filter:drop-shadow(1px 2px 1px #122e2525)}
/* Quiet atmospheric background, with opaque working surfaces. */
body[data-layout=top]{background:radial-gradient(ellipse at 8% 5%,hsl(var(--appearance-hue) 35% 85% / .6),transparent 46%),radial-gradient(ellipse at 92% 28%,hsl(calc(var(--appearance-hue) + 35) 32% 90% / .7),transparent 45%),var(--paper);background-attachment:fixed}
body.dark[data-layout=top]{background:radial-gradient(ellipse at 8% 5%,hsl(var(--appearance-hue) 22% 22% / .6),transparent 46%),radial-gradient(ellipse at 92% 28%,hsl(calc(var(--appearance-hue) + 35) 25% 18% / .5),transparent 45%),var(--paper)}
body[data-layout=top][data-style=minimal]{background:var(--paper)}body[data-layout=top] .content-wrap{max-width:1380px;margin:18px auto 26px;border-radius:18px;min-height:calc(100dvh - 194px)}
@media(min-width:901px){body[data-layout=top] .sidebar{position:fixed;inset:0 0 auto;width:100%;height:76px;display:flex!important;flex-direction:row!important;align-items:center;gap:20px;padding:12px 24px;overflow:visible;z-index:25;border-bottom:1px solid var(--line);transform:none;visibility:visible}body[data-layout=top] .brand{padding:0;margin:0;width:auto;flex-shrink:0;font-size:23px!important}body[data-layout=top] .brand small,body[data-layout=top] .side-label,body[data-layout=top] .sidebar-bottom,body[data-layout=top] .appearance-open{display:none}body[data-layout=top] .brand-mark{width:38px;height:38px}body[data-layout=top] .nav-list{display:flex;flex-direction:row;align-items:center;gap:4px;margin:0;flex:1;min-width:0}body[data-layout=top] .nav-item{white-space:nowrap;padding:10px;font-size:12px!important;gap:7px;min-height:44px}body[data-layout=top] .nav-icon{width:19px}body[data-layout=top] .theme-toggle{margin:0;width:58px;flex-shrink:0;padding:5px;border:0;background:transparent}body[data-layout=top] .theme-toggle>span{display:none}body[data-layout=top] .main-area{margin-left:0;padding-top:76px}body[data-layout=top] .topbar{position:relative;height:64px;background:transparent;border:0;backdrop-filter:none;padding-inline:max(28px,calc((100vw - 1380px)/2 + 28px))}body[data-layout=top] .appearance-top-open{display:grid}body[data-layout=top] .mobile-menu{display:none}body[data-layout=top] .content-wrap{width:calc(100% - 48px)}}
@media(max-width:900px){body[data-layout=top] .sidebar{position:fixed;inset:0 auto 0 0;width:270px;height:100dvh;transform:translateX(-100%);visibility:hidden;z-index:30;display:flex;flex-direction:column}body[data-layout=top] .sidebar.open{transform:translateX(0);visibility:visible}body[data-layout=top] .main-area{margin-left:0;padding-top:0}body[data-layout=top] .mobile-menu{display:grid;place-items:center;min-width:44px;min-height:44px;border:0;background:transparent;color:var(--ink)}body[data-layout=top] .menu-scrim.show{display:block;position:fixed;inset:0;z-index:29;background:#14251bb0;border:0}body[data-layout=top] .content-wrap{margin:8px 12px 20px;padding:22px 18px;max-width:calc(100% - 24px);border-radius:15px}body[data-layout=top] .topbar{padding-inline:12px;height:62px}body[data-layout=top] .breadcrumb-prefix{display:none}}
@media(max-width:600px){body:not([data-style=sculpt]) .metric-vector{width:48px;height:48px;border-radius:14px}body:not([data-style=sculpt]) .metric-vector .ui-icon{width:32px;height:32px}body:not([data-style=sculpt]) .finance-style-icon{width:55px;height:55px;border-radius:16px}body[data-layout=top] .content-wrap{margin:0;padding:22px 16px;max-width:100%;border:0;border-radius:0}.topbar .today-label{display:none}}
/* Stable, randomly assigned Vietnamese zodiac portraits. */
.zodiac-avatar{display:inline-block!important;flex:0 0 auto!important;width:36px;height:36px;min-width:36px;border-radius:50%;background-color:#faf5ed!important;background-image:url('assets/zodiac-avatars.png')!important;background-size:400% 300%!important;background-position:var(--zodiac-x) var(--zodiac-y)!important;background-repeat:no-repeat!important;border:1px solid color-mix(in srgb,var(--line) 65%,#f1e6d8);overflow:hidden;vertical-align:middle}
.session-list .session-student .zodiac-avatar{width:32px;height:32px;min-width:32px}
.compact-student-name{display:flex;align-items:center;gap:10px;min-width:0}.compact-student-name>span:last-child{min-width:0;overflow-wrap:anywhere}.compact-student-name .zodiac-avatar{width:34px;height:34px;min-width:34px}
.tuition-student-identity{display:flex;align-items:center;gap:10px;min-width:0}.tuition-student-identity>div{min-width:0}.tuition-student-identity b{font-size:14px;font-weight:600}.collection-table td:first-child{min-width:190px}
body[data-style=minimal] .zodiac-avatar{border-radius:9px}body[data-style=soft] .zodiac-avatar{box-shadow:2px 3px 5px #173e2515}
@media(max-width:760px){.collection-table td:first-child{min-width:0}.tuition-student-identity .zodiac-avatar{width:40px;height:40px;min-width:40px}}

@media(min-width:901px){body[data-layout=top] #themeIcon{display:none}body[data-layout=top] .theme-toggle .celestial-switch{margin:0}body[data-layout=top] .theme-toggle{width:58px}}

.top-account-open{display:none}@media(min-width:901px){body[data-layout=top] .top-account-open{display:grid}}
/* A compact action row replaces the redundant page introduction. */
.workflow-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;margin-left:auto;flex-shrink:0}.workflow-add-class{white-space:nowrap;min-height:46px;padding:10px 15px;border-radius:10px}.workflow-context>.workflow-actions .workflow-next{align-self:auto}
.font-size-field{margin-top:14px}.custom-color-row{display:flex;align-items:center;gap:12px;margin-top:14px;font-size:12px;flex-wrap:wrap}.custom-color-row input[type=color]{width:52px;height:38px;min-height:38px;padding:3px;border:1px solid var(--line);border-radius:8px;background:var(--white);cursor:pointer}.custom-color-row output{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
.appearance-range{display:block;margin-top:20px;font-size:12px}.appearance-range>span{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:5px}.appearance-range output{font-size:11px;color:var(--green);font-variant-numeric:tabular-nums}.appearance-range input{width:100%;height:30px;min-height:30px;accent-color:var(--green);cursor:pointer}.appearance-range>small{display:flex;justify-content:space-between;gap:12px;font-size:10px!important;color:var(--muted)}
body[data-style=glass][data-transparency=true] .sidebar,body[data-style=glass][data-transparency=true] .subnav,body[data-style=glass][data-transparency=true] .topbar{background:color-mix(in srgb,var(--white) calc(var(--glass-opacity,.75)*100%),transparent);backdrop-filter:blur(var(--glass-blur,20px)) saturate(1.2)}
body[data-style=glass][data-transparency=true] .content-wrap{background:color-mix(in srgb,var(--white) calc(max(.8,var(--glass-opacity,.85))*100%),transparent)}
body[data-style=glass] #teachingMetrics .metric-card,body[data-style=soft] #teachingMetrics .metric-card,body[data-style=sculpt] #teachingMetrics .metric-card{box-shadow:inset 0 1px 0 #ffffff35,0 6px 18px rgb(20 48 37 / var(--depth-alpha,.12))}
.finance-art-scene .finance-ledger-art{animation-duration:var(--motion-speed,5.6s)}@keyframes ledger-float{0%,100%{transform:translateY(1px) rotate(-2deg)}50%{transform:translateY(calc(-1*var(--motion-lift,7px))) rotate(2deg)}}
body[data-size] .page-subtitle,body[data-size] .collection-table td,body[data-size] .session-student>b,body[data-size] .class-name-button,body[data-size] .teaching-event,body[data-size] .today-session-copy p{font-size:var(--reading-size,15px)!important}body[data-size] .preview-content{font-size:var(--reading-size,15px)}body[data-size] .preview-content h3{font-size:var(--reading-size,15px)!important}
/* Zodiac world: warm stationery, soft stamps and tiny animal companions. */
.thumb-zodiac{background:#fff1df url('assets/zodiac-avatars.png') center 0/100% auto}.thumb-zodiac i,.thumb-zodiac b,.thumb-zodiac em{display:none}.style-option[data-value=zodiac]{grid-column:1 / -1;display:grid;grid-template-columns:100px 1fr;column-gap:14px;align-items:center}.style-option[data-value=zodiac] .style-thumbnail{grid-row:1 / 3;height:70px}.style-option[data-value=zodiac] strong{margin:0;align-self:end}.style-option[data-value=zodiac] small{align-self:start}
body[data-style=zodiac]{--zodiac-paper:#fffaf2;--zodiac-surface:#fff4e4;--zodiac-border:#e7d8c2;background:radial-gradient(ellipse at 0 0,#f7e6ca99,transparent 55%),radial-gradient(ellipse at 95% 55%,#e5eddf99,transparent 45%),#faf5ec;color:#3f4135}
body[data-style=zodiac] .content-wrap{background:var(--zodiac-paper);border:1px solid var(--zodiac-border);border-radius:24px}body[data-style=zodiac] .sidebar,body[data-style=zodiac] .topbar{background:#fffaf2ed;border-color:var(--zodiac-border)}
body[data-style=zodiac] #teachingMetrics .metric-card{background:#fff3df;border:1px solid #eadbc4;border-radius:20px;box-shadow:0 4px 0 #eadcc666,0 9px 18px #7a64400a}body[data-style=zodiac] #teachingMetrics .metric-card:nth-child(2){background:#edf3e8}body[data-style=zodiac] #teachingMetrics .metric-card:nth-child(3){background:#f9eee8}body[data-style=zodiac] #teachingMetrics .metric-copy strong{color:var(--ink)}body[data-style=zodiac] #teachingMetrics .metric-copy small{color:var(--muted)}
body[data-style=zodiac] .metric-sculpture{background-image:url('assets/zodiac-avatars.png')!important;background-size:400% 300%;background-color:#fff8ee;border-radius:50%;width:82px;height:82px;right:14px;box-shadow:0 4px 8px #765a2d12}body[data-style=zodiac] .metric-book{background-position:0 50%}body[data-style=zodiac] .metric-users{background-position:100% 0}body[data-style=zodiac] .metric-calendar{background-position:33.3333% 100%}body[data-style=zodiac] .metric-vector{display:none!important}
body[data-style=zodiac] .subnav{background:#f3eddf;border:1px solid var(--zodiac-border);border-radius:18px;padding:6px}body[data-style=zodiac] .subnav-item{border-radius:13px}body[data-style=zodiac] .subnav-item.active{background:#fffcf5;border-color:#e6d7c1;box-shadow:0 2px 0 #e5d5bd70}
body[data-style=zodiac] .subnav-item:before,body[data-style=zodiac] .nav-item:before{content:'';display:inline-block;width:27px;height:27px;flex:0 0 27px;border-radius:50%;background:#fff8ee url('assets/zodiac-avatars.png') 100% 0/400% 300%}body[data-style=zodiac] .subnav-item:nth-child(2):before{background-position:66.6667% 50%}body[data-style=zodiac] .subnav-item:nth-child(3):before{background-position:0 100%}body[data-style=zodiac] .subnav-item:nth-child(4):before{background-position:100% 100%}body[data-style=zodiac] .subnav-item:nth-child(5):before{background-position:66.6667% 0}body[data-style=zodiac] .subnav-item>.ui-icon,body[data-style=zodiac] .nav-item>.nav-icon{display:none}
body[data-style=zodiac] .primary-button,body[data-style=zodiac] .workflow-next{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:15px;box-shadow:inset 0 1px 0 #ffffff40,0 3px 0 color-mix(in srgb,var(--green-dark) 75%,#352e20);border:1px solid #ffffff28}body[data-style=zodiac] .primary-button:before{content:'';display:inline-block;width:22px;height:22px;flex:0 0 22px;border-radius:50%;background:#fff8ee url('assets/zodiac-avatars.png') 100% 0/400% 300%}
body[data-style=zodiac] .secondary-button,body[data-style=zodiac] .class-name-button,body[data-style=zodiac] .tuition-icon-button{border-radius:13px;border-color:var(--zodiac-border);background:#fffcf6}body[data-style=zodiac] .class-name-button{padding:16px 20px}body[data-style=zodiac] .class-name-button:before{content:'';width:28px;height:28px;display:inline-block;margin-right:10px;vertical-align:middle;border-radius:50%;background:#fff8ee url('assets/zodiac-avatars.png') 0 0/400% 300%}
body[data-style=zodiac] .attendance-control-bar,body[data-style=zodiac] .bulk-review,body[data-style=zodiac] .collection-table th{background:#f8efdf;border-color:var(--zodiac-border)}body[data-style=zodiac] .session-list,body[data-style=zodiac] .tuition-table-wrap,body[data-style=zodiac] .tuition-finance-overview,body[data-style=zodiac] .assessment-card{background:#fffdf8;border-color:var(--zodiac-border)}body[data-style=zodiac] .session-student .attendance-choices{background:#f6efdf}body[data-style=zodiac] .attendance-choice,body[data-style=zodiac] input,body[data-style=zodiac] select{border-radius:12px}body[data-style=zodiac] .zodiac-avatar{border:2px solid #fff;box-shadow:0 2px 0 #ddcfb7}
body[data-style=zodiac] .finance-style-icon{background:#fff6e8 url('assets/zodiac-avatars.png') 100% 100%/400% 300%;border-radius:50%;box-shadow:0 4px 0 #e3d3b7}body[data-style=zodiac] .finance-style-icon svg{display:none}body[data-style=zodiac] dialog{border-color:var(--zodiac-border);border-radius:22px;background:#fffcf6}body[data-style=zodiac] .appearance-header,body[data-style=zodiac] .appearance-footer{background:#fffcf6}body[data-style=zodiac] .preview-window{background:#fffaf0;border-radius:18px;border-color:var(--zodiac-border)}body[data-style=zodiac] .preview-metric{background:#edf3e7;color:var(--ink);border:1px solid #d6e3cb}body[data-style=zodiac] .preview-metric>span{width:50px;height:50px;top:16px;right:14px;background:#fff8ee url('assets/zodiac-avatars.png') 100% 0/400% 300%;border-radius:50%}body[data-style=zodiac] .preview-metric svg{display:none}
body.dark[data-style=zodiac]{--zodiac-paper:#26281e;--zodiac-surface:#323226;--zodiac-border:#55513d;background:radial-gradient(ellipse at 0 0,#49402b80,transparent 55%),#1c211a;color:var(--ink)}body.dark[data-style=zodiac] .sidebar,body.dark[data-style=zodiac] .topbar,body.dark[data-style=zodiac] dialog,body.dark[data-style=zodiac] .appearance-header,body.dark[data-style=zodiac] .appearance-footer{background:#26281ef5}body.dark[data-style=zodiac] #teachingMetrics .metric-card,body.dark[data-style=zodiac] #teachingMetrics .metric-card:nth-child(n),body.dark[data-style=zodiac] .secondary-button,body.dark[data-style=zodiac] .class-name-button,body.dark[data-style=zodiac] .preview-window{background:#32362a;border-color:#55513d}body.dark[data-style=zodiac] .subnav,body.dark[data-style=zodiac] .bulk-review,body.dark[data-style=zodiac] .attendance-control-bar,body.dark[data-style=zodiac] .collection-table th{background:#303426}body.dark[data-style=zodiac] .subnav-item.active,body.dark[data-style=zodiac] .session-list,body.dark[data-style=zodiac] .tuition-table-wrap,body.dark[data-style=zodiac] .tuition-finance-overview,body.dark[data-style=zodiac] .assessment-card,body.dark[data-style=zodiac] .preview-metric{background:#282f24;border-color:#55513d}
@media(max-width:1100px){body[data-style=zodiac] .metric-sculpture{width:68px;height:68px;right:6px}}
@media(max-width:760px){.workflow-context{flex-wrap:wrap}.workflow-context>p{max-width:100%;flex-basis:100%}.workflow-actions{width:100%;flex-wrap:wrap;gap:8px}.workflow-actions button{flex:1;min-width:0;font-size:12px!important;padding:10px}.workflow-actions .workflow-next{white-space:normal;gap:7px}.workflow-actions .workflow-next>.ui-icon:last-child{margin-left:0}.custom-color-row{gap:10px}}
@media(max-width:600px){body[data-style=zodiac] .metric-sculpture{width:54px;height:54px;top:5px;right:calc(50% - 27px)}body[data-style=zodiac] .subnav-item:before{width:22px;height:22px;flex-basis:22px}body[data-style=zodiac] .content-wrap{border-radius:0}body[data-style=zodiac] .primary-button:before{width:18px;height:18px;flex-basis:18px}.workflow-actions{flex-direction:column}.workflow-actions button{width:100%}}

body[data-motion=true] #teachingMetrics .metric-card:hover{transform:translateY(calc(-.4*var(--motion-lift,7px)))}.custom-color-row>.appearance-note{flex-basis:100%;margin:0}
/* Concise mode navigation, centered report figures and one material language. */
.tuition-modes{display:inline-flex;gap:3px;align-items:center;max-width:100%;padding:4px;border:1px solid var(--line);background:var(--paper);border-radius:11px;margin-bottom:20px}
.tuition-modes .secondary-button{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:38px;padding:8px 14px;border:1px solid transparent;background:transparent;color:var(--muted);border-radius:8px;font-size:13px!important;box-shadow:none;white-space:nowrap}
.tuition-modes button .ui-icon,.tuition-modes button>svg{width:17px;height:17px;flex-shrink:0}.tuition-modes [aria-pressed=true]{background:var(--white);border-color:var(--line);color:var(--green);box-shadow:0 1px 2px #173d2910}.tuition-modes button:hover{color:var(--green)}
.fee-detail-table th:not(:first-child),.fee-detail-table td:not(:first-child){text-align:center!important;vertical-align:middle}.fee-detail-table tfoot td[colspan]{text-align:left!important}
.workflow-actions .workflow-next{background:var(--white);color:var(--green);border:1px solid var(--line);box-shadow:none}.workflow-actions .workflow-next:hover{background:var(--green-light);color:var(--green)}
body[data-style=zodiac]{--zodiac-action:color-mix(in srgb,var(--green) 45%,#786746);--zodiac-action-dark:color-mix(in srgb,var(--green-dark) 55%,#514333)}
body[data-style=zodiac] .primary-button,body[data-style=zodiac] .tuition-pay-button:enabled{background:var(--zodiac-action);color:#fff;border:1px solid #ffffff45;box-shadow:inset 0 1px #ffffff30,0 3px 0 var(--zodiac-action-dark)}
body[data-style=zodiac] .primary-button:hover{background:var(--zodiac-action-dark)}
body[data-style=zodiac] .workflow-actions .workflow-next{background:var(--zodiac-paper);color:var(--zodiac-action-dark);border:1px solid var(--zodiac-border);box-shadow:0 2px 0 #d6c4a54d}
body[data-style=zodiac] .tuition-modes{border-color:var(--zodiac-border);background:#f2eadb;border-radius:13px}.dark[data-style=zodiac] .tuition-modes{background:#303426}body[data-style=zodiac] .tuition-modes .secondary-button{background:transparent;border-color:transparent;border-radius:9px}body[data-style=zodiac] .tuition-modes [aria-pressed=true]{background:var(--zodiac-paper);border-color:var(--zodiac-border);color:var(--zodiac-action-dark);box-shadow:0 2px 0 #d6c4a54d}
body[data-style=zodiac] .tuition-finance-overview .tuition-total-due{background:color-mix(in srgb,var(--zodiac-action) 15%,var(--zodiac-paper));color:var(--ink)}body[data-style=zodiac] .tuition-finance-overview .tuition-total-due strong,body[data-style=zodiac] .tuition-total-due span,body[data-style=zodiac] .tuition-total-due .finance-chart>span{color:var(--ink)}body[data-style=zodiac] .tuition-total-due .finance-chart-track{stroke:var(--line)}body[data-style=zodiac] .tuition-total-due .finance-chart-value{stroke:var(--zodiac-action)}
/* Clay companions are ornaments, never data or controls. */
body[data-style=zodiac] .finance-style-icon{background-image:url('assets/clay-companions.png');background-size:400% 100%;background-position:33.3333% 50%;background-color:transparent;border-radius:0;box-shadow:none;width:112px;height:90px;animation:clay-bob var(--motion-speed,6s) ease-in-out infinite}
body[data-style=zodiac] .section-heading:has(+.class-buttons)::after{content:'';width:90px;height:76px;flex:0 0 90px;background:url('assets/clay-companions.png') 0 50%/400% 100%;animation:clay-bob var(--motion-speed,6s) ease-in-out infinite;pointer-events:none}
body[data-style=zodiac] .today-teaching-heading::after{content:'';width:80px;height:66px;flex:0 0 80px;background:url('assets/clay-companions.png') 66.6667% 50%/400% 100%;animation:clay-bob var(--motion-speed,6s) ease-in-out infinite;animation-delay:-2s;pointer-events:none}
body[data-style=zodiac] .empty-state::before{content:'';display:block;width:112px;height:90px;margin:0 auto 12px;background:url('assets/clay-companions.png') 100% 50%/400% 100%;animation:clay-bob var(--motion-speed,6s) ease-in-out infinite;pointer-events:none}
body[data-style=zodiac] #teachingMetrics .metric-sculpture{animation:clay-metric var(--motion-speed,6s) ease-in-out infinite}body[data-style=zodiac] #teachingMetrics .metric-card:nth-child(2) .metric-sculpture{animation-delay:-2s}body[data-style=zodiac] #teachingMetrics .metric-card:nth-child(3) .metric-sculpture{animation-delay:-4s}
@keyframes clay-bob{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(calc(-.65*var(--motion-lift,7px))) rotate(2deg)}}
@keyframes clay-metric{0%,100%{transform:translateY(-50%) rotate(-2deg)}50%{transform:translateY(calc(-50% - .6*var(--motion-lift,7px))) rotate(2deg)}}
body.dark[data-style=zodiac] .workflow-actions .workflow-next,body.dark[data-style=zodiac] .tuition-modes [aria-pressed=true]{color:var(--green)}
@media(max-width:760px){.tuition-modes{width:auto;max-width:100%}.tuition-modes button{flex:0 1 auto}.tuition-modes .secondary-button{min-height:40px;padding:8px 12px}}
@media(max-width:600px){body[data-style=zodiac] #teachingMetrics .metric-sculpture{animation-name:clay-bob}body[data-style=zodiac] .section-heading:has(+.class-buttons){flex-direction:row;align-items:center}body[data-style=zodiac] .section-heading:has(+.class-buttons)::after{width:64px;height:60px;flex-basis:64px}body[data-style=zodiac] .today-teaching-heading::after{display:none}body[data-style=zodiac] .finance-style-icon{width:95px;height:78px}}
@media(prefers-reduced-motion:reduce){body[data-style=zodiac] .finance-style-icon,body[data-style=zodiac] .metric-sculpture,body[data-style=zodiac] .section-heading::after,body[data-style=zodiac] .today-teaching-heading::after,body[data-style=zodiac] .empty-state::before{animation:none!important}}
/* Preserve the portrait proportions of each clay scene in its atlas cell. */
body[data-style=zodiac] .finance-style-icon{width:78px;height:104px;mix-blend-mode:multiply}body[data-style=zodiac] .section-heading:has(+.class-buttons)::after{width:66px;height:88px;flex-basis:66px;mix-blend-mode:multiply}body[data-style=zodiac] .today-teaching-heading::after{width:60px;height:80px;flex-basis:60px;mix-blend-mode:multiply}body[data-style=zodiac] .empty-state::before{width:78px;height:104px;mix-blend-mode:multiply}@media(max-width:600px){body[data-style=zodiac] .finance-style-icon{width:60px;height:80px}body[data-style=zodiac] .section-heading:has(+.class-buttons)::after{width:54px;height:72px;flex-basis:54px}}

/* Today: the date, session count and stationery illustration form one heading. */
body .today-teaching{position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(112deg,var(--green-light),var(--white) 72%);border-color:var(--line);border-radius:16px;padding:22px}
.today-teaching::before{content:'';position:absolute;z-index:-1;pointer-events:none;width:290px;height:290px;right:-105px;top:-150px;border:1px solid color-mix(in srgb,var(--green) 16%,transparent);border-radius:50%;box-shadow:0 0 0 28px color-mix(in srgb,var(--green) 4%,transparent),0 0 0 64px color-mix(in srgb,var(--green) 3%,transparent)}
.today-teaching-heading{position:relative;align-items:center;min-height:100px;margin-bottom:18px;gap:16px}
.today-heading-copy{min-width:0;flex:1}.today-teaching-heading .today-heading-copy h2{font:600 14px/1.5 var(--font-body,Inter,sans-serif);margin:0 0 8px;color:var(--muted)}
.today-date-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.today-date-row time{font:700 21px/1.35 var(--font-heading,Montserrat,sans-serif);color:var(--ink);font-variant-numeric:tabular-nums}
.today-session-count{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:600;line-height:1.5;white-space:nowrap;color:var(--green);padding:5px 9px;background:var(--white);border:1px solid var(--line);border-radius:7px}
.today-session-count::before{content:'';width:6px;height:6px;border-radius:50%;background:currentColor}
.today-header-art{flex:0 0 114px;width:114px;height:100px;position:relative;pointer-events:none}.today-header-art>span{display:block;width:100%;height:100%;background:url('assets/teaching-sculptures.png') 100% 50%/300% 100%;mix-blend-mode:multiply}
body[data-style=zodiac] .today-teaching-heading::after{content:none}
body[data-style=zodiac] .today-teaching{background:radial-gradient(ellipse at 90% 0,#f0dcba80,transparent 60%),linear-gradient(110deg,#f3eddc,#fff9ee 74%);border-color:var(--zodiac-border)}
body[data-style=zodiac] .today-teaching::before{border-color:#c4b69470;box-shadow:0 0 0 28px #dcd4b61a,0 0 0 64px #dcd4b614}
body[data-style=zodiac] .today-header-art{flex-basis:90px;width:90px;height:120px;transform:rotate(5deg)}
body[data-style=zodiac] .today-header-art>span{background-image:url('assets/clay-companions.png');background-size:400% 100%;background-position:66.6667% 50%}
body[data-style=zodiac] .today-session-count{background:#fffaf0;border-color:var(--zodiac-border)}
body .today-session{border-left-width:1px}.today-session.cancelled{border-color:color-mix(in srgb,#ae6725 28%,var(--line))}
body[data-style=minimal] .today-teaching{background:var(--white)}body[data-style=minimal] .today-teaching::before{display:none}
body[data-theme=dark] .today-teaching,body.dark .today-teaching{background:linear-gradient(110deg,var(--green-light),var(--white) 85%)}
@media(max-width:640px){body .today-teaching{padding:16px}.today-teaching-heading{min-height:88px;margin-bottom:16px;gap:8px}.today-date-row{gap:9px}.today-date-row time{font-size:18px}.today-header-art{flex-basis:72px;width:72px;height:80px}body[data-style=zodiac] .today-header-art{flex-basis:63px;width:63px;height:84px}.today-session-count{font-size:11px}}
@media(max-width:390px){.today-header-art,body[data-style=zodiac] .today-header-art{display:none}.today-teaching-heading{min-height:0}.today-teaching::before{right:-190px}}

.today-header-art{mix-blend-mode:multiply}
body.dark[data-style=zodiac] .today-session-count{background:var(--zodiac-paper);color:var(--green)}
body.dark .today-header-art{mix-blend-mode:normal;opacity:.8}

body.dark .today-status.upcoming{color:var(--green);background:var(--green-light)}
body.dark .today-status.cancelled{color:#f0c894;background:#48382a}
body.dark .today-status.live{color:#f6d28a;background:#4a3c25}
body.dark .today-header-art{border-radius:14px;overflow:hidden}
/* Account sign-in extends the existing dialog and theme. */
#authDialog{width:min(440px,calc(100vw - 32px));max-height:calc(100dvh - 32px);overflow:auto}
#authDialog .auth-google{width:100%;min-height:46px;display:flex;align-items:center;justify-content:center;gap:12px;margin-top:22px}
#authDialog .auth-google svg{flex:none}
#authDialog .auth-divider{text-align:center;color:var(--muted);font-size:14px;margin:18px 0}
#authDialog .auth-message{font-size:14px;line-height:1.6;margin:16px 0 0;overflow-wrap:anywhere}
#authDialog .auth-message.is-error{color:#b42318}
body.dark #authDialog .auth-message.is-error{color:#ffb4ab}
#authIdentity{overflow-wrap:anywhere;line-height:1.6}
#authDialog #signOutButton{margin-top:18px;min-height:44px}
#authDialog button:disabled{opacity:.6;cursor:wait}
#authDialog [hidden]{display:none!important}
/* Match the opaque center already drawn beneath chart labels. */
.donut-center{background:var(--white)}
#authDialog #deviceImportButton{margin-top:18px;min-height:44px;width:100%}
#deviceImportDialog{width:min(520px,calc(100vw - 32px));max-height:calc(100dvh - 32px);overflow:auto}
.device-import-content{padding:24px;font-size:14px;line-height:1.6}
#deviceImportAccount{overflow-wrap:anywhere;font-weight:600}
#deviceImportSummary p{display:flex;justify-content:space-between;gap:16px;margin:8px 0}
#deviceImportSummary span{text-align:right}
#deviceImportNote{font-size:13px;color:var(--muted)}
#deviceImportStatus{margin-top:20px;overflow-wrap:anywhere}
#deviceImportDialog button{min-height:44px}
#deviceImportDialog[aria-busy="true"] [data-close-device-import]{opacity:.5;cursor:wait}

/* Teaching navigation: zodiac companions paired with functional symbols. */
body[data-style=zodiac] .subnav{gap:4px;padding:7px;background:#f1ebdf;border:1px solid var(--zodiac-border);border-radius:18px;scrollbar-width:thin;scrollbar-color:#b4aa95 transparent}
body[data-style=zodiac] .subnav .subnav-item{position:relative;justify-content:flex-start;gap:12px;min-height:74px;padding:12px 14px;border:1px solid transparent;border-radius:12px;white-space:nowrap;text-align:left;color:var(--ink);box-shadow:none}
body[data-style=zodiac] .subnav .subnav-item::before{content:none}
body[data-style=zodiac] .subnav .subnav-item:hover{background:#fffaf0;border-color:#e7d8c2}
body[data-style=zodiac] .subnav .subnav-item.active{background:#fffdf7;border-color:#a3b29c;box-shadow:0 3px 6px #67553612;color:var(--green-dark)}
body[data-style=zodiac] .subnav .subnav-item:focus-visible{outline:2px solid var(--green);outline-offset:-3px}
body[data-style=zodiac] .subnav-item>span.teaching-nav-art{position:relative;display:block;width:38px;height:42px;flex:0 0 38px;border:0;border-radius:0;background:transparent}
.teaching-nav-mascot{position:absolute;inset:0 0 6px;background:#fff6e9 url('assets/zodiac-avatars.png') 100% 0/400% 300%;border-radius:50%}
[data-tab=calendar] .teaching-nav-mascot{background-position:66.6667% 50%}[data-tab=attendance] .teaching-nav-mascot{background-position:0 100%}[data-tab=fees] .teaching-nav-mascot{background-position:100% 100%}[data-tab=assessments] .teaching-nav-mascot{background-position:66.6667% 0}
.teaching-nav-symbol{position:absolute;right:-4px;bottom:0;display:grid;place-items:center;width:22px;height:22px;border-radius:7px;background:#fdfbf4;color:#3f5842;border:1px solid #d9dfcf}
body[data-style=zodiac] .subnav .teaching-nav-symbol .ui-icon{display:block;width:14px;height:14px}
body[data-style=zodiac] .subnav-item>span.teaching-nav-copy{display:flex;flex-direction:column;align-items:flex-start;gap:4px;width:auto;height:auto;border:0;border-radius:0;background:transparent;color:inherit}
.teaching-nav-copy strong{font-size:14px;font-weight:700;line-height:1.35}.teaching-nav-copy small{font-size:11px;font-weight:500;line-height:1.35;color:#5d6959}
body.dark[data-style=zodiac] .subnav .subnav-item:hover{background:#373c2d;border-color:#65705a}body.dark[data-style=zodiac] .subnav .subnav-item.active{background:#38412f;border-color:#91a484;color:var(--green)}body.dark .teaching-nav-copy small{color:#c1cbb8}
@media(max-width:1100px){body[data-style=zodiac] .subnav .subnav-item{min-width:174px;padding:12px;gap:10px;flex:1 0 auto}}
@media(max-width:600px){body[data-style=zodiac] .subnav{margin-top:18px;border-radius:14px;padding:5px;scroll-padding-inline:6px}body[data-style=zodiac] .subnav .subnav-item{min-height:68px;min-width:170px}.teaching-nav-copy strong{font-size:13px}}
@media(min-width:1101px){body[data-style=zodiac] .subnav .subnav-item{flex:1 1 0;min-width:0;padding:12px 10px;gap:10px}}
body[data-style=zodiac] .teaching-nav-copy strong{font-size:14px!important}body[data-style=zodiac] .teaching-nav-copy small{font-size:11px!important}

/* Compact daily schedule with an illustrated zodiac learning garden. */
body[data-style=zodiac] .today-teaching{padding:16px 20px;margin-bottom:20px;background:#fff9ee;border-color:var(--zodiac-border)}
body[data-style=zodiac] .today-teaching::before{content:'';inset:0;width:auto;height:auto;border:0;border-radius:0;box-shadow:none;background:url('assets/zodiac-learning-garden.png') right top/auto 180px no-repeat;z-index:-1}
body[data-style=zodiac] .today-teaching-heading{min-height:92px;margin-bottom:12px;gap:0}
body[data-style=zodiac] .today-teaching-heading .today-heading-copy h2{margin-bottom:5px}
body[data-style=zodiac] .today-heading-copy{flex:0 1 58%}
body[data-style=zodiac] .today-date-row{gap:10px}
body[data-style=zodiac] .today-session{padding:12px 14px;gap:12px;background:var(--white)}
body[data-style=zodiac] .today-session-list{gap:8px}
body.dark[data-style=zodiac] .today-teaching{background:#282f24}body.dark[data-style=zodiac] .today-teaching::before{opacity:.32}body.dark[data-style=zodiac] .today-session{background:#282f24}
@media(max-width:640px){body[data-style=zodiac] .today-teaching{padding:14px;margin-bottom:16px}body[data-style=zodiac] .today-teaching::before{background-size:auto 105px;background-position:right top}body[data-style=zodiac] .today-teaching-heading{min-height:106px;margin-bottom:10px;align-items:flex-end}body[data-style=zodiac] .today-heading-copy{flex:1;padding:7px 8px;background:#fffaf0ed;border-radius:10px}body[data-style=zodiac] .today-date-row time{font-size:17px}body.dark[data-style=zodiac] .today-heading-copy{background:#282f24ed}body[data-style=zodiac] .today-session{padding:12px}.today-session-time{gap:8px}}