/* A brighter, more legible layer for the existing Spezi interface. */
:root {
  --ink: #29291f;
  --muted: #77786e;
  --orange: #ee7839;
  --orange-dark: #ce5b29;
  --cream: #f7f5ef;
  --line: #e8e7df;
  --pale: #fff2e6;
  --green: #84996d;
  --serif: Georgia, 'Times New Roman', serif;
  --sans: 'DM Sans', 'Segoe UI', sans-serif;
  --display: 'Manrope', 'Segoe UI', sans-serif;
  --surface: #fff;
  --sidebar: #292d26;
  --shadow-soft: 0 12px 34px rgb(43 38 27 / 6%);
  --shadow-raised: 0 18px 50px rgb(43 38 27 / 10%);
}

html { scroll-behavior: smooth; }
body { background: var(--cream); color: var(--ink); }
button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 3px solid rgb(238 120 57 / 35%);
  outline-offset: 3px;
}

/* Sign-in page */
.landing-view {
  position: relative;
  max-width: 1560px;
  padding-inline: clamp(24px, 7vw, 112px);
  background:
    radial-gradient(ellipse at 82% 38%, rgb(246 194 133 / 11%), transparent 32%),
    linear-gradient(135deg, #fcfbf7 0%, #f8f4eb 100%);
}
.landing-nav { height: 88px; border-bottom: 1px solid rgb(96 76 48 / 9%); }
.brand { gap: 12px; font-size: 26px; letter-spacing: -1.5px; }
.brand-mark {
  width: 37px;
  height: 37px;
  border-radius: 13px 13px 13px 5px;
  background: linear-gradient(145deg, #f39954, #df662e);
  box-shadow: 0 7px 17px rgb(210 99 43 / 24%);
}
.button {
  min-height: 44px;
  border-radius: 11px;
  padding: 12px 18px;
  gap: 16px;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease;
}
.button:hover { transform: translateY(-2px); }
.button-dark { background: #292d26; box-shadow: 0 7px 18px rgb(41 45 38 / 12%); }
.button-dark:hover { background: #3a4035; box-shadow: 0 10px 22px rgb(41 45 38 / 20%); }
.button-orange { background: linear-gradient(135deg, #f28a4a, #e66d34); box-shadow: 0 9px 20px rgb(225 104 48 / 20%); }
.button-orange:hover { background: linear-gradient(135deg, #e97c3c, #d75e29); box-shadow: 0 12px 25px rgb(225 104 48 / 27%); }
.hero-wrap { grid-template-columns: minmax(0, .94fr) minmax(420px, 1.06fr); gap: clamp(34px, 5vw, 76px); min-height: 600px; }
.hero-copy { padding: 34px 0 50px; }
.eyebrow { color: #756e60; font-size: 11px; letter-spacing: 1.45px; }
.eyebrow i { background: #8b9f71; box-shadow: 0 0 0 5px #e8eddf; }
.hero-copy h1 { max-width: 650px; font-size: clamp(58px, 6.7vw, 92px); letter-spacing: -5.5px; line-height: .96; margin: 25px 0 24px; }
.hero-copy h1 em { color: #e36c32; }
.hero-copy p { max-width: 475px; color: #6e6d62; font-size: 16px; line-height: 1.85; }
.hero-note { color: #77776c; font-size: 12px; }
.local-preview-note { max-width: 475px; margin-top: 18px; padding: 12px 14px; border: 1px solid #ead8c5; border-left: 3px solid #e47a40; border-radius: 10px; background: #fffaf3; color: #6f6659; font-size: 12px; line-height: 1.6; }
.local-preview-note a { color: #bd572e; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.avatar-stack b { border-color: #faf7f0; }
.hero-art {
  height: 490px;
  overflow: hidden;
  border: 1px solid rgb(255 255 255 / 76%);
  border-radius: 38px;
  background:
    radial-gradient(ellipse at 56% 38%, rgb(255 255 255 / 50%), transparent 44%),
    linear-gradient(145deg, #f5d4a9 0%, #f2c185 54%, #e9aa70 100%);
  box-shadow: 0 26px 70px rgb(121 75 40 / 11%), inset 0 1px 0 rgb(255 255 255 / 80%);
}
.hero-art::before {
  content: 'MADE FOR YOUR SERVER';
  position: absolute;
  z-index: 2;
  top: 23px;
  left: 24px;
  padding: 9px 12px;
  border: 1px solid rgb(255 255 255 / 70%);
  border-radius: 999px;
  background: rgb(255 250 244 / 68%);
  color: #765d43;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 1.1px;
  backdrop-filter: blur(8px);
}
.sunburst { right: 14%; top: 9%; background: #f5b56f; box-shadow: 0 0 0 1px #f5b56f; }
.glass { box-shadow: inset 8px 0 16px #ffd48266, inset -9px 0 15px #bb3b2650, 0 34px 46px #81452d44; }
.drink-shadow { filter: blur(14px); background: #9d4d2d55; }
.art-caption {
  right: 20px;
  bottom: 22px;
  padding: 13px 16px;
  border: 1px solid rgb(255 255 255 / 72%);
  border-radius: 13px;
  background: rgb(255 250 244 / 72%);
  box-shadow: 0 9px 25px rgb(87 55 31 / 8%);
  backdrop-filter: blur(8px);
}
.art-caption strong { color: #8a6039; }
.scribble { left: 11%; bottom: 92px; color: #fffaf2; text-shadow: 0 2px 12px rgb(102 62 34 / 18%); }
.landing-foot { border-color: rgb(96 76 48 / 12%); color: #8d887c; padding-block: 21px 26px; }

/* Signed-in application */
.app-shell { grid-template-columns: 264px minmax(0, 1fr); background: #f5f5f1; }
.sidebar {
  z-index: 4;
  background: var(--sidebar);
  border: 0;
  padding: 26px 17px 18px;
  box-shadow: 7px 0 30px rgb(31 35 29 / 5%);
}
.side-brand { color: #fffaf2; padding: 0 11px 31px; }
.side-brand .brand-mark { box-shadow: 0 5px 15px rgb(222 103 47 / 28%); }
.server-picker { background: #343a31; border: 1px solid rgb(255 255 255 / 8%); border-radius: 13px; margin-bottom: 30px; }
.server-icon { background: linear-gradient(145deg, #f4a45b, #dd6d35); }
.server-picker small { color: #a7ad9d; }
.server-picker select { color: #f6f2e9; }
.server-picker select option { color: #29291f; }
.chevron { color: #c4c8bc; }
.nav-label { color: #92998b; padding: 0 13px 10px; }
.main-nav { gap: 5px; }
.nav-link {
  min-height: 43px;
  border-radius: 11px;
  color: #c1c5b9;
  padding: 11px 13px;
  font-size: 12px;
  font-weight: 600;
  transition: color .16s ease, background .16s ease, transform .16s ease;
}
.nav-link > span { color: #a3aa9a; }
.nav-link:hover { background: #363d33; color: #fffaf2; transform: translateX(2px); }
.nav-link:hover > span { color: #f3a05d; }
.nav-link.active { background: #41483b; color: #ffd7b4; box-shadow: inset 3px 0 #ef8547; }
.nav-link.active > span { color: #f39b5a; }
.sidebar-tip { border: 1px solid rgb(255 255 255 / 7%); background: #32382f; border-radius: 12px; padding: 14px; color: #f3a05d; }
.sidebar-tip p { color: #b6bbad; font-size: 10px; }
.sidebar-tip b { color: #f0eee5; }
.logout-button { color: #aeb4a7; border-radius: 9px; }
.logout-button:hover { background: #363d33; color: #ffd7b4; }
.main-content {
  position: relative;
  max-width: 1600px;
  padding: 0 clamp(26px, 5vw, 76px);
  background:
    radial-gradient(ellipse at 90% 0%, rgb(237 225 203 / 18%), transparent 28%),
    #f7f7f4;
}
.topbar {
  position: sticky;
  top: 0;
  z-index: 3;
  height: 78px;
  margin-bottom: 36px;
  border-bottom: 1px solid rgb(216 214 204 / 65%);
  background: rgb(247 247 244 / 86%);
  backdrop-filter: blur(14px);
}
.crumb { color: #8e9084; font-size: 9px; letter-spacing: 1.35px; }
.crumb-divider { color: #c0c0b5; }
.page-name { color: #383a30; font-size: 12px; }
.top-user { gap: 10px; min-height: 40px; padding: 4px 11px 4px 5px; border: 1px solid #e8e8e0; border-radius: 999px; background: #fff; color: #424338; }
.top-user img { width: 30px; height: 30px; }
.user-dot { background: #7b9a66; box-shadow: 0 0 0 3px #edf2e7; }
.page { padding-bottom: 8px; }
.page-heading { align-items: center; gap: 18px; margin-bottom: 27px; }
.page-heading h1 { color: #2e3027; font-size: clamp(28px, 3vw, 36px); line-height: 1.12; letter-spacing: -1.7px; margin: 8px 0 7px; }
.page-heading h2 { color: #2e3027; font: 800 clamp(24px, 2.5vw, 32px)/1.1 var(--display); letter-spacing: -1.2px; margin: 8px 0 7px; }
.page-heading p { color: #77796d; font-size: 13px; line-height: 1.6; }
.overline { color: #d16b35; font-size: 9px; letter-spacing: 1.3px; }
.button { font-weight: 700; }
.button-small { min-height: 39px; padding: 10px 14px; border-radius: 10px; font-size: 11px; }
.button-light { border-color: #e6e5dd; background: #fff; box-shadow: 0 2px 5px rgb(31 35 29 / 3%); }
.button-light:hover { border-color: #dfb594; background: #fffaf5; }

.stats-grid { gap: 16px; margin-bottom: 20px; }
.stat-card {
  min-height: 132px;
  padding: 21px 22px;
  border: 1px solid #e9e8e0;
  border-radius: 16px;
  background: linear-gradient(145deg, #fff, #fefdfa);
  box-shadow: var(--shadow-soft);
}
.stat-card::before { content: ''; position: absolute; top: 0; left: 20px; right: 20px; height: 3px; border-radius: 0 0 3px 3px; background: #ef9c64; }
.stat-card:nth-child(2)::before { background: #8da477; }
.stat-card:nth-child(3)::before { background: #e7bd63; }
.stat-card::after { width: 110px; height: 110px; right: -32px; bottom: -47px; background: #fff3e6; }
.stat-card:nth-child(2)::after { background: #eff3e8; }
.stat-card:nth-child(3)::after { background: #faf2dc; }
.stat-top { color: #77796e; font-size: 11px; }
.stat-icon { position: relative; z-index: 1; color: #d77945; }
.stat-value { position: relative; z-index: 1; color: #303127; font-size: 30px; letter-spacing: -1.5px; margin-top: 15px; }
.stat-value small { color: #87897d; font-size: 13px; }
.content-grid { grid-template-columns: minmax(0, 1.42fr) minmax(260px, .88fr); gap: 18px; }
.panel {
  margin-bottom: 18px;
  padding: 21px 22px;
  border: 1px solid #e9e8e0;
  border-radius: 16px;
  background: rgb(255 255 255 / 94%);
  box-shadow: var(--shadow-soft);
}
.panel-head { gap: 14px; margin-bottom: 17px; }
.panel-head h2 { color: #36372e; font-size: 14px; letter-spacing: -.25px; }
.panel-head a, .text-link { color: #cf6731; font-size: 10px; letter-spacing: .3px; }
.panel-head a:hover, .text-link:hover { color: #9b4625; }
.submission-row { grid-template-columns: 40px minmax(0, 1fr) auto; gap: 12px; padding: 14px 3px; border-color: #f0efe9; }
.submission-row:hover { background: linear-gradient(90deg, rgb(255 246 237 / 50%), transparent); }
.drink-icon { width: 38px; height: 38px; border-radius: 12px; font-size: 18px; }
.row-title { color: #38392f; font-size: 12px; }
.row-sub { color: #898b80; font-size: 10px; line-height: 1.5; }
.row-amount { color: #35362d; font-size: 12px; }
.row-amount small { color: #85877c; }
.rank-card {
  position: relative;
  overflow: hidden;
  border: 0;
  background: linear-gradient(145deg, #333b30 0%, #292f27 58%, #40352b 100%);
  box-shadow: 0 18px 36px rgb(39 44 35 / 15%);
}
.rank-card::after { width: 200px; height: 200px; right: -60px; bottom: -100px; background: rgb(235 153 83 / 14%); }
.rank-card .panel-head h2 { color: #fbf7ec; }
.rank-card .panel-head a { color: #f6b57f !important; }
.rank-big { font-size: 54px; color: #fff8ed; }
.rank-big small { color: #c8c9bd; }
.rank-note { color: #c6c6b9; }
.mini-bars i { background: linear-gradient(180deg, #ffc079, #ec8447); }
.type-chip { padding: 8px 11px; border-color: #ecebe4; border-radius: 9px; background: #f8f8f3; color: #686a5f; font-size: 10px; }
.type-chip b { color: #34362d; }

/* Forms, filters, tables, and settings */
.wide-panel { min-height: 270px; }
.toolbar { gap: 10px; margin-bottom: 18px; }
.field, .select-field, .textarea {
  min-height: 42px;
  border-color: #e4e4dc;
  border-radius: 10px;
  background: #fff;
  padding: 10px 12px;
  color: #37382f;
  font-size: 12px;
  transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
.field::placeholder, .textarea::placeholder { color: #a3a49a; }
.field:focus, .select-field:focus, .textarea:focus { border-color: #e9a176; box-shadow: 0 0 0 4px rgb(238 120 57 / 11%); }
.textarea { min-height: 104px; line-height: 1.55; }
.toolbar .field { min-width: 210px; }
.form-card { max-width: 760px; }
.form-grid { gap: 17px; }
.form-field { gap: 8px; }
.form-field label { color: #5f6056; font-size: 11px; }
.form-actions { align-items: center; gap: 10px; margin-top: 22px; }
.file-hint { color: #85877d; font-size: 10px; line-height: 1.55; }
.toggle-row { gap: 16px; padding: 15px 0; border-color: #efeee8; color: #43443a; font-size: 12px; }
.toggle-row small { color: #888a7f; font-size: 10px; line-height: 1.5; }
.toggle { width: 18px; height: 18px; accent-color: #e5773c; cursor: pointer; }
.data-table { min-width: 680px; }
.data-table th { padding: 13px 10px; border-color: #eae9e2; color: #84867b; font-size: 9px; letter-spacing: .85px; }
.data-table td { padding: 14px 10px; border-color: #efeee9; color: #4a4b40; font-size: 11px; line-height: 1.45; }
.data-table tr:hover td { background: #fbfaf6; }
.status-pill { display: inline-flex; align-items: center; min-height: 22px; padding: 4px 9px; font-size: 9px; letter-spacing: .15px; }
.status-approved { background: #edf3e8; color: #587343; }
.status-pending { background: #fff2df; color: #a36a1f; }
.status-rejected, .status-deleted { background: #faeae7; color: #a34e47; }
.row-actions { flex-wrap: wrap; }
.icon-button { min-height: 30px; border-color: #e8e6de; border-radius: 8px; background: #fff; padding: 6px 9px; color: #66675d; }
.icon-button:hover { border-color: #e5a67a; background: #fff8f2; color: #a64e28; }
.community-pagination { flex-wrap: wrap; margin-top: 18px; }
.community-pagination .button { min-height: 36px; }
.profile-link { color: #4e5f3f; text-decoration-color: #a7b596; }
.profile-link:hover { color: #bd5b2d; }
.admin-tabs { gap: 8px; margin-bottom: 19px; border-color: #e4e4dc; overflow-x: auto; }
.admin-tabs button { flex: 0 0 auto; padding: 12px 13px; color: #7c7e73; font-size: 10px; letter-spacing: .35px; }
.admin-tabs button.active { color: #b6552b; border-color: #e77b42; }
.podium { gap: 12px; margin: 22px auto 26px; }
.podium-card { padding: 19px 12px 16px; border-color: #ecebe4; border-radius: 14px; box-shadow: 0 7px 20px rgb(43 38 27 / 4%); }
.podium-card:first-child { transform: translateY(12px); }
.podium-card:nth-child(2) { background: linear-gradient(150deg, #fff8ed, #fff3e4); border-color: #f0d4ba; }
.podium-card b { color: #393a30; font-size: 12px; }
.leader-row { min-height: 47px; border-color: #efeee8; color: #4b4c41; font-size: 12px; }
.leader-score { color: #3a3b31; }
.empty-state { padding: 42px 14px; color: #85877d; line-height: 1.6; }
.empty-state span { color: #e2874c; }
.app-footer { border-color: #e1e1d9; color: #898b80; font-size: 9px; }
.toast { border: 1px solid rgb(255 255 255 / 12%); border-radius: 12px; box-shadow: 0 14px 34px rgb(31 35 29 / 18%); }

/* Details and editor dialog */
.detail-dialog {
  width: min(760px, calc(100vw - 32px));
  max-height: min(88vh, 900px);
  border: 1px solid #e9e5da;
  border-radius: 22px;
  padding: clamp(22px, 4vw, 34px);
  background: #fffefa;
  box-shadow: 0 30px 100px rgb(31 29 23 / 26%);
}
.detail-dialog::backdrop { background: rgb(31 35 29 / 55%); backdrop-filter: blur(5px); }
.detail-close { z-index: 2; width: 36px; height: 36px; background: #f3f1e9; color: #4f5045; }
.detail-close:hover { background: #ebe8dd; }
.detail-image { border: 1px solid #edebe3; background: #f8f6ef; }
.detail-facts { gap: 10px; color: #66685d; }
.detail-comment { border-color: #e88950; border-radius: 0 10px 10px 0; background: #fff7ef; color: #53544a; }
.detail-fields div { border-color: #eeede6; }
.detail-fields dt { color: #77796e; }
.detail-history { border: 1px solid #ecebe4; background: #f8f8f3; }
.detail-history pre { color: #53544b; line-height: 1.6; }

@media (max-width: 1100px) {
  .app-shell { grid-template-columns: 230px minmax(0, 1fr); }
  .main-content { padding-inline: 30px; }
  .content-grid { grid-template-columns: minmax(0, 1.2fr) minmax(230px, .8fr); }
  .hero-wrap { grid-template-columns: minmax(0, .95fr) minmax(360px, 1.05fr); }
  .hero-copy h1 { font-size: clamp(56px, 6.4vw, 76px); }
}

@media (max-width: 760px) {
  .landing-view { padding-inline: 22px; }
  .landing-nav { height: 74px; }
  .landing-nav .button { min-height: 40px; padding: 10px 13px; font-size: 11px; gap: 9px; }
  .hero-wrap { min-height: 0; grid-template-columns: 1fr; gap: 8px; padding: 20px 0 16px; }
  .hero-copy { padding: 20px 0 0; }
  .hero-copy h1 { max-width: 570px; font-size: clamp(56px, 12vw, 76px); letter-spacing: -4px; }
  .hero-copy p { max-width: 510px; font-size: 14px; }
  .hero-art { height: 365px; margin-top: 7px; border-radius: 28px; transform: none; }
  .sunburst { width: 280px; height: 280px; right: 14%; top: 4%; }
  .drink-shadow { bottom: 17px; }
  .art-caption { right: 14px; bottom: 14px; }
  .landing-foot { padding-block: 17px 22px; }
  .landing-foot span:last-child { display: none; }

  .app-shell { display: block; }
  .sidebar {
    position: fixed;
    top: auto;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: auto;
    min-height: 0;
    padding: 7px 8px calc(7px + env(safe-area-inset-bottom));
    border-top: 1px solid #dfdfd6;
    background: rgb(41 45 38 / 97%);
    box-shadow: 0 -10px 32px rgb(31 35 29 / 14%);
    backdrop-filter: blur(16px);
  }
  .side-brand, .server-picker, .nav-label, .sidebar-bottom { display: none; }
  .main-nav { display: flex; justify-content: space-around; gap: 3px; }
  .nav-link {
    min-width: 0;
    min-height: 52px;
    flex: 1;
    justify-content: center;
    flex-direction: column;
    gap: 3px;
    padding: 5px 2px;
    border-radius: 10px;
    color: #c0c5b9;
    font-size: 8px;
    white-space: nowrap;
  }
  .nav-link > span { width: auto; font-size: 17px; }
  .nav-link.active { background: #41483b; box-shadow: inset 0 -2px #ef8547; color: #ffe1c5; }
  .nav-link:hover { transform: none; }
  .main-content { min-height: 100vh; padding: 0 21px calc(90px + env(safe-area-inset-bottom)); }
  .topbar { height: 64px; margin-bottom: 26px; }
  .top-user { min-height: 35px; padding: 3px 9px 3px 4px; font-size: 10px; }
  .top-user img { width: 27px; height: 27px; }
  .page-heading { align-items: flex-start; margin-bottom: 20px; }
  .page-heading h1 { font-size: 29px; }
  .page-heading p { max-width: 400px; font-size: 12px; }
  .page-heading > .button { flex: 0 0 auto; align-self: center; }
  .stats-grid { gap: 9px; margin-bottom: 14px; }
  .stat-card { min-height: 106px; padding: 15px 13px; border-radius: 13px; }
  .stat-top { gap: 4px; align-items: flex-start; font-size: 9px; line-height: 1.35; }
  .stat-icon { font-size: 14px; }
  .stat-value { margin-top: 12px; font-size: 23px; }
  .stat-value small { font-size: 10px; }
  .content-grid { grid-template-columns: 1fr; gap: 0; }
  .panel { margin-bottom: 14px; padding: 17px; border-radius: 14px; }
  .panel-head { margin-bottom: 13px; }
  .panel-head h2 { font-size: 13px; }
  .submission-row { grid-template-columns: 36px minmax(0, 1fr) auto; gap: 9px; padding: 12px 0; }
  .drink-icon { width: 34px; height: 34px; border-radius: 10px; }
  .row-title { font-size: 11px; }
  .rank-big { font-size: 46px; }
  .toolbar { align-items: stretch; }
  .toolbar .field, .toolbar .select-field { min-width: 0; flex: 1 1 145px; }
  .form-grid { grid-template-columns: 1fr; gap: 14px; }
  .form-field.full { grid-column: auto; }
  .form-actions { flex-wrap: wrap; }
  .data-table { min-width: 650px; }
  .podium { gap: 7px; }
  .podium-card { padding: 14px 7px 12px; }
  .podium-card small { display: block; line-height: 1.5; }
  .leader-row { grid-template-columns: 25px minmax(0, 1fr) auto; gap: 7px; font-size: 10px; }
  .leader-row > span:nth-child(3) { display: none; }
  .community-pagination { justify-content: space-between; }
  .community-pagination .row-sub { flex: 1 0 100%; }
  .app-footer { gap: 10px; font-size: 7px; }
  .detail-dialog { width: calc(100vw - 20px); max-height: calc(100dvh - 24px); padding: 23px 18px; border-radius: 18px; }
  .detail-close { position: sticky; top: 0; }
}

@media (max-width: 430px) {
  .landing-view { padding-inline: 18px; }
  .brand { font-size: 23px; }
  .landing-nav .button { padding-inline: 11px; font-size: 10px; }
  .hero-copy h1 { font-size: clamp(52px, 13vw, 62px); letter-spacing: -3.8px; }
  .hero-art { height: 325px; }
  .sunburst { width: 250px; height: 250px; right: 9%; }
  .scribble { left: 8%; bottom: 77px; font-size: 21px; }
  .art-caption { max-width: 165px; padding: 10px 12px; }
  .landing-foot span:first-child { font-size: 7px; }
  .main-content { padding-inline: 15px; }
  .topbar { margin-bottom: 22px; }
  .crumb { font-size: 8px; }
  .crumb-divider { padding-inline: 6px; }
  .page-name { font-size: 11px; }
  .top-user { gap: 6px; padding-right: 7px; font-size: 9px; }
  .stats-grid { gap: 6px; }
  .stat-card { min-height: 100px; padding: 14px 9px; }
  .stat-top { font-size: 8px; }
  .stat-icon { display: none; }
  .stat-value { font-size: 21px; }
  .page-heading > .button { padding: 9px 10px; font-size: 9px; gap: 5px; }
  .panel { padding: 15px 13px; }
  .submission-row { grid-template-columns: 33px minmax(0, 1fr) auto; gap: 7px; }
  .row-sub { font-size: 9px; }
  .row-amount { font-size: 10px; }
  .type-chip { padding: 7px 8px; font-size: 9px; }
  .admin-tabs button { padding: 10px 9px; font-size: 9px; }
  .podium-card b { overflow-wrap: anywhere; font-size: 10px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}