: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: .34; background: 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%, 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; }
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-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 { 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; }
.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); }
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; }
  .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 { grid-column: 1 / -1; }
}

@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; }
}