:root{font-family:system-ui,-apple-system,"Hiragino Kaku Gothic ProN","Noto Sans JP",sans-serif;color:#203148;background:#f5f7fa;font-size:16px;--blue:#245edb;--orange:#c05b12}*{box-sizing:border-box}body{margin:0}header{background:#152c47;color:white;padding:26px max(20px,calc((100vw - 1180px)/2)) 0}header small{color:#b9cce3;letter-spacing:.12em}h1{font-size:clamp(24px,4vw,35px);margin:8px 0 12px}header p{color:#d3deec;margin:0 0 22px;font-size:14px}nav{display:flex;gap:5px;overflow-x:auto}nav a{color:#d3deec;text-decoration:none;padding:13px 17px;white-space:nowrap;border-radius:8px 8px 0 0;font-size:14px}nav a[aria-current]{background:#f5f7fa;color:#173b76;font-weight:700}main{max-width:1220px;margin:auto;padding:26px 20px 40px}.intro{margin:0 0 20px;line-height:1.8}.layout{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(300px,1fr);gap:22px}.panel{background:white;border:1px solid #dce3ec;border-radius:12px;padding:20px;min-width:0}h2{font-size:18px;margin:0 0 16px}h3{font-size:16px;margin:22px 0 10px}.plot{width:100%;display:block;aspect-ratio:1/1;background:#fcfdff;border-radius:6px;touch-action:pan-y}.legend{display:flex;gap:16px;flex-wrap:wrap;font-size:13px;color:#536478;margin-top:10px}.legend span:before{content:'';display:inline-block;width:18px;height:3px;background:var(--c);vertical-align:middle;margin-right:6px}.control{margin:16px 0}.control label{display:flex;justify-content:space-between;align-items:center;gap:10px;font-weight:600;font-size:14px}.control input[type=number]{width:86px;padding:8px;border:1px solid #bac7d8;border-radius:6px;font:inherit}.control input[type=range]{width:100%;min-height:36px;accent-color:var(--blue);margin:4px 0 0}.buttons{display:flex;gap:8px;flex-wrap:wrap;margin:13px 0}button,.next{font:inherit;font-size:14px;min-height:42px;border:1px solid #bbc9db;border-radius:7px;background:white;color:#24405f;padding:8px 13px;cursor:pointer}button:hover{background:#edf3ff}button.primary,.next{background:var(--blue);border-color:var(--blue);color:white}button:disabled{opacity:.45;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #e7a82e;outline-offset:3px}.equation{display:flex;align-items:center;gap:9px;overflow-x:auto;padding:14px 2px;font-family:Georgia,"Times New Roman",serif;font-size:18px;white-space:nowrap}.matrix{display:inline-grid;grid-template-columns:repeat(3,minmax(38px,auto));gap:9px 10px;border-left:2px solid #344963;border-right:2px solid #344963;padding:9px 8px;text-align:center;font-variant-numeric:tabular-nums}.matrix.vector{grid-template-columns:1fr;min-width:45px}.matrix .variable{color:var(--blue);font-weight:700}.mathlabel{text-align:center;font-size:12px;font-family:system-ui;color:#66778b;margin:5px 0}.formula{line-height:1.9;padding:12px 14px;background:#f0f5fc;border-radius:6px;font-size:14px;overflow-wrap:anywhere}.calc{font-size:14px;line-height:1.9;font-variant-numeric:tabular-nums}.hint{font-size:13px;color:#607086;line-height:1.8}.question{border-left:3px solid #d59b35;padding:9px 14px;background:#fff9ec;line-height:1.8;font-size:14px;margin-top:18px}select{font:inherit;padding:8px;border:1px solid #bdc9d8;border-radius:6px;background:white}.comparison{display:grid;grid-template-columns:1fr 1fr;gap:18px}.comparison .panel{padding:16px}.comparison .equation{font-size:16px;gap:6px}.comparison .matrix{gap:7px;grid-template-columns:repeat(3,minmax(28px,auto));padding:7px 5px}.comparison .matrix.vector{grid-template-columns:1fr}.status{font-weight:650;color:#2455a2;min-height:26px;margin:10px 0}.compare-controls{margin-bottom:20px}.control-row{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}footer{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-top:24px;font-size:13px;color:#63758b}.next{text-decoration:none}details{margin-top:12px;font-size:14px;line-height:1.8}summary{cursor:pointer;color:#2455a2;min-height:34px}.coords{font-size:14px;margin:10px 0;line-height:1.8} @media(max-width:760px){header{padding:20px 15px 0}header p{font-size:13px}nav a{padding:12px 11px;font-size:13px}main{padding:18px 12px 30px}.layout,.comparison{grid-template-columns:1fr}.panel{padding:16px}.control-row{grid-template-columns:1fr;gap:0}.plot{max-height:440px}.equation{font-size:17px}footer{align-items:flex-start}.comparison .equation{font-size:17px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}

.selected-coordinate,.coords{color:#d12b32;font-weight:650}
.multiply-matrices{display:flex;align-items:center;justify-content:center;gap:18px;padding:12px 0;flex-wrap:wrap}.lesson-matrix{grid-template-columns:repeat(3,54px);font-family:Georgia,serif;font-size:25px;gap:7px}.lesson-matrix span,.lesson-matrix button{padding:8px 3px;min-height:46px;border-radius:4px}.lesson-matrix button{font:inherit;border:1px solid #dce3ec;background:#f6f8fc;color:#536478}.lesson-matrix .chosen{background:#fff0f0;color:#c52730;font-weight:bold}.lesson-matrix .pair{background:#245edb;color:white;outline:2px solid #9db9ef}.operator{font-size:28px;padding-top:22px}.procedure{margin:20px 0}.work{max-width:700px}.product-line{display:flex;align-items:center;gap:20px;border-bottom:1px solid #e2e7f0;padding:15px 12px;font-variant-numeric:tabular-nums}.product-line>span{color:#62748b;font-size:14px;white-space:nowrap}.product-line strong{font-size:18px;font-weight:500}.product-line.current{background:#edf4ff;border-radius:6px}.sum-line{padding:22px 12px;font-size:19px;color:#2455a2;line-height:1.8}.editor-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;max-width:600px}.edit-matrix{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.edit-matrix input{min-width:0;width:100%;font:inherit;padding:8px;border:1px solid #bdc9d8;border-radius:5px}@media(max-width:760px){.multiply-matrices{gap:7px;justify-content:flex-start}.lesson-matrix{grid-template-columns:repeat(3,25px);gap:3px;padding:5px;font-size:18px}.lesson-matrix span,.lesson-matrix button{min-height:38px;padding:7px 0}.operator{font-size:20px}.product-line{gap:12px}.product-line strong{font-size:16px}.editor-grid{grid-template-columns:1fr}.mathlabel{font-size:11px}}
.lesson-matrix.vector{grid-template-columns:54px}.buttons input[type=number]{width:75px;font:inherit;padding:8px;border:1px solid #bdc9d8;border-radius:5px}@media(max-width:760px){.lesson-matrix.vector{grid-template-columns:25px}}
.operations{display:flex;align-items:center;gap:12px;overflow-x:auto;padding:16px 2px}.operation{border:2px solid transparent;border-radius:8px;padding:10px;flex-shrink:0;text-align:center}.operation .mathlabel{margin-bottom:10px}.operation .equation{justify-content:center}.active-operation{border-color:#245edb;background:#f0f5ff}.operations .operator{padding:0}

nav{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px;overflow:visible;padding-bottom:8px}nav a{white-space:normal;display:flex;align-items:center;justify-content:center;text-align:center;border-radius:7px;font-size:13px;padding:10px 6px;line-height:1.5;min-width:0}nav a[aria-current]{background:#f5f7fa}.matrix-important{color:#c52730;font-weight:700;background:#fff0df;border-radius:4px;outline:2px solid #efd0a6;padding:3px}.operation .matrix{gap:12px 10px}@media(max-width:760px){nav{gap:3px}nav a{font-size:10px;padding:8px 2px;overflow-wrap:anywhere;min-height:60px}}

.rotation-equation{display:flex;flex-direction:column;align-items:stretch;gap:18px;white-space:normal;overflow:visible}.rotation-stage{min-width:0}.rotation-stage .mathlabel{text-align:left;font-size:13px;margin:0 0 12px}.trig-matrix,.rotation-numeric,.rotation-point{display:flex;justify-content:center;align-items:center;gap:18px}.trig-matrix .matrix{grid-template-columns:repeat(3,max-content);column-gap:16px;font-size:16px;white-space:nowrap}.rotation-numeric .matrix{grid-template-columns:repeat(3,minmax(44px,max-content));font-size:18px}.rotation-point .matrix{font-size:18px}@media(max-width:380px){.trig-matrix .matrix{font-size:14px;column-gap:9px;padding:9px 5px}}
