:root{--ink:#173d4d;--blue:#087cad;--paper:#fffdf5;--yellow:#ffdb61;--line:2px solid var(--ink);font-family:'Yu Gothic',Meiryo,sans-serif;color:var(--ink);background:var(--paper);font-size:16px;line-height:1.95}*{box-sizing:border-box}body{margin:0}html{scroll-behavior:smooth;scroll-padding-top:22px}a{color:inherit;text-underline-offset:5px}a:hover{color:#00749e}a:focus-visible,summary:focus-visible{outline:3px solid #d96122;outline-offset:5px}h1,h2,h3,p,figure{margin:0}p+p{margin-top:14px}img{max-width:100%;display:block}rt{font-size:.56em;font-weight:500}ruby{ruby-align:center}h1{font-size:clamp(2.5rem,4.4vw,4.1rem);line-height:1.65;letter-spacing:-.035em}h1 rt{font-size:.23em}h1 em{font-style:normal;color:var(--blue)}h2{font-size:clamp(1.5rem,2.7vw,2.35rem);line-height:1.8}h3{font-size:1.25rem;line-height:1.8}strong{background:linear-gradient(transparent 68%,#ffe68f 68%)}.skip{position:absolute;top:-100px;background:white;padding:10px;z-index:10}.skip:focus{top:8px}.masthead{max-width:1320px;margin:auto;padding:24px 36px;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{font:900 1.9rem/1.2 Arial,sans-serif;text-decoration:none;letter-spacing:-1px}.brand span{display:block;font:600 .72rem/2.1 Meiryo,sans-serif;letter-spacing:0;margin-top:7px}.masthead nav{display:flex;align-items:center;gap:25px;font-size:.9rem;font-weight:700}.masthead nav>a{text-decoration:none}.button{display:inline-flex;align-items:center;justify-content:center;background:var(--yellow);border:var(--line);box-shadow:4px 4px 0 var(--ink);min-height:54px;padding:12px 23px;text-decoration:none;font-weight:800;line-height:2}.button:hover{background:#ffe99b;transform:translateY(-2px)}.button.small{font-size:.9rem;padding:8px 18px;min-height:44px}.hero{max-width:1320px;margin:auto;padding:32px 36px 62px;display:grid;grid-template-columns:1.04fr 1fr;gap:40px;align-items:center}.eyebrow{font:800 .75rem/1.5 Arial,sans-serif;letter-spacing:.15em;color:var(--blue);margin-bottom:14px}.edition{font-size:.8rem;margin:0 0 18px;display:inline-block;border-bottom:2px solid #ffcd4f}.lead{font-size:1.05rem;line-height:2.2;margin-top:20px}.actions{display:flex;align-items:center;gap:24px;flex-wrap:wrap;margin:25px 0 18px}.text-link{font-weight:800}.caption{font-size:.78rem;line-height:1.9;color:#4c6571;margin-top:12px}.hero-art{height:600px;border:3px solid var(--ink);position:relative;overflow:hidden;background:#d8edf4;box-shadow:9px 9px 0 #bcdce5;transform:rotate(1deg)}.hero-sora{position:absolute;inset:0;background-image:url('./png/guide-20260923/characters.png');background-size:auto 123%;background-position:0 30%}.hero-robo{position:absolute;bottom:0;right:-10px;width:46%;mix-blend-mode:multiply;filter:drop-shadow(2px 4px 1px #7893a1)}.hero-bubble{position:absolute;top:24px;right:16px;border:var(--line);border-radius:50%;background:white;padding:22px 30px;transform:rotate(5deg);font-weight:900;font-size:1.15rem;line-height:2.1}.art-note{position:absolute;left:14px;bottom:12px;font-size:.65rem;background:#fffc;padding:2px 8px}.feature-strip{background:var(--ink);color:white;padding:22px 30px;display:flex;justify-content:center;gap:30px;align-items:center;flex-wrap:wrap;font-size:.9rem}.feature-strip>span{color:var(--yellow);font:bold .75rem Arial;letter-spacing:.1em}.feature-strip a{color:white;text-decoration:none}.feature-strip a:hover{color:var(--yellow)}.section{max-width:1240px;margin:auto;padding:60px 36px}.section-head{margin-bottom:30px}.section-head>p:last-child:not(.eyebrow){margin-top:10px}.cast{padding-bottom:28px}.cast-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.cast-grid article{display:grid;grid-template-columns:72px 1fr;align-items:center;column-gap:12px}.cast-grid .portrait{grid-row:1/3;width:72px;height:72px}.cast-grid h3{font-size:.85rem}.cast-grid p{font-size:.8rem;line-height:1.8}.portrait{display:block;flex-shrink:0;width:60px;height:60px;border:2px solid var(--ink);border-radius:50%;background-color:#f6eddc;background-image:url('./png/guide-20260923/characters.png');background-repeat:no-repeat}.portrait.sora{background-size:600%;background-position:53.5% 65%}.portrait.cloudy{background-size:640%;background-position:40% 91%}.portrait.compass{background-size:640%;background-position:62.2% 91%}.portrait.robo{background-image:url('./png/guide-20260923/br05.png');background-size:180%;background-position:49% 0;background-color:#e6f3f7}.comic-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;align-items:start}.panel{border:var(--line);background:white;box-shadow:5px 5px 0 var(--ink);scroll-margin-top:24px;overflow:hidden}.panel>header{display:flex;align-items:center;gap:18px;padding:18px 24px;background:#f8df81;border-bottom:var(--line)}.panel:nth-child(4n+3)>header,.panel:nth-child(4n+4)>header{background:#d5ebf3}.number{font:900 2.8rem/1 Arial;letter-spacing:-2px}.kicker{font:800 .65rem Arial;letter-spacing:.1em;display:block;margin-bottom:5px}.panel-content{padding:24px;display:grid;gap:20px}.talk{display:flex;align-items:flex-start;gap:12px}.bubble{position:relative;min-width:0;border:1.5px solid #73919e;border-radius:3px 16px 16px 16px;padding:12px 16px;background:#fffbed;flex:1}.bubble b{display:block;font-size:.72rem;color:#76602c;margin-bottom:3px}.bubble p{font-size:.95rem;line-height:2.1;overflow-wrap:anywhere}.talk.robo .bubble{background:#edf7fb}.talk.robo b{color:#23667e}.talk.cloudy .bubble{background:#f0faf7}.talk.compass .bubble{background:#fff4e9}.ui{font-weight:700}.screen{border:1px solid #a9bdc5;background:#edf4f6}.screen img{width:100%;height:auto}.screen figcaption{padding:10px 12px;font-size:.72rem;line-height:1.9}.screen a{display:block}.team{display:flex;gap:8px;flex-wrap:wrap;font-size:.8rem}.team span{background:#f2f5f4;padding:7px 10px}.tip{padding:16px;background:#f2f7f8;border-left:4px solid var(--blue);font-size:.85rem}.tip>b{font-size:.85rem}.gesture{display:flex;justify-content:space-around;background:#e8f3f7;padding:20px;text-align:center}.gesture>span{font-size:2.5rem;font-weight:900}.gesture small{display:block;font-size:.8rem;font-weight:500}.score-pair{display:grid;grid-template-columns:1fr 1fr;border:var(--line)}.score-pair>div{padding:18px 10px;text-align:center;background:#ffedac}.score-pair>div+div{border-left:var(--line);background:#e3f1f7}.score-pair small{display:block;font-size:.75rem}.score-pair strong{font:bold 2.5rem/1.5 Arial;display:block;background:none}.score-pair strong small{display:inline;margin-left:4px}kbd{display:inline-block;padding:0 6px;font:bold .9em/1.65 Consolas,monospace;border:1px solid #8298a3;border-bottom:3px solid #8298a3;border-radius:4px;background:white;white-space:nowrap;margin:0 1px}.controls-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px}.notebook{padding:26px;border:var(--line);background:white}.notebook h3{margin-bottom:18px}.notebook p{font-size:.95rem}dl{margin:0}dl>div{display:grid;grid-template-columns:1fr 1.3fr;gap:14px;border-bottom:1px dashed #c1cfd4;padding:10px 0;font-size:.9rem}dd{margin:0}details{border-bottom:1px solid #91aab4;padding:15px 0;font-size:.95rem}summary{cursor:pointer;font-weight:800;min-height:44px;align-content:center}details>p{padding:12px 8px;line-height:2.2}details .button{margin:8px}.finish{text-align:center;border-top:var(--line)}.finish .actions{justify-content:center}.sora-link{font-size:.85rem;margin-top:24px}footer{padding:40px max(28px,calc((100% - 1168px)/2));background:var(--ink);color:#fff;font-size:.8rem}footer .brand{display:inline-block;margin-bottom:22px;color:var(--yellow)}footer a:hover{color:var(--yellow)}.credits{color:#c9dfe7;margin:18px 0}
@media(max-width:1000px){.hero{gap:24px}.hero-art{height:540px}.hero-bubble{font-size:.95rem;padding:16px}.cast-grid{grid-template-columns:1fr 1fr}.panel-content{padding:18px}.portrait{width:48px;height:48px}.talk{gap:9px}.bubble{padding:10px 12px}.panel>header{padding:16px}.panel h3{font-size:1.15rem}.hero h1{font-size:2.7rem}}
@media(max-width:720px){.masthead{padding:18px 20px;align-items:start;gap:12px}.brand{font-size:1.55rem}.brand span{font-size:.62rem;max-width:220px}.masthead nav>a:not(.button){display:none}.masthead nav{gap:0}.masthead .button{padding:8px 12px;white-space:nowrap}.hero{grid-template-columns:1fr;padding:20px 22px 40px;gap:25px}.hero h1{font-size:clamp(2.1rem,8vw,3.3rem)}.hero-art{height:440px;margin-right:7px}.hero-sora{background-size:auto 130%}.hero-robo{width:43%}.hero-bubble{font-size:1rem;right:12px}.lead{font-size:.95rem}.edition{font-size:.73rem}.hero .actions{gap:18px}.button{font-size:.92rem;padding:10px 17px}.feature-strip{justify-content:flex-start;gap:12px 20px;padding:22px;font-size:.78rem}.feature-strip>span{width:100%}.section{padding:42px 20px}.cast{padding-bottom:0}.cast-grid{gap:20px 14px}.cast-grid article{grid-template-columns:1fr;text-align:center;justify-items:center;gap:7px}.cast-grid .portrait{grid-row:auto;width:72px;height:72px}.cast-grid h3{font-size:.75rem}.cast-grid p{font-size:.72rem}.comic-grid{grid-template-columns:1fr;gap:26px}.panel-content{padding:20px 16px}.portrait{width:48px;height:48px}.bubble p{font-size:.93rem}.panel>header{gap:15px;padding:16px}.controls-grid{grid-template-columns:1fr;gap:18px}.notebook{padding:20px}.score-pair strong{font-size:2.2rem}.finish .actions{flex-direction:column;gap:20px}.section-head{margin-bottom:24px}.section-head p{font-size:.87rem}.team{gap:5px}.team span{font-size:.72rem;padding:5px 7px}dl>div{grid-template-columns:1fr 1.1fr;font-size:.8rem}.caption{font-size:.72rem}}
img{height:auto}.hero-sora{background-size:300% auto;background-position:left 36%}.hero-robo{height:auto;width:36%;right:14px;bottom:25px;background:#fff;border:2px solid var(--ink);border-radius:24px;mix-blend-mode:normal;filter:none;box-shadow:4px 4px 0 #173d4d44}
@media(max-width:720px){.hero-sora{background-size:300% auto;background-position:left 36%}.hero-robo{width:34%;bottom:32px}.hero-bubble{padding:12px 18px}}
.portrait.sora{background-size:1100%;background-position:49.2% 66%}.portrait.cloudy{background-size:780%;background-position:41% 94%}.portrait.compass{background-size:780%;background-position:60.5% 94%}.hero-sora{background-image:url('./png/sora-hero.jpg');background-size:cover;background-position:50% 40%}.hero-bubble{left:16px;right:auto;top:18px}.hero-art .art-note{background:#fffef0e8}
.reading-switch{max-width:1248px;margin:0 auto;padding:10px 24px;display:flex;flex-wrap:wrap;gap:10px;border-block:1px solid #d8e3e8;font-size:.85rem}.reading-switch a{display:inline-flex;align-items:center;min-height:44px;padding:8px 16px;border-radius:6px;text-decoration:none;font-weight:700}.reading-switch a[aria-current="page"]{background:var(--ink);color:white}.reading-switch a:not([aria-current]):hover{background:#e6f3f8}@media(max-width:720px){.reading-switch{padding:10px 20px;gap:5px;font-size:.78rem}.reading-switch a{padding:8px 10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.button:hover{transform:none}}