/* Venue-owner screens. Same shell, but the page is dark so it is obvious this is the business side. */
body[data-shell="owner"] .screen { background: #0F1A17; }
body[data-shell="owner"] .page { color: #fff; }
body[data-shell="owner"] .fab { background: #7CE3B5; color: var(--ink); }
body[data-shell="owner"] #tabs { background: rgba(32, 46, 41, .96); }
body[data-shell="owner"] #tabs a.on { color: var(--ink); }
body[data-shell="owner"] .sub { color: #A9B8B0; }
body[data-shell="owner"] .sec { color: #fff; }
body[data-shell="owner"] .meta { color: #A9B8B0; }
body[data-shell="owner"] .sheet { color: var(--ink); }
body[data-shell="owner"] .toast { background: #fff; color: var(--ink); }
body[data-shell="owner"] .fine { color: #7F9087; }
body[data-shell="owner"] .logo.on-dark { color: #fff; }

.owner-top h1 { margin-top: 18px; font-size: 30px; }
.chip-col { display: grid; gap: 6px; justify-items: end; }
.venue-chip { display: inline-flex; align-items: center; gap: 6px; padding: 8px 12px; border-radius: 999px; background: rgba(255, 255, 255, .1); color: #fff; font-size: 12.5px; font-weight: 600; white-space: nowrap; transition: background .2s; }
.venue-chip:hover { background: rgba(255, 255, 255, .18); } .venue-chip .ic { width: 14px; height: 14px; }

.status-card { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 18px; border-radius: 24px; transition: background .5s var(--ease); }
.status-card.on { background: linear-gradient(135deg, #17795A, #0E4A37); } .status-card.off { background: #3A2A24; }
.status-card small { font: 500 11px var(--ff-m); letter-spacing: .14em; text-transform: uppercase; opacity: .75; }
.status-card b { display: block; font: 800 30px var(--ff-d); letter-spacing: -.03em; margin: 2px 0 4px; } .status-card p { font-size: 13px; opacity: .8; max-width: 24ch; }
.switch { position: relative; width: 74px; height: 42px; border-radius: 999px; background: rgba(255, 255, 255, .22); flex: none; transition: background .3s; }
.switch i { position: absolute; top: 4px; left: 4px; width: 34px; height: 34px; border-radius: 50%; background: #fff; box-shadow: 0 3px 10px rgba(0, 0, 0, .3); transition: transform .4s var(--ease); }
.switch.on { background: var(--yellow); } .switch.on i { transform: translateX(32px); background: var(--ink); }

.seatgrid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.sg { padding: 10px 6px; border-radius: 16px; background: rgba(255, 255, 255, .07); border: 1.5px dashed rgba(255, 255, 255, .2); color: #fff; text-align: center; display: grid; gap: 1px; justify-items: center; transition: transform .25s var(--ease), background .25s; }
.sg:active { transform: scale(.94); }
.sg b { font: 500 11px var(--ff-m); letter-spacing: .1em; opacity: .65; } .sg span { font-weight: 600; font-size: 13px; } .sg small { font: 400 10px var(--ff-m); opacity: .6; }
.sg.used { background: #7CE3B5; border: 1.5px solid #7CE3B5; color: var(--ink); } .sg.used b { opacity: .7; }
.stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 22px; }
.stats > div { padding: 14px 12px; border-radius: 18px; background: rgba(255, 255, 255, .07); } .stats small { display: block; font-size: 11.5px; color: #A9B8B0; line-height: 1.25; } .stats b { display: block; margin-top: 6px; font: 800 24px var(--ff-d); letter-spacing: -.03em; }
.clist { display: grid; gap: 8px; } .clist li { display: flex; align-items: center; gap: 12px; padding: 12px; border-radius: 18px; background: rgba(255, 255, 255, .07); } .clist li > div { flex: 1; } .clist b { display: block; } .clist small { color: #A9B8B0; font-size: 12.5px; } .clist strong { font: 500 14px var(--ff-m); }

body[data-shell="owner"] .form-card.dark-in { background: rgba(255, 255, 255, .07); }
body[data-shell="owner"] .page .lbl { color: #B9C8C0; } body[data-shell="owner"] .page .lbl output { color: #fff; } body[data-shell="owner"] .sheet .lbl { color: var(--ink-2); }
body[data-shell="owner"] .chip-btn { background: rgba(255, 255, 255, .08); border-color: rgba(255, 255, 255, .15); color: #fff; }
body[data-shell="owner"] .chip-btn.on { background: #7CE3B5; border-color: #7CE3B5; color: var(--ink); }
body[data-shell="owner"] .range::-webkit-slider-runnable-track { background: rgba(255, 255, 255, .18); }
body[data-shell="owner"] .hint { color: #8FA197; }
body[data-shell="owner"] .range.venue::-webkit-slider-thumb { background: #7CE3B5; border-color: #0F1A17; }
.sim { border-radius: 24px; background: rgba(255, 255, 255, .07); padding: 4px 16px 16px; }
.sim-in .lbl:first-child { margin-top: 14px; }
.cmp { display: grid; gap: 12px; margin-top: 22px; padding-top: 16px; border-top: 1px dashed rgba(255, 255, 255, .2); }
.bar-row { display: grid; grid-template-columns: 84px 1fr auto; gap: 10px; align-items: center; font-size: 13px; color: #B9C8C0; } .bar-row b { font: 500 13px var(--ff-m); color: #fff; min-width: 76px; text-align: right; }
.bar-row .bar { background: rgba(255, 255, 255, .12); height: 14px; } .bar-row .bar i { animation: none; transition: width .5s var(--ease); background: #8FA197; } .bar-row .bar.hot i { background: #7CE3B5; }
.sim-out { margin-top: 18px; padding: 16px; border-radius: 20px; background: #7CE3B5; color: var(--ink); } .sim-out small { font: 500 11px var(--ff-m); letter-spacing: .12em; text-transform: uppercase; opacity: .7; } .sim-out b { display: block; font: 800 38px var(--ff-d); letter-spacing: -.03em; margin: 2px 0; } .sim-out p { font-size: 12.5px; opacity: .8; }

.reqs { display: grid; gap: 12px; }
.req { padding: 16px; border-radius: 22px; background: rgba(255, 255, 255, .07); }
.req-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; } .req-top b { display: block; font: 700 17px var(--ff-d); } .req-top small { color: #A9B8B0; font-size: 13px; }
.req .kv > div { border-color: rgba(255, 255, 255, .1); } .req .kv.light dt { color: #8FA197; } .req .kv dd { color: #fff; }
.req .act-row { margin-top: 12px; flex-wrap: nowrap; } .req .btn-line { background: transparent; border-color: rgba(255, 255, 255, .25); color: #fff; }
.req .chip { background: rgba(255, 255, 255, .12); color: #fff; } .req .chip.green { background: #7CE3B5; color: var(--ink); } .req .chip.warm { background: var(--yellow); color: var(--ink); }

.pay-card { padding: 20px; border-radius: 24px; background: linear-gradient(135deg, #7CE3B5, #3DBB8A); color: var(--ink); } .pay-card small { font: 500 11px var(--ff-m); letter-spacing: .14em; text-transform: uppercase; opacity: .7; } .pay-card b { display: block; font: 800 46px/1 var(--ff-d); letter-spacing: -.04em; margin: 6px 0; } .pay-card p { font-size: 13px; opacity: .8; max-width: 30ch; }
.chart { padding: 14px; border-radius: 22px; background: rgba(255, 255, 255, .07); }
.chart svg { width: 100%; height: auto; display: block; } .chart text { font: 400 9px var(--ff-m); fill: #A9B8B0; text-anchor: middle; }
.chart .bp1 { fill: var(--pass); } .chart .bp2 { fill: var(--event); }
.chart .b rect { transform-box: fill-box; transform-origin: bottom; animation: bar .8s calc(var(--i) * 80ms + 200ms) var(--ease) both; } @keyframes bar { from { transform: scaleY(0); } }
.chart .legend { color: #B9C8C0; }
body[data-shell="owner"] .kv.light dt { color: #8FA197; } body[data-shell="owner"] .kv.light dd, body[data-shell="owner"] .kv .total dt, body[data-shell="owner"] .kv .total dd { color: #fff; } body[data-shell="owner"] .kv.light > div { border-color: rgba(255, 255, 255, .1); }
body[data-shell="owner"] .page .kv.light { background: rgba(255, 255, 255, .07); border-radius: 20px; padding: 4px 16px; }
body[data-shell="owner"] .sheet .kv.light { background: none; padding: 0; } body[data-shell="owner"] .sheet .kv.light dt { color: var(--ink-3); } body[data-shell="owner"] .sheet .kv.light dd { color: var(--ink); } body[data-shell="owner"] .sheet .kv.light > div { border-color: var(--line); }
body[data-shell="owner"] .peek .bp { --behind: #0F1A17; }
body[data-shell="owner"] .req .req-top small, body[data-shell="owner"] .req .kv dt { color: #A9B8B0; }
body[data-shell="owner"] .sheet .chip-btn { background: var(--card); border-color: var(--line); color: var(--ink); } body[data-shell="owner"] .sheet .chip-btn.on { background: var(--ink); border-color: var(--ink); color: #fff; }

/* ---------- audit fixes ---------- */
.owner-bar { padding-top: 6px; margin-bottom: 14px; }
.ob-row { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; }
.ob-chips { display: flex; gap: 6px; }
.venue-chip { padding: 8px 11px; font-size: 12px; }
.owner-bar h1 { margin-top: 18px; font-size: 30px; }
.chart .val { fill: #fff; font: 500 9px var(--ff-m); }