.sw{gap:var(--sp-24);display:grid}.sw-ways{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin:0;padding:0;list-style:none;display:grid}.sw-way{align-content:start;gap:var(--sp-12);padding:var(--sp-24);border:1px solid var(--line);border-radius:var(--r-l);background:var(--paper);display:grid}.sw-way.is-reco{border-color:var(--cyan-deep);box-shadow:inset 0 0 0 1px var(--cyan-deep)}.sw-head{align-items:baseline;gap:var(--sp-8) var(--sp-12);flex-wrap:wrap;margin:0;display:flex}.sw-head .mono{font-size:var(--fs-l);color:var(--ink-3);font-weight:700}.sw-way.is-reco .sw-head .mono{color:var(--cyan-deep)}.sw-head b{font-size:var(--fs-l);font-weight:800}.sw-reco{padding:2px var(--sp-12);background:var(--ink);color:var(--paper);font-size:var(--fs-xs);border-radius:999px;font-weight:700}.sw-chart{height:170px;margin:var(--sp-8) 0 0;border-left:1px solid var(--ink-3);border-bottom:1px solid var(--ink-3);border-image:;padding:0 0 52px 28px;position:relative}.sw-chart svg{width:calc(100% - 28px);height:calc(100% - 52px);clip-path:inset(-4px var(--hide,0%) -4px -4px);transition:clip-path 1.6s var(--ease-io) .2s;position:absolute;inset:0 0 52px 28px;overflow:visible}.sw-chart path{fill:none;stroke:var(--ink-3);stroke-width:2px;vector-effect:non-scaling-stroke;stroke-linejoin:round}.sw-way.is-reco .sw-chart path{stroke:var(--cyan-deep)}.sw-way.rv:not(.in) .sw-chart svg{--hide:100%}.sw-y{writing-mode:vertical-rl;font-size:var(--fs-xs);color:var(--ink-3);position:absolute;top:4px;left:4px}.sw-x{font-size:var(--fs-xs);color:var(--ink-3);position:absolute;bottom:-24px;right:0}.sw-bars{height:32px;position:absolute;bottom:8px;left:28px;right:0}.sw-bars span{left:calc(var(--x) * 1%);width:calc(var(--w) * 1% - 2px);background:var(--paper-2);border:1px solid var(--line);font-size:var(--fs-xs);color:var(--ink-2);white-space:nowrap;border-radius:6px;place-items:center;padding:0 4px;font-weight:700;display:grid;position:absolute;top:0;bottom:0;overflow:hidden}.sw-way.is-reco .sw-bars span:not(:last-child){border-color:rgba(var(--cyan-a),.6);color:var(--cyan-deep);background:color-mix(in srgb,var(--cyan) 6%,var(--paper))}.sw-notes{gap:var(--sp-8);margin:var(--sp-8) 0 0;display:grid}.sw-notes div{gap:2px;display:grid}.sw-notes dt{align-items:center;gap:var(--sp-4);font-size:var(--fs-xs);color:var(--ink-2);font-weight:800;display:flex}.sw-notes dd{font-size:var(--fs-s);margin:0;line-height:1.8}.sw-note{font-size:var(--fs-xs);color:var(--ink-3);margin:0}.sw-rec{margin-top:var(--sp-24);padding:var(--sp-24);border-radius:var(--r-l);background:var(--sheet);border:1px solid var(--line-soft);position:relative}.sw-rec-head{align-items:baseline;gap:var(--sp-8) var(--sp-16);margin:0 0 var(--sp-24);font-size:var(--fs-l);flex-wrap:wrap;font-weight:800;display:flex}.sw-rec-head .mono{font-size:var(--fs-xs);color:var(--cyan-deep);letter-spacing:.06em}.sw-steps{grid-template-columns:repeat(3,minmax(0,1fr));gap:48px;margin:0;padding:0;list-style:none;display:grid;position:relative}.sw-steps li{align-content:start;gap:var(--sp-8);display:grid;position:relative}.sw-steps li+li:before{content:"→";font-size:var(--fs-l);color:var(--cyan-deep);position:absolute;top:8px;left:-34px}.sw-ic{border:1px solid var(--cyan);width:48px;height:48px;color:var(--cyan-deep);background:var(--paper);border-radius:50%;place-items:center;display:grid}.sw-steps b{font-size:var(--fs-m);font-weight:800}.sw-steps p{font-size:var(--fs-s);color:var(--ink-2);margin:0;line-height:1.8}.sw-loop{margin:var(--sp-16) 0 0;border:1px dashed var(--cyan-deep);border-top:0;border-radius:0 0 12px 12px;width:calc(66.6667% - 16px);height:28px;position:relative}.sw-loop span{padding:0 var(--sp-8);background:var(--sheet);font-size:var(--fs-xs);color:var(--cyan-deep);font-weight:700;position:absolute;bottom:-10px;left:50%;transform:translate(-50%)}.sw-loop:before{content:"";border-left:1px solid var(--cyan-deep);border-top:1px solid var(--cyan-deep);width:7px;height:7px;position:absolute;top:-2px;left:-4px;transform:rotate(45deg)}.sw-close{margin:var(--sp-8) 0 0;font-size:var(--fs-m);font-weight:700;line-height:1.9}@media (width<=719px){.sw-ways,.sw-steps{grid-template-columns:minmax(0,1fr)}.sw-steps{gap:var(--sp-32)}.sw-steps li+li:before{content:"↓";top:-30px;left:16px}.sw-loop{width:auto;height:auto;margin-top:var(--sp-24);border:0}.sw-loop:before{display:none}.sw-loop span{padding:0;position:static;transform:none}.sw-loop span:before{content:"①と②を"}.sw-rec-head{font-size:var(--fs-m)}}.sw-chart{container:swc/inline-size}@container swc (width<=460px){.sw-chart svg{height:calc(100% - 66px);bottom:66px}.sw-bars{height:48px}.sw-bars span{white-space:normal;text-align:center;padding:0 1px;line-height:1.25}.sw-chart .sw-bars span{word-break:normal}}@media (prefers-reduced-motion:reduce){.sw-chart svg{transition:none}.sw-way.rv:not(.in) .sw-chart svg{--hide:0%}}.bubble{margin:0}.bubble-stage{border:1px solid var(--line);border-radius:var(--r-l);background:var(--sheet);padding:var(--sp-block);position:relative}.bubble svg{width:100%;height:auto;display:block;overflow:visible}.b-grid{fill:none;stroke:var(--line-soft);stroke-width:1px}.b-plot{stroke:none}.b-frame{fill:none;stroke:var(--line);stroke-width:1px}.b-dzone{fill:rgba(var(--cyan-a),.06)}.b-div{stroke:var(--ink-3);stroke-width:1.2px;stroke-dasharray:6 5}.b-zone{font-family:var(--mono);fill:var(--ink);opacity:.06;font-size:84px;font-weight:600}.b-zone-D{fill:var(--cyan-deep);opacity:.14}.b-axis line,.b-axis path{fill:none;stroke:var(--ink-3);stroke-width:1.2px}.b-ax-t{fill:var(--ink-2);letter-spacing:.06em;font-size:15px;font-weight:700}.bubble-axes{gap:var(--sp-4);margin:0 0 var(--sp-12);font-size:var(--fs-xs);color:var(--ink-3);display:none}.bubble-axes b{color:var(--ink);font-weight:700}.b-dot{cursor:pointer;outline:none}.b-dot circle{stroke-width:1.2px;transform-box:fill-box;transform-origin:50%;transition:transform .9s var(--ease),opacity var(--dur-color),stroke-width .3s;transition-delay:calc(var(--i) * 35ms)}.bubble.rv:not(.in) .b-dot circle{transform:scale(0)}.b-A circle{fill:var(--ink);stroke:var(--ink-3)}.b-B circle{fill:var(--entrust);stroke:var(--entrust)}.b-C circle{fill:var(--ink-3);stroke:var(--ink-3)}.b-D circle{fill:var(--cyan);stroke:var(--cyan-deep)}.bubble.has-focus .b-dot:not(.is-cur) circle{opacity:.35}.b-dot.is-cur circle,.b-dot:focus-visible circle{stroke-width:2.6px}.bubble-tip{z-index:2;width:max-content;max-width:240px;padding:var(--sp-12) var(--sp-16);border-radius:var(--r-s);background:var(--inv-bg);color:var(--inv-ink);pointer-events:none;position:absolute;transform:translate(-50%,calc(-100% - 12px));box-shadow:0 18px 40px -18px #0009}.bubble-tip .t-zone{font-size:var(--fs-xs);color:var(--cyan);letter-spacing:.06em;display:block}.bubble-tip .t-name{font-size:var(--fs-m);margin:var(--sp-4) 0 var(--sp-4);display:block}.bubble-tip .t-desc{font-size:var(--fs-xs);color:var(--inv-ink-2);line-height:1.6;display:block}.bubble-legend{justify-content:space-between;gap:var(--sp-8) var(--sp-32);margin-top:var(--sp-16);font-size:var(--fs-s);color:var(--ink-2);flex-wrap:wrap;display:flex}.bubble-legend ul{gap:var(--sp-8) var(--sp-24);flex-wrap:wrap;margin:0;padding:0;list-style:none;display:flex}.bubble-legend p{color:var(--ink-3);margin:0}.bubble-legend .hint{white-space:nowrap}.lg i{width:10px;height:10px;margin-right:var(--sp-8);vertical-align:-.05em;border-radius:50%;display:inline-block}.lg-A i{background:color-mix(in srgb,var(--ink) 30%,transparent)}.lg-B i{background:color-mix(in srgb,var(--entrust) 45%,transparent)}.lg-C i{background:color-mix(in srgb,var(--ink-3) 30%,transparent)}.lg-D i{background:var(--cyan);box-shadow:var(--cyan-glow-soft)}.zones{margin:var(--sp-block) 0 0;grid-template-columns:repeat(4,1fr);gap:16px;padding:0;list-style:none;display:grid}.zone{padding:var(--sp-24) var(--sp-24) var(--sp-24);border-radius:var(--r-m);background:var(--sheet);border:1px solid var(--line-soft)}.zone-k{align-items:center;gap:var(--sp-8);font-size:var(--fs-xl);color:var(--ink-3);font-weight:600;line-height:1;display:flex}.zone h3{margin:var(--sp-12) 0 var(--sp-8);font-size:var(--fs-m);font-weight:800}.zone p{margin:0 0 var(--sp-16);font-size:var(--fs-s);color:var(--ink-2);line-height:1.8}.zone-ex{gap:var(--sp-4);flex-wrap:wrap;margin:0;padding:0;list-style:none;display:flex}.zone-ex li{font-size:var(--fs-xs);padding:var(--sp-4) var(--sp-8);border:1px solid var(--line);color:var(--ink-2);border-radius:999px}.zone-d{box-shadow:inset 0 0 0 1px rgba(var(--cyan-a),.6),var(--cyan-glow-soft)}.zone-d .zone-k{color:var(--cyan-deep)}.myth{margin-top:var(--sp-block);gap:var(--sp-16) 24px;padding:var(--sp-32);border-radius:var(--r-m);border:1px dashed var(--line);grid-template-columns:repeat(12,1fr);display:grid}.myth-head{font-size:var(--fs-l);grid-column:1/span 5;margin:0;font-weight:800;line-height:1.6}.myth-head .mono{width:1.8rem;height:1.8rem;margin-right:var(--sp-8);border:1px solid var(--line);font-size:var(--fs-xs);vertical-align:.1em;border-radius:50%;place-items:center;display:inline-grid}.myth ul{gap:var(--sp-12);grid-column:6/span 7;margin:0;padding:0;list-style:none;display:grid}.myth li{color:var(--ink-2);font-size:var(--fs-s)}.myth li b{color:var(--ink);font-size:var(--fs-m);display:block}.myth-tail{margin:var(--sp-8) 0 0;padding-top:var(--sp-16);border-top:1px solid var(--line);grid-column:1/-1;font-weight:700}@media (width<=1023px){.zones{grid-template-columns:1fr 1fr}.myth-head,.myth ul{grid-column:1/-1}}@media (width<=719px){.zones{grid-template-columns:1fr}.bubble-legend .hint{white-space:normal}.b-ax-t{display:none}.bubble-axes{display:grid}.bubble-stage{padding:var(--sp-12)}}.m-notes{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;display:grid}.m-note{padding:var(--sp-32);border:1px solid var(--line);border-radius:var(--r-l);background:var(--sheet)}.m-note h3{margin:0 0 var(--sp-16);font-size:var(--fs-l);font-weight:800}.m-note p{margin:0 0 var(--sp-12);color:var(--ink-2);line-height:1.9}.m-note p b{color:var(--ink)}@media (width<=719px){.m-notes{grid-template-columns:minmax(0,1fr)}.m-note{padding:var(--sp-24)}}
