/*
 * まなび動画ナビ Photo Fidelity UI v241
 *
 * 20枚の設計画像から抽出した「構図・明暗・情報階層」を、既存DOMのまま
 * 再構成する最終表示レイヤーです。フォーム、URL、値、通信、動画、手書きの
 * 所有権は持ちません。削除するとv240表示へ即時ロールバックできます。
 */

:root {
  --mnv-v241-night-1000: #020817;
  --mnv-v241-night-950: #050d1f;
  --mnv-v241-night-900: #07152b;
  --mnv-v241-night-850: #0a1d39;
  --mnv-v241-night-800: #102846;
  --mnv-v241-sky-50: #f8fcff;
  --mnv-v241-sky-100: #eaf7ff;
  --mnv-v241-sky-200: #d5efff;
  --mnv-v241-cyan: #62e8ff;
  --mnv-v241-blue: #3978ff;
  --mnv-v241-violet: #8367ff;
  --mnv-v241-magenta: #df69ff;
  --mnv-v241-orange: #ff8a3d;
  --mnv-v241-gold: #ffc45c;
  --mnv-v241-green: #43dca0;
  --mnv-v241-white: #f8fbff;
  --mnv-v241-copy: #0a2644;
  --mnv-v241-copy-soft: #466680;
  --mnv-v241-line-light: rgba(38, 115, 196, .24);
  --mnv-v241-line-dark: rgba(113, 200, 255, .22);
  --mnv-v241-glass-light: rgba(255, 255, 255, .92);
  --mnv-v241-glass-dark: rgba(10, 29, 57, .88);
  --mnv-v241-shadow-light: 0 24px 70px rgba(24, 78, 139, .17);
  --mnv-v241-shadow-dark: 0 26px 75px rgba(0, 4, 20, .44);
  --mnv-v241-glow-blue: 0 0 0 1px rgba(98, 232, 255, .24), 0 20px 56px rgba(57, 120, 255, .24);
  --mnv-v241-r-xl: 32px;
  --mnv-v241-r-lg: 24px;
  --mnv-v241-r-md: 18px;
  --mnv-v241-r-sm: 12px;
  --mnv-v241-max: 1500px;
}

/* ---------- Readability and chrome ---------- */

body.mnv-future-ui {
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

body.mnv-future-ui .site-header {
  border-bottom: 1px solid rgba(83, 143, 202, .20);
  background: rgba(248, 252, 255, .96);
  box-shadow: 0 10px 34px rgba(11, 47, 87, .08);
}

body.mnv-future-ui:is(.shell-auth, .shell-learner, .shell-immersive, .shell-admin) .site-header,
body.mnv-future-ui.organization-app .site-header {
  border-bottom-color: rgba(98, 232, 255, .15);
  background: rgba(3, 12, 29, .94);
  box-shadow: 0 16px 48px rgba(0, 5, 20, .34);
}

body.mnv-future-ui.shell-public :is(.system-announcement, .maintenance-inline-banner, .mode-banner),
body.mnv-future-ui.shell-reading :is(.system-announcement, .maintenance-inline-banner, .mode-banner) {
  border-color: #b7d9f5;
  background: #eaf6ff;
  color: #103a60;
}

body.mnv-future-ui.shell-public :is(.system-announcement, .maintenance-inline-banner, .mode-banner) :is(a, span, small, strong, p),
body.mnv-future-ui.shell-reading :is(.system-announcement, .maintenance-inline-banner, .mode-banner) :is(a, span, small, strong, p) {
  color: #103a60;
}

body.mnv-future-ui.shell-public :is(input, textarea, select),
body.mnv-future-ui.shell-reading :is(input, textarea, select),
body.mnv-future-ui.shell-ops :is(input, textarea, select) {
  border-color: #9fc3e3;
  background: #fff;
  color: #102e4c;
}

body.mnv-future-ui.shell-public :is(input, textarea)::placeholder,
body.mnv-future-ui.shell-reading :is(input, textarea)::placeholder,
body.mnv-future-ui.shell-ops :is(input, textarea)::placeholder {
  color: #66809b;
  opacity: 1;
}

body.mnv-future-ui:is(.shell-auth, .shell-learner, .shell-immersive, .shell-admin) :is(input, textarea, select),
body.mnv-future-ui.organization-app :is(input, textarea, select) {
  border-color: rgba(133, 194, 239, .31);
  background: rgba(4, 18, 39, .82);
  color: #f8fbff;
}

body.mnv-future-ui:is(.shell-auth, .shell-learner, .shell-immersive, .shell-admin) :is(input, textarea)::placeholder,
body.mnv-future-ui.organization-app :is(input, textarea)::placeholder {
  color: #93abc4;
  opacity: 1;
}

body.mnv-future-ui .future-utility-dock {
  gap: 8px;
}

body.mnv-future-ui .future-utility-dock :is(.guide-fab, .qr-login-fab, .child-read-aloud) {
  border: 1px solid rgba(121, 190, 239, .34);
  background: #081b37;
  color: #fff;
  box-shadow: 0 14px 34px rgba(2, 14, 33, .30);
}

/* ---------- Public homepage: ref 11 + the bright half of ref 19 ---------- */

body.mnv-future-ui.public-app.shell-public.page-index .container {
  background: #f8fcff;
}

body.mnv-future-ui.page-index .koto-cosmic-hero {
  min-height: 900px;
  padding: clamp(64px, 6.5vw, 108px) clamp(22px, 4vw, 64px) 96px;
  background:
    radial-gradient(circle at 83% 8%, rgba(255, 255, 255, .80) 0 5%, transparent 31%),
    radial-gradient(circle at 73% 30%, rgba(98, 232, 255, .36), transparent 26rem),
    radial-gradient(circle at 8% 18%, rgba(131, 103, 255, .16), transparent 29rem),
    linear-gradient(142deg, #eaf8ff 0%, #bfe8ff 43%, #e9e5ff 100%);
}

body.mnv-future-ui.page-index .koto-cosmic-hero::before {
  width: min(56vw, 820px);
  height: min(42vw, 570px);
  right: -10vw;
  top: -9rem;
  border: 1px solid rgba(255, 255, 255, .76);
  border-radius: 46% 54% 61% 39% / 47% 44% 56% 53%;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .68), rgba(98, 232, 255, .06)),
    repeating-radial-gradient(circle at 55% 48%, transparent 0 31px, rgba(57, 120, 255, .08) 32px 33px);
  box-shadow: 0 0 110px rgba(255, 255, 255, .58);
  transform: rotate(-8deg);
}

body.mnv-future-ui.page-index .koto-cosmic-hero::after {
  inset: 0;
  width: auto;
  height: auto;
  border-radius: 0;
  background:
    linear-gradient(115deg, transparent 28%, rgba(255, 255, 255, .45) 47%, transparent 64%),
    radial-gradient(circle, rgba(22, 99, 181, .19) 0 1px, transparent 1.7px);
  background-size: auto, 72px 72px;
  opacity: .45;
  transform: none;
}

body.mnv-future-ui.page-index .koto-hero-inner {
  position: relative;
  z-index: 2;
  grid-template-columns: minmax(390px, .84fr) minmax(610px, 1.16fr);
  gap: clamp(34px, 4vw, 72px);
  width: min(var(--mnv-v241-max), 100%);
  align-items: center;
}

body.mnv-future-ui.page-index .koto-hero-copy {
  padding: clamp(8px, 1vw, 18px) 0;
  text-align: left;
}

body.mnv-future-ui.page-index .koto-kicker {
  margin-bottom: 18px;
  padding: 8px 13px;
  border: 1px solid rgba(19, 85, 149, .22);
  border-radius: 999px;
  background: rgba(255, 255, 255, .88);
  color: #113a61;
  box-shadow: 0 12px 32px rgba(19, 78, 137, .11);
}

body.mnv-future-ui.page-index .koto-kicker b {
  color: #235fd5;
}

body.mnv-future-ui.page-index .koto-audience-scope {
  margin: 0 0 22px;
  padding: 14px 16px;
  border: 1px solid rgba(39, 111, 177, .22);
  border-radius: 18px;
  background: rgba(255, 255, 255, .88);
  color: #173e61;
  box-shadow: 0 16px 40px rgba(29, 83, 139, .10);
}

body.mnv-future-ui.page-index .koto-audience-scope :is(strong, li) {
  color: #173e61;
}

body.mnv-future-ui.page-index .koto-audience-scope li {
  border-color: #c6dff3;
  background: #f7fbff;
}

body.mnv-future-ui.page-index .koto-hero h1 {
  max-width: 700px;
  color: #061f3b;
  font-size: clamp(48px, 5.2vw, 78px);
  line-height: 1.10;
  letter-spacing: -.052em;
  text-wrap: balance;
}

body.mnv-future-ui.page-index .koto-hero-problem {
  color: #061f3b;
}

body.mnv-future-ui.page-index .koto-hero-bridge {
  margin: .24em 0 .12em;
  color: #224d74;
}

