/* YENTUMI Gradebook Enterprise — Step 5.72 Universal Mobile Design System */
:root{
  --gb-mobile-breakpoint:800px;
  --gb-mobile-navy:#0b2545;
  --gb-mobile-blue:#155eef;
  --gb-mobile-text:#10233f;
  --gb-mobile-muted:#64748b;
  --gb-mobile-line:#dbe4ef;
  --gb-mobile-surface:#ffffff;
  --gb-mobile-soft:#f6f9fd;
  --gb-mobile-radius:18px;
  --gb-mobile-radius-sm:13px;
  --gb-mobile-gap:clamp(10px,2.8vw,16px);
  --gb-mobile-pad:clamp(14px,4vw,20px);
  --gb-mobile-title:clamp(1.7rem,7vw,2.35rem);
  --gb-mobile-h2:clamp(1.15rem,4.7vw,1.45rem);
  --gb-mobile-control:48px;
  --gb-mobile-dock-space:calc(106px + env(safe-area-inset-bottom,0px));
}
html[data-theme="dark"]{
  --gb-mobile-text:#edf4ff;--gb-mobile-muted:#a9b8cc;--gb-mobile-line:#29415e;
  --gb-mobile-surface:#102238;--gb-mobile-soft:#0d1b2d;
}
.gb-mobile-system *{box-sizing:border-box}
.gb-mobile-system :where(img,svg,video,canvas){max-width:100%}
.gb-mobile-system :where(.panel,.card,.content-card,.dashboard-card,.parent-child-card,.portal-search-card,.learner-profile-card,.lesson-ai-tier-selector,.lesson-ai-match,.lesson-ai-recovery,.result-approval-card){min-width:0;container-type:inline-size}
.gb-mobile-system :where(.badge,[class*="badge"],[class*="chip"],[class*="pill"]){word-break:normal;overflow-wrap:normal;hyphens:none}
.gb-mobile-system :where(.button,button,a.button,input,select,textarea){max-width:100%}

