/* Mission:Chaos – warmer Rot-Akzent und echter Garten-Login. Nur visuelle Overrides. */
:root {
  --accent:#ad474a;
  --home-accent:#ad474a;
  --home-accent-soft:#f8ede8;
  --lav:#f9eee8;
}
/* Bei sichtbarer Anmeldung keine alten Desktop-Paddings oder Zwischenflächen. */
body:has(#welcome.mission-login-screen:not(.hidden)) {
  padding:0!important;
  margin:0!important;
  background:#f6ece2!important;
}
#welcome.mission-login-screen {
  position:relative!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:0!important;
  box-sizing:border-box!important;
  width:100%!important;
  max-width:none!important;
  min-height:100svh!important;
  min-height:100dvh!important;
  padding:max(18px,env(safe-area-inset-top)) 16px max(18px,env(safe-area-inset-bottom))!important;
  overflow-y:auto!important;
  background:#e8ecdf!important;
}
#welcome.mission-login-screen.hidden {display:none!important}
/* Reines Bild, nie ein zweiter Login- oder Logo-Screenshot als Overlay. */
#welcome .mission-login-art {
  position:fixed!important;
  inset:0!important;
  z-index:-1!important;
  overflow:hidden!important;
  background:#e9e9d7 url('../img/login-garden-desktop.webp') center center / cover no-repeat!important;
}
#welcome .mission-login-art::after {
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:none!important;
}
#welcome .mission-login-image {display:none!important}
#welcome .mission-login-logo {
  display:block;
  width:clamp(230px,30vw,355px);
  max-width:86vw;
  height:auto;
  position:relative;
  z-index:2;
  margin:0 auto -8px;
  object-fit:contain;
  filter:none!important;
}
#welcome .mission-login-card {
  position:relative!important;
  z-index:1!important;
  box-sizing:border-box!important;
  flex:none!important;
  width:min(100%,440px)!important;
  max-width:440px!important;
  margin:0 auto!important;
  padding:25px clamp(20px,5vw,30px) 25px!important;
  background:rgba(255,250,246,.97)!important;
  border:1px solid rgba(255,255,255,.88)!important;
  border-radius:25px!important;
  box-shadow:none!important;
}
#welcome .mission-login-card .eyebrow {color:#a44543!important}
#welcome .mission-login-card .mission-login-title {color:#263148!important}
#welcome .mission-login-card .primary,
#welcome .mission-login-card button.primary {
  background:linear-gradient(180deg,#bd5556,#9c363b)!important;
  border:0!important;
  color:#fff!important;
  box-shadow:0 4px 13px rgba(179,12,21,.2)!important;
}
#welcome .mission-login-card a,
#welcome .mission-login-card .login-utility {color:#96393d!important}
#welcome .mission-login-card input:focus {
  outline:2px solid rgba(198,30,37,.35)!important;
  border-color:#ad474a!important;
}
/* Nur Akzentfarben auch im eingeloggten Teil aktualisieren. */
#shell nav a.active, #shell .section-head>a {color:var(--home-accent)!important}
#shell .primary {background:var(--home-accent)!important;color:white!important}
@media(max-width:700px) {
  #welcome .mission-login-art {
    background-image:url('../img/mission-chaos-garten-neu.webp'),url('../img/login-garden-mobile.webp')!important;
    background-position:center center!important;
  }
  #welcome .mission-login-logo {width:min(72vw,290px);margin-bottom:-7px}
  #welcome .mission-login-card {padding:18px 20px 20px!important}
}
@media(max-height:690px) {
  #welcome.mission-login-screen {justify-content:flex-start!important}
  #welcome .mission-login-logo {width:min(60vw,245px)}
  #welcome .mission-login-card {margin:0 auto!important}
}
@media(prefers-reduced-motion:reduce){#welcome .mission-login-card{transition:none!important}}


/* Mission:Chaos – warme rote Akzente im eingeloggten Bereich (2026-11). */
#shell {
  --accent:#ad474a;
  --home-accent:#ad474a;
  --home-accent-soft:#f8ede8;
  --lav:#f9eee8;
}
#shell .primary,
#shell button.primary,
#shell .taskaction.primary,
#shell .btn-primary,
#shell button[type="submit"].primary {background:#ad474a!important;color:#fff!important;border-color:#ad474a!important}
#shell nav a.active,
#shell nav a.active *,
#shell .section-head>a,
#shell .active-tab,
#shell .tab.active,
#shell .text-accent {color:#96393d!important}
#shell button[aria-selected="true"],
#shell .segmented-control .active,
#shell .filter-chip.active {background:#f8ede8!important;color:#96393d!important;border-color:#e7bab6!important}
#shell input:focus-visible,
#shell textarea:focus-visible,
#shell select:focus-visible {outline-color:#ad474a!important;accent-color:#ad474a}
#shell input[type="checkbox"],
#shell input[type="radio"],
#shell input[type="range"] {accent-color:#ad474a}

/* 2026-11-09: Rot als durchgängige Marken-Akzentfarbe, ohne Statusfarben zu ändern. */
html,body,#shell,#modal {
  --accent:#ad474a;
  --home-accent:#ad474a;
  --home-accent-soft:#f8ede8;
  --lav:#f9eee8;
  --primary:#ad474a;
  --primary-color:#ad474a;
  --accent-color:#ad474a;
  --purple:#ad474a;
  --violet:#ad474a;
}
#shell :is(button.primary,.primary,.btn-primary,.action-primary,.button-primary),
#modal :is(button.primary,.primary,.btn-primary,.action-primary,.button-primary) {
  background:#ad474a!important;
  border-color:#ad474a!important;
  color:white!important;
}
#shell :is(.tab.active,.tabs .active,.nav-item.active,.active-tab,.filter-chip.active,.segmented-control .active),
#modal :is(.tab.active,.tabs .active,.active-tab) {
  border-color:#dbaca8!important;
}
#shell :is(a.active,nav a.active,.tab.active,.active-tab,.section-head>a),
#modal :is(a.active,.tab.active,.active-tab) {
  color:#96393d!important;
}
#shell :is(input,textarea,select):focus-visible,
#modal :is(input,textarea,select):focus-visible {
  outline-color:#ad474a!important;
  border-color:#ad474a!important;
}
#shell :is(input[type=checkbox],input[type=radio],input[type=range]),
#modal :is(input[type=checkbox],input[type=radio],input[type=range]) {accent-color:#ad474a}

