/* Visual references and asset provenance: ./assets/README.md */


:root{--paper:#1da1f2;--ink:#fff;--muted:#e1f3ff;--line:#9ad3ff80;--mint:#fff;--aqua:#fff;--coral:#fff19b;--white:#fff;--panel:#106bb3;--blue-ink:#07518b}
body{background:#1da1f2 url('./assets/network.svg') center top/1440px auto repeat;color:var(--ink);font-family:Montserrat,'Hiragino Kaku Gothic ProN','Yu Gothic',sans-serif}
header{padding:27px 24px;max-width:1260px;border-color:#ffffff70}.brand{display:flex;gap:24px;align-items:center;letter-spacing:normal}.brand img{width:223px;height:auto}.brand small{display:block;font-size:10px;letter-spacing:2.6px;margin:0;font-weight:400}.brand .fan-label{display:block;color:#fff;font-size:8px;letter-spacing:1.6px;margin-top:8px;font-weight:400}header>a{letter-spacing:1px;border-bottom:1px solid #ffffff80;padding:9px 0}main{margin-top:30px}.heading{margin-bottom:26px}.eyebrow{font-weight:400;letter-spacing:3px}h1{font-weight:700;letter-spacing:.08em}.subtitle{letter-spacing:.05em}.tag{border-radius:0;letter-spacing:2px;border-color:#ffffff90;background:#00095918}.layout{gap:28px}.video-shell{background:#082c59;border:1px solid #b0e2ff;box-shadow:5px 5px 0 #04e4ff60}.video-meta{color:#fff}.transport button{border-radius:0;background:#0e6cad;color:#fff;border-color:#9ad3ff}.transport .primary{background:#fff;color:var(--blue-ink);border-color:#fff;font-weight:700}.transport button:hover:not(:disabled){background:#dffaff;color:#074c80;border-color:#fff}button:disabled{opacity:.55}.howto{border-color:#ffffff60}.howto p,.settings{color:#fff}.step{border-radius:0;border-color:#ffffff80}.settings input{border-radius:0;background:#fff;color:var(--blue-ink)}
.panel,.result{border:1px solid #9ad3ff;border-radius:0;background:var(--panel);box-shadow:6px 6px 0 #0060ff25;position:relative}.panel:before,.result:before{content:'';position:absolute;inset:5px;pointer-events:none;border:1px solid #9ad3ff40}.panel-top{letter-spacing:1.7px}.panel-top i{background:#77ffff;box-shadow:0 0 8px #02ffff80}.progress{background:#ffffff25}.progress i{background:#7fffff}.mode{color:#aeffff;letter-spacing:1.8px}.call h2{letter-spacing:.02em}.call p{color:#e1f3ff}.lane-line{background:#ffffff60}.target{background:#106bb3;border:2px solid #fff;width:23px;height:23px;top:7px}.approach{background:#afffff;box-shadow:0 0 9px #02ffff}.timing-caption{color:#e1f3ff}.pad{border-radius:0;border:1px solid #bbebff;background:#e9f6ff;color:#07518b;box-shadow:0 4px 0 #084c89}.pad:hover:not(:disabled){background:#fff;border-color:#fff}.pad.fixed{background:#fff;color:#07518b;border-color:#fff;box-shadow:0 4px 0 #05d4eb}.pad.selected{background:#c5ffff;color:#064c80;border-color:#02ffff;box-shadow:0 4px 0 #02d6ee}.pad.selected:after{content:'';position:absolute;inset:3px;border:1px solid #0d87b8;pointer-events:none}.feedback{color:#bfffff;font-weight:700}.panel-bottom{color:#e1f3ff}.result-item{background:#095590;border-top:1px solid #74c6ff}.result-head strong{color:#a5ffff}.result p,.result-item small{color:#e1f3ff}footer{color:#fff;border-color:#ffffff60}.error{color:#fff4ab}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible,#game:focus-visible{outline-color:#fff19b}
@media(min-width:1400px){body:after{content:'PiXMiX / CALL & RESPONSE';position:fixed;right:24px;top:180px;writing-mode:vertical-rl;font-size:11px;letter-spacing:4px;color:#ffffffa0}}
@media(max-width:760px){header{padding:18px 16px}.brand{gap:12px}.brand img{width:144px}.brand small{display:block;font-size:7px;letter-spacing:1px}.brand .fan-label{font-size:6px;letter-spacing:.7px;margin-top:4px}header>a{font-size:9px;letter-spacing:0}main{margin-top:20px}.heading{margin-bottom:19px}.layout{gap:16px}.panel{padding:17px}.video-shell{box-shadow:3px 3px 0 #04e4ff60}.tag{display:none}.subtitle{font-size:8px}.transport button{font-size:10px}.call h2{font-size:22px}}
@media(max-width:360px){.brand small,.brand .fan-label{display:none}.brand img{width:140px}}

.section-picker{margin-bottom:22px;padding:14px;border:1px solid #9ad3ff;background:#106bb3;font-size:12px}.section-picker select{max-width:100%;min-height:44px;background:white;color:#07518b;padding:8px;border:0;font:inherit}.section-picker p{margin:10px 0 0;font-size:11px}@media(max-width:760px){.section-picker label{display:block;margin-bottom:8px}.section-picker select{width:100%}}

.wordmark{font-size:36px;font-weight:400;letter-spacing:.12em;color:white!important}.alpha-badge{font-size:10px;letter-spacing:2px}@media(max-width:760px){.wordmark{font-size:25px}}
