/* Tetrahedron Home responsive pilot — mobile + tablet application shell.
   Opt in with data-tetra-home-responsive="v1". Desktop remains unchanged. */
body[data-tetra-home-responsive="v1"]{
  --tm-safe-bottom:env(safe-area-inset-bottom,0px);
  --tm-safe-top:env(safe-area-inset-top,0px);
  --tm-canvas-deep:#181b24;
  --tm-canvas-mid:#222733;
  --tm-canvas-light:#303744;
  background:
    radial-gradient(80% 68% at 10% 0%,rgba(126,139,163,.18) 0%,transparent 66%),
    radial-gradient(62% 56% at 94% 8%,rgba(77,182,255,.10) 0%,transparent 64%),
    linear-gradient(112deg,rgba(255,255,255,.025),transparent 38%),
    linear-gradient(155deg,var(--tm-canvas-light) 0%,var(--tm-canvas-mid) 50%,var(--tm-canvas-deep) 100%) fixed!important;
}
html:has(body[data-tetra-home-responsive="v1"]){background:var(--tm-canvas-deep,#181b24)!important}
body[data-tetra-home-responsive="v1"] .right-column{background:transparent!important}

/* Home theme pilot: mineral midnight + pearl daylight share one Kairos accent
   system. This remains scoped to Home until the direction is approved. */
html[data-tetra-home-theme="dark"] body[data-tetra-home-responsive="v1"]{
  --tm-canvas-deep:#111827;--tm-canvas-mid:#172235;--tm-canvas-light:#223047;
  --tm-theme-surface:rgba(35,49,69,.78);--tm-theme-surface-2:rgba(43,59,81,.72);
  --tm-theme-line:rgba(207,225,245,.14);--tm-theme-text:#f5f8fc;--tm-theme-muted:#aab8ca;
  background:radial-gradient(75% 62% at 12% 0%,rgba(77,182,255,.13),transparent 62%),radial-gradient(60% 55% at 92% 5%,rgba(85,214,194,.08),transparent 64%),linear-gradient(155deg,var(--tm-canvas-light),var(--tm-canvas-deep)) fixed!important
}
html[data-tetra-home-theme="light"] body[data-tetra-home-responsive="v1"]{
  --tm-theme-surface:rgba(255,255,255,.82);--tm-theme-surface-2:rgba(248,250,252,.88);
  --tm-theme-line:rgba(44,62,89,.13);--tm-theme-text:#182337;--tm-theme-muted:#65738a;
  color:var(--tm-theme-text)!important;
  background:radial-gradient(75% 62% at 12% 0%,rgba(77,182,255,.12),transparent 62%),radial-gradient(60% 55% at 92% 5%,rgba(152,124,244,.08),transparent 64%),linear-gradient(155deg,#f8fafc,#edf2f6) fixed!important
}
html[data-tetra-home-theme="obsidian"] body[data-tetra-home-responsive="v1"]{
  --tm-theme-surface:rgba(36,44,56,.90);--tm-theme-surface-2:rgba(43,53,66,.86);
  --tm-theme-line:rgba(190,215,235,.14);--tm-theme-text:#f5f8fc;--tm-theme-muted:#aab7c6;
  color:var(--tm-theme-text)!important;
  background:radial-gradient(78% 65% at 10% 0%,rgba(75,110,140,.22),transparent 64%),radial-gradient(58% 52% at 92% 6%,rgba(77,182,255,.09),transparent 66%),linear-gradient(150deg,#273442 0%,#1d2530 46%,#151a22 100%) fixed!important
}
html[data-tetra-home-theme] body[data-tetra-home-responsive="v1"] .pg-header,
html[data-tetra-home-theme] body[data-tetra-home-responsive="v1"] .panel,
html[data-tetra-home-theme] body[data-tetra-home-responsive="v1"] .course-row,
html[data-tetra-home-theme] body[data-tetra-home-responsive="v1"] .att-row,
html[data-tetra-home-theme] body[data-tetra-home-responsive="v1"] .pg-kpi{
  background:var(--tm-theme-surface)!important;border-color:var(--tm-theme-line)!important
}
html[data-tetra-home-theme] body[data-tetra-home-responsive="v1"] .course-row,
html[data-tetra-home-theme] body[data-tetra-home-responsive="v1"] .att-row{background:var(--tm-theme-surface-2)!important}
html[data-tetra-home-theme="obsidian"] body[data-tetra-home-responsive="v1"] .pg-header,
html[data-tetra-home-theme="obsidian"] body[data-tetra-home-responsive="v1"] .panel{
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 8px 20px rgba(3,8,18,.18),0 24px 60px rgba(3,8,18,.12)!important;
  backdrop-filter:blur(10px) saturate(108%);-webkit-backdrop-filter:blur(10px) saturate(108%)
}
html[data-tetra-home-theme="obsidian"] body[data-tetra-home-responsive="v1"] .course-row,
html[data-tetra-home-theme="obsidian"] body[data-tetra-home-responsive="v1"] .att-row,
html[data-tetra-home-theme="obsidian"] body[data-tetra-home-responsive="v1"] .pg-kpi{
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 7px 18px rgba(3,8,18,.14)!important;
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease
}
html[data-tetra-home-theme="obsidian"] body[data-tetra-home-responsive="v1"] .course-row:hover,
html[data-tetra-home-theme="obsidian"] body[data-tetra-home-responsive="v1"] .att-row:hover{
  transform:translateY(-2px)!important;border-color:rgba(77,182,255,.34)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 12px 28px rgba(3,8,18,.22),0 0 0 1px rgba(77,182,255,.05)!important
}
html[data-tetra-home-theme="obsidian"] body[data-tetra-home-responsive="v1"] .topbar{background:rgba(21,29,40,.72)!important;border-color:var(--tm-theme-line)!important}
html[data-tetra-home-theme="light"] body[data-tetra-home-responsive="v1"] .pg-title,
html[data-tetra-home-theme="light"] body[data-tetra-home-responsive="v1"] .pk-v,
html[data-tetra-home-theme="light"] body[data-tetra-home-responsive="v1"] .panel-title,
html[data-tetra-home-theme="light"] body[data-tetra-home-responsive="v1"] .course-name,
html[data-tetra-home-theme="light"] body[data-tetra-home-responsive="v1"] .feed-text,
html[data-tetra-home-theme="light"] body[data-tetra-home-responsive="v1"] .att-label{color:var(--tm-theme-text)!important}
html[data-tetra-home-theme="light"] body[data-tetra-home-responsive="v1"] .pg-sub,
html[data-tetra-home-theme="light"] body[data-tetra-home-responsive="v1"] .pk-l,
html[data-tetra-home-theme="light"] body[data-tetra-home-responsive="v1"] .course-meta,
html[data-tetra-home-theme="light"] body[data-tetra-home-responsive="v1"] .feed-meta{color:var(--tm-theme-muted)!important}
html[data-tetra-home-theme="light"] body[data-tetra-home-responsive="v1"] .topbar{background:rgba(248,250,252,.76)!important;border-color:var(--tm-theme-line)!important}
html[data-tetra-home-theme="light"] body[data-tetra-home-responsive="v1"] .topbar .school-name{color:var(--tm-theme-text)!important}
html[data-tetra-home-theme="light"] body[data-tetra-home-responsive="v1"] .topbar .school-sub{color:var(--tm-theme-muted)!important}
html[data-tetra-home-theme="light"] body[data-tetra-home-responsive="v1"] .tetra-theme-switch,
html[data-tetra-home-theme="light"] body[data-tetra-home-responsive="v1"] .kairos-notif-trigger,
html[data-tetra-home-theme="light"] body[data-tetra-home-responsive="v1"] .kairos-user-box,
html[data-tetra-home-theme="light"] body[data-tetra-home-responsive="v1"] .user-box{
  background:rgba(255,255,255,.88)!important;border-color:rgba(44,62,89,.16)!important;
  color:#25334a!important;box-shadow:0 7px 18px rgba(31,50,76,.10),inset 0 1px 0 rgba(255,255,255,.9)!important
}
html[data-tetra-home-theme="light"] body[data-tetra-home-responsive="v1"] .kairos-notif-trigger:hover,
html[data-tetra-home-theme="light"] body[data-tetra-home-responsive="v1"] .kairos-user-box:hover,
html[data-tetra-home-theme="light"] body[data-tetra-home-responsive="v1"] .user-box:hover{background:#fff!important;border-color:rgba(77,182,255,.42)!important}
html[data-tetra-home-theme="light"] body[data-tetra-home-responsive="v1"] .kairos-notif-trigger svg{color:#33445c!important;stroke:currentColor!important}
html[data-tetra-home-theme="light"] body[data-tetra-home-responsive="v1"] .kairos-user-box .user-name,
html[data-tetra-home-theme="light"] body[data-tetra-home-responsive="v1"] .user-box .user-name{color:#182337!important}
html[data-tetra-home-theme="light"] body[data-tetra-home-responsive="v1"] .kairos-user-box .user-role,
html[data-tetra-home-theme="light"] body[data-tetra-home-responsive="v1"] .user-box .user-role{color:#65738a!important}
html[data-tetra-home-theme="light"] body[data-tetra-home-responsive="v1"] .kairos-user-box .user-avatar,
html[data-tetra-home-theme="light"] body[data-tetra-home-responsive="v1"] .user-box .user-avatar{
  background:linear-gradient(145deg,#2f9bef,#7458d6)!important;border:1px solid rgba(71,86,112,.16)!important;
  color:#fff!important;box-shadow:0 4px 12px rgba(64,87,126,.20)!important
}
html[data-tetra-home-theme="light"] body[data-tetra-home-responsive="v1"] .tetra-theme-switch button{color:#65738a}
html[data-tetra-home-theme="light"] body[data-tetra-home-responsive="v1"] .tetra-theme-switch button:hover{background:#edf4f8;color:#182337}
html[data-tetra-home-theme="light"] body[data-tetra-home-responsive="v1"] .tetra-theme-switch button.active{color:#071321}
.tetra-theme-switch{display:flex;flex:0 0 auto;gap:3px;padding:3px;border:1px solid var(--tm-theme-line,rgba(255,255,255,.14));border-radius:11px;background:var(--tm-theme-surface,rgba(255,255,255,.06))}
.tetra-theme-switch button{min-height:30px;padding:0 10px;border:0;border-radius:8px;background:transparent;color:var(--tm-theme-muted,#aab8ca);font-size:10.5px;font-weight:800;cursor:pointer}
.tetra-theme-switch button.active{background:linear-gradient(135deg,#35a9ee,#66c4ff);color:#071321;box-shadow:0 5px 14px rgba(77,182,255,.22)}

@media (min-width:721px) and (max-width:1100px){
  body[data-tetra-home-responsive="v1"] .page-content{padding:18px 18px 34px}
  body[data-tetra-home-responsive="v1"] .pg-header{align-items:flex-start;padding:16px}
  body[data-tetra-home-responsive="v1"] .pg-kpis{display:grid;grid-template-columns:repeat(4,minmax(92px,1fr));width:100%}
  body[data-tetra-home-responsive="v1"] .pg-kpi{min-width:0}
  body[data-tetra-home-responsive="v1"] .dash-layout{grid-template-columns:1fr}
  body[data-tetra-home-responsive="v1"] .right-column{min-width:0}
}

@media (max-width:720px){
  html:has(body[data-tetra-home-responsive="v1"]),body[data-tetra-home-responsive="v1"]{width:100%;min-height:100%;overflow-x:hidden}
  body[data-tetra-home-responsive="v1"]{-webkit-tap-highlight-color:transparent;overscroll-behavior-y:contain}
  body[data-tetra-home-responsive="v1"] .app-shell{display:block;min-height:100dvh}
  body[data-tetra-home-responsive="v1"] .right-column{display:block;min-height:100dvh;padding-bottom:calc(76px + var(--tm-safe-bottom))}
  body[data-tetra-home-responsive="v1"] .k-sidebar,body[data-tetra-home-responsive="v1"] .k-socrates-fab{display:none!important}

  body[data-tetra-home-responsive="v1"] .topbar{
    position:sticky;top:0;z-index:90;min-height:62px;
    padding:calc(8px + var(--tm-safe-top)) 12px 8px;
    background:rgba(16,12,39,.72)!important;
    border-bottom:1px solid rgba(255,255,255,.08)!important;
    backdrop-filter:blur(22px) saturate(125%);
    -webkit-backdrop-filter:blur(22px) saturate(125%);
  }
  body[data-tetra-home-responsive="v1"] .topbar-left{gap:8px;max-width:52%}
  body[data-tetra-home-responsive="v1"] .topbar-left .school-logo{width:36px;height:36px;padding:3px}
  body[data-tetra-home-responsive="v1"] .topbar-left .school-name{max-width:118px;font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  body[data-tetra-home-responsive="v1"] .topbar-left .school-sub{font-size:9.5px}
  body[data-tetra-home-responsive="v1"] .topbar-right{gap:6px}
  body[data-tetra-home-responsive="v1"] .tetra-theme-switch button{min-height:28px;padding:0 6px;font-size:8.5px}
  body[data-tetra-home-responsive="v1"] .kairos-user-box{max-width:132px;padding:5px 7px}
  body[data-tetra-home-responsive="v1"] .kairos-user-box .user-name{max-width:70px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11.5px}
  body[data-tetra-home-responsive="v1"] .kairos-user-box .user-role{font-size:9.5px}

  body[data-tetra-home-responsive="v1"] .page-content{padding:12px 12px calc(18px + var(--tm-safe-bottom));overflow:visible}
  body[data-tetra-home-responsive="v1"] .pg-header{display:block;margin-bottom:12px;padding:14px;border-radius:18px;background:linear-gradient(145deg,rgba(255,255,255,.085),rgba(255,255,255,.035));border-color:rgba(255,255,255,.11);box-shadow:none}
  body[data-tetra-home-responsive="v1"] .pg-greet{margin-bottom:13px}
  body[data-tetra-home-responsive="v1"] .tetra-orbit{width:54px;height:54px}
  body[data-tetra-home-responsive="v1"] .pg-title{font-size:18px;line-height:1.15}
  body[data-tetra-home-responsive="v1"] .pg-sub{font-size:11px}
  body[data-tetra-home-responsive="v1"] .pg-kpis{display:flex;grid-template-columns:none;gap:8px;width:calc(100% + 14px);margin-right:-14px;padding-right:14px;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none}
  body[data-tetra-home-responsive="v1"] .pg-kpis::-webkit-scrollbar{display:none}
  body[data-tetra-home-responsive="v1"] .pg-kpi{flex:0 0 92px;min-width:92px;min-height:54px;padding:8px 10px;scroll-snap-align:start;border-radius:13px}
  body[data-tetra-home-responsive="v1"] .pk-v{font-size:19px}

  body[data-tetra-home-responsive="v1"] .today-strip{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:0 0 12px;padding:0;overflow:visible}
  body[data-tetra-home-responsive="v1"] .today-strip-label{display:none}
  body[data-tetra-home-responsive="v1"] .act-chip{width:100%;min-width:0;min-height:46px;height:46px;padding:0 10px;border-radius:14px;justify-content:flex-start;overflow:hidden;text-overflow:ellipsis;transform:none!important}

  body[data-tetra-home-responsive="v1"] .dash-layout{display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
  body[data-tetra-home-responsive="v1"] .dash-layout>div{display:contents}
  body[data-tetra-home-responsive="v1"] .panel{min-width:0;margin:0;padding:15px;border-radius:18px;box-shadow:none}
  body[data-tetra-home-responsive="v1"] .panel-title{margin-bottom:12px;font-size:13px}
  body[data-tetra-home-responsive="v1"] .panel-link{min-height:36px;display:inline-flex;align-items:center}
  body[data-tetra-home-responsive="v1"] .empty-state{padding:16px 12px;border-radius:13px;font-size:12.5px}
  body[data-tetra-home-responsive="v1"] .course-row{align-items:flex-start;padding:12px;border-radius:14px;transform:none!important}
  body[data-tetra-home-responsive="v1"] .course-indicators{max-width:42%;gap:4px}
  body[data-tetra-home-responsive="v1"] .ci-chip{padding:3px 6px;font-size:9px}
  body[data-tetra-home-responsive="v1"] .attention-grid{gap:7px}
  body[data-tetra-home-responsive="v1"] .att-row{min-height:48px;padding:10px 12px}
  body[data-tetra-home-responsive="v1"] .feed-item{padding:11px 0}
  body[data-tetra-home-responsive="v1"] .dash-diagnostics{display:none}

  body[data-tetra-home-responsive="v1"] .tm-bottom-nav{
    display:flex;position:fixed;left:8px;right:8px;bottom:calc(8px + var(--tm-safe-bottom));z-index:9998;
    min-height:62px;padding:5px;border:1px solid rgba(255,255,255,.13);border-radius:20px;
    background:rgba(28,22,61,.88);box-shadow:0 16px 42px rgba(0,0,0,.48);
    backdrop-filter:blur(24px) saturate(135%);-webkit-backdrop-filter:blur(24px) saturate(135%);
  }
  body[data-tetra-home-responsive="v1"] .tm-tab,body[data-tetra-home-responsive="v1"] .tm-more{min-width:0;min-height:52px;color:rgba(255,255,255,.62);font-size:9.5px;border-radius:15px;touch-action:manipulation}
  body[data-tetra-home-responsive="v1"] .tm-tab .tm-ico,body[data-tetra-home-responsive="v1"] .tm-more .tm-ico{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;color:currentColor}
  body[data-tetra-home-responsive="v1"] .tm-tab .tm-ico svg,body[data-tetra-home-responsive="v1"] .tm-more .tm-ico svg{display:block;width:21px;height:21px}
  body[data-tetra-home-responsive="v1"] .tm-bottom-nav .k-nav-label{position:static!important;display:block!important;max-width:58px!important;padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important;color:inherit!important;font:inherit!important;line-height:1.1!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;transform:none!important;pointer-events:none!important}
  body[data-tetra-home-responsive="v1"] .tm-tab.active,body[data-tetra-home-responsive="v1"] .tm-tab[aria-current="page"],body[data-tetra-home-responsive="v1"] .tm-more[open]{color:#fff;background:linear-gradient(145deg,rgba(82,190,255,.22),rgba(143,92,255,.18));box-shadow:inset 0 0 0 1px rgba(82,190,255,.24)}
  body[data-tetra-home-responsive="v1"] .tm-tab.active .tm-ico,body[data-tetra-home-responsive="v1"] .tm-tab[aria-current="page"] .tm-ico{padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
  body[data-tetra-home-responsive="v1"] .tm-ico.has-guide{position:relative;width:25px;height:25px;overflow:visible}
  body[data-tetra-home-responsive="v1"] .tm-ico.has-guide:before{content:"";position:absolute;inset:-2px;border-radius:50%;background:conic-gradient(from 0deg,var(--kng-accent,#7b6cf6),transparent 30%,transparent 70%,var(--kng-accent,#7b6cf6));animation:kng-ring 7s linear infinite}
  body[data-tetra-home-responsive="v1"] .tm-ico.has-guide .guide-avatar{position:relative;display:block;width:100%;height:100%;border-radius:50%}
  body[data-tetra-home-responsive="v1"] .tm-ico.has-guide .gf-disc{position:absolute;inset:1px;display:block;overflow:hidden;border-radius:50%;background:#3a3170}
  body[data-tetra-home-responsive="v1"] .tm-ico.has-guide .gf-disc svg{display:block;width:100%;height:100%}
  body[data-tetra-home-responsive="v1"] .tm-ico.has-guide .gf-breath{transform-box:fill-box;transform-origin:50% 100%;animation:kng-breath 4.4s ease-in-out infinite}
  body[data-tetra-home-responsive="v1"] .tm-ico.has-guide .gf-eye{transform-box:fill-box;transform-origin:center;animation:kng-blink 5.6s infinite}
  body[data-tetra-home-responsive="v1"] .tm-ico.has-guide .gf-mouth{opacity:0}
  body[data-tetra-home-responsive="v1"] .tm-more>summary{min-height:52px;color:inherit;font-size:9.5px}
  body[data-tetra-home-responsive="v1"] .tm-more-sheet{right:0;bottom:calc(100% + 8px);display:grid;grid-template-columns:1fr 1fr;gap:5px;width:min(330px,calc(100vw - 16px));min-width:0;padding:9px;border-color:rgba(255,255,255,.13);border-radius:18px;background:rgba(29,23,62,.97);box-shadow:0 18px 46px rgba(0,0,0,.52)}
  body[data-tetra-home-responsive="v1"] .tm-more-sheet a{min-height:46px;padding:0 10px;color:rgba(255,255,255,.86);font-size:12px}
  body[data-tetra-home-responsive="v1"] .tm-more-sheet a .tm-ico{flex:0 0 auto;width:20px;height:20px}
  body[data-tetra-home-responsive="v1"] .tm-more-sheet a .tm-ico svg{width:19px;height:19px}
  /* Keep the tutor portrait on the same 26px rig used by the desktop rail.
     This rule intentionally follows the generic sheet-icon sizing above: the
     portrait and its orbital ring must share one centered containing block. */
  body[data-tetra-home-responsive="v1"] .tm-more-sheet a .tm-ico.has-guide{
    position:relative;flex:0 0 26px;width:26px;height:26px;margin:0;
    align-self:center;overflow:visible
  }
  body[data-tetra-home-responsive="v1"] .tm-more-sheet a .tm-ico.has-guide .guide-avatar,
  body[data-tetra-home-responsive="v1"] .tm-more-sheet a .tm-ico.has-guide .gf-disc{box-sizing:border-box}
  body[data-tetra-home-responsive="v1"] .tm-more-sheet a:active{background:rgba(82,190,255,.14)}
}

@media (max-width:370px){
  body[data-tetra-home-responsive="v1"] .kairos-user-box .user-copy{display:none}
  body[data-tetra-home-responsive="v1"] .pg-kpi{flex-basis:84px;min-width:84px}
  body[data-tetra-home-responsive="v1"] .tm-tab,body[data-tetra-home-responsive="v1"] .tm-more{font-size:9px}
  body[data-tetra-home-responsive="v1"] .act-chip{font-size:11.5px}
}
