:root{
  --navy:#00205b;--ink:#07192d;--teal:#007b85;--green:#70ad47;--yellow:#ffb600;--bg:#eef3f7;--panel:#ffffff;--muted:#64748b;--line:#d9e3ea;--screen:#cfe6b8;--screen-ink:#16350d;--danger:#b53b4a;--purple:#8b5cf6;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 15% 0,#f8fbfd 0,transparent 28%),var(--bg);color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}button,input,select{font:inherit}button{cursor:pointer}a{color:inherit}.topbar{position:sticky;top:0;z-index:20;display:flex;justify-content:space-between;gap:20px;align-items:center;padding:12px clamp(14px,3vw,38px);background:rgba(5,22,39,.96);color:#fff;border-bottom:1px solid rgba(255,255,255,.12);backdrop-filter:blur(12px)}.brand{display:flex;align-items:center;gap:12px;text-decoration:none}.brand img{width:46px;height:46px;border-radius:50%;object-fit:cover}.brand span{display:flex;flex-direction:column}.brand strong{font-size:.95rem}.brand small{font-size:.72rem;color:#b8d7df}.top-actions{display:flex;gap:8px}.chip{border:1px solid rgba(255,255,255,.18);background:transparent;color:#fff;border-radius:999px;padding:9px 13px;font-size:.78rem}.chip.active{background:#fff;color:var(--navy)}.app-shell{max-width:1600px;margin:auto;padding:28px clamp(14px,3vw,38px) 40px}.intro{display:flex;justify-content:space-between;gap:28px;align-items:flex-end;margin-bottom:20px}.intro h1{font-size:clamp(2rem,4vw,4.2rem);line-height:.95;margin:.25rem 0 .7rem;letter-spacing:-.045em}.intro h1 em{font-style:normal;color:var(--teal)}.intro>div:first-child>p:last-child{max-width:780px;margin:0;color:#506276;font-size:1.02rem}.eyebrow,.kicker{font-weight:800;letter-spacing:.13em;font-size:.7rem;color:var(--teal)}.standard-note{min-width:320px;max-width:390px;background:#06172b;color:#fff;padding:16px 18px;border-radius:16px;display:grid;gap:5px;box-shadow:0 16px 40px rgba(3,20,40,.16)}.standard-note span{color:#d8eef2;font-size:.82rem}.standard-note small{color:#96afba;line-height:1.4}.mode-strip{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:16px}.mode-card{border:1px solid var(--line);background:#fff;border-radius:16px;padding:13px 16px;display:flex;align-items:center;gap:12px;text-align:left;box-shadow:0 8px 25px rgba(13,35,56,.05)}.mode-card.selected{border-color:var(--teal);box-shadow:0 0 0 2px rgba(0,123,133,.1),0 12px 28px rgba(13,35,56,.08)}.mode-icon{font-size:1.5rem}.mode-card span:last-child{display:flex;flex-direction:column}.mode-card small{color:var(--muted);margin-top:3px}.workspace{display:grid;grid-template-columns:minmax(260px,330px) minmax(360px,1fr) minmax(300px,390px);gap:16px;align-items:start}.left-panel,.right-panel{display:grid;gap:16px}.card{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:16px;box-shadow:0 10px 30px rgba(20,45,70,.06)}.card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:13px}.card-head h2{font-size:1rem;margin:.25rem 0 0}.badge{background:#e7f6f4;color:var(--teal);padding:6px 9px;border-radius:999px;font-size:.72rem;font-weight:800}.card label{display:block;font-size:.76rem;font-weight:800;margin-bottom:6px;color:#35495f}.card select{width:100%;padding:11px 12px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--ink)}.muted{color:var(--muted);font-size:.82rem;line-height:1.45}.scenario-meta{display:grid;grid-template-columns:1fr 1fr;gap:8px}.scenario-meta div{background:#f5f8fa;border-radius:10px;padding:10px}.scenario-meta span{display:block;font-size:.65rem;color:var(--muted)}.scenario-meta strong{font-size:.83rem}.sensor-diagram{height:180px;border-radius:14px;background:linear-gradient(145deg,#eef4f6,#dfe8ed);position:relative;overflow:hidden;margin-bottom:10px}.sensor-diagram .tool-shape{position:absolute;left:22%;top:47%;width:57%;height:28px;background:#2d3944;border-radius:9px;transform:rotate(-10deg);box-shadow:0 5px 13px rgba(0,0,0,.22)}.sensor-diagram .tool-shape:after{content:"";position:absolute;width:40px;height:66px;background:#3d4a55;right:13%;top:16px;border-radius:7px 7px 15px 15px}.sensor-diagram.wbv .tool-shape{left:19%;top:62%;width:62%;height:44px;border-radius:17px 17px 6px 6px;transform:none}.sensor-diagram.wbv .tool-shape:after{width:55%;height:72px;right:22%;top:-68px;border-radius:12px 12px 2px 2px}.sensor-point{position:absolute;width:22px;height:22px;border-radius:50%;border:3px solid #fff;background:#c1ccd4;box-shadow:0 0 0 2px #63788a}.sensor-point.selected{background:var(--yellow);box-shadow:0 0 0 2px #8e6700,0 0 0 8px rgba(255,182,0,.18)}.sensor-point.correct{left:44%;top:42%}.sensor-point.far{right:12%;top:30%}.sensor-point.loose{left:15%;bottom:20%}.sensor-diagram.wbv .sensor-point.correct{left:48%;top:56%}.sensor-diagram.wbv .sensor-point.far{right:12%;top:72%}.sensor-diagram.wbv .sensor-point.loose{left:17%;bottom:11%}.axis{position:absolute;right:12px;bottom:12px;width:58px;height:58px}.axis i{position:absolute;font-style:normal;font-size:.68rem;font-weight:900}.axis:before,.axis:after{content:"";position:absolute;left:27px;bottom:16px;background:#142333;transform-origin:bottom}.axis:before{width:2px;height:34px}.axis:after{height:2px;width:34px}.axis .x{right:0;bottom:10px}.axis .y{left:4px;bottom:9px}.axis .z{left:31px;top:0}.sensor-options{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.sensor-choice{border:1px solid var(--line);background:#f7f9fb;border-radius:9px;padding:8px 4px;font-size:.7rem}.sensor-choice.selected{background:#e7f6f4;border-color:#8bd1cd;color:#005e66;font-weight:800}.feedback{border-radius:10px;padding:10px 11px;margin:10px 0 0;font-size:.76rem;line-height:1.4}.feedback.ok{background:#edf7e8;color:#3e6925}.feedback.warn{background:#fff3d2;color:#7c5b00}.feedback.bad{background:#fae8e9;color:#8c2632}.guide-card{border-color:#cfe2ff;background:linear-gradient(160deg,#fff,#f4f8ff)}.guide-top{display:flex;justify-content:space-between;align-items:center;font-size:.7rem;color:var(--navy);font-weight:800}.guide-top button{border:0;background:transparent;color:var(--teal);font-weight:800}.guide-card h2{font-size:1rem;margin:10px 0 6px}.guide-card p{font-size:.78rem;color:#53677c;line-height:1.5}.guide-progress{height:5px;background:#dce7f1;border-radius:5px;overflow:hidden}.guide-progress i{display:block;height:100%;width:12.5%;background:var(--teal);transition:.25s}.instrument-zone{display:flex;justify-content:center;padding:4px 0}.instrument{width:min(100%,510px);background:linear-gradient(150deg,#1c252e,#0f171e 58%,#222d36);border-radius:30px;padding:19px;border:1px solid #3b4853;box-shadow:0 30px 70px rgba(2,18,33,.35),inset 0 1px rgba(255,255,255,.08);color:#fff;position:sticky;top:85px}.instrument-topline{display:flex;justify-content:space-between;align-items:center;font-weight:900;letter-spacing:.08em;font-size:.75rem;color:#dbe6ec;margin:3px 4px 12px}.instrument-topline small{color:#7edbd6}.display{background:var(--screen);color:var(--screen-ink);border:9px solid #070d11;border-radius:13px;padding:12px;min-height:240px;box-shadow:inset 0 0 25px rgba(29,69,20,.18);position:relative}.display.off{filter:brightness(.43) saturate(.45)}.display-status{display:flex;gap:7px;flex-wrap:wrap;font-size:.66rem;font-weight:900}.display-status span{border:1px solid rgba(20,53,13,.28);padding:2px 5px;border-radius:4px}.screen-main{display:grid;grid-template-columns:1fr 104px;gap:12px;align-items:end;margin-top:25px}.primary-reading span{display:block;font-size:.78rem;font-weight:800}.primary-reading strong{display:block;font-family:"Courier New",monospace;font-size:clamp(3rem,7vw,4.8rem);letter-spacing:-.08em;line-height:.9}.primary-reading small{font-weight:900}.axis-readings{display:grid;gap:4px}.axis-readings div{display:flex;justify-content:space-between;border-bottom:1px solid rgba(20,53,13,.25);font-family:"Courier New",monospace;font-size:.85rem}.screen-footer{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;border-top:1px solid rgba(20,53,13,.3);padding-top:9px;margin-top:20px;font-size:.6rem}.screen-footer strong{display:block;font-family:"Courier New",monospace;font-size:.82rem}.screen-alert{position:absolute;inset:auto 10px 10px;background:#6e121b;color:#fff;border-radius:6px;padding:6px 8px;text-align:center;font-weight:900;font-size:.72rem;letter-spacing:.08em}.control-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:15px}.control{min-height:68px;border-radius:12px;border:1px solid #495660;background:linear-gradient(#2c3740,#182129);color:#f7fbfd;box-shadow:inset 0 1px rgba(255,255,255,.12),0 5px 12px rgba(0,0,0,.2)}.control b{display:block;font-size:.95rem}.control span{display:block;font-size:.6rem;color:#b9cad3;margin-top:4px}.control.power{border-color:#79505a}.control.start{border-color:#3d765b}.control:active,.control.active{transform:translateY(1px);background:#0c141a}.instrument-foot{display:flex;justify-content:space-between;color:#8296a2;font-size:.58rem;margin:11px 4px 2px;text-transform:uppercase;letter-spacing:.12em}.metric-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;background:#eef3f6;border-radius:10px;padding:4px}.metric-tab{border:0;background:transparent;padding:8px 5px;border-radius:8px;font-size:.7rem;font-weight:800;color:#687a8a}.metric-tab.active{background:#fff;color:var(--navy);box-shadow:0 2px 8px rgba(18,41,64,.08)}.tab-panel{display:none;padding-top:13px}.tab-panel.active{display:block}.metric-list{margin:0;display:grid;gap:6px}.metric-list div{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #edf1f3;padding:8px 3px}.metric-list dt{font-weight:800;color:#4a5e71}.metric-list dd{margin:0;font-family:"Courier New",monospace;font-weight:900}.metric-list .accent{background:#eef9f7;border-radius:9px;padding:9px}.explain{font-size:.75rem;color:#64748b;line-height:1.5}.exposure-result{text-align:center;background:#071a2e;color:#fff;border-radius:14px;padding:14px;margin-bottom:13px}.exposure-result span{display:block;font-size:.7rem;color:#8ddbd6}.exposure-result strong{font-family:"Courier New",monospace;font-size:2.7rem}.exposure-result small{margin-left:5px}.time-row{display:grid;grid-template-columns:1fr auto;gap:9px;align-items:center}.time-row input{width:100%}.time-row output{font-weight:900;color:var(--teal);font-size:.8rem}.formula{font-family:"Courier New",monospace;background:#f4f7f9;border-radius:10px;padding:10px;margin-top:10px;font-size:.75rem;overflow:auto}.secondary{width:100%;margin-top:10px;border:1px solid #bed3df;background:#fff;color:var(--navy);border-radius:10px;padding:10px;font-weight:800}.operations-list{display:grid;gap:6px;margin-top:9px}.operation-item{display:grid;grid-template-columns:1fr auto;gap:8px;background:#f5f8fa;border-radius:9px;padding:8px;font-size:.68rem}.operation-item button{border:0;background:transparent;color:var(--danger)}.combined{display:flex;justify-content:space-between;background:#e9f6f4;padding:10px;border-radius:9px;margin-top:8px;font-size:.76rem}.interpretation{border-left:4px solid var(--yellow);padding:2px 0 2px 11px}.interpretation h3{margin:0 0 5px;font-size:.9rem}.interpretation p{margin:0;color:#617487;font-size:.75rem;line-height:1.5}.fact-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:12px}.fact-grid button{border:1px solid var(--line);background:#fff;border-radius:9px;padding:8px 5px}.fact-grid span{display:block;font-size:.58rem;color:var(--muted)}.fact-grid strong{font-size:.7rem}.legal-note{font-size:.68rem;color:#768898;background:#f7f9fb;padding:9px;border-radius:9px}.text-btn{border:0;background:transparent;color:var(--teal);font-size:.7rem;font-weight:800}.memory-list{display:grid;gap:7px}.memory-item{display:flex;justify-content:space-between;gap:8px;background:#f6f8fa;border-radius:9px;padding:9px;font-size:.7rem}.memory-item strong{display:block}.memory-item span{color:var(--muted)}.help-dialog{border:0;padding:0;border-radius:20px;max-width:760px;width:calc(100% - 24px);box-shadow:0 30px 80px rgba(0,0,0,.35)}.help-dialog::backdrop{background:rgba(3,13,24,.72)}.dialog-card{padding:25px;position:relative}.dialog-card h2{margin:.35rem 0 1rem}.dialog-close{position:absolute;right:14px;top:12px;border:0;background:#eef2f5;border-radius:50%;width:34px;height:34px;font-size:1.3rem}.help-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.help-grid div{border:1px solid var(--line);border-radius:12px;padding:12px}.help-grid p{font-size:.78rem;color:#627487;line-height:1.5;margin:.3rem 0 0}footer{max-width:1600px;margin:auto;padding:18px clamp(14px,3vw,38px) 30px;color:#6f8393;font-size:.7rem;display:flex;gap:18px;flex-wrap:wrap;border-top:1px solid #d8e1e7}footer a{color:var(--teal);text-decoration:none}
.highlight{animation:pulseHighlight 1.2s ease}@keyframes pulseHighlight{0%,100%{box-shadow:0 0 0 0 rgba(255,182,0,0)}45%{box-shadow:0 0 0 8px rgba(255,182,0,.28)}}
@media(max-width:1180px){.workspace{grid-template-columns:minmax(250px,320px) 1fr}.right-panel{grid-column:1/-1;grid-template-columns:1fr 1fr}.instrument{position:sticky}.intro{align-items:flex-start}.standard-note{min-width:280px}}
@media(max-width:800px){.topbar{position:static;align-items:flex-start}.brand span small{display:none}.top-actions{flex-direction:column}.app-shell{padding-top:18px}.intro{display:block}.standard-note{margin-top:15px;max-width:none;min-width:0}.mode-strip{grid-template-columns:1fr}.workspace{display:flex;flex-direction:column}.left-panel,.right-panel,.instrument-zone{width:100%}.instrument{position:static;width:100%;max-width:520px}.right-panel{display:grid;grid-template-columns:1fr}.guide-card{order:-1}.help-grid{grid-template-columns:1fr}.screen-main{grid-template-columns:1fr 92px}.control-grid{grid-template-columns:repeat(4,1fr)}}
@media(max-width:480px){.topbar{padding:10px}.brand img{width:38px;height:38px}.brand strong{font-size:.78rem}.chip{padding:7px 9px;font-size:.68rem}.intro h1{font-size:2.5rem}.instrument{border-radius:22px;padding:12px}.display{min-height:220px;border-width:7px}.primary-reading strong{font-size:3.35rem}.control{min-height:60px}.screen-footer{font-size:.54rem}.sensor-diagram{height:160px}.scenario-meta{grid-template-columns:1fr}.fact-grid{grid-template-columns:1fr 1fr 1fr}}
