.art{border-radius:var(--radius-lg);background:var(--surface);border:1px solid var(--line);width:100%;box-shadow:var(--shadow-soft);align-content:start;justify-items:center;gap:12px;padding:16px;display:grid;position:relative}.art svg{width:100%;height:auto;overflow:visible}.art-chip{border-radius:var(--radius-full);background:var(--primary-soft);color:var(--primary);justify-self:start;padding:6px 12px;font-size:13px;font-weight:700}.art-verdict{border-radius:var(--radius-full);background:var(--success-soft);color:var(--success);padding:6px 12px;font-size:13px;font-weight:800;position:absolute;bottom:14px;right:14px}.art-map svg{max-width:220px}.map-land{fill:var(--track)}.map-border{fill:none;stroke:var(--surface);stroke-width:2px;stroke-linejoin:round}.map-target{fill:var(--success);stroke:var(--surface);stroke-width:2px;stroke-linejoin:round}.map-tap,.map-ripple{opacity:0;transform-box:fill-box;transform-origin:50%}.map-tap{fill:var(--ink)}.map-ripple{fill:none;stroke:var(--ink);stroke-width:1.5px}[data-playing] .art-map .map-target{animation:map-target 4.8s var(--ease) infinite}[data-playing] .art-map .map-tap{animation:map-tap 4.8s var(--ease) infinite}[data-playing] .art-map .map-ripple{animation:map-ripple 4.8s var(--ease) infinite}[data-playing] .art-map .art-verdict,[data-playing] .art-skeleton .art-verdict{animation:verdict 4.8s var(--spring) infinite}@keyframes map-target{0%,38%{fill:var(--primary-soft)}44%,90%{fill:var(--success)}to{fill:var(--primary-soft)}}@keyframes map-tap{0%,32%{opacity:0;transform:scale(1.8)}37%{opacity:.9;transform:scale(1)}56%,to{opacity:0;transform:scale(1)}}@keyframes map-ripple{0%,36%{opacity:0;transform:scale(1)}38%{opacity:.6}62%,to{opacity:0;transform:scale(3.2)}}@keyframes verdict{0%,40%{opacity:0;transform:translateY(8px)scale(.9)}46%,88%{opacity:1;transform:none}96%,to{opacity:0;transform:translateY(8px)scale(.9)}}.art-skeleton svg{max-width:132px}.bone,.bone-target,.bone-target-glow{fill:none;stroke-linecap:round;stroke-linejoin:round}.bone{stroke:var(--ink-muted);stroke-width:6px;opacity:.55}.bone-thin{stroke-width:3.5px}.bone-fill{fill:var(--ink-muted);opacity:.55}.bone-target{stroke:var(--primary);stroke-width:7px}.bone-target-glow{stroke:var(--primary);stroke-width:16px;opacity:.22}.skeleton-turn{transform-box:fill-box;transform-origin:50%}[data-playing] .skeleton-turn{animation:7s ease-in-out infinite skeleton-turn}[data-playing] .bone-target-glow{animation:2.4s ease-in-out infinite glow}@keyframes skeleton-turn{0%,to{transform:scaleX(1)}25%{transform:scaleX(.74)skewY(-2deg)}50%{transform:scaleX(1)}75%{transform:scaleX(.74)skewY(2deg)}}@keyframes glow{0%,to{opacity:.12}50%{opacity:.4}}.art-glyph{gap:14px}.glyph-card{border-radius:var(--radius-md);background:var(--background);justify-items:center;gap:14px;width:100%;padding:18px 14px 14px;display:grid}.glyph-big,.glyph-scripts li{font-family:"Hiragino Sans", "Noto Sans CJK JP", "Noto Sans JP", "Apple SD Gothic Neo", "Malgun Gothic", var(--font-sans), sans-serif}.glyph-big{font-size:64px;font-weight:700;line-height:1}.glyph-choices{grid-template-columns:repeat(4,1fr);gap:8px;width:100%;margin:0;padding:0;list-style:none;display:grid}.glyph-choices li{border-radius:var(--radius-sm);background:var(--surface);border:1.5px solid var(--line);place-items:center;min-height:40px;font-weight:800;display:grid}.glyph-choices .is-right{border-color:var(--success);background:var(--success-soft);color:var(--success)}[data-playing] .glyph-choices .is-right{animation:choice-right 4.8s var(--spring) infinite}@keyframes choice-right{0%,40%{border-color:var(--line);background:var(--surface);color:var(--ink);transform:none}46%{transform:scale(1.08)}50%,92%{border-color:var(--success);background:var(--success-soft);color:var(--success);transform:none}}.glyph-morse{border-radius:var(--radius-full);background:var(--primary-soft);width:100%;color:var(--primary);align-items:center;gap:12px;padding:10px 14px;display:flex}.morse-code{align-items:center;gap:6px;display:inline-flex}.morse-dot,.morse-dash{border-radius:var(--radius-full);background:currentColor;height:8px;display:block}.morse-dot{width:8px}.morse-dash{width:24px}.morse-sound{flex:1;align-items:center;gap:3px;height:20px;display:inline-flex}.morse-sound span{opacity:.6;background:currentColor;border-radius:2px;width:3px;height:100%;display:block;transform:scaleY(.35)}.morse-sound span:nth-child(odd){transform:scaleY(.7)}[data-playing] .morse-sound span{animation:1.2s ease-in-out infinite sound}.morse-sound span:nth-child(2){animation-delay:.1s}.morse-sound span:nth-child(3){animation-delay:.2s}.morse-sound span:nth-child(4){animation-delay:.3s}.morse-sound span:nth-child(5){animation-delay:.4s}.morse-sound span:nth-child(6){animation-delay:.5s}.morse-sound span:nth-child(7){animation-delay:.6s}@keyframes sound{0%,to{transform:scaleY(.3)}50%{transform:scaleY(1)}}.morse-heard{font-size:13px;font-weight:800}.glyph-scripts{gap:8px;margin:0;padding:0;list-style:none;display:flex}.glyph-scripts li{border-radius:var(--radius-sm);background:var(--background);place-items:center;width:40px;height:40px;font-size:20px;font-weight:700;display:grid}.board-cell{stroke:none}.board-s{fill:var(--streak-soft)}.board-d{fill:var(--info-soft)}.board-p{fill:var(--success-soft)}.board-f{fill:var(--xp-soft)}.board-target{fill:var(--primary)}.board-symbol{fill:var(--on-primary);text-anchor:middle;font-size:6.5px;font-weight:800}.board-pulse{fill:none;stroke:var(--primary);stroke-width:1.5px;opacity:0;transform-box:fill-box;transform-origin:50%}[data-playing] .board-pulse{animation:board-pulse 2.4s var(--ease) infinite}@keyframes board-pulse{0%{opacity:.8;transform:scale(.8)}70%,to{opacity:0;transform:scale(1.9)}}.board-legend{gap:6px;margin:0;padding:0;list-style:none;display:flex}.board-legend li{width:28px;height:22px;color:var(--ink);border-radius:6px;place-items:center;font-size:12px;font-weight:800;display:grid}.board-legend .board-s{background:var(--streak-soft)}.board-legend .board-d{background:var(--info-soft)}.board-legend .board-p{background:var(--success-soft)}.board-legend .board-f{background:var(--xp-soft)}.timeline{gap:8px;width:100%;margin:0;padding:0 0 0 18px;list-style:none;display:grid;position:relative}.timeline:before{content:"";background:var(--track);border-radius:3px;width:3px;position:absolute;top:8px;bottom:8px;left:5px}.timeline-item{border-radius:var(--radius-sm);background:var(--background);align-items:center;gap:10px;min-height:44px;padding:8px 12px;font-size:14px;font-weight:600;line-height:1.3;display:flex;position:relative}.timeline-item:before{content:"";border-radius:var(--radius-full);background:var(--surface);border:3px solid var(--primary);width:11px;height:11px;position:absolute;left:-17px}.timeline-year{min-width:44px;color:var(--primary);font-variant-numeric:tabular-nums;flex:none;font-weight:800}.timeline-item.is-moving{background:var(--surface);box-shadow:var(--shadow-lift);border:1.5px solid var(--primary)}[data-playing] .timeline-item.is-moving{animation:timeline-drop 4.8s var(--spring) infinite}@keyframes timeline-drop{0%,12%{transform:translate(28px,-52px)rotate(3deg)}40%,90%{transform:none}to{transform:translate(28px,-52px)rotate(3deg)}}.proto-link{fill:none;stroke:var(--track);stroke-width:3px;stroke-linecap:round}.proto-node rect{fill:var(--surface);stroke-width:2px}.proto-node text{fill:var(--ink);text-anchor:middle;font-size:10.5px;font-weight:700}.proto-info rect{stroke:var(--info)}.proto-xp rect{stroke:var(--xp)}.proto-primary rect{stroke:var(--primary)}.proto-success rect{stroke:var(--success)}.proto-packet{opacity:0}.proto-packet-dns{fill:var(--xp)}.proto-packet-a{fill:var(--primary);opacity:1;transform:translate(103px,95px)}.proto-packet-b{fill:var(--success)}[data-playing] .proto-packet-dns{animation:5s linear infinite packet-dns}[data-playing] .proto-packet-a{animation:5s linear infinite packet-a}[data-playing] .proto-packet-b{animation:5s linear infinite packet-b}@keyframes packet-dns{0%{opacity:1;transform:translate(86px,88px)}12%{transform:translate(124px,32px)}24%{opacity:1;transform:translate(86px,88px)}25%,to{opacity:0;transform:translate(86px,88px)}}@keyframes packet-a{0%,25%{opacity:0;transform:translate(86px,95px)}26%{opacity:1;transform:translate(86px,95px)}34%{transform:translate(120px,95px)}40%{transform:translate(194px,88px)}48%,54%{transform:translate(232px,58px)}62%{transform:translate(194px,88px)}68%{transform:translate(120px,95px)}76%{opacity:1;transform:translate(86px,95px)}77%,to{opacity:0;transform:translate(86px,95px)}}@keyframes packet-b{0%,37%{opacity:0;transform:translate(86px,95px)}38%{opacity:1;transform:translate(86px,95px)}46%{transform:translate(120px,95px)}52%{transform:translate(194px,102px)}60%,66%{transform:translate(232px,132px)}74%{transform:translate(194px,102px)}80%{transform:translate(120px,95px)}88%{opacity:1;transform:translate(86px,95px)}89%,to{opacity:0;transform:translate(86px,95px)}}.proto-player{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;width:100%;display:flex}.proto-controls,.proto-protocols{align-items:center;gap:6px;display:inline-flex}.proto-controls span{border-radius:var(--radius-full);background:var(--background);min-width:32px;height:32px;color:var(--ink-muted);place-items:center;padding:0 6px;font-size:12px;font-weight:800;display:grid}.proto-controls .proto-play{background:var(--primary);color:var(--on-primary)}.proto-protocols span{border-radius:var(--radius-full);background:var(--primary-soft);color:var(--primary);font-family:var(--font-mono), ui-monospace, monospace;padding:4px 8px;font-size:11px;font-weight:700}@media (prefers-reduced-motion:reduce){[data-playing] .art *{animation:none!important}}.explorer-icon{--icon-tone:var(--primary);--icon-soft-tone:var(--primary-soft);flex:none}.explorer-icon .icon-soft{fill:var(--icon-soft-tone)}.explorer-icon .icon-soft-stroke{fill:var(--surface);stroke:var(--icon-tone);stroke-width:2px}.explorer-icon .icon-fill{fill:var(--icon-tone)}.explorer-icon .icon-line{fill:none;stroke:var(--icon-tone);stroke-width:2px;stroke-linecap:round;stroke-linejoin:round}.explorer-icon .icon-bold{stroke-width:3px}.trail{gap:10px;margin:0;padding:0;list-style:none;display:grid;position:relative}.trail:before{content:"";background:repeating-linear-gradient(var(--track) 0 8px, transparent 8px 14px);border-radius:4px;width:4px;position:absolute;top:22px;bottom:22px;left:21px}.trail-step{align-items:center;gap:14px;min-height:46px;display:flex;position:relative}.trail-step .ring{background:var(--surface);border-radius:var(--radius-full);flex:none}.trail-title{font-size:15px;font-weight:700;line-height:1.3}.trail-meta{color:var(--ink-muted);font-size:13px;font-weight:600;display:block}.trail-step.is-locked .trail-title{color:var(--ink-muted)}.trail-step.is-next .trail-title:after{content:attr(data-next);border-radius:var(--radius-full);background:var(--primary);color:var(--on-primary);vertical-align:2px;margin-left:8px;padding:2px 8px;font-size:12px;font-weight:800}.trail-lock{border-radius:var(--radius-full);background:var(--surface);border:4px solid var(--track);width:46px;height:46px;color:var(--ink-muted);place-items:center;display:grid}.trail-badge{align-items:center;gap:14px;margin-top:6px;padding:12px 14px 12px 0;font-weight:800;display:flex}.trail-medal{border-radius:var(--radius-full);background:var(--xp);color:#14142b;width:46px;height:46px;box-shadow:0 0 0 5px var(--xp-soft);place-items:center;display:grid}[data-tone]{--tone:var(--primary);--tone-soft:var(--primary-soft)}[data-tone=orange]{--tone:#ff9d42;--tone-soft:#3a2614}[data-tone=coral]{--tone:#ff7a72;--tone-soft:#3d1c1f}[data-tone=sky]{--tone:#4fb6ff;--tone-soft:#132c40}[data-tone=ochre]{--tone:#e8b33a;--tone-soft:#352a10}[data-tone=mint]{--tone:#2fd896;--tone-soft:#133328}[data-tone] .explorer-icon{--icon-tone:var(--tone);--icon-soft-tone:var(--tone-soft)}.explorer-icon .icon-glyph{fill:var(--icon-tone);font-family:"Hiragino Sans", "Noto Sans CJK JP", "Noto Sans JP", var(--font-sans), sans-serif;text-anchor:middle;font-size:17px;font-weight:800}