.nav-reciprocal { --nr-accent:#d92b49; --nr-ink:#343944; --nr-muted:#606975; --nr-border:#d9dfe7; color:var(--nr-ink); width:100%; min-width:0; max-width:1120px; margin:24px auto; font-size:15px; line-height:1.7; overflow-wrap:anywhere; }
.nav-reciprocal *, .nav-reciprocal *::before, .nav-reciprocal *::after { box-sizing:border-box; }
.nav-reciprocal [hidden] { display:none !important; }
.nav-reciprocal .nav-reciprocal__intro { margin-bottom:24px; }
.nav-reciprocal .nav-reciprocal__eyebrow { color:var(--nr-accent); font-size:13px; font-weight:700; margin:0 0 6px; }
.nav-reciprocal h2 { font-size:28px; margin:0 0 10px; }
.nav-reciprocal h3 { font-size:19px; margin:0 0 10px; }
.nav-reciprocal p { margin:0 0 12px; }
.nav-reciprocal .nav-reciprocal__intro > p:last-child { color:var(--nr-muted); max-width:720px; }
.nav-reciprocal .nav-reciprocal__layout { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); align-items:start; gap:24px; }
.nav-reciprocal .nav-reciprocal__guide, .nav-reciprocal .nav-reciprocal__form { min-width:0; padding:26px; border:1px solid var(--nr-border); border-radius:16px; background:#fff; }
.nav-reciprocal .nav-reciprocal__guide { background:#fafbfe; }
.nav-reciprocal .nav-reciprocal__identity { margin:18px 0; }
.nav-reciprocal .nav-reciprocal__identity > div { display:grid; grid-template-columns:76px minmax(0,1fr); gap:8px; padding:6px 0; }
.nav-reciprocal dt { color:var(--nr-muted); font-weight:400; }
.nav-reciprocal dd { margin:0; min-width:0; }
.nav-reciprocal a { color:#b82541; text-decoration:underline; text-underline-offset:3px; }
.nav-reciprocal .nav-reciprocal__label { display:block; font-weight:600; margin:0 0 8px; }
.nav-reciprocal .nav-reciprocal__code { font:13px/1.65 ui-monospace,SFMono-Regular,Consolas,monospace; background:#f0f3f8; color:#384256; overflow-wrap:anywhere; white-space:pre-wrap; min-height:94px; margin-bottom:10px; }
.nav-reciprocal .nav-reciprocal__rules { margin:20px 0; padding-left:22px; }
.nav-reciprocal .nav-reciprocal__rules li { margin:0 0 10px; }
.nav-reciprocal .nav-reciprocal__policy { border-top:1px solid var(--nr-border); padding-top:18px; color:var(--nr-muted); font-size:13px; }
.nav-reciprocal .nav-reciprocal__policy strong { display:block; color:var(--nr-ink); margin-bottom:8px; }
.nav-reciprocal .nav-reciprocal__fields { border:0; margin:0; padding:0; min-width:0; }
.nav-reciprocal .nav-reciprocal__fields legend { display:block; float:none; width:100%; padding:0; margin:0 0 10px; font-size:19px; font-weight:700; color:var(--nr-ink); }
.nav-reciprocal .nav-reciprocal__field { min-width:0; margin:0 0 18px; }
.nav-reciprocal .nav-reciprocal__field > label { display:block; font-weight:600; margin-bottom:7px; }
.nav-reciprocal .nav-reciprocal__field > label > span { color:var(--nr-muted); font-size:12px; font-weight:400; margin-left:5px; }
.nav-reciprocal input:not([type=checkbox]):not([type=hidden]), .nav-reciprocal select, .nav-reciprocal textarea { display:block; width:100%; min-width:0; max-width:100%; min-height:46px; border:1px solid #bdc7d4; border-radius:9px; padding:10px 12px; color:var(--nr-ink); background-color:#fff; font:inherit; line-height:1.5; box-shadow:none; }
.nav-reciprocal input::placeholder, .nav-reciprocal textarea::placeholder { color:#707985; opacity:1; }
.nav-reciprocal textarea { resize:vertical; }
.nav-reciprocal .nav-reciprocal__code { background:#f0f3f8; font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:13px; }
.nav-reciprocal .nav-reciprocal__hint { color:var(--nr-muted); font-size:13px; margin:8px 0 0; }
.nav-reciprocal .nav-reciprocal__fields > .nav-reciprocal__hint { margin:0 0 20px; }
.nav-reciprocal .nav-reciprocal__hint--error { color:#a32736; }
.nav-reciprocal .nav-reciprocal__agreement { display:flex; align-items:flex-start; gap:12px; min-height:44px; margin:8px 0 20px; padding:12px; border:1px solid var(--nr-border); border-radius:10px; background:#fafbfe; font-size:13px; cursor:pointer; }
.nav-reciprocal .nav-reciprocal__agreement input { flex:0 0 20px; width:20px; height:20px; margin:2px 0 0; accent-color:var(--nr-accent); }
.nav-reciprocal .nav-reciprocal__agreement span { min-width:0; }
.nav-reciprocal .nav-reciprocal__button { display:inline-flex; justify-content:center; align-items:center; min-height:46px; max-width:100%; padding:11px 20px; border:1px solid var(--nr-accent); border-radius:9px; background:var(--nr-accent); color:#fff; font:inherit; font-weight:600; line-height:1.4; text-align:center; cursor:pointer; touch-action:manipulation; }
.nav-reciprocal .nav-reciprocal__button--secondary { border-color:#b7c1cf; background:#fff; color:var(--nr-ink); }
.nav-reciprocal .nav-reciprocal__button:hover:not(:disabled) { filter:brightness(.94); }
.nav-reciprocal .nav-reciprocal__button:disabled { background:#e7ebf0; color:#606975; border-color:#d4dbe4; cursor:not-allowed; }
.nav-reciprocal .nav-reciprocal__submit { width:100%; }
.nav-reciprocal :focus-visible { outline:3px solid #ac2544; outline-offset:3px; }
.nav-reciprocal .nav-reciprocal__runtime { margin:14px 0 0; color:var(--nr-muted); font-size:13px; }
.nav-reciprocal .nav-reciprocal__status { padding:14px 16px; margin-top:16px; border:1px solid #cad5e6; border-radius:10px; background:#f1f6ff; color:#34486a; overflow-wrap:anywhere; }
.nav-reciprocal .nav-reciprocal__status[data-state=error] { background:#fff4f3; border-color:#eab4b2; color:#982a32; }
.nav-reciprocal .nav-reciprocal__status[data-state=success] { background:#eff9f3; border-color:#afd7be; color:#245e3c; }
.nav-reciprocal .nav-reciprocal__trap { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); clip-path:inset(50%); white-space:nowrap; pointer-events:none; }
.nav-reciprocal.nav-reciprocal--submitted .nav-reciprocal__submit { color:#245e3c; background:#e8f4ec; border-color:#afd7be; }
@media (max-width:800px) {
    .nav-reciprocal .nav-reciprocal__layout { grid-template-columns:minmax(0,1fr); gap:18px; }
    .nav-reciprocal .nav-reciprocal__guide, .nav-reciprocal .nav-reciprocal__form { padding:20px; }
}
@media (max-width:480px) {
    .nav-reciprocal { margin:18px auto; font-size:15px; }
    .nav-reciprocal h2 { font-size:24px; }
    .nav-reciprocal .nav-reciprocal__guide, .nav-reciprocal .nav-reciprocal__form { padding:16px; border-radius:12px; }
    .nav-reciprocal input:not([type=checkbox]):not([type=hidden]), .nav-reciprocal select, .nav-reciprocal textarea { font-size:16px; }
    .nav-reciprocal .nav-reciprocal__code { font-size:13px; }
    .nav-reciprocal .nav-reciprocal__identity > div { grid-template-columns:minmax(0,1fr); gap:0; }
    .nav-reciprocal .nav-reciprocal__button--secondary { width:100%; }
}
