.learn-wrap{max-width:1120px;margin:auto;padding:2rem 1.5rem 4rem}.learn-hero{padding:2.8rem 0;max-width:850px}.learn-hero h1{font-size:clamp(2rem,4.7vw,3.6rem);margin:.7rem 0 1.2rem;line-height:1.15}.learn-hero p{font-size:1.12rem;color:#bdd0bd;max-width:730px}.learn-eyebrow{color:var(--gold-light);font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;font-weight:700}.learn-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,290px),1fr));gap:1rem}.learn-card{display:flex;flex-direction:column;gap:.8rem;border:1px solid var(--gold-border);border-radius:16px;padding:1.5rem;background:var(--bg-card)}a.learn-card:hover{border-color:var(--gold);background:var(--bg-card-elevated)}.learn-card h2,.learn-card h3{font-size:1.25rem;line-height:1.35}.learn-card p{color:#bdd0bd}.learn-card .learn-more{margin-top:auto;color:var(--gold-light)}.learn-section{padding:2rem 0;scroll-margin-top:100px}.learn-section>h2{margin-bottom:1.3rem}.lesson-layout{display:grid;grid-template-columns:minmax(0,2.4fr) minmax(240px,1fr);gap:2.5rem;align-items:start}.lesson-body section{padding:1.5rem 0;border-top:1px solid var(--border);scroll-margin-top:100px}.lesson-body h2{font-size:1.55rem;margin-bottom:1rem;line-height:1.35}.lesson-body p,.lesson-body li{color:#c4d5c4;margin-bottom:1rem}.lesson-body ol{list-style:decimal;padding-left:1.5rem}.lesson-body a,.learn-text-link{color:var(--gold-light);text-decoration:underline;text-underline-offset:3px}.lesson-aside{position:sticky;top:90px}.lesson-aside li{margin:.65rem 0}.lesson-aside a{color:#d7e3d7;text-decoration:underline;text-underline-offset:3px}.lesson-hand{margin:1.2rem 0;padding:1.1rem;border-radius:14px;background:#081608;border:1px solid var(--border)}.playing-cards{display:flex;flex-wrap:wrap;gap:.45rem}.playing-card{width:49px;min-height:68px;border-radius:6px;background:#fff9e9;color:#162218!important;padding:.3rem .45rem;font-size:1.15rem;line-height:1.35;font-weight:700;margin:0!important;box-shadow:0 2px 4px #0005}.playing-card.red{color:#a5182c!important}.lesson-hand figcaption{font-size:.85rem;color:#bdd0bd;margin-top:.9rem}.learn-actions{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1rem}.learn-actions .btn{white-space:normal;text-align:center;justify-content:center}.learn-callout{margin:2rem 0;padding:1.7rem;background:var(--bg-card);border:1px solid var(--gold-border);border-radius:16px}.learn-callout h2{font-size:1.5rem;line-height:1.3;margin-bottom:.8rem}.learn-callout p{color:#c4d5c4}.learn-meta{color:#bdd0bd;font-size:.85rem;margin-top:1rem}.learn-wrap :is(a,button,select,input,summary):focus-visible{outline:3px solid var(--gold-light);outline-offset:4px}.learn-form{padding:1.4rem;border:1px solid var(--gold-border);border-radius:16px;background:var(--bg-card)}.card-selectors{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1rem;margin:1rem 0}.learn-form label{display:block;color:#d9e5d9}.learn-form select{display:block;width:100%;color:#fff;background:#102310;border:1px solid #739173;border-radius:6px;padding:.7rem;margin-top:.4rem;font:inherit}.learn-form input{accent-color:var(--gold)}.learn-result{margin-top:1.5rem;padding:1.3rem;background:#091909;border-radius:12px}.learn-result h2{font-size:1.5rem}.learn-result dl{display:grid;grid-template-columns:1fr auto;gap:.4rem 1rem;margin:1rem 0}.learn-error{color:#ffb7b7;min-height:1.6em;margin-top:.6rem}.learn-quiz{margin:1rem 0;padding:1rem;border:1px solid var(--border);border-radius:12px}.learn-quiz legend{padding:0 .4rem;font-weight:600}.learn-quiz label{display:block;padding:.65rem}.learn-quiz input{margin-right:.5rem}.learn-answer{margin-top:1rem;color:#d5e5d5}.learn-wrap details{padding:1rem;border:1px solid var(--border);margin:1rem 0;border-radius:10px}.learn-wrap summary{cursor:pointer;color:var(--gold-light)}.learn-wrap details p{margin-top:.8rem}.learn-wrap [hidden]{display:none!important}@media(max-width:760px){.lesson-layout{grid-template-columns:1fr;gap:1rem}.lesson-aside{position:static;grid-row:1}.learn-wrap{padding-inline:1rem}.learn-hero{padding:2rem 0}}@media(prefers-reduced-motion:reduce){.learn-wrap *{scroll-behavior:auto!important;transition:none!important}}.learn-wrap h1,.learn-wrap h2,.learn-wrap h3{overflow-wrap:anywhere}html:is([lang=hi],[lang=ja]) .learn-eyebrow{letter-spacing:.02em;text-transform:none}html[lang=hi] body{font-family:Nirmala UI,Mangal,sans-serif}html[lang=hi] :is(h1,h2,h3,h4){font-family:Nirmala UI,Mangal,sans-serif}html[lang=ja] body{font-family:Yu Gothic,Meiryo,sans-serif}html[lang=ja] :is(h1,h2,h3,h4){font-family:Yu Mincho,Meiryo,serif}
