/* Approved crimson / ink cover. All rules are scoped away from the card battlefield. */
#introOverlay.rebel-home {
  --rebel-ivory: #fff0d6; --rebel-red: #c71a2c; --rebel-ink: #101012;
  container-type: size; isolation: isolate; position: fixed; inset: 0; width: 100%; height: 100dvh;
  padding: 0; overflow: hidden; background: #131313; color: var(--rebel-ivory);
}
#introOverlay.rebel-home::before, #introOverlay.rebel-home::after,
#introOverlay.rebel-home .intro-content::before, #introOverlay.rebel-home #homeLeader { display: none; }
#introOverlay.rebel-home .intro-content {
  position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; max-height: none;
  padding: 0; margin: 0; transform: none; background: none; border: 0; border-radius: 0;
  box-shadow: none; display: block; overflow: visible; z-index: 2; text-align: left;
}
.rebel-art { position: absolute; inset: -9px; background: #141414 url('./assets/ui/crown-rebellion-bg.webp') center / cover no-repeat; transform: translate(var(--mx,0px),var(--my,0px)); transition: transform 320ms ease-out; pointer-events: none; }
.rebel-art::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg,#09090b30,transparent 43%),linear-gradient(0deg,#09090b44,transparent 22%); }
.rebel-header { position: absolute; left: max(2.6%,env(safe-area-inset-left)); top: 3%; width: 40%; height: 22%; max-width: 660px; }
.rebel-header h1 { margin: 0; height: 100%; }
.rebel-logo { width: 100%; height: 100%; object-fit: contain; object-position: left center; filter: drop-shadow(3px 4px 0 #08080b); }
#introOverlay.rebel-home .rebel-nav { position: absolute; left: max(3.5%,env(safe-area-inset-left)); top: 28%; width: 35%; display: flex; flex-direction: column; align-items: flex-start; gap: 1.8cqh; }
#introOverlay.rebel-home .rebel-menu-item {
  --lean: -3deg; position: relative; isolation: isolate; display: flex; align-items: center; gap: 1.2cqw;
  flex: none; width: max-content; max-width: 100%; min-height: 0; height: 9.8cqh;
  margin: 0; padding: 0 2.8cqw 0 1.6cqw; border: 0; border-radius: 0; background: none;
  color: var(--rebel-ivory); font: 900 italic clamp(23px,5.3cqh,60px)/1.2 'Songti SC','STSong','Noto Serif CJK SC',serif;
  letter-spacing: .06em; white-space: nowrap; text-shadow: 3px 3px 0 #000;
  box-shadow: none; filter: none; transform: rotate(var(--lean)); translate: 0 0;
  transition: transform 170ms cubic-bezier(.16,1,.3,1),color 100ms; cursor: pointer; touch-action: manipulation;
}
#introOverlay.rebel-home .rebel-menu-item:nth-child(2) { margin-left: 2cqw; --lean: -4deg; }
#introOverlay.rebel-home .rebel-menu-item:nth-child(3) { margin-left: 3.4cqw; --lean: -2deg; }
#introOverlay.rebel-home .rebel-menu-item:nth-child(4) { margin-left: 2cqw; --lean: -4deg; }
#introOverlay.rebel-home .rebel-menu-item::before,
#introOverlay.rebel-home .rebel-menu-item::after {
  content: ''; position: absolute; inset: 5% -2% 0; width: auto; height: auto; top: 5%; left: -2%; right: -2%; bottom: 0;
  margin: 0; rotate: none; box-shadow: none; border: 0; z-index: -2; pointer-events: none;
  clip-path: polygon(7% 8%,100% 0,92% 72%,96% 75%,0 100%,4% 24%,0 20%);
  background: #0b0b0ee6; transition: transform 160ms cubic-bezier(.16,1,.3,1),background 100ms;
}
#introOverlay.rebel-home .rebel-menu-item::after { inset: 9% 0 5%; background: transparent; z-index: -1; }
#introOverlay.rebel-home .rebel-menu-item.is-selected { transform: translateX(1cqw) rotate(-4deg) scale(1.045); color: #fff2d9; }
#introOverlay.rebel-home .rebel-menu-item.is-selected::before { background: #f8e6c7; transform: skewX(-5deg); }
#introOverlay.rebel-home .rebel-menu-item.is-selected::after { background: repeating-linear-gradient(135deg,transparent 0 3px,#0000000b 3px 4px),linear-gradient(110deg,#d02032,#a00b1e); transform: skewX(-5deg); }
#introOverlay.rebel-home .rebel-menu-item:not(:disabled):hover { background: none; box-shadow: none; border: 0; filter: none; }
#introOverlay.rebel-home .rebel-menu-item:active { transform: translateX(1.5cqw) rotate(-4deg) scale(.98); }
.rebel-pointer { width: 3cqw; min-width: 20px; font-size: .85em; text-align: center; opacity: 0; transform: translateX(-12px) rotate(-25deg); transition: opacity 100ms,transform 150ms cubic-bezier(.2,1.7,.4,1); }
.is-selected .rebel-pointer { opacity: 1; transform: none; }
.rebel-label { display: inline-block; }
#introOverlay.rebel-home .rebel-menu-item:focus-visible { outline: none; }
.rebel-menu-item:focus-visible .rebel-label { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 8px; }
.rebel-menu-item.is-selected .rebel-label { animation: rebel-type-hit 180ms ease-out; }
@keyframes rebel-type-hit { 0% { transform: translate(-5px,2px); text-shadow: 5px 0 #bd1124,-3px -1px #000; } 60% { transform: translate(2px,-1px); } 100% { transform: none; } }
#introOverlay.rebel-home .rebel-deck {
  position: absolute; left: max(3.5%,env(safe-area-inset-left)); bottom: 4.5%; width: 33%; height: 12%;
  display: flex; align-items: center; gap: 1.3cqw; border: 0; padding: 0 2cqw 0 0; border-radius: 0;
  background: none; color: var(--rebel-ivory); text-align: left; isolation: isolate; box-shadow: none; cursor: pointer;
  transition: transform 170ms; transform: rotate(-1deg); touch-action: manipulation;
}
.rebel-deck::before { content: ''; position: absolute; inset: 8% -2% 0 0; background: #111114ed; border-bottom: 3px solid #d32130; z-index: -1; clip-path: polygon(0 0,96% 0,100% 85%,2% 100%); }
#introOverlay.rebel-home .rebel-deck:hover { transform: translateX(7px) rotate(-2deg); }
.rebel-deck-art { position: relative; flex: 0 0 15%; height: 100%; }
.rebel-deck-art img,.rebel-deck-art i { position: absolute; height: 100%; width: 80%; object-fit: cover; object-position: top; border: 1px solid #d6b67d; background: #241319; transform: rotate(9deg); }
.rebel-deck-art i { display: grid; place-items: center; color: #d6b67d; font: 28px Georgia,serif; transform: rotate(-11deg) translate(-6%,5%); }
.rebel-deck-copy { display: grid; gap: 3px; min-width: 0; flex: 1; }
.rebel-deck-copy small { font: 400 clamp(10px,1.6cqh,15px)/1.2 'Songti SC',serif; color: #dbccb6; }
.rebel-deck-copy strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: 700 clamp(15px,2.8cqh,28px)/1.3 'Songti SC',serif; }
#introOverlay.rebel-home #homeDeckLeader { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 0; margin: 0; color: #baad9a; font: 400 clamp(9px,1.4cqh,13px)/1.3 system-ui,sans-serif; }
.rebel-chevron { font: 300 clamp(24px,5cqh,42px)/1 Georgia,serif; }
.rebel-footer { position: absolute; bottom: max(4%,env(safe-area-inset-bottom)); right: max(3.5%,env(safe-area-inset-right)); display: flex; align-items: center; gap: 1.6cqw; }
#introOverlay.rebel-home .rebel-utility { display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 5px 9px; margin: 0; color: #ffefd4; border: 0; border-radius: 0; box-shadow: none; background: #0b0b0caa; font: 500 clamp(13px,2.2cqh,22px)/1.3 'Songti SC',serif; cursor: pointer; transition: background 120ms,transform 120ms; list-style: none; white-space: nowrap; }
#introOverlay.rebel-home .rebel-utility:hover { background: #b01729; transform: skewY(-3deg); }
.rebel-utility::-webkit-details-marker { display: none; }
.rebel-utility span { font-family: Georgia,serif; font-size: 1.25em; }
.rebel-more-panel { position: absolute; right: 0; bottom: calc(100% + 15px); width: 290px; max-width: 85vw; max-height: 70dvh; overflow: auto; padding: 18px; background: #151518; border: 2px solid #f1dfbf; box-shadow: 8px 7px 0 #aa1021; }
.rebel-more:not([open]) .rebel-more-panel { display: none; }
#introOverlay.rebel-home .rebel-extra { display: block; width: 100%; padding: 12px; border: 0; margin: 0; border-radius: 0; background: transparent; color: #ffefd4; text-align: left; font: 18px 'Songti SC',serif; box-shadow: none; }
#introOverlay.rebel-home .rebel-extra:hover:not(:disabled) { background: #b01729; }
#introOverlay.rebel-home .rebel-extra:disabled { opacity: .35; }
#introOverlay.rebel-home .difficulty-panel { display: grid; gap: 12px; padding: 15px 0 0; margin-top: 8px; border: 0; border-top: 1px solid #736854; background: none; }
#introOverlay.rebel-home .difficulty-options { display: flex; gap: 4px; width: 100%; }
#introOverlay.rebel-home .difficulty-button { flex: 1; min-height: 36px; padding: 5px; border-radius: 0; background: #222226; box-shadow: none; border: 1px solid #6b6051; color: #e9dcc6; }
#introOverlay.rebel-home .difficulty-button.active { background: #b7192d; border-color: #f1dfbf; }
#introOverlay.rebel-home #homeNotice { position: absolute; bottom: .7%; left: 4%; right: 4%; min-height: 0; margin: 0; font: 11px/1.3 system-ui,sans-serif; color: #dac9ae; text-shadow: 0 1px 3px #000; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#introOverlay.rebel-home [hidden] { display: none !important; }
.rebel-atmosphere { position: absolute; inset: 0; pointer-events: none; overflow: hidden; z-index: 1; }
.rebel-atmosphere i { position: absolute; width: calc(8px + var(--i)*3px); height: calc(3px + var(--i)*1px); top: calc(18% + var(--i)*15%); left: 105%; background: #fff0d4; clip-path: polygon(0 50%,100% 0,70% 100%); opacity: 0; animation: rebel-petal calc(14s + var(--i)*2s) linear infinite; animation-delay: calc(var(--i)*-4s); animation-play-state: paused; }
.rebel-awake .rebel-atmosphere i { animation-play-state: running; }
@keyframes rebel-petal { 0% { translate: 0 0; rotate: -20deg; opacity: 0; } 8%,65% { opacity: .65; } 90%,100% { translate: -110vw 16vh; rotate: 180deg; opacity: 0; } }
.rebel-awake .rebel-header { animation: rebel-enter 380ms cubic-bezier(.16,1,.3,1) both; }
.rebel-awake .rebel-nav { animation: rebel-enter 420ms 70ms cubic-bezier(.16,1,.3,1) both; }
.rebel-awake .rebel-deck,.rebel-awake .rebel-footer { animation: rebel-enter 360ms 140ms cubic-bezier(.16,1,.3,1) both; }
@keyframes rebel-enter { from { opacity: 0; translate: -36px 8px; } to { opacity: 1; translate: 0 0; } }
.rebel-click-slash { position: fixed; height: 7px; background: #fff2d6; border-bottom: 3px solid #db2039; clip-path: polygon(0 80%,100% 0,86% 100%); opacity: 0; pointer-events: none; z-index: 10000; transform-origin: left center; }
@media (max-height: 550px) and (orientation: landscape) {
  .rebel-header { top: 2%; height: 23%; width: 39%; }
  #introOverlay.rebel-home .rebel-nav { top: 27%; gap: 1.1cqh; }
  #introOverlay.rebel-home .rebel-menu-item { height: 10.8cqh; font-size: clamp(19px,5.8cqh,32px); }
  #introOverlay.rebel-home .rebel-deck { height: 14%; bottom: 5%; width: 37%; }
  #introOverlay.rebel-home #homeDeckLeader { display: none; }
  .rebel-footer { gap: 4px; bottom: 4%; right: 2%; }
  #introOverlay.rebel-home .rebel-utility { padding: 4px 7px; font-size: 13px; min-height: 36px; }
  #introOverlay.rebel-home #homeNotice { font-size: 9px; }
  .rebel-more-panel { padding: 10px; bottom: calc(100% + 8px); max-height: 72dvh; width: 260px; }
  #introOverlay.rebel-home .rebel-extra { padding: 6px 10px; font-size: 14px; }
  #introOverlay.rebel-home .difficulty-panel { gap: 5px; padding-top: 8px; margin-top: 4px; }
  #introOverlay.rebel-home .difficulty-button { min-height: 30px; }
}
@media (max-aspect-ratio: 1/1) {
  .rebel-art { background-position: 60% center; }
  .rebel-art::after { background: linear-gradient(90deg,#09090be8,#09090b55); }
  .rebel-header { width: 85%; height: 19%; }
  #introOverlay.rebel-home .rebel-nav { width: 80%; top: 25%; }
  #introOverlay.rebel-home .rebel-menu-item { font-size: clamp(24px,7vw,40px); }
  #introOverlay.rebel-home .rebel-deck { width: 80%; bottom: 14%; height: 10%; }
  .rebel-footer { bottom: 5%; left: 4%; right: auto; }
}
@media (prefers-reduced-motion: reduce) {
  #introOverlay.rebel-home *,#introOverlay.rebel-home *::before,#introOverlay.rebel-home *::after { animation: none !important; transition: none !important; }
  #introOverlay.rebel-home .rebel-atmosphere { display: none; }
}
.salon-reduced-motion #introOverlay.rebel-home *, .salon-reduced-motion #introOverlay.rebel-home *::before, .salon-reduced-motion #introOverlay.rebel-home *::after { animation: none !important; transition: none !important; }
.salon-reduced-motion .rebel-atmosphere { display: none; }

/* Ink-cut destination sheets share the cover's red, ivory and offset geometry. */
#introOverlay.rebel-home .rebel-utility:disabled,
#introOverlay.rebel-home .rebel-utility:disabled:hover {
  background: #0b0b0e; color: #575459; opacity: .85; cursor: not-allowed; transform: none; box-shadow: none;
}
:is(#onlineOverlay,#settingsOverlay).rebel-dialog {
  --sheet-ivory: #fff0d6; --sheet-red: #ce2137;
  padding: clamp(16px,4vw,56px); color: var(--sheet-ivory);
  background: linear-gradient(115deg,#0b0b0de8 0 55%,#70101cdf 55% 58%,#0c0c0ef2 58%),url('./assets/ui/crown-rebellion-bg.webp') center/cover;
  backdrop-filter: none; font-family: 'PingFang SC','Microsoft YaHei',system-ui,sans-serif;
}
:is(#onlineOverlay,#settingsOverlay).rebel-dialog > section {
  position: relative; isolation: isolate; width: min(1040px,100%); max-height: calc(100dvh - 80px);
  padding: clamp(22px,3.5vw,48px); border: 0; border-top: 5px solid var(--sheet-ivory); border-radius: 0;
  background: #151518; color: var(--sheet-ivory); box-shadow: 12px 12px 0 #a71429,-5px -5px 0 #09090b;
  scrollbar-color: #c52a3f #151518; scrollbar-width: thin; overflow: auto;
}
:is(#onlineOverlay,#settingsOverlay).rebel-dialog:not(.hidden) > section { animation: rebel-sheet-enter 260ms cubic-bezier(.16,1,.3,1) both; }
@keyframes rebel-sheet-enter { from { opacity: 0; translate: 24px 16px; } to { opacity: 1; translate: 0 0; } }
:is(#onlineOverlay,#settingsOverlay).rebel-dialog .library-header {
  flex-direction: row; align-items: center; gap: 20px; margin: 0 0 28px; padding: 0 0 22px;
  border-bottom: 1px solid #fff0d633; background: none;
}
:is(#onlineOverlay,#settingsOverlay).rebel-dialog .library-header::after { width: 90px; height: 5px; bottom: -3px; background: var(--sheet-red); clip-path: polygon(0 0,100% 0,94% 100%,0 100%); }
:is(#onlineOverlay,#settingsOverlay).rebel-dialog .eyebrow { margin: 0 0 6px; color: #cbaea6; font: 800 10px/1.4 system-ui,sans-serif; letter-spacing: .26em; }
:is(#onlineOverlay,#settingsOverlay).rebel-dialog h2 { margin: 0; color: var(--sheet-ivory); font: 900 italic clamp(32px,4vw,52px)/1.15 'Songti SC','STSong',serif; letter-spacing: .03em; transform: rotate(-2deg); text-shadow: 3px 3px #a5142a; }
:is(#onlineOverlay,#settingsOverlay).rebel-dialog button {
  position: relative; min-height: 44px; padding: 10px 23px; border: 1px solid #fff0d650; border-radius: 0;
  background: #242428; color: var(--sheet-ivory); box-shadow: none; text-shadow: none; line-height: 1.3;
  font-family: inherit; font-size: 15px; font-weight: 750; letter-spacing: .03em;
  transition: translate 140ms,background 140ms,box-shadow 140ms; cursor: pointer;
}
:is(#onlineOverlay,#settingsOverlay).rebel-dialog button::before,
:is(#onlineOverlay,#settingsOverlay).rebel-dialog button::after { display: none; }
:is(#onlineOverlay,#settingsOverlay).rebel-dialog button:hover:not(:disabled) { background: var(--sheet-red); border-color: var(--sheet-ivory); translate: 3px -2px; transform: none; filter: none; box-shadow: -3px 3px 0 var(--sheet-ivory); }
:is(#onlineOverlay,#settingsOverlay).rebel-dialog button:active:not(:disabled) { translate: 0 1px; box-shadow: none; }
:is(#onlineOverlay,#settingsOverlay).rebel-dialog button:focus-visible,
:is(#onlineOverlay,#settingsOverlay).rebel-dialog input:focus-visible { outline: 2px solid #fff0d6; outline-offset: 4px; }
:is(#onlineOverlay,#settingsOverlay).rebel-dialog button:disabled { background: #1b1b1e; color: #777379; border-color: #48434b; opacity: .7; cursor: not-allowed; }
:is(#onlineOverlay,#settingsOverlay).rebel-dialog .library-header button { background: var(--sheet-ivory); color: #171719; border: 0; font-weight: 900; clip-path: polygon(8% 0,100% 0,92% 100%,0 100%); padding-inline: 26px; }
:is(#onlineOverlay,#settingsOverlay).rebel-dialog .library-header button:hover { background: var(--sheet-red); color: var(--sheet-ivory); }
#onlineOverlay.rebel-dialog .online-loadout-bar { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding: 13px 18px; margin-bottom: 24px; border: 0; border-left: 4px solid var(--sheet-red); border-radius: 0; background: #222226; }
#onlineOverlay.rebel-dialog .online-loadout-bar strong { color: #e2d5c4; font-size: 14px; font-weight: 550; }
#onlineOverlay.rebel-dialog .online-loadout-bar button { min-height: 36px; padding: 7px 13px; background: transparent; border: 0; border-bottom: 1px solid #c34351; font-size: 13px; }
#onlineOverlay.rebel-dialog .online-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; }
#onlineOverlay.rebel-dialog .online-card { position: relative; display: flex; flex-direction: column; gap: 18px; min-width: 0; padding: 27px 24px 24px; border: 1px solid #fff0d631; border-radius: 0; background: linear-gradient(155deg,#28282b,#19191c); overflow: hidden; }
#onlineOverlay.rebel-dialog .online-card::before { content: '01 / HOST'; position: static; display: block; margin: 0; padding: 0 0 12px; color: #ef6571; border-bottom: 2px solid #ce2137; font: 900 italic 12px/1.2 system-ui,sans-serif; letter-spacing: .15em; }
#onlineOverlay.rebel-dialog .online-card:nth-child(2)::before { content: '02 / JOIN'; }
#onlineOverlay.rebel-dialog .online-card > strong { color: var(--sheet-ivory); font: 900 italic 29px/1.2 'Songti SC','STSong',serif; }
#onlineOverlay.rebel-dialog .online-card p { flex: 1; color: #b6afb1; font-size: 14px; font-weight: 400; line-height: 1.7; max-width: 32em; }
#onlineOverlay.rebel-dialog .primary-button { background: var(--sheet-red); border: 1px solid #ff7180; color: var(--sheet-ivory); font-weight: 900; }
#onlineOverlay.rebel-dialog #createRoomButton { min-height: 50px; width: 100%; clip-path: polygon(3% 0,100% 0,97% 100%,0 100%); }
#onlineOverlay.rebel-dialog .join-row { gap: 8px; min-height: 50px; }
#onlineOverlay.rebel-dialog .join-row input { min-height: 50px; background: #0d0d10; border: 0; border-bottom: 2px solid #f1ddc1; border-radius: 0; color: var(--sheet-ivory); font-size: 14px; font-weight: 500; }
#onlineOverlay.rebel-dialog .join-row input::placeholder { color: #9d9497; }
#onlineOverlay.rebel-dialog .join-row button { min-height: 50px; background: var(--sheet-ivory); color: #161618; white-space: nowrap; padding: 10px 18px; }
#onlineOverlay.rebel-dialog :is(.room-share,.online-room-lobby) { background: #101013; border: 0; border-top: 1px solid #fff0d62b; border-radius: 0; padding: 18px 0 0; margin-top: 24px; }
#onlineOverlay.rebel-dialog .room-share span { color: #d1c6b9; font: 550 14px/1.5 system-ui,sans-serif; }
#onlineOverlay.rebel-dialog :is(.online-room-main strong,.online-room-main span,.online-room-players span) { color: var(--sheet-ivory); }
#onlineOverlay.rebel-dialog .online-room-players { border-radius: 0; border: 1px solid #524247; background: #272127; }
#onlineOverlay.rebel-dialog :is(.online-status,.online-room-lobby p) { color: #b6a6ab; font: 400 13px/1.6 system-ui,sans-serif; }
#onlineOverlay.rebel-dialog .online-ready-button.is-ready { color: #131316; background: #fff0d6; }
#settingsOverlay.rebel-dialog > section { width: min(850px,100%); }
#settingsOverlay.rebel-dialog .settings-section { position: relative; margin-bottom: 16px; padding: 20px 24px; gap: 14px; border: 0; border-left: 4px solid var(--sheet-red); border-radius: 0; background: #222226; }
#settingsOverlay.rebel-dialog .settings-section > strong { margin: 0; color: #eee1ce; font: 850 17px/1.4 system-ui,sans-serif; letter-spacing: .08em; }
#settingsOverlay.rebel-dialog .theme-options { display: flex; gap: 8px; }
#settingsOverlay.rebel-dialog .theme-button { flex: 1; background: #101013; border: 1px solid #4d464b; }
#settingsOverlay.rebel-dialog .theme-button.active { background: var(--sheet-ivory); color: #141416; border-color: var(--sheet-ivory); box-shadow: 3px 3px 0 var(--sheet-red); transform: skewX(-5deg); }
#settingsOverlay.rebel-dialog :is(.sound-preference,.salon-preferences) { margin: 0; padding: 0 24px; background: #1b1b1f; }
#settingsOverlay.rebel-dialog :is(.sound-preference,.salon-preferences) label { min-height: 58px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #fff0d61a; font: 550 15px/1.4 system-ui,sans-serif; color: #e3d7c7; cursor: pointer; }
#settingsOverlay.rebel-dialog input[type=checkbox] { appearance: none; position: relative; width: 52px; min-width: 52px; height: 28px; margin: 0; border: 1px solid #797077; border-radius: 0; background: #0b0b0d; box-shadow: none; cursor: pointer; transform: skewX(-9deg); }
#settingsOverlay.rebel-dialog input[type=checkbox]::after { content: ''; position: absolute; inset: 4px auto 4px 4px; width: 18px; border-radius: 0; background: #8f888d; box-shadow: none; transition: translate 140ms,background 140ms; translate: 0 0; }
#settingsOverlay.rebel-dialog input[type=checkbox]:checked { background: var(--sheet-red); border-color: #ff8c94; }
#settingsOverlay.rebel-dialog input[type=checkbox]:checked::after { translate: 24px 0; background: var(--sheet-ivory); }
@media (max-height: 550px) and (orientation: landscape) {
  :is(#onlineOverlay,#settingsOverlay).rebel-dialog { padding: 16px 24px; }
  :is(#onlineOverlay,#settingsOverlay).rebel-dialog > section { max-height: calc(100dvh - 32px); padding: 20px 24px; box-shadow: 6px 6px 0 #a71429; }
  :is(#onlineOverlay,#settingsOverlay).rebel-dialog .library-header { margin-bottom: 18px; padding-bottom: 16px; }
  :is(#onlineOverlay,#settingsOverlay).rebel-dialog h2 { font-size: 30px; }
  #onlineOverlay.rebel-dialog .online-loadout-bar { margin-bottom: 16px; }
  #onlineOverlay.rebel-dialog .online-grid { gap: 14px; }
  #onlineOverlay.rebel-dialog .online-card { padding: 18px; gap: 12px; }
  #onlineOverlay.rebel-dialog .online-card > strong { font-size: 24px; }
  #onlineOverlay.rebel-dialog .join-row { flex-wrap: wrap; }
  #onlineOverlay.rebel-dialog .join-row input { flex: 1 1 100%; }
  #onlineOverlay.rebel-dialog .join-row button { width: 100%; }
  #settingsOverlay.rebel-dialog .settings-section { padding: 14px 18px; }
}
@media (max-width: 600px) { #onlineOverlay.rebel-dialog .online-grid { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) {
  :is(#onlineOverlay,#settingsOverlay).rebel-dialog *,:is(#onlineOverlay,#settingsOverlay).rebel-dialog *::after { animation: none !important; transition: none !important; }
}
.salon-reduced-motion :is(#onlineOverlay,#settingsOverlay).rebel-dialog *,
.salon-reduced-motion :is(#onlineOverlay,#settingsOverlay).rebel-dialog *::after { animation: none !important; transition: none !important; }

/* Reference composition: dominant invitation, narrow ink pennants, quiet footer. */
#introOverlay.rebel-home .rebel-header { left: max(2.5%,env(safe-area-inset-left)); top: 2.2%; width: 35%; height: 23%; max-width: none; }
#introOverlay.rebel-home .rebel-art::after { background: linear-gradient(90deg,#09090b15,transparent 40%); }
#introOverlay.rebel-home .rebel-nav { left: max(.8%,env(safe-area-inset-left)); top: 28%; width: 40%; gap: 1.3cqh; }
#introOverlay.rebel-home .rebel-menu-item {
  --lean: -6deg; height: 10.2cqh; padding: 0 2.5cqw 0 1.5cqw; gap: .7cqw;
  font-size: clamp(21px,6.5cqh,76px); letter-spacing: -.025em; transform: rotate(var(--lean));
}
#introOverlay.rebel-home .rebel-menu-item:first-child { width: 100%; height: 16cqh; font-size: clamp(29px,9cqh,104px); --lean: -5deg; }
#introOverlay.rebel-home .rebel-menu-item:nth-child(2) { margin-left: 6.8cqw; --lean: -7deg; }
#introOverlay.rebel-home .rebel-menu-item:nth-child(3) { margin-left: 8.5cqw; --lean: -6deg; }
#introOverlay.rebel-home .rebel-menu-item:nth-child(4) { margin-left: 6.8cqw; --lean: -8deg; }
#introOverlay.rebel-home .rebel-menu-item:not(:first-child) .rebel-pointer { position: absolute; left: -1.8cqw; width: 2cqw; font-size: .65em; }
#introOverlay.rebel-home .rebel-menu-item::before { inset: 5% -1% -4%; background: #d9cdbb; clip-path: polygon(9% 13%,100% 0,86% 55%,90% 62%,0 100%,7% 28%,0 32%); }
#introOverlay.rebel-home .rebel-menu-item::after { inset: 7% -.5% -1%; background: #09090bf5; clip-path: polygon(9% 13%,100% 0,86% 55%,90% 62%,0 100%,7% 28%,0 32%); }
#introOverlay.rebel-home .rebel-menu-item:first-child::before { background: #fff1d6; clip-path: polygon(7% 2%,100% 0,85% 76%,89% 68%,84% 100%,1% 91%,10% 46%,0 51%); }
#introOverlay.rebel-home .rebel-menu-item:first-child::after { inset: 9% 1% 2%; background: repeating-linear-gradient(135deg,transparent 0 3px,#00000015 3px 4px),linear-gradient(105deg,#b50b20,#ca1429 65%,#910c1d); clip-path: polygon(7% 2%,100% 0,84% 100%,1% 91%,10% 46%,0 51%); }
#introOverlay.rebel-home .rebel-menu-item:first-child .rebel-pointer { width: 4cqw; opacity: 1; transform: none; font-size: .74em; }
#introOverlay.rebel-home .rebel-menu-item.is-selected { transform: rotate(var(--lean)); }
#introOverlay.rebel-home .rebel-menu-item.is-selected::before,
#introOverlay.rebel-home .rebel-menu-item.is-selected::after { transform: none; }
#introOverlay.rebel-home .rebel-menu-item:not(:first-child).is-selected::after { background: #09090b; }
#introOverlay.rebel-home .rebel-menu-item:is(:hover,:focus-visible) { color: #0b0b0e; text-shadow: none; transform: translateX(.7cqw) rotate(var(--lean)) scale(1.025); }
#introOverlay.rebel-home .rebel-menu-item:not(:disabled):is(:hover,:focus-visible)::before { background: #9e1024; transform: translate(-3px,4px); }
#introOverlay.rebel-home .rebel-menu-item:not(:disabled):is(:hover,:focus-visible)::after { background: #fffaf0; }
#introOverlay.rebel-home .rebel-menu-item:is(:hover,:focus-visible) .rebel-label { text-shadow: none; text-decoration: none; animation: none; }
#introOverlay.rebel-home .rebel-menu-item:active { transform: translateX(.9cqw) rotate(var(--lean)) scale(.985); }
#introOverlay.rebel-home .rebel-deck { left: max(3.5%,env(safe-area-inset-left)); bottom: 5.7%; width: 30%; height: 11.5%; gap: 1.6cqw; }
#introOverlay.rebel-home .rebel-deck-art { flex-basis: 20%; }
#introOverlay.rebel-home .rebel-deck::before { inset: 10% -2% 3% 0; background: #101013f2; clip-path: polygon(0 0,95% 5%,100% 90%,2% 100%); }
#introOverlay.rebel-home #homeDeckLeader { display: none; }
#introOverlay.rebel-home #homeNotice:empty,
#introOverlay.rebel-home #homeNotice { bottom: .5%; font-size: 10px; opacity: .65; }
#introOverlay.rebel-home .rebel-deck-copy strong { font-size: clamp(13px,3cqh,29px); }
#introOverlay.rebel-home .rebel-footer { right: max(3.3%,env(safe-area-inset-right)); bottom: max(5%,env(safe-area-inset-bottom)); gap: 10px; }
#introOverlay.rebel-home .rebel-utility { background: none; font-size: clamp(12px,2.3cqh,21px); }
#introOverlay.rebel-home .rebel-utility svg { width: 1.4em; height: 1.4em; }
#introOverlay.rebel-home #settingsButton { border-left: 1px solid #c7b89777; padding-left: 16px; }
#introOverlay.rebel-home #settingsButton:hover { color: #101013; background: #fffaf0; }
#introOverlay.rebel-home .rebel-utility:disabled { background: #0b0b0caa; color: #575459; }
#settingsOverlay.rebel-dialog .rebel-more { margin-top: 18px; }
#settingsOverlay.rebel-dialog .rebel-more > summary { display: flex; justify-content: space-between; padding: 12px 24px; color: #eee1ce; font: 650 14px/1.4 system-ui,sans-serif; cursor: pointer; background: #242428; border-left: 3px solid #ce2137; }
#settingsOverlay.rebel-dialog .rebel-more > summary:hover { background: #fff0d6; color: #141416; }
#settingsOverlay.rebel-dialog .rebel-more-panel { position: static; width: 100%; max-width: none; max-height: none; box-sizing: border-box; padding: 12px; margin: 0; border: 0; box-shadow: none; }
#settingsOverlay.rebel-dialog .rebel-extra { width: 100%; margin: 0 0 5px; text-align: left; }
#settingsOverlay.rebel-dialog .difficulty-panel { display: grid; padding: 14px 8px; gap: 12px; border-top: 1px solid #fff0d633; background: none; }
#settingsOverlay.rebel-dialog .difficulty-options { display: flex; gap: 8px; }
#settingsOverlay.rebel-dialog .difficulty-button { flex: 1; }
#settingsOverlay.rebel-dialog .difficulty-button.active { background: #ce2137; }
@media (max-height: 550px) and (orientation: landscape) {
  #introOverlay.rebel-home .rebel-menu-item { font-size: clamp(19px,6.5cqh,36px); }
  #introOverlay.rebel-home .rebel-menu-item:first-child { font-size: clamp(26px,9cqh,50px); }
  #introOverlay.rebel-home .rebel-deck { width: 32%; }
  #introOverlay.rebel-home .rebel-utility { min-height: 36px; padding: 4px 7px; }
}
@media (max-aspect-ratio: 1/1) {
  #introOverlay.rebel-home .rebel-header { width: 78%; height: 20%; }
  #introOverlay.rebel-home .rebel-nav { width: 76%; top: 27%; }
  #introOverlay.rebel-home .rebel-menu-item { height: 9cqh; font-size: clamp(24px,7vw,40px); }
  #introOverlay.rebel-home .rebel-menu-item:first-child { height: 13cqh; font-size: clamp(30px,9vw,52px); }
  #introOverlay.rebel-home .rebel-deck { width: 72%; bottom: 14%; height: 10%; }
  #introOverlay.rebel-home .rebel-footer { bottom: 5%; left: 4%; right: auto; }
}

/* Five destinations keep the new rules visible without displacing the deck footer. */
#introOverlay.rebel-home .rebel-nav { top: 30%; gap: .8cqh; }
#introOverlay.rebel-home .rebel-menu-item { height: 8cqh; font-size: 40px; letter-spacing: 0; --lean: -3deg; }
#introOverlay.rebel-home .rebel-menu-item:first-child { height: 13cqh; font-size: 56px; --lean: -3deg; }
#introOverlay.rebel-home .rebel-menu-item:nth-child(n+2) { --lean: -3deg; }
#introOverlay.rebel-home .rebel-menu-item:nth-child(5) { margin-left: 8.5cqw; }
@media (max-width: 1080px) {
  #introOverlay.rebel-home .rebel-menu-item { font-size: 30px; }
  #introOverlay.rebel-home .rebel-menu-item:first-child { font-size: 42px; }
}
@media (max-height: 550px) and (orientation: landscape) {
  #introOverlay.rebel-home .rebel-menu-item:nth-child(n) { font-size: 19px; --lean: -2deg; }
  #introOverlay.rebel-home .rebel-menu-item:first-child { font-size: 28px; }
}
@media (max-aspect-ratio: 1/1) {
  #introOverlay.rebel-home .rebel-nav { top: 25%; gap: .6cqh; }
  #introOverlay.rebel-home .rebel-menu-item { height: 7.4cqh; font-size: 26px; }
  #introOverlay.rebel-home .rebel-menu-item:first-child { height: 12cqh; font-size: 38px; }
}