:root{--ink:#171a22;--muted:#666c79;--line:#e2e4e9;--paper:#f7f8fa;--white:#fff;--accent:#e85c3a;--dark:#242936}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:#fff;font-family:"Hiragino Sans","Yu Gothic UI","Noto Sans JP",sans-serif;line-height:1.75}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}.course-header{display:flex;height:68px;align-items:center;justify-content:space-between;padding:0 max(22px,calc((100vw - 1100px)/2));border-bottom:1px solid var(--line)}.course-header>a:last-child{font-size:.8rem;font-weight:800;border-bottom:1px solid var(--ink)}.brand{display:flex;align-items:center;gap:10px;font-size:1rem;font-weight:850}.course-breadcrumbs{display:flex;width:min(1100px,calc(100% - 40px));gap:10px;margin:22px auto;color:var(--muted);font-size:.72rem}.course-breadcrumbs a{text-decoration:underline;text-underline-offset:3px}.course-hero{display:grid;width:min(1100px,calc(100% - 40px));grid-template-columns:1.25fr .75fr;gap:65px;align-items:end;margin:60px auto 90px}.course-hero>div:first-child>p:first-child,.course-section-head>p,.course-finish>div>p,.courses-hub-hero>p{color:var(--accent);font:900 .7rem/1.3 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.15em}.course-hero>div:first-child>span{display:block;margin-top:18px;color:var(--muted);font-size:.72rem;font-weight:800}.course-hero h1{max-width:760px;margin:12px 0 20px;font-size:clamp(2.8rem,6vw,5.8rem);line-height:1.1;letter-spacing:-.065em}.course-hero>div:first-child>p:last-child{max-width:650px;margin:0;color:var(--muted);font-size:.95rem}.course-progress-panel{padding:28px;border-radius:14px;color:#fff;background:var(--dark)}.course-progress-panel>div:first-child{display:flex;align-items:end;justify-content:space-between}.course-progress-panel span{color:#bfc3cc;font-size:.72rem}.course-progress-panel strong{font-size:1.4rem}.course-progress-bar{height:5px;margin-top:17px;overflow:hidden;border-radius:8px;background:#454a57}.course-progress-bar i{display:block;width:0;height:100%;background:var(--accent);transition:width .3s}.course-progress-panel p{margin:13px 0 0;color:#bfc3cc;font-size:.74rem}.course-steps{padding:85px max(22px,calc((100vw - 1100px)/2));background:var(--paper)}.course-section-head p{margin:0}.course-section-head h2{margin:8px 0 45px;font-size:clamp(2rem,4vw,3.4rem);letter-spacing:-.05em}.course-steps ol{margin:0;padding:0;list-style:none}.course-steps li{display:grid;grid-template-columns:70px 1fr}.step-number{display:flex;align-items:center;flex-direction:column}.step-number span{display:grid;width:42px;height:42px;place-items:center;border:1px solid #cfd2d9;border-radius:50%;background:var(--paper);font:850 .7rem/1 ui-monospace,SFMono-Regular,Menlo,monospace}.step-number i{width:1px;flex:1;background:#cfd2d9}.course-steps li:last-child .step-number i{display:none}.course-steps li.is-read .step-number span{color:#fff;border-color:var(--accent);background:var(--accent)}.course-steps li.is-read .step-number span{font-size:0}.course-steps li.is-read .step-number span:after{content:"✓";font-size:.85rem}.course-steps li>a{display:grid;grid-template-columns:34% 66%;min-width:0;overflow:hidden;margin-bottom:24px;border:1px solid var(--line);border-radius:14px;background:#fff;transition:transform .2s,box-shadow .2s}.course-steps li>a:hover{transform:translateY(-2px);box-shadow:0 18px 42px rgba(26,29,38,.08)}.course-steps li>a>img{width:100%;height:100%;min-height:330px;object-fit:cover}.course-steps li>a>div{display:flex;flex-direction:column;padding:28px}.course-steps small{color:var(--accent);font-size:.68rem;font-weight:850}.course-steps h2{margin:8px 0 12px;font-size:1.25rem;line-height:1.5}.course-steps a p{margin:0;color:var(--muted);font-size:.82rem}.course-steps dl{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:22px 0}.course-steps dt{color:var(--muted);font-size:.66rem}.course-steps dd{margin:3px 0 0;font-size:.76rem;font-weight:800}.course-steps a b{margin-top:auto;font-size:.76rem}.read-label{display:none}.is-read .unread-label{display:none}.is-read .read-label{display:inline}.course-finish{display:grid;width:min(1100px,calc(100% - 40px));grid-template-columns:1fr auto;gap:40px;align-items:center;margin:95px auto;padding:48px;border-radius:18px;color:#fff;background:var(--dark)}.course-finish p{margin:0}.course-finish h2{margin:9px 0 12px;font-size:clamp(2rem,4vw,3.4rem);line-height:1.25;letter-spacing:-.05em}.course-finish>div>span{color:#bdc1cb;font-size:.82rem}.course-finish button{min-width:230px;padding:17px 20px;border:0;border-radius:9px;color:#aeb2bc;background:#3a3e49;font-weight:850}.course-finish.is-unlocked button{color:#241b19;background:#ff9c80;cursor:pointer}.unlocked-label{display:none}.is-unlocked .locked-label{display:none}.is-unlocked .unlocked-label{display:inline}.courses-hub-hero{width:min(1100px,calc(100% - 40px));margin:70px auto}.courses-hub-hero p{margin:0}.courses-hub-hero h1{margin:12px 0 20px;font-size:clamp(2.8rem,6vw,5.8rem);line-height:1.12;letter-spacing:-.06em}.courses-hub-hero>span{color:var(--muted)}.courses-grid{display:grid;padding:70px max(22px,calc((100vw - 1100px)/2));grid-template-columns:repeat(2,1fr);gap:16px;background:var(--paper)}.courses-grid>a{display:flex;min-height:320px;flex-direction:column;padding:34px;border:1px solid var(--line);border-radius:15px;background:#fff;transition:transform .2s,border-color .2s}.courses-grid>a:hover{border-color:var(--accent);transform:translateY(-3px)}.courses-grid>a>span{color:var(--accent);font:850 .7rem/1 ui-monospace,SFMono-Regular,Menlo,monospace}.courses-grid small{margin-top:34px;color:var(--muted);font-size:.68rem;font-weight:800}.courses-grid h2{margin:8px 0 12px;font-size:1.7rem;letter-spacing:-.04em}.courses-grid p{margin:0;color:var(--muted);font-size:.84rem}.courses-grid b{margin-top:auto;font-size:.78rem}footer{display:flex;align-items:center;justify-content:space-between;gap:25px;padding:35px max(22px,calc((100vw - 1100px)/2));color:#c2c6d0;background:#171a22}footer a{color:#fff;font-weight:850}footer p{margin:0;font-size:.72rem}
@media(max-width:760px){.course-hero{grid-template-columns:1fr;gap:30px}.course-steps li{grid-template-columns:48px 1fr}.course-steps li>a{grid-template-columns:1fr}.course-steps li>a>img{height:220px;min-height:0}.course-finish{grid-template-columns:1fr}.courses-grid{grid-template-columns:1fr}}@media(max-width:520px){.course-header{height:62px;padding:0 17px}.brand{font-size:.88rem}.course-header>a:last-child{font-size:.68rem}.course-hero{margin:45px auto 65px}.course-hero h1,.courses-hub-hero h1{font-size:2.65rem}.course-steps{padding:60px 17px}.course-steps li{grid-template-columns:38px 1fr}.step-number span{width:31px;height:31px}.course-steps li>a>div{padding:21px 18px}.course-steps dl{grid-template-columns:1fr}.course-finish{padding:30px 22px}.course-finish button{width:100%;min-width:0}.courses-grid{padding:55px 19px}.courses-grid>a{min-height:270px;padding:27px}footer{align-items:flex-start;flex-direction:column;padding:30px 19px}}

.course-hero h1,.course-section-head h2,.course-steps h2,.course-finish h2,.courses-hub-hero h1,.courses-grid h2{text-wrap:balance;line-break:strict;overflow-wrap:anywhere}
.course-hero h1{max-width:11em;font-size:clamp(2.8rem,5.2vw,5.2rem);line-height:1.16}
.courses-hub-hero h1{max-width:12em;font-size:clamp(2.8rem,5.3vw,5.25rem);line-height:1.16}
.course-finish h2{max-width:14em}
