:root{font-family:Inter,"Segoe UI","Malgun Gothic",sans-serif;color:#373246;background:#f5f4f9;font-synthesis:none;--accent:#7157a0;--line:#dfdbe9}*{box-sizing:border-box}body{margin:0}header,main,footer{width:min(1160px,calc(100% - 48px));margin:auto}header{height:84px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);gap:20px}.brand{color:#75628d;font-weight:800;font-size:21px;text-decoration:none;white-space:nowrap}.brand span{font-size:10px;letter-spacing:1.5px;vertical-align:middle;margin-left:10px}nav{display:flex;justify-content:flex-end;gap:12px;flex-wrap:wrap;font-size:11px}nav a{color:#81768f;text-decoration:none}nav a[aria-current]{color:#644691;font-weight:700;text-decoration:underline}.intro{padding:36px 0 26px}.eyebrow{font-size:11px;letter-spacing:2px;color:#9381ad;font-weight:700}h1{font-size:clamp(30px,4.2vw,47px);line-height:1.23;letter-spacing:-1.5px;margin:18px 0}h1 span{color:#9a87b9}.intro>p:last-child{max-width:800px;color:#83798e;font-size:14px;line-height:1.9}.workspace{display:grid;grid-template-columns:.9fr 1.2fr;gap:22px}.panel{background:#fff;border:1px solid var(--line);border-radius:14px;padding:25px;min-width:0}h2{font-size:15px;margin:0 0 23px}h2 b{font-size:10px;font-weight:500;color:#a093b4;margin-right:10px}label{display:block;font-size:12px;font-weight:600;margin:18px 0 9px}textarea,input,select{font:inherit;color:inherit;font-size:14px;border:1px solid #d4cce0;border-radius:7px;padding:12px;width:100%;background:#fff}textarea{font-family:Consolas,monospace;line-height:1.8;resize:vertical;background:#faf9fc}.muted{font-size:11px;line-height:1.85;color:#93899f}button{font:inherit;font-size:12px;font-weight:600;background:var(--accent);color:#fff;border:1px solid var(--accent);border-radius:7px;padding:11px 15px;cursor:pointer}button.secondary{background:#fff;color:var(--accent)}button:disabled{opacity:.4;cursor:not-allowed}.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:19px}.examples{display:flex;gap:13px;flex-wrap:wrap;margin-top:22px}.examples button{background:none;color:#9483ac;border:0;padding:0;font-size:10px;text-decoration:underline}input:focus,textarea:focus,select:focus,button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #d2c1ea;outline-offset:2px}#status{font-size:12px;line-height:1.8;color:#78628e;min-height:24px}.error{color:#ad493e!important}.stats{display:grid;grid-template-columns:1.2fr 1fr 1fr;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:#f8f6fc}.stats>div{padding:19px 15px;min-width:0;border-right:1px solid var(--line);display:flex;flex-direction:column;gap:10px}.stats>div:last-child{border:0}.stats span{font-size:10px;color:#94889f;line-height:1.6}.stats strong{font-size:27px;letter-spacing:-.7px;color:#76559f;overflow-wrap:anywhere}.result-section h3{font-size:12px;color:#8a779d;margin:26px 0 12px}.matrix-scroll{overflow:auto;padding:4px 0}.matrix-table{font-family:Consolas,monospace;font-size:13px;border-collapse:collapse;border-left:2px solid #a293b5;border-right:2px solid #a293b5;min-width:120px}.matrix-table td{padding:8px 12px;white-space:nowrap;text-align:right;min-width:50px}.matrix-table td.divider{border-left:1px dashed #cfc3dd}.message{font-size:12px;line-height:1.85;color:#8d819b}.vector{font-family:Consolas,monospace;font-size:12px;color:#766089;line-height:1.8;overflow-wrap:anywhere}.steps-panel{margin-top:22px}.step{margin-top:16px;border:1px solid #e6e0ee;border-radius:8px;padding:14px}.step summary{font:12px/1.8 Consolas,monospace;color:#8c77a4;cursor:pointer}.step:first-child{background:#faf8fd}details.notes{border-top:1px solid var(--line);padding-top:22px;margin-top:28px;color:#8b8198;font-size:12px;line-height:1.9}.notes summary{cursor:pointer;color:#776587}.notes a{color:#76569a}footer{display:flex;justify-content:space-between;padding:27px 0 33px;color:#9b92a6;font-size:11px}footer a{color:#939099;text-decoration:none}@media(max-width:760px){header,main,footer{width:calc(100% - 28px)}.workspace{grid-template-columns:1fr}.panel{padding:19px}.intro{padding-top:26px}.stats strong{font-size:24px}}@media(max-width:480px){header{height:80px}.brand{font-size:18px}.brand span{display:none}nav{max-width:220px;font-size:10px;gap:6px 10px}.stats>div{padding:15px 10px}.stats strong{font-size:22px}.matrix-table td{padding:7px 9px}.actions{gap:8px}.actions button{font-size:11px;padding:11px}footer{gap:16px}}