:root{color-scheme:light dark;--bg:#fff;--fg:#24344c;--line:#dfe5ee;--surface:#f8fafc;--link:#0759c7;font-family:Inter,"Noto Sans JP",system-ui,sans-serif;color:var(--fg);background:var(--bg);line-height:1.8}:root[data-theme="dark"]{--bg:#0c1220;--fg:#e7edf7;--line:#2b374b;--surface:#111a29;--link:#a8c7ff;color-scheme:dark}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--fg)}a{color:var(--link);text-underline-offset:3px}a:focus-visible,button:focus-visible{outline:3px solid #9ec5ff;outline-offset:4px}header,footer{padding:18px max(20px,calc((100% - 980px)/2));border-block-end:1px solid var(--line)}header{display:flex;align-items:center;justify-content:space-between;gap:20px}header>a{display:flex;gap:10px;align-items:center;color:var(--fg);font-weight:700;text-decoration:none}header nav{display:flex;align-items:center;gap:16px;white-space:nowrap}.theme-toggle{min-height:36px;padding:0 10px;border:1px solid var(--line);border-radius:6px;color:var(--fg);background:var(--surface);font:inherit;font-size:13px}main{max-width:780px;margin:40px auto;padding:0 24px}h1{font-size:clamp(26px,4vw,38px);line-height:1.4}h2{font-size:21px;margin-top:34px}p,li{font-size:16px}li{margin-block:12px}.answer{font-size:19px}.table-scroll{max-width:100%;overflow-x:auto;border:1px solid var(--line);border-radius:6px}table{width:100%;border-collapse:collapse;text-align:left}th,td{padding:9px 12px;border-bottom:1px solid var(--line);white-space:nowrap}th{background:var(--surface)}tbody tr:last-child td{border-bottom:0}.example-seed{font-size:13px;color:var(--fg)}.learning-flow{margin:0;padding:14px;border:1px solid var(--line);border-radius:6px;background:var(--surface)}.learning-flow ol{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;padding:0;list-style:none}.learning-flow li{min-width:0;margin:0;padding:12px;border-left:3px solid #8b72c7;background:var(--bg)}.learning-flow figcaption{font-size:13px}.rule-list{padding-left:22px}.observed-result{padding:12px;border-left:3px solid #349661;background:var(--surface)}.action{display:inline-block;padding:10px 18px;background:#0969e8;color:#fff;border-radius:6px;text-decoration:none}.skip{position:absolute;left:12px;top:-100px}.skip:focus{top:0;background:var(--surface)}footer{font-size:14px;background:var(--surface);border-top:1px solid var(--line)}@media(max-width:600px){header{flex-wrap:wrap}header nav{gap:10px;font-size:13px}.theme-toggle{font-size:12px}main{margin-top:24px}.learning-flow ol{grid-template-columns:1fr;gap:8px}}
.lesson-goal{padding:16px 20px;border-left:3px solid var(--link);background:var(--surface)}.lesson-goal p:last-child{font-size:14px}.lesson-outline{display:flex;gap:12px 24px;flex-wrap:wrap;margin:24px 0}.exercise-answer{padding:14px 18px;border:1px solid var(--line);border-radius:6px;background:var(--surface)}.exercise-answer summary{cursor:pointer;color:var(--link);font-weight:600}.exercise-answer summary:focus-visible{outline:3px solid #9ec5ff;outline-offset:4px}section[id]{scroll-margin-top:20px}@media print{header,footer,.skip,.lesson-outline,.action{display:none}main{max-width:none;margin:0}h2{break-after:avoid}tr,.learning-flow{break-inside:avoid}:root,:root[data-theme="dark"]{--bg:#fff;--fg:#000;--line:#aaa;--surface:#fff;--link:#000}details::details-content{display:block;content-visibility:visible}details>summary{display:none}} 