/* HAMOU MATH v56 — premium teacher studio and document-preview refinement.
   Visual-only, deliberately scoped to the existing teacher studio selectors. */
:root {
  --hm56-ink: #f4f8ff;
  --hm56-muted: #a7b8d0;
  --hm56-line: rgba(118, 186, 255, .2);
  --hm56-cyan: #63e5ff;
  --hm56-violet: #a99aff;
  --hm56-gold: #d7ad70;
}
body:has(main.wrap) {
  background:
    radial-gradient(65rem 42rem at 4% -12%, rgba(32, 126, 255, .19), transparent 62%),
    radial-gradient(55rem 36rem at 104% 0%, rgba(137, 90, 255, .14), transparent 64%),
    linear-gradient(180deg, #071225 0%, #081322 48%, #050b16 100%) !important;
}
body:has(main.wrap) main.wrap {
  width: min(1480px, calc(100% - 40px));
  margin: clamp(16px, 3vw, 34px) auto 72px;
}
body:has(main.wrap) .hero,
body:has(main.wrap) .card {
  border: 1px solid var(--hm56-line) !important;
  border-radius: 24px !important;
  background:
    radial-gradient(ellipse at 100% 0%, rgba(48, 143, 255, .1), transparent 48%),
    linear-gradient(145deg, rgba(13, 31, 57, .96), rgba(7, 18, 36, .97)) !important;
  box-shadow: 0 22px 68px rgba(0, 0, 0, .22), inset 0 1px rgba(255,255,255,.035) !important;
}
body:has(main.wrap) .hero {
  padding: clamp(22px, 4vw, 42px);
}
body:has(main.wrap) .hero:after {
  background: linear-gradient(135deg, #2788ff, #62e7ff 55%, #9c86ff) !important;
  opacity: .12;
}
body:has(main.wrap) .eyebrow,
body:has(main.wrap) .lesson-plan-number {
  color: var(--hm56-cyan) !important;
}
body:has(main.wrap) .hero h1 {
  color: #f5f8ff;
  letter-spacing: -.035em;
  line-height: 1.25;
  text-wrap: balance;
}
body:has(main.wrap) .hero p,
body:has(main.wrap) .hint,
body:has(main.wrap) .lesson-plan-subtitle,
body:has(main.wrap) .lesson-plan-meta {
  color: var(--hm56-muted) !important;
}
body:has(main.wrap) .section-title h2 { color: #f0f6ff; }
body:has(main.wrap) .fields { gap: 14px; }
body:has(main.wrap) input,
body:has(main.wrap) textarea,
body:has(main.wrap) select {
  min-height: 46px;
  border: 1px solid rgba(124, 185, 255, .23) !important;
  border-radius: 13px !important;
  background: rgba(4, 14, 29, .88) !important;
  color: #f4f8ff !important;
}
body:has(main.wrap) input::placeholder,
body:has(main.wrap) textarea::placeholder { color: #8194b0; }
body:has(main.wrap) input:focus,
body:has(main.wrap) textarea:focus,
body:has(main.wrap) select:focus {
  border-color: var(--hm56-cyan) !important;
  box-shadow: 0 0 0 3px rgba(99, 229, 255, .13) !important;
}
body:has(main.wrap) button {
  border: 1px solid rgba(160, 231, 255, .22);
  border-radius: 13px;
  background: linear-gradient(120deg, #6ceaff, #83baff 58%, #b4a4ff);
  box-shadow: 0 8px 24px rgba(42, 145, 255, .12);
  transition: transform .18s ease, filter .18s ease, box-shadow .18s ease;
}
body:has(main.wrap) button:hover:not(:disabled) {
  transform: translateY(-1px);
  filter: brightness(1.05);
  box-shadow: 0 12px 30px rgba(42, 145, 255, .18);
}
body:has(main.wrap) button.secondary {
  color: #dbe8fa !important;
  border-color: rgba(129, 177, 231, .23) !important;
  background: rgba(23, 43, 69, .9) !important;
  box-shadow: none;
}
body:has(main.wrap) .lesson-plan-panel,
body:has(main.wrap) #lessonPlanPanel {
  border: 1px solid rgba(99, 229, 255, .2) !important;
  border-radius: 18px !important;
  background: rgba(5, 18, 37, .64) !important;
}
body:has(main.wrap) .lesson-plan-status,
body:has(main.wrap) #lessonPlanStatus,
body:has(main.wrap) .notice {
  border: 1px solid rgba(129, 177, 231, .16);
  border-radius: 13px;
  background: rgba(16, 36, 62, .75) !important;
  color: #b9cbe2 !important;
}
body:has(main.wrap) .lesson-plan-item {
  border: 1px solid rgba(120, 175, 236, .2) !important;
  border-radius: 14px !important;
  background: rgba(12, 29, 51, .86) !important;
  color: #e8f2ff !important;
}
body:has(main.wrap) .lesson-plan-item:hover,
body:has(main.wrap) .lesson-plan-item.selected {
  border-color: rgba(99, 229, 255, .6) !important;
  background: rgba(28, 91, 142, .28) !important;
}
body:has(main.wrap) .preview {
  border: 1px solid rgba(215, 173, 112, .85) !important;
  border-radius: 18px !important;
  background: #fdfcf8 !important;
  color: #172a43 !important;
  box-shadow: 0 24px 70px rgba(0,0,0,.25), inset 0 0 0 5px #fff, inset 0 0 0 6px rgba(215,173,112,.34) !important;
}
body:has(main.wrap) .preview h1,
body:has(main.wrap) .preview h2,
body:has(main.wrap) .preview h3,
body:has(main.wrap) .preview h4 {
  color: #172a43 !important;
  text-wrap: balance;
}
body:has(main.wrap) .preview h2,
body:has(main.wrap) .preview h3,
body:has(main.wrap) .preview h4 {
  border-inline-start: 4px solid #147d82 !important;
  border-inline-end: 0 !important;
  padding-inline-start: 10px !important;
  padding-inline-end: 0 !important;
}
body:has(main.wrap) .preview th {
  background: #172a43 !important;
  color: #fff !important;
}
body:has(main.wrap) .preview td { border-color: #d9e1e6 !important; }
body:has(main.wrap) .preview tr { break-inside: avoid; page-break-inside: avoid; }
body:has(main.wrap) :focus-visible {
  outline: 3px solid rgba(99, 229, 255, .82);
  outline-offset: 3px;
}
@media (max-width: 760px) {
  body:has(main.wrap) main.wrap { width: calc(100% - 24px); margin-top: 12px; }
  body:has(main.wrap) .hero,
  body:has(main.wrap) .card { border-radius: 19px !important; }
  body:has(main.wrap) .hero { padding: 22px 18px; }
  body:has(main.wrap) .card { padding: 16px; }
  body:has(main.wrap) .preview { min-height: 420px; padding: 16px !important; }
  body:has(main.wrap) .buttons { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body:has(main.wrap) .buttons button { width: 100%; padding-inline: 9px; }
}
@media (max-width: 420px) {
  body:has(main.wrap) .buttons { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  body:has(main.wrap) *, body:has(main.wrap) *::before, body:has(main.wrap) *::after {
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}