/* Hbg 11 – layout, semantic themes and native-feeling controls */
:root{--hbg-surface:#fff;--hbg-text:#25243e;--hbg-muted:#77758d;--hbg-border:#e4e3f1;--hbg-page:#f4f5fc;--hbg-panel:#f9f9ff}
html,body{height:100%;overflow:hidden!important}body{overscroll-behavior:none}#app.shell{height:100dvh;min-height:0;overflow:hidden;display:flex}.sidebar{height:100dvh;max-height:100dvh;position:relative;flex-shrink:0;display:flex;flex-direction:column;overflow:hidden}.sidebar nav{flex:1;overflow-y:auto;overscroll-behavior:contain}.body-area{height:100dvh;min-height:0;flex:1;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;scrollbar-gutter:stable}.topbar{position:sticky;top:0;z-index:19}.body-area main{min-height:0;max-width:1500px}.brand-mark{background:none!important;box-shadow:none!important;border-radius:16px!important;overflow:hidden}.brand-mark img{width:100%;height:100%;object-fit:cover;border-radius:16px}.brand-label{font-size:23px!important}.hbg-subject-filter{display:flex;align-items:center;gap:12px;margin:0 0 20px}.hbg-subject-filter label{font-size:13px;font-weight:700;color:var(--hbg-muted)}.hbg-subject-filter select,.hbg-theme-options select{min-height:44px;border-radius:13px;border:1px solid var(--hbg-border);padding:9px 12px;background:var(--hbg-surface);color:var(--hbg-text);font-size:16px}.hbg-theme-options{display:flex;align-items:center;justify-content:space-between;gap:16px}.hbg-theme-options label{font-weight:650}.hbg-theme-settings{margin-bottom:16px}.hbg-empty-period{min-height:76px;display:grid;place-items:center;color:var(--hbg-muted);opacity:.55}.hbg-image-button{margin-top:15px}.sidebar .nav-link[data-view=settings] .nav-symbol{font-size:0}.sidebar .nav-link[data-view=settings] .nav-symbol::after{content:"";display:inline-block;width:21px;height:21px;background:currentColor;mask:url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="black" stroke-width="2"%3E%3Cpath d="M12 8a4 4 0 1 0 0 8 4 4 0 0 0 0-8Z"/%3E%3Cpath d="M19.4 15a1.7 1.7 0 0 0 .34 1.88l.06.06-2.86 2.86-.06-.06A1.7 1.7 0 0 0 15 19.4a1.7 1.7 0 0 0-1.2 1.6V21H10.2v-.1A1.7 1.7 0 0 0 9 19.4a1.7 1.7 0 0 0-1.88.34l-.06.06L4.2 16.94l.06-.06A1.7 1.7 0 0 0 4.6 15 1.7 1.7 0 0 0 3 13.8H3v-3.6h.1A1.7 1.7 0 0 0 4.6 9a1.7 1.7 0 0 0-.34-1.88L4.2 7.06 7.06 4.2l.06.06A1.7 1.7 0 0 0 9 4.6 1.7 1.7 0 0 0 10.2 3H13.8A1.7 1.7 0 0 0 15 4.6a1.7 1.7 0 0 0 1.88-.34l.06-.06 2.86 2.86-.06.06A1.7 1.7 0 0 0 19.4 9 1.7 1.7 0 0 0 21 10.2v3.6A1.7 1.7 0 0 0 19.4 15Z"/%3E%3C/svg%3E') center/contain no-repeat}
[data-hbg-theme=dark]{--hbg-surface:#25283b;--hbg-text:#f2f1ff;--hbg-muted:#b7b9d1;--hbg-border:#42465e;--hbg-page:#111420;--hbg-panel:#202436;color-scheme:dark}
[data-hbg-theme=dark] body,[data-hbg-theme=dark] .body-area,[data-hbg-theme=dark] .shell{background:var(--hbg-page)!important;color:var(--hbg-text)!important}
[data-hbg-theme=dark] .sidebar,[data-hbg-theme=dark] .topbar{background:#1a1d2deF!important;border-color:#35384e!important}
[data-hbg-theme=dark] .card,[data-hbg-theme=dark] .stat,[data-hbg-theme=dark] .modal,[data-hbg-theme=dark] .next-welcome,[data-hbg-theme=dark] .day-head,[data-hbg-theme=dark] .lesson-cell,[data-hbg-theme=dark] .period-cell,[data-hbg-theme=dark] .subject-tile,[data-hbg-theme=dark] .empty,[data-hbg-theme=dark] .notice,[data-hbg-theme=dark] .formula,[data-hbg-theme=dark] .quiz-answer,[data-hbg-theme=dark] .filter,[data-hbg-theme=dark] .tag,[data-hbg-theme=dark] .day-tab{background:var(--hbg-surface)!important;color:var(--hbg-text)!important;border-color:var(--hbg-border)!important;box-shadow:none!important}
[data-hbg-theme=dark] #main.view-dashboard .dashboard-grid>.card:first-child{background:linear-gradient(145deg,#333251,#26293e)!important}
[data-hbg-theme=dark] .section-head h1,[data-hbg-theme=dark] h1,[data-hbg-theme=dark] h2,[data-hbg-theme=dark] h3,[data-hbg-theme=dark] .brand-label,[data-hbg-theme=dark] .breadcrumbs,[data-hbg-theme=dark] .item-body strong,[data-hbg-theme=dark] .empty strong{color:var(--hbg-text)!important}
[data-hbg-theme=dark] .muted,[data-hbg-theme=dark] small,[data-hbg-theme=dark] .item-body small,[data-hbg-theme=dark] .sidebar .nav-link,[data-hbg-theme=dark] .sidebar-footer{color:var(--hbg-muted)!important}
[data-hbg-theme=dark] input,[data-hbg-theme=dark] select,[data-hbg-theme=dark] textarea,[data-hbg-theme=dark] .button:not(.button-dark){background:#303449!important;color:var(--hbg-text)!important;border-color:var(--hbg-border)!important}
[data-hbg-theme=dark] .sidebar .nav-link.active,[data-hbg-theme=dark] .day-tab.selected,[data-hbg-theme=dark] .filter.active{background:#3c3765!important;color:#f4f0ff!important}
[data-hbg-theme=dark] .kpi-line,[data-hbg-theme=dark] .list-item,[data-hbg-theme=dark] .task-row{border-color:var(--hbg-border)!important}
[data-hbg-theme=dark] .os10-bottom-nav{background:#25283af0!important;color:var(--hbg-text)!important}
@media(max-width:760px){.sidebar{position:fixed;z-index:51}.body-area{width:100%;scrollbar-gutter:auto}.body-area main{padding-bottom:130px}.hbg-subject-filter{flex-wrap:wrap}.topbar{top:0}}
@media(prefers-reduced-transparency:reduce){.topbar,.sidebar{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important}}

input,textarea,select{font-size:max(16px,1rem)}.os11-splash-logo{border-radius:24%;filter:drop-shadow(0 18px 38px #7976d24d)}.os11-splash-title{letter-spacing:-.06em}


/* Hbg 11.1: one icon, stable collapsed navigation and explicit appearance modes */
html[data-hbg-theme="dark"]{color-scheme:dark;--bg:#10101a;--ink:#f2f0ff;--muted:#aaa7bd;--line:#353244;--border:#343044;--soft:#22202f;--surface:#201e2c;--glass:rgba(29,27,42,.84);--nav-bg:#1a1827;--accent-soft:#322a50;--shadow:0 10px 30px #0003}html[data-hbg-theme="dark"] body{background:radial-gradient(ellipse at 85% 0%,#282043,transparent 48%),var(--bg);color:var(--ink)}html[data-hbg-theme="dark"] .sidebar{background:#1c1a2a;border-color:#302d40}html[data-hbg-theme="dark"] .brand-label,html[data-hbg-theme="dark"] .section-head h1,html[data-hbg-theme="dark"] .card h2,html[data-hbg-theme="dark"] .period-cell strong,html[data-hbg-theme="dark"] .empty strong,html[data-hbg-theme="dark"] .modal-head h2,html[data-hbg-theme="dark"] .stat strong{color:var(--ink)}html[data-hbg-theme="dark"] .brand-label>span{color:#b2a5ff}html[data-hbg-theme="dark"] .brand-label small,html[data-hbg-theme="dark"] .nav-group-label{color:#aaa4c2}html[data-hbg-theme="dark"] .sidebar .nav-link{color:#c1bbd2}html[data-hbg-theme="dark"] .sidebar .nav-link.active{background:#332b50;color:#d9d1ff;box-shadow:inset 0 0 0 1px #4a3b73}html[data-hbg-theme="dark"] .sidebar .nav-link.active .nav-symbol{color:#b9a8ff}html[data-hbg-theme="dark"] .sidebar .nav-link:hover{background:#29243c;color:#e3dcff}html[data-hbg-theme="dark"] .sidebar-footer{border-color:#302d40}html[data-hbg-theme="dark"] .topbar{background:var(--glass);border-color:#353044}html[data-hbg-theme="dark"] .breadcrumbs{color:#b3acc8}html[data-hbg-theme="dark"] .card,html[data-hbg-theme="dark"] .stat,html[data-hbg-theme="dark"] .modal,html[data-hbg-theme="dark"] .schedule-wrap{background:var(--surface);border-color:#363247}html[data-hbg-theme="dark"] .card,html[data-hbg-theme="dark"] .stat{color:var(--ink)}html[data-hbg-theme="dark"] .next-welcome{background:linear-gradient(120deg,#3f327c,#6651af)!important}html[data-hbg-theme="dark"] .button,html[data-hbg-theme="dark"] .field input,html[data-hbg-theme="dark"] .field textarea,html[data-hbg-theme="dark"] .field select,html[data-hbg-theme="dark"] .modal input,html[data-hbg-theme="dark"] .modal textarea,html[data-hbg-theme="dark"] .modal select,html[data-hbg-theme="dark"] .chat-bottom textarea,html[data-hbg-theme="dark"] .top-search{background:#2b283b;color:var(--ink);border-color:#48425f}html[data-hbg-theme="dark"] .button:hover{background:#36304d}html[data-hbg-theme="dark"] .tab,html[data-hbg-theme="dark"] .filter,html[data-hbg-theme="dark"] .day-tab,html[data-hbg-theme="dark"] .subject-tab-group,html[data-hbg-theme="dark"] .empty,html[data-hbg-theme="dark"] .notice,html[data-hbg-theme="dark"] .tag,html[data-hbg-theme="dark"] .formula,html[data-hbg-theme="dark"] .quiz-answer{background:#2d293e;color:#c9c1e4;border-color:#443d5d}html[data-hbg-theme="dark"] .tab.active,html[data-hbg-theme="dark"] .filter.active,html[data-hbg-theme="dark"] .day-tab.selected{background:#463769!important;color:#e7ddff!important;border-color:#63518b!important}html[data-hbg-theme="dark"] .next-line,html[data-hbg-theme="dark"] .kpi-line,html[data-hbg-theme="dark"] .task-row,html[data-hbg-theme="dark"] .list-item{border-color:#353044}html[data-hbg-theme="dark"] .day-head{background:#2a263b;border-color:#39334a;color:#d5ccec}html[data-hbg-theme="dark"] .period-cell,html[data-hbg-theme="dark"] .lesson-cell{border-color:#383346}html[data-hbg-theme="dark"] .tick{background:#292538}html[data-hbg-theme="dark"] .chat-bubble{background:#2f2d3c}html[data-hbg-theme="dark"] .chat-bubble.mine{background:#433762}html[data-hbg-theme="dark"] .chat-intro{color:#b2aac7}html[data-hbg-theme="dark"] .os10-back{background:#352e51;color:#c9baff}html[data-hbg-theme="dark"] .os10-bottom-nav{background:rgba(32,29,47,.91);border-color:#544b68}html[data-hbg-theme="dark"] .os10-bottom-nav button{color:#b9b2ce}html[data-hbg-theme="dark"] .os10-bottom-nav button[aria-current=page]{background:#41365e;color:#d5c8ff}html[data-hbg-theme="dark"] #main.view-dashboard .dashboard-grid>.card:first-child{background:linear-gradient(135deg,#31284d,#211e2d 75%);border-color:#41385a}html[data-hbg-theme="dark"] .lesson-pill{color:#222}
/* Previous animation stylesheet drew a second notebook on top of the actual img. */
.sidebar .brand-mark::before,.sidebar .brand-mark::after{content:none!important;display:none!important}
.sidebar .brand-mark{isolation:isolate;width:46px;height:46px;min-width:46px;min-height:46px;flex:0 0 46px;overflow:hidden!important;display:flex;align-items:center;justify-content:center}
.sidebar .brand-mark img{display:block;width:100%;height:100%;object-fit:contain;border-radius:13px}
/* Collapsed sidebar keeps its icon and collapse button on distinct, centered rows. */
.sidebar.collapsed{width:76px!important;flex-basis:76px!important;min-width:76px}
.sidebar.collapsed .brand{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:13px;padding:17px 7px 13px;min-height:120px;flex-wrap:nowrap}
.sidebar.collapsed .brand-mark{margin:0!important;width:44px;height:44px;min-width:44px;flex-basis:44px}
.sidebar.collapsed .brand-label{display:none!important}
.sidebar.collapsed .collapse{margin:0!important;display:flex;align-items:center;justify-content:center;flex:none;width:42px;height:40px;padding:7px;border-radius:13px}
.sidebar.collapsed nav{padding:5px 8px 14px!important}
.sidebar.collapsed .nav-group-label{font-size:0;padding:6px 0}
.sidebar.collapsed .nav-link{width:100%;min-height:48px;justify-content:center;gap:0;padding:10px 0!important}
.sidebar.collapsed .nav-symbol{flex:0 0 25px;width:25px;text-align:center}
.sidebar.collapsed .nav-label,.sidebar.collapsed .nav-count{display:none!important}
.sidebar.collapsed .sidebar-footer{display:flex;align-items:center;justify-content:center;padding:17px 0!important}
/* The resolved theme, not the OS preference, controls all surfaces. */
html[data-hbg-theme="light"]{color-scheme:light!important;--bg:#f3f4fa;--ink:#20243b;--muted:#737991;--line:#e5e7f2;--border:#e7e9f4;--soft:#eceefa;--surface:#fff;--glass:rgba(255,255,255,.90);--nav-bg:#f9f9ff;--accent-soft:#efedff;--hbg-surface:#fff;--hbg-text:#25243e;--hbg-muted:#77758d;--hbg-border:#e4e3f1;--hbg-page:#f4f5fc;--hbg-panel:#f9f9ff}
html[data-hbg-theme="light"] body{background:radial-gradient(ellipse at 83% 0%,#eae7ff 0,transparent 45%),var(--bg)!important;color:var(--ink)!important}
html[data-hbg-theme="light"] .sidebar{background:rgba(249,249,255,.96)!important;border-color:#e4e3f4!important}
html[data-hbg-theme="light"] .topbar{background:var(--glass)!important;border-color:#e4e3f4!important}
html[data-hbg-theme="light"] .card,html[data-hbg-theme="light"] .stat,html[data-hbg-theme="light"] .modal,html[data-hbg-theme="light"] .schedule-wrap{background:var(--surface)!important;color:var(--ink)!important;border-color:var(--border)!important}
html[data-hbg-theme="light"] .sidebar .nav-link{color:#62627d!important}
html[data-hbg-theme="light"] .sidebar .nav-link.active{background:#ebe8ff!important;color:#5747bb!important}
html[data-hbg-theme="light"] .field input,html[data-hbg-theme="light"] .field textarea,html[data-hbg-theme="light"] .field select,html[data-hbg-theme="light"] .modal input,html[data-hbg-theme="light"] .modal textarea,html[data-hbg-theme="light"] .modal select{background:#fff!important;color:var(--ink)!important;border-color:#dedced!important}
html[data-hbg-theme="light"] .section-head h1,html[data-hbg-theme="light"] h1,html[data-hbg-theme="light"] h2,html[data-hbg-theme="light"] h3{color:var(--ink)!important}
html[data-hbg-theme="dark"]{color-scheme:dark!important}
html[data-hbg-theme="dark"] .brand-mark img{filter:none}
@media(max-width:760px){.sidebar.collapsed{width:248px!important;flex-basis:248px!important}.sidebar.collapsed .brand{flex-direction:row;justify-content:flex-start;min-height:90px}.sidebar.collapsed .collapse{margin-left:auto!important}.sidebar.collapsed .brand-label{display:block!important}.sidebar.collapsed .nav-label{display:inline!important}.sidebar.collapsed .nav-link{justify-content:flex-start;gap:14px;padding:11px 13px!important}}
