/* Phone/tablet navigation, cards and sheets. Desktop controls retain their handlers. */
@media(max-width:1200px){.u7 .topbar{gap:9px;padding:16px}.u7 .top-title{display:none}.u7 .content{padding:24px}.u-home-grid{grid-template-columns:1fr 250px;gap:20px}.u7 .sb-header-brand{max-width:180px}.u7 .school-select{max-width:160px}}
@media(max-width:760px){.u7 .sidebar{transform:translateX(-100%);z-index:100;width:260px}.u7 .app-shell.menu-open .sidebar,.u7 .app-shell.open .sidebar,.u7 .sidebar.open{transform:translateX(0)}.u7 .main{margin-left:0!important}.u7 .hamb{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;color:var(--u-brand);background:var(--u-lilac);border:0;border-radius:10px}.u7 .bottom-nav{position:fixed;inset:auto 0 0;display:flex!important;align-items:center;justify-content:space-around;background:#fff;border-top:1px solid #e4dfed;padding:9px 12px max(10px,env(safe-area-inset-bottom));box-shadow:0 -4px 24px #35244d06;z-index:70;gap:8px;height:auto}.u7 .bottom-nav button{display:flex;flex:1;flex-direction:column;justify-content:center;align-items:center;gap:4px;min-height:48px;border:0;background:transparent;color:#9b92a9;border-radius:14px;padding:5px;font-family:inherit}.u7 .bottom-nav button img{width:25px;height:25px}.u7 .bottom-nav button span{font-size:10px;font-weight:650}.u7 .bottom-nav button.u-bottom-active{background:var(--u-lilac);color:var(--u-brand)}.u7 .content{padding-bottom:105px}.u7 .sb-powered{padding-bottom:100px}.u7 .topbar{position:sticky;flex-wrap:wrap}.u7 .u-all-apps{margin-left:auto}.u7 .u-all-apps span{display:none}.u7 .top-spacer{display:none}.u7 .v315-anchor{position:relative}.u7 .topbar .v315-anchor:has(.v61-msg-trigger){display:none}.u7 .topbar>button[data-action=help]{display:none}}
@media(max-width:760px){.u7{font-size:14px}.u7 .content{padding:19px 17px 105px}.u7 .topbar{min-height:68px;padding:12px 17px;gap:8px}.u7 .sb-header-brand{max-width:calc(100vw - 170px);margin-right:auto}.u7 .sb-header-brand span{font-size:11px}.u7 .school-select{order:10;width:100%;max-width:none;font-size:11px;padding:6px 10px}.u7 .school-select:disabled{display:none}.u7 .topbar .v315-anchor:has([data-action=lang-toggle]){display:none}.u7 .u-all-apps{display:none}.u7 .top-btn,.u7 .avatar{width:34px;height:34px;min-width:34px;min-height:34px;font-size:12px}.u7 .sb-header-brand img,.u7 .sb-header-brand .sb-logo{width:30px;height:30px}.u-greeting{margin-bottom:18px}.u-greeting h1{font-size:23px!important}.u-greeting p{font-size:11px}.u-eyebrow{font-size:8px;letter-spacing:1.3px}.u-hero{min-height:198px;padding:23px;grid-template-columns:1fr .7fr;border-radius:21px;gap:0;position:relative}.u-hero h2{font-size:24px;margin:9px 0;max-width:250px}.u-hero p{font-size:11px;line-height:1.6;margin:9px 0 15px}.u-hero .u-eyebrow{display:none}.u-hero-art{width:150%;max-width:none;margin-left:-25%;align-self:end;opacity:.9}.u-primary{font-size:11px;padding:11px 13px;gap:8px;position:relative;z-index:1;max-width:100%}.u-home-grid{display:flex;flex-direction:column;gap:23px;margin-top:25px}.u-tiles{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:27px}.u-tile{padding:15px 6px 13px;gap:10px;border-radius:14px;min-height:105px}.u-tile .u-icon{width:46px;height:46px}.u-tile span{font-size:11px}.u-section-heading h2{font-size:16px}.u-section-heading button,.u-section-heading span{font-size:10px}.u-home-aside{display:grid;grid-template-columns:1fr}.u-community{padding:22px;position:relative;min-height:190px}.u-community h2,.u-community p{max-width:70%}.u-community img{position:absolute;right:-15px;bottom:5px;width:40%;height:115px;pointer-events:none}.u-community h2{font-size:19px}.u-mini-panel{margin-top:15px}.u-task{padding:14px;gap:11px}.u-task b{font-size:12px}.u-task small{font-size:11px}.u-demo{font-size:8px;padding:4px 6px}.u-page-intro{margin-bottom:20px;gap:9px}.u-page-intro b{font-size:12px}.u-page-intro small{font-size:9px}.u-page-intro .u-icon{width:37px;height:37px}.u-back{font-size:10px;padding:8px}.u7 #content h1{font-size:23px}.u7 #content :is(.head,.page-head,.page-header,.nt-heading,.ex-head,.t56-head){flex-direction:column;align-items:stretch;gap:12px}.u7 #content :is(.grid,.g2,.g3,.g4,.ex-grid,.t56-g2,.t56-g3,.t56-g4,.sb-setup-grid){grid-template-columns:1fr!important}.u7 #content :is(.metrics,.nt-stats,.ex-kpis,.t56-kpis){display:grid;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px}.u7 #content :is(.metric,.nt-stats>div,.p616-kpi,.t56-kpi){padding:15px}.u7 #content :is(.metric strong,.nt-stats b){font-size:24px}.u7 #content :is(.card,.t56-card,.ex-card,.nt-panel,.sb-panel){padding:17px;min-width:0}.u7 #content :is(.tabs,.nt-tabs,.ex-tabs,.t56-tabs){display:flex;overflow-x:auto;flex-wrap:nowrap!important;max-width:100%;white-space:nowrap;padding:5px;scrollbar-width:none}.u7 #content :is(.tabs,.nt-tabs,.ex-tabs,.t56-tabs)>*{flex-shrink:0}.u7 #content :is(.btn,.nt-btn,.tt-button,.sb-button,.ex-btn,.t56-btn){min-height:44px;padding:10px 13px}.u7 #content input:not([type=checkbox]):not([type=radio]),.u7 #content select,.u7 #content textarea{font-size:16px!important;min-height:44px;max-width:100%;box-sizing:border-box}.u7 #content .u-record-table{min-width:0!important;width:100%;display:block;background:transparent;overflow:visible}.u7 #content .u-record-table thead{display:none}.u7 #content .u-record-table tbody{display:grid;gap:12px}.u7 #content .u-record-table tr{display:block;background:#fff;border:1px solid var(--u-line);border-radius:14px;padding:9px 13px;box-shadow:0 2px 8px #32234503}.u7 #content .u-record-table td{display:flex;align-items:center;justify-content:space-between;gap:14px;min-width:0;padding:10px 0;white-space:normal;overflow-wrap:anywhere;font-size:12px}.u7 #content .u-record-table td::before{content:attr(data-label);font-size:10px;color:#958ba2;flex:0 0 30%;text-transform:none;letter-spacing:0}.u7 #content .u-record-table td:last-child{border-bottom:0}.u7 #content .u-record-table td>*{max-width:100%}.u7 #content .u-record-table td>input{min-width:0;width:100%}.u7 #content .u-scroll-table{min-width:650px}.u7 .u-table-container{overflow:auto}.u7 .modal{position:fixed;top:auto!important;bottom:0!important;left:0!important;right:0!important;width:100%!important;max-width:none!important;max-height:90dvh;border-radius:24px 24px 0 0;transform:none!important;overflow:auto;padding-bottom:max(20px,env(safe-area-inset-bottom));z-index:150}.u7 .drawer{width:100%!important;max-width:100%;border-radius:24px 24px 0 0;max-height:94dvh;top:auto;bottom:0}.u7 dialog:not(.u-apps){max-width:calc(100vw - 24px);border-radius:19px}.u-apps{width:100%;max-width:none;height:90dvh;max-height:90dvh;margin:auto 0 0;border-radius:24px 24px 0 0;padding:23px 18px max(28px,env(safe-area-inset-bottom))}.u-apps h2{font-size:21px}.u-launcher-grid{grid-template-columns:repeat(3,1fr);gap:9px}.u-apps input{font-size:16px}.u-apps .u-tile{min-height:102px}.u7 .tt-week{grid-template-columns:1fr!important;gap:16px}.u7 .tt-day h2{font-size:14px}.u7 .tt-period{display:grid;grid-template-columns:65px 1fr;align-items:center;padding:10px 12px;gap:10px}.u7 .tt-period>small{font-size:10px}.u7 .tt-slot{padding:14px;width:100%}.u7 .nt-compose,.u7 .nt-detail{grid-template-columns:1fr}.u7 .nt-stats{grid-template-columns:repeat(3,1fr)!important}.u7 .nt-stats>div{padding:12px}.u7 .nt-stats span{font-size:10px}.u7 .nt-toolbar{gap:12px}.u7 .nt-toolbar>input{max-width:none}.u7 #content>*{min-width:0;max-width:100%}.u7 .sb-login-card{border-radius:22px}.u7 .sb-login{padding:18px}.u7 .sb-login-hero{padding:25px}}
@media(max-width:370px){.u7 .content{padding:16px 12px 100px}.u-hero{padding:18px;grid-template-columns:1fr .5fr}.u-hero h2{font-size:22px}.u-hero-art{opacity:.55}.u-tiles{gap:7px}.u7 .sb-header-brand{max-width:160px}.u-page-intro b{font-size:11px}}
@media print{.u7 .sidebar,.u7 .topbar,.u7 .bottom-nav,.u7 .u-page-intro,.u7 .u-demo,.u7 .sb-powered{display:none!important}.u7 .main{margin:0!important}.u7 .content{padding:0}.u7 .u-record-table{display:table!important}.u7 .u-record-table thead{display:table-header-group!important}.u7 .u-record-table tbody{display:table-row-group!important}.u7 .u-record-table tr{display:table-row!important}.u7 .u-record-table td{display:table-cell!important}.u7 .u-record-table td::before{display:none!important}}
@media(max-width:760px){.u7 .ex-file{width:100%;max-width:100%}.u7 .ex-file input{width:100%;min-width:0}.u7 .sidebar{transition:transform .18s}.u7 .sb-login{padding:0;min-height:100dvh;background:#f7f5fc}.u7 .sb-login-panel{padding:35px 25px;max-width:100%;border-radius:26px 26px 0 0;margin:20px 0 0}.u7 .sb-login-brand{margin-bottom:35px}.u7 .sb-login .sb-demo-buttons button{min-height:40px}.u7 .sb-login input{font-size:16px}.u7 .topbar .top-btn .u-icon{width:22px;height:22px}}
@media(max-width:760px){.u7 .app-shell.menu-open .menu-overlay{display:block;z-index:90}.u7 .menu-overlay{background:#30274166;backdrop-filter:blur(3px)}}
@media(max-width:760px){.u7 .cal-day{min-width:0!important;padding:5px 2px!important;font-size:10px}.u7 .cal-day small{font-size:8px;white-space:normal;overflow-wrap:anywhere}.u7 .cal-grid,.u7 .calendar-grid{grid-template-columns:repeat(7,minmax(0,1fr))!important;gap:3px!important}.u7 .att-tabs{overflow:auto;max-width:100%;flex-wrap:nowrap}.u7 .att-tabs>*{flex-shrink:0}.u7 .att-card,.u7 .att-panel{min-width:0;max-width:100%}.u7 .sb-powered{padding-bottom:20px}.u7 .main{padding-bottom:0}}

/*
    Phone header. The desktop spacer is hidden below 760px (above) and the legacy `.avatar` rule
    hides the profile trigger below 420px, so the bell and the avatar used to sit next to the
    hamburger on the left and their popovers, which are offset `right:-40px` / `right:-45px` for a
    right-aligned desktop button, opened off the left edge of the screen.
      * the bell takes the free space, which puts it and the avatar on the trailing edge;
      * the anchors are flex boxes, so the button's inline baseline no longer stretches the row;
      * the unread count rides as a corner badge and stays inside the 34px bell;
      * the profile trigger stays visible on every phone width;
      * both popovers become sheets under the sticky topbar, inset like the PWA notices, so they
        always open inside the viewport.
*/
@media(max-width:760px){
    .u7 .topbar .v315-anchor{margin-left:auto}
    .u7 .topbar :is(.v315-anchor,.v60-profile-anchor){position:static;display:flex;align-items:center}
    .u7 .topbar .top-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;padding:0}
    .u7 .topbar .top-btn span{position:absolute;top:-2px;right:-2px;min-width:15px;height:15px;padding:0 3px;border-radius:999px;background:var(--u-brand);color:#fff;font-size:9px;font-weight:800;line-height:15px;text-align:center;box-sizing:border-box}
    .u7 .topbar .top-btn span:empty{display:none}
    .u7 .topbar .v60-avatar-trigger{display:grid}
    .u7 .topbar :is(.v315-pop,.v60-profile-pop){left:12px;right:12px;top:calc(100% + 6px);width:auto;max-height:min(70dvh,480px);overflow:auto}
}