/* Finales, ruhiges Creme-Korallrot-Design: keine lila/blauen Flaechen. */
:root,html,body,#shell,#modal,.shell,.sheet {
  --bg:#fcf8f3;--home-bg:#fcf8f3;--home-card:#fffdfb;
  --accent:#ad474a;--home-accent:#ad474a;--home-accent-soft:#f8ede8;
  --ui-purple:#ad474a;--ui-purple-soft:#f8ede8;
  --lav:#f8ede8;--primary:#ad474a;--primary-color:#ad474a;
  --accent-color:#ad474a;--purple:#ad474a;--violet:#ad474a;
}
body:not(:has(#welcome.mission-login-screen:not(.hidden))) {
  background:#fcf8f3!important;
}
#shell .hero,#shell .home-hero {
  background:linear-gradient(135deg,#fffdfa,#fbefe8)!important;
}
#shell :is(.card,.panel,.stats article),#modal .sheet {
  background-color:#fffdfb!important;
}
#shell :is(.primary,.btn-primary,button.primary,.button-primary,.action-primary),
#modal :is(.primary,.btn-primary,button.primary,.button-primary) {
  background:#ad474a!important;border-color:#ad474a!important;color:#fff!important;
  box-shadow:none!important;
}
#shell :is(nav a.active,nav a:hover,.filter-chip.active,.tab.active,.segmented-control .active),
#modal :is(.tab.active,.filter-chip.active) {
  background-color:#f8ede8!important;
  border-color:#eed8d2!important;
  color:#96393d!important;
}
#shell .taskaction.check:not(:disabled) {background:#f8ede8!important;color:#ad474a!important}
#shell .task-v052.done .taskaction.check {background:#e8f6ea!important;color:#327342!important}
#welcome .mission-login-art::before,#welcome .mission-login-art::after {
  background:none!important;box-shadow:none!important;filter:none!important;
}
#welcome .mission-login-art {background-image:url('../img/mission-chaos-garten-neu.webp'),url('../img/login-garden-desktop.webp')!important;
 background-size:cover!important;background-position:center center!important;}
#welcome .mission-login-logo {filter:none!important}
@media(max-width:700px){
 #welcome .mission-login-art {background-image:url('../img/mission-chaos-garten-neu.webp'),url('../img/login-garden-desktop.webp')!important;
 background-position:64% center!important}
}


/* 2026-11-09: Echte Dialog-Komponenten, statt nur globale Akzent-Variablen.
   Ruhige neutrals; Rot nur fuer aktive Auswahl und Primaeraktionen. */
#modal .sheet {
  --ui-purple:#a74c4f!important;
  --ui-purple-soft:#f8efeb!important;
  --accent:#ad474a!important;
  background:#fffdfb!important;
  color:#302d31!important;
}
#modal .sheet h2,#modal .sheet h3 {color:#332d32!important}
#modal .sheet .eyebrow {color:#a65d5d!important}
#modal .sheet .profile-menu > button.secondary,
#modal .sheet .secondary,
#modal .sheet .task-create-form button.secondary {
  background:#f5f1ee!important;
  color:#534a49!important;
  border:1px solid #e9e0dc!important;
  box-shadow:none!important;
}
#modal .sheet .secondary:hover {
  background:#f4eae5!important;
  color:#7f3c3e!important;
}
#modal .sheet .setting-tile {
  background:#faf8f5!important;
  border:1px solid #eee8e3!important;
  box-shadow:none!important;
}
#modal .sheet .setting-tile select {
  background:#fffdfb!important;
  color:#332d32!important;
  border-color:#e7ddda!important;
}
#modal .sheet .setting-tile input[type=checkbox]:checked {
  background:#b96d6e!important;
}
#modal .sheet .task-create-clean .create-extra {
  background:#fcfaf8!important;
  border-color:#e9e1dc!important;
}
#modal .sheet .task-create-clean .create-options label>span,
#modal .sheet .task-create-clean .create-mode label>span,
#modal .sheet .task-create-clean .task-time-options label>span,
#modal .sheet .task-create-clean .weekday-picker label>span,
#modal .sheet .task-create-clean .create-people label>span {
  background:#f7f4f1!important;
  color:#514946!important;
  border-color:#e9e0dc!important;
  box-shadow:none!important;
}
#modal .sheet .task-create-clean .create-options input:checked+span,
#modal .sheet .task-create-clean .create-mode input:checked+span,
#modal .sheet .task-create-clean .task-time-options input:checked+span,
#modal .sheet .task-create-clean .weekday-picker input:checked+span,
#modal .sheet .task-create-clean .create-people input:checked+span {
  background:#f8e9e7!important;
  border-color:#ba7376!important;
  color:#923e42!important;
  box-shadow:inset 0 0 0 1px #ba7376!important;
}
#modal .sheet .task-create-clean input:not([type=checkbox]):not([type=radio]):focus-visible {
  border-color:#b96d6e!important;
  outline-color:#dfb1af!important;
}
#modal .sheet #taskTemplateLibrary summary {color:#443b3d!important}
#modal .sheet .profile-menu button.danger {color:#8e4144!important}

