/* Wolf Hack Academy · Phase 03 Practice / Cyber Range / Knowledge Operations */
.phase03-page{--p3-navy:#061629;--p3-navy-2:#0a203b;--p3-cyan:#18d8ff;--p3-blue:#1677ff;--p3-ice:#f3f8fc;--p3-steel:#6f8298;--p3-line:rgba(38,125,190,.22);--p3-shadow:0 22px 55px rgba(6,22,41,.14)}
.phase03-page .p3-section{position:relative;overflow:hidden;padding:clamp(3.8rem,6vw,6.4rem) 0;background:linear-gradient(180deg,#f8fbfe 0%,#eef5fa 100%)}
.phase03-page .p3-section.dark{background:radial-gradient(circle at 82% 15%,rgba(24,216,255,.12),transparent 26%),linear-gradient(145deg,#04111f 0%,#071b31 52%,#092540 100%);color:#fff}
.phase03-page .p3-section:before{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(33,116,174,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(33,116,174,.045) 1px,transparent 1px);background-size:34px 34px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.65),transparent 92%)}
.p3-kicker{display:inline-flex;align-items:center;gap:.55rem;font:700 .74rem/1.1 "IBM Plex Mono",monospace;letter-spacing:.15em;text-transform:uppercase;color:#0878c8}.dark .p3-kicker{color:#55ddff}.p3-kicker:before{content:"";width:26px;height:2px;background:linear-gradient(90deg,#1689ff,#19e0ff)}
.p3-head{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(260px,.8fr);gap:2rem;align-items:end;margin-bottom:2rem}.p3-head h2{margin:.55rem 0 0;font-family:"Chakra Petch",sans-serif;font-size:clamp(2rem,3.4vw,3.5rem);line-height:.96;letter-spacing:-.035em}.p3-head p{margin:0;color:#53687f;font-size:1.02rem;line-height:1.7}.dark .p3-head p{color:#b9ccdc}
.p3-range-deck{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(340px,.9fr);gap:1.25rem}.p3-panel{position:relative;border:1px solid var(--p3-line);border-radius:24px;background:rgba(255,255,255,.88);box-shadow:var(--p3-shadow);overflow:hidden}.dark .p3-panel{background:linear-gradient(150deg,rgba(10,35,61,.94),rgba(4,18,33,.94));border-color:rgba(47,188,255,.24);box-shadow:0 30px 75px rgba(0,0,0,.28)}
.p3-panel-head{display:flex;justify-content:space-between;gap:1rem;align-items:center;padding:1rem 1.15rem;border-bottom:1px solid var(--p3-line);font:700 .72rem/1 "IBM Plex Mono",monospace;letter-spacing:.11em;text-transform:uppercase;color:#5a7186}.dark .p3-panel-head{color:#9bc6df}.p3-panel-head .live{display:inline-flex;align-items:center;gap:.4rem;color:#0c9f82}.dark .p3-panel-head .live{color:#47edc1}.p3-panel-head .live:before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;box-shadow:0 0 0 5px color-mix(in srgb,currentColor 12%,transparent)}
.p3-stage-media{padding:1rem}.p3-stage-media img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:contain;border-radius:16px;background:#041425;border:1px solid rgba(33,135,198,.2)}
.p3-cap-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem;padding:1rem}.p3-cap{min-height:140px;border:1px solid rgba(37,119,177,.18);border-radius:16px;padding:1rem;background:linear-gradient(145deg,#fff,#f3f8fc);display:flex;flex-direction:column;gap:.45rem}.dark .p3-cap{background:rgba(8,31,54,.78);border-color:rgba(49,177,238,.2)}.p3-cap img{width:50px;height:50px;object-fit:contain}.p3-cap b{font-family:"Chakra Petch",sans-serif;font-size:1.05rem}.p3-cap span{color:#61758a;font-size:.86rem;line-height:1.45}.dark .p3-cap span{color:#a8bfd1}
.p3-radar-wrap{display:grid;grid-template-columns:220px 1fr;gap:1.25rem;padding:1.2rem}.p3-radar{position:relative;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(12,151,216,.16) 0 2%,transparent 3%),repeating-radial-gradient(circle,transparent 0 19%,rgba(45,165,221,.16) 20% 21%),conic-gradient(from 0deg,rgba(23,128,255,.2),rgba(18,222,255,.04),rgba(23,128,255,.18));border:1px solid rgba(33,164,221,.3)}.p3-radar:before,.p3-radar:after{content:"";position:absolute;inset:50% 0 auto;height:1px;background:rgba(55,181,231,.25);transform-origin:center}.p3-radar:after{transform:rotate(90deg)}.p3-radar-core{position:absolute;inset:28%;clip-path:polygon(50% 0,91% 25%,80% 76%,48% 100%,10% 73%,15% 22%);background:linear-gradient(145deg,rgba(26,136,255,.55),rgba(20,226,255,.18));border:1px solid #2fd8ff;filter:drop-shadow(0 0 18px rgba(31,193,255,.25))}.p3-radar-label{position:absolute;font:700 .62rem/1 "IBM Plex Mono",monospace;color:#7a93a9}.dark .p3-radar-label{color:#a9cfe5}.p3-radar-label.t{top:5%;left:50%;transform:translateX(-50%)}.p3-radar-label.r{right:2%;top:47%}.p3-radar-label.b{bottom:5%;left:50%;transform:translateX(-50%)}.p3-radar-label.l{left:2%;top:47%}
.p3-stat-list{display:grid;gap:.7rem}.p3-stat{padding:.8rem 0;border-bottom:1px solid var(--p3-line);display:flex;justify-content:space-between;gap:1rem}.p3-stat:last-child{border-bottom:0}.p3-stat span{font:600 .72rem/1.2 "IBM Plex Mono",monospace;letter-spacing:.07em;color:#74889c}.p3-stat b{font-family:"Chakra Petch",sans-serif;color:#102945}.dark .p3-stat b{color:#eefaff}
.p3-special-workspace{position:relative;z-index:1;border:1px solid rgba(32,140,208,.25);border-radius:26px;background:linear-gradient(160deg,#061628,#0b2744);box-shadow:0 28px 70px rgba(2,15,29,.28);overflow:hidden;color:#dcefff}.p3-workspace-bar{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.9rem 1.1rem;border-bottom:1px solid rgba(53,175,235,.19);font:700 .72rem/1.2 "IBM Plex Mono",monospace;letter-spacing:.1em}.p3-workspace-bar .ref{color:#56d9ff}.p3-workspace-grid{display:grid;grid-template-columns:220px 1fr 230px;min-height:390px}.p3-workspace-side{padding:1rem;border-right:1px solid rgba(49,164,222,.16);background:rgba(2,14,27,.32)}.p3-workspace-side.right{border-right:0;border-left:1px solid rgba(49,164,222,.16)}.p3-workspace-side h3{font-size:.8rem;margin:0 0 1rem;color:#61dcff;text-transform:uppercase;letter-spacing:.09em}.p3-workspace-side ul{list-style:none;margin:0;padding:0;display:grid;gap:.6rem}.p3-workspace-side li{padding:.72rem;border:1px solid rgba(69,175,226,.16);border-radius:12px;background:rgba(5,31,55,.7);font-size:.8rem;color:#c1d7e6}.p3-workspace-main{position:relative;padding:1.2rem;overflow:hidden}.p3-workspace-main:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(62,169,219,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(62,169,219,.06) 1px,transparent 1px);background-size:28px 28px}.p3-canvas{position:relative;z-index:1;height:100%;min-height:350px;border:1px solid rgba(75,190,239,.16);border-radius:16px;background:rgba(2,13,26,.58);overflow:hidden}
/* Attack surface graph */
.p3-network-node{position:absolute;min-width:116px;padding:.65rem .75rem;border-radius:12px;border:1px solid rgba(53,204,255,.42);background:linear-gradient(145deg,#0c3154,#08243e);box-shadow:0 12px 24px rgba(0,0,0,.24);font-size:.72rem}.p3-network-node b{display:block;color:#fff}.p3-network-node span{color:#8fc7df}.p3-network-node.n1{left:7%;top:16%}.p3-network-node.n2{left:39%;top:9%}.p3-network-node.n3{right:7%;top:25%}.p3-network-node.n4{left:26%;bottom:12%}.p3-network-node.n5{right:18%;bottom:9%;border-color:#ffb354}.p3-network-line{position:absolute;height:2px;background:linear-gradient(90deg,#1593ff,#2fe8ff);opacity:.45;transform-origin:left center}.p3-network-line.l1{left:22%;top:30%;width:22%;transform:rotate(-13deg)}.p3-network-line.l2{left:50%;top:25%;width:27%;transform:rotate(18deg)}.p3-network-line.l3{left:20%;top:42%;width:28%;transform:rotate(48deg)}.p3-network-line.l4{left:48%;bottom:25%;width:30%;transform:rotate(-16deg)}
/* Web request/response */
.p3-http-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;height:100%;padding:1rem}.p3-http-pane{border:1px solid rgba(66,181,232,.19);border-radius:14px;background:#03182b;padding:1rem}.p3-http-pane code{color:#52ddff;font-size:.7rem}.p3-http-pane pre{white-space:pre-wrap;color:#d7e7f3;font:500 .72rem/1.65 "IBM Plex Mono",monospace}.p3-http-status{display:inline-flex;padding:.35rem .55rem;border-radius:999px;background:rgba(68,233,176,.12);color:#58e5b5;font:700 .68rem/1 "IBM Plex Mono",monospace}
/* SSDLC */
.p3-pipeline{position:relative;display:grid;grid-template-columns:repeat(7,minmax(90px,1fr));gap:.6rem;padding:1.2rem;align-items:stretch}.p3-gate{position:relative;padding:1rem .75rem;border:1px solid rgba(62,174,223,.19);border-radius:14px;background:linear-gradient(155deg,#0a2b49,#061a2f);text-align:center}.p3-gate:after{content:"";position:absolute;right:-.55rem;top:50%;width:.55rem;height:2px;background:#25bff1}.p3-gate:last-child:after{display:none}.p3-gate span{display:block;color:#54d9ff;font:700 .65rem/1 "IBM Plex Mono",monospace}.p3-gate b{display:block;margin:.55rem 0;color:#fff;font-size:.82rem}.p3-gate small{color:#94aec1;font-size:.7rem}
/* Forensics */
.p3-evidence-chain{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.8rem;padding:1.2rem}.p3-evidence-card{position:relative;padding:1rem;border:1px solid rgba(66,184,232,.2);border-radius:14px;background:rgba(4,29,51,.84)}.p3-evidence-card:not(:last-child):after{content:"→";position:absolute;right:-.7rem;top:50%;color:#29cdfc}.p3-evidence-card code{display:block;color:#53dfff;font-size:.65rem}.p3-evidence-card b{display:block;color:#fff;margin:.5rem 0}.p3-hash{font:500 .62rem/1.5 "IBM Plex Mono",monospace;color:#8faabd;word-break:break-all}
/* Cloud */
.p3-control-matrix{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.8rem;padding:1.2rem}.p3-control{padding:1rem;border:1px solid rgba(65,181,229,.18);border-radius:14px;background:linear-gradient(145deg,#0b2e4e,#061a2e)}.p3-control b{display:block;color:#fff;margin:.35rem 0}.p3-control code{color:#52dfff;font-size:.65rem}.p3-control span{color:#9fb7c9;font-size:.75rem}.p3-control .bar{display:block;height:4px;border-radius:4px;margin-top:.8rem;background:linear-gradient(90deg,#1387ff,#1fdfff 72%,rgba(255,255,255,.08) 72%)}
/* Simulators */
.p3-sim-grid{position:relative;z-index:1;display:grid;grid-template-columns:minmax(300px,.8fr) 1.2fr;gap:1rem}.p3-domain-radar{padding:1.1rem}.p3-domain-bars{padding:1.1rem;display:grid;gap:.8rem}.p3-domain-row{display:grid;grid-template-columns:150px 1fr 70px;align-items:center;gap:.7rem}.p3-domain-row span{font-size:.8rem;color:#5d7286}.p3-domain-row .track{height:8px;border-radius:999px;background:#dbe8f1;overflow:hidden}.p3-domain-row .track i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#197bff,#19d9ff)}.p3-domain-row code{font-size:.66rem;color:#6d8397}.p3-remediation{display:grid;grid-template-columns:repeat(4,1fr);gap:.75rem;margin-top:1rem}.p3-remediation article{padding:1rem;border:1px solid var(--p3-line);border-radius:16px;background:#fff}.p3-remediation strong{display:block;color:#0a2b49}.p3-remediation span{display:block;margin-top:.35rem;color:#60758a;font-size:.82rem}
/* Materials */
.p3-filterbar{position:relative;z-index:1;display:flex;flex-wrap:wrap;gap:.5rem;margin:0 0 1.4rem}.p3-filterbar button{appearance:none;border:1px solid rgba(24,120,184,.22);background:#fff;color:#31506d;border-radius:999px;padding:.65rem .95rem;font:700 .72rem/1 "IBM Plex Mono",monospace;cursor:pointer;transition:.2s ease}.p3-filterbar button:hover,.p3-filterbar button[aria-pressed="true"]{background:#08243f;color:#fff;border-color:#168eff;box-shadow:0 8px 24px rgba(20,119,199,.17)}.p3-resource-flow{position:relative;z-index:1;display:grid;grid-template-columns:repeat(5,1fr);gap:.7rem;margin-top:1.2rem}.p3-resource-flow div{padding:1rem;border-radius:16px;border:1px solid var(--p3-line);background:#fff}.p3-resource-flow code{color:#0b83c9;font-size:.65rem}.p3-resource-flow b{display:block;margin:.4rem 0;color:#0d2944}.p3-resource-flow span{font-size:.78rem;color:#667b8f}
/* Resource pages */
.p3-resource-studio{position:relative;z-index:1;display:grid;grid-template-columns:260px 1fr;gap:1rem}.p3-resource-nav{border:1px solid var(--p3-line);border-radius:20px;background:#fff;padding:1rem;box-shadow:var(--p3-shadow)}.p3-resource-nav h3{font-size:.85rem;margin:0 0 .8rem;color:#0b2a47}.p3-resource-nav button{width:100%;text-align:left;border:0;border-bottom:1px solid #e3edf3;background:transparent;padding:.75rem .25rem;color:#567087;font:600 .78rem/1.2 "Manrope",sans-serif}.p3-resource-nav button:last-child{border-bottom:0}.p3-resource-nav button.active{color:#047ac2}.p3-resource-canvas{border:1px solid var(--p3-line);border-radius:22px;background:linear-gradient(160deg,#fff,#f0f6fa);padding:1rem;box-shadow:var(--p3-shadow);min-height:360px}.p3-demo-label{display:inline-flex;padding:.38rem .6rem;border-radius:999px;background:#e9f5fb;color:#0577b9;font:700 .65rem/1 "IBM Plex Mono",monospace;letter-spacing:.07em}.p3-heatmap{display:grid;grid-template-columns:110px repeat(5,1fr);gap:4px;margin-top:1rem}.p3-heatmap div{min-height:48px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:.68rem;text-align:center}.p3-heatmap .axis{background:#e8f1f6;color:#526d82}.p3-heatmap .h1{background:#dff5ef}.p3-heatmap .h2{background:#e7f0bd}.p3-heatmap .h3{background:#ffe6ad}.p3-heatmap .h4{background:#ffc6a2}.p3-heatmap .h5{background:#f5a5a5}.p3-check-matrix{width:100%;border-collapse:collapse;margin-top:1rem}.p3-check-matrix th,.p3-check-matrix td{padding:.75rem;border-bottom:1px solid #dce8f0;text-align:left;font-size:.78rem}.p3-check-matrix th{font:700 .68rem/1 "IBM Plex Mono",monospace;color:#506a80}.p3-status-pill{display:inline-flex;padding:.35rem .5rem;border-radius:999px;background:#e9f5fb;color:#0879b9;font:700 .62rem/1 "IBM Plex Mono",monospace}.p3-incident-flow{display:grid;grid-template-columns:repeat(5,1fr);gap:.65rem;margin-top:1rem}.p3-incident-step{padding:1rem;border-radius:14px;background:#071f37;color:#dcecf7;border:1px solid rgba(35,159,217,.22)}.p3-incident-step code{color:#50dcff;font-size:.65rem}.p3-incident-step b{display:block;color:#fff;margin:.5rem 0}.p3-incident-step span{font-size:.75rem;color:#9eb7c9}.p3-severity-board{display:grid;grid-template-columns:repeat(4,1fr);gap:.7rem;margin-top:1rem}.p3-severity-board div{border-radius:14px;padding:1rem;background:#fff;border:1px solid #dce8f0}.p3-severity-board code{font-size:.65rem;color:#587287}.p3-severity-board b{display:block;font-size:1.35rem;color:#0a2845;margin-top:.25rem}.p3-ssdlc-guide{display:grid;grid-template-columns:repeat(6,1fr);gap:.6rem;margin-top:1rem}.p3-ssdlc-guide div{padding:1rem .6rem;text-align:center;border-radius:14px;background:#08243e;color:#fff;border:1px solid rgba(32,169,229,.22)}.p3-ssdlc-guide code{font-size:.62rem;color:#55dcff}.p3-ssdlc-guide b{display:block;margin:.45rem 0;font-size:.78rem}.p3-dashboard-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:.7rem;margin-top:1rem}.p3-dashboard-kpis div{padding:1rem;border:1px solid #d9e7ef;border-radius:14px;background:#fff}.p3-dashboard-kpis span{font-size:.68rem;color:#6a8297}.p3-dashboard-kpis b{display:block;margin-top:.35rem;font-size:1.2rem;color:#0a2946}.p3-trend-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:.8rem;margin-top:.8rem}.p3-trend-card{min-height:150px;border:1px solid #d9e7ef;border-radius:14px;background:linear-gradient(180deg,#fff,#edf5f9);padding:1rem;position:relative;overflow:hidden}.p3-trend-card:after{content:"";position:absolute;left:1rem;right:1rem;bottom:2.2rem;height:58px;background:linear-gradient(135deg,transparent 0 10%,#1a89e9 11% 13%,transparent 14% 25%,#1cc7ed 26% 28%,transparent 29% 45%,#1688e7 46% 48%,transparent 49% 63%,#1ad8ee 64% 66%,transparent 67%)}
.phase03-page [hidden]{display:none!important}
@media(max-width:1100px){.p3-range-deck,.p3-sim-grid{grid-template-columns:1fr}.p3-workspace-grid{grid-template-columns:180px 1fr}.p3-workspace-side.right{grid-column:1/-1;border-left:0;border-top:1px solid rgba(49,164,222,.16);display:grid;grid-template-columns:repeat(4,1fr);gap:.6rem}.p3-pipeline{grid-template-columns:repeat(4,1fr)}.p3-evidence-chain,.p3-control-matrix{grid-template-columns:repeat(2,1fr)}.p3-resource-flow{grid-template-columns:repeat(3,1fr)}.p3-resource-studio{grid-template-columns:1fr}.p3-resource-nav{display:flex;flex-wrap:wrap;gap:.35rem}.p3-resource-nav h3{width:100%}.p3-resource-nav button{width:auto;border:1px solid #dce8f0;border-radius:999px;padding:.55rem .8rem}.p3-incident-flow,.p3-ssdlc-guide{grid-template-columns:repeat(3,1fr)}}
@media(max-width:760px){.p3-head{grid-template-columns:1fr}.p3-cap-grid{grid-template-columns:repeat(2,1fr)}.p3-radar-wrap{grid-template-columns:1fr}.p3-radar{max-width:230px;margin:auto}.p3-workspace-grid{display:block}.p3-workspace-side{border-right:0;border-bottom:1px solid rgba(49,164,222,.16)}.p3-workspace-side.right{display:block}.p3-http-grid{grid-template-columns:1fr}.p3-pipeline,.p3-evidence-chain,.p3-control-matrix,.p3-remediation,.p3-resource-flow,.p3-incident-flow,.p3-ssdlc-guide,.p3-dashboard-kpis,.p3-trend-grid{grid-template-columns:1fr 1fr}.p3-domain-row{grid-template-columns:110px 1fr 55px}.p3-heatmap{grid-template-columns:70px repeat(5,1fr);font-size:.58rem}.p3-severity-board{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.p3-cap-grid,.p3-pipeline,.p3-evidence-chain,.p3-control-matrix,.p3-remediation,.p3-resource-flow,.p3-incident-flow,.p3-ssdlc-guide,.p3-dashboard-kpis,.p3-trend-grid{grid-template-columns:1fr}.p3-domain-row{grid-template-columns:1fr}.p3-heatmap{grid-template-columns:52px repeat(5,1fr);gap:2px}.p3-heatmap div{min-height:40px;font-size:.55rem}.p3-resource-canvas{padding:.75rem}}
@media(prefers-reduced-motion:reduce){.phase03-page *{scroll-behavior:auto!important;transition-duration:.001ms!important;animation-duration:.001ms!important}}
/* Phase 03 responsive hardening */
.p3-resource-studio,.p3-resource-canvas{min-width:0;max-width:100%}
.p3-resource-canvas{overflow:auto}
.p3-check-matrix{table-layout:fixed;max-width:100%}
.p3-check-matrix th,.p3-check-matrix td{overflow-wrap:anywhere;word-break:break-word}
@media(max-width:520px){.p3-check-matrix th,.p3-check-matrix td{padding:.55rem .4rem;font-size:.67rem}.p3-check-matrix th{font-size:.58rem}}
@media(max-width:430px){
  .phase03-page .public-hero h1{font-size:clamp(2.45rem,11vw,2.65rem);overflow-wrap:anywhere;word-break:normal}
}
