.routing-page{z-index:1;min-height:100vh;position:relative}.routing-page .brand-mark{text-decoration:none}.routing-hero{max-width:1180px;margin:0 auto;padding:58px 30px 36px}.routing-hero h1{margin:14px 0 18px}.routing-hero>p:last-child{color:#a4acc0;max-width:650px;font-size:16px;line-height:1.65}.routing-shell{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:linear-gradient(135deg,#111523f0,#05070ff7);border:1px solid #293047;border-radius:20px;max-width:1180px;margin:0 auto 54px;padding:28px;box-shadow:0 35px 90px #00000080}.routing-topline{justify-content:space-between;align-items:flex-end;gap:20px;display:flex}.routing-topline span,.mission>span,.routing-tip>span{color:#747d93;letter-spacing:.2em;margin-bottom:8px;font-size:9px;font-weight:800;display:block}.routing-count{margin:0!important}.route-tabs,.level-tabs{flex-wrap:wrap;gap:8px;display:flex}.route-tabs button,.level-tabs button,.routing-actions button,.show-tip{color:#8e98af;font:700 10px/1 var(--font-geist-mono),monospace;letter-spacing:.09em;cursor:pointer;background:#111625;border:1px solid #323a51;border-radius:999px;padding:10px 15px;transition:all .18s}.route-tabs button:hover,.level-tabs button:hover,.routing-actions button:hover{color:#fff;border-color:#cb6ce6}.route-tabs button.active{color:#fff;background:linear-gradient(90deg,#004aad,#8e55d7);border-color:#cb6ce6;box-shadow:0 0 24px #cb6ce633}.level-tabs{border-top:1px solid #252c3d;margin:24px 0 16px;padding-top:20px}.level-tabs button{border-radius:7px}.level-tabs button.active{color:#fff;background:#1b2337;border-color:#4a5c89}.mission{background:#004aad14;border-left:3px solid #004aad;grid-template-columns:105px 1fr;align-items:start;gap:18px;margin:18px 0;padding:17px 18px;display:grid}.mission>span{color:#4f8fe6;margin:3px 0 0}.mission p{color:#c1c7d8;margin:0;font-size:14px;line-height:1.55}.routing-tip{color:#ad91c4;background:#cb6ce60b;border:1px solid #cb6ce638;border-radius:8px;grid-template-columns:70px 1fr 24px;align-items:start;gap:14px;margin-bottom:18px;padding:12px 14px;display:grid;position:relative}.routing-tip>span{color:#cb6ce6;margin:3px 0 0}.routing-tip p{font:11px/1.55 var(--font-geist-mono),monospace;margin:0}.routing-tip button{color:#8c7999;cursor:pointer;background:0 0;border:0;font-size:20px}.show-tip{color:#cb6ce6;border-style:dashed;margin-bottom:18px}.patchboard{background:radial-gradient(circle at 50% 110%,#004aad2b,#0000 48%),linear-gradient(#0d111d,#070a12);border:1px solid #252d42;border-radius:13px;min-height:290px;padding:52px 34px 66px;position:relative;overflow:auto}.units{z-index:2;align-items:center;gap:38px;min-width:max-content;display:flex;position:relative}.digital .units{flex-direction:column;align-items:stretch;gap:11px;min-width:580px;max-width:730px;margin:auto}.route-unit{align-items:stretch;min-height:98px;display:flex}.route-unit.daw{width:100%;min-height:67px}.unit-face{background:linear-gradient(160deg,#242a38,#151a26 70%);border:1px solid #343b4d;border-radius:7px;flex-direction:column;justify-content:center;min-width:142px;padding:18px 16px;display:flex;position:relative;box-shadow:0 5px #00000047,inset 0 1px #ffffff0a}.unit-face:before,.unit-face:after{content:"";background:#657087;border-radius:50%;width:4px;height:4px;position:absolute}.unit-face:before{top:7px;left:7px}.unit-face:after{bottom:7px;right:7px}.unit-face.blue{border-color:#0068ff8c;box-shadow:0 0 30px #004aad38}.unit-face.purple{border-color:#cb6ce680;box-shadow:0 0 30px #cb6ce629}.unit-face strong{color:#edf0f8;font:400 12px/1.25 var(--font-immersed),sans-serif;letter-spacing:.05em}.unit-face span{color:#778199;font:9px/1.3 var(--font-geist-mono),monospace;letter-spacing:.06em;margin-top:7px}.unit-face>i{border-radius:6px 0 0 6px;width:5px;position:absolute;inset:0 auto 0 0}.daw .unit-face{border-radius:5px;flex:1;min-width:360px;min-height:64px}.daw .unit-face:before,.daw .unit-face:after{display:none}.input-bank,.output-bank{flex-direction:column;justify-content:center;gap:8px;min-width:50px;padding:5px 8px;display:flex}.input-bank label,.output-bank label{color:#727c94;font:8px/1 var(--font-geist-mono),monospace;white-space:nowrap;flex-direction:column;align-items:center;gap:4px;display:flex}.port{color:#fff;cursor:pointer;touch-action:none;background:#05070d;border:2px solid #58627a;border-radius:50%;place-items:center;width:19px;height:19px;padding:0;font:700 10px/1 monospace;transition:all .15s;display:grid}.digital .port{border-radius:4px}.port.output:hover,.port.output.armed{border-color:#287fff;box-shadow:0 0 0 5px #004aad38,0 0 15px #004aad8c}.port.input:hover{border-color:#cb6ce6;box-shadow:0 0 0 5px #cb6ce62e,0 0 15px #cb6ce666}.routing-cables{z-index:1;pointer-events:none;width:100%;min-width:100%;height:100%;min-height:100%;position:absolute;inset:0;overflow:visible}.routing-cables path{fill:none;stroke-width:3.5px;stroke-linecap:round;filter:drop-shadow(0 0 5px)}.routing-actions{flex-wrap:wrap;align-items:center;gap:10px;margin-top:18px;display:flex}.routing-actions button{border-radius:7px;padding:13px 18px}.routing-actions .check-route{color:#fff;background:linear-gradient(90deg,#004aad,#9653db);border-color:#cb6ce6}.check-route b{margin-left:20px}.routing-actions>span{color:#687288;font:9px/1.4 var(--font-geist-mono),monospace;letter-spacing:.08em;margin-left:auto}.routing-feedback{border:1px solid;border-radius:9px;align-items:center;gap:14px;margin-top:15px;padding:15px 17px;font-size:13px;display:flex}.routing-feedback b{color:#07120e;border-radius:50%;place-items:center;width:28px;height:28px;display:grid}.routing-feedback.good{color:#70e3a7;background:#70e3a70f;border-color:#70e3a75c}.routing-feedback.good b{background:#70e3a7}.routing-feedback.wrong{color:#ff9cb0;background:#ff6f8a0f;border-color:#ff6f8a59}.routing-feedback.wrong b{background:#ff6f8a}.patch-canvas{width:max-content;min-width:100%;min-height:170px;position:relative}.digital .patch-canvas{width:min(730px,100%);margin:auto}.digital .units{width:100%;max-width:none}.routing-cables{width:100%;min-width:0;height:100%;min-height:0;overflow:visible}.routing-cables path{stroke-linejoin:round}.digital .routing-cables path{stroke-width:3px;stroke-linecap:round}.routing-cables .loose-cable{stroke-width:4px;filter:drop-shadow(0 0 8px);animation:.55s ease-in-out infinite alternate cable-current}@keyframes cable-current{to{stroke-width:4.8px;opacity:.76}}@media (width<=700px){.routing-hero{padding:42px 20px 28px}.routing-shell{margin:0 12px 40px;padding:18px}.routing-count{display:none!important}.mission{grid-template-columns:1fr;gap:5px}.routing-tip{grid-template-columns:1fr 24px}.routing-tip>span,.routing-tip p{grid-column:1}.routing-tip button{grid-area:1/2}.patchboard{padding:40px 18px 56px}.routing-actions>span{width:100%;margin:4px 0 0}}