/* Login – warmes Creme statt blauer Browser-Autofill-Hintergruende. */
#welcome .mission-login-card .mission-login-actions .secondary,
#welcome .mission-login-card .login-child-qr .secondary {
 background:#f5f0eb!important;color:#6d4b4a!important;border:1px solid #eaded7!important;box-shadow:none!important;
}
#welcome .mission-login-card input,
#welcome .mission-login-card input:focus {
 background:#fffdfb!important;color:#302d31!important;transition:background-color 0s!important;
}
#welcome .mission-login-card input:-webkit-autofill,
#welcome .mission-login-card input:-webkit-autofill:hover,
#welcome .mission-login-card input:-webkit-autofill:focus {
 -webkit-box-shadow:0 0 0 1000px #fffdfb inset!important;
 -webkit-text-fill-color:#302d31!important;
 caret-color:#302d31!important;
 transition:background-color 99999s ease-out 0s!important;
}
#welcome .mission-login-card input:disabled {background:#f9f5f1!important}
/* Kalender: NUR Liste/Monat und Ansichts-Umschalter; Woche unveraendert. */
#shell.shell #dashboardGrid #eventsUpcoming .calendar-view-switch {
 background:#f5efea!important;border:1px solid #eee1d9!important;
}
#shell.shell #dashboardGrid #eventsUpcoming .calendar-view-switch button {
 color:#725c59!important;background:transparent!important;box-shadow:none!important;
}
#shell.shell #dashboardGrid #eventsUpcoming .calendar-view-switch button.is-active {
 background:#fff9f5!important;color:#9a4445!important;
 border:1px solid #e3c3ba!important;box-shadow:0 1px 3px #513c3014!important;
}
#shell.shell #dashboardGrid #eventsUpcoming .calendar-period-nav button,
#shell.shell #dashboardGrid #eventsUpcoming .calendar-list-pager button {
 background:#fff9f5!important;border-color:#eadfd8!important;color:#8c4d4b!important;
}
#shell.shell #dashboardGrid #eventsUpcoming .calendar-period-nav span,
#shell.shell #dashboardGrid #eventsUpcoming .calendar-list-pager {color:#695d58!important}
#shell.shell #dashboardGrid #eventsUpcoming .calendar-list .upcoming-event {
 background:#f5eee8!important;color:#493e39!important;border:1px solid #e9ded6!important;
 border-radius:10px!important;box-shadow:none!important;
}
#shell.shell #dashboardGrid #eventsUpcoming .calendar-list .upcoming-event .event-date {
 background:#fbf1e9!important;color:#845047!important;
}
#shell.shell #dashboardGrid #eventsUpcoming .calendar-month .calendar-month-cell {
 background:#fffdfb!important;border-color:#eee5dd!important;
}
#shell.shell #dashboardGrid #eventsUpcoming .calendar-month .calendar-month-cell.is-today {
 background:#fff6e9!important;border-color:#e5bc84!important;
}
#shell.shell #dashboardGrid #eventsUpcoming .calendar-month .calendar-month-weekday {color:#74655e!important}
#shell.shell #dashboardGrid #eventsUpcoming .calendar-month .calendar-month-date {color:#4f403b!important}
#shell.shell #dashboardGrid #eventsUpcoming .calendar-month .calendar-mini-event {
 background:#f7e9e3!important;color:#744541!important;border-left-color:var(--mc-event-color,#c78d7d)!important;
}
#shell.shell #dashboardGrid #eventsUpcoming .calendar-month .calendar-mini-event:focus-visible {
 outline-color:#b96d6e!important;
}


/* Login: deliberate separation between logo and form on all screens. */
#welcome.mission-login-screen {gap:clamp(14px,2.7vh,26px)!important}
#welcome .mission-login-logo {
  margin:0 auto!important;
  flex:0 0 auto!important;
  max-height:min(32svh,275px)!important;
  object-fit:contain!important;
}
#welcome .mission-login-card {margin:0 auto!important}
@media(max-width:700px) {
 #welcome.mission-login-screen {gap:16px!important}
 #welcome .mission-login-logo {margin:0 auto!important;max-height:23svh!important}
}
@media(max-height:680px) {
 #welcome.mission-login-screen {gap:8px!important}
 #welcome .mission-login-logo {max-height:18svh!important}
}


/* Login 2026-11-09: keep large 3D logo, place clearly ABOVE the card. */
#welcome.mission-login-screen {gap:0!important}
#welcome .mission-login-logo {
  width:min(94vw,525px)!important;
  max-width:none!important;
  max-height:none!important;
  height:auto!important;
  margin:0 auto 8px!important;
  position:relative!important;
  z-index:3!important;
  object-fit:contain!important;
}
#welcome .mission-login-card {position:relative!important;z-index:2!important}
@media(max-width:700px) {
  #welcome .mission-login-logo {width:min(96vw,405px)!important;margin:0 auto 6px!important;max-height:none!important}
}
@media(max-height:760px) {
  #welcome .mission-login-logo {width:min(86vw,385px)!important;margin-bottom:4px!important}
}
@media(max-height:620px) {
  #welcome .mission-login-logo {width:min(72vw,285px)!important;margin-bottom:2px!important}
}


/* Calendar: personal events are visibly, but subtly, distinct from family events. */
#shell.shell #dashboardGrid #eventsUpcoming .calendar-week .calendar-event-compact.is-personal {
  background:#f3e2dc!important;border-color:#dcaeab!important;
  box-shadow:inset 3px 0 0 #bd7778!important;
}
#shell.shell #dashboardGrid #eventsUpcoming .calendar-week .calendar-event-compact.is-family {
  background:#f5efe8!important;border-color:#e6dacf!important;
  box-shadow:none!important;
}
#shell.shell #dashboardGrid #eventsUpcoming .calendar-list .upcoming-event.is-personal {
  background:#f5e4e1!important;border-color:#e6c5c1!important;
  box-shadow:inset 3px 0 0 #bd7778!important;
}
#shell.shell #dashboardGrid #eventsUpcoming .calendar-list .upcoming-event.is-family {
  background:#f8f2ec!important;border-color:#e9ded6!important;
  box-shadow:none!important;
}
#shell.shell #dashboardGrid #eventsUpcoming .calendar-month .calendar-mini-event.is-personal {
  background:#f3dddb!important;color:#7c4145!important;
  border-left:3px solid #bd7778!important;
}
#shell.shell #dashboardGrid #eventsUpcoming .calendar-month .calendar-mini-event.is-family {
  background:#f7eee7!important;color:#5d4a40!important;
}


