/* ==========================================================================
   SchoolOnline 2027 — institution interface
   One stylesheet that owns the look of the institution app. It replaces the
   older visual layers (apple-fluid, next-v1) and sits on top of app.css,
   which still supplies structural rules for individual screens.

   Principles
   - Structure is carried by contrast, not by shadows: a dark navigation rail,
     a cool grey canvas and white working surfaces with real borders.
   - One accent: the institution's own colour (--tek). Gold is reserved for
     the Hebrew calendar.
   - Rubik for headings and numbers, Heebo for reading text.
   - Phones get a five-tab bar at the bottom, like the apps people already use.
   ========================================================================== */

@font-face{font-family:'Rubik';font-style:normal;font-display:swap;font-weight:300 900;src:url(../fonts/rubik-hebrew-wght-normal.woff2) format('woff2-variations');unicode-range:U+0307-0308,U+0590-05FF,U+200C-2010,U+20AA,U+25CC,U+FB1D-FB4F}
@font-face{font-family:'Rubik';font-style:normal;font-display:swap;font-weight:300 900;src:url(../fonts/rubik-latin-wght-normal.woff2) format('woff2-variations');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

body.so27{
  --x-bg:#EDF0F4;--x-surface:#FFFFFF;--x-sunk:#F5F7FA;
  --x-ink:#0E1726;--x-ink-2:#2A3546;--x-muted:#5D6778;--x-faint:#8A93A3;
  --x-line:#DCE1E8;--x-line-2:#EAEEF2;
  --x-rail:#0F1A2B;--x-rail-2:#18253A;--x-rail-ink:#C7D0DC;
  --x-gold:#E5B04A;--x-ok:#1E7A50;--x-ok-l:#E4F4EC;--x-warn:#A6690A;--x-warn-l:#FCF1DC;--x-bad:#B4373A;--x-bad-l:#FBE8E8;
  --x-accent:var(--tek,#0D9488);--x-accent-d:var(--tek-d,#0B5F58);--x-accent-l:var(--tek-l,#E6F7F5);
  --x-display:'Rubik','Heebo',system-ui,sans-serif;--x-body:'Heebo',system-ui,-apple-system,sans-serif;
  --x-r-lg:18px;--x-r:12px;--x-r-sm:9px;
  --x-rail-w:248px;--x-top-h:68px;--x-tab-h:68px;
  --x-float:0 10px 30px rgba(14,23,38,.14),0 2px 6px rgba(14,23,38,.06);
  --x-ease:cubic-bezier(.2,.8,.2,1);
  display:block;margin:0;min-height:100dvh;background:var(--x-bg);color:var(--x-ink);
  font-family:var(--x-body);font-size:15px;line-height:1.6;letter-spacing:0;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
body.so27 *,body.so27 *::before,body.so27 *::after{box-sizing:border-box}
body.so27 :where(button,input,select,textarea){font:inherit;color:inherit}
body.so27 :where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{outline:3px solid var(--x-accent);outline-offset:2px;border-radius:var(--x-r-sm)}

/* ---------- Navigation rail (desktop) ---------- */
.sx-side{position:fixed;inset-block:0;inset-inline-start:0;z-index:40;width:var(--x-rail-w);display:flex;flex-direction:column;gap:8px;padding:18px 14px 16px;background:var(--x-rail);color:var(--x-rail-ink);overflow-y:auto;scrollbar-width:thin;scrollbar-color:#2C3A50 transparent}
.sx-brand{display:flex;align-items:center;gap:12px;padding:6px 8px 18px;margin-bottom:6px;border-bottom:1px solid rgba(255,255,255,.07);text-decoration:none;min-width:0}
.sx-brand__mark{flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:var(--x-accent);color:var(--on-brand,#fff);font:800 1.2rem/1 var(--x-display)}
.sx-brand__logo{flex:none;width:40px;height:40px;border-radius:12px;object-fit:contain;background:#fff;padding:3px}
.sx-brand__text{display:flex;flex-direction:column;min-width:0}
.sx-brand__text strong{font:700 .98rem/1.25 var(--x-display);color:#fff;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.sx-brand__text small{font-size:.8rem;color:#8D99AB}
.sx-side__nav{display:flex;flex-direction:column;gap:14px;flex:1}
.sx-group{display:flex;flex-direction:column;gap:2px}
.sx-group__label{padding:4px 12px 6px;font-size:.74rem;font-weight:600;color:#7D8A9D}
.sx-nav{position:relative;display:flex;align-items:center;gap:12px;min-height:42px;padding:8px 12px;border-radius:10px;color:var(--x-rail-ink);text-decoration:none;font-weight:500;font-size:.95rem;transition:background .15s,color .15s}
.sx-nav .icon{flex:none;color:#8A97AA;transition:color .15s}
.sx-nav:hover{background:var(--x-rail-2);color:#fff}
.sx-nav:hover .icon{color:#fff}
.sx-nav.is-on{background:color-mix(in srgb,var(--x-accent) 22%,var(--x-rail));color:#fff;font-weight:600}
.sx-nav.is-on .icon{color:color-mix(in srgb,var(--x-accent) 55%,#fff)}
.sx-nav.is-on::before{content:"";position:absolute;inset-inline-start:-14px;top:9px;bottom:9px;width:3px;border-radius:0 3px 3px 0;background:var(--x-accent)}
.sx-side__help{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;color:#9AA6B8;font-size:.88rem;text-decoration:none;border:1px solid rgba(255,255,255,.08)}
.sx-side__help:hover{color:#fff;border-color:rgba(255,255,255,.2)}

/* ---------- Top bar ---------- */
.sx-top{position:sticky;top:0;z-index:55;display:flex;align-items:center;gap:16px;height:var(--x-top-h);padding:0 32px;background:color-mix(in srgb,var(--x-bg) 88%,transparent);backdrop-filter:blur(14px) saturate(140%);-webkit-backdrop-filter:blur(14px) saturate(140%);border-bottom:1px solid var(--x-line)}
.sx-top__brand{display:none;align-items:center;gap:10px;min-width:0;text-decoration:none}
.sx-top__brand strong{font:700 1rem/1.2 var(--x-display);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sx-top__brand .sx-brand__mark,.sx-top__brand .sx-brand__logo{width:34px;height:34px;border-radius:10px;font-size:1rem}
.sx-search{display:flex;align-items:center;gap:10px;width:min(460px,100%);height:42px;padding:0 14px;border:1px solid var(--x-line);border-radius:12px;background:var(--x-surface);color:var(--x-muted);cursor:pointer;text-align:start;transition:border-color .15s,box-shadow .15s}
.sx-search:hover{border-color:#B9C2CE}
.sx-search span{flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:.93rem}
.sx-search kbd{direction:ltr;font:600 .72rem/1 var(--x-body);padding:5px 7px;border-radius:6px;background:var(--x-sunk);border:1px solid var(--x-line);color:var(--x-muted)}
.sx-top__icons{margin-inline-start:auto;display:flex;align-items:center;gap:8px}
.sx-icon{position:relative;display:grid;place-items:center;width:42px;height:42px;border-radius:12px;border:1px solid var(--x-line);background:var(--x-surface);color:var(--x-ink-2);cursor:pointer;list-style:none;text-decoration:none;transition:border-color .15s,background .15s}
.sx-icon::-webkit-details-marker{display:none}
.sx-icon:hover,.sx-icon.is-on,.sx-profile[open] .sx-icon{border-color:var(--x-accent);color:var(--x-accent-d)}
.sx-badge{position:absolute;top:-6px;inset-inline-end:-6px;min-width:20px;height:20px;padding:0 5px;border-radius:99px;background:var(--x-bad);color:#fff;font:700 .7rem/20px var(--x-body);text-align:center;border:2px solid var(--x-bg)}
.sx-avatar{overflow:hidden;padding:0;background:var(--x-accent);border-color:transparent;color:var(--on-brand,#fff)}
.sx-avatar span{font:700 1.05rem/1 var(--x-display)}
.sx-avatar img{width:100%;height:100%;object-fit:cover}
.sx-profile{position:relative}
.sx-menu{position:absolute;top:calc(100% + 8px);inset-inline-end:0;z-index:50;width:250px;padding:8px;border-radius:14px;background:var(--x-surface);border:1px solid var(--x-line);box-shadow:var(--x-float);display:flex;flex-direction:column;gap:2px}
.sx-menu__who{display:flex;flex-direction:column;padding:8px 10px 10px;margin-bottom:4px;border-bottom:1px solid var(--x-line-2)}
.sx-menu__who strong{font:700 .98rem/1.3 var(--x-display)}
.sx-menu__who small{color:var(--x-muted);font-size:.82rem}
.sx-menu a,.sx-menu button{display:flex;align-items:center;gap:10px;width:100%;padding:9px 10px;border:0;border-radius:9px;background:none;color:var(--x-ink-2);font-size:.93rem;text-align:start;text-decoration:none;cursor:pointer}
.sx-menu a:hover,.sx-menu button:hover{background:var(--x-sunk);color:var(--x-ink)}
.sx-menu .icon{color:var(--x-muted)}
.sx-menu form{margin:4px 0 0;padding-top:4px;border-top:1px solid var(--x-line-2)}
.sx-menu__out{color:var(--x-bad)!important}
.sx-menu__out .icon{color:var(--x-bad)!important}

/* ---------- Mobile tab bar + sheet ---------- */
.sx-tabbar{display:none}
.sx-sheet[hidden]{display:none}
.sx-sheet{position:fixed;inset:0;z-index:70;display:flex;align-items:flex-end;background:rgba(9,15,26,.42)}
.sx-sheet__panel{width:100%;max-height:80dvh;overflow:auto;padding:10px 16px calc(20px + env(safe-area-inset-bottom));border-radius:22px 22px 0 0;background:var(--x-surface);animation:sx-up .22s var(--x-ease)}
@keyframes sx-up{from{transform:translateY(24px);opacity:.4}to{transform:none;opacity:1}}
.sx-sheet__head{display:flex;align-items:center;justify-content:space-between;padding:6px 4px 12px}
.sx-sheet__head strong{font:700 1.08rem var(--x-display)}
.sx-sheet__head button{width:36px;height:36px;border:0;border-radius:50%;background:var(--x-sunk);font-size:1.3rem;cursor:pointer}
.sx-sheet__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.sx-sheet__grid a{display:flex;flex-direction:column;align-items:center;gap:6px;padding:14px 6px;border-radius:14px;background:var(--x-sunk);color:var(--x-ink-2);text-decoration:none;font-size:.86rem;font-weight:500;text-align:center}
.sx-sheet__grid a .icon{color:var(--x-accent-d)}

/* ---------- Page frame ---------- */
.sx-side~.sx-top,.sx-side~.main{margin-inline-start:var(--x-rail-w)!important}
body.so27 .main{display:block;min-width:0;padding:0}
body.so27 .page{max-width:1280px;margin:0 auto;padding:28px 32px 56px}
body.so27 .page__head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px 24px;flex-wrap:wrap;margin:0 0 22px;padding:0;border:0;background:none}
body.so27 .page__title,body.so27 .page h1{margin:0;font:700 clamp(1.55rem,2.4vw,2rem)/1.2 var(--x-display);letter-spacing:-.01em;color:var(--x-ink)}
body.so27 .page__sub{margin:6px 0 0;color:var(--x-muted);font-size:.97rem}
body.so27 .page h2{font-family:var(--x-display);font-weight:650;color:var(--x-ink);letter-spacing:-.005em}
body.so27 .page h3{font-family:var(--x-display);font-weight:600}
body.so27 .page__actions,body.so27 .page__head>div:last-child:not(:first-child){display:flex;gap:8px;flex-wrap:wrap}
body.so27 .muted,body.so27 .lrow__sub,body.so27 .sub-h{color:var(--x-muted)}
body.so27 .file-kicker,body.so27 .assistant-kicker{display:block;font-size:.8rem;font-weight:600;color:var(--x-accent-d);letter-spacing:0;text-transform:none}
body.so27 .backlink{display:inline-flex;align-items:center;gap:6px;margin-bottom:10px;color:var(--x-muted);font-size:.9rem;text-decoration:none}
body.so27 .backlink:hover{color:var(--x-accent-d)}

/* ---------- Surfaces ---------- */
body.so27 :where(.card,.student-card,.family-card,.document-card,.task-card,.module-card,.account-section,.preference-card,.settings-fieldset,.box,.edit-panel,.dash-panel){background:var(--x-surface);border:1px solid var(--x-line);border-radius:var(--x-r-lg);box-shadow:none}
body.so27 .card{padding:20px 22px;margin-bottom:18px}
body.so27 .card--pad{padding:22px 24px}
body.so27 .section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:0 0 14px;padding:0;border:0;background:none}
body.so27 .section-head h2{margin:0;font-size:1.12rem}
body.so27 .section-head p{margin:2px 0 0;color:var(--x-muted);font-size:.9rem}
body.so27 .module-card{display:block;padding:18px 20px;text-decoration:none;transition:border-color .15s}
body.so27 .module-card:hover{border-color:var(--x-accent)}

/* ---------- Buttons ---------- */
body.so27 .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:0 16px;border-radius:10px;border:1px solid var(--x-line);background:var(--x-surface);color:var(--x-ink);font-weight:600;font-size:.93rem;line-height:1.2;text-decoration:none;cursor:pointer;box-shadow:none;white-space:nowrap;transition:background .15s,border-color .15s,color .15s,transform .1s}
body.so27 .btn:hover{border-color:#B5BFCC;background:var(--x-sunk)}
body.so27 .btn:active:not(:disabled){transform:translateY(1px)}
body.so27 .btn--primary{background:var(--x-accent);border-color:var(--x-accent);color:var(--on-brand,#fff)}
body.so27 .btn--primary:hover{background:var(--x-accent-d);border-color:var(--x-accent-d);color:#fff}
body.so27 .btn--ghost{background:transparent}
body.so27 .btn--danger{background:var(--x-bad-l);border-color:#F1C9CA;color:var(--x-bad)}
body.so27 .btn--danger:hover{background:var(--x-bad);color:#fff;border-color:var(--x-bad)}
body.so27 .btn--light{background:#fff;color:var(--x-ink);border-color:#fff}
body.so27 .btn--lg{min-height:46px;padding:0 20px;font-size:1rem}
body.so27 .btn--sm{min-height:32px;padding:0 11px;font-size:.85rem}
body.so27 .btn:disabled,body.so27 .btn[aria-disabled=true]{opacity:.5;cursor:not-allowed}

/* ---------- Forms ---------- */
body.so27 .frm label,body.so27 .form-grid label,body.so27 label.fld{display:flex;flex-direction:column;gap:6px;font-size:.88rem;font-weight:600;color:var(--x-ink-2)}
body.so27 :where(input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=color]),select,textarea){width:100%;min-height:42px;padding:9px 12px;border:1px solid var(--x-line);border-radius:10px;background:var(--x-surface);color:var(--x-ink);font-size:.95rem;box-shadow:none;transition:border-color .15s,box-shadow .15s}
body.so27 textarea{min-height:110px;line-height:1.6;resize:vertical}
body.so27 :where(input,select,textarea):hover{border-color:#B9C2CE}
body.so27 :where(input,select,textarea):focus{outline:none;border-color:var(--x-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--x-accent) 18%,transparent)}
body.so27 ::placeholder{color:var(--x-faint)}
body.so27 input[type=checkbox],body.so27 input[type=radio]{accent-color:var(--x-accent);width:18px;height:18px}
body.so27 .form-actions,body.so27 .sticky-save{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:18px}
body.so27 .sticky-save{position:sticky;bottom:12px;padding:12px;border-radius:14px;background:var(--x-surface);border:1px solid var(--x-line);box-shadow:var(--x-float);z-index:5}

/* ---------- Tabs / segmented ---------- */
body.so27 .tabs{display:flex;gap:4px;flex-wrap:wrap;padding:4px;margin:0 0 18px;border:1px solid var(--x-line);border-radius:12px;background:var(--x-surface);width:fit-content;max-width:100%;overflow-x:auto}
body.so27 .tab{display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:0 14px;border-radius:9px;border:0;background:none;color:var(--x-muted);font-weight:600;font-size:.92rem;text-decoration:none;white-space:nowrap;cursor:pointer}
body.so27 .tab:hover{color:var(--x-ink);background:var(--x-sunk)}
body.so27 .tab--on,body.so27 .tab[aria-selected=true],body.so27 .tab[aria-current=page]{background:var(--x-ink);color:#fff}
body.so27 .tab-count{padding:0 7px;border-radius:99px;background:rgba(127,140,160,.18);font-size:.75rem}
body.so27 .view-switch{display:inline-flex;padding:3px;border:1px solid var(--x-line);border-radius:10px;background:var(--x-surface)}

/* ---------- Tables & lists ---------- */
body.so27 .table-scroll{border:1px solid var(--x-line);border-radius:var(--x-r-lg);background:var(--x-surface);overflow:auto}
body.so27 .tbl,body.so27 .page table{width:100%;border-collapse:separate;border-spacing:0;font-size:.93rem;background:transparent}
body.so27 .tbl th,body.so27 .page table th{position:sticky;top:0;z-index:1;padding:11px 14px;background:var(--x-sunk);border-bottom:1px solid var(--x-line);color:var(--x-muted);font-weight:600;font-size:.82rem;text-align:start;white-space:nowrap}
body.so27 .tbl td,body.so27 .page table td{padding:12px 14px;border-bottom:1px solid var(--x-line-2);vertical-align:middle}
body.so27 .tbl tbody tr:last-child td,body.so27 .page table tbody tr:last-child td{border-bottom:0}
body.so27 .tbl tbody tr:hover td,body.so27 .page table tbody tr:hover td{background:#F8FAFC}
body.so27 .lrow{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 2px;border-bottom:1px solid var(--x-line-2);text-decoration:none;color:inherit}
body.so27 .lrow:last-child{border-bottom:0}
body.so27 a.lrow:hover{color:var(--x-accent-d)}
body.so27 .lrow__main{font-weight:600}
body.so27 .kvgrid,body.so27 .detail-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:0;border:1px solid var(--x-line-2);border-radius:var(--x-r);overflow:hidden}
body.so27 .kv{margin:0;padding:12px 14px;border-bottom:1px solid var(--x-line-2);border-inline-end:1px solid var(--x-line-2);background:var(--x-surface)}
body.so27 .kv dt{font-size:.8rem;color:var(--x-muted);font-weight:500;margin:0 0 2px}
body.so27 .kv dd{margin:0;font-weight:600;color:var(--x-ink);overflow-wrap:anywhere}

/* ---------- Pills, tags, stats ---------- */
body.so27 :where(.pill,.badge,.status-pill){display:inline-flex;align-items:center;gap:5px;padding:3px 10px;border-radius:99px;background:var(--x-sunk);border:1px solid var(--x-line-2);color:var(--x-ink-2);font-size:.8rem;font-weight:600;line-height:1.5;white-space:nowrap}
body.so27 .pill--ok,body.so27 .pill--good{background:var(--x-ok-l);border-color:#C6E6D5;color:var(--x-ok)}
body.so27 .pill--warn{background:var(--x-warn-l);border-color:#F1DDB4;color:var(--x-warn)}
body.so27 .pill--bad,body.so27 .pill--danger,body.so27 .pill--error{background:var(--x-bad-l);border-color:#F1C9CA;color:var(--x-bad)}
body.so27 .klass-tag{display:inline-flex;align-items:center;padding:2px 9px;border-radius:7px;background:var(--x-ink);color:#fff;font-size:.78rem;font-weight:600}
body.so27 .stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin:0 0 20px}
body.so27 .stat{position:relative;padding:16px 18px;border-radius:var(--x-r-lg);background:var(--x-surface);border:1px solid var(--x-line);box-shadow:none}
body.so27 .stat::before,body.so27 .stat::after{display:none}
body.so27 .stat__value{font:700 1.8rem/1.15 var(--x-display);font-variant-numeric:tabular-nums;color:var(--x-ink)}
body.so27 .stat__label{margin-top:2px;font-size:.86rem;color:var(--x-muted)}
body.so27 .stat--warn .stat__value{color:var(--x-warn)}
body.so27 .stat--bad .stat__value{color:var(--x-bad)}

/* ---------- Feedback ---------- */
body.so27 .flash{display:flex;align-items:flex-start;gap:10px;padding:12px 16px;margin:0 0 18px;border-radius:12px;border:1px solid var(--x-line);background:var(--x-surface);font-weight:500}
body.so27 .flash--ok,body.so27 .flash--success{background:var(--x-ok-l);border-color:#C6E6D5;color:#145C3B}
body.so27 .flash--error{background:var(--x-bad-l);border-color:#F1C9CA;color:#8E2629}
body.so27 .flash--warn,body.so27 .flash--info{background:var(--x-warn-l);border-color:#F1DDB4;color:#7A4D06}
body.so27 .notice,body.so27 .attn{padding:14px 16px;border-radius:14px;border:1px solid #F1DDB4;background:var(--x-warn-l)}
body.so27 .empty{padding:28px 18px;text-align:center;color:var(--x-muted);border:1px dashed var(--x-line);border-radius:14px;background:var(--x-sunk)}
body.so27 .empty p{margin:0 0 10px}

/* ---------- Timeline ---------- */
body.so27 .tl{position:relative;display:flex;flex-direction:column;gap:12px;padding-inline-start:22px}
body.so27 .tl::before{content:"";position:absolute;inset-inline-start:6px;top:6px;bottom:6px;width:2px;background:var(--x-line)}
body.so27 .tl__item{position:relative}
body.so27 .tl__marker{position:absolute;inset-inline-start:-22px;top:16px;width:14px;height:14px;border-radius:50%;background:var(--x-surface);border:3px solid var(--x-accent)}
body.so27 .event-card{padding:14px 16px;border:1px solid var(--x-line);border-radius:14px;background:var(--x-surface)}
body.so27 .tl__meta{display:flex;gap:10px;flex-wrap:wrap;align-items:center;font-size:.82rem;color:var(--x-muted)}
body.so27 .tl__type{padding:2px 9px;border-radius:99px;background:var(--x-accent-l);color:var(--x-accent-d);font-weight:600}

/* ---------- Steps (import wizard) ---------- */
body.so27 .steps{display:flex;gap:8px;flex-wrap:wrap;list-style:none;padding:0;margin:0 0 20px}
body.so27 .step{display:flex;align-items:center;gap:8px;padding:8px 14px 8px 10px;border-radius:99px;background:var(--x-surface);border:1px solid var(--x-line);color:var(--x-muted);font-weight:600;font-size:.88rem}
body.so27 .step__n{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--x-sunk);font-size:.8rem}
body.so27 .step--on{border-color:var(--x-accent);color:var(--x-ink)}
body.so27 .step--on .step__n{background:var(--x-accent);color:var(--on-brand,#fff)}

/* ---------- Dialogs & palette ---------- */
body.so27 .modal__backdrop,body.so27 .command-palette__backdrop{background:rgba(9,15,26,.45);backdrop-filter:blur(3px)}
body.so27 .modal__dialog,body.so27 .command-palette__box{border-radius:20px;border:1px solid var(--x-line);background:var(--x-surface);box-shadow:var(--x-float)}
body.so27 .command-palette__box header{border-bottom:1px solid var(--x-line-2)}
body.so27 .command-palette__box header input{border:0;box-shadow:none;font-size:1.05rem}
body.so27 .command-palette__results a{border-radius:10px}
body.so27 .command-palette__results a:hover,body.so27 .command-palette__results a:focus{background:var(--x-accent-l);color:var(--x-accent-d)}

/* ---------- Students area ---------- */
body.so27 .student-card{padding:16px;transition:border-color .15s}
body.so27 a.student-card:hover,body.so27 .student-card:hover{border-color:var(--x-accent)}
body.so27 .student-card__avatar,body.so27 .mini-avatar{background:var(--x-accent-l);color:var(--x-accent-d);font-family:var(--x-display);font-weight:700}
body.so27 .directory-search input,body.so27 .directory-toolbar input[type=search]{min-height:46px;border-radius:12px;font-size:1rem}
body.so27 .filter-drawer__panel{border-radius:18px;border:1px solid var(--x-line);box-shadow:var(--x-float)}

/* ---------- Floating helpers ---------- */
body.so27 .ai-launcher{inset-inline-end:auto;inset-inline-start:auto;left:22px;right:auto;bottom:22px;border-radius:99px;background:var(--x-ink);color:#fff;border:0;box-shadow:var(--x-float)}
body.so27 .skip-link{z-index:100}

/* ---------- Dashboard (ui-v18 components on the new canvas) ---------- */
body.so27 .dash-day{border-radius:22px;background:linear-gradient(135deg,var(--x-rail) 0%,color-mix(in srgb,var(--x-accent) 45%,var(--x-rail)) 130%)}
body.so27 .dash-day .dash-day__hebrew{font-family:var(--x-display);font-weight:700;color:#fff}
body.so27 .dash-figures dd{font-family:var(--x-display)}
body.so27 .dash-search{display:none}
body.so27 .dash-panel{border-radius:var(--x-r-lg)}
body.so27 .dash-observance strong{font-family:var(--x-display)}

/* ---------- Responsive ---------- */
@media (max-width:1180px){body.so27{--x-rail-w:220px}body.so27 .page{padding:24px 22px 48px}.sx-top{padding:0 22px}}
@media (max-width:860px){
  body.so27{--x-top-h:60px}
  .sx-side~.sx-top,.sx-side~.main{margin-inline-start:0!important}
  .sx-side{display:none}
  .sx-top{padding:0 14px;gap:10px;background:color-mix(in srgb,var(--x-surface) 92%,transparent)}
  .sx-top__brand{display:flex}
  .sx-search{display:none}
  .sx-icon{width:40px;height:40px;border-color:transparent;background:transparent}
  .sx-avatar{background:var(--x-accent)}
  .sx-menu{position:fixed;top:calc(var(--x-top-h) + 6px);inset-inline-end:10px;width:min(300px,calc(100vw - 20px))}
  .sx-tabbar{position:fixed;inset-inline:0;bottom:0;z-index:60;display:grid;grid-template-columns:repeat(5,1fr);align-items:center;height:calc(var(--x-tab-h) + env(safe-area-inset-bottom));padding:6px 6px calc(6px + env(safe-area-inset-bottom));background:color-mix(in srgb,var(--x-surface) 94%,transparent);backdrop-filter:blur(16px) saturate(150%);-webkit-backdrop-filter:blur(16px) saturate(150%);border-top:1px solid var(--x-line)}
  .sx-tabbar>a,.sx-tabbar>button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;height:100%;border:0;background:none;color:var(--x-faint);font-size:.7rem;font-weight:600;text-decoration:none;cursor:pointer;-webkit-tap-highlight-color:transparent}
  .sx-tabbar>a.is-on,.sx-tabbar>button.is-on,.sx-tabbar>button[aria-expanded=true]{color:var(--x-ink)}
  .sx-tabbar>a.is-on .icon{stroke-width:2.4;color:var(--x-accent-d)}
  .sx-tabbar .sx-tabbar__main{justify-self:center;width:52px;height:52px;border-radius:18px;background:var(--x-ink);color:#fff;box-shadow:0 6px 16px rgba(14,23,38,.28)}
  body.so27 .main{padding-bottom:calc(var(--x-tab-h) + 24px + env(safe-area-inset-bottom))}
  body.so27 .page{padding:18px 14px 28px}
  body.so27 .page__head{margin-bottom:16px}
  body.so27 .card{padding:16px;border-radius:16px}
  body.so27 .tabs{width:100%;flex-wrap:nowrap}
  body.so27 .ai-launcher{bottom:calc(var(--x-tab-h) + 16px + env(safe-area-inset-bottom));left:14px;padding:10px 12px}
  body.so27 .ai-launcher strong{display:none}
  body.so27 .kvgrid,body.so27 .detail-grid{grid-template-columns:1fr}
  body.so27 .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (prefers-reduced-motion:reduce){body.so27 *{transition:none!important;animation:none!important}}
@media print{body.so27{background:#fff}.sx-side~.main{margin:0!important}.sx-side,.sx-top,.sx-tabbar,.sx-sheet{display:none!important}}

/* ---------- Clean-up of older layers ---------- */
body.so27 .main::before{display:none}
body.so27 .view-switch__btn{min-height:32px;padding:0 12px;border:0;border-radius:8px;background:none;color:var(--x-muted);font-weight:600;cursor:pointer}
body.so27 .view-switch__btn[aria-pressed=true],body.so27 .view-switch__btn.view-switch__btn--on,body.so27 .staff-view-switch__button--active{background:var(--x-ink)!important;color:#fff!important}

/* ---------- Student file ---------- */
body.so27 .file-spine{display:none}
body.so27 .personal-file{display:block;padding:22px 24px}
body.so27 .file-toolbar{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 14px}
body.so27 .file-toolbar .btn{min-height:36px;font-size:.88rem}
body.so27 .tik__head{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
body.so27 .tik__head .avatar{width:64px;height:64px;border-radius:18px;background:var(--x-accent-l);color:var(--x-accent-d);font:700 1.6rem/64px var(--x-display);text-align:center;overflow:hidden;box-shadow:none}
body.so27 .tik__name{font:700 clamp(1.4rem,2.2vw,1.8rem)/1.2 var(--x-display);margin:2px 0}
body.so27 .tik__actions{margin-inline-start:auto}
body.so27 .quick-record-fab{background:var(--x-accent);color:var(--on-brand,#fff);border-radius:16px;box-shadow:var(--x-float)}
@media (max-width:860px){body.so27 .quick-record-fab{bottom:calc(var(--x-tab-h) + 16px + env(safe-area-inset-bottom))!important}body.so27 .tik__actions{display:none}}
@media (max-width:860px){body.so27 .ai-launcher{display:none!important}}

/* Search lives in the top bar (desktop) and the tab bar (phone); hide the
   per-page duplicates that opened the same command palette. */
body.so27 .page__head .btn[data-command-open],body.so27 .section-head .btn[data-command-open]{display:none}

/* Personal area header keeps its dark identity band */
body.so27 .page__head.account-hero{padding:24px;border-radius:22px;background:linear-gradient(135deg,var(--x-rail) 0%,color-mix(in srgb,var(--x-accent) 40%,var(--x-rail)) 130%);color:#fff}
body.so27 .account-hero .page__title,body.so27 .account-hero h1{color:#fff}
body.so27 .account-hero .page__sub,body.so27 .account-hero .file-kicker{color:rgba(255,255,255,.72)}

/* ---------- Dark theme (personal preference) ---------- */
body.so27[data-theme=dark]{--x-bg:#0A111D;--x-surface:#111A2A;--x-sunk:#0E1624;--x-ink:#E8EDF4;--x-ink-2:#C8D1DD;--x-muted:#95A2B5;--x-faint:#6F7C90;--x-line:#243048;--x-line-2:#1B2538;--x-rail:#070D17;--x-rail-2:#121B2B;color-scheme:dark}
body.so27[data-theme=dark] .sx-top{background:color-mix(in srgb,var(--x-bg) 85%,transparent)}
body.so27[data-theme=dark] .tab--on,body.so27[data-theme=dark] .klass-tag,body.so27[data-theme=dark] .sx-tabbar__main{background:var(--x-accent);color:var(--on-brand,#fff)}
body.so27[data-theme=dark] .tbl tbody tr:hover td,body.so27[data-theme=dark] .page table tbody tr:hover td{background:#152034}
body.so27[data-theme=dark] .dash-observance{background:#2A2312;border-color:#4A3D1C;color:#F1DDAA}
body.so27[data-theme=dark] .dash-observance strong{color:#FFE7A8}
body.so27 .section-nav{display:flex;gap:4px;padding:4px;margin:0 0 18px;border:1px solid var(--x-line);border-radius:12px;background:var(--x-surface);width:fit-content;max-width:100%;overflow-x:auto}
body.so27 .section-nav button{min-height:36px;padding:0 14px;border:0;border-radius:9px;background:none;color:var(--x-muted);font-weight:600;white-space:nowrap;cursor:pointer}
body.so27 .section-nav button[aria-selected=true]{background:var(--x-ink);color:#fff}