@font-face{font-family:"Be Vietnam Pro";src:url("/tra-cuu-fonts/be-vietnam-pro-400-vietnamese.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Be Vietnam Pro";src:url("/tra-cuu-fonts/be-vietnam-pro-600-vietnamese.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Bricolage Grotesque";src:url("/tra-cuu-fonts/bricolage-grotesque-500-600-vietnamese.woff2") format("woff2");font-weight:500 600;font-style:normal;font-display:swap}

:root{color-scheme:dark;--bg:#07101b;--bg-2:#0a1928;--paper:#f4efe5;--ink:#eef5f8;--muted:#a9b8c5;--line:rgba(214,234,246,.24);--glass:rgba(7,21,36,.48);--glass-strong:rgba(7,21,36,.72);--gold:#efc67e;--coral:#d8654d;--mint:#8ccbb9;--sky:#86bcd8;--shadow:0 24px 60px rgba(1,7,15,.3);--radius:22px;--serif:"Iowan Old Style","Palatino Linotype","Book Antiqua",Palatino,"Noto Serif JP",serif;--sans:"Be Vietnam Pro",system-ui,sans-serif;--display:"Bricolage Grotesque","Be Vietnam Pro",sans-serif}
html[data-theme="light"]{color-scheme:light;--bg:#eee5d7;--bg-2:#f6f1e9;--paper:#102335;--ink:#102335;--muted:#4d6070;--line:rgba(20,54,76,.22);--glass:rgba(249,246,237,.54);--glass-strong:rgba(249,246,237,.78);--shadow:0 24px 60px rgba(30,47,58,.16)}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--bg)}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.6;text-rendering:optimizeLegibility}
body.is-menu-open{overflow:hidden}
a{color:inherit;text-decoration:none}
button,input,textarea,select{font:inherit}
button{color:inherit}
.skip-link{position:fixed;left:16px;top:12px;z-index:200;transform:translateY(-140%);padding:12px 16px;background:#fff;color:#091421;border-radius:10px;font-weight:600}
.skip-link:focus{transform:none}
:focus-visible{outline:3px solid #ffd18b;outline-offset:4px}

.site-header{position:fixed;inset:0 0 auto;z-index:100;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:32px;padding:18px clamp(18px,4vw,64px);pointer-events:none}
.site-header>*{pointer-events:auto}
.brand,.theme-toggle,.menu-trigger{border:1px solid rgba(228,244,252,.3);background:linear-gradient(135deg,rgba(255,255,255,.12),rgba(255,255,255,.025)),rgba(4,16,30,.24);box-shadow:inset 0 1px rgba(255,255,255,.2),0 12px 28px rgba(0,8,18,.14);-webkit-backdrop-filter:blur(16px) saturate(145%);backdrop-filter:blur(16px) saturate(145%)}
.brand{display:flex;width:max-content;align-items:center;gap:11px;padding:6px 14px 6px 6px;border-radius:16px}
.brand__seal{display:grid;place-items:center;width:48px;height:48px;border:1px solid rgba(255,224,190,.6);background:linear-gradient(145deg,#c34d35,#8f3029);color:#fff4dc;font-family:var(--serif);font-size:18px;line-height:1.03;text-align:center;box-shadow:inset 0 0 0 3px rgba(255,225,193,.16)}
.brand__copy{display:grid;line-height:1}
.brand__copy b{font-family:var(--serif);font-size:25px;font-weight:600;color:#fffaf0}
.brand__copy small{margin-top:7px;color:rgba(235,244,249,.76);font-size:8px;font-weight:600;letter-spacing:.2em;text-transform:uppercase}
.desktop-nav{justify-self:center;display:flex;gap:8px;padding:6px;border:1px solid rgba(228,244,252,.18);border-radius:15px;background:rgba(5,17,30,.14);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.desktop-nav a{min-height:44px;padding:10px 15px;border-radius:10px;color:rgba(245,250,252,.86);font-size:14px;font-weight:600}
.desktop-nav a:hover{background:rgba(255,255,255,.09);color:#fff}
.header-actions{display:flex;gap:10px}
.theme-toggle,.menu-trigger{min-height:48px;border-radius:15px;cursor:pointer}
.theme-toggle{width:48px;font-size:21px}
.menu-trigger{display:flex;align-items:center;gap:14px;padding:0 16px;font-weight:600}
.menu-trigger i{position:relative;width:25px;height:10px;border-top:2px solid currentColor;border-bottom:2px solid currentColor}

.hero{position:relative;isolation:isolate;display:grid;min-height:100svh;min-height:100dvh;align-items:end;overflow:hidden;padding:clamp(130px,19vh,190px) clamp(20px,6vw,92px) clamp(146px,18vh,180px)}
.hero__scene,.hero__veil{position:absolute;inset:0;z-index:-2}
.hero__scene{background:#0b1722 var(--hub-scene,url("/anh-art/p/jlpt-hub-n5-v23.jpg")) center/cover no-repeat;transform:scale(1.01)}
.hero__scene::before{position:absolute;inset:0;background:linear-gradient(90deg,rgba(2,9,18,.94) 0%,rgba(2,9,18,.68) 31%,rgba(2,9,18,.18) 62%,rgba(2,9,18,.32) 100%);content:""}
.hero__scene::after{position:absolute;inset:0;background:radial-gradient(circle at 72% 40%,rgba(239,198,126,.2),transparent 24%),linear-gradient(180deg,rgba(2,8,15,.06),transparent 56%,rgba(2,8,15,.78));content:""}
.hero__veil{z-index:-1;background:linear-gradient(180deg,rgba(2,8,15,.2),transparent 30%),linear-gradient(0deg,var(--bg),transparent 18%)}
.hero__content{max-width:660px}
.hero__level{display:flex;align-items:center;gap:14px;margin:0 0 20px;color:var(--gold);font-size:12px;font-weight:600;letter-spacing:.15em;text-transform:uppercase}
.hero__level span{opacity:.78}
.hero__level b{display:grid;place-items:center;min-width:52px;min-height:34px;border:1px solid rgba(239,198,126,.48);border-radius:999px;background:rgba(7,18,31,.25);font-size:14px;letter-spacing:.05em}
.hero h1{max-width:630px;margin:0;color:#fff8e9;font-family:var(--serif);font-size:clamp(62px,8.4vw,126px);font-weight:500;letter-spacing:-.055em;line-height:.78;text-shadow:0 3px 18px rgba(0,0,0,.74),0 0 24px rgba(241,198,126,.18)}
.hero h1 span,.hero h1 em{display:block}
.hero h1 em{margin:.22em 0 0 .5em;color:#efcda1;font-size:.65em;font-weight:400}
.hero__lead{max-width:480px;margin:30px 0 32px;color:rgba(237,245,249,.8);font-size:17px}
.primary-action{display:flex;width:min(360px,100%);min-height:82px;align-items:center;justify-content:space-between;padding:16px 18px 16px 22px;border:1px solid rgba(255,224,184,.55);border-radius:17px;background:linear-gradient(125deg,rgba(196,70,48,.7),rgba(109,37,52,.48));box-shadow:inset 0 1px rgba(255,255,255,.3),0 18px 40px rgba(0,0,0,.28);-webkit-backdrop-filter:blur(14px) saturate(145%);backdrop-filter:blur(14px) saturate(145%);transition:transform .25s ease,box-shadow .25s ease}
.primary-action:hover{transform:translateY(-2px);box-shadow:inset 0 1px rgba(255,255,255,.36),0 23px 48px rgba(0,0,0,.34)}
.primary-action span{display:grid;line-height:1.2}
.primary-action small{color:rgba(255,244,229,.72);font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase}
.primary-action b{margin-top:7px;color:#fff;font-family:var(--display);font-size:22px;font-weight:600}
.primary-action i{display:grid;place-items:center;width:45px;height:45px;border:1px solid rgba(255,255,255,.28);border-radius:50%;font-style:normal}
.level-rail{position:absolute;right:clamp(20px,4vw,60px);bottom:clamp(26px,5vh,48px);left:clamp(20px,6vw,92px);display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid rgba(225,239,247,.28);background:linear-gradient(90deg,rgba(4,14,25,.52),rgba(4,14,25,.13));-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.level-rail a{position:relative;display:flex;min-height:84px;align-items:center;gap:10px;padding:18px 16px;color:rgba(228,238,244,.58)}
.level-rail a::before{position:absolute;top:-1px;left:0;width:0;height:2px;background:linear-gradient(90deg,var(--gold),var(--coral));content:"";transition:width .3s ease}
.level-rail a:hover,.level-rail a.is-current{color:#fff}
.level-rail a:hover::before,.level-rail a.is-current::before{width:100%}
.level-rail span{font-family:var(--display);font-size:21px;font-weight:600}
.level-rail small{font-size:11px}

.foundation,.library{padding:clamp(88px,12vw,170px) clamp(20px,6vw,92px)}
.section-heading{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(260px,.5fr);gap:40px;align-items:end;margin-bottom:clamp(48px,7vw,86px)}
.section-heading h2{margin:0;font-family:var(--serif);font-size:clamp(52px,6.5vw,94px);font-weight:500;letter-spacing:-.045em;line-height:.9}
.section-heading h2 em{color:var(--gold);font-weight:400}
.section-heading p{max-width:410px;margin:0 0 8px;color:var(--muted);font-size:17px}
.foundation-grid{display:grid;grid-template-columns:1.15fr .85fr;grid-template-rows:repeat(3,minmax(174px,auto));gap:16px}
.foundation-card{position:relative;isolation:isolate;display:grid;grid-template-columns:auto 1fr auto;align-items:end;gap:22px;min-height:174px;overflow:hidden;padding:28px;border:1px solid var(--line);border-radius:var(--radius);background:linear-gradient(135deg,rgba(255,255,255,.08),rgba(255,255,255,.015)),var(--glass);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(13px) saturate(135%);backdrop-filter:blur(13px) saturate(135%);transition:transform .28s ease,border-color .28s ease}
.foundation-card:hover{transform:translateY(-3px);border-color:rgba(239,198,126,.56)}
.foundation-card--vocab{grid-row:1/4;align-items:end;min-height:560px;background:linear-gradient(0deg,rgba(4,15,27,.92),rgba(4,15,27,.18) 66%),var(--hub-card-scene,url("/anh-art/tram-n5.webp")) 50% 72%/cover no-repeat}
.foundation-card--vocab::after{position:absolute;inset:0;z-index:-1;background:linear-gradient(120deg,rgba(216,101,77,.14),transparent 48%);content:""}
.foundation-card__jp{align-self:start;color:var(--gold);font-family:var(--serif);font-size:clamp(44px,6vw,84px);line-height:1}
.foundation-card--vocab .foundation-card__jp{align-self:end}
.foundation-card__copy{display:grid;line-height:1.2}
.foundation-card__copy small{color:var(--gold);font-size:11px;letter-spacing:.12em}
.foundation-card__copy b{margin-top:10px;font-family:var(--display);font-size:clamp(25px,3vw,42px);font-weight:500;letter-spacing:-.025em}
.foundation-card__copy em{margin-top:8px;color:var(--muted);font-size:14px;font-style:normal}
.foundation-card--vocab .foundation-card__copy b,.foundation-card--vocab .foundation-card__copy em{color:#fff}
.foundation-card>i{display:grid;place-items:center;width:46px;height:46px;border:1px solid currentColor;border-radius:50%;font-style:normal;opacity:.72}

.intent{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);min-height:720px;overflow:hidden;background:#0b1926;color:#eff7fa}
.intent__art{position:relative;display:grid;place-items:center;overflow:hidden;background:linear-gradient(135deg,rgba(216,101,77,.82),rgba(84,38,54,.92))}
.intent__art::before{position:absolute;inset:0;background:linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px);background-size:44px 44px;content:"";mask-image:linear-gradient(135deg,#000,transparent 72%)}
.intent__art::after{position:absolute;inset:8%;border:1px solid rgba(255,237,215,.24);border-radius:50%;content:""}
.intent__art span{font-family:var(--serif);font-size:clamp(220px,36vw,520px);line-height:1;color:rgba(255,242,220,.9);text-shadow:0 26px 70px rgba(43,10,17,.28)}
.intent__content{display:flex;flex-direction:column;justify-content:center;padding:clamp(70px,9vw,130px)}
.intent__content h2{max-width:620px;margin:0 0 52px;font-family:var(--serif);font-size:clamp(52px,6vw,88px);font-weight:500;letter-spacing:-.045em;line-height:.92}
.intent-links{border-top:1px solid rgba(222,239,247,.25)}
.intent-links a{display:flex;min-height:84px;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(222,239,247,.2);font-family:var(--display);font-size:clamp(20px,2.4vw,31px);font-weight:500;transition:padding .25s ease,color .25s ease}
.intent-links a:hover{padding-left:12px;color:var(--gold)}
.intent-links i{font-family:var(--sans);font-size:11px;font-style:normal;letter-spacing:.12em;opacity:.55}

.section-heading--compact{grid-template-columns:1fr auto;margin-bottom:44px}
.section-heading--compact h2{font-size:clamp(46px,5vw,72px)}
.library-disclosure{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.library-disclosure summary{display:flex;min-height:86px;align-items:center;justify-content:space-between;cursor:pointer;font-family:var(--display);font-size:20px;font-weight:600;list-style:none}
.library-disclosure summary::-webkit-details-marker{display:none}
.library-disclosure summary i{font-size:28px;font-style:normal;font-weight:400;transition:transform .25s ease}
.library-disclosure[open] summary i{transform:rotate(45deg)}
.library-groups{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;padding:12px 0 52px}
.library-groups section{padding:24px;border-left:1px solid var(--line)}
.library-groups h3{margin:0 0 20px;color:var(--gold);font-family:var(--serif);font-size:26px;font-weight:500}
.library-groups a{display:flex;min-height:48px;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);color:var(--muted);font-size:14px}
.library-groups a:hover{color:var(--ink)}

.closing{display:grid;grid-template-columns:1fr auto;gap:44px;align-items:end;padding:clamp(90px,13vw,180px) clamp(20px,6vw,92px);background:linear-gradient(135deg,#a54234,#6e2736);color:#fff7eb}
.closing__copy p{margin:0 0 18px;color:#f4ce8a;font-family:var(--serif);font-size:18px;letter-spacing:.16em}
.closing__copy h2{max-width:850px;margin:0;font-family:var(--serif);font-size:clamp(50px,6.6vw,96px);font-weight:500;letter-spacing:-.045em;line-height:.9}
.closing__copy h2 em{color:#ffd9ae;font-weight:400}
.closing__action{display:flex;min-width:220px;min-height:74px;align-items:center;justify-content:space-between;padding:16px 20px;border:1px solid rgba(255,242,224,.55);border-radius:16px;background:rgba(28,9,17,.18);font-family:var(--display);font-size:18px;font-weight:600;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.closing__action i{font-style:normal}
.site-footer{display:flex;align-items:center;justify-content:space-between;padding:32px clamp(20px,6vw,92px);background:#07101b;color:rgba(230,240,245,.64);font-size:13px}
.site-footer a{font-family:var(--serif);font-size:24px;color:#fff6e7}
.site-footer p{margin:0}

.menu-layer{position:fixed;inset:0;z-index:180}
.menu-backdrop{position:absolute;inset:0;width:100%;height:100%;border:0;background:rgba(2,8,16,.62);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.menu-sheet{position:absolute;top:0;right:0;display:flex;width:min(500px,100%);height:100%;flex-direction:column;padding:clamp(24px,5vw,56px);background:#0b1926;color:#edf6f9;box-shadow:-30px 0 70px rgba(0,0,0,.3);overflow:auto}
.menu-sheet header{display:flex;align-items:center;justify-content:space-between;margin-bottom:42px}
.menu-sheet h2{margin:0;font-family:var(--serif);font-size:48px;font-weight:500}
.menu-close{display:grid;width:48px;height:48px;place-items:center;border:1px solid rgba(225,240,248,.28);border-radius:14px;background:rgba(255,255,255,.04);font-size:31px;cursor:pointer}
.menu-sheet nav{display:grid}
.menu-sheet nav a{display:grid;min-height:76px;align-content:center;border-bottom:1px solid rgba(225,240,248,.18)}
.menu-sheet nav span{font-family:var(--display);font-size:20px;font-weight:500}
.menu-sheet nav small{color:#9fb2c0;font-size:12px}
.menu-primary{display:flex;min-height:60px;align-items:center;justify-content:space-between;margin-top:auto;padding:14px 18px;border-radius:14px;background:var(--coral);font-weight:600;color:#fff}

.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.75,.2,1)}
.reveal.is-visible{opacity:1;transform:none}

html[data-theme="light"] .site-header .brand,html[data-theme="light"] .theme-toggle,html[data-theme="light"] .menu-trigger{border-color:rgba(236,247,250,.5);background:linear-gradient(135deg,rgba(255,255,255,.38),rgba(255,255,255,.08)),rgba(19,42,59,.22)}
html[data-theme="light"] .hero__scene::before{background:linear-gradient(90deg,rgba(12,27,39,.88) 0%,rgba(12,27,39,.52) 31%,rgba(12,27,39,.1) 65%,rgba(12,27,39,.22) 100%)}
html[data-theme="light"] .hero__veil{background:linear-gradient(180deg,rgba(11,26,38,.08),transparent 30%),linear-gradient(0deg,var(--bg),transparent 18%)}
html[data-theme="light"] .foundation-card--vocab{color:#fff}
html[data-theme="light"] .foundation-card{background-color:rgba(250,247,239,.74)}

@media(max-width:980px){
  .site-header{grid-template-columns:auto 1fr auto;padding:14px 18px}.desktop-nav{display:none}.hero{padding:130px 28px 154px}.hero__content{max-width:590px}.level-rail{left:24px;right:24px}.level-rail a{justify-content:center}.level-rail small{display:none}
  .section-heading,.section-heading--compact{grid-template-columns:1fr}.section-heading p{max-width:560px}.foundation-grid{grid-template-columns:1fr 1fr;grid-template-rows:auto}.foundation-card--vocab{grid-column:1/3;grid-row:auto;min-height:440px}.intent{grid-template-columns:.75fr 1.25fr}.library-groups{gap:12px}.closing{grid-template-columns:1fr}.closing__action{width:240px}
}
@media(max-width:700px){
  .site-header{gap:10px}.brand{gap:8px;padding:5px 9px 5px 5px}.brand__seal{width:43px;height:43px;font-size:16px}.brand__copy b{font-size:22px}.brand__copy small{font-size:7px;letter-spacing:.15em}.header-actions{gap:7px}.theme-toggle{width:46px;min-height:46px}.menu-trigger{min-height:46px;padding:0 12px}.menu-trigger span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
  .hero{min-height:820px;padding:130px 20px 145px}.hero__scene{background-position:49% center}.hero h1{font-size:clamp(58px,19vw,82px);line-height:.82}.hero h1 em{margin-left:.12em}.hero__lead{max-width:310px;font-size:15px}.primary-action{min-height:74px}.level-rail{right:16px;bottom:22px;left:16px}.level-rail a{min-height:68px;padding:14px 7px}.level-rail span{font-size:17px}
  .foundation,.library{padding:82px 18px}.section-heading{gap:20px;margin-bottom:40px}.section-heading h2{font-size:52px}.section-heading p{font-size:15px}.foundation-grid{display:grid;grid-template-columns:1fr;gap:12px}.foundation-card,.foundation-card--vocab{grid-column:auto;min-height:176px;padding:22px}.foundation-card--vocab{min-height:390px}.foundation-card__jp{font-size:48px}.foundation-card__copy b{font-size:27px}
  .intent{grid-template-columns:1fr;min-height:auto}.intent__art{min-height:330px}.intent__art span{font-size:260px}.intent__content{padding:72px 20px}.intent__content h2{margin-bottom:38px;font-size:52px}.intent-links a{min-height:72px;font-size:21px}
  .library-groups{grid-template-columns:1fr}.library-groups section{padding:18px 0 18px 18px}.closing{padding:86px 20px}.closing__copy h2{font-size:49px}.closing__action{width:100%}.site-footer{display:grid;gap:8px;padding:28px 20px}.site-footer p{font-size:12px}.menu-sheet h2{font-size:42px}
}
@media(max-width:360px){.brand__copy small{display:none}.hero{padding-top:112px}.hero h1{font-size:54px}.hero__lead{margin-top:23px}.level-rail a{padding-inline:4px}.level-rail span{font-size:15px}}

/* Signature Workbench V2
   Cinema atmosphere, luminous editorial type and low-alpha glass. */
:root{
  --serif:"Cormorant Garamond","Iowan Old Style","Palatino Linotype",Georgia,serif;
  --jp:"Noto Serif JP","Hiragino Mincho ProN",YuMincho,serif;
  --glass:rgba(6,19,34,.23);
  --glass-strong:rgba(7,22,40,.34);
  --glass-edge:rgba(224,243,255,.32);
  --glow-ivory:#fff8e9;
  --glow-gold:#ffd28f;
  --glow-coral:#ff9b83;
  --glow-sky:#aee9ff;
  --glow-mint:#a9f1d5;
}

body{
  background:
    radial-gradient(circle at 12% 18%,rgba(77,154,193,.12),transparent 26rem),
    radial-gradient(circle at 84% 58%,rgba(210,91,74,.10),transparent 32rem),
    linear-gradient(180deg,#06101c 0%,#081725 48%,#050d17 100%);
}

.site-header{padding-top:16px}
.brand,.theme-toggle,.menu-trigger,.desktop-nav{
  border-color:var(--glass-edge);
  background:
    linear-gradient(132deg,rgba(255,255,255,.13),rgba(255,255,255,.025) 42%,rgba(119,204,242,.045)),
    rgba(3,15,29,.18);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.25),
    inset 0 -1px 0 rgba(115,196,232,.08),
    0 14px 38px rgba(0,5,13,.19);
  -webkit-backdrop-filter:blur(18px) saturate(160%);
  backdrop-filter:blur(18px) saturate(160%);
}
.brand{gap:13px;padding:6px 16px 6px 6px;border-radius:18px}
.brand__seal{width:52px;height:52px;border-color:rgba(255,221,182,.68);font-family:var(--jp);font-size:19px;box-shadow:inset 0 0 0 3px rgba(255,232,200,.15),0 0 20px rgba(215,87,61,.12)}
.brand__copy b{font-family:var(--serif);font-size:32px;font-weight:600;letter-spacing:0;line-height:.88;text-shadow:0 1px 14px rgba(255,225,173,.17)}
.brand__copy small{margin-top:9px;font-size:9px;letter-spacing:.23em}
.desktop-nav a{font-weight:500;letter-spacing:.01em;text-shadow:0 2px 8px rgba(0,0,0,.62)}
.desktop-nav a:first-child{color:var(--glow-gold);text-shadow:0 1px 8px rgba(255,200,118,.28)}
.menu-trigger{color:#fff8e8;text-shadow:0 1px 9px rgba(255,214,151,.22)}

.hero{min-height:100svh;min-height:100dvh;padding-bottom:clamp(154px,18vh,186px)}
.hero__scene{background-position:58% center;filter:saturate(1.08) contrast(1.05) brightness(.9);transform:scale(1.018)}
.hero__scene::before{
  background:
    linear-gradient(90deg,rgba(1,7,15,.90) 0%,rgba(2,10,19,.69) 24%,rgba(2,10,19,.28) 43%,rgba(2,10,19,.06) 61%,rgba(2,10,19,.20) 100%);
}
.hero__scene::after{
  background:
    radial-gradient(circle at 66% 42%,rgba(255,205,128,.22),transparent 24%),
    radial-gradient(circle at 18% 54%,rgba(95,203,255,.10),transparent 30%),
    linear-gradient(180deg,rgba(2,8,15,.03),transparent 54%,rgba(2,8,15,.72));
}
.hero__veil{background:linear-gradient(180deg,rgba(2,8,15,.13),transparent 28%),linear-gradient(0deg,var(--bg),transparent 17%)}
.hero__content{position:relative;z-index:2;max-width:min(560px,43vw)}
.hero__content::before{
  position:absolute;inset:-54px -92px -62px -9vw;z-index:-1;
  background:radial-gradient(ellipse at 42% 48%,rgba(2,9,20,.58),rgba(2,9,20,.25) 52%,transparent 74%);
  content:"";pointer-events:none;
}
.hero__kanji{
  position:absolute;left:-.035em;bottom:.20em;z-index:-1;
  color:rgba(219,242,255,.035);font-family:var(--jp);font-size:clamp(300px,40vw,630px);font-weight:700;line-height:.72;
  pointer-events:none;user-select:none;
}
.hero__vertical{
  position:absolute;right:clamp(28px,4.5vw,76px);top:27%;z-index:1;
  color:rgba(255,240,214,.48);font-family:var(--jp);font-size:16px;letter-spacing:.32em;line-height:1;
  text-shadow:0 0 14px rgba(255,204,127,.22);writing-mode:vertical-rl;pointer-events:none;
}
.hero__level{gap:12px;margin-bottom:18px;color:#ffd89c;text-shadow:0 0 11px rgba(255,190,104,.25)}
.hero__level::before{width:34px;height:5px;clip-path:polygon(0 25%,82% 0,100% 55%,16% 100%);background:linear-gradient(90deg,var(--glow-coral),var(--glow-gold));content:"";box-shadow:0 0 12px rgba(255,155,103,.22)}
.hero__level b{border-color:rgba(255,215,154,.5);background:rgba(7,18,31,.14);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.hero h1{max-width:560px;font-family:var(--serif);font-size:clamp(68px,7.4vw,116px);font-weight:600;letter-spacing:-.045em;line-height:.78}
.hero h1 span{
  color:var(--glow-ivory);
  text-shadow:0 2px 18px rgba(0,0,0,.82),0 0 8px rgba(255,248,222,.52),0 0 26px rgba(255,203,128,.21);
}
.hero h1 em{
  margin:.16em 0 0 .38em;
  background:linear-gradient(102deg,#fff2c9 0%,#ffd08f 48%,#ff9e89 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  font-size:.64em;font-weight:500;
  filter:drop-shadow(0 2px 4px rgba(0,0,0,.84)) drop-shadow(0 0 9px rgba(255,174,116,.27));
}
.hero__lead{max-width:420px;margin:25px 0 28px;color:rgba(239,247,250,.82);font-size:15px;letter-spacing:.01em;text-shadow:0 2px 9px rgba(0,0,0,.7)}
.primary-action{
  width:min(336px,100%);min-height:78px;border-color:rgba(225,244,255,.44);border-radius:18px;
  background:
    radial-gradient(circle at 14% 0%,rgba(255,255,255,.18),transparent 34%),
    linear-gradient(128deg,rgba(255,255,255,.09),rgba(255,255,255,.018) 48%,rgba(255,152,122,.055)),
    rgba(4,17,32,.20);
  box-shadow:inset 0 1px rgba(255,255,255,.32),inset 0 -1px rgba(255,174,137,.10),0 18px 46px rgba(0,4,12,.26),0 0 22px rgba(255,155,106,.08);
  -webkit-backdrop-filter:blur(19px) saturate(170%);backdrop-filter:blur(19px) saturate(170%);
}
.primary-action small{color:rgba(225,241,249,.7)}
.primary-action b{font-family:var(--serif);font-size:25px;color:#fff8e9;text-shadow:0 0 8px rgba(255,225,173,.32),0 0 18px rgba(255,142,101,.13)}
.primary-action i{border-color:rgba(255,219,169,.38);color:var(--glow-gold);box-shadow:inset 0 1px rgba(255,255,255,.18),0 0 12px rgba(255,183,101,.10)}
.primary-action:hover{border-color:rgba(255,220,168,.68);box-shadow:inset 0 1px rgba(255,255,255,.38),0 24px 52px rgba(0,4,12,.32),0 0 28px rgba(255,151,102,.16)}

.level-rail{
  right:clamp(22px,4vw,64px);bottom:clamp(24px,4vh,42px);left:clamp(22px,6vw,92px);
  overflow:hidden;border:1px solid rgba(222,242,254,.23);border-radius:22px;
  background:linear-gradient(130deg,rgba(255,255,255,.08),rgba(255,255,255,.012) 46%),rgba(4,17,31,.18);
  box-shadow:inset 0 1px rgba(255,255,255,.18),0 20px 50px rgba(0,6,16,.18);
  -webkit-backdrop-filter:blur(18px) saturate(150%);backdrop-filter:blur(18px) saturate(150%);
}
.level-rail a{min-height:76px;border-right:1px solid rgba(222,239,248,.08)}
.level-rail a:last-child{border-right:0}
.level-rail a.is-current{background:linear-gradient(135deg,rgba(255,211,143,.13),rgba(255,126,105,.055));color:#fff9e9}
.level-rail a.is-current span{color:var(--glow-gold);text-shadow:0 0 10px rgba(255,193,104,.30)}

.foundation,.library{position:relative;isolation:isolate}
.foundation::before,.library::before{position:absolute;inset:0;z-index:-1;background:radial-gradient(circle at 12% 24%,rgba(88,184,226,.08),transparent 28rem),radial-gradient(circle at 88% 60%,rgba(207,85,75,.07),transparent 31rem);content:""}
.section-heading h2{font-family:var(--serif);font-weight:600;text-shadow:0 0 22px rgba(163,220,246,.09)}
.section-heading h2 em{background:linear-gradient(100deg,#ffd797,#ff9c85);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 8px rgba(255,151,111,.16))}
.foundation-grid{gap:18px}
.foundation-card{
  border-color:rgba(215,237,250,.22);border-radius:26px;
  background:
    radial-gradient(circle at 8% 0%,rgba(255,255,255,.14),transparent 29%),
    linear-gradient(137deg,rgba(255,255,255,.07),rgba(255,255,255,.012) 44%),
    rgba(6,22,39,.18);
  box-shadow:inset 0 1px rgba(255,255,255,.19),0 24px 64px rgba(0,6,15,.18);
  -webkit-backdrop-filter:blur(18px) saturate(145%);backdrop-filter:blur(18px) saturate(145%);
}
.foundation-card::before{position:absolute;inset:1px;z-index:-1;border-radius:inherit;background:linear-gradient(118deg,rgba(255,255,255,.09),transparent 28% 70%,rgba(126,217,255,.035));content:"";pointer-events:none}
.foundation-card--vocab{background:linear-gradient(0deg,rgba(3,13,24,.87),rgba(3,13,24,.10) 66%),var(--hub-card-scene,url("/anh-art/tram-n5.webp")) 50% 72%/cover no-repeat}
.foundation-card__jp{font-family:var(--jp);color:var(--glow-gold);text-shadow:0 0 14px rgba(255,198,110,.16)}
.foundation-card__copy b{font-family:var(--serif);font-size:clamp(32px,3.4vw,50px);font-weight:600}
.foundation-card--vocab .foundation-card__copy b{text-shadow:0 0 15px rgba(255,222,173,.18)}
.foundation-card--grammar .foundation-card__jp{color:var(--glow-sky);text-shadow:0 0 13px rgba(117,217,255,.18)}
.foundation-card--kanji .foundation-card__jp{color:var(--glow-mint);text-shadow:0 0 13px rgba(127,234,194,.18)}
.foundation-card--practice .foundation-card__jp{color:#ffad98;text-shadow:0 0 13px rgba(255,132,108,.17)}
.foundation-card--reading .foundation-card__jp{color:#c5a8ff;text-shadow:0 0 13px rgba(168,132,255,.2)}
.foundation-card>i{border-color:rgba(221,242,252,.34);background:rgba(255,255,255,.025)}

.intent{
  position:relative;isolation:isolate;min-height:690px;
  background:
    linear-gradient(90deg,rgba(3,13,24,.34),rgba(3,13,24,.77)),
    linear-gradient(0deg,rgba(4,14,25,.80),rgba(4,14,25,.12)),
    var(--hub-scene,url("/anh-art/p/jlpt-hub-n5-v23.jpg")) center/cover no-repeat;
}
.intent::after{position:absolute;inset:0;z-index:-1;background:radial-gradient(circle at 24% 48%,rgba(255,147,103,.15),transparent 25rem);content:""}
.intent__art{background:linear-gradient(135deg,rgba(255,255,255,.045),rgba(255,255,255,.008)),rgba(5,20,36,.12);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.intent__art::before{opacity:.42;mask-image:linear-gradient(135deg,#000,transparent 72%)}
.intent__art::after{border-color:rgba(255,218,162,.19)}
.intent__art span{font-family:var(--jp);color:rgba(255,239,211,.67);text-shadow:0 0 18px rgba(255,191,105,.18),0 28px 78px rgba(0,0,0,.28)}
.intent__content{background:linear-gradient(128deg,rgba(255,255,255,.055),rgba(255,255,255,.005)),rgba(4,18,34,.18);-webkit-backdrop-filter:blur(18px) saturate(145%);backdrop-filter:blur(18px) saturate(145%)}
.intent__content h2{font-family:var(--serif);font-weight:600;text-shadow:0 2px 15px rgba(0,0,0,.58),0 0 20px rgba(127,218,255,.11)}
.intent-links a{font-family:var(--serif);font-size:clamp(24px,2.7vw,36px);font-weight:600;text-shadow:0 1px 8px rgba(0,0,0,.42)}

.library-disclosure{border-color:rgba(215,237,250,.20)}
.library-disclosure summary{font-family:var(--serif);font-size:26px}
.library-groups{gap:18px}
.library-groups section{border:1px solid rgba(215,237,250,.18);border-radius:20px;background:linear-gradient(135deg,rgba(255,255,255,.055),rgba(255,255,255,.008)),rgba(6,22,39,.13);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.library-groups h3{font-family:var(--serif);color:var(--glow-gold);text-shadow:0 0 10px rgba(255,194,105,.12)}

.closing{
  position:relative;overflow:hidden;
  background:
    radial-gradient(circle at 12% 18%,rgba(104,207,247,.12),transparent 28rem),
    radial-gradient(circle at 82% 78%,rgba(255,122,104,.15),transparent 30rem),
    linear-gradient(135deg,#081827,#111727 54%,#271522);
}
.closing::before{position:absolute;right:-.05em;bottom:-.30em;color:rgba(255,238,209,.035);font-family:var(--jp);font-size:clamp(260px,38vw,560px);line-height:1;content:"歩";pointer-events:none}
.closing__copy,.closing__action{position:relative;z-index:1}
.closing__copy h2{font-family:var(--serif);font-weight:600;text-shadow:0 0 24px rgba(173,226,255,.10)}
.closing__copy h2 em{background:linear-gradient(100deg,#ffd899,#ff9c85);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 9px rgba(255,143,107,.16))}
.closing__action{border-color:rgba(222,242,253,.35);background:linear-gradient(135deg,rgba(255,255,255,.10),rgba(255,255,255,.015)),rgba(5,19,34,.17);font-family:var(--serif);font-size:22px;-webkit-backdrop-filter:blur(18px) saturate(155%);backdrop-filter:blur(18px) saturate(155%)}

html[data-theme="light"]{
  --glass:rgba(245,248,248,.16);--glass-strong:rgba(246,249,248,.28);--glass-edge:rgba(255,255,255,.55);
  --glow-ivory:#fff8e9;--glow-gold:#ffd28f;--glow-coral:#ff9b83;
}
html[data-theme="light"] body{background:radial-gradient(circle at 14% 16%,rgba(105,183,216,.18),transparent 27rem),radial-gradient(circle at 86% 62%,rgba(205,89,70,.13),transparent 30rem),linear-gradient(180deg,#edf1ef,#eee5d9 56%,#e8dece)}
html[data-theme="light"] .brand,html[data-theme="light"] .theme-toggle,html[data-theme="light"] .menu-trigger,html[data-theme="light"] .desktop-nav{border-color:rgba(255,255,255,.58);background:linear-gradient(132deg,rgba(255,255,255,.25),rgba(255,255,255,.045) 45%),rgba(7,28,45,.14);box-shadow:inset 0 1px rgba(255,255,255,.44),0 14px 38px rgba(18,44,61,.12)}
html[data-theme="light"] .hero__scene{filter:saturate(1.09) contrast(1.04) brightness(1.02)}
html[data-theme="light"] .hero__scene::before{background:linear-gradient(90deg,rgba(7,21,34,.82) 0%,rgba(7,21,34,.56) 25%,rgba(7,21,34,.22) 44%,rgba(7,21,34,.04) 63%,rgba(7,21,34,.13) 100%)}
html[data-theme="light"] .hero__content::before{background:radial-gradient(ellipse at 42% 48%,rgba(3,17,29,.48),rgba(3,17,29,.19) 53%,transparent 75%)}
html[data-theme="light"] .foundation-card{color:#102335;background:radial-gradient(circle at 8% 0%,rgba(255,255,255,.32),transparent 29%),linear-gradient(137deg,rgba(255,255,255,.18),rgba(255,255,255,.025) 44%),rgba(244,248,246,.24)}
html[data-theme="light"] .foundation-card__copy em{color:#405466}
html[data-theme="light"] .foundation-card--vocab{color:#fff;background:linear-gradient(0deg,rgba(3,13,24,.87),rgba(3,13,24,.08) 66%),var(--hub-card-scene,url("/anh-art/tram-n5.webp")) 50% 72%/cover no-repeat}
html[data-theme="light"] .section-heading h2,html[data-theme="light"] .section-heading p,html[data-theme="light"] .library-disclosure{color:#102b40}
html[data-theme="light"] .library-groups section{border-color:rgba(22,67,93,.15);background:linear-gradient(135deg,rgba(255,255,255,.31),rgba(255,255,255,.055)),rgba(246,249,246,.27)}

/* Signature Workbench V2.1: sumi pigments stay legible on dawn glass. */
html[data-theme="light"] .section-heading h2{color:#10293d;text-shadow:0 1px 0 rgba(255,255,255,.52),0 12px 34px rgba(32,58,75,.08)}
html[data-theme="light"] .section-heading h2 em{
  color:#9b3f46;background:none;-webkit-text-fill-color:currentColor;
  filter:none;text-shadow:0 1px 0 rgba(255,255,255,.58),0 8px 24px rgba(122,42,52,.13);
}
html[data-theme="light"] .foundation-card__copy small{color:#765018;text-shadow:none}
html[data-theme="light"] .foundation-card__copy em{color:#2f485b}
html[data-theme="light"] .foundation-card--grammar .foundation-card__jp{color:#126483;text-shadow:0 1px 0 rgba(255,255,255,.48),0 10px 28px rgba(18,100,131,.09)}
html[data-theme="light"] .foundation-card--kanji .foundation-card__jp{color:#17634e;text-shadow:0 1px 0 rgba(255,255,255,.48),0 10px 28px rgba(23,99,78,.09)}
html[data-theme="light"] .foundation-card--practice .foundation-card__jp{color:#98423f;text-shadow:0 1px 0 rgba(255,255,255,.48),0 10px 28px rgba(152,66,63,.09)}
html[data-theme="light"] .foundation-card--reading .foundation-card__jp{color:#593a87;text-shadow:0 1px 0 rgba(255,255,255,.48),0 10px 28px rgba(89,58,135,.09)}
html[data-theme="light"] .foundation-card>i{color:#25485d;border-color:rgba(37,72,93,.24);background:rgba(255,255,255,.18)}
html[data-theme="light"] .foundation-card--vocab .foundation-card__copy small{color:#ffd28c;text-shadow:0 1px 7px rgba(0,0,0,.72)}
html[data-theme="light"] .foundation-card--vocab .foundation-card__copy b{color:#fffaf0;text-shadow:0 2px 12px rgba(0,0,0,.82),0 0 18px rgba(255,211,139,.12)}
html[data-theme="light"] .foundation-card--vocab .foundation-card__copy em{color:#edf6fa;text-shadow:0 2px 9px rgba(0,0,0,.86)}
html[data-theme="light"] .level-rail{
  border-color:rgba(236,248,255,.55);
  background:linear-gradient(135deg,rgba(255,255,255,.10),rgba(255,255,255,.018) 48%),rgba(8,28,45,.52);
  box-shadow:inset 0 1px rgba(255,255,255,.28),0 18px 48px rgba(20,38,52,.18);
  -webkit-backdrop-filter:blur(16px) saturate(145%);backdrop-filter:blur(16px) saturate(145%);
}
html[data-theme="light"] .level-rail a{color:rgba(246,251,254,.84);text-shadow:0 1px 5px rgba(0,8,18,.68)}
html[data-theme="light"] .level-rail a:hover,html[data-theme="light"] .level-rail a.is-current{color:#fff}
html[data-theme="light"] .level-rail a.is-current{background:linear-gradient(135deg,rgba(255,210,141,.16),rgba(255,112,94,.06))}
html[data-theme="light"] .level-rail a.is-current span{color:#ffd58f;text-shadow:0 0 12px rgba(255,181,91,.32)}

/* Signature V2.2: one compact utility rail replaces three repetitive full-screen sections. */
.quick-tools{
  display:grid;grid-template-columns:minmax(220px,.52fr) minmax(0,1.48fr);gap:clamp(24px,4vw,64px);align-items:center;
  padding:clamp(34px,4.4vw,62px) clamp(20px,6vw,92px);border-top:1px solid rgba(219,239,250,.18);
  background:radial-gradient(circle at 8% 42%,rgba(255,176,111,.09),transparent 22rem),linear-gradient(135deg,rgba(7,25,42,.96),rgba(13,20,35,.96));color:#f3f8fb;
}
.quick-tools__heading{display:flex;align-items:center;gap:18px}
.quick-tools__heading>span{color:rgba(255,210,142,.54);font-family:var(--jp);font-size:clamp(52px,5vw,78px);line-height:1;text-shadow:0 0 18px rgba(255,177,99,.13)}
.quick-tools__heading small{display:block;margin-bottom:5px;color:#f0be72;font-size:10px;font-weight:600;letter-spacing:.16em;text-transform:uppercase}
.quick-tools__heading h2{margin:0;font-family:var(--serif);font-size:clamp(30px,3.4vw,48px);font-weight:600;letter-spacing:-.035em;line-height:1}
.quick-tools__items{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.quick-tools__items>a,.quick-tools__more>summary{
  display:flex;min-height:66px;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;border:1px solid rgba(220,240,251,.22);border-radius:16px;
  background:linear-gradient(135deg,rgba(255,255,255,.075),rgba(255,255,255,.012)),rgba(4,18,33,.18);box-shadow:inset 0 1px rgba(255,255,255,.16);
  font-size:14px;font-weight:600;cursor:pointer;-webkit-backdrop-filter:blur(12px) saturate(140%);backdrop-filter:blur(12px) saturate(140%);
}
.quick-tools__items>a:hover,.quick-tools__more>summary:hover{border-color:rgba(255,210,143,.52);background-color:rgba(255,255,255,.06)}
.quick-tools__items i{color:#ffd18a;font-style:normal}
.quick-tools__more>summary{list-style:none}.quick-tools__more>summary::-webkit-details-marker{display:none}
.quick-tools__more[open]{grid-column:1/-1}.quick-tools__more[open]>summary{min-height:54px;border-radius:16px 16px 8px 8px}.quick-tools__more[open]>summary i{transform:rotate(45deg)}
.quick-tools__drawer{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 18px;padding:18px 8px 2px}
.quick-tools__drawer a{display:flex;min-height:44px;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(220,240,251,.14);color:rgba(235,244,249,.72);font-size:13px}
.quick-tools__drawer a:hover{color:#fff}
html[data-theme="light"] .quick-tools{
  border-color:rgba(31,68,91,.13);background:radial-gradient(circle at 8% 42%,rgba(255,169,102,.10),transparent 22rem),linear-gradient(135deg,rgba(234,240,239,.78),rgba(236,226,215,.76));color:#102b40;
}
html[data-theme="light"] .quick-tools__heading>span{color:#9b4b3f;text-shadow:0 1px 0 rgba(255,255,255,.62)}
html[data-theme="light"] .quick-tools__heading small{color:#77501a}
html[data-theme="light"] .quick-tools__items>a,html[data-theme="light"] .quick-tools__more>summary{border-color:rgba(35,73,96,.18);background:linear-gradient(135deg,rgba(255,255,255,.34),rgba(255,255,255,.055)),rgba(245,248,246,.24);box-shadow:inset 0 1px rgba(255,255,255,.64);color:#15344b}
html[data-theme="light"] .quick-tools__items>a:hover,html[data-theme="light"] .quick-tools__more>summary:hover{border-color:rgba(143,71,55,.38)}
html[data-theme="light"] .quick-tools__items i{color:#9d493b}
html[data-theme="light"] .quick-tools__drawer a{border-color:rgba(35,73,96,.13);color:#2e4a5d}
html[data-theme="light"] .quick-tools__drawer a:hover{color:#102b40}

/* Signature V2.3: the JLPT journey is a primary navigation landmark. */
.level-rail{
  grid-template-columns:minmax(145px,.72fr) repeat(5,minmax(0,1fr));
  min-height:98px;border-color:rgba(225,243,254,.36);
  background:
    radial-gradient(circle at 9% 0%,rgba(255,206,130,.14),transparent 24%),
    linear-gradient(130deg,rgba(255,255,255,.105),rgba(255,255,255,.016) 48%),
    rgba(4,17,31,.42);
  box-shadow:inset 0 1px rgba(255,255,255,.29),inset 0 -1px rgba(131,211,247,.08),0 26px 70px rgba(0,6,16,.28),0 0 0 1px rgba(80,167,211,.055);
  -webkit-backdrop-filter:blur(20px) saturate(158%);backdrop-filter:blur(20px) saturate(158%);
}
.level-rail__intro{display:flex;min-width:0;align-items:center;gap:13px;padding:15px 18px;border-right:1px solid rgba(222,239,248,.13);background:linear-gradient(135deg,rgba(255,210,139,.11),rgba(255,123,104,.025))}
.level-rail__intro i{color:var(--glow-gold);font-family:var(--jp);font-size:43px;font-style:normal;line-height:1;text-shadow:0 0 12px rgba(255,193,104,.25)}
.level-rail__intro p{min-width:0;margin:0;line-height:1}
.level-rail__intro small{display:block;margin-bottom:7px;color:rgba(231,241,247,.68);font-size:8px;font-weight:600;letter-spacing:.16em;text-transform:uppercase}
.level-rail__intro b{color:#fff8e9;font-family:var(--serif);font-size:22px;font-weight:600;letter-spacing:.02em;text-shadow:0 0 13px rgba(255,219,165,.17)}
.level-rail a{min-width:0;min-height:98px;justify-content:center;gap:13px;padding:17px 14px;color:rgba(228,239,246,.76);transition:background-color .22s ease,color .22s ease,transform .22s ease}
.level-rail a>span{font-size:clamp(29px,2.4vw,37px);font-weight:600;letter-spacing:-.045em;line-height:1;text-shadow:0 2px 8px rgba(0,4,12,.48)}
.level-rail a>small{display:block;color:rgba(225,237,244,.72);font-size:11px;font-weight:600;letter-spacing:.01em;line-height:1.2}
.level-rail a>em{position:absolute;top:9px;left:14px;color:#ffd899;font-size:8px;font-style:normal;font-weight:600;letter-spacing:.13em;line-height:1;text-transform:uppercase;text-shadow:0 0 9px rgba(255,183,100,.23)}
.level-rail a::before{height:3px;box-shadow:0 0 11px rgba(255,155,105,.26)}
.level-rail a:hover{z-index:1;background:rgba(255,255,255,.045);color:#fff;transform:translateY(-1px)}
.level-rail a.is-current{
  background:
    radial-gradient(circle at 20% 0%,rgba(255,226,169,.22),transparent 43%),
    linear-gradient(135deg,rgba(255,203,125,.18),rgba(255,112,94,.075));
  box-shadow:inset 1px 0 rgba(255,226,185,.16),inset -1px 0 rgba(255,154,127,.09),0 0 32px rgba(255,139,91,.055);
}
.level-rail a.is-current>span{font-size:clamp(37px,3vw,46px);color:#ffe0a4;text-shadow:0 0 10px rgba(255,193,104,.34),0 2px 8px rgba(0,4,12,.55)}
.level-rail a.is-current>small{color:#fff9eb}
html[data-theme="light"] .level-rail{
  border-color:rgba(238,249,255,.72);
  background:
    radial-gradient(circle at 9% 0%,rgba(255,207,132,.18),transparent 24%),
    linear-gradient(132deg,rgba(255,255,255,.15),rgba(255,255,255,.022) 49%),
    rgba(7,27,44,.67);
  box-shadow:inset 0 1px rgba(255,255,255,.42),inset 0 -1px rgba(125,205,241,.11),0 25px 66px rgba(18,36,50,.25),0 0 0 1px rgba(29,84,113,.06);
}
html[data-theme="light"] .level-rail__intro{border-right-color:rgba(239,249,255,.18);background:linear-gradient(135deg,rgba(255,211,139,.15),rgba(255,122,104,.035))}
html[data-theme="light"] .level-rail__intro small{color:rgba(246,251,254,.78);text-shadow:0 1px 5px rgba(0,8,18,.68)}
html[data-theme="light"] .level-rail__intro b{color:#fffaf0;text-shadow:0 1px 6px rgba(0,8,18,.72),0 0 12px rgba(255,210,139,.16)}
html[data-theme="light"] .level-rail a{color:rgba(249,252,254,.9);text-shadow:0 1px 6px rgba(0,7,16,.74)}
html[data-theme="light"] .level-rail a>small{color:rgba(244,250,253,.82)}
html[data-theme="light"] .level-rail a.is-current{background:radial-gradient(circle at 20% 0%,rgba(255,229,176,.25),transparent 43%),linear-gradient(135deg,rgba(255,207,131,.22),rgba(255,111,91,.09))}
html[data-theme="light"] .level-rail a.is-current>span{color:#ffe0a2;text-shadow:0 0 11px rgba(255,181,91,.38),0 2px 8px rgba(0,7,16,.68)}

@media(max-width:980px){
  .hero__content{max-width:560px}.hero__vertical{right:28px}.brand__copy b{font-size:30px}.level-rail{grid-template-columns:repeat(5,minmax(0,1fr))}.level-rail__intro{display:none}.level-rail a>small{display:block}.quick-tools{grid-template-columns:1fr}.quick-tools__items{grid-template-columns:repeat(2,minmax(0,1fr))}.quick-tools__more[open]{grid-column:1/-1}
}
@media(max-width:700px){
  .brand{gap:9px;padding:5px 10px 5px 5px}.brand__seal{width:44px;height:44px;font-size:16px}.brand__copy b{font-size:26px}.brand__copy small{font-size:8px;letter-spacing:.18em}
  .hero{min-height:100svh;min-height:100dvh;padding:124px 18px 140px}.hero__scene{background-position:54% center}.hero__content{max-width:min(78vw,310px)}.hero__content::before{inset:-34px -38px -46px -40px}.hero__kanji{font-size:300px;opacity:.72}.hero__vertical{display:none}.hero h1{font-size:clamp(58px,18.2vw,76px);line-height:.82}.hero h1 em{margin-left:.09em}.hero__lead{margin:21px 0 23px;font-size:14px}.primary-action{min-height:70px}.level-rail{border-radius:18px}.level-rail a{min-height:74px;flex-direction:column;gap:3px;padding:9px 3px}.level-rail a>span{font-size:25px}.level-rail a.is-current>span{font-size:30px}.level-rail a>small{font-size:9px;letter-spacing:0}.level-rail a>em{display:none}
  .foundation-card__copy b{font-size:34px}.quick-tools{gap:20px;padding:34px 18px}.quick-tools__heading>span{font-size:48px}.quick-tools__heading h2{font-size:34px}.quick-tools__items{grid-template-columns:1fr}.quick-tools__items>a,.quick-tools__more>summary{min-height:58px}.quick-tools__more[open]{grid-column:auto}.quick-tools__drawer{grid-template-columns:1fr 1fr;padding:14px 4px 0}
}
@media(max-width:360px){
  .brand__copy small{display:block;font-size:7px}.hero__content{max-width:280px}.hero h1{font-size:55px}.hero__lead{max-width:260px}.primary-action b{font-size:22px}.level-rail a>span{font-size:22px}.level-rail a.is-current>span{font-size:27px}.level-rail a>small{font-size:8px}
}

/* V23 rollout lock: keep essential controls visible over every moving hero frame. */
.theme-toggle{color:#fff7e8;text-shadow:0 1px 4px rgba(0,7,17,.84),0 0 12px rgba(255,204,128,.28)}
.theme-toggle>span{display:grid;place-items:center;width:100%;height:100%;line-height:1}
html[data-theme="light"] .theme-toggle{color:#fff8df;text-shadow:0 1px 4px rgba(0,7,17,.88),0 0 12px rgba(255,178,96,.48)}
.site-footer a{display:inline-flex;min-height:44px;align-items:center}

@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.brand,.theme-toggle,.menu-trigger,.desktop-nav,.primary-action,.foundation-card,.level-rail,.quick-tools__items>a,.quick-tools__more>summary{background-color:rgba(7,21,36,.94)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}.foundation-card,.primary-action,.intent-links a{transition:none}.hero__scene{transform:none}}
@media(forced-colors:active){.hero__scene,.hero__veil,.intent__art{display:none}.brand,.theme-toggle,.menu-trigger,.desktop-nav,.primary-action,.foundation-card,.level-rail,.quick-tools,.quick-tools__items>a,.quick-tools__more>summary{background:Canvas!important;color:CanvasText!important;border:1px solid ButtonText!important;box-shadow:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}.hero h1,.hero h1 em,.hero__level,.section-heading h2 em{color:CanvasText;text-shadow:none;-webkit-text-fill-color:CanvasText}}
@media print{.site-header,.menu-layer,.level-rail{display:none!important}.hero{min-height:auto;padding:32px}.hero__scene,.hero__veil,.intent__art{display:none}.hero h1,.hero h1 em,.hero__lead,.hero__level{color:#111;text-shadow:none}.foundation,.quick-tools{padding:32px}.foundation-card{break-inside:avoid;background:#fff!important;color:#111!important;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}.reveal{opacity:1;transform:none}}