/* BETA monetization: clearly visible previews, discreet gold crown; never blur text users need to read. */
.mc-premium-crown{display:inline-flex;align-items:center;justify-content:center;color:#ad8125;background:#fff5d9;border:1px solid #e2c779;border-radius:999px;box-shadow:0 2px 5px #5b432b22;font-size:17px;line-height:1;width:28px;height:28px;vertical-align:middle;margin-left:6px;font-weight:800}
.mc-premium-locked{position:relative!important;cursor:pointer!important;isolation:isolate;outline:1px solid #d5b36d66!important}
.mc-premium-locked img{filter:blur(3px) saturate(.6);opacity:.8}
.game-bg.mc-premium-locked .mc-premium-crown,.game-pick.mc-premium-locked .mc-premium-crown{position:relative;filter:none;opacity:1}
.avatar-design-launch.mc-premium-locked{background:linear-gradient(115deg,#fff9ed,#f8f0e4);border-color:#d9bc7d}
.avatar-design-launch.mc-premium-locked .avatar-design-launch-icon{filter:blur(2px)}
.create-mode label.mc-premium-locked{background:#fcf7eb;border:1px dashed #d2b46c;opacity:.85}
.create-mode label.mc-premium-locked span:not(.mc-premium-crown){filter:blur(1.3px)}
.mc-premium-offer{text-align:center;padding:12px 4px 8px}
.mc-premium-mark{margin:0 auto 14px;display:grid;place-items:center;border-radius:50%;background:#fff0c6;color:#af8124;font-size:40px;width:82px;height:82px;border:2px solid #d9b46e}
.mc-premium-offer h2{margin:8px 0 12px}
.mc-premium-offer p{line-height:1.55}
.mc-premium-prices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:18px 0}
.mc-premium-prices>div{background:#f9f1e7;border:1px solid #e4d4bb;border-radius:14px;padding:16px 8px;display:flex;flex-direction:column;gap:4px}
.mc-premium-prices strong{font-size:25px;color:#7d4144}
.mc-premium-prices small{font-size:12px;color:#5d5755}
.mc-plan-switch{display:flex;gap:10px;margin:20px 0}
.mc-plan-switch button{flex:1;border:1px solid #d2bea7;background:#f8f2ec;border-radius:12px;font-weight:800;padding:16px 10px;color:#584641;cursor:pointer}
.mc-plan-switch button.active{background:#af8124;border-color:#af8124;color:#fff}
.mc-premium-super{border-color:#d8b56d!important;color:#765211!important;background:#fff9ed!important}
.mc-premium-reward{display:block;width:100%;padding:14px;margin-bottom:12px;border:1px dashed #d4b36f;background:#fbf4e8;border-radius:14px;color:#765211;font-weight:800}
.mc-premium-status-button{border:1px solid #d8b56d!important;background:#fff8e8!important;color:#77521c!important}


/* BETA: readable SVG premium badge, comparison and gentle Free-overlimit notice. */
.mc-premium-crown{width:25px;height:25px;min-width:25px;padding:4px;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;color:#a47415;background:#fff2cd;border:1px solid #d7b562;border-radius:50%;vertical-align:middle;margin-left:5px;font-size:0!important}
.mc-premium-crown svg{width:16px!important;height:16px!important;flex:none!important;display:block;stroke:#a47415!important;filter:none!important;opacity:1!important}
.mc-premium-mark .mc-premium-crown{width:52px;height:52px;margin:0;background:#fff0c6;border:2px solid #d9b46e}
.mc-premium-mark .mc-premium-crown svg{width:32px!important;height:32px!important}
.mc-premium-tablewrap{max-width:100%;overflow-x:auto;margin:15px 0 8px;border-radius:12px;border:1px solid #e5d8cb}
.mc-premium-table{width:100%;border-collapse:collapse;background:#fffcf8;font-size:13px;text-align:left;table-layout:fixed}
.mc-premium-table th,.mc-premium-table td{padding:9px 8px;border-bottom:1px solid #eee2d8;vertical-align:middle;overflow-wrap:anywhere}
.mc-premium-table th:first-child{width:50%;text-align:left}
.mc-premium-table td:nth-child(2),.mc-premium-table td:nth-child(3){width:25%;text-align:center}
.mc-premium-table thead th{background:#f6ecdd;color:#5e483a;font-weight:800}
.mc-premium-table tbody th{color:#4e4741;font-weight:650}
.mc-premium-table tbody tr:last-child>*{border-bottom:0}
.mc-premium-overlimit{display:flex;flex-wrap:wrap;gap:12px;align-items:center;padding:13px 16px;margin:8px 0 18px;background:#fff8eb;border:1px solid #e8c887;border-radius:15px;color:#564636;font-size:14px;box-shadow:0 2px 9px #6d522712}
.mc-premium-overlimit-icon .mc-premium-crown{width:38px;height:38px}
.mc-premium-overlimit-icon svg{width:22px!important;height:22px!important}
.mc-premium-overlimit>div{flex:1;min-width:190px}
.mc-premium-overlimit strong{display:block;font-size:14px;color:#704e20}
.mc-premium-overlimit p{margin:4px 0 0;line-height:1.4;font-size:12px;color:#6b5843}
.mc-premium-upgrade{background:#8b6328;color:#fff;border:0;border-radius:10px;padding:10px 13px;font-weight:800;cursor:pointer;font-size:12px}
@media(max-width:580px){.mc-premium-overlimit{gap:8px;padding:12px}.mc-premium-upgrade{width:100%}.mc-premium-table{font-size:11px}.mc-premium-table th,.mc-premium-table td{padding:8px 5px}}

/* A downgraded task retains its old rules but those settings are read-only. */
.mc-premium-edit-locked{position:relative!important;outline:1px dashed #d8b76c!important;outline-offset:2px;border-radius:9px;background:#fffaf0!important}
.mc-premium-edit-locked .mc-premium-crown{vertical-align:middle;margin:3px 6px}
.mc-premium-edit-locked select,.mc-premium-edit-locked input{cursor:pointer}


/* BETA 2026-11-09: premium icons aligned within task choice rows.
   Existing markup is label > input + text span + crown span. */
.task-create-form .create-mode label.mc-premium-locked,
.task-create-form .create-mode label.mc-premium-edit-locked {
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 28px!important;
  align-items:center!important;
  column-gap:10px!important;
  padding:0 10px 0 0!important;
  min-height:72px!important;
}
.task-create-form .create-mode label.mc-premium-locked > span:not(.mc-premium-crown),
.task-create-form .create-mode label.mc-premium-edit-locked > span:not(.mc-premium-crown) {
  grid-column:1!important;
  grid-row:1!important;
  min-width:0!important;
  width:100%!important;
  padding:10px 12px!important;
  margin:0!important;
  box-sizing:border-box!important;
}
.task-create-form .create-mode label > .mc-premium-crown {
  grid-column:2!important;
  grid-row:1!important;
  justify-self:center!important;
  align-self:center!important;
  margin:0!important;
  width:27px!important;
  height:27px!important;
  min-width:27px!important;
  flex:none!important;
  filter:none!important;
}
.task-create-form label.setting-tile.mc-premium-locked,
.task-create-form label.setting-tile.mc-premium-edit-locked {
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 40px 28px!important;
  align-items:center!important;
  column-gap:12px!important;
  justify-content:initial!important;
  padding:12px 14px!important;
}
.task-create-form label.setting-tile.mc-premium-locked > span:not(.mc-premium-crown),
.task-create-form label.setting-tile.mc-premium-edit-locked > span:not(.mc-premium-crown) {
  grid-column:1!important;
  grid-row:1!important;
  min-width:0!important;
  width:auto!important;
}
.task-create-form label.setting-tile.mc-premium-locked > input[type="checkbox"],
.task-create-form label.setting-tile.mc-premium-edit-locked > input[type="checkbox"] {
  grid-column:2!important;
  grid-row:1!important;
  margin:0!important;
  justify-self:center!important;
  align-self:center!important;
}
.task-create-form label.setting-tile.mc-premium-locked > .mc-premium-crown,
.task-create-form label.setting-tile.mc-premium-edit-locked > .mc-premium-crown {
  grid-column:3!important;
  grid-row:1!important;
  margin:0!important;
  width:27px!important;
  height:27px!important;
  min-width:27px!important;
  justify-self:center!important;
  align-self:center!important;
  filter:none!important;
  flex:none!important;
}
.task-create-form .mc-premium-crown svg {
  display:block!important;
  width:16px!important;
  height:16px!important;
  margin:auto!important;
}
@media(max-width:480px) {
  .task-create-form label.setting-tile.mc-premium-locked,
  .task-create-form label.setting-tile.mc-premium-edit-locked {
    grid-template-columns:minmax(0,1fr) 40px 27px!important;
    column-gap:8px!important;
    padding:10px!important;
  }
}


/* Archived members dialog: button must always fit the modal, including mobile. */
.archived-member-row {
  width:100%!important;min-width:0!important;max-width:100%!important;
  box-sizing:border-box!important;display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  gap:12px!important;align-items:center!important;
  padding:12px 0!important;border-bottom:1px solid #ece6e1;
}
.archived-member-row .archived-member-info{display:flex!important;flex-direction:column!important;gap:3px!important;min-width:0!important;overflow-wrap:anywhere}
.archived-member-row .archived-member-info b{font-size:14px}
.archived-member-row .archived-member-info small{display:block!important;font-size:12px}
.archived-member-row .familyRestoreMember{
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  position:static!important;float:none!important;
  width:auto!important;min-width:0!important;max-width:100%!important;
  height:auto!important;min-height:38px!important;
  padding:8px 12px!important;margin:0!important;
  box-sizing:border-box!important;white-space:normal!important;
  font-size:13px!important;line-height:1.3!important;text-align:center!important;
  flex:none!important;
}
@media(max-width:430px){
 .archived-member-row{gap:8px!important}
 .archived-member-row .familyRestoreMember{padding:8px!important;font-size:12px!important}
}


/* BETA premium visual v2: original 3D medallion, soft blur, no dashed outlines. */
.mc-premium-crown{
 width:34px!important;height:34px!important;min-width:34px!important;
 border:0!important;background:transparent!important;box-shadow:none!important;
 border-radius:50%!important;padding:0!important;margin:0!important;
 display:inline-flex!important;align-items:center!important;justify-content:center!important;
 overflow:visible!important;line-height:1!important;vertical-align:middle!important;
 filter:none!important;opacity:1!important;flex:none!important;
}
.mc-premium-crown img{
 display:block!important;width:100%!important;height:100%!important;
 object-fit:contain!important;filter:none!important;opacity:1!important;
 max-width:none!important;max-height:none!important;border-radius:0!important;
 box-shadow:none!important;transform:none!important;
}
.mc-premium-mark .mc-premium-crown{width:78px!important;height:78px!important;min-width:78px!important}
.mc-premium-mark{background:transparent!important;border:0!important}
.mc-premium-locked,.mc-premium-edit-locked{
 outline:0!important;border-style:solid!important;
 border-color:#eadbc4!important;background:#fbf6ef!important;
 box-shadow:0 3px 14px rgba(130,93,49,.07)!important;
 border-radius:15px!important;
}
.task-create-form .create-mode label.mc-premium-locked,
.task-create-form .create-mode label.mc-premium-edit-locked{
 display:block!important;position:relative!important;min-height:69px!important;
 padding:0!important;overflow:hidden!important;
 border:1px solid #eee3d4!important;outline:0!important;
}
.task-create-form .create-mode label.mc-premium-locked > span:not(.mc-premium-crown),
.task-create-form .create-mode label.mc-premium-edit-locked > span:not(.mc-premium-crown){
 display:flex!important;width:100%!important;min-height:69px!important;
 box-sizing:border-box!important;margin:0!important;padding:12px 15px!important;
 filter:blur(2.5px)!important;opacity:.6!important;
 background:#fbf6ef!important;border:0!important;
}
.task-create-form .create-mode label.mc-premium-locked > .mc-premium-crown,
.task-create-form .create-mode label.mc-premium-edit-locked > .mc-premium-crown{
 position:absolute!important;z-index:4!important;left:50%!important;top:50%!important;
 transform:translate(-50%,-50%)!important;
 width:52px!important;height:52px!important;min-width:52px!important;
 filter:drop-shadow(0 3px 5px rgba(104,70,22,.2))!important;
 pointer-events:none!important;grid-column:auto!important;grid-row:auto!important;
}
.task-create-form label.setting-tile.mc-premium-locked,
.task-create-form label.setting-tile.mc-premium-edit-locked{
 display:flex!important;position:relative!important;
 align-items:center!important;justify-content:space-between!important;
 padding:13px 15px!important;min-height:68px!important;
 border:1px solid #eadbc4!important;outline:0!important;
 overflow:hidden!important;gap:12px!important;
}
.task-create-form label.setting-tile.mc-premium-locked > span:not(.mc-premium-crown),
.task-create-form label.setting-tile.mc-premium-edit-locked > span:not(.mc-premium-crown){
 width:auto!important;min-width:0!important;flex:1 1 auto!important;
 filter:blur(2px)!important;opacity:.65!important;
}
.task-create-form label.setting-tile.mc-premium-locked > input[type="checkbox"],
.task-create-form label.setting-tile.mc-premium-edit-locked > input[type="checkbox"]{
 flex:0 0 40px!important;filter:blur(2px)!important;opacity:.55!important;
}
.task-create-form label.setting-tile.mc-premium-locked > .mc-premium-crown,
.task-create-form label.setting-tile.mc-premium-edit-locked > .mc-premium-crown{
 position:absolute!important;z-index:4!important;left:50%!important;top:50%!important;
 transform:translate(-50%,-50%)!important;
 width:50px!important;height:50px!important;min-width:50px!important;
 filter:drop-shadow(0 3px 5px rgba(104,70,22,.2))!important;
 pointer-events:none!important;
}
.game-bg.mc-premium-locked,.game-pick.mc-premium-locked{
 outline:0!important;border:1px solid #eadbc4!important;overflow:hidden!important;
}
.game-bg.mc-premium-locked .mc-premium-crown,
.game-pick.mc-premium-locked .mc-premium-crown{
 position:absolute!important;top:50%!important;left:50%!important;
 transform:translate(-50%,-50%)!important;z-index:4!important;
 width:53px!important;height:53px!important;min-width:53px!important;
 filter:drop-shadow(0 3px 5px rgba(104,70,22,.2))!important;
 pointer-events:none!important;
}
.game-bg.mc-premium-locked img:not(.mc-premium-crown img),
.game-pick.mc-premium-locked img:not(.mc-premium-crown img){
 filter:blur(3px) saturate(.7)!important;opacity:.6!important;
}
.mc-premium-super .mc-premium-crown,.mc-premium-status-button .mc-premium-crown,
.mc-premium-reward .mc-premium-crown{width:27px!important;height:27px!important;min-width:27px!important}


/* BETA: keep logo and login form usable on short screens, including landscape.
   Overrides the earlier large-logo max-height:none rule. */
@media (max-height:850px) {
  #welcome.mission-login-screen {
    justify-content:flex-start!important;
    gap:clamp(4px,1vh,12px)!important;
    padding-top:max(8px,env(safe-area-inset-top))!important;
    padding-bottom:max(12px,env(safe-area-inset-bottom))!important;
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch;
  }
  #welcome .mission-login-logo {
    width:min(78vw,360px,42svh)!important;
    max-width:100%!important;
    max-height:clamp(76px,28svh,225px)!important;
    height:auto!important;
    flex:0 1 auto!important;
    margin:0 auto 2px!important;
  }
  #welcome .mission-login-card {
    margin:0 auto!important;
    flex:0 0 auto!important;
  }
}
@media (max-height:650px) {
  #welcome .mission-login-logo {
    width:min(68vw,280px,34svh)!important;
    max-height:22svh!important;
  }
  #welcome .mission-login-card {
    padding:14px 18px!important;
  }
}
@media (max-height:480px) {
  #welcome .mission-login-logo {
    width:min(55vw,200px,26svh)!important;
    max-height:16svh!important;
  }
  #welcome.mission-login-screen {gap:2px!important}
}


/* BETA login small viewport definitive fix: the PAGE grows with its form.
   Do not trap the form in a viewport-height flex/scroll container. */
@media (max-height:900px), (max-width:430px) {
  html:has(#welcome.mission-login-screen:not(.hidden)),
  body:has(#welcome.mission-login-screen:not(.hidden)) {
    height:auto!important;
    min-height:100%!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
  }
  #welcome.mission-login-screen:not(.hidden) {
    height:auto!important;
    min-height:100svh!important;
    max-height:none!important;
    overflow:visible!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:flex-start!important;
    align-items:center!important;
    gap:8px!important;
    padding:calc(8px + env(safe-area-inset-top,0px)) 12px calc(24px + env(safe-area-inset-bottom,0px))!important;
  }
  #welcome .mission-login-logo {
    display:block!important;
    flex:0 0 auto!important;
    width:min(70vw,310px,32svh)!important;
    height:auto!important;
    max-width:100%!important;
    max-height:22svh!important;
    object-fit:contain!important;
    margin:0 auto!important;
  }
  #welcome .mission-login-card {
    flex:0 0 auto!important;
    width:min(100%,440px)!important;
    max-height:none!important;
    height:auto!important;
    margin:0 auto!important;
    padding:16px 18px 20px!important;
    overflow:visible!important;
  }
}
@media (max-height:670px) {
  #welcome .mission-login-logo {
    width:min(60vw,240px,25svh)!important;
    max-height:17svh!important;
  }
  #welcome.mission-login-screen:not(.hidden) {gap:4px!important}
}
@media (max-height:480px) {
  #welcome .mission-login-logo {
    width:min(48vw,165px,20svh)!important;
    max-height:13svh!important;
  }
}


/* iOS Safari/WKWebView: input text under 16px triggers automatic zoom.
   Apply to all login and modal inputs, while keeping manual accessibility zoom available. */
@supports (-webkit-touch-callout: none) {
  #welcome input, #welcome select, #welcome textarea,
  #modal input, #modal select, #modal textarea,
  #shell input, #shell select, #shell textarea {
    font-size:16px!important;
  }
}

/* Compact earned-reward prompt directly below the task list. */
#shell.shell #mcRewardUnlock.mc-reward-unlock {
 display:flex;align-items:center;gap:11px;flex-wrap:wrap;
 margin:14px 0 4px;padding:12px 14px;
 background:linear-gradient(115deg,#fff6d9,#fffaf0)!important;
 border:1px solid #e8d2a0!important;border-radius:15px!important;
 box-shadow:0 2px 10px rgba(105,75,32,.08);
 color:#57401f;
}
#shell.shell #mcRewardUnlock[hidden] {display:none!important}
#shell.shell .mc-reward-unlock-icon{font-size:29px;flex:none}
#shell.shell .mc-reward-unlock-content{display:flex;flex:1 1 130px;flex-direction:column;gap:3px;min-width:0;font-size:13px}
#shell.shell .mc-reward-unlock-content strong{font-weight:800;font-size:15px}
#shell.shell .mc-reward-unlock-content span{overflow-wrap:anywhere}
#shell.shell .mc-reward-unlock-action {
 min-height:38px!important;padding:7px 12px!important;
 background:#ad474a!important;color:#fff!important;
 border:0!important;border-radius:10px!important;cursor:pointer;
 font-weight:700;font-size:13px;
}

/* Multiple affordable rewards directly underneath today's tasks. */
#shell.shell #mcRewardUnlock.mc-reward-unlock{display:block!important}
#shell.shell #mcRewardUnlock[hidden]{display:none!important}
#shell.shell .mc-reward-unlock-head{display:flex;align-items:center;gap:10px;margin-bottom:10px}
#shell.shell .mc-reward-unlock-head>span{font-size:28px}
#shell.shell .mc-reward-unlock-head>div{display:flex;flex-direction:column;gap:2px}
#shell.shell .mc-reward-unlock-head strong{font-size:15px;font-weight:800}
#shell.shell .mc-reward-unlock-head small{font-size:12px;opacity:.75}
#shell.shell .mc-reward-unlock-list{display:flex;flex-direction:column;gap:8px}
#shell.shell .mc-reward-unlock-row{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:9px 0;border-top:1px solid rgba(122,92,45,.16)}
#shell.shell .mc-reward-unlock-row .mc-reward-unlock-content{flex:1 1 130px}
#shell.shell .mc-reward-unlock-row .mc-reward-unlock-action{flex:none;max-width:100%}

/* Premium-only reward widget: a separate dashboard card, not part of today's tasks. */
#shell.shell #dashboardGrid > .dashboard-rewards{min-width:0}
#shell.shell #dashboardGrid > .dashboard-rewards > .mc-rewards-panel{
  min-height:155px!important;
  background:#faf8f2!important;
  background-image:linear-gradient(135deg,rgba(255,255,255,.3),transparent 90%)!important;
}
#shell.shell .mc-rewards-panel .section-head{display:flex;align-items:center;justify-content:space-between;gap:8px}
#shell.shell .mc-rewards-manage{font-size:12px!important;font-weight:700;border:0!important;background:transparent!important;color:#9b393e!important;cursor:pointer;padding:7px!important;white-space:nowrap}
#shell.shell #mcRewardUnlock.mc-reward-unlock{
  display:block!important;margin:0!important;padding:0!important;
  background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;
}
#shell.shell #mcRewardUnlock[hidden]{display:none!important}
#shell.shell .mc-reward-unlock-balance{font-size:12px;color:#826346;margin:5px 0 9px;font-weight:700}
#shell.shell .mc-reward-unlock-row{
  display:flex;align-items:center;flex-wrap:wrap;gap:10px;padding:12px!important;
  border:1px solid #e8d2a0!important;border-radius:13px!important;
  background:linear-gradient(130deg,#fff3ce,#fffbf1)!important;
  box-shadow:0 2px 7px rgba(85,67,39,.06)!important;
}
#shell.shell .mc-reward-unlock-row .mc-reward-unlock-content{min-width:130px;flex:1 1 160px}
#shell.shell .mc-reward-unlock-row .mc-reward-unlock-action{min-height:38px!important}

/* Premium rewards as golden collectible stars, instead of table-like rows. */
#shell.shell .mc-rewards-panel .mc-reward-unlock-list{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(132px,1fr))!important;
  gap:14px 12px!important;
  align-items:start!important;
  padding:6px 0 10px;
}
#shell.shell .mc-rewards-panel .mc-reward-star-card{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  gap:5px!important;
  text-align:center!important;
  min-width:0!important;
  padding:0 5px 10px!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
#shell.shell .mc-reward-star-figure{
  display:grid!important;
  place-items:center!important;
  position:relative!important;
  width:min(100%,174px)!important;
  aspect-ratio:1!important;
  filter:drop-shadow(0 5px 6px rgba(101,68,22,.22));
}
#shell.shell .mc-reward-star-shape{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
#shell.shell .mc-reward-star-title{
  position:relative!important;
  z-index:1!important;
  display:-webkit-box!important;
  -webkit-box-orient:vertical!important;
  -webkit-line-clamp:3!important;
  line-clamp:3!important;
  overflow:hidden!important;
  width:56%!important;
  max-height:4.1em!important;
  line-height:1.23!important;
  color:#5c3b0e!important;
  text-shadow:0 1px 0 rgba(255,251,208,.65)!important;
  overflow-wrap:anywhere!important;
  font-size:clamp(11px,2vw,15px)!important;
  font-weight:850!important;
}
#shell.shell .mc-reward-star-price{
  font-size:13px!important;
  color:#7b562c!important;
  font-weight:750!important;
  white-space:normal!important;
}
#shell.shell .mc-reward-star-price small{font-size:11px!important;font-weight:500!important}
#shell.shell .mc-reward-star-card .mc-reward-unlock-action{
  min-height:36px!important;
  margin-top:3px!important;
  padding:7px 15px!important;
  font-size:12px!important;
}
@media(max-width:420px){
  #shell.shell .mc-rewards-panel .mc-reward-unlock-list{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  #shell.shell .mc-reward-star-title{font-size:12px!important}
}

/* Compact raised stars, same restrained 3D language as Mission:Chaos badges. */
#shell.shell .mc-rewards-panel .mc-reward-unlock-list{
 display:grid!important;
 grid-template-columns:repeat(auto-fill,minmax(118px,140px))!important;
 justify-content:start!important;
 gap:9px!important;
 padding:2px 0 6px!important;
}
#shell.shell .mc-rewards-panel .mc-reward-star-card{
 padding:0 3px 6px!important;
 gap:3px!important;
}
#shell.shell .mc-rewards-panel .mc-reward-star-figure{
 width:112px!important;max-width:100%!important;
 aspect-ratio:1!important;
 filter:drop-shadow(0 4px 3px rgba(81,48,10,.2))!important;
}
#shell.shell .mc-rewards-panel .mc-reward-star-title{
 font-size:12px!important;
 width:62%!important;
 line-height:1.13!important;
 max-height:3.6em!important;
 color:#593b12!important;
 text-shadow:0 1px 1px rgba(255,249,216,.85)!important;
}
#shell.shell .mc-rewards-panel .mc-reward-star-price{font-size:12px!important}
#shell.shell .mc-rewards-panel .mc-reward-star-price small{font-size:10px!important}
#shell.shell .mc-rewards-panel .mc-reward-star-card .mc-reward-unlock-action{
 min-height:32px!important;
 margin-top:2px!important;
 padding:5px 12px!important;
 font-size:12px!important;
 border-radius:10px!important;
 box-shadow:0 2px 0 rgba(92,33,37,.28)!important;
}
@media(max-width:420px){
 #shell.shell .mc-rewards-panel .mc-reward-unlock-list{grid-template-columns:repeat(2,minmax(0,1fr))!important;justify-items:center!important}
 #shell.shell .mc-rewards-panel .mc-reward-star-figure{width:105px!important}
}

/* Final reward badge: generated 3D star image, readable diagonal title overlay.
   No redundant "x times available" and no separate coin-price label. */
#shell.shell .mc-rewards-panel .mc-reward-star-figure{
  position:relative!important;
  width:112px!important;
  max-width:100%!important;
  height:112px!important;
  aspect-ratio:1!important;
  overflow:visible!important;
  filter:none!important;
}
#shell.shell .mc-rewards-panel .mc-reward-star-shape{
  display:block!important;
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  filter:drop-shadow(0 4px 4px rgba(111,61,13,.24))!important;
}
#shell.shell .mc-rewards-panel .mc-reward-star-title{
  position:relative!important;
  z-index:2!important;
  display:block!important;
  width:128%!important;
  max-width:none!important;
  max-height:none!important;
  min-height:0!important;
  overflow:visible!important;
  white-space:normal!important;
  text-wrap:balance!important;
  overflow-wrap:anywhere!important;
  font-size:12px!important;
  font-weight:900!important;
  line-height:1.13!important;
  letter-spacing:-.15px!important;
  color:#58310e!important;
  text-shadow:0 1px 0 rgba(255,249,208,.95),1px 2px 2px rgba(80,38,4,.52),-1px -1px 1px rgba(255,249,219,.8)!important;
  transform:rotate(-9deg)!important;
  transform-origin:center!important;
  background:linear-gradient(90deg,transparent 0%,rgba(255,243,191,.16) 18%,rgba(255,245,209,.37) 50%,rgba(255,243,191,.16) 82%,transparent 100%)!important;
  padding:2px!important;
  border-radius:8px!important;
  -webkit-line-clamp:unset!important;
}
#shell.shell .mc-rewards-panel .mc-reward-star-price{display:none!important}
#shell.shell .mc-rewards-panel .mc-reward-star-card .mc-reward-unlock-action{
  white-space:nowrap!important;
  margin-top:5px!important;
  font-size:12px!important;
  padding:6px 10px!important;
}
#shell.shell .mc-rewards-panel .section-head h2::before{content:none!important}
#shell.shell .dashboard-rewards .mc-rewards-panel{min-height:0!important}
@media (max-width:420px){
 #shell.shell .mc-rewards-panel .mc-reward-star-figure{width:105px!important;height:105px!important}
 #shell.shell .mc-rewards-panel .mc-reward-star-title{font-size:11px!important}
}

