:root { color-scheme: dark; font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; background: #06130f; color: #edf5ff; --gold: #f6c75a; --green: #39d98a; --blue: #4aa3ff; --panel: rgba(12, 29, 45, .88); --line: rgba(111, 185, 255, .28); }
* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; min-width: 320px; min-height: 100vh; position: relative; overflow-x: hidden; background: radial-gradient(circle at 12% 10%, rgba(57,217,138,.18), transparent 30%), radial-gradient(circle at 86% 8%, rgba(246,199,90,.14), transparent 28%), linear-gradient(145deg, #06110d 0%, #081a2a 48%, #0a1321 100%); }
body::before { content: ""; position: fixed; inset: 0; z-index: -2; pointer-events: none; opacity: .22; background: linear-gradient(90deg, rgba(3,10,10,.82), rgba(3,10,10,.55)), url("/elite-green-bg.png") center 18% / min(1120px, 115vw) auto no-repeat, linear-gradient(90deg, transparent 49.7%, rgba(255,255,255,.18) 49.7% 50.3%, transparent 50.3%), radial-gradient(circle at 50% 50%, transparent 0 92px, rgba(255,255,255,.15) 93px 95px, transparent 96px), linear-gradient(rgba(255,255,255,.09) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.07) 1px, transparent 1px); background-size: 100% 100%, min(1120px, 115vw) auto, 100% 100%, 100% 100%, 120px 120px, 120px 120px; }
body::after { content: ""; position: fixed; right: -120px; bottom: -120px; width: 440px; height: 440px; z-index: -1; pointer-events: none; border-radius: 50%; opacity: .13; background: radial-gradient(circle, transparent 0 42%, rgba(255,255,255,.32) 43% 44%, transparent 45%), conic-gradient(from 18deg, rgba(255,255,255,.85) 0 10deg, transparent 10deg 36deg, rgba(255,255,255,.85) 36deg 46deg, transparent 46deg 72deg, rgba(255,255,255,.85) 72deg 82deg, transparent 82deg 108deg, rgba(255,255,255,.85) 108deg 118deg, transparent 118deg 144deg, rgba(255,255,255,.85) 144deg 154deg, transparent 154deg 180deg, rgba(255,255,255,.85) 180deg 190deg, transparent 190deg 216deg, rgba(255,255,255,.85) 216deg 226deg, transparent 226deg 252deg, rgba(255,255,255,.85) 252deg 262deg, transparent 262deg 288deg, rgba(255,255,255,.85) 288deg 298deg, transparent 298deg 324deg, rgba(255,255,255,.85) 324deg 334deg, transparent 334deg 360deg); }
button, input, select, textarea { font: inherit; }
* { scrollbar-color: #57e01f #08131f; scrollbar-width: thin; }
::-webkit-scrollbar { width: 12px; height: 12px; }
::-webkit-scrollbar-track { background: linear-gradient(180deg, rgba(7,17,28,.96), rgba(14,39,26,.96)), url("/elite-green-bg.png") center / cover; border-left: 1px solid rgba(87,224,31,.18); }
::-webkit-scrollbar-thumb { border: 3px solid #08131f; border-radius: 999px; background: linear-gradient(180deg, #a7ff2f, #32d25c 52%, #0f8b40); box-shadow: inset 0 0 8px rgba(255,255,255,.28), 0 0 12px rgba(87,224,31,.45); }
::-webkit-scrollbar-thumb:hover { background: linear-gradient(180deg, #d7ff66, #53ef75 52%, #21ac51); }
button { cursor: pointer; border: 0; border-radius: 12px; padding: 11px 16px; color: #06111d; background: linear-gradient(135deg, var(--blue), #7cc5ff); font-weight: 900; box-shadow: 0 10px 24px rgba(0,0,0,.18); transition: transform .16s ease, filter .16s ease, border-color .16s ease; }
button:hover { filter: brightness(1.08); transform: translateY(-1px); }
button.secondary { color: #e8f2ff; background: rgba(9,22,37,.62); border: 1px solid rgba(106,177,255,.34); box-shadow: none; }
button.secondary.active { background: linear-gradient(135deg, rgba(57,217,138,.22), rgba(74,163,255,.24)); border-color: var(--gold); color: #fff; box-shadow: 0 0 0 3px rgba(246,199,90,.12); }
button.danger { background: #f05260; color: #fff; }
button.danger-inline { margin-top: 10px; color: #ffb7bd; border-color: #8f3b45; }
button.danger-inline:hover { background: #4a242a; color: #fff; }
button:disabled { cursor: not-allowed; opacity: .55; }
button.icon-button { width: 32px; height: 32px; display: inline-grid; place-items: center; padding: 0; border-radius: 8px; color: #e8f2ff; background: #0b1a2a; border: 1px solid #31506e; }
button.icon-button.active { color: #07111c; background: #f2cc67; border-color: #f2cc67; }
button.icon-button.lay { color: #fff; background: #8b2d39; border-color: #d35b67; }
input, select, textarea { width: 100%; border: 1px solid rgba(106,177,255,.35); border-radius: 10px; padding: 10px 11px; background: rgba(5, 15, 26, .78); color: #edf5ff; box-shadow: inset 0 1px 0 rgba(255,255,255,.03); }
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--gold); box-shadow: 0 0 0 3px rgba(246,199,90,.12); }
input.positive-value { color: #70db9e; border-color: #2f9863; }
input.negative-value { color: #ff8993; border-color: #b64d59; }
textarea { min-height: 140px; resize: vertical; line-height: 1.45; }
label { display: grid; gap: 6px; color: #b8cbe0; font-size: .9rem; font-weight: 700; }
h1, h2, p { margin-top: 0; } h1 { margin-bottom: 6px; font-size: clamp(1.5rem, 4vw, 2.2rem); } h2 { font-size: 1.1rem; }
header, main { width: min(1320px, calc(100% - 28px)); margin: 0 auto; }
header { padding: 22px 0 20px; }
.app-header { display: grid; gap: 14px; }
.header-main { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.header-tools { display: flex; gap: 9px; align-items: center; justify-content: flex-start; }
header p { color: #a9c1da; margin-bottom: 0; }
.header-actions, .history-buttons, .settings > div, .bet-actions, .type-buttons { display: flex; gap: 9px; flex-wrap: wrap; align-items: center; }
.profile-button { display: inline-flex; align-items: center; gap: 7px; }
.profile-button::before { content: ""; width: 10px; height: 10px; border-radius: 999px; background: #70db9e; box-shadow: 0 0 0 3px rgba(112,219,158,.15); }
.freebet-header-button { position: relative; display: inline-flex; align-items: center; gap: 7px; }
.notify-button { position: relative; min-width: 44px; }
.notify-button.has-notification { border-color: #f05260; box-shadow: 0 0 0 3px rgba(240,82,96,.18); }
.header-count, .header-alert { display: inline-grid; place-items: center; min-width: 22px; height: 22px; padding: 0 6px; border-radius: 999px; font-size: .76rem; font-weight: 950; line-height: 1; }
.header-count { background: #9dd9ff; color: #06111d; }
.header-alert { background: #f05260; color: #fff; box-shadow: 0 0 0 3px rgba(240,82,96,.18); animation: pulse-alert 1.25s ease-in-out infinite; }
.freebet-header-button.has-freebet-warning { border-color: #f05260; color: #fff; }
.logged-user { align-self: center; padding: 8px 10px; border-radius: 999px; background: #0b1a2a; border: 1px solid #31506e; color: #9dd9ff; font-weight: 900; font-size: .78rem; }
.users-box { display: grid; gap: 10px; padding-top: 10px; }
.users-list { display: grid; gap: 8px; }
.user-row { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 8px 10px; border: 1px solid #31506e; border-radius: 9px; background: #0b1a2a; }
.user-row span { color: #edf5ff; font-weight: 900; }
.notification-dialog { width: min(460px, calc(100% - 28px)); }
.notification-list { display: grid; gap: 10px; margin: 10px 0; }
.notification-item { display: flex; justify-content: space-between; gap: 12px; align-items: center; padding: 12px; border: 1px solid #31506e; border-radius: 10px; background: #0b1a2a; }
.notification-item strong, .notification-item small { display: block; }
.notification-item small { color: #9bb4cd; margin-top: 3px; }
@keyframes pulse-alert { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.12); } }
.type-buttons button { flex: 1 1 155px; border-width: 2px; }
.type-buttons .type-freebet { border-color: #9dd9ff; color: #9dd9ff; }
.type-buttons .type-superodd { border-color: #ffb35a; color: #ffb35a; }
.type-buttons .type-extracao { border-color: #78e29e; color: #78e29e; }
.type-buttons .type-duplo { border-color: #4d8cff; color: #9fc0ff; }
.type-buttons .type-aumentada { border-color: #f5d85b; color: #f5d85b; }
.type-buttons .type-info { border-color: #e8f2ff; color: #e8f2ff; }
.type-buttons .type-freebet.active { background: #9dd9ff; color: #06111d; }
.type-buttons .type-superodd.active { background: #ffb35a; color: #06111d; }
.type-badge.type-superodd-inf { background: #ffb35a; color: #06111d; }
.type-buttons .type-extracao.active { background: #78e29e; color: #06111d; }
.type-buttons .type-duplo.active { background: #4d8cff; color: #fff; }
.type-buttons .type-aumentada.active { background: #f5d85b; color: #06111d; }
.type-buttons .type-info.active { background: #e8f2ff; color: #06111d; }
.mini-filter { margin-top: 10px; width: fit-content; max-width: 100%; border: 1px solid #29445d; border-radius: 10px; background: #0b1a2a; overflow: hidden; }
.mini-filter summary { list-style: none; cursor: pointer; padding: 8px 11px; color: #b8cbe0; font-size: .82rem; font-weight: 900; }
.mini-filter summary::-webkit-details-marker { display: none; }
.mini-filter summary::before { content: "⚙ "; opacity: .8; }
.notice-controls { display: grid; grid-template-columns: minmax(150px, 1fr) auto minmax(150px, 1fr) auto; gap: 10px; align-items: end; width: min(660px, calc(100vw - 70px)); padding: 10px; border-top: 1px solid #29445d; }
.notice-controls output { min-width: 46px; padding-bottom: 11px; color: #d7e9f9; font-weight: 900; }
.notice-controls input { padding: 0; accent-color: #31b76a; }
.notice-type-select, .notice-color-grid, .notice-preview, .notice-sticker-box { grid-column: 1 / -1; }
.notice-color-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.notice-color-grid input[type="color"] { height: 42px; padding: 3px; }
.notice-preview { display: grid; gap: 7px; padding: 10px; border: 1px dashed #31506e; border-radius: 10px; color: #b8cbe0; }
.notice-preview img { max-width: min(260px, 100%); border-radius: 8px; background: #07111c; border: 1px solid #29445d; }
.notice-sticker-box { display: grid; gap: 10px; padding: 12px; border: 1px solid rgba(109,184,255,.25); border-radius: 14px; background: rgba(7,17,28,.72); }
.notice-sticker-box strong { color: #fff; }
.notice-sticker-box .hint { margin: 2px 0 0; font-size: .84rem; }
.notice-sticker-box input { font-family: ui-monospace, Consolas, monospace; font-size: .82rem; }
.recent-sticker-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 8px; }
.recent-sticker-picker { display: grid; grid-template-columns: 1fr auto; gap: 8px; align-items: end; padding: 9px; border: 1px solid rgba(106,177,255,.22); border-radius: 12px; background: rgba(18,40,61,.45); }
.recent-sticker-picker button { min-height: 42px; white-space: nowrap; }
.recent-sticker-item { display: grid; grid-template-columns: auto 1fr; gap: 2px 8px; align-items: center; padding: 9px 10px; text-align: left; color: #e8f2ff; background: rgba(9,22,37,.72); border: 1px solid rgba(106,177,255,.34); border-radius: 12px; box-shadow: none; }
.recent-sticker-item span { grid-row: span 2; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: #12283d; font-size: 1.15rem; }
.recent-sticker-item strong { font-size: .82rem; }
.recent-sticker-item small { color: #9bb4cd; font-size: .7rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.check-line { display: flex; gap: 7px; align-items: center; color: #d5e7f8; white-space: nowrap; }.check-line input { width: auto; margin: 0; flex: 0 0 auto; }
main, .view-stack { display: grid; gap: 16px; padding-bottom: 40px; }
.card, .login-card, dialog .settings { background: linear-gradient(180deg, rgba(18,36,58,.92), rgba(8,19,31,.92)); border: 1px solid rgba(109,184,255,.28); border-radius: 18px; padding: clamp(18px, 3vw, 28px); box-shadow: 0 18px 46px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.04); backdrop-filter: blur(14px); }
.login-card { width: min(460px, calc(100% - 30px)); margin: 12vh auto; display: grid; gap: 16px; }
.login-card h1 { margin: 0; }.login-card p { color: #a9c1da; margin: 0; }
.eyebrow { color: #62b0ff; letter-spacing: .1em; font-size: .72rem; font-weight: 900; }
.grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 12px; }
#dropzone { position: relative; display: grid; gap: 14px; align-items: start; text-align: center; padding: 22px 18px 62px; min-height: 185px; border: 2px dashed rgba(74,163,255,.62); border-radius: 16px; color: #b8cbe0; outline: none; background: linear-gradient(135deg, rgba(6,21,34,.72), rgba(9,36,28,.42)); }
#dropzone:focus, #dropzone.drag { border-color: var(--gold); background: rgba(16,41,64,.78); box-shadow: 0 0 0 4px rgba(246,199,90,.11); }
#dropzone strong { color: #f0f7ff; font-size: 1.08rem; }.dropzone-copy { display: grid; gap: 6px; place-items: center; }.dropzone-copy span { max-width: 680px; }#pickFiles { position: absolute; right: 18px; bottom: 16px; }.images { display: grid; grid-template-columns: repeat(auto-fill, minmax(128px, 150px)); gap: 10px; width: 100%; justify-content: start; }
.freebet-promo { border-color: #9dd9ff; }.freebet-promo-grid { grid-template-columns: minmax(220px, 1fr) minmax(220px, .7fr); margin: 12px 0; }#freebetPromoDropzone { position: relative; display: grid; gap: 10px; place-items: center; min-height: 170px; padding: 18px; border: 2px dashed #3c6c98; border-radius: 14px; color: #b8cbe0; background: #0b1a2a; text-align: center; outline: none; }#freebetPromoDropzone:focus, #freebetPromoDropzone.drag { border-color: #9dd9ff; background: #102940; }#freebetPromoPreview { max-width: min(360px, 100%); max-height: 220px; border-radius: 10px; border: 1px solid #31506e; object-fit: contain; }.freebet-spin-field { min-width: 116px; }.freebet-value-field { min-width: 118px; }.history-bet.freebet-row { border: 1px solid #31506e; border-radius: 10px; padding: 10px; background: #102940; }.freebet-expiry { align-self: end; padding: 8px 10px; border-radius: 999px; font-size: .75rem; font-weight: 900; }.freebet-expiry.ok { background: #173f30; color: #7ce1aa; }.freebet-expiry.warning { background: #44391e; color: #f3d47f; }.freebet-expiry.expired { background: #4a242a; color: #ff9ea6; }.freebet-expiry.muted { background: #203c57; color: #bcd7ef; }
.image-card { overflow: hidden; position: relative; background: #0a1727; border: 1px solid rgba(112,219,158,.35); border-radius: 12px; box-shadow: 0 10px 22px rgba(0,0,0,.2); }
.image-card img { display: block; width: 100%; aspect-ratio: 4/3; object-fit: cover; }.image-card button { position: absolute; top: 6px; right: 6px; padding: 4px 8px; background: #e84c58; color: white; }
.bet { display: grid; grid-template-columns: 72px minmax(118px,1fr) minmax(170px,1.3fr) minmax(76px,.52fr) minmax(76px,.52fr) minmax(92px,.62fr) minmax(104px,.7fr) minmax(142px,.82fr) minmax(118px,.68fr); gap: 12px; align-items: end; padding: 13px 0; border-bottom: 1px solid #29445d; }.bet:last-child { border-bottom: 0; }.bet-actions.compact { flex-wrap: nowrap; align-self: end; justify-content: center; height: 42px; }.liability-field { min-width: 142px; }.return-field { margin-left: 0; min-width: 118px; }.liability-field input, .return-field input { min-width: 0; }.calculator-bar { margin-top: 14px; padding-top: 14px; border-top: 1px solid #29445d; display: grid; grid-template-columns: auto minmax(220px, 280px) minmax(220px, 280px); gap: 10px; align-items: end; justify-content: end; }
.result { background: #102740; }.summary { font-weight: 800; font-size: 1.05rem; }.freebet-header { margin: 8px 0 12px; border: 1px solid #31506e; border-radius: 10px; background: #0b1a2a; overflow: hidden; }.freebet-header summary { cursor: pointer; padding: 10px 12px; color: #9dd9ff; font-weight: 900; }.freebet-header div { display: grid; gap: 7px; padding: 0 12px 12px; }.freebet-header span { display: flex; justify-content: space-between; gap: 12px; padding: 8px 10px; border-radius: 8px; background: #12283d; }.freebet-header b { color: #70db9e; }.status { min-height: 1.3em; margin: 10px 0 0; color: #a9c1da; }.status.error { color: #ff8993; }.status.ok { color: #70db9e; }.hint { color: #a9c1da; }
pre, .post-preview { white-space: pre-wrap; overflow-wrap: anywhere; font-family: inherit; padding: 16px; margin: 0 0 14px; border-radius: 10px; background: #08131f; color: #dfecf8; }.post-preview { min-height: 230px; line-height: 1.45; }.watermarked { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px,1fr)); gap: 12px; margin-bottom: 16px; }.watermarked img { max-width: 100%; border-radius: 10px; border: 1px solid #31506e; }.publish { width: 100%; background: linear-gradient(135deg, #39d98a, #f6c75a); color: #06170c; font-size: 1.05rem; letter-spacing: .01em; }
.section-title { display: flex; justify-content: space-between; gap: 12px; align-items: center; margin-bottom: 14px; }.section-title h2 { margin: 4px 0 0; }
.history-panel { padding-inline: clamp(14px, 2.4vw, 22px); }.history-list { display: grid; gap: 10px; margin-top: 16px; }.history { border-radius: 8px; background: #0b1a2a; border: 1px solid #294a68; overflow: hidden; }.history.deleted { opacity: .72; }.history.failed { border-color: #a14b54; }.history.preparing { border-color: #9b7b3f; }.history > summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: auto auto 1fr auto auto; align-items: center; gap: 12px; padding: 12px 14px; }.history > summary::-webkit-details-marker { display: none; }.history-select { display: grid; place-items: center; cursor: pointer; }.history-select input { width: 18px; height: 18px; }.history-arrow { width: 26px; height: 26px; display: grid; place-items: center; border-radius: 6px; border: 1px solid #31506e; color: #bcd7ef; font-size: 1rem; transition: transform .18s ease; }.history[open] .history-arrow { transform: rotate(90deg); }.history-heading { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }.history-title h3 { margin: 0 0 3px; font-size: 1rem; }.history small { color: #9bb4cd; }.type-badge { padding: 4px 9px; border-radius: 999px; font-size: .68rem; font-weight: 900; color: #06111d; white-space: nowrap; }.type-badge.type-freebet { background: #9dd9ff; }.type-badge.type-superodd { background: #ffb35a; }.type-badge.type-extracao { background: #78e29e; }.type-badge.type-duplo { background: #4d8cff; color: #fff; }.type-badge.type-aumentada { background: #f5d85b; }.history-mini { display: flex; gap: 11px; flex-wrap: wrap; justify-content: end; color: #c6d8ea; font-size: .84rem; }.history-badge { padding: 6px 9px; border-radius: 999px; font-size: .72rem; font-weight: 900; background: #203c57; color: #bcd7ef; white-space: nowrap; }.history-badge.published { background: #173f30; color: #7ce1aa; }.history-badge.failed { background: #4a242a; color: #ff9ea6; }.history-badge.deleted { background: #3a414a; color: #c2c9d1; }.history-badge.preparing { background: #44391e; color: #f3d47f; }.history-body { border-top: 1px solid #294a68; padding: 14px; }.history-summary { display: grid; grid-template-columns: repeat(auto-fit,minmax(150px,1fr)); gap: 8px; margin: 0 0 13px; }.history-summary span { display: grid; gap: 3px; padding: 10px; border-radius: 8px; background: #12283d; }.history-summary strong { font-size: .92rem; }.history-summary .positive, .history-mini .positive { color: #70db9e; }.history-summary .negative, .history-mini .negative { color: #ff8993; }.history-links { display: grid; gap: 9px; margin: 10px 0; }.history-links a { color: #70b7ff; overflow-wrap: anywhere; }.history-operation-edit { max-width: 320px; margin: 12px 0; }.history-bets { display: grid; gap: 8px; margin: 12px 0; }.history-bet { display: grid; grid-template-columns: minmax(120px, .6fr) 1fr; gap: 8px; }.history-images { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; }.history-images figure { width: 110px; margin: 0; position: relative; }.history-images img, .history-images .placeholder { display: grid; place-items: center; width: 110px; height: 80px; border-radius: 7px; object-fit: cover; background: #142b43; border: 1px solid #31506e; color: #9bb4cd; font-size: .75rem; }.remove-history-image { position: absolute; top: -7px; right: -7px; width: 23px; height: 23px; padding: 0; border-radius: 999px; background: #f05260; color: #fff; border: 2px solid #0b1a2a; z-index: 2; }.history textarea { margin: 10px 0; }.history .edit-image { font-size: .72rem; padding: 6px 8px; margin-top: 5px; }.history .edit-image.waiting { color: #07111c; background: #f2cc67; border-color: #f2cc67; }.history-error { color: #ff8993; margin: 12px 0 0; }.history-text-readonly { margin-top: 12px; max-height: 240px; overflow: auto; }.retry { background: #44b970; color: #06170c; }
dialog { width: min(760px, calc(100% - 26px)); border: 0; background: transparent; color: #edf5ff; }dialog::backdrop { background: rgba(0,0,0,.7); }.settings { display: grid; gap: 14px; }.settings h3 { margin: 0; font-size: 1rem; }.settings p { color: #b8cbe0; margin-bottom: 0; }.settings-divider { display: grid; gap: 12px; padding-top: 12px; border-top: 1px solid #29445d; }.settings-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }#replaceDropzone { display: grid; gap: 8px; place-items: center; min-height: 150px; padding: 18px; text-align: center; border: 2px dashed #3c6c98; border-radius: 12px; background: #0b1a2a; color: #b8cbe0; outline: none; }#replaceDropzone:focus { border-color: #69b4ff; }.replace-dialog { width: min(520px, calc(100% - 26px)); }
.freebet-promo-grid { display: grid; grid-template-columns: repeat(2, max-content); gap: 10px 18px; align-items: center; margin: 12px 0; }
.freebet-promo-grid > label:first-child { grid-column: 1 / -1; width: min(620px, 100%); }
.freebet-participation { display: flex; gap: 14px; flex-wrap: wrap; align-items: center; }
.freebet-flags { display: grid; gap: 7px; align-self: end; justify-self: stretch; min-width: 116px; padding: 8px 10px; border: 1px solid #31506e; border-radius: 10px; background: #0b1a2a; }
.freebet-flags[hidden] { display: none !important; }
.freebet-value-field { min-width: 118px; }
.bet-freebet .freebet-flags { grid-column: 2 / span 1; grid-row: 2; }
.bet-freebet .freebet-value-field { grid-column: 3 / span 1; grid-row: 2; }
.extraction-flags { display: grid; gap: 7px; align-self: end; justify-self: stretch; min-width: 116px; padding: 8px 10px; border: 1px solid #31506e; border-radius: 10px; background: #0b1a2a; }
.extraction-flags[hidden] { display: none !important; }
.extraction-odd-field { min-width: 118px; }
.bet-extraction .extraction-flags { grid-column: 2 / span 1; grid-row: 2; }
.bet-extraction .extraction-odd-field { grid-column: 3 / span 1; grid-row: 2; }
.bet-lay .liability-field { grid-column: 8 / span 1; }
.bet-lay .return-field { grid-column: 9 / span 1; }
.settings-filter { border: 1px solid #29445d; border-radius: 12px; background: #0b1a2a; overflow: hidden; }
.settings-filter summary { list-style: none; cursor: pointer; padding: 11px 13px; color: #d7e9f9; font-weight: 900; }
.settings-filter summary::-webkit-details-marker { display: none; }
.settings-filter summary::before { content: "⚙ "; opacity: .8; }
.reset-counter-card { display: grid; grid-template-columns: 1fr auto; gap: 14px; align-items: center; padding: 14px; }
.reset-counter-card strong { display: block; color: #fff; font-size: 1rem; margin-bottom: 4px; }
.reset-counter-card .hint { margin: 0; font-size: .86rem; line-height: 1.35; }
.compact-danger { width: auto; min-width: 170px; padding-inline: 18px; border-radius: 999px; box-shadow: 0 10px 24px rgba(244,80,96,.18); }
.reset-confirm-dialog { width: min(420px, calc(100% - 28px)); gap: 13px; border-radius: 18px; }
.reset-confirm-dialog h2 { margin: 0; }
.reset-confirm-dialog .hint { margin: 0; line-height: 1.45; }
.reset-confirm-actions { display: grid !important; grid-template-columns: 1fr 1fr; gap: 10px; }
.reset-confirm-actions button { width: 100%; }
.watermark-grid { padding: 12px; border-top: 1px solid #29445d; align-items: end; }
.watermark-preview { grid-column: 1 / -1; display: grid; gap: 7px; padding: 10px; border: 1px dashed #31506e; border-radius: 10px; color: #b8cbe0; }
.watermark-preview img { max-width: min(330px, 100%); border-radius: 8px; border: 1px solid #29445d; background: #fff; }
.history-bet { grid-template-columns: repeat(3, minmax(130px, 1fr)); }
.freebet-missing-validity { display: inline-grid; place-items: center; margin-left: 6px; padding: 4px 8px; border-radius: 999px; background: #ff9f1c; color: #1b1000; font-size: .7rem; font-weight: 950; box-shadow: 0 0 0 3px rgba(255,159,28,.18); animation: pulse-orange 1.2s ease-in-out infinite; }
@keyframes pulse-orange { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.08); } }
.history-missing-validity { display: inline-grid; place-items: center; padding: 4px 9px; border-radius: 999px; background: #f05260; color: #fff; font-size: .68rem; font-weight: 950; box-shadow: 0 0 0 3px rgba(240,82,96,.18); animation: pulse-alert 1.15s ease-in-out infinite; }
.history-freebet { margin: 10px 0; border: 1px solid #31506e; border-radius: 10px; background: #0b1a2a; overflow: hidden; }
.history-freebet summary { cursor: pointer; padding: 9px 11px; color: #9dd9ff; font-weight: 900; }
.history-freebet span { display: flex; justify-content: space-between; gap: 12px; margin: 0 11px 8px; padding: 8px 10px; border-radius: 8px; background: #12283d; }
.history-freebet b { color: #70db9e; }
.info-history-panel { margin-top: 16px; padding-top: 16px; border-top: 1px solid rgba(106,177,255,.24); }
.info-history-panel .history > summary { grid-template-columns: auto 1fr auto; }
.freebet-control-dialog { width: min(520px, calc(100% - 26px)); padding: 14px; gap: 10px; border-radius: 14px; box-shadow: 0 18px 46px rgba(0,0,0,.34); }
.freebet-control-dialog h2 { margin: 0; font-size: 1rem; }
.freebet-control-dialog p { margin: 2px 0 0; font-size: .78rem; color: #8faac4; }
.freebet-control-head { display: flex; justify-content: space-between; align-items: start; gap: 10px; padding-bottom: 8px; border-bottom: 1px solid #244765; }
.freebet-control-head button { width: 30px; height: 30px; padding: 0; border-radius: 999px; font-size: 1.1rem; line-height: 1; }
.freebet-control-list { display: grid; gap: 8px; max-height: min(58vh, 430px); overflow: auto; padding-right: 2px; }
.freebet-control-items { display: grid; gap: 6px; }
.freebet-control-total { display: flex; justify-content: space-between; align-items: center; padding: 8px 10px; border: 1px solid #244765; border-radius: 9px; background: #0b1a2a; color: #a9c1da; font-size: .86rem; }
.freebet-control-total strong { color: #70db9e; font-size: .95rem; }
.freebet-control-item { display: grid; gap: 6px; padding: 9px 10px; border: 1px solid #244765; border-radius: 9px; background: #0b1a2a; }
.freebet-row-main { display: flex; justify-content: space-between; align-items: start; gap: 10px; }
.freebet-row-main strong { display: block; color: #edf5ff; font-size: .94rem; }
.freebet-row-main small { display: block; color: #8faac4; margin-top: 1px; font-size: .76rem; }
.freebet-row-main b { color: #70db9e; white-space: nowrap; font-size: .92rem; }
.freebet-row-meta { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.freebet-row-meta a { color: #70b7ff; font-size: .78rem; text-decoration: none; }
.freebet-row-meta a:hover { text-decoration: underline; }
.freebet-row-meta .freebet-expiry { padding: 5px 8px; font-size: .68rem; }
.freebet-control-actions { justify-content: end; padding-top: 2px; }
.freebet-control-actions button { padding: 8px 12px; }
.freebet-control-dialog { width: min(980px, calc(100% - 34px)); padding: 16px; gap: 12px; background: #12243a; }
.freebet-control-head { padding-bottom: 10px; border-bottom: 0; align-items: center; }
.freebet-control-head h2 { font-size: 1.1rem; margin-top: 2px; }
.freebet-control-head p { display: none; }
.freebet-control-head button { width: 32px; height: 32px; border-radius: 8px; }
.freebet-control-head button { font-size: 0; }
.freebet-control-head button::before { content: "×"; font-size: 1.15rem; line-height: 1; }
.freebet-control-list { max-height: min(68vh, 620px); gap: 10px; overflow: auto; }
.freebet-control-total { order: -1; align-self: start; width: fit-content; min-width: 230px; padding: 10px 13px; border-radius: 9px; background: #0b1a2a; border-color: #31506e; }
.freebet-control-items { display: grid; gap: 10px; }
.freebet-control-item { display: grid; grid-template-columns: minmax(240px, 1fr) auto; align-items: center; gap: 14px; padding: 12px 14px; border-radius: 9px; background: #0b1a2a; border: 1px solid #294a68; }
.freebet-control-item:hover { border-color: #3c6c98; background: #0d1d30; }
.freebet-row-left { display: flex; align-items: center; gap: 11px; min-width: 0; }
.freebet-row-left .history-arrow { flex: 0 0 auto; }
.freebet-row-left strong { display: inline-block; color: #edf5ff; font-size: .96rem; margin-right: 8px; }
.freebet-row-left small { display: block; color: #9bb4cd; font-size: .82rem; margin-top: 2px; }
.freebet-row-right { display: flex; align-items: center; justify-content: end; gap: 10px; flex-wrap: wrap; }
.freebet-row-right b { color: #70db9e; font-size: .92rem; white-space: nowrap; }
.freebet-row-right a { color: #70b7ff; font-size: .82rem; text-decoration: none; }
.freebet-row-right a:hover { text-decoration: underline; }
.freebet-row-right .freebet-expiry { padding: 6px 9px; font-size: .7rem; white-space: nowrap; }
.freebet-control-actions { justify-content: flex-end; }
.freebet-filter-buttons { display: flex; gap: 8px; flex-wrap: wrap; }
.freebet-filter-buttons button { padding: 8px 12px; border-radius: 999px; background: #0b1a2a; color: #bcd7ef; border: 1px solid #31506e; }
.freebet-filter-buttons button.active { background: #4aa3ff; color: #06111d; border-color: #4aa3ff; }
.freebet-filter-buttons button.report { background: #173f30; color: #7ce1aa; border-color: #277a4f; margin-left: auto; }
.freebet-start-extraction { padding: 7px 11px; border-radius: 8px; background: #44b970; border-color: #44b970; color: #06170c; }
.freebet-control-item.extracted { opacity: .86; border-color: #244765; }
.freebet-extracted-section { display: grid; gap: 8px; margin-top: 8px; padding-top: 10px; border-top: 1px solid #244765; }
.freebet-extracted-section h3 { margin: 0; font-size: .92rem; color: #bcd7ef; }
.freebet-row-right .positive { color: #70db9e; }
.freebet-row-right .negative { color: #ff8993; }
.apply-freebet-date { align-self: end; padding-inline: 10px; min-height: 40px; }
.save-history-main { background: #44b970; color: #06170c; }
output { align-self: end; padding: 0 0 11px; color: #d7e9f9; font-weight: 900; }
input[type="range"] { padding: 0; accent-color: #31b76a; }
@media (max-width: 850px) { header { display: grid; }.grid { grid-template-columns: repeat(2, minmax(0,1fr)); }.bet, .history-bet, .notice-controls { grid-template-columns: repeat(2, minmax(0,1fr)); }.bet .bet-actions { grid-column: 1 / -1; } }
@media (max-width: 720px) { .freebet-control-item { grid-template-columns: 1fr; align-items: start; }.freebet-row-right { justify-content: start; padding-left: 37px; }.freebet-control-total { width: 100%; } }
@media (max-width: 850px) { .bet-freebet .freebet-flags, .bet-freebet .freebet-value-field, .bet-extraction .extraction-flags, .bet-extraction .extraction-odd-field, .bet-lay .liability-field, .bet-lay .return-field { grid-column: auto; grid-row: auto; } }
@media (max-width: 620px) { .history > summary { grid-template-columns: auto 1fr auto; }.history-mini { grid-column: 1 / -1; justify-content: start; padding-left: 38px; } }
@media (max-width: 520px) { header, main { width: min(100% - 20px, 1120px); }.grid, .history-summary, .calculator-bar, .history-bet, .settings-grid { grid-template-columns: 1fr; justify-content: stretch; }.header-actions { width: 100%; }.header-actions button { flex: 1; padding-inline: 7px; }.section-title { display: grid; }#pickFiles { position: static; justify-self: stretch; }#dropzone { padding-bottom: 18px; } }
@media (max-width: 520px) { .reset-counter-card { grid-template-columns: 1fr; } .compact-danger { width: 100%; } .reset-confirm-actions { grid-template-columns: 1fr !important; } }

/* Ajustes finais: celular, cabecalho fixo e cadeados simples */
header.app-header { position: sticky; top: 0; z-index: 40; width: 100%; max-width: none; padding: 10px max(14px, calc((100% - 1320px) / 2)) 12px; background: rgba(5, 16, 27, .88); border-bottom: 1px solid rgba(106,177,255,.22); backdrop-filter: blur(18px); box-shadow: 0 12px 28px rgba(0,0,0,.28); }
.app-header::before { content: ""; position: absolute; inset: 0; z-index: -1; opacity: .24; background: linear-gradient(90deg, rgba(2,9,10,.78), rgba(2,9,10,.55)), url("/elite-green-bg.png") 50% 34% / 880px auto no-repeat; pointer-events: none; }
.brand-copy h1 { letter-spacing: .01em; text-transform: uppercase; }
.brand-emblem { position: relative; display: grid; gap: 0; min-width: 190px; padding: 10px 18px 8px; place-items: center; border-radius: 16px; overflow: hidden; background: linear-gradient(145deg, rgba(5,15,18,.92), rgba(20,45,28,.72)); border: 1px solid rgba(133,255,62,.45); box-shadow: inset 0 0 22px rgba(133,255,62,.10), 0 0 28px rgba(87,224,31,.13); }
.brand-emblem::before { content: ""; position: absolute; inset: -55%; opacity: .28; background: conic-gradient(from 20deg, transparent, rgba(133,255,62,.7), transparent 24%, transparent 58%, rgba(255,255,255,.45), transparent 72%); animation: radar-spin 9s linear infinite; }
.brand-emblem::after { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 50% 24%, rgba(133,255,62,.22), transparent 34%), linear-gradient(180deg, transparent, rgba(0,0,0,.34)); pointer-events: none; }
.brand-emblem span, .brand-emblem strong, .brand-emblem small { position: relative; z-index: 1; line-height: .9; font-style: italic; font-weight: 950; text-shadow: 0 2px 0 #06110d, 0 0 14px rgba(133,255,62,.42); }
.brand-emblem span { font-size: 1.35rem; color: #e7edf2; letter-spacing: .08em; }
.brand-emblem strong { font-size: 1.68rem; color: #8cff1f; letter-spacing: .04em; }
.brand-emblem small { margin-top: 7px; font-size: .54rem; letter-spacing: .28em; color: #c8d2dc; }
@keyframes radar-spin { to { transform: rotate(360deg); } }
main { padding-top: 10px; }
button.icon-button.active { color: #e8f2ff; background: #0b1a2a; border-color: #31506e; box-shadow: none; }
.lock-bet-button.active, #useTotalInvestmentButton.active { color: #e8f2ff; background: #0b1a2a; border-color: #31506e; box-shadow: none; }
.freebet-control-head button::before { content: "×" !important; font-size: 1.15rem; line-height: 1; }

@media (max-width: 760px) {
  body::after { width: 280px; height: 280px; right: -95px; bottom: -95px; opacity: .1; }
  header.app-header { padding: 8px 10px 10px; }
  .header-main { display: grid; gap: 10px; }
  .header-main h1 { font-size: 1.18rem; margin: 0; }
  .header-main p, .eyebrow { display: none; }
  .brand-emblem { min-width: 0; width: 100%; padding: 8px 12px 7px; border-radius: 12px; }
  .brand-emblem span { font-size: 1rem; }
  .brand-emblem strong { font-size: 1.22rem; }
  .brand-emblem small { font-size: .45rem; letter-spacing: .18em; }
  .header-tools { justify-content: space-between; }
  .header-actions { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 7px; width: 100%; }
  .header-actions button, .header-tools button { min-height: 40px; padding: 9px 8px; font-size: .78rem; border-radius: 10px; }
  .card, .login-card, dialog .settings { border-radius: 14px; padding: 14px; }
  main, .view-stack { gap: 12px; }
  .grid, .settings-grid, .calculator-bar, .history-summary, .history-bet { grid-template-columns: 1fr !important; }
  .type-buttons { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .type-buttons button { min-width: 0; flex: none; padding-inline: 8px; font-size: .82rem; }
  #dropzone { min-height: 150px; padding: 16px 12px 58px; }
  .images { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .watermarked { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bet { grid-template-columns: 48px 1fr 1fr !important; gap: 8px; align-items: end; padding: 12px 0; }
  .bet-actions.compact { grid-column: 1; grid-row: 1 / span 3; align-self: stretch; display: grid; gap: 7px; height: auto; }
  .bet label, .bet .freebet-flags, .bet .extraction-flags { min-width: 0; }
  .bet label:nth-of-type(1), .bet label:nth-of-type(2) { grid-column: span 1; }
  .boost-field, .liability-field, .return-field, .freebet-value-field, .extraction-odd-field, .freebet-flags, .extraction-flags { grid-column: span 2 !important; grid-row: auto !important; }
  .history > summary { grid-template-columns: auto 1fr auto; gap: 8px; padding: 10px; }
  .history-select { grid-row: 1; }
  .history-mini { grid-column: 1 / -1; justify-content: start; padding-left: 0; font-size: .78rem; }
  .history-badge { justify-self: end; }
  .history-buttons { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .history-buttons button { width: 100%; padding-inline: 8px; font-size: .82rem; }
  dialog { width: min(100% - 18px, 760px); }
  .notice-controls { width: 100%; grid-template-columns: 1fr auto; }
  .notice-type-select, .notice-color-grid, .notice-preview, .notice-sticker-box { grid-column: 1 / -1; }
  .recent-sticker-picker { grid-template-columns: 1fr; }
}

@media (max-width: 430px) {
  header, main { width: min(100% - 14px, 1320px); }
  .header-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .type-buttons { grid-template-columns: 1fr; }
  .bet { grid-template-columns: 42px 1fr !important; }
  .bet label, .boost-field, .liability-field, .return-field, .freebet-value-field, .extraction-odd-field, .freebet-flags, .extraction-flags { grid-column: 2 !important; }
  .calculator-bar { gap: 8px; }
  .images, .watermarked { grid-template-columns: 1fr; }
}

/* Ambiente de teste: visual diferente para nao confundir com o original */
.test-env {
  --gold: #c78cff;
  --green: #7c5cff;
  --blue: #35d7ff;
  --panel: rgba(18, 21, 55, .9);
  --line: rgba(154, 129, 255, .34);
}
.test-env body {
  background: radial-gradient(circle at 10% 8%, rgba(124,92,255,.24), transparent 30%), radial-gradient(circle at 86% 10%, rgba(53,215,255,.18), transparent 28%), linear-gradient(145deg, #070716 0%, #11183b 48%, #071426 100%);
}
.test-env body::before {
  opacity: .16;
  filter: hue-rotate(105deg) saturate(1.18);
}
.test-env * { scrollbar-color: #9a81ff #09101f; }
.test-env ::-webkit-scrollbar-track { background: linear-gradient(180deg, rgba(7,12,30,.96), rgba(23,18,55,.96)), url("/elite-green-bg.png") center / cover; border-left-color: rgba(154,129,255,.22); }
.test-env ::-webkit-scrollbar-thumb { background: linear-gradient(180deg, #35d7ff, #9a81ff 55%, #6738d8); box-shadow: inset 0 0 8px rgba(255,255,255,.28), 0 0 12px rgba(154,129,255,.45); }
.test-env header.app-header {
  background: rgba(8, 10, 31, .9);
  border-bottom-color: rgba(154,129,255,.34);
}
.test-env .app-header::before {
  filter: hue-rotate(105deg) saturate(1.25);
  opacity: .2;
}
.test-env .brand-copy .eyebrow::after {
  content: " • AMBIENTE TESTE";
  color: #35d7ff;
  letter-spacing: .12em;
}
.test-env .brand-copy h1::after {
  content: " TESTE";
  display: inline-block;
  margin-left: 10px;
  padding: 4px 9px;
  border-radius: 999px;
  vertical-align: middle;
  font-size: .58rem;
  letter-spacing: .12em;
  color: #071426;
  background: linear-gradient(135deg, #35d7ff, #c78cff);
  box-shadow: 0 0 0 3px rgba(154,129,255,.16);
}
.test-env .brand-emblem {
  background: linear-gradient(145deg, rgba(7,10,28,.94), rgba(35,25,76,.76));
  border-color: rgba(154,129,255,.62);
  box-shadow: inset 0 0 22px rgba(53,215,255,.12), 0 0 28px rgba(154,129,255,.18);
}
.test-env .brand-emblem::before {
  background: conic-gradient(from 20deg, transparent, rgba(53,215,255,.72), transparent 24%, transparent 58%, rgba(199,140,255,.6), transparent 72%);
}
.test-env .brand-emblem span { color: #f1f4ff; }
.test-env .brand-emblem strong { color: #35d7ff; text-shadow: 0 2px 0 #070716, 0 0 14px rgba(154,129,255,.55); }
.test-env .brand-emblem small::before { content: "AMBIENTE TESTE • "; color: #c78cff; }
.test-env .card, .test-env .login-card, .test-env dialog .settings {
  background: linear-gradient(180deg, rgba(18,21,55,.94), rgba(8,13,33,.94));
  border-color: rgba(154,129,255,.30);
}
.test-env button.secondary.active {
  background: linear-gradient(135deg, rgba(53,215,255,.20), rgba(154,129,255,.28));
  border-color: #c78cff;
  box-shadow: 0 0 0 3px rgba(199,140,255,.14);
}
.test-env .publish {
  background: linear-gradient(135deg, #35d7ff, #c78cff);
  color: #070716;
}
.test-env input:focus, .test-env select:focus, .test-env textarea:focus {
  border-color: #c78cff;
  box-shadow: 0 0 0 3px rgba(199,140,255,.14);
}

/* Original: visual premium Elite Green */
html:not(.test-env) body::before {
  opacity: .34;
  background:
    radial-gradient(circle at 50% 20%, rgba(142,255,31,.13), transparent 30%),
    linear-gradient(90deg, rgba(1,8,8,.88), rgba(1,8,8,.52) 50%, rgba(1,8,8,.88)),
    url("/elite-green-bg.png") center 8% / min(1320px, 118vw) auto no-repeat,
    linear-gradient(90deg, transparent 49.7%, rgba(255,255,255,.16) 49.7% 50.3%, transparent 50.3%),
    radial-gradient(circle at 50% 50%, transparent 0 92px, rgba(143,255,37,.16) 93px 95px, transparent 96px);
}
html:not(.test-env) body::after {
  opacity: .2;
  right: -60px;
  bottom: 4vh;
  filter: drop-shadow(0 0 28px rgba(142,255,31,.18));
}
html:not(.test-env) main {
  position: relative;
}
html:not(.test-env) main::before {
  content: "";
  position: fixed;
  inset: 112px 0 0;
  z-index: -1;
  pointer-events: none;
  opacity: .34;
  background:
    linear-gradient(180deg, rgba(3,12,13,.12), rgba(3,12,13,.62) 56%, rgba(3,12,13,.92)),
    radial-gradient(circle at 50% 30%, rgba(142,255,31,.16), transparent 34%),
    url("/elite-green-bg.png") center 42% / min(1180px, 92vw) auto no-repeat;
  filter: saturate(1.12) contrast(1.08);
}
html:not(.test-env) .card,
html:not(.test-env) .login-card,
html:not(.test-env) dialog .settings {
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(180deg, rgba(18,36,58,.88), rgba(6,18,29,.90)),
    radial-gradient(circle at 80% 12%, rgba(142,255,31,.12), transparent 30%);
  border-color: rgba(142,255,31,.23);
  box-shadow:
    0 22px 54px rgba(0,0,0,.34),
    inset 0 1px 0 rgba(255,255,255,.06),
    0 0 0 1px rgba(74,163,255,.10);
}
html:not(.test-env) .card::before,
html:not(.test-env) dialog .settings::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  opacity: .09;
  background:
    linear-gradient(90deg, transparent 0 48%, rgba(142,255,31,.35) 49% 51%, transparent 52%),
    url("/elite-green-bg.png") right -130px top -210px / 520px auto no-repeat;
  pointer-events: none;
}
html:not(.test-env) header.app-header {
  background:
    linear-gradient(90deg, rgba(4,16,18,.97), rgba(8,26,20,.88) 46%, rgba(4,16,18,.96)),
    url("/elite-green-bg.png") 74% 24% / 720px auto no-repeat;
  border-bottom-color: rgba(142,255,31,.28);
  box-shadow: 0 16px 40px rgba(0,0,0,.32), 0 0 38px rgba(87,224,31,.10);
}
html:not(.test-env) .app-header::before {
  opacity: .28;
  background:
    radial-gradient(circle at 18% 34%, rgba(142,255,31,.20), transparent 26%),
    linear-gradient(90deg, rgba(1,8,8,.75), rgba(1,8,8,.36)),
    url("/elite-green-bg.png") 92% 32% / 620px auto no-repeat;
}
html:not(.test-env) .brand-copy {
  position: relative;
  display: grid;
  gap: 5px;
  width: min(620px, 100%);
  padding: 13px 20px 14px;
  border-radius: 20px;
  overflow: hidden;
  border: 1px solid rgba(142,255,31,.32);
  background:
    linear-gradient(135deg, rgba(5,17,17,.86), rgba(11,31,24,.66)),
    radial-gradient(circle at 16% 18%, rgba(142,255,31,.18), transparent 34%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 0 30px rgba(87,224,31,.10);
}
html:not(.test-env) .brand-copy::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: .20;
  background:
    linear-gradient(100deg, transparent, rgba(255,255,255,.20), transparent 42%),
    url("/elite-green-bg.png") right -150px center / 420px auto no-repeat;
  pointer-events: none;
}
html:not(.test-env) .brand-copy::after {
  content: "ARBITRAGEM ESPORTIVA";
  position: absolute;
  right: 18px;
  top: 12px;
  color: rgba(206,232,222,.62);
  font-size: .58rem;
  font-weight: 950;
  letter-spacing: .26em;
}
html:not(.test-env) .brand-copy h1 {
  position: relative;
  z-index: 1;
  width: fit-content;
  margin: 0;
  font-size: clamp(1.7rem, 3.6vw, 2.75rem);
  font-weight: 950;
  letter-spacing: .035em;
  background: linear-gradient(180deg, #ffffff 0%, #c9d3d7 45%, #8cff1f 52%, #69d813 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  text-shadow: 0 3px 0 rgba(0,0,0,.35), 0 0 22px rgba(142,255,31,.24);
}
html:not(.test-env) .brand-copy .eyebrow,
html:not(.test-env) .brand-copy p {
  position: relative;
  z-index: 1;
}
html:not(.test-env) .brand-copy p { color: #c7d8df; }
html:not(.test-env) .type-buttons {
  gap: 12px;
}
html:not(.test-env) .type-buttons button {
  position: relative;
  overflow: hidden;
  min-height: 48px;
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(10,24,38,.88), rgba(5,15,26,.92));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 10px 22px rgba(0,0,0,.18);
  transform: translateZ(0);
}
html:not(.test-env) .type-buttons button::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: .0;
  background: linear-gradient(120deg, transparent, rgba(255,255,255,.20), transparent);
  transform: translateX(-70%);
  transition: opacity .18s ease, transform .38s ease;
}
html:not(.test-env) .type-buttons button:hover::before,
html:not(.test-env) .type-buttons button.active::before {
  opacity: 1;
  transform: translateX(70%);
}
html:not(.test-env) .type-buttons .type-superodd { border-color: #ff9f25; color: #ffbd63; }
html:not(.test-env) .type-buttons .type-freebet { border-color: #8edcff; color: #aee8ff; }
html:not(.test-env) .type-buttons .type-extracao { border-color: #61f29b; color: #81ffb4; }
html:not(.test-env) .type-buttons .type-aumentada { border-color: #ffdd42; color: #ffe56f; }
html:not(.test-env) .type-buttons .type-duplo { border-color: #7fb2ff; color: #bdd5ff; }
html:not(.test-env) .type-buttons .type-superodd.active { background: linear-gradient(135deg, #ff7a1a, #ffc15f); color: #170a00; box-shadow: 0 0 0 3px rgba(255,159,37,.18), 0 0 24px rgba(255,159,37,.24); }
html:not(.test-env) .type-buttons .type-freebet.active { background: linear-gradient(135deg, #7ed9ff, #c2efff); color: #041422; box-shadow: 0 0 0 3px rgba(126,217,255,.18), 0 0 24px rgba(126,217,255,.22); }
html:not(.test-env) .type-buttons .type-extracao.active { background: linear-gradient(135deg, #39d98a, #9dff21); color: #031607; box-shadow: 0 0 0 3px rgba(57,217,138,.18), 0 0 24px rgba(142,255,31,.24); }
html:not(.test-env) .type-buttons .type-aumentada.active { background: linear-gradient(135deg, #ffd52e, #fff08b); color: #161000; box-shadow: 0 0 0 3px rgba(255,213,46,.18), 0 0 24px rgba(255,213,46,.24); }
html:not(.test-env) .type-buttons .type-duplo.active { background: linear-gradient(135deg, #4d8cff, #8cff1f); color: #031018; box-shadow: 0 0 0 3px rgba(77,140,255,.18), 0 0 24px rgba(77,140,255,.24); }
html:not(.test-env) #dropzone {
  background:
    linear-gradient(135deg, rgba(6,21,34,.80), rgba(9,36,28,.56)),
    radial-gradient(circle at 75% 20%, rgba(142,255,31,.11), transparent 34%);
  border-color: rgba(76,184,255,.58);
  box-shadow: inset 0 0 38px rgba(142,255,31,.05);
}

@media (max-width: 760px) {
  html:not(.test-env) .brand-copy { padding: 10px 12px; border-radius: 14px; }
  html:not(.test-env) .brand-copy::after { display: none; }
  html:not(.test-env) .brand-copy h1 { font-size: 1.35rem; }
  html:not(.test-env) main::before { opacity: .16; background-size: 760px auto; }
}