:root{--ink:#182d3a;--blue:#087bbd;--yellow:#ffe16a;--line:2px solid var(--ink);font-family:'Yu Gothic','Hiragino Kaku Gothic ProN',Meiryo,sans-serif;color:var(--ink);background:#fffef8;font-size:16px;line-height:1.85;font-weight:500}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0}a{color:inherit;text-underline-offset:5px}a:hover{color:#00669f}a:focus-visible,summary:focus-visible{outline:3px solid #e96126;outline-offset:5px}img{display:block;max-width:100%;object-fit:cover}h1,h2,h3,p{margin:0}p+p{margin-top:1em}h2{font-size:clamp(1.6rem,3.2vw,2.5rem);line-height:1.5;font-weight:900}h3{font-size:1.4rem;line-height:1.5}strong{background:linear-gradient(transparent 65%,#ffe16a 65%)}.skip{position:absolute;left:12px;top:-80px;z-index:5;background:white;padding:12px}.skip:focus{top:12px}.masthead{max-width:1440px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px 5%}.brand{font-family:Arial,sans-serif;font-size:2.3rem;line-height:1;font-weight:950;letter-spacing:-2px;text-decoration:none}.brand span{display:block;font-family:Meiryo,sans-serif;letter-spacing:0;font-size:.8rem;margin-top:12px}.masthead nav{display:flex;align-items:center;gap:28px;font-size:.9rem;font-weight:700}.masthead nav>a:not(.button){text-decoration:none}.button{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:13px 25px;background:var(--yellow);color:var(--ink);border:var(--line);box-shadow:4px 4px 0 var(--ink);font-weight:900;text-decoration:none;line-height:1.5;transition:transform .15s,box-shadow .15s}.button:hover{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--ink);color:var(--ink);background:#ffeb97}.button.small{font-size:.9rem;min-height:44px;padding:10px 18px}.hero{max-width:1440px;margin:auto;padding:28px 5% 54px;display:grid;grid-template-columns:1fr 1.1fr;gap:5%;align-items:center}.eyebrow{font-size:.875rem;font-weight:900;letter-spacing:.1em;color:var(--blue);margin-bottom:18px}.hero h1{font-size:clamp(2.6rem,5.2vw,4.8rem);line-height:1.38;letter-spacing:-.04em;font-weight:950}.hero em{font-style:normal;color:var(--blue)}.intro{margin-top:26px;line-height:2}.actions{display:flex;align-items:center;flex-wrap:wrap;gap:22px;margin-top:28px}.actions>a:not(.button){font-size:.9rem;font-weight:800}.meta{font-size:.8rem;margin-top:20px;color:#4e626e}.hero-art{position:relative;border:3px solid var(--ink);transform:rotate(1.5deg);box-shadow:9px 9px 0 #c5eaf9;height:650px;max-height:66vw}.hero-art>img{height:100%;width:100%;object-position:50% 42%}.hero-bubble{position:absolute;top:24px;left:-28px;background:white;border:var(--line);border-radius:50%;padding:24px 32px;font-size:1rem;font-weight:900;transform:rotate(-5deg);box-shadow:3px 3px 0 var(--ink)}.hero-stamp{position:absolute;bottom:22px;right:-16px;background:var(--yellow);padding:9px 22px;border:var(--line);font-weight:900;transform:rotate(-7deg)}.chapter-strip{background:var(--ink);color:white;display:flex;justify-content:center;align-items:center;gap:38px;flex-wrap:wrap;padding:20px 24px;font-size:.9rem}.chapter-strip span{color:var(--yellow);font-weight:900}.chapter-strip a{text-decoration:none}.chapter-strip a:hover{color:var(--yellow)}.section{max-width:1160px;margin:auto;padding:72px 30px}.section-heading{text-align:center;margin-bottom:36px}.section-heading .eyebrow{margin-bottom:10px}.section-heading>p:last-child:not(.eyebrow){margin-top:16px}.cast-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px}.cast-grid article{display:grid;grid-template-columns:145px 1fr;align-items:center;gap:24px;border-bottom:var(--line);padding:18px 0 30px}.cast-grid img{width:145px;height:185px;border:var(--line);object-position:54% 45%}.cast-robo img{object-fit:contain;background:white}.tag{font-size:.875rem;color:var(--blue);font-weight:800}.cast-grid h3{margin:6px 0 12px;font-size:1.6rem}.cast-grid p{font-size:1rem}.lessons{padding-top:26px}.lesson{border:3px solid var(--ink);margin-top:36px;background:white;box-shadow:6px 6px 0 var(--ink);scroll-margin-top:28px}.lesson-heading{display:flex;align-items:center;gap:24px;background:var(--yellow);border-bottom:3px solid var(--ink);padding:22px 30px}.lesson-heading>span{font:900 3.5rem/1 Arial,sans-serif;letter-spacing:-4px}.lesson-heading p{font-size:.875rem}.lesson-heading h3{font-size:clamp(1.35rem,2.7vw,2rem);font-weight:900;margin-top:3px}.lesson-body{display:grid;grid-template-columns:1.25fr 1fr;gap:32px;padding:32px}.dialogue{display:grid;gap:22px}.speech{position:relative;border:var(--line);border-radius:18px;padding:16px 20px;font-size:1rem}.speech b{font-size:.875rem;display:block;margin-bottom:6px}.speech.sora{margin-right:26px;background:#fffdf0}.speech.robo{margin-left:26px;background:#eef9ff}.speech.sora b{color:#886015}.speech.robo b{color:#066798}.speech:before{content:'';position:absolute;width:12px;height:12px;top:25px;background:inherit;border-bottom:var(--line);border-left:var(--line);left:-8px;transform:rotate(45deg)}.speech.robo:before{left:auto;right:-8px;transform:rotate(225deg)}kbd{display:inline-block;border:1px solid #7a8990;border-bottom:3px solid #7a8990;border-radius:5px;background:#fff;padding:0 7px;font:700 .9em/1.8 Consolas,monospace;white-space:nowrap;color:var(--ink)}.lesson aside{align-self:center;text-align:center;padding:28px 18px;background:radial-gradient(#bbd9e7 1px,transparent 1px) 0 0/9px 9px,#f2faff;border:var(--line)}.panel-label{font-size:.875rem;display:block;font-weight:800;margin-bottom:24px}.big-key{display:grid;justify-items:center;gap:10px;margin:24px 0}.big-key kbd{font-size:2.4rem;padding:2px 22px;border:var(--line);border-bottom-width:6px}.big-key span{font-weight:800}.key-panel p,.target-panel p{margin:22px 0}.key-panel>a{font-weight:800}.wind-layer{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:21px 12px;border-bottom:1px dashed #5b96ae;background:#d4ecfc}.wind-layer:nth-child(3){background:#e5f3ff}.wind-layer:nth-child(4){background:#f1f9ff}.wind-layer b{font-size:2rem;color:#086d9b;white-space:nowrap}.wind-layer span{font-size:.875rem;font-weight:800}.wind-panel p{font-size:.875rem;margin-top:24px}.target-x{display:block;color:#e55b19;background:none;font-size:9rem;line-height:1.1;font-family:Arial,sans-serif}.adventure{margin:48px 0 12px;position:relative;border:3px solid var(--ink);overflow:hidden}.adventure img{width:100%;height:auto}.adventure figcaption{background:var(--ink);color:white;padding:12px 24px;font-size:1.1rem;font-weight:800}.reference{padding-top:20px}.reference-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px}.reference h3{margin-bottom:24px}.controls{margin:0}.controls>div{display:grid;grid-template-columns:1fr 1fr;gap:12px;border-bottom:1px solid #c9d3d8;padding:12px 0;font-size:.9rem}dd{margin:0}.note{background:#eaf7ff;border-left:4px solid var(--blue);padding:20px;margin-top:26px}.note>b{font-size:.875rem;color:var(--blue)}.note p{margin-top:10px}details{border-bottom:var(--line)}details:first-of-type{margin-top:36px;border-top:var(--line)}summary{padding:22px 4px;font-size:1.05rem;font-weight:800;cursor:pointer}summary:hover{color:var(--blue)}.detail-content{padding:0 24px 28px}.detail-content .button{margin:20px 0}.instruments>div{display:grid;grid-template-columns:180px 1fr;gap:18px;padding:10px 0}.instruments dt{font-weight:800}.workshop{display:grid;grid-template-columns:.85fr 1fr;gap:70px;align-items:center;border-top:var(--line);padding-top:60px}.workshop>img{width:100%;height:auto;border:var(--line);transform:rotate(-2deg);box-shadow:6px 6px 0 #d5e5ec}.workshop h2{font-size:clamp(1.8rem,3.4vw,3rem);margin-bottom:28px}.closing-line{font-weight:900;margin:26px 0!important}.links{padding-top:20px;padding-bottom:60px}.links h2{font-size:1.3rem;margin-bottom:20px}.links a{display:inline-block;margin:0 24px 14px 0;font-size:.9rem}footer{background:var(--ink);color:#fff;padding:45px max(24px,calc((100% - 1100px)/2));font-size:.875rem}footer .brand{display:inline-block;color:var(--yellow);margin-bottom:20px}footer .credits{font-size:.8rem;color:#bfd3df;margin-top:24px}footer a:hover{color:#ffe16a}
@media(max-width:950px){.masthead{align-items:flex-start}.masthead nav{gap:16px}.masthead nav>a:not(.button){display:none}.hero{gap:28px}.hero-art{height:550px}.hero-bubble{left:-18px;padding:18px;font-size:.875rem}.cast-grid article{grid-template-columns:100px 1fr;gap:16px}.cast-grid img{width:100px;height:150px}.lesson-body{gap:22px;padding:24px}.reference-grid{gap:28px}.workshop{gap:40px}.chapter-strip{gap:20px}.hero .actions{gap:18px}.hero .button{font-size:.9rem;padding:12px 16px}}
@media(max-width:680px){.masthead{padding:20px;gap:10px}.brand{font-size:2rem}.brand span{font-size:.75rem;line-height:1.6;max-width:180px;margin-top:7px}.masthead .button.small{font-size:.875rem;padding:9px 12px}.hero{padding:20px 24px 40px;grid-template-columns:1fr;gap:32px}.hero h1{font-size:clamp(2.6rem,10vw,4rem)}.hero h1 br:nth-child(2){display:none}.hero .eyebrow{margin-bottom:12px}.intro{font-size:1rem;margin-top:18px}.hero-art{height:460px;max-height:none;margin:0 6px}.hero-art>img{object-position:50% 43%}.hero-bubble{font-size:.875rem;left:-12px;top:18px}.hero-stamp{right:-10px;font-size:.9rem}.chapter-strip{display:grid;grid-template-columns:1fr;gap:10px;padding:22px 28px}.chapter-strip a{padding:3px 0}.section{padding:48px 22px}.section-heading{margin-bottom:26px}.cast-grid{grid-template-columns:1fr;gap:14px}.cast-grid article{grid-template-columns:100px 1fr;gap:18px}.cast-grid img{width:100px;height:160px}.cast-grid h3{font-size:1.4rem}.lesson-heading{padding:18px 16px;gap:16px}.lesson-heading>span{font-size:2.6rem;letter-spacing:-2px}.lesson-body{grid-template-columns:1fr;padding:22px 16px}.speech{padding:14px}.speech.sora{margin-right:16px}.speech.robo{margin-left:16px}.lesson aside{width:100%;padding:24px 16px}.key-panel{display:grid;grid-template-columns:1fr 1fr;gap:12px}.key-panel>.panel-label,.key-panel>p,.key-panel>a{grid-column:1/-1}.key-panel .panel-label{margin-bottom:0}.big-key{margin:6px 0}.big-key kbd{font-size:1.5rem;padding:2px 12px}.big-key span{font-size:.875rem}.key-panel p{margin:8px 0}.adventure{margin:36px 0 0}.adventure figcaption{font-size:.875rem;padding:10px 12px}.reference-grid{grid-template-columns:1fr;gap:36px}.instruments>div{grid-template-columns:1fr;gap:4px}.detail-content{padding:0 8px 24px}.workshop{grid-template-columns:1fr;gap:32px}.workshop>img{width:min(100%,380px);justify-self:center}.workshop h2 br{display:none}.links{padding-top:12px}.links a{display:block;margin:14px 0}footer{padding:36px 24px}.lessons{padding-top:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.button{transition:none}}
