@media screen{body[data-ui-page]{--ui-ink: var(--n-700);--ui-muted: var(--n-500);--ui-line: var(--n-200);--ui-blue: var(--brand-500);--ui-surface: var(--n-50);--ui-header-height: 64px;color:var(--ui-ink)}body[data-ui-page] :is(a,button,input,select,textarea,[tabindex]):focus-visible{outline:3px solid var(--focus);outline-offset:3px}body[data-ui-page] .btn{border-radius:10px;min-height:44px;line-height:1.3}body[data-ui-page] .btn-primary{background:var(--ui-blue);border-color:var(--ui-blue);box-shadow:0 2px 6px rgba(var(--brand-500-rgb),0.102)}body[data-ui-page] .btn-primary:hover{background:var(--brand-600);border-color:var(--brand-600)}body[data-ui-page] :is(.input,.select,.textarea){border-radius:10px;border-color:var(--ui-line);min-height:44px}body[data-ui-page] :is(.input,.select,.textarea):focus{border-color:var(--brand-300);box-shadow:0 0 0 3px rgba(var(--brand-500-rgb),0.071)}body[data-ui-page] .btn-primary:hover{color:#fff}body[data-ui-page] .btn-outline:hover{color:var(--brand-700);border-color:var(--brand-400);background:var(--brand-50)}body[data-ui-page] :is(.help,.small,.muted){color:var(--n-500)}body[data-ui-page] .sidebar :is(a,button):focus-visible,body[data-ui-page=login] .auth-side a:focus-visible{outline-color:var(--focus-on-dark)}body[data-ui-page] .sidebar :is(.small,.muted){color:var(--brand-200)}body[data-ui-page=login] .auth-side :is(.small,.muted,.help),body[data-ui-page=student] .card:has(#welcome) :is(.small,.muted){color:var(--brand-200)}body:is([data-ui-page=admin],[data-ui-page=student]) .sidebar .side-foot{border-top-color:#ffffff26}body:is([data-ui-page=admin],[data-ui-page=student]) .sidebar .side-foot .btn:hover{color:#fff;background:#ffffff12;border-color:var(--brand-300)}body[data-ui-page] .field label{color:var(--n-600);font-size:13px;font-weight:600;text-transform:none;letter-spacing:0}body[data-ui-page] .file-card{border-color:var(--ui-line);border-radius:16px;padding:24px;box-shadow:0 3px 12px rgba(23,43,70,0.020)}body[data-ui-page] .file-card h3{color:var(--ui-ink);font-size:17px}body[data-ui-page] .file-card-meta{color:var(--ui-muted)}body[data-ui-page] .file-card-actions{gap:8px}body[data-ui-page] .file-card-actions .btn{min-width:100px}body[data-ui-page] .file-card-icon{width:52px;height:64px}body[data-ui-page] .file-preview-dialog{border-color:var(--ui-line);border-radius:16px}body[data-ui-page=admin],body[data-ui-page=student]{background:var(--ui-surface)}body:is([data-ui-page=admin],[data-ui-page=student]) .main{min-width:0}body:is([data-ui-page=admin],[data-ui-page=student]) .page{max-width:1700px;padding:28px 32px 48px;margin:auto}body:is([data-ui-page=admin],[data-ui-page=student]) .page>.view{min-width:0}body:is([data-ui-page=admin],[data-ui-page=student]) .page h1{font-size:clamp(24px,2.2vw,30px);line-height:1.25;letter-spacing:-.035em}body:is([data-ui-page=admin],[data-ui-page=student]) .sub{color:var(--ui-muted);line-height:1.6}body:is([data-ui-page=admin],[data-ui-page=student]) :is(.card,.stat,.program-card){border:1px solid var(--ui-line);border-radius:16px;box-shadow:0 3px 14px rgba(23,43,70,0.016)}body:is([data-ui-page=admin],[data-ui-page=student]) .topbar{min-height:76px;padding:16px 28px;gap:12px;background:#fffffffa}body:is([data-ui-page=admin],[data-ui-page=student]) .page-title{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}body:is([data-ui-page=admin],[data-ui-page=student]) .user-chip{min-width:44px;max-width:240px;flex-shrink:0}body:is([data-ui-page=admin],[data-ui-page=student]) .user-chip .meta{min-width:0}body:is([data-ui-page=admin],[data-ui-page=student]) .user-chip .meta :is(strong,span){display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}body:is([data-ui-page=admin],[data-ui-page=student]) .icon-btn{min-width:44px;min-height:44px}body:is([data-ui-page=admin],[data-ui-page=student]) .tabs{gap:4px;margin-bottom:20px}body:is([data-ui-page=admin],[data-ui-page=student]) .tab{padding:12px 16px;min-height:44px;font-size:13px}body:is([data-ui-page=admin],[data-ui-page=student]) .row{gap:12px}body:is([data-ui-page=admin],[data-ui-page=student]) .row>.field.grow{flex:1 1 200px;min-width:0}body:is([data-ui-page=admin],[data-ui-page=student]) .row>:is(.input,.select){min-width:0}body:is([data-ui-page=admin],[data-ui-page=student]) .table-wrap{max-width:100%;overflow-x:auto}body:is([data-ui-page=admin],[data-ui-page=student]) .table th{font-size:11px;background:var(--n-50);letter-spacing:.04em}body:is([data-ui-page=admin],[data-ui-page=student]) .table td{vertical-align:top}body[data-ui-page=admin] .side-nav a{min-height:44px;font-size:13px;padding:10px 14px}body[data-ui-page=admin] .nav-group-label{padding-top:16px}body[data-ui-page=admin] .workspace-hero{background:var(--brand-50);border-radius:16px}body[data-ui-page=admin] .workspace-hero h2{font-size:clamp(22px,2vw,27px)}body[data-ui-page=admin] .workspace-toolbar{flex-wrap:wrap;align-items:flex-start}body[data-ui-page=admin] .kpi-tile .value{font-size:30px}body[data-ui-page=admin] .workspace-dialog{border-radius:16px}body[data-ui-page=admin] .workspace-heading{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:16px;margin-bottom:24px}body[data-ui-page=admin] .workspace-heading h2{margin:0 0 8px;font-size:24px;letter-spacing:-.03em}body[data-ui-page=admin] .workspace-heading p{margin:0;color:var(--ui-muted);line-height:1.6;max-width:760px}body[data-ui-page=admin] .batch-card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:16px;margin-bottom:24px}body[data-ui-page=admin] .batch-card{padding:24px;border:1px solid var(--ui-line);border-radius:16px;background:#fff;border-top:3px solid var(--brand-500);min-width:0}body[data-ui-page=admin] .batch-card h3{margin:16px 0 8px;font-size:18px;line-height:1.5;overflow-wrap:anywhere}body[data-ui-page=admin] .batch-card p{color:var(--ui-muted);font-size:13px;line-height:1.6}body[data-ui-page=admin] .batch-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}body[data-ui-page=admin] :is(.batch-filters,.collection-filters){display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px;padding:20px;margin:20px 0;border:1px solid var(--ui-line);border-radius:16px;background:#fff}body[data-ui-page=admin] :is(.batch-filters,.collection-filters)>label{display:grid;gap:8px;flex:1 1 160px;min-width:0;color:var(--n-600);font-size:12px;font-weight:600}body[data-ui-page=admin] :is(.batch-filters,.collection-filters,.workspace-dialog) :is(input:not([type=checkbox]),select,textarea){width:100%;min-width:0;min-height:44px;padding:10px 12px;border:1px solid var(--ui-line);border-radius:10px;background:#fff;font:inherit;color:var(--ui-ink)}body[data-ui-page=admin] .workspace-dialog label{display:grid;gap:8px;margin:16px 0;font-size:13px;font-weight:600}body[data-ui-page=admin] .workspace-dialog .batch-filters{padding:0;border:0;margin:0}body[data-ui-page=admin] .workspace-dialog .batch-filters label{margin:8px 0}body[data-ui-page=admin] .workspace-dialog .batch-actions{margin-top:24px;justify-content:flex-end}body[data-ui-page=admin] .collection-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));gap:16px;margin:24px 0}body[data-ui-page=admin] .collection-kpis .stat{padding:20px;border-top:3px solid var(--brand-500)}body[data-ui-page=admin] .collection-kpis .label{color:var(--ui-muted);font-size:12px}body[data-ui-page=admin] .collection-kpis .value{display:block;margin-top:12px;font-size:clamp(22px,2vw,28px);letter-spacing:-.03em;overflow-wrap:anywhere}body[data-ui-page=admin] .collection-baseline{background:var(--brand-50);margin:20px 0;box-shadow:none}body[data-ui-page=admin] .collection-baseline p{color:var(--ui-muted);line-height:1.6}body[data-ui-page=admin] .collection-analytics{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:16px;margin:24px 0}body[data-ui-page=admin] .collection-analytics>.card{min-width:0}body[data-ui-page=admin] .collection-trends{display:grid;gap:16px;margin-top:20px}body[data-ui-page=admin] .collection-trends>div{display:grid;grid-template-columns:90px minmax(0,1fr);gap:6px 12px;align-items:center}body[data-ui-page=admin] .collection-trends span{color:var(--ui-muted);font-size:12px}body[data-ui-page=admin] .collection-trends i{display:block;width:var(--bar-width, 0%);min-height:8px;background:var(--brand-500);border-radius:999px}body[data-ui-page=admin] .collection-trends strong{grid-column:2;font-size:12px}body[data-ui-page=student] .sidebar{background:var(--brand-900);color:#fff;border-color:var(--brand-800)}body[data-ui-page=student] .sidebar .brand{color:#fff}body[data-ui-page=student] .side-nav a{color:#c8d5e8;min-height:44px;font-size:13px}body[data-ui-page=student] .side-nav a:hover{color:#fff;background:#ffffff0d}body[data-ui-page=student] .side-nav a.active{color:#fff;background:var(--brand-500)}body[data-ui-page=student] .side-foot .btn{color:#dbe5f8;border-color:var(--n-300)}body[data-ui-page=student] .card:has(#welcome){background:linear-gradient(115deg,var(--brand-900),var(--brand-800))!important;padding:24px}body[data-ui-page=student] #welcome{font-size:clamp(22px,2vw,28px);line-height:1.3}body[data-ui-page=student] :is(#classPausedBanner,#feeSuspendedBanner,#nextFeeCard){box-shadow:none}body[data-ui-page=login] .auth-wrap{background:var(--n-50)}body[data-ui-page=login] .auth-side{padding:clamp(32px,5vw,72px);background:var(--brand-900)}body[data-ui-page=login] .auth-form{padding:40px 28px;min-width:0}body[data-ui-page=login] .auth-card{max-width:500px;padding:32px;border-radius:18px;border-color:var(--ui-line);box-shadow:0 12px 40px rgba(23,43,70,0.031)}body[data-ui-page=login] .auth-card h3{font-size:24px;letter-spacing:-.03em;margin-bottom:8px}body[data-ui-page=login] .tabs{display:flex;width:100%;gap:4px;margin-top:20px;margin-bottom:24px}body[data-ui-page=login] .tab{flex:1;min-height:44px;padding:12px 8px}body[data-ui-page=login] .row{gap:12px;align-items:flex-start}body[data-ui-page=login] .row>.field{flex:1 1 180px;min-width:0}body[data-ui-page=login] .role-picker{grid-template-columns:repeat(auto-fit,minmax(min(100%,170px),1fr));gap:10px}body[data-ui-page=login] .role-option{border-radius:12px;padding:14px;line-height:1.5}body[data-ui-page=login] .role-option.selected{border-color:var(--brand-500);background:var(--brand-50);box-shadow:0 0 0 1px var(--brand-500)}body[data-ui-page=login] .help{line-height:1.5}body:is([data-ui-page=home],[data-ui-page=feed]) .nav{background:#fffffffa;border-bottom-color:var(--ui-line);box-shadow:0 2px 12px rgba(23,43,70,0.020)}body:is([data-ui-page=home],[data-ui-page=feed]) .nav-inner{gap:16px;min-width:0;padding:14px 24px}body:is([data-ui-page=home],[data-ui-page=feed]) .nav .logo{font-size:15px;line-height:1.35;min-width:0}body:is([data-ui-page=home],[data-ui-page=feed]) .nav .logo-mark{width:44px;height:44px;flex-shrink:0}body:is([data-ui-page=home],[data-ui-page=feed]) .nav-links{gap:16px}body:is([data-ui-page=home],[data-ui-page=feed]) .nav-links a{font-size:12px}body:is([data-ui-page=home],[data-ui-page=feed]) .nav-cta{flex-shrink:0;gap:8px}body:is([data-ui-page=home],[data-ui-page=feed]) .nav-cta .btn{font-size:12px;padding:10px 12px}body:is([data-ui-page=home],[data-ui-page=feed]) .section{padding-block:64px}body[data-ui-page=home] .hero{padding-block:64px 88px;background:linear-gradient(130deg,var(--brand-50),#fff 70%)}body[data-ui-page=home] .hero h1{font-size:clamp(30px,3.3vw,48px);line-height:1.2;letter-spacing:-.04em}body[data-ui-page=home] .hero .lead{font-size:16px;line-height:1.8}body[data-ui-page=home] :is(.feature,.contact-card,.class-card,.star-card,.testim){border-radius:16px}body[data-ui-page=feed] #feedTitle{font-size:clamp(27px,3vw,40px);line-height:1.25;letter-spacing:-.035em;max-width:900px}body[data-ui-page=feed] .lead-sub{font-size:16px;line-height:1.7}}@media screen and (max-width:1100px){body[data-ui-page=home] .nav-inner{flex-wrap:wrap}body[data-ui-page=home] .hamburger{display:block;margin-left:auto;min-width:44px;min-height:44px}body[data-ui-page=home] .nav-links,body[data-ui-page=home] .nav-cta{display:none}body[data-ui-page=home] .nav.open .nav-links,body[data-ui-page=home] .nav.open .nav-cta{display:flex;position:static;width:100%;flex-basis:100%;background:transparent;border:0;padding:8px 0}body[data-ui-page=home] .nav.open .nav-links{order:3;flex-direction:column;align-items:stretch;gap:4px}body[data-ui-page=home] .nav.open .nav-links a{padding:10px 12px;min-height:44px;border-radius:8px;font-size:14px}body[data-ui-page=home] .nav.open .nav-cta{order:4;flex-direction:row;gap:12px}body[data-ui-page=home] .nav.open .nav-cta a{flex:1}body[data-ui-page=feed] .nav-inner{display:grid;grid-template-columns:minmax(0,1fr) auto}body[data-ui-page=feed] .nav-links{display:flex;grid-column:1 / -1;grid-row:2;overflow-x:auto;min-width:0;padding-block:4px}body[data-ui-page=feed] .nav-links a{flex-shrink:0;min-height:36px;display:flex;align-items:center}body[data-ui-page=feed] .nav-cta{display:flex;grid-column:2;grid-row:1}}@media screen and (max-width:980px){body:is([data-ui-page=admin],[data-ui-page=student]) .topbar{position:fixed!important;top:0;left:0;right:0;height:calc(var(--ui-header-height) + env(safe-area-inset-top,0px));min-height:calc(var(--ui-header-height) + env(safe-area-inset-top,0px));padding:calc(10px + env(safe-area-inset-top,0px)) 16px 10px;gap:8px;border-bottom:1px solid var(--ui-line);z-index:120}body:is([data-ui-page=admin],[data-ui-page=student]) .main{padding-top:calc(var(--ui-header-height) + env(safe-area-inset-top,0px))}body:is([data-ui-page=admin],[data-ui-page=student]) .page{padding:24px 20px 40px}body:is([data-ui-page=admin],[data-ui-page=student]) .page-title{flex:1;font-size:15px;max-width:none}body:is([data-ui-page=admin],[data-ui-page=student]) .topbar>.grow{display:none}body:is([data-ui-page=admin],[data-ui-page=student]) .mobile-toggle{width:44px;height:44px;flex-shrink:0}body:is([data-ui-page=admin],[data-ui-page=student]) .user-chip{max-width:180px}body:is([data-ui-page=admin],[data-ui-page=student]) .app .sidebar{top:calc(var(--ui-header-height) + env(safe-area-inset-top,0px))!important;width:min(260px,calc(100vw - 24px))!important;height:calc(100vh - var(--ui-header-height) - env(safe-area-inset-top,0px))!important;height:calc(100dvh - var(--ui-header-height) - env(safe-area-inset-top,0px))!important;padding-bottom:calc(20px + env(safe-area-inset-bottom,0px))!important}body:is([data-ui-page=admin],[data-ui-page=student]) .sidebar.open::after{left:min(260px,calc(100vw - 24px))}body:is([data-ui-page=admin],[data-ui-page=student]) .table-wrap{overflow-x:auto!important}body:is([data-ui-page=admin],[data-ui-page=student]) .bell-panel{position:fixed;left:12px;right:12px;top:calc(var(--ui-header-height) + env(safe-area-inset-top,0px) + 8px);width:auto;max-width:420px;margin-left:auto;max-height:min(420px,65vh)}}@media screen and (max-width:600px){body:is([data-ui-page=admin],[data-ui-page=student]){--ui-header-height: 96px}body:is([data-ui-page=admin],[data-ui-page=student]) .topbar{display:grid;grid-template-columns:44px minmax(0,1fr) 44px 44px;grid-template-rows:44px 20px;column-gap:8px;row-gap:2px;padding-inline:12px;align-content:center}body[data-ui-page=student] .topbar{grid-template-columns:44px minmax(0,1fr) 44px 44px 44px}body:is([data-ui-page=admin],[data-ui-page=student]) .mobile-toggle{grid-column:1;grid-row:1}body:is([data-ui-page=admin],[data-ui-page=student]) .page-title{grid-column:2;grid-row:1}body[data-ui-page=admin] .topbar .bell{grid-column:3;grid-row:1}body[data-ui-page=admin] .topbar .user-chip{grid-column:4;grid-row:1}body[data-ui-page=student] #studentRefreshVersionBtn{grid-column:3;grid-row:1}body[data-ui-page=student] .topbar .bell{grid-column:4;grid-row:1}body[data-ui-page=student] .topbar .user-chip{grid-column:5;grid-row:1}body:is([data-ui-page=admin],[data-ui-page=student]) .app-version-badge{grid-column:2 / -1;grid-row:2;justify-self:start;flex-direction:row;gap:6px;padding:0;background:transparent;border:0;min-height:20px}body:is([data-ui-page=admin],[data-ui-page=student]) .app-version-badge :is(span,strong){font-size:10px;line-height:20px}body:is([data-ui-page=admin],[data-ui-page=student]) .user-chip{width:44px;height:44px;padding:4px;justify-content:center}body:is([data-ui-page=admin],[data-ui-page=student]) .user-chip .meta{display:none}body:is([data-ui-page=admin],[data-ui-page=student]) .user-chip .avatar{width:34px;height:34px;flex-shrink:0}body:is([data-ui-page=admin],[data-ui-page=student]) .user-menu{right:0;width:min(280px,calc(100vw - 24px))}body:is([data-ui-page=admin],[data-ui-page=student]) .page{padding:20px 14px 36px}body:is([data-ui-page=admin],[data-ui-page=student]) .tabs{flex-wrap:nowrap;overflow-x:auto}body:is([data-ui-page=admin],[data-ui-page=student]) .tab{flex-shrink:0;white-space:nowrap}body:is([data-ui-page=admin],[data-ui-page=student]) .row>*{max-width:100%}body:is([data-ui-page=admin],[data-ui-page=student]) .modal:not(.modal-fullscreen-mobile):not(.model-test-preview-modal) .modal-body{max-width:100%}body[data-ui-page] .workspace-dialog{padding:20px;max-height:88dvh}body[data-ui-page=admin] :is(.batch-filters,.collection-filters){padding:16px}body[data-ui-page=admin] :is(.batch-filters,.collection-filters)>label{flex-basis:100%}body[data-ui-page=admin] :is(.batch-filters,.collection-filters,.batch-actions) .btn{max-width:100%}body[data-ui-page=admin] .collection-kpis{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}body[data-ui-page=admin] .collection-kpis .stat{padding:16px}body[data-ui-page=admin] .collection-kpis .value{font-size:21px}body[data-ui-page] .file-card{padding:20px 16px;gap:12px}body[data-ui-page] .file-card-icon{width:40px;height:54px;font-size:11px}body[data-ui-page=login] .auth-form{padding:24px 14px;align-items:flex-start}body[data-ui-page=login] .auth-card{padding:24px 20px}body[data-ui-page=login] .auth-card h3{font-size:23px}body:is([data-ui-page=home],[data-ui-page=feed]) .section{padding-block:44px}body[data-ui-page=home] .hero{padding-block:40px 56px}body[data-ui-page=home] .nav .logo{max-width:calc(100% - 60px);font-size:13px}body[data-ui-page=feed] .nav-inner{grid-template-columns:1fr;gap:10px}body[data-ui-page=feed] .nav-cta{grid-column:1;grid-row:2;justify-content:flex-start}body[data-ui-page=feed] .nav-cta .btn{flex:1}body[data-ui-page=feed] .nav-links{grid-row:3;grid-column:1;gap:20px}}@media screen and (prefers-reduced-motion:reduce){body[data-ui-page] :is(.btn,.tab,.side-nav a,.sidebar,.reveal,.card-hover,.stat){transition:none;animation:none}body[data-ui-page] .btn:hover{transform:none}}
