:root{--bg:#eef3ff;--dot:#d3dcf7;--sheet:#fff;--line:#d9e0f5;--line-strong:#b8c4ea;--ink:#1e2350;--ink-soft:#5a6290;--key:#3d5cff;--key-edge:#2a3ec2;--key-soft:#e5eaff;--lilac:#9b7bff;--lilac-ink:#6a48e0;--lilac-soft:#f1ecff;--lilac-line:#dccfff;--console:#1e2350;--console-ink:#e3e8ff;--focus-bar:#e8b400;--focus-bg:#fff5c2;--del-bg:#fbe3e1;--del-mark:#f3b9b4;--del-ink:#9b2219;--ins-bg:#ddf2e2;--ins-mark:#a9dcb6;--ins-ink:#1c6431;--font-round:"Zen Maru Gothic", "Hiragino Maru Gothic ProN", "BIZ UDPGothic", sans-serif;--font-body:"BIZ UDPGothic", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic UI", Meiryo, sans-serif;--font-code:"M PLUS 1 Code", "BIZ UDGothic", Menlo, Consolas, monospace;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{background-color:var(--bg);background-image:radial-gradient(var(--dot) 1.3px, transparent 1.6px);color:var(--ink);font-family:var(--font-body);background-size:22px 22px;min-height:100vh;margin:0;font-size:16px;line-height:1.8}a{color:var(--key)}button{font:inherit}:focus-visible{outline:3px solid var(--key);outline-offset:3px;border-radius:6px}.page{max-width:80rem;margin:0 auto;padding:32px 24px 64px}.page>*{text-align:center;max-width:46rem;margin-inline:auto}.page>.scenes,.page>nav{max-width:none}.page>:is(.scenes,.progress,.notes){text-align:left}.page :is(.masthead p,.subject,.lead,.drop h2,.drop p,.empty p,.colophon p){text-wrap:balance;word-break:auto-phrase}.masthead{flex-wrap:wrap;justify-content:center;align-items:center;gap:8px 14px;margin-bottom:32px;display:flex}.masthead p{color:var(--ink-soft);margin:0;font-size:14px}.wordmark{font-family:var(--font-round);gap:.18em;margin:0 0 4px;font-size:20px;font-weight:700;line-height:1.5;display:inline-flex}.wordmark .key{background:var(--sheet);border:2px solid var(--ink);box-shadow:0 .16em 0 var(--ink);border-radius:.38em;align-items:center;padding:0 .32em;display:inline-flex}.wordmark .key.re{background:var(--lilac-soft);color:var(--lilac-ink)}.wordmark .caret{background:var(--key);border-radius:1px;width:.09em;height:.95em;margin-left:.08em;display:none}.page:has(.drop) .masthead{flex-direction:column;gap:16px;margin-top:16px;margin-bottom:36px}.page:has(.drop) .wordmark{font-size:44px}.page:has(.drop) .wordmark .key{border-width:3px}.page:has(.drop) .masthead p{font-size:16px}.page:has(.drop) .caret{animation:1.1s step-end infinite blink;display:inline-block}@keyframes blink{50%{opacity:0}}.sheet{background:var(--sheet);border:2px solid var(--line);border-radius:20px;padding:24px}.drop{border:3px dashed var(--line-strong);background:var(--sheet);border-radius:24px;justify-items:center;gap:16px;padding:32px 28px 28px;transition:border-color .15s,background .15s;display:grid}.drop.over{border-style:solid;border-color:var(--key);background:var(--key-soft)}.drop h2{font-family:var(--font-round);margin:0;font-size:24px;font-weight:700;line-height:1.5}.drop p{margin:0}.drop .button{margin:4px 0 6px}.privacy{color:var(--ink-soft);font-size:14px}.privacy:before{content:"";vertical-align:-2px;background:currentColor;width:16px;height:16px;margin-right:6px;display:inline-block;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 7V5a3.5 3.5 0 0 1 7 0v2h.5A1.5 1.5 0 0 1 13.5 8.5v5A1.5 1.5 0 0 1 12 15H4a1.5 1.5 0 0 1-1.5-1.5v-5A1.5 1.5 0 0 1 4 7zm1.8 0h3.4V5a1.7 1.7 0 0 0-3.4 0z'/%3E%3C/svg%3E") 50%/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 7V5a3.5 3.5 0 0 1 7 0v2h.5A1.5 1.5 0 0 1 13.5 8.5v5A1.5 1.5 0 0 1 12 15H4a1.5 1.5 0 0 1-1.5-1.5v-5A1.5 1.5 0 0 1 4 7zm1.8 0h3.4V5a1.7 1.7 0 0 0-3.4 0z'/%3E%3C/svg%3E") 50%/contain no-repeat}.button{appearance:none;border:2px solid var(--key-edge);background:var(--key);color:#fff;box-shadow:0 4px 0 var(--key-edge);cursor:pointer;font-family:var(--font-round);border-radius:12px;padding:10px 22px;font-weight:700;transition:transform 80ms,box-shadow 80ms}.button:hover{background:#5170ff}.button:active{box-shadow:0 1px 0 var(--key-edge);transform:translateY(3px)}.button.quiet{background:var(--sheet);color:var(--key);border-color:var(--line-strong);box-shadow:0 4px 0 var(--line-strong)}.button.quiet:hover{background:var(--key-soft)}.button.quiet:active{box-shadow:0 1px 0 var(--line-strong)}.progress{gap:22px;display:grid}.step{gap:8px;display:grid}.step-name{justify-content:space-between;gap:12px;font-size:15px;display:flex}.step-name span:first-child{font-family:var(--font-round);font-weight:700}.step-name span:last-child{color:var(--ink-soft);font-variant-numeric:tabular-nums}.bar{background:var(--key-soft);border-radius:999px;height:12px;overflow:hidden}.bar>div{background:var(--key);border-radius:999px;width:0;height:100%;transition:width .2s}.step.waiting{opacity:.55}.step.ongoing .bar>div{width:30%;transition:none;animation:1.4s ease-in-out infinite alternate ongoing}@keyframes ongoing{0%{transform:translate(0)}to{transform:translate(234%)}}@media (prefers-reduced-motion:reduce){.step.ongoing .bar>div{opacity:.4;width:100%;animation:none}}.subject{font-family:var(--font-round);overflow-wrap:anywhere;margin-top:0;margin-bottom:4px;font-size:28px;font-weight:700;line-height:1.5}.subject .re{background:var(--lilac-soft);color:var(--lilac-ink);border:2px solid var(--lilac-line);vertical-align:.12em;border-radius:999px;margin-right:.3em;padding:0 .45em;font-size:.72em;display:inline-block}.lead{color:var(--ink-soft);margin-top:0;margin-bottom:24px;font-size:15px}nav .lead{margin-bottom:12px}.records{border-bottom:2px solid var(--line-strong);justify-content:safe center;gap:6px;margin:0 0 28px;padding:0 4px;list-style:none;display:flex;overflow-x:auto}.records li{flex:none}.records button{appearance:none;border:2px solid var(--line);background:var(--key-soft);color:var(--ink-soft);cursor:pointer;font-family:var(--font-code);border-bottom:none;border-radius:12px 12px 0 0;padding:6px 16px 4px;font-size:14px}.records button:hover{color:var(--ink)}.records button:focus-visible{outline-offset:-3px}.records button[aria-pressed=true]{background:var(--sheet);border-color:var(--line-strong);color:var(--ink);box-shadow:inset 0 3px 0 var(--key);font-weight:500}.scene-axis{background:var(--sheet);border:2px solid var(--line);border-radius:20px;padding:20px 28px 16px;container-type:inline-size}.axis-head{margin-bottom:14px}.axis-head h3{font-family:var(--font-round);margin:0;font-size:19px;font-weight:700;line-height:1.5}.axis-head p{color:var(--ink-soft);margin:2px 0 0;font-size:14px}.axis{--row:54px;--rail-gap:14px;--L:var(--lanes-narrow)}.scene-pin{--l:var(--lane-narrow)}@container (width>=1060px){.axis{--L:var(--lanes-wide)}.scene-pin{--l:var(--lane-wide)}}.scene-pins{height:calc(var(--L) * var(--row));margin:0;padding:0;list-style:none;position:relative}.scene-pin{left:calc(var(--x) * 100%);top:calc(var(--l) * var(--row));width:0;height:0;position:absolute}.scene-key{z-index:1;transform:translateX(calc(var(--x) * -100%));appearance:none;border:2px solid var(--line-strong);background:var(--sheet);max-width:100cqw;height:44px;color:var(--ink);box-shadow:0 4px 0 var(--line-strong);cursor:pointer;font-family:var(--font-round);white-space:nowrap;border-radius:12px;align-items:center;gap:8px;padding:0 14px 0 6px;font-size:14px;font-weight:700;transition:transform 80ms,box-shadow 80ms;display:inline-flex;position:absolute;top:0;left:0}.scene-key:hover{background:var(--key-soft)}.scene-no{background:var(--key);color:#fff;font-variant-numeric:tabular-nums;border-radius:8px;flex:none;place-items:center;min-width:28px;height:28px;font-size:15px;display:grid}.scene-label{text-overflow:ellipsis;overflow:hidden}.scene-label code{font-family:var(--font-code);font-size:.92em}.scene-key[aria-pressed=true]{background:var(--key);border-color:var(--key-edge);color:#fff;box-shadow:0 1px 0 var(--key-edge);transform:translate(calc(var(--x) * -100%), 3px)}.scene-key[aria-pressed=true] .scene-no{background:var(--sheet);color:var(--key)}.scene-leader{width:2px;height:calc((var(--L) - var(--l)) * var(--row) - 44px + var(--rail-gap) + 4px);background:var(--line-strong);position:absolute;top:44px;left:-1px}.scene-pin:has([aria-pressed=true]) .scene-leader{background:var(--key)}.axis-rail{height:8px;margin-top:var(--rail-gap);background:var(--line);border-radius:999px;position:relative}.axis-dot{border:3px solid var(--ink-soft);background:var(--sheet);border-radius:50%;width:14px;height:14px;position:absolute;top:50%;transform:translate(-50%,-50%)}.axis-band{background:var(--key-soft);min-width:4px;height:14px;box-shadow:inset 0 0 0 2px var(--key);z-index:1;border-radius:999px;position:absolute;top:-3px}.axis-band:before,.axis-band:after{content:"";border:3px solid var(--sheet);background:var(--key);border-radius:50%;width:16px;height:16px;position:absolute;top:50%;transform:translate(-50%,-50%)}.axis-band:before{left:0}.axis-band:after{left:100%}.axis-gap{background:repeating-linear-gradient(-45deg, var(--ink-soft) 0 2px, var(--sheet) 2px 5px);border-radius:2px;min-width:4px;position:absolute;top:0;bottom:0}.axis-cut{background:var(--ink-soft);border-radius:1px;width:2px;height:20px;position:absolute;top:-6px;transform:translate(-50%)}.axis-ticks{height:20px;color:var(--ink-soft);font-variant-numeric:tabular-nums;margin-top:8px;font-size:12px;line-height:20px;position:relative}.axis-tick{left:calc(var(--x) * 100%);white-space:nowrap;position:absolute;transform:translate(-50%)}.axis-tick.end{transform:translateX(calc(var(--x) * -100%))}.axis-ends{color:var(--ink-soft);justify-content:space-between;margin:4px 0 0;font-size:12px;display:flex}.axis-caption{color:var(--ink-soft);margin:10px 0 0;font-size:13px}.axis-legend{color:var(--ink-soft);flex-wrap:wrap;gap:2px 18px;margin:4px 0 0;padding:0;font-size:13px;list-style:none;display:flex}.axis-legend .mark{vertical-align:-1px;margin-right:6px;display:inline-block}.axis-legend .mark.gap{background:repeating-linear-gradient(-45deg, var(--ink-soft) 0 2px, var(--sheet) 2px 5px);border-radius:2px;width:18px;height:8px}.axis-legend .mark.cut{vertical-align:-2px;background:var(--ink-soft);width:2px;height:14px}.empty-axis p{color:var(--ink-soft);text-align:center;margin:0}.recheck,.practice-note,.structure-note{text-align:center;color:var(--ink-soft);text-wrap:balance;word-break:auto-phrase;margin:10px 0 0;font-size:13px}.recheck+.practice-note,.recheck+.structure-note,.practice-note+.structure-note{margin-top:4px}.scene-detail{margin-top:20px}.detail-bar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 16px;margin-bottom:12px;display:flex}.detail-count{font-family:var(--font-round);font-variant-numeric:tabular-nums;margin:0;font-size:18px;font-weight:700}.detail-count span{color:var(--ink-soft);font-weight:500}.detail-bar .button{padding:6px 16px;font-size:14px}.visually-hidden{clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.advice{background:var(--sheet);border:2px solid var(--line);border-radius:20px;padding:24px 28px 26px}.advice-head{background:var(--lilac-soft);border-bottom:2px solid var(--lilac-line);border-radius:18px 18px 0 0;margin:-24px -28px 22px;padding:18px 28px 20px}.next-tag{background:var(--lilac);color:#fff;font-family:var(--font-round);border-radius:999px;margin:0 0 6px;padding:0 12px;font-size:14px;font-weight:700;line-height:1.6;display:inline-block}.advice h3{font-family:var(--font-round);text-wrap:pretty;word-break:auto-phrase;margin:0;font-size:24px;font-weight:700;line-height:1.5}.advice h3 code,.reply code{font-family:var(--font-code);background:var(--key-soft);white-space:nowrap;border-radius:6px;padding:0 5px;font-size:.92em}.advice h3 code{background:var(--sheet)}.quote{background:var(--console);width:-moz-fit-content;width:fit-content;max-width:100%;color:var(--console-ink);font-family:var(--font-code);overflow-wrap:anywhere;border-radius:10px;margin:0 0 14px;padding:8px 14px;font-size:13px;line-height:1.6}.quote:before{content:"> ";color:#b9a3ff}.reply{grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:start;gap:20px 32px;display:grid}.part-title{font-family:var(--font-round);color:var(--ink-soft);margin:0 0 8px;font-size:14px;font-weight:700;line-height:1.6}.where{flex-wrap:wrap;align-items:baseline;gap:4px 8px;margin:0 0 12px;font-weight:700;display:flex}.issue-label{color:var(--ink)}.line-tag{border-left:4px solid var(--focus-bar);background:var(--focus-bg);font-family:var(--font-code);white-space:nowrap;border-radius:3px 6px 6px 3px;padding:0 8px 0 6px;font-size:.86em;font-weight:500;display:inline-block}.steps{margin:0;padding:0;font-size:15px;line-height:1.7;list-style:none}.steps li{color:var(--ink-soft);padding:0 0 10px 26px;position:relative}.steps li:last-child{color:var(--ink);padding-bottom:0}.steps li:before{content:"";border:2px solid var(--line-strong);background:var(--sheet);border-radius:50%;width:13px;height:13px;position:absolute;top:.4em;left:3px}.steps li:last-child:before{border-color:var(--ink-soft);background:var(--ink-soft)}.steps li:not(:last-child):after{content:"";background:var(--line);width:2px;position:absolute;top:calc(.4em + 13px);bottom:-.4em;left:8.5px}.checks{counter-reset:check;gap:6px;margin:0;padding:0;font-size:15px;line-height:1.7;list-style:none;display:grid}.checks li{counter-increment:check;background:var(--sheet);border:2px solid var(--lilac-line);border-radius:10px;padding:6px 12px 6px 40px;position:relative}.checks li:before{content:counter(check);border:2px solid var(--lilac);width:20px;height:20px;color:var(--lilac-ink);font-family:var(--font-round);border-radius:6px;place-items:center;font-size:12px;line-height:1;display:grid;position:absolute;top:8px;left:10px}.checks li:only-child{padding-left:14px}.checks li:only-child:before{content:none}.check-note{color:var(--ink-soft);margin:8px 0 0;font-size:14px;font-weight:400}@media (max-width:900px){.reply{grid-template-columns:minmax(0,1fr)}}@media (max-width:520px){.page{padding-left:16px;padding-right:16px}.advice{padding:18px 16px 16px}.advice-head{margin:-18px -16px 18px;padding:14px 16px 16px}.advice h3{font-size:20px}.scene-axis{padding:16px 16px 14px}.sheet{padding:18px 16px}.drop{padding:24px 18px 20px}.page:has(.drop) .wordmark{font-size:36px}}.scenes+.empty{margin-top:20px}.empty{background:var(--sheet);border:2px solid var(--line);border-radius:20px;padding:22px 24px}.empty h3{font-family:var(--font-round);margin:0 0 6px;font-size:19px;font-weight:700}.empty p{color:var(--ink-soft);margin:0}.notes{background:var(--key-soft);color:var(--ink-soft);border-radius:14px;margin-top:28px;padding:14px 20px;font-size:14px}.notes h3{font-family:var(--font-round);color:var(--ink);margin:0 0 4px;font-size:14px;font-weight:700}.notes ul{margin:0;padding-left:1.2em}.again{margin-top:32px}.evidence{border-top:2px dashed var(--line);margin-top:22px;padding-top:16px}.compare{gap:10px;display:grid}.compare-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 16px;display:flex}.compare-note{color:var(--ink-soft);margin:0;font-size:13px}.legend{flex-wrap:wrap;align-items:center;gap:4px 14px;margin:0;font-size:13px;display:flex}.legend .swatch{vertical-align:-2px;border-radius:3px;width:14px;height:14px;margin-right:4px;display:inline-block}.swatch.focus{background:var(--focus-bg);box-shadow:inset 4px 0 0 var(--focus-bar)}.swatch.del{background:var(--del-mark)}.swatch.ins{background:var(--ins-mark)}.compare-tools{justify-content:flex-end;margin-left:auto;display:flex}.compare-tools:empty{display:none}.compare-tools .button{box-shadow:0 3px 0 var(--line-strong);border-radius:10px;padding:4px 14px;font-size:14px}.compare-tools .button:active{box-shadow:0 1px 0 var(--line-strong)}.tabs{background:var(--key-soft);border-radius:999px;gap:4px;padding:4px;display:none}.tabs button{appearance:none;color:var(--ink-soft);cursor:pointer;background:0 0;border:none;border-radius:999px;flex:1;padding:6px 8px;font-size:14px;line-height:1.5}.tabs button[aria-selected=true]{background:var(--sheet);color:var(--key);box-shadow:0 2px 0 var(--line-strong);font-weight:700}.panes{grid-template-columns:1fr 1fr;gap:12px;min-width:0;display:grid}.pane{min-width:0}.pane h5{border:2px solid var(--line-strong);background:var(--sheet);max-width:100%;box-shadow:inset 0 3px 0 var(--key);font-family:var(--font-round);border-bottom:none;border-radius:12px 12px 0 0;margin:0 0 -2px;padding:5px 14px 4px;font-size:13px;font-weight:700;display:inline-block;position:relative}.code{border:2px solid var(--line-strong);background:var(--sheet);font-family:var(--font-code);border-radius:0 14px 14px;font-size:13px;line-height:22px;overflow-x:auto}.code:focus-visible{outline-offset:1px}.code-inner{min-width:100%;padding:6px 0;display:inline-block}.row{white-space:pre;grid-template-columns:3.2em max-content;min-height:22px;display:grid}.row .no{text-align:right;color:#8b93b8;-webkit-user-select:none;user-select:none;border-left:4px solid #0000;padding-right:10px}.row .text{padding-right:16px}.row.del{background:var(--del-bg)}.row.ins{background:var(--ins-bg)}.row.focus .no{border-left-color:var(--focus-bar)}.row.focus.same{background:var(--focus-bg)}.row.blank{background:repeating-linear-gradient(-45deg,#0000 0 6px,#eceffa 6px 7px)}.row.gap{color:#7880a8;font-family:var(--font-body);background:#f2f5fe;font-size:12px}.row.gap .text{grid-column:1/-1;padding-left:12px}mark.del{background:var(--del-mark);color:var(--del-ink);text-decoration:line-through}mark.ins{background:var(--ins-mark);color:var(--ins-ink);text-decoration:underline}@media (max-width:760px){.tabs{display:flex}.panes{grid-template-columns:1fr}.pane[hidden-narrow]{display:none}}.error{background:#fff4f3;border:2px solid #eab0aa;border-radius:16px;padding:14px 20px}.error h2{font-family:var(--font-round);color:var(--del-ink);margin:0 0 4px;font-size:18px;font-weight:700}.error p{margin:0}footer.colophon{color:var(--ink-soft);margin-top:48px;font-size:13px}@media (prefers-reduced-motion:reduce){*,:before{transition:none!important}.page:has(.drop) .caret{animation:none}}