@media (max-width:800px){
  html,body.gb-mobile-system{max-width:100%;overflow-x:hidden}
  body.gb-mobile-system{--gb-page-inline:clamp(12px,4vw,20px);--gb-card-pad:clamp(14px,4vw,20px)}
  body.gb-mobile-system :where(.dashboard-shell .shell,.shell,.public-shell,.lesson-ai-wallet-page,.parent-dashboard,.premium-portal){width:100%;max-width:100%;min-width:0}
  body.gb-mobile-system :where(.dashboard-shell .shell,.shell){padding-left:var(--gb-page-inline)!important;padding-right:var(--gb-page-inline)!important}
  body.gb-mobile-system :where(.page-head){margin-bottom:clamp(14px,4vw,22px)}
  body.gb-mobile-system :where(.page-head h1,.mobile-page-title){font-size:var(--gb-mobile-title)!important;line-height:1.05;letter-spacing:-.035em;overflow-wrap:normal;word-break:normal}
  body.gb-mobile-system :where(h2,.section-heading h2,.panel h2){line-height:1.18;overflow-wrap:normal;word-break:normal}
  body.gb-mobile-system :where(.panel,.card,.content-card,.dashboard-card,.parent-child-card,.portal-search-card,.learner-profile-card){padding:var(--gb-card-pad)!important;border-radius:var(--gb-mobile-radius)!important}
  body.gb-mobile-system :where(.split,.grid-form,.form-grid,.lesson-fields-grid,.profile-fields,.teacher-info-grid,.observation-fields,.parent-child-grid,.portal-actions){grid-template-columns:minmax(0,1fr)!important}
  body.gb-mobile-system :where(.stats,.summary-grid,.kpi-grid,.dashboard-stats,.attendance-summary-grid){grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:var(--gb-mobile-gap)!important}
  body.gb-mobile-system :where(.actions,.panel-actions,.form-actions,.section-actions){display:flex;flex-wrap:wrap;gap:10px;min-width:0}
  body.gb-mobile-system :where(.actions>* ,.panel-actions>* ,.form-actions>* ,.section-actions>*){min-width:0}
  body.gb-mobile-system :where(label){min-width:0}
  body.gb-mobile-system :where(input:not([type=checkbox]):not([type=radio]),select,textarea){width:100%;min-width:0;font-size:16px!important;border-radius:12px}
  body.gb-mobile-system :where(input:not([type=checkbox]):not([type=radio]),select,button,.button){min-height:44px}
  body.gb-mobile-system textarea{line-height:1.5;resize:vertical}
  body.gb-mobile-system :where(.filters){width:100%;min-width:0;grid-template-columns:minmax(0,1fr)!important;gap:10px}
  body.gb-mobile-system :where(.filters label){min-width:0;width:100%}
  body.gb-mobile-system :where(.table-wrap,.report-table,.lesson-development-scroll,.lesson-ai-tier-performance){max-width:100%;overflow-x:auto;overscroll-behavior-inline:contain;-webkit-overflow-scrolling:touch}
  body.gb-mobile-system :where(.panel>table:not(.lesson-development-print),.content-card>table){display:block;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
  body.gb-mobile-system :where(th,td){word-break:normal;overflow-wrap:break-word}
  body.gb-mobile-system :where(.badge,[class*="badge"],[class*="chip"],[class*="pill"]){max-width:100%;white-space:normal;line-height:1.25}
  body.gb-mobile-system :where(.pwa-app-dock){padding-bottom:max(10px,env(safe-area-inset-bottom,0px))}
  body.gb-mobile-system :where(.dashboard-shell .shell,.parent-dashboard,.premium-portal){padding-bottom:var(--gb-mobile-dock-space)!important}

  /* AI lesson marketplace: never squeeze labels or price badges letter-by-letter. */
  body.gb-mobile-system .lesson-ai-tier-selector{margin:12px 0!important;padding:14px!important;border-radius:17px!important}
  body.gb-mobile-system .lesson-ai-tier-heading{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:10px!important;align-items:start!important}
  body.gb-mobile-system .lesson-ai-tier-heading .lesson-ai-free-chip,
  body.gb-mobile-system .lesson-ai-tier-heading .lesson-ai-wallet-chip{justify-self:start;white-space:normal;max-width:100%}
  body.gb-mobile-system .lesson-ai-tier-grid{grid-template-columns:minmax(0,1fr)!important;gap:12px!important}
  body.gb-mobile-system .lesson-ai-tier-card-body{display:block!important;padding:15px!important;min-width:0}
  body.gb-mobile-system .lesson-ai-tier-top{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:8px!important;flex-wrap:wrap!important;min-width:0}
  body.gb-mobile-system .lesson-ai-tier-top>b{font-size:16px!important;white-space:nowrap;word-break:normal!important;overflow-wrap:normal!important}
  body.gb-mobile-system .lesson-ai-tier-top em{font-size:9px!important;white-space:nowrap;max-width:100%}
  body.gb-mobile-system .lesson-ai-tier-card strong{display:block!important;margin:10px 0 4px!important;font-size:21px!important;line-height:1.1}
  body.gb-mobile-system .lesson-ai-tier-card small{display:block!important;margin:0 0 7px!important;line-height:1.35}
  body.gb-mobile-system .lesson-ai-tier-card p{font-size:12px!important;line-height:1.5!important}

  /* Curriculum match/recovery cards: readable, compact, and never hidden by the dock. */
  body.gb-mobile-system :where(.lesson-ai-match-card,.lesson-ai-recovery-card,.lesson-ai-curriculum-recovery,.lesson-ai-curriculum-match){padding:clamp(14px,4vw,18px)!important;border-radius:18px!important;min-width:0}
  body.gb-mobile-system :where(.lesson-ai-match-card h2,.lesson-ai-recovery-card h2){font-size:var(--gb-mobile-h2)!important;line-height:1.2}
  body.gb-mobile-system :where(.lesson-ai-recovery-facts,.lesson-ai-match-facts){grid-template-columns:minmax(0,1fr)!important}

  /* Parent / learner portal inherits the same spacing contract. */
  body.gb-mobile-system[data-gb-surface="family"] :where(.public-shell){padding-left:var(--gb-page-inline)!important;padding-right:var(--gb-page-inline)!important;padding-bottom:var(--gb-mobile-dock-space)!important}
  body.gb-mobile-system[data-gb-surface="family"] :where(.parent-dashboard-head){align-items:flex-start;flex-direction:column;gap:10px}
  body.gb-mobile-system[data-gb-surface="family"] :where(.child-actions){display:grid;grid-template-columns:minmax(0,1fr)!important}
  body.gb-mobile-system[data-gb-surface="family"] :where(.child-actions .button){width:100%;min-height:46px}
}

@media (max-width:480px){
  body.gb-mobile-system{--gb-page-inline:12px;--gb-card-pad:15px}
  body.gb-mobile-system :where(.stats,.summary-grid,.kpi-grid,.dashboard-stats,.attendance-summary-grid){grid-template-columns:minmax(0,1fr)!important}
  body.gb-mobile-system :where(.actions,.panel-actions,.form-actions,.section-actions){display:grid;grid-template-columns:minmax(0,1fr);width:100%}
  body.gb-mobile-system :where(.actions>.button,.actions>button,.panel-actions>.button,.panel-actions>button,.form-actions>.button,.form-actions>button){width:100%;justify-content:center}
}

/* Component responsiveness follows the space a module actually receives. */
@container (max-width:520px){
  .gb-mobile-system :where(.lesson-ai-commerce-kpis,.child-metrics,.learner-facts){grid-template-columns:minmax(0,1fr)!important}
  .gb-mobile-system :where(.lesson-ai-commerce-tier-row,.subject-assignment-row){grid-template-columns:minmax(0,1fr)!important}
}

@media (prefers-reduced-motion:reduce){.gb-mobile-system *, .gb-mobile-system *::before,.gb-mobile-system *::after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}
@media print{body.gb-mobile-system{overflow:visible!important}.gb-mobile-system .pwa-app-dock{display:none!important}}