/* Inline SVG gold stars: no external asset request, no broken-image squares. */
#shell.shell .mc-rewards-panel .mc-reward-star-figure {
  width:112px!important;height:112px!important;
  background:none!important;border:0!important;
  display:grid!important;place-items:center!important;
}
#shell.shell .mc-rewards-panel svg.mc-reward-star-shape {
  position:absolute!important;inset:0!important;
  display:block!important;width:100%!important;height:100%!important;
  background:none!important;border:0!important;
  filter:drop-shadow(0 4px 4px rgba(99,58,13,.22))!important;
  overflow:visible!important;
}
#shell.shell .mc-rewards-panel .mc-reward-star-title {
  position:relative!important;z-index:2!important;
  width:120%!important;
}

/* The actual approved 3D gold badge: transparent artwork, no image frame. */
#shell.shell .mc-rewards-panel img.mc-reward-star-shape {
  display:block!important;
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  object-fit:contain!important;
  background:transparent!important;
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
  filter:drop-shadow(0 4px 4px rgba(99,58,13,.20))!important;
  pointer-events:none!important;
}
#shell.shell .mc-rewards-panel .mc-reward-star-figure {
  width:112px!important;
  height:112px!important;
  background:transparent!important;
  border:none!important;
  isolation:isolate;
}
#shell.shell .mc-rewards-panel .mc-reward-star-title{
  z-index:2!important;
  transform:rotate(-9deg)!important;
  color:#58310e!important;
  text-shadow:0 1px 0 rgba(255,249,208,.94),1px 2px 2px rgba(80,38,4,.52)!important;
}

