.page{color:#0f172a;background:#f7f7fb;justify-content:center;align-items:stretch;width:100%;min-height:100vh;padding:28px 16px;display:flex}.container{width:100%;max-width:960px}.card{background:#fff;border:1px solid #e6e7ef;border-radius:18px;width:100%;padding:18px;box-shadow:0 10px 30px #0f172a14}.header{text-align:center;margin-bottom:14px}.title{letter-spacing:-.02em;margin:0 0 8px;font-size:clamp(22px,3.2vw,36px)}.intro{color:#475569;margin:0;font-size:14px;line-height:1.55}.introLink{color:#1d4ed8;text-underline-offset:2px;font-weight:800;text-decoration:underline}.mainGrid{grid-template-columns:1.1fr 1fr;align-items:start;gap:14px;margin-top:16px;display:grid}.compassWrap{justify-items:center;gap:10px;display:grid}.compass{justify-content:center;width:100%;display:flex}.dial{aspect-ratio:1;background:radial-gradient(circle,#fff 0%,#f5f7ff 70%,#eef2ff 100%);border:1px solid #e6e7ef;border-radius:999px;width:min(420px,100%);position:relative;overflow:hidden;box-shadow:inset 0 0 0 10px #0f172a08}.ticks{opacity:.35;background:repeating-conic-gradient(#0f172a1f 0deg 1deg,#0000 1deg 9deg);position:absolute;inset:0;-webkit-mask:radial-gradient(circle,#0000 0 64%,#000 65% 100%);mask:radial-gradient(circle,#0000 0 64%,#000 65% 100%)}.marker{color:#0f172a;opacity:.85;letter-spacing:.06em;font-size:14px;font-weight:900;position:absolute}.markerN{top:10px;left:50%;transform:translate(-50%)}.markerS{bottom:10px;left:50%;transform:translate(-50%)}.markerE{top:50%;right:12px;transform:translateY(-50%)}.markerW{top:50%;left:12px;transform:translateY(-50%)}.arrow{transform-origin:50%;place-items:center;transition:transform .12s linear;display:grid;position:absolute;inset:0}.arrowHead{filter:drop-shadow(0 6px 12px #0f172a2e);border-bottom:24px solid #0f172a;border-left:14px solid #0000;border-right:14px solid #0000;width:0;height:0;position:absolute;top:22px}.arrowStem{background:#0f172a;border-radius:999px;width:10px;height:calc(50% - 64px);position:absolute;top:44px;box-shadow:0 8px 18px #0f172a1f}.centerDot{background:#fff;border:4px solid #0f172a;border-radius:999px;width:14px;height:14px;margin:auto;position:absolute;inset:0}.guidance{text-align:center;color:#334155;background:#fbfcff;border:1px solid #e6e7ef;border-radius:14px;width:100%;max-width:420px;padding:10px 12px;font-weight:700}.panel{gap:12px;display:grid}.buttons{grid-template-columns:1fr;gap:10px;display:grid}.btn{color:#0f172a;cursor:pointer;background:#fff;border:1px solid #e6e7ef;border-radius:14px;padding:12px 14px;font-weight:800;box-shadow:0 8px 18px #0f172a0f}.btn:hover{box-shadow:0 10px 22px #0f172a14}.btn:disabled{opacity:.65;cursor:not-allowed}.btn.primary{color:#fff;background:#0f172a;border-color:#0f172a}.errorBox{color:#b91c1c;background:#b91c1c0f;border:1px solid #b91c1c40;border-radius:14px;padding:10px 12px;font-weight:800}.simBox{background:#fbfcff;border:1px solid #e6e7ef;border-radius:14px;gap:8px;padding:12px;display:grid}.simHeader{justify-content:space-between;align-items:baseline;gap:10px;display:flex}.simTitle,.simValue{color:#0f172a;font-weight:900}.slider{width:100%}.simHint{color:#475569;font-size:13px}.readouts{grid-template-columns:1fr 1fr;gap:10px;display:grid}.readout{background:#fff;border:1px solid #e6e7ef;border-radius:14px;padding:10px 12px;box-shadow:0 8px 18px #0f172a0f}.readout .k{color:#64748b;margin-bottom:6px;font-size:12px;font-weight:800}.readout .v{color:#0f172a;font-size:14px;font-weight:900}.note{color:#475569;border-top:1px solid #eef0f7;padding-top:10px;font-size:13px;line-height:1.55}.footer{text-align:center;color:#64748b;margin-top:12px;font-size:12px}@media (width<=900px){.mainGrid,.readouts{grid-template-columns:1fr}}:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*,:before,:after{box-sizing:border-box}html,body,#root{height:100%}html{width:100%}body{font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,Apple Color Emoji,Segoe UI Emoji;color:#0f172a!important;place-items:initial!important;background:#f7f7fb!important;width:100%!important;min-height:100vh!important;margin:0!important;display:block!important}#root{width:100%!important;max-width:none!important;min-height:100vh!important;margin:0!important;padding:0!important}button,input,select,textarea{font:inherit}img,svg,video,canvas{max-width:100%;height:auto}a{color:inherit}