:root{font:16px/1.55 system-ui,-apple-system,Segoe UI,sans-serif;color-scheme:light;--bg:#f0f6fd;--card:#fff;--text:#142a49;--muted:#52677f;--edge:#d1e1ee;--accent:#087582;--soft:#e7f6f5;--good:#067746;--bad:#a22b3d}html[data-theme=dark]{color-scheme:dark;--bg:#081426;--card:#12263e;--text:#edf5fc;--muted:#b3c8df;--edge:#3a5069;--accent:#73d4d3;--soft:#1c3850;--good:#8ce5b3;--bad:#ffacaf}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text)}button,select,input{font:inherit}button{cursor:pointer}a{color:var(--accent)}.skip{position:absolute;left:-9999px}.skip:focus{left:12px;top:12px;background:#fff;padding:8px;z-index:2}.nav{max-width:1220px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:16px 20px;gap:20px}.brand{text-decoration:none;font-weight:950;letter-spacing:.02em}.nav nav{display:flex;gap:14px;flex-wrap:wrap;align-items:center}.nav nav a{font-size:.9rem;text-decoration:none;font-weight:650}.nav button{border:1px solid var(--edge);color:var(--text);background:var(--card);border-radius:9px;padding:7px 11px}main{max-width:1220px;padding:0 20px 50px;margin:auto}.hero{background:linear-gradient(110deg,#0a3c67,#126d83 68%,#3d4d9d);color:#fff;border-radius:22px;padding:36px;display:flex;align-items:center;justify-content:space-between;gap:16px}.hero h1{font-size:clamp(1.8rem,4vw,3.1rem);line-height:1.1;margin:12px 0}.hero h1 em{color:#b7ffdf;font-style:normal}.hero p{max-width:700px}.tag{font-size:.75rem;letter-spacing:.07em;text-transform:uppercase;font-weight:900;color:var(--accent)}.hero .tag{color:#b7ffdf}.chips{display:flex;gap:8px;flex-wrap:wrap}.chips span{background:#ffffff1d;border:1px solid #ffffff45;border-radius:24px;padding:5px 12px;font-size:.78rem}.hero-symbol{font-size:clamp(38px,8vw,95px);font-weight:900;white-space:nowrap;opacity:.9}.hero-symbol span{color:#aaffd5}.cards{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(290px,1fr);gap:18px;margin:22px 0}.card{border:1px solid var(--edge);box-shadow:0 6px 20px #0001;border-radius:18px;background:var(--card);padding:23px;min-width:0}.card h2{margin:5px 0 12px;font-size:1.35rem}.card p{color:var(--muted)}.cardhead{display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap}.cardhead .field{display:grid;gap:4px;min-width:180px;font-size:.83rem;font-weight:700}.expression{font-size:clamp(1.4rem,3.5vw,2.2rem);font-weight:800;background:var(--soft);color:var(--text);border-radius:12px;padding:20px;text-align:center;white-space:normal;overflow-wrap:anywhere}.steps{display:grid;gap:7px;margin:14px 0}.step{padding:10px 14px;border-left:4px solid #13adb2;background:var(--soft);display:flex;gap:9px;align-items:center;flex-wrap:wrap;border-radius:7px}.step span{font-size:.75rem;color:var(--muted);min-width:92px}.step strong{overflow-wrap:anywhere}.step b{color:var(--good);margin-left:auto}.inputrow{display:flex;align-items:end;gap:9px;flex-wrap:wrap;margin-top:16px}.inputrow label{flex:0 0 100%;font-weight:750;font-size:.85rem}.inputrow input{flex:1 1 190px;min-width:0}.inputrow button,.controls button{background:#087b88;color:white;border:0;border-radius:10px;padding:12px 17px;font-weight:750;min-height:46px}.buttons{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}.buttons button{border:1px solid var(--edge);background:var(--soft);color:var(--text);padding:9px 12px;border-radius:10px}.feedback{background:var(--soft);border-left:4px solid var(--accent);padding:15px;border-radius:7px;min-height:54px}.feedback[data-kind=bad]{border-color:var(--bad)}.feedback[data-kind=good]{border-color:var(--good)}input,select{padding:10px 11px;border:1px solid var(--edge);border-radius:9px;background:var(--card);color:var(--text)}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #ffad4c;outline-offset:3px}.fine{color:var(--muted);font-size:.78rem;margin-top:14px}.side h3{margin:17px 0 8px}.concept{background:var(--soft);padding:10px 14px;border-radius:10px;margin:8px 0;display:grid;gap:3px}.concept small,.recommend small{display:block;color:var(--muted)}.recommend{display:grid;gap:3px;margin:7px 0;padding:10px;border:1px solid var(--edge);border-radius:9px;text-decoration:none}.link{display:inline-block;margin-top:14px;font-weight:750}.card.wide:last-child{grid-column:1/-1}.graphzone{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(230px,1fr);gap:20px;align-items:center}svg{max-width:100%;width:100%;border-radius:14px;background:var(--soft);touch-action:pan-y}svg .grid{stroke:#7a9eaf;stroke-width:.65;opacity:.45}svg .axis{stroke:var(--text);stroke-width:1.5}svg .tick{fill:var(--muted);font-size:10px}svg .label{font-weight:800;fill:var(--text);font-size:14px}.controls{display:grid;gap:14px}.controls label{display:grid;gap:4px;font-weight:700;font-size:.85rem}.controls output{color:var(--accent)}.controls input[type=range]{padding:0;accent-color:#00a6ad}.controls button{width:100%}#graphFeedback{font-size:.84rem;color:var(--muted)}.legend{display:flex;gap:15px;flex-wrap:wrap;font-size:.87rem}.point{display:inline-block;width:12px;height:12px;border-radius:50%;vertical-align:middle;margin-right:6px}.point.fixed{background:#13aeb5}.point.changed{background:#e78a45}footer{text-align:center;color:var(--muted);font-size:.78rem;padding:20px}@media(max-width:850px){.cards{grid-template-columns:1fr}.graphzone{grid-template-columns:1fr}.hero-symbol{display:none}.nav{flex-wrap:wrap}}@media(max-width:500px){.hero{padding:24px}.card{padding:16px}.nav{padding:12px}.nav nav{gap:9px;font-size:.8rem}.inputrow button{width:100%}}
@media print{.nav,.buttons,form,.controls,#mvf-root{display:none!important}.cards{display:block}.card{break-inside:avoid}body{background:white;color:black}}