/* Achievement celebrations. They never intercept touches or change card layout. */
.mc-level-celebration{
  position:fixed;inset:0;z-index:2147483000;pointer-events:none;overflow:hidden;
  animation:mc-celebration-fade 2.7s ease forwards;
}
.mc-level-celebration-label{
  position:absolute;left:50%;top:43%;width:max-content;max-width:90vw;
  transform:translate(-50%,-50%) scale(.4);
  color:#fffbea;font-size:clamp(27px,6vw,56px);font-weight:900;
  text-shadow:0 4px 20px rgba(20,12,35,.9),0 0 22px #f4c65b;
  animation:mc-level-caption 1.65s .3s cubic-bezier(.2,.8,.3,1) both;
}
.mc-firework-spark{
  position:absolute;left:var(--x);top:var(--y);
  width:8px;height:8px;border-radius:50%;
  box-shadow:0 0 9px currentColor,0 0 16px rgba(255,255,255,.65);
  opacity:0;animation:mc-firework-fly 1.25s var(--delay) cubic-bezier(.2,.3,.3,1) both;
}
@keyframes mc-firework-fly{
  0%{opacity:0;transform:translate(0,0) scale(.35)}
  16%{opacity:1;transform:translate(0,0) scale(1.15)}
  80%{opacity:1}
  100%{opacity:0;transform:translate(var(--dx),var(--dy)) scale(.1)}
}
@keyframes mc-level-caption{
  0%{opacity:0;transform:translate(-50%,-50%) scale(.4)}
  33%,72%{opacity:1;transform:translate(-50%,-50%) scale(1.06)}
  100%{opacity:0;transform:translate(-50%,-50%) scale(1.2)}
}
@keyframes mc-celebration-fade{0%,80%{opacity:1}100%{opacity:0}}
.mc-reward-celebration{
  position:fixed;inset:0;z-index:2147483000;pointer-events:none;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:4px;animation:mc-celebration-fade 1.9s ease both;
}
.mc-reward-celebration-star{
  width:min(36vw,175px);aspect-ratio:1;object-fit:contain;
  filter:drop-shadow(0 10px 14px rgba(75,47,13,.5));
  animation:mc-reward-star-flight 1.65s cubic-bezier(.2,.7,.2,1) both;
}
.mc-reward-celebration strong{
  font-size:clamp(18px,4vw,30px);color:#fff6c6;text-align:center;
  text-shadow:0 3px 11px #39290f,0 0 12px #ad7615;
  animation:mc-level-caption 1.4s .17s both;
}
@keyframes mc-reward-star-flight{
  0%{opacity:0;transform:translateY(50vh) translateX(-19vw) scale(.2) rotate(-55deg)}
  35%{opacity:1;transform:translateY(-9vh) translateX(0) scale(1.28) rotate(13deg)}
  65%{opacity:1;transform:translateY(-2vh) scale(1) rotate(-6deg)}
  100%{opacity:0;transform:translateY(-40vh) translateX(18vw) scale(.38) rotate(65deg)}
}
@media(prefers-reduced-motion:reduce){
  .mc-level-celebration,.mc-reward-celebration{display:none!important}
}