/* F2 local styling; shared OS tokens and layout stay untouched. */
[hidden] { display: none !important; }
.f2-app { width: min(1120px, calc(100% - 32px)); margin: 32px auto 72px; }
.f2-app-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 24px; }
.f2-brand { display: grid; gap: 2px; color: inherit; text-decoration: none; }
.f2-app h1 { margin: 10px 0; font-size: clamp(1.6rem, 4vw, 2.5rem); }
.f2-app p { line-height: 1.6; }
.f2-login { max-width: 600px; margin: 12vh auto; padding: 24px; }
.f2-scope, .f2-origin-note { padding: 22px; margin-bottom: 18px; }
.f2-caution, .f2-danger { color: var(--danger, #ff8c8c); }
.f2-consent { display: flex; align-items: flex-start; gap: 10px; margin: 20px 0; line-height: 1.55; }
.f2-consent input { margin-top: 4px; accent-color: var(--accent, #b4f); }
.f2-status { min-height: 1.4em; }
.f2-status[data-bad="1"] { color: var(--danger, #ff8c8c); }
.f2-origin-note textarea { display: block; width: 100%; margin: 8px 0; resize: vertical; font: 400 .78rem/1.5 "Geist Mono", monospace; overflow-wrap: anywhere; }
.f2-origin-note .row { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 12px 0; }
.fs-pair-open { margin-top: 14px; }
.f2-fed { margin-top: 20px; }
.f2-agents { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 12px; }
.f2-agent { width: 100%; text-align: left; cursor: pointer; }
.f2-approval-list, .f2-panel { display: grid; gap: 14px; margin-top: 18px; }
.f2-panel { padding: 18px; border: 1px solid var(--line, rgba(255,255,255,.14)); border-radius: 12px; }
.f2-full { margin: 8px 0; border: 1px solid var(--line, rgba(255,255,255,.12)); border-radius: 8px; }
.f2-full summary { padding: 8px 10px; cursor: pointer; color: var(--ink-2, #ccc); }
.f2-code { max-height: 360px; margin: 0; overflow: auto; padding: 12px; white-space: pre-wrap; overflow-wrap: anywhere; background: rgba(0,0,0,.22); border-radius: 8px; font: 400 .86rem/1.5 "Geist Mono", monospace; }
.f2-minus { border-left: 3px solid #f17777; }
.f2-plus { border-left: 3px solid #81cf9a; }
.f2-after { border-left: 3px solid var(--accent, #c79cff); }
.f2-request-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.f2-path { overflow-wrap: anywhere; font: 500 .9rem/1.5 "Geist Mono", monospace; }
.f2-hash { font-size: .78rem; overflow-wrap: anywhere; color: var(--muted, #aaa); }
.f2-caption { color: var(--muted, #aaa); font-size: .86rem; }
.f2-list { display: grid; gap: 14px; margin-top: 16px; }
.f2-request { padding: 18px; }
.f2-request h3 { margin: 0 0 8px; }
.f2-meta { color: var(--muted, #aaa); font-size: .88rem; overflow-wrap: anywhere; }
.f2-diff { display: grid; gap: 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 14px 0; }
.f2-diff-label { font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; color: var(--muted, #aaa); }
.f2-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
.f2-invalid { border-color: var(--danger, #f66); }
.f2-warning { color: #f5c86a; }
@media (max-width: 680px) { .f2-app { width: min(calc(100% - 20px), 1120px); margin-top: 18px; } .f2-app-head { align-items: flex-start; flex-direction: column; } .f2-diff { grid-template-columns: 1fr; } .f2-scope, .f2-origin-note, .f2-request { padding: 14px; } }