@import url('/play/travel.css');
:root{--accent:#bd582c;--paper:#f5f3ed;--ink:#252721}body{background:var(--paper);color:var(--ink)}button{color:inherit} .mast{max-width:1320px;padding:25px 36px;border-bottom:1px solid #dadbd3}.masthead{letter-spacing:-.7px}.mast select{background:transparent;font-size:13px}.edition{font-size:11px;letter-spacing:.13em;color:#76796e}.nen-main{max-width:1240px;margin:0 auto;padding:0 30px}.eyebrow{font-size:11px;letter-spacing:.2em;font-weight:600;color:#72786b;text-transform:uppercase}.scene{min-height:670px;display:grid;grid-template-columns:minmax(0,1fr);align-items:center;padding:20px 0 30px}.scene.open,.scene.result-scene{grid-template-columns:minmax(0,1.15fr) minmax(270px,.85fr);gap:38px}.hex-wrap{position:relative;max-width:610px;width:100%;aspect-ratio:1;margin:auto;transition:max-width .5s cubic-bezier(.2,.7,.2,1)}.hex{width:100%;height:100%;overflow:visible}.hex .edge{fill:none;stroke:#aeb2a5;stroke-width:1}.hex .inner{fill:none;stroke:#d9dcd1;stroke-width:.7;stroke-dasharray:3 8}.hex .rays{stroke:#d9dcd1;stroke-width:.6}.hex .active-edge{fill:none;stroke:var(--accent);stroke-width:2;stroke-dasharray:1450;stroke-dashoffset:1450;animation:trace .65s ease forwards}.node{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);min-width:78px;min-height:66px;padding:8px 5px;background:var(--paper);border:1px solid transparent;border-radius:0;z-index:3;transition:color .2s,transform .3s}.node strong{display:block;font-family:Georgia,'Noto Serif',serif;font-size:31px;font-weight:500;line-height:1.2}.node span{font-size:11px;font-weight:600;white-space:nowrap}.node:hover,.node[aria-pressed=true]{color:var(--accent);transform:translate(-50%,-50%) scale(1.08)}.node:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.hex-center{position:absolute;inset:31% 23%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;z-index:2}.hex-center h1{font-size:39px;letter-spacing:-2px;line-height:1.2;margin:9px -25px 14px;font-weight:650}.hex-center p{font-size:12px;line-height:1.7;margin:0 0 20px;color:#73796a}.primary-nen{background:var(--ink);color:#fff;border:0;padding:15px 27px;font-size:13px;cursor:pointer;border-radius:2px;transition:background .2s,transform .2s}.primary-nen:hover{background:var(--accent);transform:translateY(-2px)}.center-glyph{font-family:Georgia,serif;font-size:100px;line-height:1;color:var(--accent);opacity:.13;position:absolute;z-index:-1}.center-detail .center-glyph{opacity:.55;font-size:95px}.center-detail h1,.center-detail p{display:none}.center-detail .primary-nen{margin-top:150px}.detail{animation:arrive .45s ease both;padding:32px 0;max-width:400px}.detail h2{font-size:44px;letter-spacing:-2px;margin:10px 0 15px;font-weight:600}.detail .motto{font-family:Georgia,'Malgun Gothic',serif;font-size:24px;line-height:1.6;margin:0 0 19px}.detail p{font-size:14px;line-height:1.9;color:#62695c}.detail-close{font-size:12px;border-bottom:1px solid #abb2a1;padding:4px 0;margin-top:16px}.aura{position:absolute;inset:34%;border:1px solid var(--accent);opacity:.14;pointer-events:none;border-radius:50%;animation:breathe 4s ease-in-out infinite}.aura:nth-child(2){inset:28%;animation-delay:-2s}.hex-wrap[data-effect=wave] .aura{border-radius:35% 65% 60% 40%;animation:orbit 9s linear infinite}.hex-wrap[data-effect=construct] .aura{border-radius:2px;transform:rotate(30deg);animation:construct 3s ease-in-out infinite}.hex-wrap[data-effect=threads] .aura{border-radius:0;transform:scaleX(.35) rotate(45deg)}.hex-wrap[data-effect=pulse] .aura{animation:pulse 2s ease-out infinite}.hex-wrap[data-effect=orbit] .aura{border-style:dashed;animation:orbit 15s linear infinite}.hex-wrap[data-effect=strength] .aura{border-width:8px}.map-caption{text-align:center;font-size:11px;color:#747d6b;margin-top:-12px}.quiz{max-width:660px;margin:65px auto 80px;min-height:560px}.quiz-bar{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:#6d7565}.quiz progress{width:100%;height:3px;appearance:none;border:0;background:#dce0d3;margin:18px 0 32px}.quiz progress::-webkit-progress-bar{background:#dce0d3}.quiz progress::-webkit-progress-value{background:var(--accent);transition:width .3s}.quiz h2{font-size:39px;font-weight:650;letter-spacing:-1.5px;line-height:1.4;min-height:110px;margin:18px 0 24px;outline:none}.poles{display:grid;grid-template-columns:1fr 1fr;gap:25px;margin:25px 0}.poles p{font-size:19px;line-height:1.5;margin:0}.poles small{display:block;font-size:11px;letter-spacing:.15em;color:var(--accent);margin-bottom:8px}.scale{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.scale button{border:1px solid #bdc4b4;padding:18px 5px;min-height:64px;border-radius:2px;font-size:12px}.scale button:first-child,.scale button:last-child{font-weight:700}.scale button:hover{background:#e5e9de}.scale button.selected{background:var(--ink);color:#fff;opacity:1}.quiz-bottom{display:flex;justify-content:space-between;margin-top:20px}.quiz-bottom button{font-size:12px;padding:12px 0;text-decoration:underline;text-underline-offset:4px}.adaptive-note{font-size:12px;color:#747b6e;min-height:20px;margin:18px 0}.question-content.enter{animation:arrive .3s ease}.you-dot{fill:var(--accent);stroke:var(--paper);stroke-width:3;animation:dot-in .65s cubic-bezier(.2,.7,.2,1) both;transform-box:fill-box;transform-origin:center}.character-dot{fill:var(--paper);stroke:#252721;stroke-width:2}.result-path{stroke:var(--accent);stroke-width:4;fill:none;stroke-linecap:round;opacity:.6}.legend{display:flex;gap:18px;justify-content:center;font-size:11px;margin:0 0 20px}.legend i{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--accent);margin-right:5px}.legend .other{background:transparent;border:1px solid var(--ink)}.result-center h1{font-size:30px}.result-center p{font-size:12px}.result-center .center-glyph{font-size:120px;opacity:.06}.result-label{font-size:12px;color:var(--accent)}.character-match{border-top:1px solid #cdd3c4;border-bottom:1px solid #cdd3c4;padding:16px 0;margin:22px 0}.character-match strong{display:block;font-size:24px;margin:6px 0}.character-match small{color:#687361;font-size:11px;line-height:1.7;display:block}.actions{display:flex;gap:9px;flex-wrap:wrap}.secondary-nen{border:1px solid #aeb8a4;padding:12px 18px;font-size:12px;border-radius:2px}.status{font-size:12px;min-height:20px}.reading{max-width:820px;margin:25px auto 65px;border-top:1px solid #d0d5c6;padding-top:25px}.reading>h2{font-size:20px;font-weight:600}.reading details{border-bottom:1px solid #dce0d6;padding:15px 0;font-size:13px;line-height:1.8}.reading summary{cursor:pointer;font-weight:600}.reading p{color:#69735f;max-width:740px}.reading a{text-decoration:underline;text-underline-offset:3px}.nen-footer{display:flex;max-width:1240px;margin:auto;justify-content:space-between;gap:20px;border-top:1px solid #d7dccf;padding:25px 36px;font-size:11px;color:#78816e}.nen-footer a{text-decoration:underline}.copy-dialog textarea{width:100%;min-height:150px;padding:12px}.copy-dialog button{margin-top:12px}button{-webkit-tap-highlight-color:transparent}button:disabled{opacity:.45} [hidden]{display:none!important}.error-message{color:#95452b}
@keyframes arrive{from{opacity:0;transform:translateY(13px)}to{opacity:1;transform:translateY(0)}}@keyframes trace{to{stroke-dashoffset:0}}@keyframes breathe{50%{transform:scale(1.12);opacity:.22}}@keyframes orbit{to{transform:rotate(360deg)}}@keyframes construct{50%{transform:rotate(60deg) scale(.82)}}@keyframes pulse{to{transform:scale(1.9);opacity:0}}@keyframes dot-in{from{transform:scale(0)}to{transform:scale(1)}}
@media(max-width:760px){.mast{padding:18px 20px}.edition{display:none}.nen-main{padding:0 18px}.scene{min-height:540px;padding:28px 0}.scene.open,.scene.result-scene{grid-template-columns:1fr;gap:0}.hex-wrap{max-width:500px}.node{min-width:64px;min-height:57px}.node strong{font-size:25px}.node span{font-size:10px}.hex-center h1{font-size:29px;margin:8px -30px 12px}.hex-center p{font-size:11px;line-height:1.5;margin:0 -12px 15px}.hex-center .eyebrow{font-size:9px;letter-spacing:.1em}.primary-nen{padding:12px 20px;font-size:12px;white-space:nowrap}.detail{padding:14px 13px 25px;max-width:none}.detail h2{font-size:34px}.detail .motto{font-size:23px}.detail p{font-size:13px}.center-detail .primary-nen{margin-top:110px}.center-detail .center-glyph{font-size:72px}.quiz{margin:38px auto 40px;min-height:540px}.quiz h2{font-size:29px;min-height:95px}.poles p{font-size:17px}.scale{gap:5px}.scale button{font-size:11px;padding:15px 2px}.reading{margin:20px 5px 40px}.result-center h1{font-size:24px}.nen-footer{padding:22px 20px;font-size:10px}.result-scene .hex-wrap{max-width:430px}.map-caption{font-size:10px;margin-top:0}.result-scene .detail{padding-top:0}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.hex .active-edge{stroke-dashoffset:0}}

/* Tactile paper surface and persistent, touch-friendly disclosure cues. */
body{isolation:isolate}
body::before{content:"";position:fixed;inset:-32px;z-index:-1;pointer-events:none;opacity:.085;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='grain'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.78' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%2365685f' filter='url(%23grain)' opacity='.7' d='M0 0h180v180H0z'/%3E%3C/svg%3E");animation:paper-drift 32s ease-in-out infinite alternate}
.node{cursor:pointer;border-color:#d6d5ca;border-radius:3px;background:rgba(245,243,237,.92);transition:border-color .2s,color .2s,transform .25s,background .2s}
.node-hint{position:absolute;right:5px;top:2px;font-size:13px;font-style:normal;font-weight:400;line-height:1;color:#858779;transition:color .2s}
.node[aria-pressed=true]{border-color:var(--accent);background:var(--paper)}
.node[aria-pressed=true] .node-hint{color:var(--accent)}
@media(hover:hover){.node:hover{border-color:var(--accent);background:var(--paper)}.node:hover .node-hint{color:var(--accent)}}
.node:active{transform:translate(-50%,-50%) scale(.97)}
@keyframes paper-drift{from{transform:translate3d(-8px,-5px,0)}to{transform:translate3d(8px,5px,0)}}
@media(prefers-reduced-motion:reduce){body::before{animation:none}}