body.mnv-future-ui.page-index .koto-hero-solution strong {
  background: linear-gradient(110deg, #1460df 0%, #684be2 57%, #c948c8 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  filter: none;
}

body.mnv-future-ui.page-index .koto-route-convergence path {
  stroke-width: 4;
}

body.mnv-future-ui.page-index .koto-hero-promise {
  max-width: 620px;
  margin-top: 24px;
  color: #294d6e;
  font-size: clamp(16px, 1.35vw, 19px);
  line-height: 1.85;
}

body.mnv-future-ui.page-index .koto-hero-actions {
  margin-top: 28px;
}

body.mnv-future-ui.page-index .koto-hero-actions .button.primary,
body.mnv-future-ui.page-index .koto-final-cta .button.primary {
  border-color: #ee762b;
  background: linear-gradient(135deg, #ff9c4b, #ff7531);
  color: #14223b;
  box-shadow: 0 16px 36px rgba(239, 103, 31, .31), inset 0 1px rgba(255, 255, 255, .35);
}

body.mnv-future-ui.page-index .koto-secondary-button {
  border-color: #9abddd;
  background: rgba(255, 255, 255, .91);
  color: #123b62;
}

body.mnv-future-ui.page-index .koto-trust-row {
  color: #345b7b;
}

body.mnv-future-ui.page-index .koto-trust-row span {
  padding: 7px 10px;
  border: 1px solid rgba(50, 112, 174, .19);
  border-radius: 999px;
  background: rgba(255, 255, 255, .76);
  color: #345b7b;
}

body.mnv-future-ui.page-index .koto-hero-stage {
  position: relative;
  padding: 12px 0 0;
}

body.mnv-future-ui.page-index .koto-stage-orb {
  opacity: .46;
  filter: blur(2px);
}

body.mnv-future-ui.page-index .koto-device {
  padding: 1px;
  border: 1px solid rgba(68, 144, 210, .34);
  border-radius: 34px;
  background: linear-gradient(135deg, rgba(255, 255, 255, .98), rgba(170, 224, 255, .88), rgba(191, 178, 255, .76));
  box-shadow: 0 40px 100px rgba(18, 75, 134, .25), 0 0 0 7px rgba(255, 255, 255, .30);
  transform: none;
}

body.mnv-future-ui.page-index .koto-device-camera {
  top: 9px;
  width: 7px;
  height: 7px;
  background: #50c7ef;
  box-shadow: 0 0 0 4px rgba(80, 199, 239, .17);
}

body.mnv-future-ui.page-index .koto-device-screen {
  min-height: 630px;
  margin: 10px;
  border: 1px solid rgba(75, 132, 191, .19);
  border-radius: 24px;
  background:
    radial-gradient(circle at 82% 4%, rgba(98, 232, 255, .16), transparent 19rem),
    linear-gradient(180deg, #fbfdff, #f1f8ff);
  color: #102d4b;
}

body.mnv-future-ui.page-index .koto-appbar {
  min-height: 68px;
  border-bottom-color: #d2e4f2;
  background: rgba(255, 255, 255, .92);
}

body.mnv-future-ui.page-index .koto-appbar :is(a, strong, span) {
  color: #173958;
}

body.mnv-future-ui.page-index .koto-appbar nav .is-active {
  background: #e8f2ff;
  color: #2362d7;
}

body.mnv-future-ui.page-index .koto-device-content {
  padding: clamp(22px, 2.5vw, 32px);
}

body.mnv-future-ui.page-index .koto-device-welcome :is(span, h2),
body.mnv-future-ui.page-index .koto-search-form :is(label, legend, summary),
body.mnv-future-ui.page-index .koto-plan-options label {
  color: #173a5c;
}

body.mnv-future-ui.page-index .koto-device-welcome h2 {
  font-size: clamp(24px, 2.3vw, 34px);
  letter-spacing: -.03em;
}

body.mnv-future-ui.page-index .status-badge.status-info {
  border-color: #a8ddcd;
  background: #ebfaf4;
  color: #12664e;
}

body.mnv-future-ui.page-index .first-visit-guide {
  border: 1px solid #a9dacc;
  background: #edfaf5;
  color: #143f37;
}

body.mnv-future-ui.page-index .first-visit-guide :is(span, strong, small, button) {
  color: #143f37;
}

body.mnv-future-ui.page-index .koto-search-form {
  position: relative;
  gap: 15px;
  padding: clamp(18px, 2vw, 26px);
  border: 1px solid #a8ccea;
  border-radius: 24px;
  background: rgba(255, 255, 255, .96);
  box-shadow: 0 22px 58px rgba(31, 84, 139, .14), inset 0 1px #fff;
}

body.mnv-future-ui.page-index .koto-search-form::before {
  position: absolute;
  inset: -1px auto -1px -1px;
  width: 4px;
  border-radius: 24px 0 0 24px;
  background: linear-gradient(180deg, var(--mnv-v241-cyan), var(--mnv-v241-blue), var(--mnv-v241-violet));
  content: "";
  pointer-events: none;
}

body.mnv-future-ui.page-index .koto-input-shell textarea {
  min-height: 132px;
  border: 2px solid #89bce4;
  border-radius: 16px;
  background: #fff;
  color: #0f2f4f;
  font-size: 16px;
  box-shadow: inset 0 2px 7px rgba(20, 63, 105, .05), 0 0 0 5px rgba(57, 120, 255, .045);
}

body.mnv-future-ui.page-index .koto-input-shell textarea:focus {
  border-color: #3978ff;
  box-shadow: 0 0 0 5px rgba(57, 120, 255, .13), 0 16px 32px rgba(40, 101, 181, .12);
}

body.mnv-future-ui.page-index .koto-input-shell .char-counter {
  color: #57728d;
}

body.mnv-future-ui.page-index .koto-example-chips {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 9px;
}

body.mnv-future-ui.page-index .koto-example-chips button {
  min-width: 0;
  min-height: 64px;
  padding: 9px 10px;
  border: 1px solid #b6cee5;
  border-radius: 14px;
  background: #fff;
  color: #173b5e;
  box-shadow: 0 9px 20px rgba(22, 70, 119, .09);
}

body.mnv-future-ui.page-index .koto-example-chips button :is(span, b, small) {
  color: #173b5e;
}

body.mnv-future-ui.page-index .koto-example-chips button > span {
  border-color: #8ebaf1;
  color: #2f68d8;
}

body.mnv-future-ui.page-index .koto-example-chips button:hover,
body.mnv-future-ui.page-index .koto-example-chips button.is-selected {
  border-color: #3978ff;
  background: #edf4ff;
  color: #174aa7;
  box-shadow: 0 0 0 3px rgba(57, 120, 255, .12), 0 12px 26px rgba(35, 91, 172, .13);
}

body.mnv-future-ui.page-index .koto-time-pills span {
  border-color: #a9c6df;
  background: #fff;
  color: #294e70;
}

body.mnv-future-ui.page-index .koto-time-pills input:checked + span {
  border-color: #3978ff;
  background: #eaf2ff;
  color: #174aa7;
  box-shadow: 0 0 0 3px rgba(57, 120, 255, .12);
}

body.mnv-future-ui.page-index .koto-search-submit {
  min-height: 54px;
  border-color: #2e66e5;
  border-radius: 15px;
  background: linear-gradient(135deg, #245bd6, #6740c6 58%, #8b35b5);
  color: #fff;
  box-shadow: 0 16px 36px rgba(66, 82, 216, .29);
}

body.mnv-future-ui.page-index .koto-plan-options {
  border: 1px solid #d0e0ee;
  background: #f4f9fd;
  color: #173a5c;
}

body.mnv-future-ui.page-index .cosmic-live-showcase {
  position: relative;
  margin-top: 24px;
  padding: clamp(20px, 2.2vw, 30px);
  overflow: hidden;
  border: 1px solid rgba(98, 232, 255, .22);
  border-radius: 28px;
  background:
    radial-gradient(circle at 86% 12%, rgba(98, 232, 255, .16), transparent 18rem),
    radial-gradient(circle at 6% 90%, rgba(131, 103, 255, .16), transparent 18rem),
    linear-gradient(145deg, #06142b, #0b2850);
  color: #f8fbff;
  box-shadow: 0 25px 65px rgba(4, 18, 44, .32);
}

body.mnv-future-ui.page-index .cosmic-live-showcase :is(h2, strong, span, small, b) {
  color: inherit;
}

body.mnv-future-ui.page-index .cosmic-journey > div,
body.mnv-future-ui.page-index .cosmic-preview-cards article,
body.mnv-future-ui.page-index .cosmic-demo-player {
  border-color: rgba(121, 197, 245, .20);
  background: rgba(10, 33, 65, .82);
  color: #f8fbff;
}

body.mnv-future-ui.page-index .cosmic-preview-cards {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

body.mnv-future-ui.page-index .cosmic-preview-cards article:nth-child(2) {
  border-color: rgba(98, 232, 255, .45);
  box-shadow: 0 0 0 1px rgba(98, 232, 255, .13), 0 16px 40px rgba(57, 120, 255, .20);
}

body.mnv-future-ui.page-index .koto-section {
  width: min(1320px, calc(100% - 40px));
  padding-block: clamp(76px, 8vw, 120px);
}

body.mnv-future-ui.page-index .koto-section-heading :is(h2, p),
body.mnv-future-ui.page-index .koto-learning-range-intro :is(h2, p) {
  color: #0d2d4e;
}

body.mnv-future-ui.page-index :is(
  .koto-learning-range-grid article,
  .koto-pain-grid article,
  .koto-feature-grid article,
  .koto-scene-grid article,
  .koto-role-grid article,
  .homepage-trust-grid article,
  .org-path-card
) {
  border: 1px solid #c9dfef;
  border-radius: 24px;
  background: linear-gradient(145deg, #fff, #f2f9ff);
  color: #143653;
  box-shadow: 0 18px 48px rgba(22, 71, 117, .10);
}

body.mnv-future-ui.page-index :is(
  .koto-learning-range-grid article,
  .koto-pain-grid article,
  .koto-feature-grid article,
  .koto-scene-grid article,
  .koto-role-grid article,
  .homepage-trust-grid article,
  .org-path-card
) :is(h2, h3, strong, p, span, small, li, b) {
  color: inherit;
}

body.mnv-future-ui.page-index .koto-flow-board,
body.mnv-future-ui.page-index .brand-film-stage {
  border-color: rgba(98, 232, 255, .20);
  background:
    radial-gradient(circle at 50% 38%, rgba(57, 120, 255, .22), transparent 24rem),
    linear-gradient(145deg, #041027, #0a2345);
  box-shadow: var(--mnv-v241-shadow-dark);
}

body.mnv-future-ui.page-index .koto-final-cta {
  border: 1px solid rgba(98, 232, 255, .21);
  background:
    radial-gradient(circle at 86% 15%, rgba(98, 232, 255, .20), transparent 24rem),
    radial-gradient(circle at 10% 90%, rgba(223, 105, 255, .17), transparent 24rem),
    linear-gradient(145deg, #07152b, #113b70);
  color: #fff;
  box-shadow: var(--mnv-v241-shadow-dark);
}

body.mnv-future-ui.page-index .koto-final-cta :is(h2, p, span, strong) {
  color: #fff;
}

/* ---------- Auth: ref 02 ---------- */

body.mnv-future-ui:is(.page-login, .page-register, .page-forgot_password, .page-reset_password) {
  background:
    radial-gradient(circle at 12% 20%, rgba(98, 232, 255, .18), transparent 30rem),
    radial-gradient(circle at 88% 78%, rgba(131, 103, 255, .18), transparent 32rem),
    linear-gradient(145deg, #030a18, #081a35 48%, #0a2548);
}

body.mnv-future-ui:is(.page-login, .page-register, .page-forgot_password, .page-reset_password) main.container {
  width: min(1180px, calc(100% - 32px));
  min-height: calc(100dvh - 150px);
  display: grid;
  place-items: center;
}

body.mnv-future-ui:is(.page-login, .page-register, .page-forgot_password, .page-reset_password) .auth-wrap {
  position: relative;
  width: 100%;
  max-width: 1120px;
  grid-template-columns: minmax(0, 1.05fr) minmax(360px, .95fr);
  gap: 0;
  overflow: hidden;
  border: 1px solid rgba(125, 202, 248, .22);
  border-radius: 34px;
  background:
    radial-gradient(circle at 18% 18%, rgba(98, 232, 255, .13), transparent 22rem),
    linear-gradient(135deg, rgba(8, 29, 58, .96), rgba(5, 18, 39, .96));
  box-shadow: 0 38px 100px rgba(0, 4, 20, .52);
}

body.mnv-future-ui.page-login .auth-wrap.single {
  grid-template-columns: minmax(360px, 590px);
  max-width: 620px;
  background: transparent;
}

body.mnv-future-ui:is(.page-login, .page-register, .page-forgot_password, .page-reset_password) .auth-card {
  width: 100%;
  max-width: none;
  padding: clamp(30px, 4.4vw, 58px);
  border: 0;
  border-radius: 0;
  background: rgba(4, 15, 34, .84);
  color: #f8fbff;
  box-shadow: none;
}

body.mnv-future-ui:is(.page-login, .page-register, .page-forgot_password, .page-reset_password) .auth-side {
  position: relative;
  padding: clamp(34px, 4.5vw, 64px);
  border: 0;
  border-left: 1px solid rgba(113, 198, 244, .18);
  border-radius: 0;
  background:
    radial-gradient(circle at 76% 20%, rgba(98, 232, 255, .23), transparent 17rem),
    radial-gradient(circle at 24% 82%, rgba(131, 103, 255, .24), transparent 19rem),
    linear-gradient(145deg, #0b2b51, #101c42);
  color: #f8fbff;
}

body.mnv-future-ui:is(.page-login, .page-register, .page-forgot_password, .page-reset_password) :is(.auth-card, .auth-side) :is(h1, h2, h3, label, strong, p, li, small, span) {
  color: #f8fbff;
}

body.mnv-future-ui:is(.page-login, .page-register, .page-forgot_password, .page-reset_password) :is(.auth-card, .auth-side) .muted {
  color: #b4c8dc;
}

body.mnv-future-ui:is(.page-login, .page-register, .page-forgot_password, .page-reset_password) .auth-card h1 {
  font-size: clamp(30px, 3.7vw, 47px);
  line-height: 1.22;
  letter-spacing: -.035em;
}

body.mnv-future-ui:is(.page-login, .page-register, .page-forgot_password, .page-reset_password) .eyebrow {
  color: var(--mnv-v241-cyan);
}

body.mnv-future-ui:is(.page-login, .page-register, .page-forgot_password, .page-reset_password) .search-form {
  gap: 9px;
}

body.mnv-future-ui:is(.page-login, .page-register, .page-forgot_password, .page-reset_password) .search-form :is(input, select) {
  min-height: 52px;
  margin-bottom: 6px;
  border: 1px solid rgba(140, 201, 242, .34);
  border-radius: 14px;
  background: rgba(8, 29, 57, .90);
  color: #fff;
}

body.mnv-future-ui:is(.page-login, .page-register, .page-forgot_password, .page-reset_password) .google-login-button {
  min-height: 52px;
  border-color: #dbe5ed;
  background: #fff;
  color: #18314b;
  box-shadow: 0 10px 24px rgba(0, 6, 20, .22);
}

body.mnv-future-ui:is(.page-login, .page-register, .page-forgot_password, .page-reset_password) .google-login-button span {
  color: #18314b;
}

body.mnv-future-ui:is(.page-login, .page-register, .page-forgot_password, .page-reset_password) .auth-divider::before {
  border-color: rgba(155, 199, 231, .20);
}

body.mnv-future-ui:is(.page-login, .page-register, .page-forgot_password, .page-reset_password) .auth-divider span {
  background: #06152d;
  color: #9fb6ca;
}

/* ---------- Learner cockpit: refs 01, 08, 09, 16, 17 ---------- */

body.mnv-future-ui.shell-learner main.container,
body.mnv-future-ui.shell-immersive main.container {
  width: min(1600px, calc(100% - 30px));
  max-width: none;
}

body.mnv-future-ui.shell-learner .dash-layout {
  grid-template-columns: 238px minmax(0, 1fr) 304px;
  gap: 20px;
}

body.mnv-future-ui.shell-learner .dash-nav,
body.mnv-future-ui.shell-admin .admin-sidebar,
body.mnv-future-ui.organization-app .org-sidebar {
  border: 1px solid rgba(105, 185, 239, .18);
  border-radius: 24px;
  background:
    radial-gradient(circle at 20% 0%, rgba(98, 232, 255, .13), transparent 15rem),
    linear-gradient(180deg, #06152d, #091e3c);
  box-shadow: 0 22px 60px rgba(0, 5, 21, .34), inset 0 1px rgba(255, 255, 255, .05);
}

body.mnv-future-ui.shell-learner .dash-nav :is(a, .dash-nav-item),
body.mnv-future-ui.shell-admin .admin-sidebar a,
body.mnv-future-ui.organization-app .org-nav a {
  min-height: 44px;
  border: 1px solid transparent;
  border-radius: 12px;
  color: #a9c0d8;
}

body.mnv-future-ui.shell-learner .dash-nav a.active,
body.mnv-future-ui.shell-learner .dash-nav a[aria-current="page"],
body.mnv-future-ui.shell-admin .admin-sidebar a.active,
body.mnv-future-ui.shell-admin .admin-sidebar a[aria-current="page"],
body.mnv-future-ui.organization-app .org-nav a.active,
body.mnv-future-ui.organization-app .org-nav a[aria-current="page"] {
  border-color: rgba(98, 232, 255, .22);
  background: linear-gradient(90deg, rgba(57, 120, 255, .24), rgba(98, 232, 255, .09));
  color: #fff;
  box-shadow: inset 3px 0 var(--mnv-v241-cyan), 0 9px 24px rgba(22, 90, 179, .15);
}

body.mnv-future-ui.shell-learner .dash-greet {
  position: relative;
  padding: 24px 26px;
  overflow: hidden;
  border: 1px solid rgba(113, 195, 244, .20);
  border-radius: 24px;
  background:
    radial-gradient(circle at 90% 16%, rgba(98, 232, 255, .17), transparent 18rem),
    linear-gradient(135deg, rgba(13, 41, 76, .92), rgba(8, 25, 52, .92));
  box-shadow: 0 19px 48px rgba(0, 6, 25, .28);
}

body.mnv-future-ui.shell-learner .dash-greet :is(h1, p, small, span, strong) {
  color: #f8fbff;
}

body.mnv-future-ui.shell-learner .dash-greet p {
  color: #b5cade;
}

body.mnv-future-ui.shell-learner .stat-cards {
  gap: 12px;
}

body.mnv-future-ui.shell-learner .stat-card,
body.mnv-future-ui.shell-admin .kpi-card,
body.mnv-future-ui.organization-app .org-kpi {
  position: relative;
  min-height: 116px;
  overflow: hidden;
  border: 1px solid rgba(117, 190, 235, .20);
  border-radius: 20px;
  background: linear-gradient(145deg, rgba(15, 43, 78, .94), rgba(9, 27, 56, .94));
  box-shadow: 0 16px 40px rgba(0, 5, 22, .27), inset 0 1px rgba(255, 255, 255, .05);
}

body.mnv-future-ui.shell-learner .stat-card::before,
body.mnv-future-ui.shell-admin .kpi-card::before,
body.mnv-future-ui.organization-app .org-kpi::before {
  position: absolute;
  inset: 0 0 auto;
  height: 3px;
  background: linear-gradient(90deg, var(--mnv-v241-cyan), var(--mnv-v241-blue), transparent 82%);
  content: "";
  pointer-events: none;
}

body.mnv-future-ui.shell-learner .stat-card :is(span, strong, small),
body.mnv-future-ui.shell-admin .kpi-card :is(span, strong, small),
body.mnv-future-ui.organization-app .org-kpi :is(span, strong, small) {
  color: #f8fbff;
}

body.mnv-future-ui.shell-learner .stat-card .stat-text span,
body.mnv-future-ui.organization-app .org-kpi span,
body.mnv-future-ui.organization-app .org-kpi small {
  color: #a9c0d6;
}

body.mnv-future-ui.shell-learner :is(.today-learning-card, .next-card, .route-card-s, .side-card, .panel),
body.mnv-future-ui.shell-immersive :is(.panel, .side-card) {
  border: 1px solid rgba(114, 187, 235, .20);
  background: linear-gradient(145deg, rgba(14, 40, 73, .92), rgba(8, 25, 51, .92));
  box-shadow: 0 18px 48px rgba(0, 5, 22, .26), inset 0 1px rgba(255, 255, 255, .045);
}

body.mnv-future-ui.shell-learner :is(.today-learning-card, .next-card, .route-card-s, .side-card, .panel) :is(h1, h2, h3, strong),
body.mnv-future-ui.shell-immersive :is(.panel, .side-card) :is(h1, h2, h3, strong) {
  color: #f8fbff;
}

body.mnv-future-ui.shell-learner :is(.today-learning-card, .next-card, .route-card-s, .side-card, .panel) :is(p, small, .muted, .rc-meta),
body.mnv-future-ui.shell-immersive :is(.panel, .side-card) :is(p, small, .muted) {
  color: #afc3d7;
}

body.mnv-future-ui.shell-learner .next-card,
body.mnv-future-ui.shell-learner .today-learning-card {
  border-color: rgba(98, 232, 255, .34);
  background:
    radial-gradient(circle at 82% 4%, rgba(98, 232, 255, .18), transparent 20rem),
    linear-gradient(135deg, rgba(13, 50, 91, .97), rgba(10, 30, 61, .97));
  box-shadow: var(--mnv-v241-glow-blue);
}

body.mnv-future-ui.shell-learner .ring,
body.mnv-future-ui.shell-learner .learning-focus-ring {
  filter: drop-shadow(0 0 12px rgba(98, 232, 255, .20));
}

/* Saved routes, history and favorites: ref 09 */
body.mnv-future-ui:is(.page-favorites, .page-watch_history, .page-feedback_history) .history-list {
  gap: 12px;
}

body.mnv-future-ui:is(.page-favorites, .page-watch_history, .page-feedback_history) .history-item {
  grid-template-columns: 188px minmax(0, 1fr) auto;
  min-height: 132px;
  border: 1px solid rgba(113, 190, 238, .20);
  border-radius: 20px;
  background: linear-gradient(145deg, rgba(14, 40, 73, .94), rgba(8, 25, 51, .94));
  color: #f8fbff;
  box-shadow: 0 15px 40px rgba(0, 5, 22, .25);
}

body.mnv-future-ui:is(.page-favorites, .page-watch_history, .page-feedback_history) .history-item :is(h2, h3, strong, span) {
  color: #f8fbff;
}

body.mnv-future-ui:is(.page-favorites, .page-watch_history, .page-feedback_history) .history-item :is(p, small, .muted) {
  color: #aac0d6;
}

body.mnv-future-ui:is(.page-favorites, .page-watch_history, .page-feedback_history) .history-thumb {
  overflow: hidden;
  border: 1px solid rgba(115, 190, 240, .22);
  border-radius: 14px;
  background: #020817;
}

/* Study plan as a cosmic route: ref 17 */
body.mnv-future-ui.page-study_plan .study-plan-hero {
  border-color: rgba(98, 232, 255, .26);
  background:
    radial-gradient(circle at 82% 20%, rgba(98, 232, 255, .18), transparent 18rem),
    linear-gradient(135deg, #0b2a52, #111d43);
  box-shadow: var(--mnv-v241-shadow-dark);
}

body.mnv-future-ui.page-study_plan .study-plan-hero :is(h1, p, span, strong) {
  color: #f8fbff;
}

body.mnv-future-ui.page-study_plan .study-plan-summary > div,
body.mnv-future-ui.page-study_plan .study-plan-day-card,
body.mnv-future-ui.page-study_plan .study-plan-status-panel {
  border-color: rgba(115, 190, 239, .20);
  background: linear-gradient(145deg, rgba(14, 40, 73, .94), rgba(8, 25, 51, .94));
  color: #f8fbff;
  box-shadow: 0 15px 40px rgba(0, 5, 22, .25);
}

body.mnv-future-ui.page-study_plan :is(.study-plan-summary > div, .study-plan-day-card, .study-plan-status-panel) :is(h2, h3, strong, time, span) {
  color: #f8fbff;
}

body.mnv-future-ui.page-study_plan :is(.study-plan-summary > div, .study-plan-day-card, .study-plan-status-panel) :is(p, small) {
  color: #adc3d8;
}

body.mnv-future-ui.page-study_plan .study-plan-day {
  grid-template-columns: 72px minmax(0, 1fr);
  gap: 16px;
}

body.mnv-future-ui.page-study_plan .study-plan-marker {
  width: 66px;
  height: 66px;
  border-color: rgba(113, 190, 239, .30);
  border-radius: 50%;
  background: #0b2344;
  color: #b4c9dc;
  box-shadow: 0 0 0 6px rgba(57, 120, 255, .06);
}

body.mnv-future-ui.page-study_plan .study-plan-day.is-today .study-plan-marker,
body.mnv-future-ui.page-study_plan .is-today .study-plan-marker {
  border-color: var(--mnv-v241-cyan);
  background: linear-gradient(145deg, #3978ff, #6b50df);
  box-shadow: 0 0 0 7px rgba(98, 232, 255, .11), 0 0 30px rgba(57, 120, 255, .35);
}

body.mnv-future-ui.page-study_plan .study-plan-day:not(:last-child)::before {
  left: 32px;
  width: 3px;
  background: linear-gradient(180deg, var(--mnv-v241-blue), rgba(98, 232, 255, .18));
}

body.mnv-future-ui.page-study_plan .study-plan-task-list li {
  border: 1px solid rgba(119, 190, 235, .14);
  background: rgba(5, 20, 43, .72);
}

/* ---------- Route / three videos: refs 04 and 13 ---------- */

body.mnv-future-ui:is(.page-route, .page-route_preview) .result-head {
  padding: 24px 26px;
  border: 1px solid rgba(99, 226, 255, .25);
  border-radius: 24px;
  background:
    radial-gradient(circle at 88% 14%, rgba(98, 232, 255, .16), transparent 18rem),
    linear-gradient(135deg, rgba(13, 45, 83, .95), rgba(8, 25, 52, .95));
  box-shadow: var(--mnv-v241-shadow-dark);
}

body.mnv-future-ui:is(.page-route, .page-route_preview) .result-head :is(h1, h2, p, span, strong) {
  color: #f8fbff;
}

body.mnv-future-ui:is(.page-route, .page-route_preview) .step-rail {
  position: relative;
  display: grid;
  grid-template-columns: auto max-content minmax(24px, 1fr);
  gap: 10px;
  align-items: center;
  padding: 10px 12px;
  border: 1px solid rgba(113, 190, 239, .18);
  border-radius: 17px;
  background: rgba(5, 20, 43, .68);
}

body.mnv-future-ui:is(.page-route, .page-route_preview) .route-timeline {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  align-items: stretch;
}

body.mnv-future-ui:is(.page-route, .page-route_preview) .route-step {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
  min-width: 0;
  height: 100%;
}

body.mnv-future-ui:is(.page-route, .page-route_preview) .route-step .step-line {
  display: block;
  width: 100%;
  min-height: 2px;
  height: 2px;
  background: linear-gradient(90deg, var(--mnv-v241-blue), rgba(98, 232, 255, .16));
}

body.mnv-future-ui:is(.page-route, .page-route_preview) .route-step:last-child .step-line {
  display: block;
  opacity: .28;
}

body.mnv-future-ui:is(.page-route, .page-route_preview) .video-card {
  height: 100%;
  overflow: hidden;
  border: 1px solid rgba(113, 190, 239, .22);
  border-radius: 24px;
  background: linear-gradient(155deg, rgba(15, 43, 78, .97), rgba(7, 22, 47, .97));
  color: #f8fbff;
  box-shadow: 0 20px 55px rgba(0, 5, 22, .33);
}

body.mnv-future-ui:is(.page-route, .page-route_preview) .route-step:first-child .video-card {
  border-color: rgba(255, 196, 92, .52);
  box-shadow: 0 0 0 1px rgba(255, 196, 92, .13), 0 22px 58px rgba(112, 70, 15, .25);
}

body.mnv-future-ui:is(.page-route, .page-route_preview) .video-card-main {
  grid-template-columns: 1fr;
  gap: 0;
  height: 100%;
  padding: 0;
}

body.mnv-future-ui:is(.page-route, .page-route_preview) .video-thumb {
  aspect-ratio: 16 / 9;
  border-radius: 0;
  background: #020817;
}

body.mnv-future-ui:is(.page-route, .page-route_preview) .video-body {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 20px;
}

body.mnv-future-ui:is(.page-route, .page-route_preview) .video-card :is(h2, h3, strong, span) {
  color: #f8fbff;
}

body.mnv-future-ui:is(.page-route, .page-route_preview) .video-card :is(p, small, .video-meta, .muted) {
  color: #adc2d6;
}

body.mnv-future-ui:is(.page-route, .page-route_preview) .video-actions {
  margin-top: auto;
}

body.mnv-future-ui:is(.page-route, .page-route_preview) .reason-block {
  border: 1px solid rgba(98, 232, 255, .16);
  border-radius: 16px;
  background: rgba(4, 18, 39, .58);
  color: #dceaf7;
}

body.mnv-future-ui:is(.page-route, .page-route_preview) .reason-block :is(b, strong, span, p, small) {
  color: #dceaf7;
}

body.mnv-future-ui:is(.page-route, .page-route_preview) .rec-badge {
  border-color: rgba(255, 196, 92, .42);
  background: #fff0c9;
}

body.mnv-future-ui:is(.page-route, .page-route_preview) .rec-badge :is(span, strong) {
  color: #704600;
}

body.mnv-future-ui:is(.page-route, .page-route_preview) .status-chip {
  border-color: rgba(133, 195, 237, .30);
  background: #e8f4ff;
  color: #174e83;
}

body.mnv-future-ui:is(.page-route, .page-route_preview) .save-cta {
  border: 1px solid rgba(67, 220, 160, .27);
  border-radius: 24px;
  background: linear-gradient(135deg, rgba(11, 57, 64, .94), rgba(9, 31, 59, .94));
  box-shadow: 0 18px 46px rgba(0, 10, 28, .30);
}

/* ---------- Player / learning session: refs 05 and 14 ---------- */

body.mnv-future-ui:is(.page-watch, .page-study_session) .page-grid,
body.mnv-future-ui.page-study_session .study-session-layout {
  grid-template-columns: minmax(0, 1fr) minmax(285px, 340px);
  gap: 18px;
}

body.mnv-future-ui:is(.page-watch, .page-study_session) .watch-topline,
body.mnv-future-ui.page-study_session .study-session-head {
  padding: 18px 22px;
  border: 1px solid rgba(113, 190, 239, .18);
  border-radius: 20px;
  background: rgba(10, 31, 61, .78);
}

body.mnv-future-ui:is(.page-watch, .page-study_session) .watch-topline :is(h1, a, span),
body.mnv-future-ui.page-study_session .study-session-head :is(h1, p, a, span) {
  color: #f8fbff;
}

body.mnv-future-ui:is(.page-watch, .page-study_session) :is(.player-card, .study-session-player-card) {
  overflow: hidden;
  border: 1px solid rgba(98, 232, 255, .26);
  border-radius: 24px;
  background: #030b19;
  box-shadow: 0 26px 72px rgba(0, 4, 18, .48), 0 0 0 1px rgba(98, 232, 255, .07);
}

body.mnv-future-ui:is(.page-watch, .page-study_session) :is(.player-card, .study-session-player-card) :is(h2, h3, strong, span) {
  color: #f8fbff;
}

body.mnv-future-ui:is(.page-watch, .page-study_session) :is(.player-card, .study-session-player-card) :is(p, small) {
  color: #a9c0d6;
}

body.mnv-future-ui:is(.page-watch, .page-study_session) :is(.focus-list, .learning-focus, .study-session-focus) {
  position: relative;
  border: 1px solid rgba(98, 232, 255, .28);
  border-radius: 20px;
  background:
    linear-gradient(90deg, rgba(98, 232, 255, .12), transparent 65%),
    rgba(9, 31, 61, .91);
  box-shadow: inset 4px 0 var(--mnv-v241-cyan), 0 16px 38px rgba(0, 7, 26, .26);
}

body.mnv-future-ui:is(.page-watch, .page-study_session) .aside-col,
body.mnv-future-ui.page-study_session .study-session-side {
  position: sticky;
  top: 90px;
}

body.mnv-future-ui:is(.page-watch, .page-study_session) :is(.watch-info-list, .course-learning-check) > * {
  border-color: rgba(113, 190, 239, .15);
  background: rgba(4, 18, 39, .45);
}

body.mnv-future-ui:is(.page-watch, .page-study_session) .future-study-dock {
  border-color: rgba(98, 232, 255, .22);
  background: rgba(4, 17, 37, .96);
  box-shadow: 0 -17px 55px rgba(0, 4, 18, .42);
}

/* ---------- Questions, handwriting and diagnosis: refs 06, 07 and 15 ---------- */

body.mnv-future-ui:is(.page-practice_lab, .page-dekiru_route) :is(.practice-shell, .dekiru-shell) {
  max-width: 1360px;
}

body.mnv-future-ui.page-practice_lab .practice-hero,
body.mnv-future-ui.page-practice_lab .practice-unified-hero,
body.mnv-future-ui.page-dekiru_route .dekiru-flow-head {
  border: 1px solid rgba(98, 232, 255, .22);
  border-radius: 24px;
  background:
    radial-gradient(circle at 86% 8%, rgba(98, 232, 255, .16), transparent 18rem),
    linear-gradient(135deg, rgba(13, 45, 83, .96), rgba(8, 25, 52, .96));
  color: #f8fbff;
  box-shadow: var(--mnv-v241-shadow-dark);
}

body.mnv-future-ui:is(.page-practice_lab, .page-dekiru_route) :is(.practice-hero, .practice-unified-hero, .dekiru-flow-head) :is(h1, h2, h3, p, span, strong, small, a) {
  color: #f8fbff;
}

body.mnv-future-ui.page-dekiru_route .dekiru-progress {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  padding: 18px 20px;
  border: 1px solid rgba(113, 190, 239, .18);
  border-radius: 22px;
  background: rgba(5, 20, 43, .72);
}

body.mnv-future-ui.page-dekiru_route .dekiru-progress li {
  color: #a9c0d6;
}

body.mnv-future-ui.page-dekiru_route .dekiru-progress li > span {
  border-color: #527493;
  background: #0b2344;
  color: #b6cce0;
}

body.mnv-future-ui.page-dekiru_route .dekiru-progress li.is-current > span {
  border-color: var(--mnv-v241-cyan);
  background: #11396c;
  color: #fff;
  box-shadow: 0 0 0 6px rgba(98, 232, 255, .11), 0 0 26px rgba(57, 120, 255, .30);
}

body.mnv-future-ui.page-practice_lab .practice-unified-workspace {
  grid-template-columns: minmax(300px, .65fr) minmax(0, 1.35fr);
  gap: 18px;
}

body.mnv-future-ui.page-practice_lab :is(.practice-question, .practice-unified-learning, .practice-unified-answer, .practice-result-card, .practice-complete),
body.mnv-future-ui.page-dekiru_route :is(.dekiru-primary, .dekiru-focus-card, .dekiru-outcome-card, .diagnostic-question) {
  border: 1px solid rgba(113, 190, 239, .20);
  border-radius: 24px;
  background: linear-gradient(145deg, rgba(14, 40, 73, .95), rgba(8, 25, 51, .95));
  color: #f8fbff;
  box-shadow: 0 20px 52px rgba(0, 5, 22, .30);
}

body.mnv-future-ui:is(.page-practice_lab, .page-dekiru_route) :is(
  .practice-question,
  .practice-unified-learning,
  .practice-unified-answer,
  .practice-result-card,
  .practice-complete,
  .dekiru-primary,
  .dekiru-focus-card,
  .dekiru-outcome-card,
  .diagnostic-question
) :is(h1, h2, h3, strong, label, legend, span) {
  color: #f8fbff;
}

body.mnv-future-ui:is(.page-practice_lab, .page-dekiru_route) :is(
  .practice-question,
  .practice-unified-learning,
  .practice-unified-answer,
  .practice-result-card,
  .practice-complete,
  .dekiru-primary,
  .dekiru-focus-card,
  .dekiru-outcome-card,
  .diagnostic-question
) :is(p, small, .muted) {
  color: #adc2d6;
}

body.mnv-future-ui.page-practice_lab .practice-choice-card,
body.mnv-future-ui.page-practice_lab .practice-choice-grid label > span,
body.mnv-future-ui.page-dekiru_route .dekiru-choice > span {
  border: 1px solid rgba(123, 190, 234, .26);
  background: rgba(4, 18, 39, .68);
  color: #f8fbff;
}

body.mnv-future-ui.page-practice_lab .practice-choice-grid input:checked + span,
body.mnv-future-ui.page-dekiru_route .dekiru-choice input:checked + span {
  border-color: var(--mnv-v241-cyan);
  background: linear-gradient(135deg, rgba(57, 120, 255, .28), rgba(98, 232, 255, .10));
  box-shadow: 0 0 0 4px rgba(98, 232, 255, .10), 0 15px 36px rgba(11, 65, 143, .22);
}

/* The canvas-owned coordinate surfaces deliberately receive no size/transform rule. */
body.mnv-future-ui:is(.page-practice_lab, .page-dekiru_route) .handwriting-workspace {
  gap: 12px;
}

body.mnv-future-ui:is(.page-practice_lab, .page-dekiru_route) .handwriting-toolbar,
body.mnv-future-ui:is(.page-practice_lab, .page-dekiru_route) .handwriting-zoom-tools {
  border: 1px solid rgba(115, 188, 234, .22);
  border-radius: 14px;
  background: #0b2344;
  color: #f8fbff;
}

body.mnv-future-ui:is(.page-practice_lab, .page-dekiru_route) .handwriting-toolbar button,
body.mnv-future-ui:is(.page-practice_lab, .page-dekiru_route) .handwriting-zoom-tools button {
  border-color: rgba(132, 195, 236, .30);
  background: #12345c;
  color: #f8fbff;
}

body.mnv-future-ui:is(.page-practice_lab, .page-dekiru_route) .handwriting-toolbar button.is-active,
body.mnv-future-ui:is(.page-practice_lab, .page-dekiru_route) .handwriting-zoom-tools button.is-active {
  border-color: var(--mnv-v241-cyan);
  background: #245fae;
  box-shadow: 0 0 0 3px rgba(98, 232, 255, .13);
}

body.mnv-future-ui:is(.page-practice_lab, .page-dekiru_route) .handwriting-paper {
  border-color: #8eb7d5;
  background: #fff;
  color: #173757;
  box-shadow: inset 0 2px 13px rgba(16, 51, 86, .07), 0 16px 38px rgba(0, 5, 22, .24);
}

/* Paper/contract surfaces stay light so problem text never disappears. */
body.mnv-future-ui.page-practice_lab :is(
  .handwriting-problem-print,
  .practice-answer-contract > div,
  .practice-unified-mission article,
  .practice-answer-guide
) {
  border-color: #cbdcec;
  background: #f8fbff;
  color: #173757;
}

body.mnv-future-ui.page-practice_lab :is(
  .handwriting-problem-print,
  .practice-answer-contract > div,
  .practice-unified-mission article,
  .practice-answer-guide
) :is(h1, h2, h3, strong, label, legend, span, p, small, b, summary) {
  color: #173757;
}

body.mnv-future-ui.page-practice_lab .practice-answer-contract span,
body.mnv-future-ui.page-practice_lab .practice-unified-mission article > p {
  color: #51677d;
}

body.mnv-future-ui.page-practice_lab .practice-unified-mission article > span {
  color: #245fd4;
}

body.mnv-future-ui:is(.page-practice_lab, .page-dekiru_route) .handwriting-paper > span,
body.mnv-future-ui:is(.page-practice_lab, .page-dekiru_route) .handwriting-zoom-surface > span {
  color: #697f96;
}

body.mnv-future-ui.page-practice_lab .practice-processing-card,
body.mnv-future-ui.page-dekiru_route .practice-processing-card,
body.mnv-future-ui :is(.ai-wait-card, .page-loader-card) {
  border: 1px solid rgba(98, 232, 255, .30);
  border-radius: 26px;
  background:
    radial-gradient(circle at 50% 10%, rgba(98, 232, 255, .17), transparent 18rem),
    linear-gradient(145deg, #071a35, #0a2b52);
  color: #f8fbff;
  box-shadow: 0 30px 90px rgba(0, 4, 20, .52), 0 0 38px rgba(57, 120, 255, .14);
}

body.mnv-future-ui :is(.practice-processing-card, .ai-wait-card, .page-loader-card) :is(h1, h2, h3, p, span, strong, small) {
  color: #f8fbff;
}

/* ---------- Review / completion: refs 08 and 15 ---------- */

body.mnv-future-ui.page-dekiru_review .standard-review-hero-v1324,
body.mnv-future-ui.page-dekiru_review .standard-review-flow-head {
  border: 1px solid rgba(98, 232, 255, .25);
  border-radius: 24px;
  background:
    radial-gradient(circle at 85% 8%, rgba(98, 232, 255, .18), transparent 18rem),
    linear-gradient(135deg, #0b2d56, #111d43);
  color: #f8fbff;
  box-shadow: var(--mnv-v241-shadow-dark);
}

body.mnv-future-ui.page-dekiru_review :is(.standard-review-hero-v1324, .standard-review-flow-head) :is(h1, h2, h3, p, span, strong, small) {
  color: #f8fbff;
}

body.mnv-future-ui.page-dekiru_review :is(.standard-review-state-card, .standard-review-task-card, .standard-review-focus-v1324, .standard-review-future-v1324) {
  border: 1px solid rgba(113, 190, 239, .20);
  border-radius: 20px;
  background: linear-gradient(145deg, rgba(14, 40, 73, .94), rgba(8, 25, 51, .94));
  color: #f8fbff;
  box-shadow: 0 16px 42px rgba(0, 5, 22, .26);
}

body.mnv-future-ui.page-dekiru_review :is(.standard-review-state-card, .standard-review-task-card, .standard-review-focus-v1324, .standard-review-future-v1324) :is(h2, h3, strong, span) {
  color: #f8fbff;
}

body.mnv-future-ui.page-dekiru_review :is(.standard-review-state-card, .standard-review-task-card, .standard-review-focus-v1324, .standard-review-future-v1324) :is(p, small) {
  color: #adc2d6;
}

body.mnv-future-ui :is(.practice-complete, .standard-review-complete, .dekiru-outcome-card.success) {
  border-color: rgba(67, 220, 160, .35);
  background:
    radial-gradient(circle at 50% 0%, rgba(255, 196, 92, .20), transparent 18rem),
    linear-gradient(145deg, rgba(9, 66, 71, .97), rgba(8, 30, 57, .97));
  box-shadow: 0 0 0 1px rgba(67, 220, 160, .08), 0 24px 60px rgba(0, 10, 25, .32);
}

/* ---------- Diagnostic / assessment: refs 06, 07 and 15 ---------- */

body.mnv-future-ui.page-diagnostic .diagnostic-shell,
body.mnv-future-ui.page-assessment .assessment-shell {
  width: min(960px, 100%);
  max-width: 960px;
}

body.mnv-future-ui.page-diagnostic .diagnostic-head,
body.mnv-future-ui.page-assessment .assessment-head {
  padding: 20px 22px;
  border: 1px solid rgba(113, 190, 239, .18);
  border-radius: 22px;
  background:
    radial-gradient(circle at 90% 0%, rgba(98, 232, 255, .13), transparent 15rem),
    rgba(9, 31, 61, .84);
  box-shadow: 0 17px 45px rgba(0, 5, 22, .24);
}

body.mnv-future-ui:is(.page-diagnostic, .page-assessment) :is(.diagnostic-head, .assessment-head) :is(h1, p, strong, span, a) {
  color: #f8fbff;
}

body.mnv-future-ui.page-diagnostic .diagnostic-head > .chip.chip,
body.mnv-future-ui.page-assessment .assessment-head .chip.chip {
  border-color: #b6d3ea;
  background: #e8f3ff;
  color: #174f83;
}

body.mnv-future-ui.page-diagnostic .diagnostic-progress,
body.mnv-future-ui.page-assessment .assessment-progress > div {
  border: 1px solid rgba(113, 190, 239, .20);
  background: #07172e;
  box-shadow: inset 0 2px 5px rgba(0, 0, 0, .28);
}

body.mnv-future-ui.page-diagnostic .diagnostic-progress > span,
body.mnv-future-ui.page-assessment .assessment-progress > div > span {
  background: linear-gradient(90deg, var(--mnv-v241-blue), var(--mnv-v241-cyan), var(--mnv-v241-violet));
  box-shadow: 0 0 20px rgba(98, 232, 255, .35);
}

body.mnv-future-ui.page-diagnostic :is(.diagnostic-save-status, .diagnostic-key-help),
body.mnv-future-ui.page-assessment .assessment-progress > strong {
  color: #b9cde0;
}

body.mnv-future-ui.page-diagnostic .diagnostic-card,
body.mnv-future-ui.page-assessment .assessment-form {
  border: 1px solid rgba(98, 232, 255, .24);
  border-radius: 26px;
  background:
    radial-gradient(circle at 88% 6%, rgba(98, 232, 255, .13), transparent 17rem),
    linear-gradient(145deg, rgba(14, 40, 73, .97), rgba(8, 25, 51, .97));
  color: #f8fbff;
  box-shadow: 0 24px 65px rgba(0, 4, 20, .40);
}

body.mnv-future-ui:is(.page-diagnostic, .page-assessment) :is(.diagnostic-card, .assessment-form) :is(legend, h1, h2, h3, label, strong) {
  color: #f8fbff;
}

body.mnv-future-ui.page-diagnostic .diagnostic-option > span,
body.mnv-future-ui.page-assessment .assessment-options label > span {
  border-color: rgba(133, 194, 239, .29);
  background: rgba(4, 18, 39, .72);
  color: #eaf4fd;
  box-shadow: inset 0 1px rgba(255, 255, 255, .035);
}

body.mnv-future-ui.page-diagnostic .diagnostic-option input:checked + span,
body.mnv-future-ui.page-assessment .assessment-options input:checked + span,
body.mnv-future-ui:is(.page-diagnostic, .page-assessment) .mnv-v241-selected > span {
  border-color: var(--mnv-v241-cyan);
  background: linear-gradient(135deg, rgba(57, 120, 255, .35), rgba(98, 232, 255, .11));
  color: #fff;
  box-shadow: 0 0 0 4px rgba(98, 232, 255, .10), 0 14px 34px rgba(12, 67, 148, .25);
}

body.mnv-future-ui:is(.page-diagnostic, .page-assessment) :is(.diagnostic-option, .assessment-options label) input:focus-visible + span {
  outline: 3px solid rgba(98, 232, 255, .45);
  outline-offset: 3px;
}

body.mnv-future-ui.page-diagnostic_result .diagnostic-result-hero {
  border: 1px solid rgba(98, 232, 255, .25);
  background:
    radial-gradient(circle at 84% 10%, rgba(98, 232, 255, .20), transparent 18rem),
    linear-gradient(135deg, #0b2d56, #111d43);
  color: #f8fbff;
  box-shadow: var(--mnv-v241-shadow-dark);
}

body.mnv-future-ui.page-diagnostic .diagnostic-complete {
  border-color: rgba(67, 220, 160, .36);
  background:
    radial-gradient(circle at 50% 0%, rgba(255, 196, 92, .18), transparent 18rem),
    linear-gradient(145deg, rgba(9, 66, 71, .97), rgba(8, 30, 57, .97));
  color: #f8fbff;
  box-shadow: 0 24px 62px rgba(0, 10, 25, .34);
}

body.mnv-future-ui.page-diagnostic .diagnostic-complete :is(h1, h2, strong, span) {
  color: #f8fbff;
}

body.mnv-future-ui.page-diagnostic .diagnostic-complete :is(p, small, .muted) {
  color: #b8ccde;
}

body.mnv-future-ui.page-diagnostic .diagnostic-complete-icon {
  background: rgba(67, 220, 160, .18);
  color: #7aebbf;
  box-shadow: 0 0 0 7px rgba(67, 220, 160, .08), 0 0 30px rgba(67, 220, 160, .17);
}

body.mnv-future-ui.page-diagnostic_result .diagnostic-result-hero :is(h1, h2, p, span, strong, small) {
  color: #f8fbff;
}

body.mnv-future-ui.page-diagnostic_result .diagnostic-overall {
  border-color: rgba(98, 232, 255, .27);
  background: rgba(4, 18, 39, .58);
  color: #f8fbff;
  box-shadow: 0 18px 46px rgba(0, 5, 22, .30);
}

body.mnv-future-ui.page-diagnostic_result :is(
  .diagnostic-priority-section,
  .diagnostic-map-card,
  .diagnostic-basis-card,
  .diagnostic-plan-cta
) {
  border-color: rgba(113, 190, 239, .20);
  background: linear-gradient(145deg, rgba(14, 40, 73, .95), rgba(8, 25, 51, .95));
  color: #f8fbff;
  box-shadow: 0 18px 48px rgba(0, 5, 22, .27);
}

body.mnv-future-ui.page-diagnostic_result :is(
  .diagnostic-priority-section,
  .diagnostic-map-card,
  .diagnostic-basis-card,
  .diagnostic-plan-cta
) :is(h1, h2, h3, strong, li) {
  color: #f8fbff;
}

body.mnv-future-ui.page-diagnostic_result :is(
  .diagnostic-priority-section,
  .diagnostic-map-card,
  .diagnostic-basis-card,
  .diagnostic-plan-cta
) :is(p, small, .muted, .skill-meter-label) {
  color: #adc2d6;
}

body.mnv-future-ui.page-diagnostic_result .diagnostic-priority-card {
  border-color: rgba(119, 190, 235, .18);
  background: rgba(4, 18, 39, .54);
}

body.mnv-future-ui.page-diagnostic_result .skill-meter-track {
  background: #06172e;
}

body.mnv-future-ui.page-assessment :is(
  .assessment-result-block,
  .assessment-feedback-card,
  .assessment-feedback-example,
  .assessment-score-comparison,
  .assessment-score-cards > div,
  .assessment-rubric-detail,
  .assessment-retry-point,
  .assessment-ungraded-message,
  .assessment-feedback-notice
) {
  border-color: #c8daeb;
  background: #f7fbff;
  color: #183552;
}

body.mnv-future-ui.page-assessment :is(
  .assessment-result-block,
  .assessment-feedback-card,
  .assessment-feedback-example,
  .assessment-score-comparison,
  .assessment-score-cards > div,
  .assessment-rubric-detail,
  .assessment-retry-point,
  .assessment-ungraded-message,
  .assessment-feedback-notice
) :is(h1, h2, h3, p, li, span, strong, summary) {
  color: #183552;
}

body.mnv-future-ui.page-assessment .assessment-feedback-card.is-good {
  background: #effbf6;
}

body.mnv-future-ui.page-assessment .assessment-feedback-card.is-improve,
body.mnv-future-ui.page-assessment :is(.assessment-retry-point, .assessment-feedback-notice) {
  background: #fff8e8;
}

/* ---------- Learning records / family / child mobile: refs 08, 09 and 19 ---------- */

body.mnv-future-ui.page-learning_records .record-grid > div {
  min-height: 104px;
  border: 1px solid rgba(113, 190, 239, .20);
  border-radius: 18px;
  background: linear-gradient(145deg, rgba(15, 43, 78, .94), rgba(9, 27, 56, .94));
  box-shadow: 0 14px 36px rgba(0, 5, 22, .24);
}

body.mnv-future-ui.page-learning_records .record-grid > div span {
  color: #a9c0d6;
}

body.mnv-future-ui.page-learning_records .record-grid > div strong {
  color: #f8fbff;
}

body.mnv-future-ui.shell-family {
  background:
    radial-gradient(circle at 92% 4%, rgba(98, 232, 255, .22), transparent 25rem),
    linear-gradient(160deg, #f8fcff, #eaf6ff 55%, #f2edff);
  color: #102e4c;
}

body.mnv-future-ui.shell-family .family-hero {
  border-color: rgba(49, 124, 194, .22);
  background:
    radial-gradient(circle at 86% 18%, rgba(98, 232, 255, .25), transparent 18rem),
    linear-gradient(135deg, rgba(255, 255, 255, .97), rgba(229, 244, 255, .94));
  box-shadow: var(--mnv-v241-shadow-light);
}

body.mnv-future-ui.shell-family :is(.family-child-card, .family-add-child, .guardian-ring-card, .guardian-week-card, .guardian-plan-card, .guardian-activity-calendar, .guardian-skill-insights > div) {
  border-color: #c8dceb;
  background-color: rgba(255, 255, 255, .95);
  color: #173757;
  box-shadow: 0 16px 42px rgba(20, 70, 120, .10);
}

body.mnv-future-ui.shell-family :is(.family-child-card, .family-add-child, .guardian-ring-card, .guardian-week-card, .guardian-plan-card, .guardian-activity-calendar, .guardian-skill-insights > div) :is(h1, h2, h3, strong, label, b) {
  color: #173757;
}

body.mnv-future-ui.shell-family :is(.family-child-card, .family-add-child, .guardian-ring-card, .guardian-week-card, .guardian-plan-card, .guardian-activity-calendar, .guardian-skill-insights > div) :is(p, small, span, .muted) {
  color: #5b7087;
}

body.mnv-future-ui.shell-child .child-home-hero,
body.mnv-future-ui.shell-child .child-today-board {
  border-color: rgba(49, 124, 194, .22);
  background:
    radial-gradient(circle at 90% 4%, rgba(98, 232, 255, .20), transparent 18rem),
    linear-gradient(135deg, #fff, #eef8ff 58%, #f4efff);
  box-shadow: 0 18px 46px rgba(20, 70, 120, .11);
}

body.mnv-future-ui.shell-child .child-home-quick-nav > a,
body.mnv-future-ui.shell-child .child-today-task {
  border-color: #c8dceb;
  background: #fff;
  color: #173757;
  box-shadow: 0 12px 30px rgba(20, 70, 120, .09);
}

/* Pale semantic pills must keep dark copy inside dark cards. */
body.mnv-future-ui .status-chip.status-chip.status-chip {
  border-color: #bed5e8;
  background: #e8f4ff;
  color: #174e83;
}

body.mnv-future-ui .status-chip.status-chip.status-chip.done,
body.mnv-future-ui .status-chip.status-chip.status-chip.status-completed {
  border-color: #a6dec9;
  background: #e2f7ef;
  color: #126148;
}

body.mnv-future-ui .status-chip.status-chip.status-chip.watching,
body.mnv-future-ui .status-chip.status-chip.status-chip.status-in_progress {
  border-color: #b4cdf6;
  background: #e8f0ff;
  color: #174fb3;
}

body.mnv-future-ui .status-chip.status-chip.status-chip.todo {
  border-color: #ced8e3;
  background: #f2f5f8;
  color: #465a72;
}

body.mnv-future-ui .status-chip.status-chip.status-chip.missed {
  border-color: #efcf9f;
  background: #fff0dc;
  color: #8a4700;
}

body.mnv-future-ui .skill-status.skill-status.status-ready {
  background: #dff7ed;
  color: #0e644d;
}

body.mnv-future-ui .skill-status.skill-status.status-growing {
  background: #fff1c9;
  color: #714b00;
}

body.mnv-future-ui .skill-status.skill-status.status-starting {
  background: #e7efff;
  color: #174fb3;
}

body.mnv-future-ui .assessment-method-badge.assessment-method-badge.assessment-method-badge {
  background: #e8f3ff;
  color: #174f83;
}

body.mnv-future-ui .assessment-method-badge.assessment-method-badge.assessment-method-badge.is-rule {
  background: #e2f7ef;
  color: #126148;
}

body.mnv-future-ui .assessment-method-badge.assessment-method-badge.assessment-method-badge.is-ungraded {
  background: #eef1f4;
  color: #455364;
}

body.mnv-future-ui.page-study_plan .study-plan-day-card .task-type {
  border: 1px solid #bfd6ec;
  background: #edf6ff;
  color: #174f92;
}

body.mnv-future-ui.page-study_plan .study-plan-day-card .study-plan-phase,
body.mnv-future-ui.page-study_plan .study-plan-legend span {
  color: #173757;
}

body.mnv-future-ui.page-study_plan .study-plan-day.is-today .study-plan-day-card .study-plan-phase,
body.mnv-future-ui.page-study_plan .legend-today {
  background: #e7efff;
  color: #174fb3;
}

body.mnv-future-ui.page-study_plan .study-plan-day.is-completed .study-plan-day-card .study-plan-phase,
body.mnv-future-ui.page-study_plan .legend-completed {
  background: #e2f7ef;
  color: #126148;
}

body.mnv-future-ui.page-study_plan .study-plan-day.is-past .study-plan-day-card .study-plan-phase {
  background: #fff1ca;
  color: #714b00;
}

body.mnv-future-ui.page-study_plan .task-status.status-completed {
  color: #70e3b3;
}

body.mnv-future-ui.page-study_plan .task-status.status-in_progress {
  color: #8eb9ff;
}

body.mnv-future-ui.organization-app .org-status {
  background: #e8f1f8;
  color: #334f69;
}

body.mnv-future-ui.organization-app .org-status.is-good {
  background: #dcf5ed;
  color: #0b685b;
}

body.mnv-future-ui.organization-app .org-status.is-warn {
  background: #fff0d8;
  color: #7f4b00;
}

body.mnv-future-ui.shell-family .guardian-activity-calendar span.is-active {
  background: #d8f4e9;
  color: #08664f;
}

body.mnv-future-ui.shell-family .guardian-activity-calendar span.is-today {
  color: #173757;
  outline-color: #3978ff;
}

/* The login DOM has one card; a grid pseudo-panel supplies the visual split only. */
body.mnv-future-ui.page-login .auth-wrap.single {
  grid-template-columns: minmax(280px, .82fr) minmax(390px, 1.18fr);
  max-width: 1040px;
}

body.mnv-future-ui.page-login .auth-wrap.single::before {
  grid-column: 1;
  grid-row: 1;
  min-height: 620px;
  border-right: 1px solid rgba(113, 198, 244, .18);
  background:
    radial-gradient(circle at 50% 48%, transparent 0 72px, rgba(98, 232, 255, .26) 73px 75px, transparent 76px 112px, rgba(131, 103, 255, .19) 113px 115px, transparent 116px),
    linear-gradient(40deg, transparent 47%, rgba(98, 232, 255, .13) 48% 49%, transparent 50%),
    linear-gradient(-40deg, transparent 47%, rgba(131, 103, 255, .13) 48% 49%, transparent 50%),
    radial-gradient(circle at 50% 50%, rgba(98, 232, 255, .22), transparent 18rem),
    linear-gradient(145deg, #0b2b51, #101c42);
  content: "";
  pointer-events: none;
}

body.mnv-future-ui.page-login .auth-wrap.single .auth-card {
  grid-column: 2;
  grid-row: 1;
}

body.mnv-future-ui .mobile-tabbar {
  border: 1px solid rgba(113, 190, 239, .24);
  border-bottom: 0;
  background: rgba(5, 18, 39, .96);
  box-shadow: 0 -16px 42px rgba(0, 5, 22, .34);
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
}

body.mnv-future-ui .mobile-tabbar a {
  border: 1px solid transparent;
  color: #a9bfd4;
}

body.mnv-future-ui .mobile-tabbar a.is-active,
body.mnv-future-ui .mobile-tabbar a[aria-current="page"] {
  border-color: rgba(98, 232, 255, .25);
  background: linear-gradient(180deg, rgba(57, 120, 255, .24), rgba(98, 232, 255, .08));
  color: #fff;
  box-shadow: inset 0 3px var(--mnv-v241-cyan);
}

body.mnv-future-ui:is(.shell-child, .shell-public, .shell-family) .mobile-tabbar {
  border-color: #c5daeb;
  background: rgba(255, 255, 255, .97);
  box-shadow: 0 -12px 34px rgba(20, 70, 120, .13);
}

body.mnv-future-ui:is(.shell-child, .shell-public, .shell-family) .mobile-tabbar a {
  color: #5d7187;
}

body.mnv-future-ui:is(.shell-child, .shell-public, .shell-family) .mobile-tabbar a.is-active,
body.mnv-future-ui:is(.shell-child, .shell-public, .shell-family) .mobile-tabbar a[aria-current="page"] {
  border-color: #b8d2ef;
  background: #eaf3ff;
  color: #245bd6;
  box-shadow: inset 0 3px #3978ff;
}

/* ---------- Organization / admin: refs 10 and 18 ---------- */

body.mnv-future-ui.organization-app .org-shell {
  grid-template-columns: 264px minmax(0, 1fr);
  background:
    radial-gradient(circle at 95% 0%, rgba(57, 120, 255, .12), transparent 34rem),
    linear-gradient(145deg, #040c1c, #071832 55%, #091e3b);
}

body.mnv-future-ui.organization-app .org-sidebar {
  top: 0;
  min-height: 100dvh;
  border-width: 0 1px 0 0;
  border-radius: 0;
}

body.mnv-future-ui.organization-app .org-main {
  padding: clamp(22px, 3vw, 40px);
}

/* Data-heavy organization pages follow ref18: dark rail, bright work plane. */
body.mnv-future-ui.organization-app:not(.page-index) .org-main {
  background:
    radial-gradient(circle at 94% 0%, rgba(98, 232, 255, .16), transparent 24rem),
    linear-gradient(155deg, #f8fcff, #eaf4ff 64%, #f2edff);
  color: #173757;
}

body.mnv-future-ui.organization-app:not(.page-index) .org-page-head {
  border-color: #c7dceb;
  background: rgba(255, 255, 255, .92);
  box-shadow: 0 16px 42px rgba(20, 70, 120, .10);
}

body.mnv-future-ui.organization-app:not(.page-index) .org-page-head :is(h1, h2, p, span, strong) {
  color: #173757;
}

body.mnv-future-ui.organization-app:not(.page-index) :is(.org-card, .org-kpi) {
  border-color: #c8dceb;
  background: rgba(255, 255, 255, .96);
  color: #173757;
  box-shadow: 0 14px 38px rgba(20, 70, 120, .10);
}

body.mnv-future-ui.organization-app:not(.page-index) :is(.org-card, .org-kpi) :is(h1, h2, h3, strong, label) {
  color: #173757;
}

body.mnv-future-ui.organization-app:not(.page-index) :is(.org-card, .org-kpi) :is(p, small, .org-help, .muted) {
  color: #5d7187;
}

body.mnv-future-ui.organization-app:not(.page-index) :is(.org-card, .org-kpi) :is(input, textarea, select) {
  border-color: #a9c7de;
  background: #fff;
  color: #173757;
}

body.mnv-future-ui.organization-app:not(.page-index) .org-action {
  border-color: #c8dceb;
  background: #f8fbff;
  color: #173757;
}

body.mnv-future-ui.organization-app:not(.page-index) .org-action small {
  color: #5d7187;
}

body.mnv-future-ui.organization-app:not(.page-index) :is(.org-table-wrap, .org-table) {
  border-color: #bfd5e6;
  background: #fff;
  color: #173757;
}

body.mnv-future-ui.organization-app:not(.page-index) .org-table th {
  background: #eaf3fa;
  color: #405b73;
}

body.mnv-future-ui.organization-app:not(.page-index) .org-table td {
  border-color: #dce8f1;
  color: #173757;
}

body.mnv-future-ui.organization-app .org-page-head {
  padding: 22px 24px;
  border: 1px solid rgba(113, 190, 239, .18);
  border-radius: 22px;
  background: rgba(10, 31, 61, .77);
  box-shadow: 0 17px 45px rgba(0, 5, 22, .24);
}

body.mnv-future-ui.organization-app .org-page-head :is(h1, h2, p, span, strong) {
  color: #f8fbff;
}

body.mnv-future-ui.organization-app .org-page-head p {
  color: #aec3d7;
}

body.mnv-future-ui.organization-app .org-card,
body.mnv-future-ui.shell-admin .admin-card {
  border: 1px solid rgba(113, 190, 239, .19);
  border-radius: 21px;
  background: linear-gradient(145deg, rgba(14, 40, 73, .94), rgba(8, 25, 51, .94));
  color: #f8fbff;
  box-shadow: 0 17px 45px rgba(0, 5, 22, .25);
}

body.mnv-future-ui.organization-app .org-card :is(h1, h2, h3, strong, label, span),
body.mnv-future-ui.shell-admin .admin-card :is(h1, h2, h3, strong, label, span) {
  color: #f8fbff;
}

body.mnv-future-ui.organization-app .org-card :is(p, small, .org-help),
body.mnv-future-ui.shell-admin .admin-card :is(p, small, .muted) {
  color: #adc2d6;
}

body.mnv-future-ui.organization-app .org-action {
  border-color: rgba(113, 190, 239, .18);
  background: rgba(4, 18, 39, .52);
  color: #f8fbff;
}

body.mnv-future-ui.organization-app .org-action small {
  color: #a9c0d6;
}

body.mnv-future-ui.organization-app :is(.org-table-wrap, .org-table),
body.mnv-future-ui.shell-admin :is(.table-scroll, .data-table) {
  border-color: rgba(113, 190, 239, .20);
  background: #091d38;
  color: #f8fbff;
}

body.mnv-future-ui.organization-app .org-table th,
body.mnv-future-ui.shell-admin .data-table th {
  background: #0d2a50;
  color: #bcd0e3;
}

body.mnv-future-ui.organization-app .org-table td,
body.mnv-future-ui.shell-admin .data-table td {
  border-color: rgba(113, 190, 239, .13);
  color: #eaf3fc;
}

body.mnv-future-ui.shell-admin .admin-shell {
  grid-template-columns: 244px minmax(0, 1fr);
  gap: 20px;
}

body.mnv-future-ui.shell-admin .admin-topbar {
  border-bottom-color: rgba(113, 190, 239, .16);
  background: rgba(4, 15, 32, .94);
}

body.mnv-future-ui.shell-admin .kpi-row {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
}

body.mnv-future-ui.organization-app:not(.page-index) :is(.org-card, .org-kpi) span:not(.org-status) {
  color: #5d7187;
}

body.mnv-future-ui.organization-app .org-status.org-status.org-status {
  background: #e8f1f8;
  color: #334f69;
}

body.mnv-future-ui.organization-app .org-status.org-status.org-status.is-good {
  background: #dcf5ed;
  color: #0b685b;
}

body.mnv-future-ui.organization-app .org-status.org-status.org-status.is-warn {
  background: #fff0d8;
  color: #7f4b00;
}

/* ---------- Explicit semantic contrast ---------- */

body.mnv-future-ui.shell-public .alert.info,
body.mnv-future-ui.shell-reading .alert.info {
  border-color: #9ac7ec;
  background: #e7f4ff;
  color: #143e64;
}

body.mnv-future-ui.shell-public .alert.warning,
body.mnv-future-ui.shell-reading .alert.warning {
  border-color: #efc879;
  background: #fff5dd;
  color: #714a00;
}

body.mnv-future-ui.shell-public .alert.error,
body.mnv-future-ui.shell-reading .alert.error {
  border-color: #eaa4aa;
  background: #fff0f1;
  color: #792832;
}

body.mnv-future-ui.shell-public .alert.success,
body.mnv-future-ui.shell-reading .alert.success {
  border-color: #92d8be;
  background: #e9faf3;
  color: #125b46;
}

body.mnv-future-ui:is(.shell-auth, .shell-learner, .shell-immersive, .shell-admin) .alert.info,
body.mnv-future-ui.organization-app .alert.info {
  border-color: rgba(98, 184, 255, .36);
  background: #0c3158;
  color: #d9edff;
}

body.mnv-future-ui:is(.shell-auth, .shell-learner, .shell-immersive, .shell-admin) .alert.warning,
body.mnv-future-ui.organization-app .alert.warning {
  border-color: rgba(255, 196, 92, .40);
  background: #392b12;
  color: #ffe4ad;
}

body.mnv-future-ui:is(.shell-auth, .shell-learner, .shell-immersive, .shell-admin) .alert.error,
body.mnv-future-ui.organization-app .alert.error {
  border-color: rgba(255, 111, 135, .43);
  background: #3a1722;
  color: #ffc5cf;
}

body.mnv-future-ui:is(.shell-auth, .shell-learner, .shell-immersive, .shell-admin) .alert.success,
body.mnv-future-ui.organization-app .alert.success {
  border-color: rgba(67, 220, 160, .40);
  background: #0b382e;
  color: #baf3dd;
}

body.mnv-future-ui:is(.shell-auth, .shell-learner, .shell-immersive, .shell-admin) .alert :is(h1, h2, h3, p, span, strong, small, a),
body.mnv-future-ui.organization-app .alert :is(h1, h2, h3, p, span, strong, small, a) {
  color: inherit;
}

/* ---------- Laptop / zoom: structural break before the layout crushes ---------- */

@media (max-width: 1240px) {
  body.mnv-future-ui.page-index .koto-hero-inner {
    grid-template-columns: 1fr;
    width: min(900px, 100%);
  }

  body.mnv-future-ui.page-index .koto-hero-copy {
    max-width: 820px;
    margin-inline: auto;
    text-align: center;
  }

  body.mnv-future-ui.page-index .koto-hero h1,
  body.mnv-future-ui.page-index .koto-hero-promise {
    margin-inline: auto;
  }

  body.mnv-future-ui.page-index .koto-hero-actions,
  body.mnv-future-ui.page-index .koto-trust-row {
    justify-content: center;
  }

  body.mnv-future-ui.page-index .koto-hero-stage {
    width: min(900px, 100%);
    margin: 22px auto 0;
  }

  body.mnv-future-ui .future-utility-dock {
    right: 14px;
    bottom: 18px;
    top: auto;
    flex-direction: row;
  }

  body.mnv-future-ui.shell-learner .dash-layout {
    grid-template-columns: 220px minmax(0, 1fr);
  }

  body.mnv-future-ui.shell-learner .dash-side {
    grid-column: 2;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
  }

  body.mnv-future-ui.shell-admin .kpi-row {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 1180px) {
  body.mnv-future-ui:is(.page-route, .page-route_preview) .route-timeline {
    grid-template-columns: 1fr;
  }

  body.mnv-future-ui:is(.page-route, .page-route_preview) .video-card-main {
    grid-template-columns: minmax(260px, .82fr) minmax(0, 1.18fr);
  }
}

@media (max-width: 1024px) {
  body.mnv-future-ui.shell-learner .dash-layout,
  body.mnv-future-ui.shell-admin .admin-shell {
    grid-template-columns: 1fr;
  }

  body.mnv-future-ui.shell-learner .dash-side {
    grid-column: auto;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.mnv-future-ui.shell-admin .admin-sidebar {
    position: static;
  }

  body.mnv-future-ui.shell-admin .admin-sidebar a:not(.active):not([aria-current="page"]) {
    border-color: rgba(113, 190, 239, .20) !important;
    background: #0a2547 !important;
    color: #b6cce0 !important;
    text-shadow: none !important;
  }

  body.mnv-future-ui.shell-admin .admin-sidebar a:not(.active):not([aria-current="page"]) span,
  body.mnv-future-ui.shell-admin .admin-sidebar a:not(.active):not([aria-current="page"]) svg {
    color: #b6cce0 !important;
    -webkit-text-fill-color: #b6cce0 !important;
    stroke: currentColor !important;
  }

  body.mnv-future-ui.shell-admin .admin-sidebar a.active,
  body.mnv-future-ui.shell-admin .admin-sidebar a[aria-current="page"] {
    border-color: rgba(98, 232, 255, .35) !important;
    background: linear-gradient(90deg, #245bd6, #5e4bce) !important;
    color: #fff !important;
    box-shadow: inset 3px 0 var(--mnv-v241-cyan), 0 9px 24px rgba(22, 90, 179, .20) !important;
  }

  body.mnv-future-ui.shell-admin .admin-sidebar a:is(.active, [aria-current="page"]) :is(span, svg) {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    stroke: currentColor !important;
  }
}

@media (max-width: 980px) {
  body.mnv-future-ui.page-index .koto-cosmic-hero {
    padding-inline: 20px;
  }

  body.mnv-future-ui:is(.page-route, .page-route_preview) .route-timeline {
    grid-template-columns: 1fr;
  }

  body.mnv-future-ui:is(.page-route, .page-route_preview) .video-card-main {
    grid-template-columns: minmax(230px, .85fr) minmax(0, 1.15fr);
  }

  body.mnv-future-ui:is(.page-watch, .page-study_session) .page-grid,
  body.mnv-future-ui.page-study_session .study-session-layout,
  body.mnv-future-ui.page-practice_lab .practice-unified-workspace {
    grid-template-columns: 1fr;
  }

  body.mnv-future-ui:is(.page-watch, .page-study_session) .aside-col,
  body.mnv-future-ui.page-study_session .study-session-side {
    position: static;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.mnv-future-ui:is(.page-login, .page-register, .page-forgot_password, .page-reset_password) .auth-wrap {
    grid-template-columns: 1fr;
    max-width: 680px;
  }

  body.mnv-future-ui:is(.page-login, .page-register, .page-forgot_password, .page-reset_password) .auth-side {
    border-top: 1px solid rgba(113, 198, 244, .18);
    border-left: 0;
  }

  body.mnv-future-ui.page-login .auth-wrap.single {
    grid-template-columns: 1fr;
    max-width: 680px;
  }

  body.mnv-future-ui.page-login .auth-wrap.single::before {
    display: none;
  }

  body.mnv-future-ui.page-login .auth-wrap.single .auth-card {
    grid-column: 1;
    grid-row: 1;
  }

  body.mnv-future-ui.page-diagnostic_result .diagnostic-result-hero,
  body.mnv-future-ui.shell-family .family-hero,
  body.mnv-future-ui.shell-family .family-child-columns,
  body.mnv-future-ui.shell-family .guardian-progress-overview,
  body.mnv-future-ui.shell-family .guardian-progress-details {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  body.mnv-future-ui.page-index .koto-cosmic-hero {
    min-height: 0;
    padding: 40px 14px 64px;
  }

  body.mnv-future-ui.page-index .koto-hero-copy {
    text-align: left;
  }

  body.mnv-future-ui.page-index .koto-kicker {
    margin-bottom: 14px;
  }

  body.mnv-future-ui.page-index .koto-audience-scope {
    margin-bottom: 16px;
  }

  body.mnv-future-ui.page-index .koto-hero h1 {
    font-size: clamp(40px, 12.6vw, 60px);
    line-height: 1.12;
  }

  body.mnv-future-ui.page-index .koto-hero-actions,
  body.mnv-future-ui.page-index .koto-trust-row {
    justify-content: flex-start;
  }

  body.mnv-future-ui.page-index .koto-device {
    border-radius: 25px;
  }

  body.mnv-future-ui.page-index .koto-device-screen {
    min-height: 0;
    margin: 7px;
    border-radius: 19px;
  }

  body.mnv-future-ui.page-index .koto-device-content {
    padding: 15px;
  }

  body.mnv-future-ui.page-index .koto-example-chips {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.mnv-future-ui.page-index .koto-search-bottom {
    grid-template-columns: 1fr;
  }

  body.mnv-future-ui.page-index .cosmic-preview-cards {
    grid-template-columns: 1fr;
  }

  body.mnv-future-ui.shell-learner main.container,
  body.mnv-future-ui.shell-immersive main.container {
    width: min(100% - 20px, 720px);
  }

  body.mnv-future-ui.shell-learner .dash-layout,
  body.mnv-future-ui.shell-admin .admin-shell {
    grid-template-columns: 1fr;
  }

  body.mnv-future-ui.shell-learner .dash-side,
  body.mnv-future-ui:is(.page-watch, .page-study_session) .aside-col,
  body.mnv-future-ui.page-study_session .study-session-side {
    grid-column: auto;
    grid-template-columns: 1fr;
  }

  body.mnv-future-ui.shell-learner .stat-cards,
  body.mnv-future-ui.shell-admin .kpi-row,
  body.mnv-future-ui.organization-app .org-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.mnv-future-ui:is(.page-route, .page-route_preview) .video-card-main {
    grid-template-columns: 1fr;
  }

  body.mnv-future-ui.organization-app .org-sidebar {
    min-height: 0;
    height: auto;
  }

  body.mnv-future-ui main.shell-container {
    padding-bottom: max(118px, calc(96px + env(safe-area-inset-bottom)));
  }

  body.mnv-future-ui.has-mobile-tabbar main.shell-container {
    padding-bottom: max(164px, calc(142px + env(safe-area-inset-bottom)));
  }

  body.mnv-future-ui.page-dekiru_route .dekiru-progress {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x proximity;
  }

  body.mnv-future-ui.page-dekiru_route .dekiru-progress li {
    flex: 0 0 96px;
    scroll-snap-align: start;
  }

  body.mnv-future-ui:is(.page-favorites, .page-watch_history, .page-feedback_history) .history-item {
    grid-template-columns: 112px minmax(0, 1fr);
  }

  body.mnv-future-ui:is(.page-favorites, .page-watch_history, .page-feedback_history) .history-actions {
    grid-column: 1 / -1;
  }

  body.mnv-future-ui .future-utility-dock {
    right: max(10px, env(safe-area-inset-right));
    bottom: calc(78px + env(safe-area-inset-bottom));
  }
}

@media (max-width: 480px) {
  body.mnv-future-ui.page-index .koto-example-chips {
    grid-template-columns: 1fr;
  }

  body.mnv-future-ui.page-index .koto-time-pills {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  body.mnv-future-ui.shell-learner .stat-cards,
  body.mnv-future-ui.shell-admin .kpi-row,
  body.mnv-future-ui.organization-app .org-kpis {
    grid-template-columns: 1fr;
  }

  body.mnv-future-ui.page-study_plan .study-plan-day {
    grid-template-columns: 54px minmax(0, 1fr);
    gap: 10px;
  }

  body.mnv-future-ui.page-study_plan .study-plan-marker {
    width: 52px;
    height: 52px;
  }

  body.mnv-future-ui.page-study_plan .study-plan-day:not(:last-child)::before {
    left: 25px;
  }
}

@media (forced-colors: active) {
  body.mnv-future-ui :is(.koto-device, .auth-wrap, .dash-greet, .stat-card, .video-card, .player-card, .admin-card, .org-card) {
    border: 2px solid CanvasText;
    background: Canvas;
    color: CanvasText;
    box-shadow: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.mnv-future-ui *,
  body.mnv-future-ui *::before,
  body.mnv-future-ui *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
  }
}

/*
 * Legacy V101 shipped an all-!important cinematic homepage.  This narrowly
 * scoped block is intentionally last and is the only place V241 uses the same
 * priority.  Without it, the old dark mini-console survives underneath the new
 * bright layer and produces the washed-out hybrid seen in the supplied screen.
 */
body.mnv-future-ui.public-app.shell-public.page-index {
  background: #f8fcff !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .site-header {
  border-bottom-color: rgba(56, 119, 178, .19) !important;
  background: rgba(249, 252, 255, .96) !important;
  box-shadow: 0 10px 34px rgba(11, 47, 87, .08) !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .site-header :is(.brand-text strong, .site-nav a, .nav-actions a, .nav-link, button) {
  color: #102f4e !important;
  text-shadow: none !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .container {
  background: #f8fcff !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero {
  min-height: 900px !important;
  padding: clamp(64px, 6.5vw, 108px) clamp(22px, 4vw, 64px) 96px !important;
  background-color: #dff3ff !important;
  background-image:
    radial-gradient(circle at 83% 8%, rgba(255, 255, 255, .80) 0 5%, transparent 31%),
    radial-gradient(circle at 73% 30%, rgba(98, 232, 255, .36), transparent 26rem),
    radial-gradient(circle at 8% 18%, rgba(131, 103, 255, .16), transparent 29rem),
    linear-gradient(142deg, #eaf8ff 0%, #bfe8ff 43%, #e9e5ff 100%) !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero::before {
  inset: auto -10vw auto auto !important;
  top: -9rem !important;
  width: min(56vw, 820px) !important;
  height: min(42vw, 570px) !important;
  border: 1px solid rgba(255, 255, 255, .76) !important;
  border-radius: 46% 54% 61% 39% / 47% 44% 56% 53% !important;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .68), rgba(98, 232, 255, .06)),
    repeating-radial-gradient(circle at 55% 48%, transparent 0 31px, rgba(57, 120, 255, .08) 32px 33px) !important;
  filter: none !important;
  transform: rotate(-8deg) !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero::after {
  display: block !important;
  inset: 0 !important;
  width: auto !important;
  height: auto !important;
  border-radius: 0 !important;
  background:
    linear-gradient(115deg, transparent 28%, rgba(255, 255, 255, .45) 47%, transparent 64%),
    radial-gradient(circle, rgba(22, 99, 181, .19) 0 1px, transparent 1.7px) !important;
  background-size: auto, 72px 72px !important;
  opacity: .45 !important;
  transform: none !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-hero-inner {
  display: grid !important;
  grid-template-columns: minmax(0, .84fr) minmax(0, 1.16fr) !important;
  grid-template-areas: "copy stage" !important;
  gap: clamp(34px, 4vw, 72px) !important;
  align-items: center !important;
  width: min(var(--mnv-v241-max), 100%) !important;
  margin: 0 auto !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-hero-copy {
  grid-area: copy !important;
  padding: clamp(8px, 1vw, 18px) 0 !important;
  text-align: left !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-kicker {
  margin-bottom: 18px !important;
  padding: 8px 13px !important;
  border: 1px solid rgba(19, 85, 149, .22) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, .90) !important;
  color: #113a61 !important;
  box-shadow: 0 12px 32px rgba(19, 78, 137, .11) !important;
  text-shadow: none !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-kicker b {
  color: #235fd5 !important;
  text-shadow: none !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-audience-scope {
  margin: 0 0 22px !important;
  padding: 14px 16px !important;
  border: 1px solid rgba(39, 111, 177, .22) !important;
  border-radius: 18px !important;
  background: rgba(255, 255, 255, .90) !important;
  color: #173e61 !important;
  box-shadow: 0 16px 40px rgba(29, 83, 139, .10) !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-audience-scope :is(strong, li) {
  color: #173e61 !important;
  text-shadow: none !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-audience-scope li {
  border-color: #c6dff3 !important;
  background: #f7fbff !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-hero-stage {
  position: relative !important;
  display: grid !important;
  grid-area: stage !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 24px !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 12px 0 0 !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero h1 {
  max-width: 700px !important;
  margin: 0 !important;
  color: #061f3b !important;
  font-family: inherit !important;
  font-size: clamp(48px, 5.2vw, 78px) !important;
  font-weight: 900 !important;
  line-height: 1.10 !important;
  letter-spacing: -.052em !important;
  text-shadow: none !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero h1 em,
body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero h1 strong {
  color: inherit !important;
  -webkit-text-fill-color: currentColor !important;
  text-shadow: none !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-hero-bridge {
  display: grid !important;
  grid-template-columns: minmax(22px, .55fr) auto minmax(22px, .55fr) !important;
  align-items: center !important;
  gap: 10px !important;
  max-width: 440px !important;
  margin: .28em 0 .18em !important;
  color: #224d74 !important;
  font-size: clamp(12px, .92vw, 15px) !important;
  font-weight: 850 !important;
  letter-spacing: .02em !important;
  opacity: 1 !important;
  transform: none !important;
  animation: none !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-hero-bridge::before,
body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-hero-bridge::after {
  display: block !important;
  height: 2px !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, rgba(38, 117, 187, .12), #5dbed7) !important;
  content: "" !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-hero-bridge::after {
  background: linear-gradient(90deg, #5dbed7, #ff8a3d) !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-hero-bridge > span {
  display: inline-flex !important;
  min-height: 32px !important;
  align-items: center !important;
  padding: 6px 12px !important;
  border: 1px solid #a9cde7 !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, .82) !important;
  color: #224d74 !important;
  -webkit-text-fill-color: #224d74 !important;
  box-shadow: 0 9px 25px rgba(22, 76, 125, .10) !important;
  white-space: nowrap !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-solution-band {
  position: relative !important;
  display: block !important;
  width: auto !important;
  max-width: 700px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: none !important;
  color: #061f3b !important;
  box-shadow: none !important;
  opacity: 1 !important;
  transform: none !important;
  animation: none !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-solution-band::before,
body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-solution-band::after,
body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-solution-band .koto-route-convergence {
  display: none !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-hero-solution,
body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-hero-solution em {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
  color: #061f3b !important;
  -webkit-text-fill-color: #061f3b !important;
  box-shadow: none !important;
  text-shadow: none !important;
  animation: none !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-hero-solution strong {
  display: inline !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: linear-gradient(110deg, #1460df 0%, #684be2 57%, #c948c8 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
  box-shadow: none !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-hero-copy > p {
  max-width: 620px !important;
  margin: 24px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #294d6e !important;
  font-size: clamp(16px, 1.35vw, 19px) !important;
  font-weight: 650 !important;
  line-height: 1.85 !important;
  letter-spacing: 0 !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-hero-copy > p::first-line {
  color: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-hero-actions {
  display: flex !important;
  justify-content: flex-start !important;
  margin-top: 28px !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-hero-actions .button.primary {
  border-color: #ee762b !important;
  background: linear-gradient(135deg, #ff9c4b, #ff7531) !important;
  color: #14223b !important;
  text-shadow: none !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-trust-row {
  display: flex !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  margin-top: 20px !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-trust-row span {
  border-color: rgba(50, 112, 174, .19) !important;
  background: rgba(255, 255, 255, .78) !important;
  color: #345b7b !important;
  text-shadow: none !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-device {
  grid-area: auto !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 1px !important;
  overflow: visible !important;
  border: 1px solid rgba(68, 144, 210, .34) !important;
  border-radius: 34px !important;
  background: linear-gradient(135deg, rgba(255, 255, 255, .98), rgba(170, 224, 255, .88), rgba(191, 178, 255, .76)) !important;
  box-shadow: 0 40px 100px rgba(18, 75, 134, .25), 0 0 0 7px rgba(255, 255, 255, .30) !important;
  transform: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-device-camera {
  display: block !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-device-screen {
  min-height: 630px !important;
  margin: 10px !important;
  border-radius: 24px !important;
  background:
    radial-gradient(circle at 82% 4%, rgba(98, 232, 255, .16), transparent 19rem),
    linear-gradient(180deg, #fbfdff, #f1f8ff) !important;
  color: #102d4b !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-appbar {
  display: flex !important;
  min-height: 68px !important;
  padding: 0 22px !important;
  border-bottom-color: #d2e4f2 !important;
  background: rgba(255, 255, 255, .92) !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-appbar :is(a, strong, span) {
  color: #173958 !important;
  text-shadow: none !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-appbar nav .is-active {
  background: #e8f2ff !important;
  color: #2362d7 !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-device-content {
  padding: clamp(22px, 2.5vw, 32px) !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-device-welcome :is(span, h2),
body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-search-form :is(label, legend, summary),
body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-plan-options label {
  color: #173a5c !important;
  text-shadow: none !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-device-welcome h2 {
  font-size: clamp(24px, 2.3vw, 34px) !important;
  line-height: 1.28 !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-device-welcome span,
body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-search-form > label,
body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-time-field legend {
  font-size: 12.5px !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .status-badge.status-info {
  border-color: #a8ddcd !important;
  background: #ebfaf4 !important;
  color: #12664e !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .first-visit-guide {
  border: 1px solid #a9dacc !important;
  background: #edfaf5 !important;
  color: #143f37 !important;
  box-shadow: none !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .first-visit-guide :is(span, strong, small, button) {
  color: #143f37 !important;
  text-shadow: none !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .first-guide-copy > span {
  font-size: 11px !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .first-guide-copy > strong {
  font-size: 13.5px !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .first-guide-copy > small {
  font-size: 11px !important;
  line-height: 1.5 !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-search-form {
  gap: 15px !important;
  padding: clamp(18px, 2vw, 26px) !important;
  border: 1px solid #a8ccea !important;
  border-radius: 24px !important;
  background: rgba(255, 255, 255, .97) !important;
  box-shadow: 0 22px 58px rgba(31, 84, 139, .14), inset 0 1px #fff !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-input-shell textarea {
  min-height: 132px !important;
  padding: 15px 15px 30px !important;
  border: 2px solid #89bce4 !important;
  border-radius: 16px !important;
  background: #fff !important;
  color: #0f2f4f !important;
  font-size: 16px !important;
  box-shadow: inset 0 2px 7px rgba(20, 63, 105, .05), 0 0 0 5px rgba(57, 120, 255, .045) !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-input-shell textarea::placeholder {
  color: #66809b !important;
  opacity: 1 !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .char-counter {
  color: #57728d !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-guided-keywords {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 9px !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-guided-keywords > button {
  min-height: 64px !important;
  padding: 9px 10px !important;
  border: 1px solid #b6cee5 !important;
  border-radius: 14px !important;
  background: #fff !important;
  color: #173b5e !important;
  box-shadow: 0 9px 20px rgba(22, 70, 119, .09) !important;
  transform: none !important;
  animation: none !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-guided-keywords > button :is(span, b, small) {
  color: #173b5e !important;
  text-shadow: none !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-guided-keywords > button > span {
  border-color: #8ebaf1 !important;
  background: #edf4ff !important;
  color: #2f68d8 !important;
  font-size: 10px !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-guided-keywords > button > b {
  font-size: 13px !important;
  line-height: 1.3 !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-guided-keywords > button > small {
  font-size: 10.5px !important;
  line-height: 1.35 !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-guided-keywords > button:hover,
body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-guided-keywords > button.is-selected,
body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-guided-keywords > button.is-guide-preview,
body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-guided-keywords > button.is-guide-active {
  border-color: #3978ff !important;
  background: #edf4ff !important;
  color: #174aa7 !important;
  box-shadow: 0 0 0 3px rgba(57, 120, 255, .12), 0 12px 26px rgba(35, 91, 172, .13) !important;
  filter: none !important;
  transform: translateY(-2px) !important;
  animation: none !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-time-pills span {
  min-height: 38px !important;
  border-color: #a9c6df !important;
  background: #fff !important;
  color: #294e70 !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-time-pills input:checked + span {
  border-color: #3978ff !important;
  background: #eaf2ff !important;
  color: #174aa7 !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-search-submit {
  min-height: 54px !important;
  border: 1px solid #2e66e5 !important;
  border-radius: 15px !important;
  background: linear-gradient(135deg, #245bd6, #6740c6 58%, #8b35b5) !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  box-shadow: 0 16px 36px rgba(66, 82, 216, .29) !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-plan-options {
  display: block !important;
  border: 1px solid #d0e0ee !important;
  background: #f4f9fd !important;
  color: #173a5c !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .cosmic-live-showcase {
  grid-area: auto !important;
  display: grid !important;
  gap: 16px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: clamp(20px, 2.2vw, 30px) !important;
  border: 1px solid rgba(98, 232, 255, .22) !important;
  border-radius: 28px !important;
  background:
    radial-gradient(circle at 86% 12%, rgba(98, 232, 255, .16), transparent 18rem),
    radial-gradient(circle at 6% 90%, rgba(131, 103, 255, .16), transparent 18rem),
    linear-gradient(145deg, #06142b, #0b2850) !important;
  box-shadow: 0 25px 65px rgba(4, 18, 44, .32) !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .cosmic-preview-cards {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
  padding: 0 !important;
  overflow: visible !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .cosmic-preview-cards article {
  min-height: 138px !important;
  padding: 16px !important;
  border: 1px solid rgba(121, 197, 245, .20) !important;
  border-radius: 17px !important;
  background: rgba(10, 33, 65, .82) !important;
  box-shadow: 0 14px 32px rgba(0, 4, 20, .24) !important;
  transform: none !important;
  animation: none !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .cosmic-preview-cards article > span,
body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .cosmic-preview-cards article > b {
  font-size: 10px !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .cosmic-preview-cards article > strong {
  font-size: 14px !important;
  line-height: 1.45 !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .cosmic-preview-cards article > small,
body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .cosmic-journey small,
body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .cosmic-showcase-title > small {
  font-size: 10.5px !important;
  line-height: 1.45 !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .cosmic-journey strong {
  font-size: 12px !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .cosmic-demo-player {
  grid-template-columns: 132px minmax(0, 1fr) !important;
  min-height: 270px !important;
  margin: 0 !important;
  padding: 10px !important;
  border: 1px solid rgba(130, 119, 255, .46) !important;
  border-radius: 20px !important;
  background: linear-gradient(135deg, rgba(7, 28, 70, .96), rgba(34, 17, 72, .92)) !important;
  box-shadow: 0 18px 45px rgba(0, 3, 23, .40) !important;
  transform: none !important;
  animation: none !important;
}

body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .cosmic-demo-player video {
  min-height: 248px !important;
  border-radius: 13px !important;
  object-fit: cover !important;
}

@media (max-width: 1240px) {
  body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-hero-inner {
    grid-template-columns: 1fr !important;
    grid-template-areas: "copy" "stage" !important;
    width: min(900px, 100%) !important;
    gap: 28px !important;
  }

  body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-hero-copy {
    max-width: 820px !important;
    margin-inline: auto !important;
    text-align: center !important;
  }

  body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero h1,
  body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-hero-copy > p {
    margin-inline: auto !important;
  }

  body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-hero-bridge {
    margin-inline: auto !important;
  }

  body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-hero-actions,
  body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-trust-row {
    justify-content: center !important;
  }

  body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-hero-stage {
    width: min(900px, 100%) !important;
    margin: 0 auto !important;
  }
}

@media (max-width: 760px) {
  body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero {
    min-height: 0 !important;
    padding: 40px 14px 64px !important;
    background-image:
      radial-gradient(circle at 80% 4%, rgba(255, 255, 255, .72), transparent 19rem),
      radial-gradient(circle at 4% 18%, rgba(131, 103, 255, .14), transparent 20rem),
      linear-gradient(155deg, #eaf8ff, #c8ecff 56%, #eee7ff) !important;
    background-position: center !important;
  }

  body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-hero-copy {
    text-align: left !important;
  }

  body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero h1 {
    font-size: clamp(40px, 12.6vw, 60px) !important;
    line-height: 1.12 !important;
  }

  body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-hero-bridge {
    margin-inline: 0 !important;
  }

  body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-hero-actions {
    display: grid !important;
    justify-content: stretch !important;
  }

  body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-trust-row {
    display: flex !important;
    justify-content: flex-start !important;
  }

  body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-appbar {
    display: flex !important;
  }

  body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-guided-keywords {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .cosmic-preview-cards {
    grid-template-columns: repeat(3, minmax(210px, 1fr)) !important;
    overflow-x: auto !important;
    scroll-snap-type: x mandatory !important;
  }

  body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .cosmic-demo-player {
    grid-template-columns: 1fr !important;
    min-height: 0 !important;
  }

  body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .cosmic-demo-player video {
    min-height: 0 !important;
    aspect-ratio: 16 / 9 !important;
  }
}

@media (forced-colors: active) {
  body.mnv-future-ui.public-app.shell-public.page-index .koto-cosmic-hero .koto-hero-solution strong {
    border-color: CanvasText !important;
    background: none !important;
    color: CanvasText !important;
    -webkit-text-fill-color: CanvasText !important;
    forced-color-adjust: auto !important;
  }
}