/* ONE WEBSITE / ONE DAY
   Takeover (the owner's page) is styled only from validated tokens (--tk-*) + fixed layouts.
   Platform chrome has three directions:
     d-broadcast : a TV channel — black, red ON-AIR dot, schedule language.
     d-marquee   : an event poster — electric yellow, giant date, loud.
     d-canvas    : a blank canvas — white, crop marks, the space waiting for its owner. */

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { margin: 0; min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; }
a { color: inherit; }
button, input, select, textarea { font: inherit; }
:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
.staging { font: 600 11px/1.4 ui-monospace, Menlo, Consolas, monospace; letter-spacing: .08em; text-align: center; padding: 6px 16px; background: #ffd400; color: #000; position: relative; z-index: 5; }

/* ---------- house page (no owner today) ---------- */
.house { flex: 1; display: flex; flex-direction: column; justify-content: center; padding: 40px 16px 140px; max-width: 900px; width: 100%; margin: 0 auto; }
.kicker { font-size: 11px; letter-spacing: .35em; font-weight: 700; margin: 0 0 28px; }
.house-h { font-size: clamp(2.6rem, 13vw, 7rem); line-height: .92; letter-spacing: -.035em; margin: 0; font-weight: 900; }
.house-sub { font-size: clamp(1rem, 4.2vw, 1.3rem); max-width: 30ch; margin: 24px 0 0; opacity: .75; line-height: 1.4; }

/* ---------- auction bar (fixed, platform chrome) ---------- */
.bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 10; display: flex; gap: 12px; align-items: center; justify-content: space-between; padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); font-size: 13px; }
.bar-l { display: grid; grid-template-columns: auto 1fr; gap: 2px 8px; align-items: center; min-width: 0; }
.bar-k { font-weight: 800; letter-spacing: .08em; font-size: 12px; }
.bar-v, .bar-t { grid-column: 2; font-size: 12px; opacity: .85; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.live { width: 9px; height: 9px; border-radius: 50%; background: #ff2d2d; grid-row: 1; }
.bar-cta { flex: none; text-decoration: none; font-weight: 800; letter-spacing: .06em; padding: 12px 14px; font-size: 13px; white-space: nowrap; }
.bar-compact { opacity: .96; }
.owner-tag, .archive-tag { position: relative; z-index: 9; font: 600 10px/1.4 ui-monospace, Menlo, Consolas, monospace; letter-spacing: .06em; padding: 6px 12px; background: rgba(0,0,0,.72); color: #fff; text-align: center; backdrop-filter: blur(6px); }
.owner-tag a, .archive-tag a { color: #fff; }
.vmark { opacity: .85; }

/* ---------- takeover: owner-controlled within fixed rules ---------- */
.tk { flex: 1; background: var(--tk-bg, #111); color: var(--tk-fg, #fff); display: flex; padding: 40px 16px 120px; overflow: hidden; }
.tk-inner { width: 100%; max-width: 1100px; margin: 0 auto; display: flex; flex-direction: column; justify-content: center; gap: 24px; }
.tk-h { margin: 0; font-size: clamp(2.4rem, 12vw, 8rem); line-height: .95; letter-spacing: -.03em; overflow-wrap: anywhere; }
.tk-sub { margin: 0; font-size: clamp(1.1rem, 4.6vw, 1.9rem); line-height: 1.25; opacity: .9; }
.tk-body { margin: 0; max-width: 60ch; font-size: clamp(.98rem, 3.6vw, 1.15rem); line-height: 1.55; opacity: .85; }
.tk-cta { align-self: flex-start; display: inline-block; margin-top: 8px; padding: 16px 22px; background: var(--tk-accent, #fff); color: var(--tk-bg, #000); font-weight: 800; letter-spacing: .04em; text-decoration: none; }
.tk-img { width: 100%; max-height: 52vh; object-fit: cover; display: block; }
.tk-video { position: relative; width: 100%; aspect-ratio: 16 / 9; }
.tk-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.tk-copy { display: flex; flex-direction: column; gap: 16px; }
.tk-center .tk-inner { text-align: center; align-items: center; }
.tk-center .tk-cta { align-self: center; }
.tk-poster .tk-h { font-size: clamp(3rem, 17vw, 11rem); text-transform: uppercase; line-height: .86; }
.tk-poster .tk-inner { justify-content: flex-end; }
.tk-left .tk-inner { align-items: flex-start; }
@media (min-width: 860px) {
  .tk-split .tk-inner { display: grid; grid-template-columns: 1fr 1fr; align-items: center; }
}
.f-serif { font-family: "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif; }
.f-mono { font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; }
.f-display .tk-h { font-weight: 900; letter-spacing: -.05em; }
.f-condensed { font-family: "Arial Narrow", "Roboto Condensed", "Helvetica Neue", Arial, sans-serif; }
.f-condensed .tk-h { font-stretch: condensed; text-transform: uppercase; letter-spacing: -.01em; }
.m-marquee .tk-h { white-space: nowrap; animation: tk-marquee 14s linear infinite; }
@keyframes tk-marquee { from { transform: translateX(100%); } to { transform: translateX(-100%); } }
.m-pulse .tk-cta { animation: tk-pulse 2.4s ease-in-out infinite; }
@keyframes tk-pulse { 50% { transform: scale(1.05); } }
@media (prefers-reduced-motion: reduce) { .m-marquee .tk-h, .m-pulse .tk-cta { animation: none; white-space: normal; } }

/* ---------- content pages ---------- */
.page { width: 100%; max-width: 720px; margin: 0 auto; padding: 32px 16px 120px; line-height: 1.55; }
.page h1 { font-size: clamp(1.9rem, 8vw, 3.2rem); line-height: 1.02; letter-spacing: -.02em; margin: .4em 0 .5em; }
.crumb { font-size: 11px; letter-spacing: .25em; opacity: .65; }
.crumb a { text-decoration: none; }
.lead { font-size: 1.1rem; }
.facts { display: grid; grid-template-columns: minmax(120px, 40%) 1fr; gap: 10px 16px; }
.facts dt { opacity: .6; font-size: 13px; }
.facts dd { margin: 0; font-variant-numeric: tabular-nums; }
.note { font-size: 12px; opacity: .65; }
.err { color: #ff4d4d; }
form { display: grid; gap: 12px; margin: 20px 0; }
form label { display: grid; gap: 6px; font-size: 13px; }
form .row { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 12px; }
form input:not([type=color]):not([type=file]), form select, form textarea { width: 100%; padding: 12px; border-radius: 0; }
form input[type=color] { width: 100%; height: 44px; padding: 2px; }
form button { padding: 14px 18px; font-weight: 800; letter-spacing: .06em; border-radius: 0; cursor: pointer; }
.bids, .days { list-style: none; padding: 0; }
.bids li, .days li a { display: flex; gap: 12px; justify-content: space-between; padding: 10px 0; border-bottom: 1px solid rgba(127,127,127,.25); text-decoration: none; font-variant-numeric: tabular-nums; }
.days .o { flex: 1; font-weight: 700; overflow-wrap: anywhere; }
.token { padding: 16px; margin: 20px 0; border: 1px dashed currentColor; }
.token-value { width: 100%; padding: 12px; font-family: ui-monospace, Menlo, Consolas, monospace; }

/* ---------- d-broadcast ---------- */
body.d-broadcast { background: #070707; color: #f4f4f4; }
.d-broadcast .kicker::before { content: "● ON AIR SOON  "; color: #ff2d2d; }
.d-broadcast .bar { background: #111; color: #fff; border-top: 1px solid #262626; }
.d-broadcast .bar-cta { background: #ff2d2d; color: #fff; }
.d-broadcast form input, .d-broadcast form select, .d-broadcast form textarea { background: #000; color: #fff; border: 1px solid #444; }
.d-broadcast form button { background: #ff2d2d; color: #fff; border: 0; }

/* ---------- d-marquee ---------- */
body.d-marquee { background: #ffe600; color: #0a0a0a; }
.d-marquee .house-h { text-transform: uppercase; font-size: clamp(3rem, 16vw, 9rem); }
.d-marquee .bar { background: #0a0a0a; color: #ffe600; }
.d-marquee .live { background: #ffe600; }
.d-marquee .bar-cta { background: #ffe600; color: #0a0a0a; }
.d-marquee form input, .d-marquee form select, .d-marquee form textarea { background: #fffbe0; color: #0a0a0a; border: 2px solid #0a0a0a; }
.d-marquee form button { background: #0a0a0a; color: #ffe600; border: 0; }
.d-marquee .err { color: #b00000; }

/* ---------- d-canvas ---------- */
body.d-canvas { background: #ffffff; color: #111; }
.d-canvas .house { position: relative; margin: 24px 16px 140px; width: auto; border: 1px dashed #bbb; padding: 40px 20px; }
.d-canvas .house-h { font-weight: 300; letter-spacing: -.02em; }
.d-canvas .bar { background: #fff; color: #111; border-top: 1px solid #111; }
.d-canvas .live { background: #111; }
.d-canvas .bar-cta { background: #111; color: #fff; }
.d-canvas form input, .d-canvas form select, .d-canvas form textarea { background: #fff; color: #111; border: 1px solid #111; }
.d-canvas form button { background: #111; color: #fff; border: 0; }
@media (min-width: 768px) { .d-canvas .house { margin: 40px auto 140px; max-width: 900px; } }

/* ---------- V1: one-minute bid draft, editor actions, history, share ---------- */
fieldset.quick { border: 1px solid rgba(127,127,127,.4); padding: 12px; margin: 0; display: grid; gap: 12px; min-width: 0; }
fieldset.quick legend { font-weight: 700; font-size: 13px; padding: 0 6px; }
.presets { display: flex; flex-wrap: wrap; gap: 8px; }
.preset { display: inline-flex !important; align-items: center; gap: 6px; padding: 10px 12px; min-height: 44px; border: 1px solid rgba(127,127,127,.5); cursor: pointer; font-size: 13px; }
.preset input { margin: 0; }
.preset-night { background: #111111; color: #ffffff; }
.preset-paper { background: #f5f1e8; color: #111111; }
.preset-signal { background: #b00020; color: #ffffff; }
.preset-ocean { background: #0b3d91; color: #ffffff; }
.preset-sun { background: #ffe600; color: #0a0a0a; }
.preset-forest { background: #0f5132; color: #ffffff; }
form .actions { grid-template-columns: 1fr 1fr; }
form button.secondary { background: transparent !important; color: inherit !important; border: 1px solid currentColor !important; }
label.inline { display: inline-flex !important; align-items: center; gap: 8px; }
.ok { color: #3ddc84; }
.history { list-style: none; padding: 0; }
.history li { display: flex; gap: 12px; flex-wrap: wrap; padding: 8px 0; border-bottom: 1px solid rgba(127,127,127,.25); font-variant-numeric: tabular-nums; }
.history time { opacity: .7; }
.share { display: flex; gap: 8px; margin: 16px 0; }
.share-url { flex: 1; min-width: 0; padding: 10px; font: 12px ui-monospace, Menlo, Consolas, monospace; }
.share-btn { flex: none; padding: 10px 14px; font-weight: 800; text-decoration: none; border: 1px solid currentColor; }
.archive-meta { padding-bottom: 40px; }
.preview-bar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; justify-content: center; }
.inline-form { display: inline-flex; margin: 0; }
.inline-form button { padding: 8px 12px; font-weight: 800; border: 0; background: #ffd400; color: #000; cursor: pointer; }
.inline-form button.secondary { background: transparent; color: #fff; border: 1px solid #fff; }
/* Review F6: the takeover button names its real destination; outbound interstitial. */
.tk-dest { margin: 0; font-size: 12px; opacity: .7; overflow-wrap: anywhere; }
.tk-dest span { font-weight: 700; }
.outbound .dest-host { font-size: clamp(1.6rem, 7vw, 2.6rem); font-weight: 800; margin: .4em 0 0; overflow-wrap: anywhere; }
.outbound .dest-url code { display: block; padding: 10px 12px; background: rgba(127, 127, 127, .15); overflow-wrap: anywhere; word-break: break-all; font-size: 14px; }
.outbound .actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin-top: 20px; }
.outbound .go-on { display: inline-block; padding: 14px 18px; font-weight: 800; letter-spacing: .06em; background: #ffd400; color: #000; text-decoration: none; }
.outbound .secondary { padding: 14px 18px; border: 1px solid currentColor; color: inherit; text-decoration: none; }

/* R4 procedural life: decorative ambient motion of the page itself. It does not represent visitors or activity. */
@keyframes r4-breathe { 0%,100% { opacity: .55 } 50% { opacity: .9 } }
body::before { content: ""; position: fixed; inset: -20%; pointer-events: none; z-index: -1;
  background: radial-gradient(40% 35% at 30% 30%, rgba(255,255,255,.035), transparent 70%), radial-gradient(35% 30% at 70% 65%, rgba(255,255,255,.03), transparent 70%);
  animation: r4-breathe 14s ease-in-out infinite; }
@media (prefers-reduced-motion: reduce) { body::before { animation: none } }
.reign { color: var(--muted, #8a8a8a); font-size: .9rem; letter-spacing: .04em; margin-top: .4rem }
.staging.synthetic { background: #ff3b30; color: #fff }

/* R81: decoration from confirmed state, never a person/activity signal. */
.r81-field { position:fixed; inset:0; width:100%; height:100%; pointer-events:none; z-index:0; opacity:.12; }
body[data-r81-live]:not([data-r81-live=""]) > :not(.r81-field) { z-index:1; }
.r81-status { margin:0; padding:.4rem 1rem; font:11px monospace; letter-spacing:.08em; }
.r81-status:empty { display:none; }
.r81-transition { animation:r81-change .7s ease-out; }
@keyframes r81-change { from { opacity:.3; } to { opacity:1; } }
@media (prefers-reduced-motion:reduce) { .r81-transition { animation:none; } .r81-field { opacity:.08; } }
/* R86 local company navigation; flag controls whether this element exists. */
.r88-rehearsal{margin:1rem 0;padding:1rem;border:1px solid #555;overflow-wrap:anywhere}.r88-sketch{margin-top:1rem;padding:1.5rem;text-align:center;border:1px solid #777;overflow-wrap:anywhere;white-space:pre-wrap}.r88-sketch[hidden]{display:none}.r88-sketch[data-preset=night]{background:#111;color:#fff}.r88-sketch[data-preset=paper]{background:#f5f1e8;color:#111}.r88-sketch[data-preset=signal]{background:#b00020;color:#fff}.r88-sketch[data-preset=ocean]{background:#0b3d91;color:#fff}.r88-sketch[data-preset=sun]{background:#ffe600;color:#0a0a0a}.r88-sketch[data-preset=forest]{background:#0f5132;color:#fff}
.company-preview{position:relative;z-index:3;margin:1rem auto;padding:1rem;max-width:42rem;border:1px solid #555;background:#111;color:#fff;font:14px/1.5 system-ui;overflow-wrap:anywhere}.company-preview p{margin:.4rem 0}.company-preview a{color:#ffd400;text-decoration:underline}
