*{box-sizing:border-box}
:root{
  --bg:#050c12;--panel:rgba(7,20,29,.94);--line:rgba(88,157,183,.22);
  --text:#ecf8fb;--muted:#8eaab5;--cyan:#55e7ff;--teal:#42e3c2;--green:#49e49a;
  --red:#ff5b59;--orange:#ff9b4a;--gold:#ffd27b;--shadow:0 22px 70px rgba(0,0,0,.34)
}
html,body{margin:0;min-height:100%;background:
  radial-gradient(circle at 50% 28%,rgba(24,91,111,.18),transparent 34%),
  linear-gradient(180deg,#03090e 0%,#07131b 60%,#040b10 100%);
  color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
body{min-height:100vh;overflow-x:hidden} button{font:inherit}
.app-shell{min-height:100vh;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:12px;padding:12px;position:relative}
.app-shell:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.15;background-image:
  linear-gradient(rgba(72,155,181,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(72,155,181,.12) 1px,transparent 1px);
  background-size:52px 52px;mask-image:linear-gradient(to bottom,black,transparent 88%)}

.topbar,.hud,.panel{border:1px solid var(--line);background:linear-gradient(180deg,rgba(8,24,34,.95),rgba(5,16,23,.95));box-shadow:var(--shadow);backdrop-filter:blur(14px)}
.topbar{min-height:78px;border-radius:17px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:11px 20px}
.brand{display:flex;align-items:center;gap:12px;font-size:22px;font-weight:800;letter-spacing:.06em}
.brand small{display:block;margin-top:2px;color:#6f929e;font-size:9px;letter-spacing:.18em}
.brand-mark{width:43px;height:43px;display:grid;place-items:center;clip-path:polygon(50% 0,100% 100%,72% 100%,50% 48%,28% 100%,0 100%);background:linear-gradient(160deg,var(--cyan),var(--teal));color:#07131b;font-weight:900;font-size:19px}
.game-title{text-align:center}.game-title strong{display:block;font-size:clamp(22px,3vw,38px);letter-spacing:.12em;font-weight:500}
.game-title span{display:block;margin-top:2px;color:var(--muted);font-size:10px;letter-spacing:.18em;text-transform:uppercase}
.top-actions{justify-self:end;display:flex;align-items:center;gap:8px}
.level-box{min-width:190px}.level-box>div:first-child{display:flex;justify-content:space-between;gap:10px}
.level-box span{color:var(--muted);letter-spacing:.09em}.level-box strong{color:var(--teal);font-size:20px}
.xp{height:4px;background:rgba(123,182,201,.15);border-radius:99px;margin:6px 0 4px;overflow:hidden}
.xp i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--teal),var(--cyan));box-shadow:0 0 14px var(--teal);transition:.35s}
.level-box small{color:var(--muted);float:right;font-size:10px}
.icon-btn{width:38px;height:38px;border-radius:10px;border:1px solid var(--line);background:rgba(93,170,193,.06);color:var(--cyan);cursor:pointer;font-size:18px;transition:.2s}
.icon-btn:hover{background:rgba(93,170,193,.13);border-color:rgba(85,231,255,.36)}.icon-btn.off{color:#75909a;opacity:.7}

.workspace{min-height:0;display:grid;grid-template-columns:minmax(290px,360px) minmax(0,1fr);gap:12px}
.panel{border-radius:17px;min-height:0}
.mission-panel{padding:19px;display:flex;flex-direction:column;overflow:hidden}
.mission-main h1{font-size:22px;line-height:1.14;margin:8px 0 6px}
.eyebrow{font-size:11px;letter-spacing:.16em;color:var(--cyan);font-weight:800}
.eyebrow span{color:#6d909c}.mission-progress{display:flex;align-items:baseline;gap:5px;margin:4px 0 8px}
.mission-progress strong{font-size:31px;color:var(--cyan)}.mission-progress span{font-size:17px;color:var(--muted)}
.mission-panel p,.hint{color:var(--muted);line-height:1.48}.mission-panel p{font-size:13px;margin:7px 0}
.divider{height:1px;background:var(--line);margin:14px 0}
.route-text{min-height:42px;max-height:74px;overflow:auto;color:#d8f6fb;line-height:1.4;margin:8px 0 10px;font-size:12px}
.route-security{display:grid;grid-template-columns:1fr auto;gap:5px 10px;align-items:center;font-size:11px;color:var(--muted)}
.route-security strong{color:var(--green);font-size:14px}.security-meter{grid-column:1/-1;height:5px;border-radius:99px;background:rgba(100,164,184,.12);overflow:hidden}
.security-meter i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--green),var(--teal));transition:.25s}
.requirement{margin-top:9px;padding:8px 9px;border-radius:9px;border:1px solid var(--line);background:rgba(90,164,187,.05);font-size:11px;display:flex;align-items:center;gap:7px;color:#a7c4cd}
.req-dot{width:8px;height:8px;border-radius:50%;background:#6e8f9a;box-shadow:0 0 0 3px rgba(110,143,154,.08)}
.mini-legend{display:grid;grid-template-columns:1fr;gap:6px;margin-top:10px;font-size:10px;color:var(--muted)}
.pill,.dot{display:inline-block;width:12px;height:12px;border-radius:50%;margin-right:6px;vertical-align:-2px;border:1px solid rgba(255,255,255,.15)}
.pill.shield,.dot.shield{background:rgba(66,227,194,.35);border-color:rgba(66,227,194,.7)}
.pill.relay,.dot.relay{background:rgba(85,231,255,.25);border-color:rgba(85,231,255,.6)}
.pill.pref,.dot.pref{background:rgba(255,210,123,.25);border-color:rgba(255,210,123,.7)}
.mission-controls{margin-top:auto}.actions{display:grid;gap:8px;margin-top:12px}
.primary,.secondary{border-radius:10px;padding:10px 13px;border:1px solid transparent;cursor:pointer;transition:.2s ease}
.primary{background:linear-gradient(135deg,var(--teal),var(--cyan));color:#031014;font-weight:900;box-shadow:0 7px 22px rgba(79,230,227,.14)}
.primary:disabled{opacity:.33;cursor:not-allowed;filter:grayscale(.4)}
.secondary{background:rgba(98,157,177,.07);border-color:var(--line);color:var(--text)}
.primary:not(:disabled):hover,.secondary:hover{transform:translateY(-1px)}
.hint{padding-top:10px;font-size:10.5px}.record{margin-top:9px;display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding-top:9px}
.record span{font-size:9px;letter-spacing:.12em;color:#6f909b}.record strong{color:var(--gold);font-size:15px}

.network-panel{position:relative;overflow:hidden;padding:12px;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:8px}
.network-head{display:flex;justify-content:space-between;align-items:center;padding:1px 4px 9px;gap:15px}
.network-head>div:first-child{display:grid;gap:2px}.network-head strong{font-size:14px}
.legend{display:flex;gap:13px;color:var(--muted);font-size:10px;flex-wrap:wrap;justify-content:flex-end}
.network{min-height:370px;height:100%;position:relative;border-radius:13px;overflow:hidden;background:
  radial-gradient(circle at 50% 50%,rgba(32,124,149,.12),transparent 37%),
  linear-gradient(180deg,rgba(5,15,22,.72),rgba(3,11,17,.84))}
.network:before{content:"";position:absolute;inset:0;opacity:.22;background:
  radial-gradient(circle at 20% 30%,rgba(86,218,236,.8) 0 1px,transparent 2px),
  radial-gradient(circle at 75% 25%,rgba(86,218,236,.7) 0 1px,transparent 2px),
  radial-gradient(circle at 61% 71%,rgba(86,218,236,.5) 0 1px,transparent 2px);
  background-size:110px 90px,150px 140px,100px 120px}
.edges{position:absolute;inset:0;width:100%;height:100%;z-index:1}.edge{stroke:rgba(130,191,210,.25);stroke-width:2.2;fill:none;vector-effect:non-scaling-stroke;transition:.2s}
.edge.active{stroke:var(--cyan);stroke-width:5;filter:drop-shadow(0 0 8px var(--cyan))}
.edge.pref{stroke:rgba(255,210,123,.55);stroke-width:3}
.nodes-layer{position:absolute;inset:0;z-index:3}
.node{--size:72px;position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);width:var(--size);height:var(--size);border-radius:50%;border:1px solid rgba(126,190,211,.5);background:radial-gradient(circle at 50% 44%,rgba(33,74,89,.92),rgba(5,15,22,.96));color:var(--text);display:grid;place-items:center;cursor:pointer;transition:.22s ease;box-shadow:0 0 0 6px rgba(73,176,205,.04),0 0 22px rgba(42,179,212,.08)}
.node:after{content:"";position:absolute;inset:-6px;border-radius:50%;border:1px solid rgba(88,220,243,.15)}
.node:hover{transform:translate(-50%,-50%) scale(1.055);border-color:var(--cyan)}
.node.start,.node.server{--size:84px}
.node.shield{--size:82px;border-color:var(--teal);box-shadow:0 0 0 8px rgba(66,227,194,.08),0 0 32px rgba(66,227,194,.25)}
.node.pref-selected{border-color:var(--gold);box-shadow:0 0 0 8px rgba(255,210,123,.08),0 0 28px rgba(255,210,123,.28)}
.node-icon,.shield-mark{font-size:26px;font-weight:900;color:var(--cyan)}
.shield-mark{width:44px;height:50px;display:grid;place-items:center;clip-path:polygon(50% 0,92% 18%,84% 72%,50% 100%,16% 72%,8% 18%);background:linear-gradient(180deg,rgba(70,233,218,.9),rgba(33,119,139,.9));color:#041116}
.node-label{position:absolute;top:calc(100% + 9px);white-space:nowrap;font-size:11px;font-weight:800;text-shadow:0 2px 6px #000}
.node small{position:absolute;bottom:calc(100% + 6px);font-size:8px;letter-spacing:.1em;color:var(--muted)}
.tunnel{position:absolute;height:18px;border-radius:99px;background:linear-gradient(90deg,rgba(60,220,250,.12),rgba(77,235,217,.36),rgba(60,220,250,.12));filter:blur(2px);box-shadow:0 0 20px rgba(68,220,242,.4);z-index:2;display:none;transform-origin:left center}
.packet{position:absolute;width:14px;height:14px;border-radius:4px;background:var(--cyan);box-shadow:0 0 18px var(--cyan),0 0 34px rgba(85,231,255,.65);z-index:5;display:none}
.incident{position:absolute;z-index:8;right:12px;top:12px;max-width:260px;background:rgba(54,9,12,.92);border:1px solid rgba(255,91,89,.42);border-radius:10px;padding:8px 10px;color:#ffd9d8;font-size:10px;box-shadow:0 12px 30px rgba(0,0,0,.3)}
.telemetry{border-top:1px solid var(--line);padding-top:6px}
.telemetry-log{font-size:11px;color:#b7d2da;line-height:1.5;min-height:40px;max-height:82px;overflow:auto;background:rgba(59,135,159,.05);border:1px solid var(--line);border-radius:10px;padding:8px 10px}

.hud{border-radius:17px;display:grid;grid-template-columns:repeat(5,1fr);min-height:96px}
.hud section{padding:13px 16px;display:flex;align-items:center;gap:11px;border-right:1px solid var(--line)}
.hud section:last-child{border-right:0}.hud-icon{font-size:27px;color:var(--cyan);min-width:30px;text-align:center}
.hud small{display:block;color:var(--muted);letter-spacing:.08em;font-size:9px}.hud strong{display:block;font-size:21px;color:var(--cyan);margin:1px 0}.hud em{display:block;color:var(--green);font-style:normal;font-size:9px}
.hud .score strong{color:var(--gold)}.meter{height:4px;background:rgba(124,183,200,.14);border-radius:99px;margin-top:6px;overflow:hidden}.meter i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--teal),var(--cyan));transition:.3s}

.toast{position:fixed;left:50%;bottom:118px;transform:translateX(-50%) translateY(10px);z-index:20;background:rgba(6,18,26,.97);border:1px solid var(--line);border-radius:11px;padding:10px 15px;color:var(--text);opacity:0;pointer-events:none;transition:.25s;box-shadow:var(--shadow);font-size:12px}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}.toast.good{border-color:rgba(73,228,154,.4)}.toast.bad{border-color:rgba(255,91,89,.45);color:#ffd6d5}

.modal{position:fixed;inset:0;z-index:30;background:rgba(0,7,11,.8);backdrop-filter:blur(12px);display:grid;place-items:center;padding:18px}
.modal[hidden]{display:none}.modal-card{width:min(560px,100%);background:linear-gradient(180deg,#0b202c,#07131b);border:1px solid rgba(78,213,231,.3);border-radius:19px;padding:26px;box-shadow:0 40px 100px rgba(0,0,0,.55)}
.modal-card h2{font-size:28px;margin:7px 0}.modal-card p{color:var(--muted);line-height:1.5}
.result-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin:20px 0}.result-grid>div,.challenge-status>div{padding:12px;border-radius:11px;background:rgba(73,153,178,.08);border:1px solid var(--line)}
.result-grid small,.challenge-status small{display:block;color:var(--muted)}.result-grid strong,.challenge-status strong{display:block;margin-top:4px;color:var(--cyan)}
.modal-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px}.tutorial-steps{display:grid;gap:9px;margin:18px 0 22px}.tutorial-steps>div{display:grid;grid-template-columns:30px 1fr;gap:10px;align-items:center;padding:9px;border:1px solid var(--line);border-radius:10px;background:rgba(69,160,185,.05)}.tutorial-steps b{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:rgba(85,231,255,.1);color:var(--cyan)}.tutorial-steps span{color:#b8d2da;font-size:12px;line-height:1.4}
.challenge-card{width:min(760px,100%)}.challenge-status{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin:14px 0}
.challenge-rule{padding:11px 12px;border-radius:10px;background:rgba(67,162,187,.06);border:1px solid var(--line);font-size:12px;color:#bfd5db;line-height:1.45}
.challenge-area{margin-top:14px}
.challenge-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.challenge-btn,.memory-card,.filter-card{border-radius:12px;padding:14px 10px;border:1px solid var(--line);background:rgba(93,170,193,.06);color:var(--text);cursor:pointer;transition:.18s;font-weight:800;letter-spacing:.04em}
.challenge-btn:hover,.memory-card:hover,.filter-card:hover{transform:translateY(-1px);border-color:rgba(85,231,255,.36)}
.challenge-btn.correct,.memory-card.correct,.filter-card.correct{background:rgba(73,228,154,.14);border-color:rgba(73,228,154,.45);color:#c9f9e0}
.challenge-btn.wrong,.memory-card.wrong,.filter-card.wrong{background:rgba(255,91,89,.12);border-color:rgba(255,91,89,.4);color:#ffd0cf}
.memory-grid,.filter-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.memory-card{min-height:72px}
.memory-card.revealed{background:rgba(85,231,255,.1)}
.filter-card{min-height:72px}
.campaign-score{margin:20px 0;padding:16px;border-radius:12px;background:rgba(73,153,178,.08);border:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}.campaign-score span{color:var(--muted);font-size:11px;letter-spacing:.12em}.campaign-score strong{font-size:30px;color:var(--gold)}


.challenge-ready{padding:16px;border-radius:12px;border:1px solid rgba(85,231,255,.24);background:linear-gradient(180deg,rgba(37,105,126,.10),rgba(12,38,50,.18));display:grid;gap:12px}
.challenge-ready h3{margin:0;font-size:16px;color:var(--text)}
.challenge-ready p{margin:0;color:var(--muted);font-size:12px;line-height:1.5}
.challenge-ready .primary{justify-self:start;min-width:180px}
.policy-box{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
.policy-group{border:1px solid var(--line);border-radius:11px;padding:11px 12px;background:rgba(73,153,178,.05)}
.policy-group strong{display:block;font-size:11px;letter-spacing:.12em;margin-bottom:7px}
.policy-group.allow strong{color:var(--green)}
.policy-group.block strong{color:var(--red)}
.policy-tags{display:flex;gap:6px;flex-wrap:wrap}
.policy-tag{border-radius:999px;padding:5px 8px;font-size:11px;font-weight:800;background:rgba(255,255,255,.04);border:1px solid var(--line)}
.policy-group.allow .policy-tag{border-color:rgba(73,228,154,.28);color:#c9f9e0}
.policy-group.block .policy-tag{border-color:rgba(255,91,89,.28);color:#ffd0cf}
@media (min-width:900px) and (max-height:820px){
  html,body{height:100%;overflow:hidden}
  .app-shell{height:100dvh;min-height:0;grid-template-rows:70px minmax(0,1fr) 90px;gap:8px;padding:8px}
  .topbar{min-height:0;border-radius:14px;padding:8px 16px}.brand-mark{width:38px;height:38px}.brand{font-size:19px}.game-title strong{font-size:30px}.level-box{min-width:165px}.icon-btn{width:34px;height:34px}
  .workspace{gap:8px}.mission-panel{padding:14px}.mission-main h1{font-size:18px;margin:5px 0}.mission-progress{margin:1px 0 3px}.mission-progress strong{font-size:26px}.mission-panel p{font-size:11px;margin:4px 0}.divider{margin:9px 0}.route-text{min-height:30px;max-height:48px;margin:5px 0 6px}.requirement{margin-top:5px;padding:6px 8px}.mini-legend{margin-top:6px;gap:4px}.actions{margin-top:7px;gap:6px}.primary,.secondary{padding:8px 11px}.hint{padding-top:6px;font-size:9px}.record{margin-top:5px;padding-top:5px}
  .network-panel{padding:8px}.network-head{padding-bottom:5px}.network{min-height:0;height:100%}
  .node{--size:62px}.node.start,.node.server{--size:72px}.node.shield{--size:74px}.node-icon{font-size:23px}.shield-mark{width:38px;height:44px}.node-label{font-size:10px;top:calc(100% + 7px)}.node small{font-size:7px;bottom:calc(100% + 6px)}
  .hud{min-height:0;border-radius:14px}.hud section{padding:9px 13px}.hud-icon{font-size:23px}.hud strong{font-size:18px}.hud small,.hud em{font-size:8px}.toast{bottom:102px}
}
@media (max-width:1100px){
  body{overflow:auto}.workspace{grid-template-columns:1fr}.mission-panel{display:grid;grid-template-columns:1.1fr .9fr;gap:10px 20px}.mission-main{grid-column:1}.mission-route{grid-column:2;grid-row:1}.mission-controls{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:10px 16px}.mission-controls .actions{grid-column:1}.mission-controls .hint,.mission-controls .record{grid-column:2}.network{min-height:520px}.hud{grid-template-columns:repeat(3,1fr)}.hud section:nth-child(3){border-right:0}.hud section:nth-child(4),.hud section:nth-child(5){border-top:1px solid var(--line)}.hud section:nth-child(4){grid-column:1/3}.challenge-grid{grid-template-columns:repeat(2,1fr)}.memory-grid,.filter-grid{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:760px){
  .app-shell{padding:7px;gap:7px}.topbar{grid-template-columns:1fr auto;padding:10px 12px}.game-title{display:none}.level-box{display:none}.brand-name{font-size:17px}.brand-mark{width:34px;height:34px}.top-actions{gap:5px}.icon-btn{width:35px;height:35px}.mission-panel{display:flex;padding:15px}.mission-controls{display:block}.network-panel{padding:8px}.network-head{align-items:flex-start}.legend{display:none}.network{min-height:500px;overflow:auto}.node{--size:60px}.node.start,.node.server{--size:67px}.node.shield{--size:70px}.node-label{font-size:10px}.hud{grid-template-columns:1fr 1fr}.hud section{padding:10px;border-top:1px solid var(--line)}.hud section:nth-child(2n){border-right:0}.hud section:first-child,.hud section:nth-child(2){border-top:0}.hud section:last-child{grid-column:1/-1}.hud strong{font-size:18px}.toast{bottom:18px;width:calc(100% - 24px);text-align:center}.modal-actions{grid-template-columns:1fr}.challenge-status{grid-template-columns:1fr}.challenge-grid,.memory-grid,.filter-grid{grid-template-columns:1fr}
}

.challenge-rule[hidden]{display:none!important}


/* Build008 — additional VPN challenge mechanics */
.challenge-choice-grid,.fingerprint-grid,.priority-grid,.mapping-grid,.checksum-grid,.pulse-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:10px
}
.challenge-choice,.fingerprint-card,.priority-card,.mapping-card,.checksum-card,.pulse-node{
  border-radius:12px;padding:14px 10px;border:1px solid var(--line);
  background:rgba(93,170,193,.06);color:var(--text);cursor:pointer;
  transition:.18s;font-weight:800;letter-spacing:.04em;min-height:58px
}
.challenge-choice:hover,.fingerprint-card:hover,.priority-card:hover,.mapping-card:hover,.checksum-card:hover,.pulse-node:hover{
  transform:translateY(-1px);border-color:rgba(85,231,255,.36)
}
.challenge-choice.correct,.fingerprint-card.correct,.priority-card.correct,.mapping-card.correct,.checksum-card.correct,.pulse-node.correct{
  background:rgba(73,228,154,.14);border-color:rgba(73,228,154,.45);color:#c9f9e0
}
.challenge-choice.wrong,.fingerprint-card.wrong,.priority-card.wrong,.mapping-card.wrong,.checksum-card.wrong,.pulse-node.wrong{
  background:rgba(255,91,89,.12);border-color:rgba(255,91,89,.4);color:#ffd0cf
}
.challenge-question{
  padding:14px;border-radius:12px;border:1px solid rgba(85,231,255,.24);
  background:rgba(37,105,126,.08);margin-bottom:12px;text-align:center
}
.challenge-question small{display:block;color:var(--muted);letter-spacing:.1em;margin-bottom:5px}
.challenge-question strong{font-size:22px;color:var(--cyan)}
.challenge-preview{
  padding:12px;border-radius:11px;background:rgba(73,153,178,.06);
  border:1px solid var(--line);line-height:1.55;color:#c5dce3
}
.challenge-preview strong{color:var(--cyan)}
.pulse-node{font-size:18px}
.pulse-node.flash{
  background:rgba(85,231,255,.24);border-color:var(--cyan);
  box-shadow:0 0 28px rgba(85,231,255,.36);transform:scale(1.04)
}
.mini-stat{display:inline-block;border:1px solid var(--line);border-radius:999px;padding:4px 8px;margin:3px;color:#c3dbe2;font-size:11px}
@media (max-width:1100px){
  .challenge-choice-grid,.fingerprint-grid,.priority-grid,.mapping-grid,.checksum-grid,.pulse-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:760px){
  .challenge-choice-grid,.fingerprint-grid,.priority-grid,.mapping-grid,.checksum-grid,.pulse-grid{grid-template-columns:1fr}
}

.perfect-summary{display:grid;grid-template-columns:150px 1fr;gap:12px;align-items:center;margin:14px 0}
.perfect-summary>div:first-child{padding:12px;border:1px solid var(--line);border-radius:11px;background:rgba(73,153,178,.06)}
.perfect-summary small{display:block;color:var(--muted);font-size:9px;letter-spacing:.1em}
.perfect-summary strong{display:block;color:var(--gold);font-size:22px;margin-top:4px}
.round-stars-grid{display:grid;grid-template-columns:repeat(15,1fr);gap:4px}
.round-star{height:28px;border-radius:7px;display:grid;place-items:center;border:1px solid var(--line);background:rgba(82,153,176,.05);font-size:10px;color:#75919b}
.round-star.perfect{color:var(--gold);border-color:rgba(255,210,123,.34);background:rgba(255,210,123,.07)}
.bonus-state{margin:14px 0;padding:14px;border-radius:12px;border:1px solid var(--line);display:grid;gap:5px}
.bonus-state strong{letter-spacing:.08em;font-size:12px}
.bonus-state span,.bonus-state small{color:var(--muted);font-size:11px;line-height:1.4}
.bonus-state.locked{background:rgba(107,132,142,.05)}
.bonus-state.unlocked{background:rgba(73,228,154,.06);border-color:rgba(73,228,154,.3)}
.bonus-state.unlocked strong{color:var(--green)}
.bonus-button{margin-top:8px}
.campaign-restart{width:100%;margin-top:4px}
@media(max-width:760px){
  .perfect-summary{grid-template-columns:1fr}
  .round-stars-grid{grid-template-columns:repeat(5,1fr)}
}

.server-gate{margin-top:7px;padding-top:7px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:10px;align-items:center}
.server-gate span{font-size:8px;letter-spacing:.12em;color:#6f909b}.server-gate strong{font-size:10px;color:var(--orange);text-align:right}
.server-gate strong.ok{color:var(--green)}.server-gate strong.error{color:var(--red)}


/* Build011 — server-authoritative per-round logic gate */
.server-verify-card{max-width:760px}
.server-verify-status{margin:14px 0}
.server-verify-rule{padding:13px 15px;border:1px solid rgba(85,231,255,.28);border-radius:12px;background:rgba(85,231,255,.055);color:#d9f7fb;font-weight:750;line-height:1.45}
.server-verify-prompt{margin-top:10px;padding:14px;border:1px solid var(--line);border-radius:12px;background:rgba(67,151,175,.05);color:#bcd5dd;line-height:1.55;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.server-verify-choices{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:13px}
.server-verify-choice{min-height:52px;border-radius:11px;border:1px solid var(--line);background:rgba(70,157,181,.06);color:var(--text);font-weight:850;cursor:pointer;padding:10px;transition:.15s}
.server-verify-choice:hover{border-color:rgba(85,231,255,.5);transform:translateY(-1px)}
.server-verify-choice:disabled{cursor:default;opacity:.6}
.server-verify-choice.correct{border-color:rgba(73,228,154,.55);background:rgba(73,228,154,.13);color:#d4ffe8}
.server-verify-choice.wrong{border-color:rgba(255,93,96,.55);background:rgba(255,93,96,.13);color:#ffd8d8}
.server-verify-feedback{min-height:24px;margin-top:9px;color:var(--muted);font-size:12px}
.server-verify-feedback.good{color:var(--green)}
.server-verify-feedback.bad{color:#ff9c9f}
@media(max-width:650px){.server-verify-choices{grid-template-columns:1fr 1fr}}


/* Build011 MOBILE UX1 — touch/mobile fairness pass */
button,.node{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
button{min-height:44px}

@media (pointer:coarse){
  .node:hover,.challenge-btn:hover,.memory-card:hover,.filter-card:hover,
  .challenge-choice:hover,.fingerprint-card:hover,.priority-card:hover,.mapping-card:hover,
  .checksum-card:hover,.pulse-node:hover,.server-verify-choice:hover{transform:none}
}

@media (max-width:760px){
  html,body{max-width:100%;overflow-x:hidden}
  .app-shell{
    padding:max(6px,env(safe-area-inset-top)) max(6px,env(safe-area-inset-right)) max(6px,env(safe-area-inset-bottom)) max(6px,env(safe-area-inset-left));
  }
  .topbar{min-height:58px;border-radius:13px;padding:7px 9px}
  .brand>div:last-child small{font-size:7px}.brand-name{font-size:16px}.brand-mark{width:32px;height:32px}
  .icon-btn{width:42px;height:42px;min-height:42px}
  .mission-panel{padding:12px}.mission-main h1{font-size:20px}.mission-panel p{font-size:11px;line-height:1.4}
  .mission-progress strong{font-size:27px}.route-text{min-height:30px}
  .actions{grid-template-columns:1fr 1fr}.actions .primary{grid-column:1/-1}
  .primary,.secondary{min-height:46px;padding:10px 11px}
  .network{min-height:0;height:clamp(350px,100vw,440px);overflow:hidden}
  .node{--size:clamp(52px,15vw,60px)}
  .node.start,.node.server{--size:clamp(58px,17vw,67px)}
  .node.shield{--size:clamp(61px,18vw,70px)}
  .node-label{max-width:82px;line-height:1.1}
  .telemetry-log{max-height:84px;overflow:auto;overscroll-behavior:contain}
  .hud{border-radius:13px}.hud section{min-height:76px;padding:8px}.hud-icon{font-size:22px;min-width:24px}.hud strong{font-size:17px}

  /* Timed client challenges: compact, two columns, no page scrolling required on normal phones. */
  .modal{
    padding:max(5px,env(safe-area-inset-top)) max(5px,env(safe-area-inset-right)) max(5px,env(safe-area-inset-bottom)) max(5px,env(safe-area-inset-left));
  }
  .challenge-card,.server-verify-card{
    width:100%;max-width:100%;max-height:calc(100dvh - 10px);overflow:hidden;
    padding:12px;border-radius:14px;display:flex;flex-direction:column;
  }
  .challenge-card h2,.server-verify-card h2{font-size:clamp(18px,5.6vw,23px);margin:3px 0}
  .challenge-card>p,.server-verify-card>p{font-size:10px;line-height:1.3;margin:2px 0 4px}
  .challenge-status{grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;margin:6px 0}
  .challenge-status>div{padding:6px 4px;text-align:center}
  .challenge-status small{font-size:8px}.challenge-status strong{font-size:13px;margin-top:2px}
  .challenge-rule,.server-verify-rule{padding:7px 8px;font-size:10px;line-height:1.3;max-height:22dvh;overflow:auto;overscroll-behavior:contain}
  .server-verify-prompt{margin-top:6px;padding:8px;font-size:11px;line-height:1.35;max-height:18dvh;overflow:auto;overscroll-behavior:contain}
  .challenge-area{margin-top:7px;min-height:0;overflow:auto;overscroll-behavior:contain}
  .challenge-grid,.memory-grid,.filter-grid,
  .challenge-choice-grid,.fingerprint-grid,.priority-grid,.mapping-grid,.checksum-grid,.pulse-grid,
  .server-verify-choices{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
  .challenge-btn,.memory-card,.filter-card,.challenge-choice,.fingerprint-card,.priority-card,.mapping-card,.checksum-card,.pulse-node,.server-verify-choice{
    min-height:46px;padding:7px 6px;font-size:11px;line-height:1.2;overflow-wrap:anywhere;
  }
  .memory-card,.filter-card{min-height:50px}
  .challenge-question{padding:8px;margin-bottom:7px}.challenge-question strong{font-size:17px}
  .challenge-preview{padding:8px;font-size:10px;line-height:1.35}
  .policy-box{gap:6px;margin-top:7px}.policy-group{padding:7px}.policy-tag{padding:4px 6px;font-size:9px}
  .challenge-ready{padding:9px;gap:7px}.challenge-ready h3{font-size:14px}.challenge-ready p{font-size:10px;line-height:1.35}.challenge-ready .primary{width:100%;min-width:0}
  .server-verify-choices{margin-top:7px}.server-verify-feedback{min-height:16px;margin-top:5px;font-size:10px}
  .modal-actions{margin-top:7px;gap:6px}.modal-actions button{min-height:44px;padding:8px;font-size:11px}
  .round-stars-grid{grid-template-columns:repeat(5,1fr)}
}

@media (max-width:360px){
  .app-shell{padding:4px;gap:5px}.top-actions{gap:3px}.brand>div:last-child small{display:none}
  .network{height:clamp(325px,104vw,380px)}
  .hud section{min-height:70px}.hud small{font-size:7px}.hud em{font-size:7px}
  .challenge-card,.server-verify-card{padding:9px}
  .challenge-card>.eyebrow,.server-verify-card>.eyebrow{font-size:8px}
  .challenge-card>p,.server-verify-card>p{display:none}
  .challenge-rule,.server-verify-rule{font-size:9px}
  .server-verify-prompt{font-size:10px}
}

@media (max-height:620px) and (max-width:900px){
  .challenge-card,.server-verify-card{padding:8px}
  .challenge-card>.eyebrow,.server-verify-card>.eyebrow,
  .challenge-card>p,.server-verify-card>p{display:none}
  .challenge-card h2,.server-verify-card h2{font-size:17px;margin:1px 0}
  .challenge-status{margin:3px 0}.challenge-status>div{padding:4px}
  .challenge-rule,.server-verify-rule{max-height:18dvh;padding:5px 6px}
  .server-verify-prompt{max-height:16dvh;padding:6px}
  .challenge-area{margin-top:4px}
  .challenge-btn,.memory-card,.filter-card,.challenge-choice,.fingerprint-card,.priority-card,.mapping-card,.checksum-card,.pulse-node,.server-verify-choice{min-height:44px;padding:5px;font-size:10px}
  .modal-actions{margin-top:4px}
}

/* Build012 FIX2 — logic/score clarity */
.challenge-btn small,.priority-card small{display:block;margin-top:4px;color:var(--muted);font-size:9px;font-weight:600;line-height:1.25}
@media(max-width:760px){.result-grid{grid-template-columns:1fr 1fr}}