/* V2 sportsbook presentation. Auth and print keep their existing palettes. */
@media screen {
  body:has(#app > .topbar) {
    --bg: #0e1914;
    --panel: #17271e;
    --panel2: #263b2e;
    --line: #334b3b;
    --text: #edf4ef;
    --muted: #a6b9ac;
    --accent: #f5d85c;
    --green: #80d7a1;
    --blue: #a8cce6;
    background: var(--bg);
  }

  #app > .topbar {
    background: linear-gradient(105deg, #08764f, #086647);
    border-bottom: 1px solid #209068;
    box-shadow: 0 3px 16px #05170f25;
    gap: 34px;
    z-index: 20;
  }

  .topbar .brand { color: #fff; font-size: 25px; letter-spacing: -.7px; }
  .topbar .brand small { color: #c9e5d6; letter-spacing: 3px; }
  .topbar .toplinks { gap: 16px; }
  .topbar .toplinks button { font-size: 13px; font-weight: 600; color: #d5e9dc; }
  .topbar .toplinks button.active { color: #ffea8c; border-bottom-color: #f5d85c; }
  .topbar .balance { font-size: 14px; font-weight: 700; letter-spacing: -.1px; }
  .topbar .currency { color: #dbecdf; }
  .topbar .account { gap: 10px; }
  .topbar .account .avatar { background: #07583b; color: #f3e59a; }
  .topbar .account .quiet { border-color: #4b9b76; border-radius: 5px; }

  #app > .shell { background: #0e1914; grid-template-columns: 196px minmax(0, 1fr); }
  .shell > .sidebar { background: #111e17; border-right-color: #293e30; padding-top: 20px; }
  .sidebar .eyebrow, .sidebar .sidecaption { color: #849f8d; font-size: 10px; letter-spacing: 1.5px; }
  .sidebar .sidebutton { width: calc(100% - 20px); margin: 3px 10px; padding: 12px 13px; border-radius: 6px; color: #bdcfc3; font-size: 12px; font-weight: 500; }
  .sidebar .sidebutton span { color: #86a994; }
  .sidebar .sidebutton:hover { background: #1d3325; }
  .sidebar .sidebutton.active { color: #fff0ad; background: #244331; box-shadow: inset 3px 0 #f5d85c; }
  .sidebar .sidebutton.active span { color: #f5d85c; }
  .sidebar .competitionnav { margin-top: 25px; }
  .sidebar .competition { width: calc(100% - 20px); min-height: 35px; margin: 2px 10px; padding: 8px 11px; border-radius: 5px; color: #b7cbbf; font-size: 11px; line-height: 1.4; }
  .sidebar .competition:hover { background: #1c3023; }
  .sidebar .competition.active { background: #244331; color: #f8df80; }
  .sidebar .competition small { min-width: 20px; padding: 2px 4px; border-radius: 4px; background: #1b3023; color: #9ebda8; text-align: center; font-size: 9px; }
  .sidebar .sidefoot { margin: 22px 16px 0; padding: 18px 0; border-top: 1px solid #293e30; color: #819c8a; font-size: 10px; }
  .shell > .main { padding: 16px 18px 20px; }
  .gamelayout { grid-template-columns: minmax(0, 1fr) 308px; gap: 18px; }
  .gamelayout > .matchboard { scrollbar-color: #405d49 transparent; scroll-padding-top: 8px; }

  /* An overview built from available fixtures, rather than promotional imagery. */
  .sports-overview { padding: 19px 18px 17px; margin-bottom: 16px; border: 1px solid #2f4c38; border-radius: 12px; background: radial-gradient(ellipse at 0 0, #245d3c55, transparent 65%), #172b20; }
  .overview-top { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 15px; row-gap: 4px; margin-bottom: 15px; }
  .overview-top > div { flex: 1; min-width: 0; }
  .overview-kicker { display: block; color: #94bd9e; font-size: 10px; font-weight: 600; letter-spacing: 1.5px; text-transform: uppercase; }
  .overview-top h1 { margin: 3px 0; color: #f5faf6; font-size: 29px; line-height: 1.18; letter-spacing: -.8px; font-weight: 650; }
  .overview-top p { color: #a5c3ae; font-size: 12px; line-height: 1.55; margin: 0; }
  .overview-top .overview-saved { flex-shrink: 0; min-height: 32px; padding: 7px 9px; border: 1px solid #4e7354; border-radius: 5px; background: #213d2a; color: #c2d8c6; font-size: 10px; font-weight: 500; }
  .overview-top .overview-saved:hover { background: #34583a; border-color: #75926b; }
  .overview-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; margin-bottom: 15px; }
  .overview-metric { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; min-width: 0; min-height: 66px; padding: 11px 13px; border: 1px solid #41604b; border-radius: 7px; background: #213c2b; color: #a8c9b2; text-align: left; font-weight: 400; }
  button.overview-metric:hover { background: #2a4d35; border-color: #64846a; }
  .overview-metric.active { border-color: #8b9b58; background: #304b2c; box-shadow: inset 0 -2px #dcc45c; }
  .overview-metric strong { color: #f4de85; font-size: 21px; line-height: 1.05; font-weight: 650; font-variant-numeric: tabular-nums; }
  .overview-metric span { color: #b2cfbb; font-size: 11px; line-height: 1.35; }
  .featured-fixtures { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; min-width: 0; }
  .featured-fixture { min-width: 0; padding: 12px; border: 1px solid #3e5b47; border-radius: 8px; background: #14271d; }
  .featured-head { display: flex; align-items: center; justify-content: space-between; gap: 9px; min-width: 0; color: #8db39a; font-size: 10px; line-height: 1.5; }
  .featured-head > :first-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .featured-head > :last-child { flex-shrink: 0; }
  .featured-teams { display: block; width: 100%; padding: 11px 0 9px; border: 0; border-radius: 0; background: none; color: #edf6ef; text-align: left; font-weight: 500; }
  .featured-teams:hover { border: 0; background: none; color: #fff; }
  .featured-teamrow { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-width: 0; font-size: 13px; line-height: 1.8; }
  .featured-teamrow > :first-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .featured-teamrow > :last-child { flex-shrink: 0; color: #f7dd78; font-size: 12px; }
  .featured-time { display: block; margin-top: 4px; color: #95b89f; font-size: 10px; line-height: 1.4; font-weight: 400; font-variant-numeric: tabular-nums; }
  .featured-odds { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 5px; }
  .featured-odds .oddbutton { height: 40px; font-size: 13px; }

  /* Sports navigation and the fixture board share a compact grid. */
  .sports-toolbar { border: 1px solid #344e3d; border-radius: 10px 10px 0 0; background: #17291f; }
  .sports-toolbar .sportsheading { height: 52px; padding: 0 14px; gap: 22px; border-bottom-color: #34523e; background: #1d3627; border-radius: 9px 9px 0 0; }
  .sportsheading h1 { color: #eef6ef; font-size: 19px; font-weight: 600; letter-spacing: -.4px; }
  .sporttabs { gap: 4px; }
  .sporttabs button { padding: 0 12px; color: #9ebca8; font-size: 12px; font-weight: 500; }
  .sporttabs button.active { color: #f7dd78; border-bottom-color: #f5d85c; }
  .sporttabs small { padding: 2px 4px; border-radius: 3px; background: #294c35; font-size: 10px; }
  .live-dot { background: #89e2a6; box-shadow: 0 0 0 3px #7dde9e15; }
  .daybar { padding: 5px 6px; gap: 3px; border-bottom-color: #2f4938; background: #182c20; }
  .daybar button { min-height: 48px; padding: 7px 3px; gap: 4px; border-radius: 5px; border-bottom-width: 0; color: #9ebbA7; font-size: 11px; }
  .daybar button b { font-size: 10px; }
  .daybar button.active { background: #36563b; color: #f8e28d; box-shadow: inset 0 -2px #f5d85c; }
  .matchfilters { padding: 10px 11px; gap: 8px; background: #15271d; }
  .searchwrap { min-height: 38px; border: 1px solid #3b5944; border-radius: 5px; background: #102118; }
  .searchwrap > span { color: #8fae99; font-size: 21px; }
  .searchwrap input { padding: 10px 5px; color: #e4efe6; font-size: 12px; }
  .searchwrap input::placeholder { color: #7f9f8a; }
  .matchfilters select { min-height: 38px; border-color: #3b5944; border-radius: 5px; background: #102118; color: #c5d8cc; font-size: 11px; }
  .marketrail { min-height: 43px; border-top-color: #2c4434; border-bottom: 0; background: #12231a; scrollbar-width: none; }
  .marketrail::-webkit-scrollbar { display: none; }
  .marketrail button { min-height: 43px; padding: 12px 15px; color: #9eb9a8; font-size: 11px; font-weight: 500; }
  .marketrail button:hover { background: #213b2b; color: #e5f1e8; }
  .marketrail button.active { background: #294833; color: #f5dc79; box-shadow: inset 0 -2px #f5d85c; }
  .marketrail select { min-width: 91px; border-color: #42644b; background: #1f3928; color: #d8e6dc; font-size: 11px; }
  .matchboard #matches { border: 1px solid #344e3d; border-top: 0; border-radius: 0 0 10px 10px; margin-bottom: 18px; background: #14241b; }
  .bookrow { grid-template-columns: minmax(165px, 1fr) 237px 32px; gap: 7px; padding-left: 13px; padding-right: 8px; }
  .markethead { padding-top: 8px; padding-bottom: 8px; background: #112017; color: #7f9e89; font-size: 9px; letter-spacing: .65px; }
  .league { min-height: 35px; padding: 10px 12px; gap: 9px; background: #254532; color: #e3efe6; border-top: 1px solid #3b6046; font-size: 11px; }
  .league strong { font-weight: 600; }
  .leaguecountry { color: #9cbcA7; border-right-color: #53745c; font-size: 9px; }
  .league small { color: #a1bea9; padding: 2px 5px; border-radius: 3px; background: #1c3726; font-size: 9px; }
  .matchrow { min-height: 75px; padding-top: 9px; padding-bottom: 9px; background: #17291f; border-top-color: #2c4434; }
  .matchrow.matchrow-alt { background: #1e3326; }
  .matchrow:hover, .matchrow.matchrow-alt:hover { background: #294632; }
  .teams { gap: 10px; color: #dce9e0; font-size: 12px; }
  .teams:hover { color: #fff; }
  .matchstate { min-width: 52px; }
  .clock { min-width: 52px; color: #86d7a0; font-size: 10px; }
  .teamname { line-height: 25px; gap: 9px; }
  .teamname b { color: #f4df88; font-size: 12px; font-weight: 600; }
  .teamname img { width: 16px; height: 16px; }
  .clubname { gap: 6px; }
  .primaryodds { gap: 5px; }
  .oddbutton { height: 46px; border: 1px solid #466044; border-radius: 5px; background: #2d4531; color: #f7dc6c; font-size: 14px; font-weight: 650; transition: background .12s, border-color .12s; }
  .oddbutton:hover { background: #42613e; border-color: #789868; color: #fff0a8; }
  .oddbutton.selected { background: #f5d85c; border-color: #f9e382; color: #182f20; box-shadow: inset 0 -2px #d4b94b; }
  .oddbutton.unavailable, .oddbutton.missing { background: #203527; border-color: #304d37; color: #789280; font-size: 13px; box-shadow: none; }
  .oddbutton.unavailable:hover, .oddbutton.missing:hover { background: #203527; border-color: #304d37; color: #789280; }
  .oddlabel { margin-bottom: 5px; color: #b0c7b7; font-size: 10px; line-height: 1.25; }
  .selected .oddlabel { color: #37553a; }
  .oddvalue { font-variant-numeric: tabular-nums; letter-spacing: .1px; }
  .moremarkets { border-radius: 4px; color: #9dbba7; font-size: 10px; }
  .moremarkets:hover { background: #34553c; color: #f7dd79; }
  .oddbutton.price-up { animation: v2-oddsup 1.4s; }
  .oddbutton.price-down { animation: v2-oddsdown 1.4s; }
  .match-empty { background: #182b20; color: #90b29b; font-size: 12px; }
  .match-empty strong { color: #dbeade; font-size: 15px; font-weight: 500; }
  .betting-closed { background: #383520; color: #e4d392; font-size: 11px; }

  /* Match detail tabs remain inside the existing match scroll surface. */
  .detailsticky { position: sticky; top: 0; z-index: 12; border: 1px solid #34533e; border-bottom: 0; border-radius: 9px 9px 0 0; background: #14291d; box-shadow: 0 6px 15px #08170d25; }
  .detailsticky .fixtureback { min-height: 43px; padding: 8px 10px; gap: 13px; background: #1c3425; border-bottom-color: #33543d; border-radius: 8px 8px 0 0; }
  .fixtureback button { min-height: 30px; padding: 5px 7px; border-radius: 4px; color: #d8eade; font-size: 12px; }
  .fixtureback button:hover { background: #2e4f36; }
  .fixtureback > span { color: #93b49e; font-size: 10px; }
  .detailtabs { min-height: 44px; padding-left: 10px; gap: 14px; background: #12271b; border-bottom-color: #375b40; }
  .detailtabs button { min-height: 44px; padding: 12px 9px 10px; color: #a3c2ac; font-size: 12px; font-weight: 500; }
  .detailtabs button.active { color: #f7dd79; border-bottom-color: #f5d85c; }
  .matchhero-context { padding: 10px 14px; background: #172f20; color: #a9c5b2; border-bottom: 1px solid #37543e; font-size: 11px; line-height: 1.5; }
  .fixturehero.v2-fixturehero { position: relative; isolation: isolate; overflow: hidden; min-height: 218px; padding: 27px 24px; border: 1px solid #365d40; border-top: 0; background: radial-gradient(ellipse at 50% 45%, #326c3f66, transparent 70%), linear-gradient(100deg, #143522, #1f4b2b, #133722); grid-template-columns: minmax(0, 1fr) 155px minmax(0, 1fr); gap: 15px; }
  .v2-fixturehero .pitch-lines { position: absolute; inset: 0; z-index: -1; width: 100%; height: 100%; stroke: #d7edc0; stroke-width: 1.4; opacity: .2; pointer-events: none; }
  .v2-fixturehero .club, .v2-fixturehero .matchresult { position: relative; min-width: 0; }
  .v2-fixturehero .club { gap: 11px; }
  .v2-fixturehero .club img { width: 52px; height: 52px; filter: drop-shadow(0 3px 4px #071a0c35); }
  .v2-fixturehero .club strong { color: #edf5ed; font-size: 14px; line-height: 1.45; font-weight: 600; overflow-wrap: anywhere; }
  .v2-fixturehero .bigscore { gap: 16px; margin: 4px 0; color: #fff9dc; font-size: 48px; font-weight: 650; line-height: 1.25; letter-spacing: -1px; }
  .v2-fixturehero .bigscore span { color: #7eaa83; font-size: 25px; font-weight: 400; }
  .v2-fixturehero .matchphase { display: inline-block; padding: 3px 8px; border: 1px solid #6b976d; border-radius: 4px; background: #0e2918b5; color: #bcf0c6; font-size: 11px; }
  .v2-fixturehero .matchresult small { color: #afcdb2; font-size: 10px; }
  .detailfilters { padding: 11px; gap: 6px; background: #172b1e; border-bottom: 1px solid #2e4c35; scrollbar-width: none; }
  .detailfilters::-webkit-scrollbar { display: none; }
  .detailfilters button { min-height: 34px; padding: 8px 12px; border-color: #375d40; border-radius: 5px; background: #102519; color: #a4c2ad; font-size: 11px; }
  .detailfilters button.active { background: #345c3d; border-color: #6e916c; color: #ffe397; }
  .marketgroup { margin: 0; background: #172c1e; border-bottom: 1px solid #35533b; }
  .marketgroup h3 { padding: 12px 14px; background: #264b31; color: #e1eee3; font-size: 12px; font-weight: 600; }
  .marketoptions { padding: 9px; gap: 6px; }
  .marketoptions .oddbutton { min-height: 54px; height: 54px; }
  .eventlist, .statlist { padding: 5px 18px; background: #182d1f; }
  .event { padding: 16px 0; border-bottom-color: #35523c; }
  .event .minute { color: #9ed7aa; }
  .event strong { color: #e6f0e7; font-size: 12px; }
  .event p { color: #b8d1bf; font-size: 12px; }
  .event small { color: #8eb09a; font-size: 10px; }
  .detailstat { padding: 15px 0; border-bottom-color: #36573f; }
  .detailstat > div { color: #a9c6b2; font-size: 11px; }
  .detailstat b { color: #e8f3e9; font-size: 14px; }

  /* The selections scroll while the stake and confirmation area stay visible. */
  .gamelayout > #slip { display: flex; flex-direction: column; height: 100%; min-height: 0; max-height: 100%; border: 1px solid #3c5c43; border-radius: 10px; background: #14291c; color: #d8e9dd; scrollbar-gutter: auto; overflow-x: hidden; overflow-y: auto; }
  #slip > * { flex-shrink: 0; }
  #slip:has(.slip-selections) { overflow: hidden; }
  #slip .sliphead { min-height: 48px; padding: 13px 15px; border-bottom: 1px solid #406448; background: #234c31; color: #edf5ec; font-size: 13px; font-weight: 600; }
  #slip .sliphead .quiet { color: #b6d5bd; }
  #slip .sliptabs { background: #12281b; border-bottom-color: #34533d; }
  #slip .sliptabs button { min-height: 42px; padding: 12px 5px 10px; color: #8fb39c; font-size: 11px; font-weight: 500; }
  #slip .sliptabs button:hover { background: #203e29; color: #d5eadb; }
  #slip .sliptabs button.active { background: #294c33; color: #f7dd7a; border-bottom-color: #f5d85c; }
  #slip .sliptabs button span { color: #b7d4bf; background: #294a32; font-size: 9px; }
  #slip .sliptabs button.active span { color: #f3df92; background: #46663a; }
  .slip-tools { display: flex; align-items: center; justify-content: space-between; gap: 7px; padding: 9px 11px; background: #182f20; border-bottom: 1px solid #31513a; }
  .slip-tools button, button.slip-reserve { min-height: 32px; padding: 6px 9px; border: 1px solid #42694b; border-radius: 5px; background: #223e2a; color: #c1d8c7; font-size: 10px; font-weight: 500; }
  .slip-tools button:hover { background: #31573a; color: #f4ebbd; border-color: #71936c; }
  .slip-tools > span { flex: 1; color: #95b59f; font-size: 10px; white-space: nowrap; }
  .slip-tools .slip-reserve { margin-left: 0; }
  .slip-code { padding: 10px 11px; border-bottom: 1px solid #31513a; background: #12271a; }
  #slip-reservation-form { display: block; min-width: 0; }
  #slip-reservation-form > div { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 7px; min-width: 0; }
  #slip-reservation-form .field { min-width: 0; margin: 0; }
  #slip-reservation-form label { color: #9dbda7; font-size: 10px; line-height: 1.4; margin-bottom: 5px; }
  #slip-reservation-form input { min-width: 0; height: 36px; padding: 8px 9px; border: 1px solid #416348; border-radius: 4px; background: #0f2116; color: #e1efe3; font-size: 12px; }
  #slip-reservation-form button { height: 36px; padding: 7px 10px; border-color: #52764f; border-radius: 4px; background: #355736; color: #e8edca; font-size: 11px; font-weight: 500; }
  #slip-reservation-form button:hover { background: #497044; }
  #slip-reservation-form .error { color: #efb1a7; margin: 6px 0 0; font-size: 10px; line-height: 1.5; }
  #slip-reservation-form .error:empty { display: none; }
  .slip-review-note { margin: 0; padding: 10px 12px; border-bottom: 1px solid #68623b; background: #39391f; color: #e4d38c; font-size: 11px; line-height: 1.6; overflow-wrap: anywhere; }
  #slip > .slip-selections { flex: 1 1 auto; min-height: 65px; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #456448 transparent; }
  #slip .slippick { padding: 13px 14px; border-bottom-color: #35543c; background: #1c3624; }
  #slip .slippick:nth-child(even) { background: #233e2b; }
  #slip .slippick h4 { margin: 0 25px 7px 0; color: #e4efe4; font-size: 12px; line-height: 1.45; font-weight: 500; overflow-wrap: anywhere; }
  #slip .slippick p { margin-bottom: 8px; color: #a1bfa9; font-size: 10px; line-height: 1.45; }
  #slip .slippick strong { color: #f5d97b; font-size: 15px; font-weight: 600; }
  #slip .slippick .remove { width: 30px; height: 30px; top: 7px; right: 5px; color: #8dad96; font-size: 20px; }
  #slip .slippick .remove:hover { color: #ffe4a0; background: #3d5938; }
  .slip-summary { position: sticky; bottom: 0; z-index: 4; flex: 0 0 auto; padding: 14px; border-top: 1px solid #557349; background: #213f28; box-shadow: 0 -6px 15px #07190c30; }
  .slip-summary .slipbody { padding: 0; }
  .slip-summary .field { margin-bottom: 12px; }
  .slip-summary label { color: #b7d0bb; font-size: 11px; font-weight: 500; }
  #slip .slip-summary input { height: 42px; border: 1px solid #5e7f5a; border-radius: 5px; padding: 9px 11px; background: #102717; color: #f0f5e8; font-size: 16px; font-variant-numeric: tabular-nums; }
  #slip .slipline { margin: 9px 0; gap: 10px; color: #abc6b1; font-size: 11px; line-height: 1.5; }
  #slip .slipline b { color: #e0efdf; font-weight: 500; }
  #slip .slipline.total { padding: 11px 0 3px; border-top-color: #496c44; color: #bbd2bc; font-size: 11px; }
  #slip .slipline.total b { color: #ffe187; font-size: 23px; line-height: 1.2; font-weight: 650; }
  #slip .slip-summary .primary { min-height: 43px; margin-top: 7px; padding: 12px 9px; border: 1px solid #ffe69b; border-radius: 5px; background: #f5d85c; color: #1e3b22; font-size: 12px; font-weight: 650; }
  #slip .slip-summary .primary:hover { background: #ffe88b; }
  #slip .slip-summary .primary:disabled { border-color: #4d6545; background: #43583c; color: #a1b197; opacity: 1; }
  #slip .slip-summary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: end; gap: 8px 10px; }
  #slip .slip-summary .slipbody { display: contents; }
  #slip .slip-summary .field { min-width: 0; margin: 0; }
  #slip .slip-summary label { margin-bottom: 5px; line-height: 1.4; }
  #slip .stake-presets { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 5px; align-self: end; }
  #slip .stake-presets button { height: 28px; padding: 5px; border: 1px solid #55724c; border-radius: 4px; background: #2c4d30; color: #c6dbbd; font-size: 11px; font-weight: 500; }
  #slip .stake-presets button:hover { border-color: #8a9f67; background: #45663b; color: #f5e6a4; }
  #slip .slip-summary .slipline { min-width: 0; margin: 0; flex-wrap: wrap; gap: 3px 6px; }
  #slip .slip-summary .slipline.total { grid-column: 1 / -1; flex-wrap: nowrap; gap: 10px; padding-top: 10px; }
  #slip .slip-summary .primary { grid-column: 1 / -1; margin-top: 0; }
  #slip .slip-summary .sliphelp { grid-column: 1 / -1; margin: 0; }
  #slip .slip-summary.slipemptyfoot { display: flex; margin-top: auto; }
  #slip .sliphelp { color: #8faf95; font-size: 9px; line-height: 1.5; margin: 9px 0 0; }
  #slip .slip-empty { padding: 28px 20px; background: #182e20; color: #91b29c; font-size: 11px; }
  #slip .slip-empty strong { color: #c8dfce; font-size: 13px; }
  #slip .ticket-symbol { color: #5e8269; font-size: 28px; }
  #slip .slipemptyfoot { padding: 13px 14px; border-top-color: #36553d; background: #1b3423; color: #8eaf98; font-size: 10px; }
  #slip .slipemptyfoot b { color: #cce0cb; }
  #slip .sliphistoryhead { padding: 11px 13px; background: #1b3523; border-bottom-color: #38583f; color: #9fbea9; font-size: 10px; }
  #slip .sliphistoryhead button { color: #e0d283; font-size: 10px; }
  #slip .slipticket { width: auto; margin: 10px 10px 0; padding: 12px; border: 1px solid #3a5d42; border-radius: 7px; background: #1c3424; color: #cce0d0; }
  #slip .slipticket-top > b { color: #d7e8d8; font-size: 11px; }
  #slip .slipticket-time { margin: 7px 0; color: #87ab93; font-size: 9px; }
  #slip .slipticket .ticket-legs { margin: 8px 0 10px; }
  #slip .slipticket .ticket-legline { padding: 8px 7px; gap: 7px; background: #203d28; border-bottom-color: #3d6045; color: #cfe3d4; font-size: 10px; }
  #slip .slipticket .ticket-legline:nth-child(even) { background: #294932; }
  #slip .slipticket .leg-state { flex-basis: 59px; font-size: 9px; }
  #slip .slipticket .leg-match small { color: #8fb29a; font-size: 9px; }
  #slip .slipticket .leg-won .leg-state { color: #97dbaa; }
  #slip .slipticket .leg-lost .leg-state { color: #f7a3a3; }
  #slip .slipticket .leg-void .leg-state { color: #a2b8a8; }
  #slip .slipticket-money { color: #89ad94; font-size: 9px; }
  #slip .slipticket-money b { color: #dbe9d8; font-size: 13px; }
  #slip .slipticket-money > span:last-child b { color: #f6db83; }
  #slip .slipticket-open { color: #a8d4b1; font-size: 10px; margin-top: 8px; }
  #slip .slipall { min-height: 42px; padding: 13px 10px; margin-top: 10px; border-top: 1px solid #3f6042; background: #24482f; color: #c1dfc6; font-size: 11px; }

  /* Played-ticket cards are compact, with outcome color separate from money. */
  .ticket-history { gap: 13px; }
  .played-ticket { display: flex; flex-direction: column; gap: 12px; padding: 15px; border: 1px solid #3a5742; border-radius: 10px; background: #182b20; }
  .played-ticket-head { width: 100%; padding-bottom: 10px; border-bottom: 1px solid #36543e; gap: 10px; }
  .played-ticket-head h2 { margin-bottom: 5px; color: #e7f0e7; font-size: 14px; font-weight: 650; letter-spacing: .6px; }
  .played-ticket-head time { color: #96b3a0; font-size: 10px; }
  .played-ticket-count { color: #7fa48c; font-size: 9px; margin-top: 2px; }
  .played-ticket-head .tag { margin-top: 1px; padding: 4px 6px; font-size: 9px; }
  .played-ticket-stats { display: grid; width: 100%; max-width: none; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
  .played-ticket-stats dt { margin-bottom: 4px; color: #91ad9b; font-size: 10px; line-height: 1.4; }
  .played-ticket-stats dd { margin: 0; color: #dcebdc; font-size: 17px; font-weight: 600; line-height: 1.4; overflow-wrap: anywhere; }
  .played-ticket-stats .played-ticket-return { grid-column: auto; display: block; padding: 0; border: 0; }
  .played-ticket-return dt { max-width: none; }
  .played-ticket-return dd { color: #f7dc82; font-size: 19px; text-align: left; }
  .played-ticket-legs { width: 100%; }
  .played-ticket-legs .ticket-legs { display: block; margin: 0; max-width: none; background: transparent; }
  .played-ticket .ticket-legline { min-height: 53px; padding: 9px 10px; gap: 10px; border-left-width: 2px; border-bottom-color: #38563f; background: #223a2a; color: #d9e8de; font-size: 12px; }
  .played-ticket .ticket-legline:nth-child(even) { background: #2a4532; }
  .played-ticket .leg-state { flex-basis: 61px; gap: 5px; color: #b0c9b8; font-size: 9px; font-weight: 500; }
  .played-ticket .leg-match { line-height: 1.45; }
  .played-ticket .leg-match small { margin-top: 4px; color: #93b39e; font-size: 10px; line-height: 1.4; }
  .played-ticket .leg-won .leg-state { color: #9bdfb2; }
  .played-ticket .leg-lost .leg-state { color: #f6a9ac; }
  .played-ticket .leg-void .leg-state { color: #a8bdad; }
  .played-ticket-actions { width: 100%; display: flex; flex-direction: row; align-items: stretch; gap: 8px; }
  .played-ticket-actions > .ticket-open, .played-ticket-actions > .cashout-slot { flex: 1; min-width: 0; margin: 0; }
  .played-ticket-actions button { min-height: 40px; height: 100%; font-size: 11px; }
  .ticket-open { border-color: #4a7051; border-radius: 5px; background: #2c4d34; color: #cfe6d3; padding: 10px 11px; }
  .ticket-open:hover { border-color: #739576; background: #3b6541; }
  .ticket-open span { color: #a1c8aa; }
  .cashout-available { min-height: 40px; padding: 10px 11px; border-color: #70a467; border-radius: 5px; background: #35632f; color: #eef7df; font-size: 11px; font-weight: 600; }
  .cashout-available:hover { border-color: #a1c781; background: #4a7b3d; }
  .ticket-toolbar { display: grid; grid-template-columns: minmax(140px, 200px) minmax(140px, 180px) minmax(160px, 1fr); gap: 9px; margin-bottom: 15px; }
  .ticket-toolbar select, .ticket-toolbar input { width: 100%; min-width: 0; max-width: none; min-height: 39px; border-color: #406148; border-radius: 5px; background: #13291b; color: #bcd5c5; font-size: 12px; }
  .ticket-toolbar input::placeholder { color: #7fa18a; }

  /* Receipts retain a clean light surface and remain separate from card state. */
  body:has(#app > .topbar) dialog { border-color: #4b7053; border-radius: 10px; background: #162c1d; color: #deebe0; box-shadow: 0 24px 90px #03120985; }
  body:has(#app > .topbar) dialog::backdrop { background: #031008cb; backdrop-filter: blur(4px); }
  body:has(#app > .topbar) .modalhead { padding: 15px 18px; border-bottom-color: #385c40; background: #23452c; }
  body:has(#app > .topbar) .modalhead h2 { color: #dfeddf; font-size: 16px; font-weight: 600; }
  body:has(#app > .topbar) .modalbody:has(.receipt) { padding: 14px; }
  .receipt { padding: 21px; border: 1px solid #d3dfd3; border-radius: 6px; background: #f8faf5; color: #243b28; font-family: Arial, Helvetica, sans-serif; }
  .receipt h2 { color: #244e31; font-size: 22px; font-weight: 750; letter-spacing: 1.1px; }
  .receipt .sub { color: #748b76; font-size: 10px; line-height: 1.5; }
  .receipt p { color: #5c745f; font-size: 10px; line-height: 1.6; }
  .receipt .receiptpick { padding: 11px 10px; border-top: 0; border-bottom-color: #c7d6c6; background: #edf3e9; color: #2c482f; font-size: 12px; line-height: 1.6; }
  .receipt .receiptpick:nth-of-type(even) { background: #e1ebdb; }
  .receipt .receiptpick small { color: #6a816a; font-size: 10px; }
  .receipt .receiptpick strong { margin-top: 5px; gap: 10px; font-size: 12px; font-weight: 600; }
  .receipt .receiptline { gap: 10px; padding: 12px 0; border-top: 1px solid #bbceba; color: #466447; font-size: 12px; }
  .receipt .receiptreturn { padding: 15px; border: 1px solid #90ad8b; border-radius: 4px; background: #e5efdb; color: #275a30; font-size: 29px; font-weight: 650; }
  .receipt .receiptreturn span { color: #688364; font-size: 10px; margin-bottom: 6px; }
  .receiptactions { gap: 9px; margin: 14px 0 3px; }
  .receiptactions > button { min-height: 40px; border-color: #557b53; background: #2b4a30; color: #cce1c9; font-size: 12px; }
  .receiptactions .cashout-available { min-height: 40px; font-size: 12px; }

  .reservation-saved { max-width: 430px; margin: 0 auto; text-align: center; }
  .reservation-saved > .eyebrow { display: block; margin: 5px 0 13px; color: #9abd9d; font-size: 10px; letter-spacing: 1.5px; }
  .reservation-saved #saved-reservation-code { height: 54px; padding: 12px; border: 1px solid #879d58; border-radius: 5px; background: #102719; color: #f8df89; font: 600 23px/1.2 Consolas, monospace; letter-spacing: 2px; text-align: center; }
  .reservation-saved > button { width: 100%; min-height: 41px; margin: 10px 0 16px; border-color: #678c5b; border-radius: 5px; background: #3b6337; color: #e7f0d7; font-size: 12px; }
  .reservation-saved > button:hover { background: #4e7845; }
  .reservation-saved p { color: #a8c5ad; font-size: 12px; line-height: 1.6; margin: 7px 0; }
  .reservation-saved .formnote { margin-top: 16px; padding-top: 15px; border-top: 1px solid #385b3d; color: #86a98d; font-size: 11px; }
  .reservation-review-head { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 8px 14px; margin-bottom: 14px; padding: 12px; border: 1px solid #4d704a; border-radius: 5px; background: #25472c; }
  .reservation-review-head strong { color: #e3d98b; font: 600 15px/1.4 Consolas, monospace; letter-spacing: .8px; }
  .reservation-review-head span { color: #a4c4a8; font-size: 11px; }
  .reservation-selection { position: relative; min-height: 80px; margin-bottom: 8px; padding: 12px 68px 12px 12px; border: 1px solid #3c6142; border-radius: 5px; background: #1d3b26; }
  .reservation-selection:nth-of-type(even) { background: #284a30; }
  .reservation-selection h4 { margin: 0 0 7px; color: #dcebdd; font-size: 12px; line-height: 1.5; font-weight: 500; overflow-wrap: anywhere; }
  .reservation-selection p { margin: 0; color: #93b49a; font-size: 11px; line-height: 1.5; }
  .reservation-selection > strong { position: absolute; top: 12px; right: 12px; color: #f0d77a; font-size: 16px; font-weight: 650; font-variant-numeric: tabular-nums; }
  .reservation-selection small { display: block; margin-top: 8px; color: #9fb5a3; font-size: 10px; line-height: 1.5; }
  .reservation-selection .selection-changed { color: #e4c87b; }
  .reservation-selection.unavailable { background: #25362b; border-color: #4d5e4d; }
  .reservation-selection.unavailable h4, .reservation-selection.unavailable > strong { color: #9dae9c; }
  .reservation-review > .slipline { color: #9dbba4; font-size: 12px; }
  .reservation-review > .slipline b { color: #dbe7d2; }
  .reservation-review > .formnote { color: #8caf95; font-size: 11px; line-height: 1.6; }
  .reservation-review > .primary { min-height: 43px; border-color: #ffdf8a; border-radius: 5px; background: #f5d85c; color: #284427; font-size: 12px; font-weight: 600; }

  @media (min-width: 901px) {
    .sports-toolbar { position: sticky; top: 0; z-index: 11; box-shadow: 0 6px 16px #07160c20; }
    .played-ticket { display: grid; grid-template-columns: minmax(145px, .8fr) minmax(230px, 1fr) minmax(135px, .65fr); grid-template-areas: "identity stats actions" "legs legs legs"; gap: 14px 18px; padding: 16px 17px; }
    .played-ticket-head { padding-bottom: 0; border-bottom: 0; }
    .played-ticket-actions { flex-direction: column; }
    .played-ticket-actions button { min-height: 37px; }
  }

  @media (min-width: 1200px) {
    .played-ticket-legs .ticket-legs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; background: #3c5a43; }
    .played-ticket-legs .ticket-legline { border-bottom: 0; }
    .played-ticket-legs .ticket-legline:last-child:nth-child(odd) { grid-column: 1 / -1; }
  }

  @media (min-width: 1500px) {
    .gamelayout { grid-template-columns: minmax(0, 1fr) 325px; gap: 20px; }
    .with-secondary { grid-template-columns: minmax(230px, 1fr) 260px 180px 34px; }
    .secondaryodds { gap: 5px; }
    .secondaryodds .oddbutton { height: 46px; }
    .featured-fixtures { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  }

  @media (max-width: 1180px) and (min-width: 901px) {
    #app > .shell { grid-template-columns: 174px minmax(0, 1fr); }
    .shell > .main { padding: 13px; }
    .gamelayout { grid-template-columns: minmax(0, 1fr) 275px; gap: 12px; }
    .bookrow { grid-template-columns: minmax(125px, 1fr) 195px 27px; gap: 5px; padding-left: 10px; padding-right: 7px; }
    .teams { font-size: 11px; gap: 7px; }
    .matchstate, .clock { min-width: 46px; }
    .played-ticket { grid-template-columns: minmax(0, 1fr) 190px; grid-template-areas: "identity actions" "stats stats" "legs legs"; }
    .played-ticket-actions { width: 190px; }
    .played-ticket-stats { max-width: 540px; }
  }

  @media (max-width: 900px) {
    .shell > .main { padding: 12px 12px calc(76px + env(safe-area-inset-bottom)); }
    #app > .topbar { gap: 12px; padding-left: 14px; padding-right: 14px; }
    .topbar .brand { font-size: 23px; }
    .topbar .brand img { width: 31px; height: 33px; }
    .gamelayout { grid-template-columns: minmax(0, 1fr) 258px; gap: 12px; }
    .bookrow { grid-template-columns: minmax(125px, 1fr) 180px 25px; gap: 5px; padding-left: 10px; padding-right: 6px; }
    .sports-overview { padding: 16px 14px; }
    .overview-top { margin-bottom: 13px; }
    .overview-top h1 { font-size: 25px; }
    .overview-metric { padding: 10px; min-height: 61px; }
    .overview-metric strong { font-size: 19px; }
    .featured-fixtures { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(225px, 83%); grid-template-columns: none; overflow-x: auto; padding-bottom: 3px; scroll-snap-type: x proximity; scrollbar-width: none; }
    .featured-fixtures::-webkit-scrollbar { display: none; }
    .featured-fixture { scroll-snap-align: start; }
    .mobilebar { border-top-color: #42634a; background: #103b26ed; backdrop-filter: blur(10px); }
    .mobilebar button { color: #99b8a4; font-size: 10px; font-weight: 500; }
    .mobilebar button.active { color: #f5dc7d; }
    .mobilebar b { color: #a6c6ae; font-size: 17px; font-weight: 400; }
    .mobilebar button.active b { color: #f5dc7d; }
    .fixturehero.v2-fixturehero { grid-template-columns: minmax(0, 1fr) 126px minmax(0, 1fr); padding: 24px 16px; gap: 12px; }
    .v2-fixturehero .bigscore { font-size: 42px; }
  }

  @media (max-width: 660px) {
    #app > .topbar { padding-left: 11px; padding-right: 11px; gap: 7px; }
    .topbar .brand { gap: 7px; font-size: 21px; }
    .topbar .brand img { width: 29px; height: 31px; }
    .topbar .brand small { font-size: 7px; letter-spacing: 2.8px; }
    .topbar .account { gap: 4px; }
    .topbar .balance { font-size: 12px; }
    .topbar .currency { width: 47px; flex-basis: 47px; font-size: 10px; }
    body:is([data-view="live"], [data-view="upcoming"]) .shell > .main { padding: 0 0 calc(73px + env(safe-area-inset-bottom)); }
    .sports-overview { padding: 15px 12px 14px; margin: 0; border: 0; border-bottom: 1px solid #35543e; border-radius: 0; }
    .overview-top { row-gap: 3px; column-gap: 10px; margin-bottom: 12px; }
    .overview-kicker { font-size: 9px; letter-spacing: 1.3px; }
    .overview-top h1 { font-size: 25px; margin: 3px 0; }
    .overview-top p { font-size: 11px; line-height: 1.5; }
    .overview-metrics { gap: 6px; margin-bottom: 12px; }
    .overview-metric { min-height: 57px; padding: 9px; gap: 4px; border-radius: 6px; }
    .overview-metric strong { font-size: 18px; }
    .overview-metric span { font-size: 10px; }
    .featured-fixtures { grid-auto-columns: minmax(232px, 83%); gap: 8px; }
    .featured-fixture { padding: 10px; border-radius: 7px; }
    .featured-head { font-size: 9px; }
    .featured-teams { padding: 7px 0 8px; }
    .featured-teamrow { font-size: 12px; line-height: 1.7; }
    .featured-time { font-size: 9px; margin-top: 3px; }
    .featured-odds .oddbutton { height: 36px; font-size: 13px; }
    .sports-toolbar { border-left: 0; border-right: 0; border-radius: 0; }
    .sports-toolbar .sportsheading { padding: 0 10px; min-height: 49px; height: 49px; gap: 12px; border-radius: 0; }
    .sportsheading h1 { font-size: 16px; }
    .sporttabs { margin-left: auto; gap: 0; }
    .sporttabs button { padding: 0 9px; gap: 5px; font-size: 11px; }
    .sporttabs small { padding: 1px 3px; font-size: 9px; }
    .slipshortcut { display: block; min-height: 28px; padding: 6px 7px; border: 1px solid #4d6d4d; border-radius: 4px; background: #294b31; color: #c8dbca; font-size: 9px; }
    .slipshortcut b { margin-left: 3px; color: #f5d975; }
    .daybar { padding: 4px; gap: 2px; }
    .daybar button { min-height: 47px; padding: 7px 2px; font-size: 10px; gap: 4px; }
    .daybar button b { font-size: 9px; }
    .matchfilters { padding: 8px 9px; gap: 7px; }
    .searchwrap { min-height: 35px; flex-basis: 100%; }
    .searchwrap input { padding: 9px 4px; font-size: 12px; }
    .matchfilters select { min-height: 35px; max-width: none; font-size: 11px; padding: 8px 7px; }
    .marketrail { min-height: 42px; }
    .marketrail button { min-height: 42px; padding: 12px 11px; font-size: 10px; }
    .marketrail select { width: 89px; min-width: 89px; margin-right: 6px; font-size: 10px; }
    .matchboard #matches { margin: 0; border-left: 0; border-right: 0; border-radius: 0; }
    .bookrow { grid-template-columns: minmax(0, 1fr) 143px 20px; gap: 5px; padding-left: 9px; padding-right: 5px; }
    .markethead { padding-top: 8px; padding-bottom: 8px; font-size: 8px; }
    .league { min-height: 34px; padding: 9px; gap: 7px; font-size: 10px; }
    .leaguecountry { font-size: 8px; padding-right: 7px; }
    .league small { font-size: 8px; padding: 2px 4px; }
    .matchrow { min-height: 83px; padding-top: 9px; padding-bottom: 9px; }
    .teams { display: block; padding: 0; font-size: 11px; line-height: 1.4; }
    .matchstate { display: flex; align-items: center; min-width: 0; gap: 5px; margin-bottom: 4px; }
    .matchstate .clock { min-width: 0; margin: 0; color: #8bdca4; font-size: 9px; }
    .teamname { gap: 5px; line-height: 21px; }
    .clubname { gap: 3px; }
    .teamname b { min-width: 9px; font-size: 10px; }
    .primaryodds { gap: 3px; }
    .oddbutton { height: 47px; border-radius: 4px; padding: 4px 2px; font-size: 13px; }
    .oddbutton.unavailable, .oddbutton.missing { font-size: 12px; }
    .moremarkets { height: 44px; font-size: 9px; }
    .detailsticky { border-left: 0; border-right: 0; border-radius: 0; }
    .detailsticky .fixtureback { min-height: 41px; padding: 7px 7px; gap: 8px; border-radius: 0; }
    .fixtureback button { font-size: 11px; }
    .fixtureback > span { font-size: 9px; }
    .detailtabs { padding-left: 7px; gap: 10px; min-height: 42px; }
    .detailtabs button { min-height: 42px; padding: 11px 8px 9px; font-size: 11px; }
    .matchhero-context { padding: 9px 11px; font-size: 10px; }
    .fixturehero.v2-fixturehero { min-height: 190px; padding: 23px 11px; grid-template-columns: minmax(0, 1fr) 98px minmax(0, 1fr); gap: 9px; border-left: 0; border-right: 0; }
    .v2-fixturehero .club { gap: 9px; }
    .v2-fixturehero .club img { width: 39px; height: 39px; }
    .v2-fixturehero .club strong { font-size: 12px; line-height: 1.45; }
    .v2-fixturehero .bigscore { margin: 5px 0; font-size: 37px; gap: 11px; }
    .v2-fixturehero .bigscore span { font-size: 19px; }
    .v2-fixturehero .matchphase { padding: 3px 6px; font-size: 10px; }
    .v2-fixturehero .matchresult small { font-size: 9px; }
    .detailfilters { padding: 9px 8px; gap: 5px; }
    .detailfilters button { min-height: 32px; padding: 7px 10px; font-size: 10px; }
    .marketgroup h3 { padding: 11px 12px; font-size: 11px; }
    .marketoptions { padding: 7px; gap: 5px; }
    .marketoptions .oddbutton { min-height: 53px; height: 53px; font-size: 14px; }
    .marketoptions .oddlabel { font-size: 10px; }
    .gamelayout > #slip { display: none; }
    .gamelayout > #slip.mobileopen { display: flex; position: fixed; z-index: 30; inset: calc(70px + env(safe-area-inset-top)) 7px calc(70px + env(safe-area-inset-bottom)); height: auto; max-height: calc(100dvh - 140px - env(safe-area-inset-top) - env(safe-area-inset-bottom)); border-radius: 10px; box-shadow: 0 15px 65px #020d0790, 0 0 0 150vmax #020c08a8; }
    #slip .sliphead { min-height: 46px; padding: 12px 14px; font-size: 13px; }
    #slip .sliphead [data-action="toggle-slip"] { display: block; width: 28px; height: 28px; line-height: 1; }
    #slip .sliptabs button { min-height: 40px; padding: 11px 5px 9px; font-size: 11px; }
    .slip-tools { padding: 8px 10px; }
    .slip-tools button { min-height: 30px; padding: 6px 8px; font-size: 10px; }
    .slip-code { padding: 8px 10px; }
    #slip-reservation-form input { height: 35px; font-size: 16px; }
    #slip-reservation-form button { height: 35px; font-size: 11px; }
    .slip-review-note { padding: 8px 11px; font-size: 10px; }
    #slip > .slip-selections { min-height: 52px; }
    #slip .slippick { padding: 11px 13px; }
    #slip .slippick h4 { font-size: 12px; margin-bottom: 5px; }
    #slip .slippick p { font-size: 10px; margin-bottom: 6px; }
    .slip-summary { padding: 11px 13px 12px; }
    .slip-summary .field { margin-bottom: 10px; }
    #slip .slip-summary input { height: 40px; }
    #slip .slipline { margin: 7px 0; font-size: 10px; }
    #slip .slipline.total { padding-top: 9px; font-size: 10px; }
    #slip .slipline.total b { font-size: 22px; }
    #slip .slip-summary .primary { min-height: 42px; padding: 11px 8px; font-size: 12px; }
    #slip .sliphelp { font-size: 9px; margin-top: 7px; }
    #slip .slipticket { margin: 9px 9px 0; padding: 11px; }
    #slip .slipticket .ticket-legline { font-size: 11px; }
    #slip .slipticket .leg-state { font-size: 9px; }
    #slip .slipticket-time { font-size: 9px; }
    #slip .slipticket-money b { font-size: 14px; }
    #slip .slipticket-open { font-size: 10px; }
    .ticket-history { margin: 0 10px; gap: 12px; }
    .played-ticket { gap: 12px; padding: 14px 12px; border-radius: 9px; }
    .played-ticket-head h2 { font-size: 14px; }
    .played-ticket-head time { font-size: 10px; }
    .played-ticket-head .tag { padding: 4px 6px; font-size: 9px; }
    .played-ticket-stats { gap: 10px; }
    .played-ticket-stats dt { font-size: 10px; }
    .played-ticket-stats dd { font-size: 16px; }
    .played-ticket-return dd { font-size: 18px; }
    .played-ticket .ticket-legline { padding: 10px 8px; gap: 8px; font-size: 12px; }
    .played-ticket .leg-state { flex-basis: 59px; font-size: 9px; }
    .played-ticket .leg-match small { font-size: 10px; }
    .played-ticket-actions button { min-height: 42px; padding: 10px; font-size: 11px; }
    .ticket-toolbar { margin: 0 10px 13px; }
    .ticket-toolbar { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
    .ticket-toolbar select { width: 100%; min-height: 38px; max-width: none; font-size: 12px; }
    .ticket-toolbar input { grid-column: 1 / -1; min-height: 38px; font-size: 16px; }
    body:has(#app > .topbar) dialog { width: calc(100% - 18px); max-height: calc(100dvh - 30px); border-radius: 8px; }
    body:has(#app > .topbar) .modalhead { padding: 12px 14px; }
    body:has(#app > .topbar) .modalhead h2 { font-size: 14px; }
    body:has(#app > .topbar) .modalbody:has(.receipt) { padding: 10px; }
    .receipt { padding: 15px 12px; }
    .receipt h2 { font-size: 21px; }
    .receipt .receiptpick { padding: 10px 8px; font-size: 11px; }
    .receipt .receiptpick small { font-size: 9px; }
    .receipt .receiptpick strong { font-size: 11px; }
    .receipt .receiptline { font-size: 11px; }
    .receipt .receiptreturn { font-size: 27px; }
    .receiptactions { margin-top: 11px; gap: 7px; }
    .receiptactions > button, .receiptactions .cashout-available { min-height: 42px; font-size: 11px; }
    .reservation-saved #saved-reservation-code { font-size: 21px; }
    .reservation-review-head { padding: 10px; }
    .reservation-review-head strong { font-size: 14px; }
    .reservation-review-head span { font-size: 10px; }
    .reservation-selection { min-height: 77px; padding: 11px 59px 11px 10px; }
    .reservation-selection h4 { font-size: 11px; margin-bottom: 5px; }
    .reservation-selection p { font-size: 10px; }
    .reservation-selection > strong { top: 11px; right: 10px; font-size: 15px; }
    .reservation-selection small { font-size: 9px; }
    #slip .slip-summary { gap: 7px 9px; }
    #slip .stake-presets button { height: 27px; font-size: 10px; }
  }

  @media (max-width: 360px) {
    #app > .topbar { padding-left: 9px; padding-right: 9px; gap: 5px; }
    .topbar .brand { gap: 5px; font-size: 19px; }
    .topbar .brand img { width: 27px; height: 29px; }
    .topbar .brand small { font-size: 6px; letter-spacing: 2.5px; }
    .topbar .balance { font-size: 11px; }
    .topbar .currency { width: 43px; flex-basis: 43px; font-size: 10px; }
    .sports-toolbar .sportsheading { gap: 7px; padding: 0 8px; }
    .sportsheading h1 { font-size: 15px; }
    .sporttabs button { padding: 0 7px; font-size: 10px; }
    .slipshortcut { padding: 5px; font-size: 8px; }
    .bookrow { grid-template-columns: minmax(0, 1fr) 134px 18px; gap: 4px; padding-left: 8px; padding-right: 4px; }
    .teams { font-size: 10px; }
    .oddbutton { font-size: 12px; }
    .oddbutton.unavailable, .oddbutton.missing { font-size: 11px; }
    .marketrail button { padding-left: 9px; padding-right: 9px; }
    .fixturehero.v2-fixturehero { grid-template-columns: minmax(0, 1fr) 86px minmax(0, 1fr); padding-left: 9px; padding-right: 9px; gap: 7px; }
    .v2-fixturehero .club strong { font-size: 11px; }
    .v2-fixturehero .club img { width: 35px; height: 35px; }
    .v2-fixturehero .bigscore { gap: 8px; font-size: 33px; }
    .played-ticket-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .played-ticket-stats .played-ticket-return { grid-column: 1 / -1; display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding-top: 8px; border-top: 1px solid #36543e; }
    .played-ticket-return dt { margin-bottom: 0; }
    .played-ticket-return dd { font-size: 20px; text-align: right; }
    .played-ticket .leg-state { flex-basis: 54px; font-size: 8px; gap: 4px; }
    .played-ticket .ticket-legline { padding-left: 7px; padding-right: 7px; gap: 7px; }
    #slip .slipticket .leg-state { flex-basis: 54px; font-size: 8px; }
    .mobilebar button { padding-left: 2px; padding-right: 2px; font-size: 9px; }
  }

  @media (max-height: 650px) and (max-width: 660px) {
    .gamelayout > #slip.mobileopen { inset-block-start: calc(65px + env(safe-area-inset-top)); inset-block-end: calc(66px + env(safe-area-inset-bottom)); max-height: calc(100dvh - 131px - env(safe-area-inset-top) - env(safe-area-inset-bottom)); }
    #slip .sliphead { min-height: 40px; padding-top: 8px; padding-bottom: 8px; }
    #slip .sliptabs button { min-height: 35px; padding-top: 8px; padding-bottom: 7px; }
    .slip-tools, .slip-code { padding-top: 6px; padding-bottom: 6px; }
    .slip-summary { padding-top: 9px; padding-bottom: 9px; }
    .slip-summary .field { margin-bottom: 7px; }
    #slip .slip-summary input { height: 35px; }
    #slip .slipline { margin-top: 5px; margin-bottom: 5px; }
    #slip .slipline.total b { font-size: 20px; }
    #slip .sliphelp { font-size: 8px; }
  }

  @media (prefers-reduced-motion: reduce) {
    .oddbutton, .overview-metric { transition: none; }
    .oddbutton.price-up, .oddbutton.price-down { animation: none; }
    .featured-fixtures { scroll-behavior: auto; }
  }
}

@keyframes v2-oddsup { 0% { background: #547b38; } 100% { background: #2d4531; } }
@keyframes v2-oddsdown { 0% { background: #744b35; } 100% { background: #2d4531; } }

@media screen{.overview-collapsed{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:7px 10px;margin-bottom:8px;border:1px solid #2b4636;border-radius:6px;background:#14271d;color:#8dab98;font-size:10px}.overview-collapsed button{padding:5px 8px;border:0;background:#264632;color:#d5e8da;font-size:10px;font-weight:500}.day-count{font-size:9px;color:#9fbeaa;font-variant-numeric:tabular-nums}.daybar .active .day-count{color:#f7df84}}

@media screen and (min-width:1200px){.featured-fixtures{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media screen and (min-width:901px) and (max-width:1199px){.featured-fixture:nth-child(n+3){display:none}}

/* Discovery refinements keep the next action and the first fixtures close. */
@media screen {
  .sports-overview { padding: 13px 14px; margin-bottom: 12px; }
  .overview-top { align-items: center; margin-bottom: 10px; }
  .overview-kicker { font-size: 8px; letter-spacing: 1.2px; }
  .overview-top h1 { margin: 3px 0 0; font-size: 22px; }
  .overview-top p { display: none; }
  .overview-metrics { gap: 7px; margin-bottom: 10px; }
  .overview-metric { min-height: 38px; padding: 8px 10px; flex-direction: row; align-items: center; justify-content: space-between; gap: 7px; }
  .overview-metric strong { font-size: 18px; }
  .overview-metric span { font-size: 10px; }
  .featured-fixture { padding: 9px 10px; }
  .featured-head { font-size: 9px; }
  .featured-teams { padding: 6px 0 7px; }
  .featured-teamrow { font-size: 12px; line-height: 1.65; }
  .featured-time { margin-top: 3px; font-size: 9px; }
  .featured-odds .oddbutton { height: 34px; }
  .featured-odds .oddlabel { margin-bottom: 2px; font-size: 9px; }
  .match-visibility { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 39px; padding: 5px 10px; border-top: 1px solid #2c4434; background: #12231a; }
  #match-count { min-width: 0; color: #9eb7a6; font-size: 10px; font-variant-numeric: tabular-nums; }
  .match-visibility nav { display: flex; flex-shrink: 0; padding: 2px; gap: 2px; border: 1px solid #36543e; border-radius: 5px; background: #0f2016; }
  .match-visibility button { min-height: 26px; padding: 5px 9px; border: 0; border-radius: 3px; background: transparent; color: #9fbaa8; font-size: 10px; font-weight: 500; }
  .match-visibility button.active { background: #36543b; color: #f8e28d; }
  .match-visibility button:hover { color: #fff1b8; }
  .match-empty button { display: block; margin: 12px auto 0; border-color: #55724e; background: #2c4c33; color: #f2de89; font-size: 11px; }
  .return-note { display: block; margin-top: 3px; color: #9fbaa8; font-size: 9px; font-weight: 400; line-height: 1.4; }
  .receipt .return-note { color: #67806c; }
  .cadence-note { display: block; margin-top: 5px; line-height: 1.5; }
  .reservation-expiry { margin: 8px 0 13px; color: #779680; font-size: 11px; line-height: 1.5; }
  .reservation-saved .reservation-expiry { color: #50715b; }
}
@media screen and (max-width: 660px) {
  .sports-overview { padding: 10px 11px 11px; margin-bottom: 0; }
  .overview-top { margin-bottom: 9px; }
  .overview-top h1 { font-size: 21px; }
  .overview-top .overview-saved { min-height: 29px; padding: 6px 8px; font-size: 9px; }
  .overview-metrics { margin-bottom: 9px; gap: 5px; }
  .overview-metric { min-height: 36px; padding: 7px 8px; gap: 4px; }
  .overview-metric span { font-size: 9px; }
  .overview-metric strong { font-size: 17px; }
  .featured-fixture { padding: 8px 9px; }
  .featured-odds .oddbutton { height: 32px; font-size: 12px; }
  .match-visibility { min-height: 37px; padding: 4px 8px; gap: 7px; }
  .match-visibility button { min-height: 25px; padding: 5px 7px; font-size: 9px; }
  #match-count { font-size: 9px; }
  #slip .return-note { max-width: 155px; font-size: 8px; }
}
@media screen and (max-width: 350px) {
  .overview-top h1 { font-size: 19px; }
  .overview-top .overview-saved { font-size: 8px; padding-left: 6px; padding-right: 6px; }
  .overview-metric { padding-left: 6px; padding-right: 6px; }
  .overview-metric span { font-size: 8px; }
  .overview-metric strong { font-size: 15px; }
}

@media screen and (max-height:650px) and (max-width:660px){#slip > .slip-selections{min-height:0}.slip-review-note{padding-top:6px;padding-bottom:6px;line-height:1.4}}

@media screen {
  .reservation-disclosure { border-bottom: 1px solid #31513a; background: #12271a; }
  #slip .reservation-toggle { display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:34px;padding:7px 11px;border:0;border-radius:0;background:transparent;color:#a6c6ae;font-size:10px;font-weight:500;text-align:left; }
  #slip .reservation-toggle:hover { color:#f7df8d;background:#1c3825; }
  #slip .reservation-toggle span { color:#e5d27e;font-size:15px;line-height:1; }
  #reservation-panel[hidden] { display:none; }
  .reservation-disclosure .slip-code { border-bottom:0; }
  .client-transfers { margin: 18px 0; scroll-margin-top: 14px; overflow:hidden; }
  .transfer-history-head { display:flex;align-items:center;justify-content:space-between;gap:15px;padding:18px 20px;border-bottom:1px solid #36543e;background:#1d3627; }
  .transfer-history-head h2 { margin:0 0 5px;color:#edf4ee;font-size:18px;font-weight:600; }
  .transfer-history-head p { color:#a2bdaa;margin:0;font-size:11px;line-height:1.5; }
  .transfer-history-head button { flex-shrink:0;padding:8px 10px;font-size:11px; }
  .transfer-history-filter { display:flex;align-items:center;gap:12px;padding:11px 20px;background:#14291c;border-bottom:1px solid #304e38; }
  .transfer-history-filter label { margin:0;color:#a5bfae;font-size:11px; }
  .transfer-history-filter select { width:auto;min-width:165px;padding:8px 10px;background:#102219;border-color:#416348;color:#d8e9de;font-size:12px; }
  .transfer-row { display:flex;align-items:flex-start;gap:13px;padding:16px 20px;border-bottom:1px solid #304a37;background:#172d20; }
  .transfer-row:nth-child(even) { background:#1e3526; }
  .transfer-icon { display:grid;place-items:center;width:32px;height:32px;flex:0 0 auto;border-radius:8px;background:#264c35;color:#a3e0b5;font-size:19px; }
  .transfer-out .transfer-icon { background:#483e27;color:#e5c991; }
  .transfer-icon svg { display:block;width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round; }
  .transfer-description { min-width:0;flex:1; }
  .transfer-description h3 { margin:0 0 5px;color:#e2eee5;font-size:12px;font-weight:500; }
  .transfer-description p { margin:0 0 5px;color:#a2b9aa;font-size:10px;line-height:1.5; }
  .transfer-description small { display:block;color:#819f8a;font-size:9px;line-height:1.5;overflow-wrap:anywhere; }
  .transfer-description .mono { color:#acc5b4; }
  .transfer-amount { flex:0 0 auto;text-align:right;color:#9fe0b6;font-size:15px;font-weight:600;white-space:nowrap; }
  .transfer-out .transfer-amount { color:#ecd297; }
  .transfer-amount small { display:block;margin-top:5px;color:#8faa98;font-size:9px;font-weight:400; }
  .transfer-pagination { display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 18px;background:#13271b; }
  .transfer-pagination button { min-height:34px;padding:7px 10px;font-size:11px; }
  .transfer-pagination span { color:#9bb6a3;font-size:10px; }
  .transfer-empty { font-size:12px;background:#172d20;color:#a2bfac; }
  .transfer-empty strong { color:#dae9df; }
  .transfer-empty button { display:block;margin:12px auto 0; }
}
@media screen and (max-width:660px) {
  /* The drawer owns the viewport so the selections receive the available space. */
  .gamelayout > #slip.mobileopen { inset:calc(6px + env(safe-area-inset-top)) 6px calc(6px + env(safe-area-inset-bottom));max-height:calc(100dvh - 12px - env(safe-area-inset-top) - env(safe-area-inset-bottom));border-radius:9px; }
  #slip .sliphead { min-height:39px;padding:5px 11px;font-size:12px; }
  #slip .sliphead [data-action="toggle-slip"] { width:32px;height:32px; }
  #slip .sliptabs button { min-height:34px;padding:8px 5px 7px;font-size:10px; }
  #slip .slip-tools { min-height:37px;padding:3px 9px;gap:6px; }
  #slip .slip-tools button { min-height:30px;padding:5px 8px;font-size:10px; }
  #slip .reservation-toggle { min-height:31px;padding:7px 10px;font-size:10px; }
  #slip .reservation-disclosure .slip-code { padding:6px 10px 8px; }
  #slip .slip-review-note { padding:6px 10px;font-size:9px;line-height:1.35; }
  #slip > .slip-selections { min-height:0; }
  #slip .slip-selections > .slippick { display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:4px 10px;padding:9px 11px; }
  #slip .slip-selections .slippick h4 { grid-column:1/-1;margin:0 27px 1px 0;font-size:11px;line-height:1.4; }
  #slip .slip-selections .slippick p { margin:0;font-size:10px;line-height:1.4; }
  #slip .slip-selections .slippick strong { font-size:14px;line-height:1.3; }
  #slip .slip-selections .slippick small { grid-column:1/-1; }
  #slip .slip-selections .slippick .remove { top:5px;right:4px;width:30px;height:30px; }
  #slip .slip-summary { grid-template-columns:minmax(98px,.9fr) minmax(0,1.2fr);gap:6px 10px;padding:8px 11px;align-items:center; }
  #slip .slip-summary .field { grid-column:1;grid-row:1;margin:0; }
  #slip .slip-summary label { margin-bottom:4px;font-size:10px; }
  #slip .slip-summary input { height:40px;padding:8px 10px;font-size:16px; }
  #slip .slip-summary .stake-presets { display:none; }
  #slip .slip-summary .slipline { margin:0;font-size:9px;line-height:1.3;gap:3px; }
  #slip .slip-summary .slipline.total { grid-column:2;grid-row:1;display:flex;flex-direction:column;align-items:flex-end;text-align:right;justify-content:center;border:0;padding:0;gap:4px; }
  #slip .slip-summary .slipline.total b { font-size:22px;line-height:1.1; }
  #slip .slip-summary .return-note { max-width:none;margin-top:2px;font-size:8px;line-height:1.2; }
  #slip .slip-summary .primary { min-height:44px;margin:0;padding:10px 8px;font-size:12px; }
  #slip .slip-summary .sliphelp { display:none; }
  #slip .slip-summary.slipemptyfoot { padding:12px; }
  .transfer-history-head { padding:14px 12px;gap:10px; }
  .transfer-history-head h2 { font-size:16px; }
  .transfer-history-head p { font-size:10px; }
  .transfer-history-head button { padding:7px 9px;font-size:10px; }
  .transfer-history-filter { padding:9px 12px;gap:10px; }
  .transfer-history-filter select { min-width:0;flex:1;font-size:12px; }
  .transfer-row { gap:9px;padding:13px 12px; }
  .transfer-icon { width:27px;height:27px;border-radius:6px;font-size:17px; }
  .transfer-description h3 { font-size:11px; }
  .transfer-description p { font-size:9px; }
  .transfer-description small { font-size:8px; }
  .transfer-amount { font-size:13px; }
  .transfer-pagination { padding:10px 12px; }
}

/* Hierarchical administration: shared workspace, scoped controls and reports. */
.admin-hierarchy{display:flex;align-items:center;gap:10px;padding:13px 16px;margin:0 0 18px;background:#163e2b;border:1px solid #3c6346;border-radius:6px;color:#a9c0aa;font-size:12px;overflow:auto}
.admin-hierarchy span{white-space:nowrap}.admin-hierarchy i{font-style:normal;color:#67896b}.admin-hierarchy .current{color:#f4da73;font-weight:700}
.admin-role{display:inline-block;font-size:11px;color:#bbd3bb}.admin-role.manager{color:#f0d280}.admin-role.agent{color:#8ed5b4}
.admin-permissions-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:12px 0 18px}
.admin-permission{display:flex!important;align-items:flex-start;gap:9px;padding:10px 11px;margin:0!important;border:1px solid #47664a;border-radius:5px;background:#203d2a;color:#dbe5d5;font-size:11px;cursor:pointer}
.admin-permission input{flex:0 0 auto;width:16px!important;height:16px;margin:0;accent-color:#e4cc66}.admin-permission span{min-width:0;line-height:1.4}.admin-permission small{display:block;color:#a0b499;margin-top:4px}
.admin-create-permissions{border:1px solid #466245;border-radius:5px;padding:10px 12px;margin:12px 0}.admin-create-permissions[hidden]{display:none}.admin-create-permissions legend{font-size:11px;color:#d7deb9;padding:0 5px}.admin-create-permissions .admin-permissions-grid{margin:4px 0 10px}
.admin-report-presets{display:flex;align-items:center;flex-wrap:wrap;gap:7px;margin-bottom:12px}.admin-report-presets button{font-size:11px;padding:7px 10px}.admin-report-presets span{margin-left:auto;font-size:10px;color:#a6bba2}
.admin-report-controls{padding:15px;margin-bottom:18px}.admin-report-filters{display:grid;grid-template-columns:repeat(2,minmax(125px,1fr)) minmax(95px,.7fr) minmax(75px,.55fr) minmax(150px,1.4fr) auto;align-items:end;gap:10px}
.admin-report-filters .field{margin:0}.admin-report-filters input,.admin-report-filters select{min-width:0;width:100%;height:38px;padding:7px 9px;font-size:11px;color-scheme:dark}.admin-report-filters>button{min-height:38px;white-space:nowrap;font-size:11px}.admin-report-filters>.error{grid-column:1/-1;margin:0}.admin-report-filters>.error:empty{display:none}
.admin-report-table{font-variant-numeric:tabular-nums}.admin-report-table thead th{font-size:9px;text-transform:none;letter-spacing:.2px;white-space:nowrap}.admin-report-table thead tr:first-child th[colspan]{text-align:center;border-bottom:1px solid #456346;background:#203e2a}.admin-report-table tbody td{white-space:nowrap;font-size:11px}.admin-report-table tbody td:first-child{white-space:normal;min-width:105px}.admin-report-table .admin-report-casino{color:#92a38b}.admin-unavailable{color:#8fa188!important}
@media(max-width:1100px){.admin-report-filters{grid-template-columns:repeat(4,minmax(0,1fr))}.admin-report-filters .report-branch{grid-column:span 2}.admin-report-filters>button{grid-column:span 2}}
@media(max-width:660px){.admin-hierarchy{gap:7px;padding:11px 12px;font-size:10px;margin-bottom:12px}.admin-permissions-grid{grid-template-columns:1fr}.admin-report-controls{padding:11px}.admin-report-filters{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.admin-report-filters .report-branch,.admin-report-filters>button{grid-column:span 2}.admin-report-presets{gap:5px}.admin-report-presets button{font-size:10px;padding:7px}.admin-report-presets span{width:100%;margin:1px 0 2px}.admin-report-table thead th{font-size:9px}.admin-users-table .actions{gap:4px;min-width:115px;justify-content:flex-end;flex-wrap:wrap}}

@media screen and (max-width:660px){
 .admin-users-table{display:block;width:100%;min-width:0;table-layout:fixed;border-collapse:separate}
 .admin-users-table thead{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap;border:0}
 .admin-users-table tbody{display:grid;width:100%;gap:10px;padding:10px;background:#14291e}
 .admin-users-table tbody tr{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 10px;width:100%;min-width:0;padding:12px;border:1px solid #426149;border-radius:6px;background:#203d2b}
 .admin-users-table tbody tr:nth-child(even){background:#24432f}
 .admin-users-table tbody td{display:block;min-width:0;max-width:none;width:auto;height:auto;margin:0;padding:5px 0;border:0;white-space:normal;overflow-wrap:anywhere;vertical-align:top;font-size:12px}
 .admin-users-table tbody td:first-child{grid-column:1/-1;padding:0 0 9px;border-bottom:1px solid #426149;margin-bottom:5px}
 .admin-users-table tbody td:first-child .name{font-size:14px}.admin-users-table tbody td small{font-size:11px;line-height:1.5}
 .admin-users-table tbody td:nth-child(2)::before,.admin-users-table tbody td:nth-child(3)::before{display:block;margin-bottom:5px;font-family:inherit;font-size:9px;letter-spacing:.4px;color:#a3b89e}
 .admin-users-table tbody td:nth-child(2)::before{content:'ROLI / PRINDI'}.admin-users-table tbody td:nth-child(3)::before{content:'BILANCI'}
 .admin-users-table tbody td:nth-child(3){text-align:right;align-self:start;font-size:14px}
 .admin-users-table tbody td:nth-child(4){grid-column:1/-1;padding:6px 0 9px}
 .admin-users-table tbody td:last-child{grid-column:1/-1;padding:10px 0 0;border-top:1px solid #426149}
 .admin-users-table .actions{display:flex;align-items:center;justify-content:flex-start;flex-wrap:wrap;width:100%;min-width:0;gap:6px}
 .admin-users-table .actions button{min-height:38px;max-width:100%;padding:8px 10px;font-size:12px;line-height:1.3;white-space:normal}
}

/* The full fixture inventory stays searchable while the visible list grows locally. */
#matches>.match-more{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px;padding:16px;border-top:1px solid #526b58}
#matches>.match-more>button{min-height:40px;padding:9px 16px}
#matches>.match-more>span{font-size:11px}

/* Scoped, read-only authentication history. */
.security-log-controls{padding:16px;margin-bottom:14px}
.security-log-filters{display:grid;grid-template-columns:repeat(2,minmax(125px,.8fr)) minmax(160px,1.2fr) minmax(170px,1.3fr) minmax(155px,1.1fr) auto;gap:11px;align-items:end}
.security-log-filters .field{margin:0;min-width:0}.security-log-filters label{font-size:11px}.security-log-filters input,.security-log-filters select{width:100%;min-width:0;height:40px;padding:8px 9px;font-size:12px;color-scheme:dark}.security-log-filters>button{min-height:40px}.security-log-filters>.error{grid-column:1/-1;margin:0}.security-log-filters>.error:empty{display:none}
.security-log-notes{display:grid;gap:6px;margin:0 0 18px;padding-left:12px;border-left:2px solid #7d9c80;color:#aec1aa;font-size:11px;line-height:1.6}.security-log-notes p{margin:0}
.security-log-results{overflow:hidden}.security-log-results .panelhead{gap:12px;flex-wrap:wrap}.security-log-table{table-layout:fixed;width:100%;min-width:720px}.security-log-table th{font-size:10px;letter-spacing:.3px}.security-log-table td{vertical-align:top;overflow-wrap:anywhere;font-size:12px;line-height:1.55;width:25%;padding:15px 16px}.security-log-table td small,.security-log-person small,.security-log-device small{display:block;margin-top:4px;color:#a7bba4;line-height:1.5}.security-log-table td time{display:block;margin-bottom:8px;color:#d0deca}.security-ip-source{font-size:9px!important;opacity:.8}
.security-event{display:inline-block;border:1px solid #55735a;background:#284d35;border-radius:20px;padding:4px 9px;font-size:10px;line-height:1.4;color:#d4dfd0}.security-event.success{border-color:#4a8963;background:#224f37;color:#b6e4c8}.security-event.warning{border-color:#a57952;background:#513e2b;color:#f0cf9d}
.security-log-results details{margin-top:8px;font-size:10px;color:#adc1a8}.security-log-results summary{cursor:pointer;text-decoration:underline;text-underline-offset:3px}.security-log-results details p{white-space:normal;overflow-wrap:anywhere;margin:8px 0 0;color:#a2b39f}
.security-log-pagination{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;border-top:1px solid #416047;background:#193824}.security-log-pagination button{min-height:38px;font-size:12px}.security-log-pagination span{text-align:center;color:#aec0aa;font-size:11px}.security-log-pagination button:disabled{opacity:.4;cursor:default}
.security-log-cards{display:none}
@media(max-width:1200px){.security-log-filters{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){.security-log-controls{padding:12px}.security-log-filters{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.security-log-filters .security-log-branch{grid-column:1/-1}.security-log-filters>button{grid-column:1/-1}.security-log-filters input,.security-log-filters select{font-size:13px;height:43px}.security-log-filters>button{min-height:43px}.security-log-desktop{display:none}.security-log-cards{display:grid;padding:10px;gap:10px;background:#142d1f}.security-log-card{min-width:0;border:1px solid #43664c;background:#203f2b;border-radius:7px;padding:13px;overflow-wrap:anywhere}.security-log-card header{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:13px}.security-log-card time{font-size:10px;color:#b7cbb1;text-align:right}.security-log-person{padding-bottom:10px;border-bottom:1px solid #426149}.security-log-person strong{font-size:14px}.security-log-card dl{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;margin:12px 0}.security-log-card dt{font-size:9px;text-transform:uppercase;letter-spacing:.5px;color:#a2b59c;margin-bottom:5px}.security-log-card dd{margin:0;font-size:12px;line-height:1.5}.security-log-card dd small{display:block;font-size:10px;color:#a7bba4}.security-log-device{border-top:1px solid #426149;padding-top:11px;font-size:12px}.security-log-device small{font-size:10px}.security-log-notes{font-size:10px}.security-log-pagination{padding:12px 10px;gap:6px}.security-log-pagination button{padding:8px 10px}.security-log-pagination span{font-size:10px}.security-log-results .panelhead{padding:13px}.security-log-results .panelhead small{font-size:10px}}