/* Open Interest — site v0 */
* { box-sizing: border-box }
body { margin: 0; background: #f2efe8; color: #0d0d0f; font: 15px/1.5 Inter, system-ui, sans-serif }
a { color: #6b1f2a } a:hover { color: #5a1923 }
.mono { font-family: "Geist Mono", ui-monospace, monospace }
.anton { font-family: Anton, sans-serif; font-weight: 400 }
.wrap { max-width: 1180px; margin: 0 auto; padding: 0 20px }
.topbar { background: #0d0d0f; color: #f2efe8; padding: 8px 16px; font-family: "Geist Mono", monospace; font-size: 10px; letter-spacing: .18em; text-transform: uppercase; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 8px 20px }
.chip { border: 1px solid rgba(242,239,232,.35); border-radius: 3px; padding: 4px 10px }
.flick { display: inline-block; width: 6px; height: 6px; border-radius: 1px; background: #f0e3e3 }
.f1 { animation: fx 2.3s steps(2,start) infinite } .f2 { animation: fx 3.1s steps(2,start) infinite .4s } .f3 { animation: fx 1.7s steps(2,start) infinite .9s }
@keyframes fx { to { opacity: .25 } }
.mast { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 8px 24px; padding: 24px 0 13px }
.mast h1 { margin: 0; font-family: Anton, sans-serif; font-weight: 400; font-size: clamp(30px, 5vw, 44px); line-height: 1; letter-spacing: .005em }
.mast .meta { font-family: "Geist Mono", monospace; font-size: 11px; letter-spacing: .14em; color: #4a4a52; text-transform: uppercase }
.dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: #6b1f2a; margin-right: 6px; animation: pulse 2.2s ease-in-out infinite }
@keyframes pulse { 0%,100% { opacity: 1 } 50% { opacity: .25 } }
.blink { animation: blink 1.1s steps(2,start) infinite }
@keyframes blink { to { visibility: hidden } }
.rule2 { height: 2px; background: #0d0d0f }
nav.oi { display: flex; flex-wrap: wrap; gap: 6px 22px; padding: 10px 0; border-bottom: 1px solid #0d0d0f; font-family: "Geist Mono", monospace; font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase }
nav.oi a { text-decoration: none; color: #0d0d0f } nav.oi a:hover { color: #6b1f2a }
nav.oi .on { color: #6b1f2a; font-weight: 500 } nav.oi .er { margin-left: auto; color: #6b1f2a }
.strap { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 24px; padding: 10px 0; border-bottom: 1px solid #d8d5c8; font-size: 14px }
.strap em { color: #4a4a52 }
.strap .mono { font-size: 10px; letter-spacing: .1em; color: #828287; text-transform: uppercase }
.ticker { overflow: hidden; background: #0d0d0f; color: #c9c7bf; border-radius: 2px; margin-top: 12px }
.ticker-in { display: inline-flex; white-space: nowrap; animation: tick 48s linear infinite; font-family: "Geist Mono", monospace; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; padding: 7px 0 }
.ticker-in:hover { animation-play-state: paused }
.ticker-in span { padding: 0 26px }
@keyframes tick { to { transform: translateX(-50%) } }
@media (prefers-reduced-motion: reduce) { .ticker-in,.dot,.blink,.flick { animation: none } }
.lead { background: #6b1f2a; color: #f2efe8; border-radius: 2px; padding: clamp(24px,4vw,44px); margin-top: 28px }
.lead .tag { font-family: "Geist Mono", monospace; font-size: 11px; letter-spacing: .22em; text-transform: uppercase; opacity: .85; margin-bottom: 16px }
.lead h2 { margin: 0 0 14px; font-family: Anton, sans-serif; font-weight: 400; font-size: clamp(38px,7vw,70px); line-height: .9; text-transform: uppercase; max-width: 860px }
.lead p { margin: 0; font-size: 17px; max-width: 580px; opacity: .92 }
.lead .rail { margin-top: 24px; padding-top: 13px; border-top: 1px solid rgba(242,239,232,.3); font-family: "Geist Mono", monospace; font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase; opacity: .9; display: flex; flex-wrap: wrap; gap: 6px 22px }
.lead .rail a { color: #f2efe8 }
.cols { display: flex; flex-wrap: wrap; gap: 36px; margin-top: 36px }
.main-col { flex: 999 1 560px; min-width: 0 }
aside.rail-col { flex: 1 1 300px; min-width: 0; display: flex; flex-direction: column; gap: 16px }
.card { background: #fbfaf5; border: 1px solid #d8d5c8; border-radius: 2px; padding: 18px 20px }
.card.burg { background: #f0e3e3; border-color: #6b1f2a }
.card h3 { margin: 0 0 9px; font-family: Anton, sans-serif; font-weight: 400; font-size: 16px; letter-spacing: .04em; text-transform: uppercase }
.card p { margin: 0 0 10px; font-size: 13px; color: #4a4a52 }
.btn { display: inline-block; background: #6b1f2a; color: #f2efe8; text-decoration: none; font-size: 13px; font-weight: 600; padding: 10px 18px; border-radius: 2px; border: none; cursor: pointer }
.btn.ink { background: #0d0d0f }
.sect { font-family: Anton, sans-serif; font-size: 19px; letter-spacing: .04em; text-transform: uppercase; margin: 0 0 4px }
.item { padding: 17px 0 15px; border-bottom: 1px solid #e5e2d4 }
.item .tag { font-family: "Geist Mono", monospace; font-size: 10px; letter-spacing: .16em; color: #6b1f2a; text-transform: uppercase; margin-bottom: 6px }
.item h4 { margin: 0 0 6px; font-size: 19px; letter-spacing: -.015em; line-height: 1.25 }
.item p { margin: 0 0 9px; font-size: 14px; color: #4a4a52 }
.item .prov { font-family: "Geist Mono", monospace; font-size: 9.5px; letter-spacing: .08em; color: #828287; text-transform: uppercase }
.foot { background: #0d0d0f; color: #f2efe8; margin-top: 44px; padding: 24px 16px }
.foot .wrap { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px 28px; font-family: "Geist Mono", monospace; font-size: 10px; letter-spacing: .12em; text-transform: uppercase; opacity: .85 }
h2.page { margin: 34px 0 10px; font-family: Anton, sans-serif; font-weight: 400; font-size: clamp(34px,6vw,54px); line-height: .95; text-transform: uppercase }
.eyebrow { font-family: "Geist Mono", monospace; font-size: 11px; letter-spacing: .22em; color: #828287; text-transform: uppercase; margin-top: 34px }
.grid2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 28px 40px }
.qa { border-top: 1px solid #d8d5c8; padding-top: 15px }
.qa h3 { margin: 0 0 9px; font-family: Anton, sans-serif; font-weight: 400; font-size: 18px; text-transform: uppercase }
.qa h3::before { content: "/ "; color: #6b1f2a }
.qa p { margin: 0; font-size: 14px; color: #4a4a52; line-height: 1.6 }
/* dark engine pages */
body.dark { background: #0d0d0f; color: #e8e6dd; font-family: "Geist Mono", ui-monospace, monospace }
body.dark a { color: #f0e3e3 } body.dark a:hover { color: #fff }
.dk { border: 1px solid #2a2a2c; border-radius: 3px; padding: 14px 18px; background: transparent }
.dk.hi { border-color: #c25663 }
.lab { font-size: 8.5px; letter-spacing: .18em; text-transform: uppercase; color: #6f6d66 }
.jrow { border: 1px solid #1e1e20; background: #121214; border-radius: 3px; padding: 11px 16px; display: flex; flex-wrap: wrap; gap: 6px 16px; align-items: baseline; text-decoration: none; font-size: 12px; color: #e8e6dd }
.jrow:hover { border-color: #c25663 }
.ddot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #c25663; margin-right: 10px; animation: pulse 1.6s ease-in-out infinite }
.banwall span { border: 1px solid #d8d5c8; border-radius: 3px; padding: 4px 10px; text-decoration: line-through; text-decoration-color: #6b1f2a; text-decoration-thickness: 2px; display: inline-block; margin: 0 8px 8px 0; font-family: "Geist Mono", monospace; font-size: 12px }

body.dark .ticker { background: #121214; border: 1px solid #2a2a2c; margin: 0 }
body.dark .ticker-in { color: #a8a69e }
nav.oid { display: flex; flex-wrap: wrap; gap: 6px 22px; font-size: 10px; letter-spacing: .12em; text-transform: uppercase; font-family: "Geist Mono", ui-monospace, monospace }
nav.oid a { color: #a8a69e; text-decoration: none } nav.oid a:hover { color: #e8e6dd }
nav.oid .on { margin-left: auto; color: #c25663 }

nav.oi .ext { color: #828287 } nav.oi .ext:hover { color: #0d0d0f }

.oi-toast { position: fixed; left: 50%; bottom: 28px; transform: translateX(-50%); background: #0d0d0f; color: #f2efe8; border: 1px solid #6b1f2a; border-radius: 3px; padding: 12px 18px; font-family: "Geist Mono", monospace; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; z-index: 50; max-width: min(90vw, 480px); text-align: center }

/* --- mobile fixes (iPhone squash + ticker) --- */
.topbar > span:first-child { flex-wrap: wrap }
@media (max-width: 640px) {
  .topbar { justify-content: center; text-align: center; letter-spacing: .12em; font-size: 9px }
  .mast { padding-top: 18px }
  nav.oi { gap: 6px 16px }
  nav.oi .er { margin-left: 0 }
}
.ticker-in { will-change: transform; transform: translate3d(0,0,0) }
@keyframes tick { to { transform: translate3d(-50%, 0, 0) } }
@media (prefers-reduced-motion: reduce) {
  .ticker { overflow-x: auto; -webkit-overflow-scrolling: touch }
}
