:root {
  color-scheme: dark;
  --bg: #070913;
  --surface: rgba(18, 21, 35, 0.9);
  --surface-strong: rgba(29, 33, 52, 0.94);
  --panel: rgba(20, 23, 38, 0.94);
  --ink: #fbfbff;
  --muted: #b9c0d4;
  --line: rgba(150, 163, 199, 0.2);
  --primary: #5865f2;
  --primary-strong: #8ea1ff;
  --cyan: #22d3ee;
  --amber: #fee75c;
  --rose: #eb459e;
  --violet: #9b6dff;
  --mint: #57f287;
  --success: #3ba55d;
  --danger: #ed4245;
  --shadow: 0 14px 38px rgba(0, 0, 0, 0.36);
  --shadow-color: 0 16px 44px rgba(88, 101, 242, 0.14);
  --glow-primary: 0 0 0 1px rgba(88, 101, 242, 0.34), 0 12px 34px rgba(88, 101, 242, 0.18);
  --radius: 8px;
  --page-bg:
    linear-gradient(145deg, rgba(88, 101, 242, 0.18) 0%, rgba(88, 101, 242, 0.07) 24%, transparent 58%),
    linear-gradient(220deg, rgba(34, 211, 238, 0.08) 0%, transparent 44%),
    linear-gradient(32deg, rgba(235, 69, 158, 0.07) 0%, transparent 42%),
    linear-gradient(180deg, #111526 0%, #090b16 48%, #090b16 100%),
    var(--bg);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  letter-spacing: 0;
}

/* Premium: marque blanche, multi-serveurs et comparaison de périodes */
.premium-feature-lock,
.panel-section.premium-feature-lock {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 22px;
  align-items: center;
  min-height: 240px;
  padding: clamp(24px, 4vw, 48px);
  border: 1px solid rgba(139, 120, 255, 0.28);
  border-radius: 22px;
  background: linear-gradient(135deg, rgba(88, 101, 242, 0.12), rgba(153, 92, 255, 0.08));
}

.premium-feature-lock > span {
  display: grid;
  place-items: center;
  width: 74px;
  height: 74px;
  border: 1px solid rgba(106, 196, 255, 0.35);
  border-radius: 22px;
  color: #9eeaff;
  background: rgba(88, 101, 242, 0.18);
}

.premium-feature-lock > span svg {
  width: 34px;
  height: 34px;
}

.premium-feature-lock h2,
.premium-feature-lock h3 {
  margin: 5px 0 8px;
}

.premium-feature-lock p {
  max-width: 760px;
  margin: 0 0 20px;
  color: var(--muted);
  line-height: 1.65;
}

.premium-workspace-heading p {
  max-width: 760px;
}

.premium-workspace-form {
  margin-top: 22px;
}

.premium-workspace-selector {
  min-width: 0;
  margin: 0;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 18px;
}

.premium-workspace-selector legend {
  padding: 0 8px;
  color: var(--ink);
  font-weight: 900;
}

.premium-workspace-selector > p {
  margin: 0 0 14px;
  color: var(--muted);
}

.premium-workspace-selector > div,
.premium-workspace-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
  gap: 12px;
}

.premium-workspace-choice {
  display: grid;
  grid-template-columns: auto auto minmax(0, 1fr) auto;
  gap: 11px;
  align-items: center;
  min-width: 0;
  padding: 12px;
  border: 1px solid rgba(148, 163, 255, 0.2);
  border-radius: 14px;
  background: rgba(7, 12, 29, 0.46);
  cursor: pointer;
}

.premium-workspace-choice:has(input:checked) {
  border-color: rgba(92, 224, 255, 0.55);
  background: rgba(88, 101, 242, 0.14);
}

.premium-workspace-choice .guild-avatar,
.premium-workspace-server .guild-avatar {
  width: 42px;
  height: 42px;
  border-radius: 13px;
}

.premium-workspace-choice span,
.premium-workspace-server-head > span:nth-child(2) {
  min-width: 0;
}

.premium-workspace-choice strong,
.premium-workspace-choice small,
.premium-workspace-server-head strong,
.premium-workspace-server-head small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.premium-workspace-choice small,
.premium-workspace-server-head small {
  color: var(--muted);
}

.premium-workspace-choice em {
  color: #8df4cf;
  font-size: 0.72rem;
  font-style: normal;
  font-weight: 900;
  text-transform: uppercase;
}

.premium-workspace-stats {
  margin-block: 20px;
}

.premium-workspace-server {
  display: grid;
  gap: 16px;
}

.premium-workspace-server-head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
}

.premium-workspace-server .row-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.premium-workspace-server .button {
  justify-content: center;
  min-width: 0;
}

.white-label-editor {
  display: grid;
  gap: 18px;
}

.white-label-fields {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(280px, 0.7fr);
  gap: 16px;
}

.white-label-scope-card ul {
  display: grid;
  gap: 12px;
  margin: 20px 0 0;
  padding: 0;
  list-style: none;
}

.white-label-scope-card li {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  color: #dce5ff;
}

.white-label-scope-card li svg {
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
  color: #78f2ca;
}

.white-label-preview,
.portal-white-label {
  display: flex;
  gap: 16px;
  align-items: center;
  padding: 18px;
  border: 1px solid color-mix(in srgb, var(--white-label-accent, var(--portal-brand-accent, #5865f2)) 55%, transparent);
  border-radius: 18px;
  background: linear-gradient(120deg, color-mix(in srgb, var(--white-label-accent, var(--portal-brand-accent, #5865f2)) 17%, transparent), rgba(8, 13, 30, 0.82));
}

.white-label-preview-logo,
.portal-white-label-logo {
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  flex: 0 0 auto;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 17px;
  background: rgba(255, 255, 255, 0.07);
}

.white-label-preview-logo img,
.portal-white-label-logo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.white-label-preview > span:nth-child(2),
.portal-white-label > span:nth-child(2) {
  min-width: 0;
  flex: 1;
}

.white-label-preview small,
.white-label-preview strong,
.white-label-preview em,
.portal-white-label small,
.portal-white-label strong,
.portal-white-label em {
  display: block;
}

.white-label-preview strong,
.portal-white-label strong {
  font-size: 1.15rem;
}

.white-label-preview small,
.white-label-preview em,
.portal-white-label small,
.portal-white-label em {
  color: var(--muted);
  font-size: 0.78rem;
  font-style: normal;
}

.comparative-stats-card {
  margin-top: 20px;
}

.comparative-period-form {
  display: flex;
  gap: 10px;
  align-items: end;
}

.comparative-period-form label {
  min-width: 150px;
}

.comparison-period-labels {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 24px;
  margin: 18px 0;
}

.comparison-period-labels span {
  display: flex;
  gap: 7px;
  align-items: center;
  color: var(--muted);
  font-size: 0.82rem;
}

.comparison-period-labels i {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #69ddff;
}

.comparison-period-labels span:last-child i {
  background: #9f8cff;
}

.comparative-metric-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
}

.comparative-metric {
  display: grid;
  gap: 5px;
  padding: 16px;
  border: 1px solid rgba(148, 163, 255, 0.18);
  border-radius: 15px;
  background: rgba(7, 12, 29, 0.46);
}

.comparative-metric > span,
.comparative-metric small {
  color: var(--muted);
}

.comparative-metric strong {
  font-size: 1.45rem;
}

.comparative-metric em {
  display: flex;
  gap: 5px;
  align-items: center;
  width: max-content;
  margin-top: 5px;
  padding: 4px 8px;
  border-radius: 999px;
  font-size: 0.74rem;
  font-style: normal;
  font-weight: 900;
}

.comparative-metric em svg {
  width: 14px;
  height: 14px;
}

.comparative-metric .is-positive { color: #8df4cf; background: rgba(35, 165, 89, 0.14); }
.comparative-metric .is-negative { color: #ff9ca9; background: rgba(237, 66, 69, 0.14); }
.comparative-metric .is-neutral { color: #c8d0e8; background: rgba(255, 255, 255, 0.06); }

@media (max-width: 820px) {
  .white-label-fields {
    grid-template-columns: minmax(0, 1fr);
  }

  .premium-workspace-server .row-actions,
  .premium-workspace-selector > div,
  .premium-workspace-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .comparative-period-form,
  .portal-white-label {
    align-items: stretch;
    flex-direction: column;
  }
}

@media (max-width: 560px) {
  .premium-feature-lock {
    grid-template-columns: minmax(0, 1fr);
  }

  .premium-workspace-choice {
    grid-template-columns: auto auto minmax(0, 1fr);
  }

  .premium-workspace-choice em {
    grid-column: 3;
  }

  .premium-workspace-server-head {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .premium-workspace-server-head .status-pill {
    grid-column: 2;
    justify-self: start;
  }
}

/* Maintenance publique — composition dédiée */
.maintenance-body{min-height:100vh;display:block;padding:22px;color:#f8f9ff;background:radial-gradient(circle at 8% 8%,rgba(88,101,242,.2),transparent 32rem),radial-gradient(circle at 92% 14%,rgba(34,211,238,.1),transparent 30rem),radial-gradient(circle at 62% 110%,rgba(171,92,255,.12),transparent 34rem),linear-gradient(145deg,#11152c 0%,#090c1a 48%,#070914 100%);background-attachment:scroll}
.maintenance-body::before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.3;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:40px 40px;mask-image:linear-gradient(#000,transparent 92%)}
.maintenance-shell{position:relative;z-index:1;width:min(1220px,100%);min-height:calc(100vh - 44px);margin:0 auto;display:flex;flex-direction:column}
.maintenance-panel{border:1px solid rgba(150,163,199,.18);border-radius:22px;background:linear-gradient(145deg,rgba(26,30,56,.9),rgba(11,14,29,.94));box-shadow:0 30px 90px rgba(0,0,0,.36),inset 0 1px rgba(255,255,255,.045)}
.maintenance-topbar,.maintenance-footer{display:flex;align-items:center;justify-content:space-between;gap:18px}
.maintenance-topbar{min-height:60px;padding:0 5px 18px;border-bottom:1px solid rgba(150,163,199,.17)}
.maintenance-brand{display:inline-flex;align-items:center;gap:11px}.maintenance-brand img{width:40px;height:40px;object-fit:contain;filter:drop-shadow(0 0 16px rgba(88,101,242,.38))}.maintenance-brand span{display:grid}.maintenance-brand strong{color:#fff;font-size:1.05rem}.maintenance-brand small{margin-top:1px;color:#919abc;font-size:.68rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase}
.maintenance-live{display:inline-flex;align-items:center;gap:8px;padding:9px 13px;border:1px solid rgba(254,231,92,.23);border-radius:999px;color:#fff1b3;background:rgba(254,231,92,.085);font-size:.78rem;font-weight:850}.maintenance-live i{width:8px;height:8px;border-radius:50%;background:#fee75c;box-shadow:0 0 0 5px rgba(254,231,92,.09)}
.maintenance-layout{flex:1;display:grid;grid-template-columns:minmax(0,1.35fr) minmax(340px,.72fr);gap:18px;padding:18px 0}
.maintenance-hero{position:relative;overflow:hidden;min-height:600px;display:flex;flex-direction:column;justify-content:space-between;padding:clamp(32px,5.2vw,66px)}.maintenance-hero::after{content:"";position:absolute;width:440px;height:440px;right:-220px;top:-210px;border-radius:50%;background:rgba(88,101,242,.18);box-shadow:0 0 100px rgba(34,211,238,.07)}.maintenance-hero>*{position:relative;z-index:1}
.maintenance-eyebrow{width:fit-content;display:inline-flex;align-items:center;gap:8px;padding:8px 11px;border:1px solid rgba(34,211,238,.2);border-radius:999px;color:#a9edff;background:rgba(34,211,238,.07);font-size:.73rem;font-weight:900;letter-spacing:.07em;text-transform:uppercase}.maintenance-eyebrow svg{width:15px;height:15px}
.maintenance-hero-copy{margin:clamp(44px,8vh,86px) 0 42px}.maintenance-panel h1{margin:0;max-width:700px;text-align:left;font-size:clamp(3rem,6.3vw,5.4rem);line-height:.96;letter-spacing:-.055em}.maintenance-panel h1 span{color:transparent;background:linear-gradient(100deg,#a89cff,#7f8cff 48%,#4fddff);background-clip:text;-webkit-background-clip:text}.maintenance-text{max-width:680px;margin:27px 0 0;text-align:left;color:#e3e7f8;font-size:1.08rem;line-height:1.65}.maintenance-reassurance{max-width:680px;margin:12px 0 0;color:#969fbe;line-height:1.62}.maintenance-actions{justify-content:flex-start}.maintenance-actions .button{min-height:48px;border-radius:11px}
.maintenance-side{display:grid;grid-template-rows:auto 1fr;gap:18px}.maintenance-status-card,.maintenance-progress-card{padding:25px}.maintenance-card-heading{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:21px}.maintenance-card-heading>span{display:grid;gap:4px}.maintenance-card-heading small{color:#828dac;font-size:.68rem;font-weight:850;letter-spacing:.08em;text-transform:uppercase}.maintenance-card-heading strong{color:#fff;font-size:1.08rem}.maintenance-card-heading>svg{width:21px;color:#8290ff}
.maintenance-summary{display:grid;grid-template-columns:1fr;gap:10px}.maintenance-summary article{display:grid;grid-template-columns:42px minmax(0,1fr) auto;align-items:center;gap:12px;padding:12px;border:1px solid rgba(150,163,199,.16);border-radius:14px;background:rgba(255,255,255,.035)}.maintenance-service-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:11px;color:#bbc3ff;background:rgba(88,101,242,.13)}.maintenance-service-icon svg{width:20px}.maintenance-summary article>span:nth-child(2){display:grid;gap:3px}.maintenance-summary strong{margin:0;color:#fff;font-size:.88rem}.maintenance-summary small{color:#8f98b6;font-size:.72rem}.maintenance-summary em{padding:6px 8px;border-radius:999px;font-size:.68rem;font-style:normal;font-weight:850}.maintenance-summary .is-paused em{color:#ffe9a4;background:rgba(254,231,92,.09)}.maintenance-summary .is-online em{color:#9df2ca;background:rgba(87,242,135,.09)}
.maintenance-progress-card{display:flex;flex-direction:column}.maintenance-steps{display:grid}.maintenance-steps>div{position:relative;display:grid;grid-template-columns:31px minmax(0,1fr);gap:12px;padding-bottom:22px}.maintenance-steps>div:not(:last-child)::after{content:"";position:absolute;left:15px;top:31px;bottom:3px;width:1px;background:rgba(150,163,199,.17)}.maintenance-steps>div>svg{width:31px;height:31px;padding:8px;border:1px solid rgba(150,163,199,.18);border-radius:50%;color:#8089a6;background:#11152a}.maintenance-steps .is-done>svg{color:#09291c;border-color:transparent;background:#57e1a3}.maintenance-steps .is-current>svg{color:#fff;border-color:#8792ff;background:#6875ff;box-shadow:0 0 0 5px rgba(104,117,255,.09)}.maintenance-steps span{display:grid;gap:4px;padding-top:4px}.maintenance-steps strong{color:#fff;font-size:.85rem}.maintenance-steps small{color:#929bb9;font-size:.75rem;line-height:1.45}
.maintenance-note{margin:auto 0 0;display:grid;grid-template-columns:18px minmax(0,1fr);gap:10px;padding:13px;border:1px solid rgba(34,211,238,.16);border-radius:12px;text-align:left;color:#bdefff;background:rgba(34,211,238,.05);font-size:.74rem;line-height:1.5}.maintenance-note svg{width:17px}.maintenance-note span{display:grid;gap:2px}.maintenance-note strong{color:#e7faff}.maintenance-footer{min-height:43px;padding:12px 5px 0;border-top:1px solid rgba(150,163,199,.17);color:#7f88a6;font-size:.74rem}
@media(max-width:900px){.maintenance-layout{grid-template-columns:1fr}.maintenance-hero{min-height:520px}.maintenance-side{grid-template-columns:1fr 1fr;grid-template-rows:auto}}
@media(max-width:680px){.maintenance-body{padding:12px}.maintenance-shell{min-height:calc(100vh - 24px)}.maintenance-brand small{display:none}.maintenance-live{padding:8px 10px;font-size:.68rem}.maintenance-layout{gap:12px;padding:12px 0}.maintenance-panel{padding:20px;border-radius:17px}.maintenance-hero{min-height:500px;padding:25px 20px}.maintenance-panel h1{font-size:clamp(2.7rem,14vw,4rem)}.maintenance-text{font-size:.98rem}.maintenance-side{grid-template-columns:1fr;gap:12px}.maintenance-status-card,.maintenance-progress-card{padding:20px}.maintenance-actions,.maintenance-actions .button{width:100%}.maintenance-summary{grid-template-columns:1fr}.maintenance-summary article{grid-template-columns:40px minmax(0,1fr)}.maintenance-summary em{grid-column:2;width:fit-content}}

/* Editeur de theme serveur Premium. */
.theme-editor {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 380px);
  gap: clamp(20px, 3vw, 32px);
  align-items: start;
}

.emoji-picker-label { min-width: 0; }
.emoji-picker { position: relative; display: grid; grid-template-columns: minmax(0,1fr) 48px; gap: 7px; min-width: 0; }
.emoji-picker > input { width: 100%; min-width: 0; }
.emoji-picker-toggle { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; gap: 3px; padding: 7px; border: 1px solid rgba(142,161,255,.24); border-radius: 9px; color: #fff; background: rgba(88,101,242,.12); cursor: pointer; }
.emoji-picker-toggle span { font-size: 1.15rem; line-height: 1; }
.emoji-picker-toggle svg { width: 14px; height: 14px; }
.emoji-picker-menu { position: absolute; z-index: 50; top: calc(100% + 7px); right: 0; width: min(280px,82vw); padding: 11px; border: 1px solid rgba(142,161,255,.3); border-radius: 11px; background: #14192b; box-shadow: 0 20px 44px rgba(0,0,0,.42); }
.emoji-picker-menu[hidden] { display: none; }
.emoji-picker-grid { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 6px; }
.emoji-picker-grid button { min-height: 38px; display: grid; place-items: center; padding: 5px; border: 1px solid transparent; border-radius: 7px; color: #fff; background: rgba(255,255,255,.045); font-size: 1.15rem; cursor: pointer; }
.emoji-picker-grid button:hover { border-color: rgba(142,161,255,.38); background: rgba(88,101,242,.18); }
.emoji-picker-clear { width: 100%; display: flex; align-items: center; justify-content: center; gap: 7px; margin-top: 9px; padding: 8px; border: 0; border-radius: 7px; color: #f2b8bd; background: rgba(237,66,69,.1); font: inherit; font-size: .76rem; font-weight: 850; cursor: pointer; }
.emoji-picker-clear svg { width: 15px; height: 15px; }
.guild-section-panels .guild-page-panels { overflow: visible; }

.theme-editor-fields { display: grid; gap: 18px; min-width: 0; }
.panel-card.theme-field-card { padding: clamp(18px, 2.4vw, 24px); }
.theme-field-card.is-locked { border-style: dashed; }
.theme-card-heading { display: flex; align-items: center; gap: 13px; }
.theme-card-heading > span { width: 42px; height: 42px; flex: 0 0 42px; display: grid; place-items: center; border: 1px solid rgba(142,161,255,.22); border-radius: 10px; color: #aeb8ff; background: rgba(88,101,242,.12); }
.theme-card-heading h3,.theme-card-heading p { margin: 0; }
.theme-card-heading p { margin-top: 3px; color: var(--muted); }
.settings-grid.theme-color-grid { grid-template-columns: minmax(180px,1.4fr) repeat(3,minmax(100px,.55fr)); }
.theme-color-grid input[type="color"] { width: 100%; min-height: 46px; padding: 5px; cursor: pointer; }

.theme-premium-lock { display: flex; align-items: center; gap: 13px; min-width: 0; padding: 15px; border: 1px solid rgba(250,204,21,.18); border-radius: 10px; background: rgba(250,204,21,.055); }
.theme-premium-lock > svg { width: 23px; height: 23px; flex: 0 0 23px; color: #f8d66d; }
.theme-premium-lock > span { display: grid; gap: 3px; min-width: 0; margin-right: auto; }
.theme-premium-lock small { color: var(--muted); line-height: 1.4; }

.theme-preview-panel { position: sticky; top: 92px; display: grid; gap: 14px; min-width: 0; padding: 18px; border: 1px solid rgba(142,161,255,.25); border-radius: 14px; background: linear-gradient(145deg,rgba(27,32,53,.98),rgba(11,15,28,.98)); box-shadow: 0 22px 48px rgba(0,0,0,.28); }
.theme-preview-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.theme-preview-heading > span { display: inline-flex; align-items: center; gap: 8px; color: #fff; font-weight: 900; }
.theme-preview-heading svg { width: 18px; height: 18px; color: #9ca8ff; }
.theme-preview-heading small { color: var(--muted); font-weight: 750; }
.theme-preview-selector { display: grid; gap: 7px; color: #dce2f6; font-size: .8rem; font-weight: 850; }
.discord-message-preview { display: grid; grid-template-columns: 38px minmax(0,1fr); gap: 10px; padding: 15px 12px; border-radius: 10px; background: #313338; }
.discord-message-avatar { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: linear-gradient(145deg,#5865f2,#22c7d9); font-weight: 950; }
.discord-message-main { display: grid; gap: 7px; min-width: 0; }
.discord-message-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.discord-message-meta strong { color: #f2f3f5; font-size: .88rem; }
.discord-message-meta span { padding: 2px 4px; border-radius: 3px; color: #fff; background: #5865f2; font-size: .58rem; font-weight: 900; }
.discord-message-meta small { color: #949ba4; font-size: .68rem; }
.discord-theme-preview { position: relative; overflow: hidden; display: grid; grid-template-columns: 5px minmax(0,1fr); border-radius: 9px; color: #dbdee1; background: #2b2d31; box-shadow: 0 14px 30px rgba(0,0,0,.24); }
.discord-preview-bar { background: var(--preview-accent,#5865f2); }
.discord-preview-content { display: grid; gap: 12px; padding: 18px 16px; min-width: 0; }
.discord-preview-content > small { color: #b5bac1; font-size: .75rem; font-weight: 800; text-transform: uppercase; }
.discord-preview-content > strong { color: #f2f3f5; font-size: 1.08rem; }
.discord-preview-content > p { margin: 0; color: #dbdee1; font-size: .88rem; line-height: 1.5; }
.discord-staff-availability { display: flex; align-items: center; gap: 9px; padding: 9px 10px; border-radius: 6px; background: rgba(255,255,255,.045); }
.discord-staff-availability[hidden] { display: none; }
.staff-live-dot { width: 9px; height: 9px; flex: 0 0 9px; border-radius: 50%; background: #23a559; box-shadow: 0 0 0 4px rgba(35,165,89,.14); }
.discord-staff-availability > span:last-child { display: grid; gap: 2px; }
.discord-staff-availability small { color: #b5bac1; font-size: .68rem; }
.discord-staff-availability strong { color: #f2f3f5; font-size: .76rem; }
.discord-preview-image-wrap { position: relative; display: grid; gap: 6px; }
.discord-preview-image-wrap[hidden] { display: none; }
.discord-preview-image { display: block; width: 100%; max-height: 260px; border-radius: 4px; object-fit: contain; background: rgba(0,0,0,.12); }
.discord-preview-image-wrap > small { color: #f0c36a; font-size: .68rem; font-weight: 800; }
.discord-preview-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.discord-preview-fields span { display: grid; gap: 3px; min-width: 0; }
.discord-preview-fields small { color: #b5bac1; font-size: .7rem; }
.discord-preview-fields b { color: #f2f3f5; font-size: .78rem; overflow-wrap: anywhere; }
.discord-message-main > .discord-preview-button { justify-self: start; min-height: 34px; padding: 7px 13px; border: 0; border-radius: 4px; color: #fff; background: #5865f2; font: inherit; font-size: .82rem; font-weight: 800; }
.discord-preview-button.is-secondary { background: #4e5058; }
.discord-preview-button.is-success { background: #248046; }
.discord-preview-button.is-danger { background: #da373c; }
.discord-preview-content footer { min-height: 24px; display: flex; align-items: center; gap: 7px; padding-top: 9px; border-top: 1px solid rgba(255,255,255,.08); color: #b5bac1; font-size: .72rem; overflow-wrap: anywhere; }
.discord-preview-content footer img { width: 20px; height: 20px; flex: 0 0 20px; border-radius: 50%; object-fit: cover; }
.discord-preview-content footer img[hidden] { display: none; }
.theme-save-button { width: 100%; justify-content: center; }
.theme-preview-help { display: flex; align-items: flex-start; gap: 9px; padding: 10px 11px; border-radius: 8px; color: #c7cee4; background: rgba(255,255,255,.035); font-size: .76rem; line-height: 1.45; }
.theme-preview-help svg { width: 16px; height: 16px; flex: 0 0 16px; color: #8ea1ff; }
.theme-preview-help a { color: #aeb8ff; font-weight: 900; text-decoration: underline; }

@media (max-width: 1120px) {
  .theme-editor { grid-template-columns: minmax(0,1fr); }
  .theme-preview-panel { position: static; }
}

@media (max-width: 760px) {
  .settings-grid.theme-color-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .theme-premium-lock { align-items: flex-start; flex-wrap: wrap; }
}

@media (max-width: 480px) {
  .settings-grid.theme-color-grid,.discord-preview-fields { grid-template-columns: minmax(0,1fr); }
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  background: var(--bg);
}

body {
  position: relative;
  margin: 0;
  color: var(--ink);
  background: var(--page-bg);
  background-attachment: scroll;
  min-height: 100vh;
  min-width: 320px;
  isolation: isolate;
  overflow-x: hidden;
}

body.app-page {
  background:
    linear-gradient(180deg, rgba(17, 21, 38, 0.98) 0%, #090b16 44%, #090b16 100%),
    var(--bg);
}

body.app-page::before {
  -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 56%, transparent 82%);
  mask-image: linear-gradient(180deg, #000 0%, #000 56%, transparent 82%);
}

body.app-page::after {
  opacity: 0.16;
  -webkit-mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.62), transparent 54%);
  mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.62), transparent 54%);
}

body.app-page::before,
body.app-page::after {
  display: none;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  opacity: 0.4;
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.2), rgba(88, 101, 242, 0.05) 34%, transparent 66%),
    linear-gradient(225deg, rgba(34, 211, 238, 0.13), rgba(34, 211, 238, 0.03) 38%, transparent 68%),
    linear-gradient(180deg, transparent 0%, rgba(235, 69, 158, 0.06) 48%, transparent 100%);
  background-size: 175% 175%, 165% 165%, 130% 130%;
  -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 72%, transparent 100%);
  mask-image: linear-gradient(180deg, #000 0%, #000 72%, transparent 100%);
  transform: translate3d(var(--pointer-x, 0px), var(--pointer-y, 0px), 0);
}

body::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  opacity: 0.26;
  background:
    linear-gradient(90deg, rgba(88, 101, 242, 0.09), transparent 34%, rgba(34, 211, 238, 0.06) 68%, transparent),
    linear-gradient(180deg, rgba(255, 255, 255, 0.055), transparent 28%, transparent 72%, rgba(0, 0, 0, 0.32));
  background-size: 220% 220%, 100% 100%;
  -webkit-mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.78), transparent 70%);
  mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.78), transparent 70%);
  transform: translate3d(calc(var(--pointer-x, 0px) * -0.12), calc(var(--pointer-y, 0px) * -0.12), 0);
}

@media (max-width: 1024px), (prefers-reduced-motion: reduce) {
  body::before,
  body::after {
    display: none;
  }
}

main {
  position: relative;
  z-index: 1;
  min-height: calc(100vh - 72px);
  background: transparent;
}

a {
  color: inherit;
  text-decoration: none;
}

button,
input,
textarea,
select {
  font: inherit;
}

code {
  color: #dbdee1;
  background: #1e1f22;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 0.12rem 0.35rem;
}

.scroll-progress {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 120;
  width: calc(var(--scroll-progress, 0) * 100%);
  height: 3px;
  pointer-events: none;
  background: linear-gradient(90deg, var(--primary), var(--cyan), var(--mint), var(--rose), var(--amber));
  background-size: 240% 100%;
  box-shadow: 0 0 20px rgba(88, 101, 242, 0.58), 0 0 36px rgba(34, 211, 238, 0.22);
  animation: ticketHubAccentSweep 6s linear infinite;
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 20;
  height: 72px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 32px;
  background:
    linear-gradient(90deg, rgba(7, 9, 19, 0.9), rgba(18, 21, 35, 0.82) 56%, rgba(31, 23, 48, 0.82)),
    rgba(7, 9, 19, 0.88);
  border-bottom: 1px solid rgba(88, 101, 242, 0.24);
  box-shadow: 0 14px 46px rgba(0, 0, 0, 0.34), inset 0 -1px 0 rgba(255, 255, 255, 0.04);
  backdrop-filter: none;
  overflow: visible;
}

.site-header::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 2px;
  background: linear-gradient(90deg, var(--primary), var(--cyan), var(--mint), var(--rose), var(--amber), var(--primary));
  background-size: 260% 100%;
  opacity: 0.95;
  animation: ticketHubAccentSweep 7s linear infinite;
}

.site-header > * {
  position: relative;
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-weight: 800;
  font-size: 1.05rem;
  transition: transform 0.18s ease, color 0.18s ease;
}

.brand:hover {
  color: #fff;
  transform: translateY(-1px);
}

.brand.center {
  justify-content: center;
}

.brand.compact {
  font-size: 0.98rem;
}

.brand-mark {
  display: inline-grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border-radius: 8px;
  color: #fff;
  background: linear-gradient(135deg, #5865f2, #7289da);
  box-shadow: 0 10px 22px rgba(88, 101, 242, 0.32);
}

.brand-logo {
  display: block;
  width: 36px;
  height: 36px;
  object-fit: contain;
  flex: 0 0 36px;
  filter: drop-shadow(0 8px 18px rgba(88, 101, 242, 0.34)) drop-shadow(0 0 16px rgba(34, 211, 238, 0.12));
  transition: transform 0.22s ease, filter 0.22s ease;
}

.brand:hover .brand-logo {
  transform: rotate(-3deg) scale(1.06);
  filter: drop-shadow(0 10px 24px rgba(88, 101, 242, 0.38));
}

.auth-brand {
  display: flex;
  justify-content: center;
  width: 100%;
  margin: 0 auto;
  text-align: center;
}

.auth-logo {
  display: block;
  width: min(260px, 72vw);
  max-width: 100%;
  height: auto;
  margin: 0 auto;
  object-fit: contain;
}

.site-nav {
  display: flex;
  align-items: center;
  gap: 6px;
}

.site-nav a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 40px;
  padding: 8px 12px;
  border-radius: 8px;
  color: #dbdee1;
  font-weight: 700;
  border: 1px solid transparent;
  transition: background 0.18s ease, color 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.site-nav a:hover {
  background: linear-gradient(135deg, rgba(88, 101, 242, 0.18), rgba(34, 211, 238, 0.08));
  border-color: rgba(142, 161, 255, 0.24);
  color: #fff;
  transform: translateY(-1px);
  box-shadow: inset 0 0 0 1px rgba(88, 101, 242, 0.18), 0 10px 26px rgba(88, 101, 242, 0.16);
}

.nav-pill {
  background: linear-gradient(135deg, var(--primary), var(--violet) 48%, var(--rose));
  background-size: 180% 180%;
  color: #fff !important;
  box-shadow: 0 12px 30px rgba(88, 101, 242, 0.28);
  animation: ticketHubGradientShift 8s ease-in-out infinite;
}

.nav-pill-alt {
  background: linear-gradient(135deg, #23273b, #3b3f59 52%, rgba(34, 211, 238, 0.26));
}

.nav-icon-link {
  width: 42px;
  justify-content: center;
}

.nav-toggle {
  display: none !important;
}

.hero {
  position: relative;
  min-height: clamp(520px, 82vh, 760px);
  display: flex;
  align-items: center;
  padding: 72px clamp(22px, 7vw, 96px);
  overflow: hidden;
  color: #fff;
  background-image: var(--hero-image);
  background-size: cover;
  background-position: center;
  isolation: isolate;
  animation: ticketHubHeroPan 48s ease-in-out infinite alternate;
}

.hero-overlay {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(7, 9, 19, 0.98), rgba(12, 14, 28, 0.7) 48%, rgba(7, 9, 19, 0.18)),
    linear-gradient(135deg, rgba(88, 101, 242, 0.34), transparent 42%),
    linear-gradient(18deg, rgba(235, 69, 158, 0.08), transparent 52%),
    linear-gradient(0deg, rgba(7, 9, 19, 0.82), rgba(7, 9, 19, 0.08) 48%);
}

.hero::before,
.hero::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.hero::before {
  z-index: 0;
  opacity: 0.2;
  background:
    linear-gradient(90deg, rgba(88, 101, 242, 0.12), transparent 42%, rgba(34, 211, 238, 0.08));
}

.hero::after {
  z-index: 0;
  top: auto;
  height: 34%;
  background: linear-gradient(180deg, transparent, rgba(7, 9, 19, 0.94));
}

.hero-content {
  position: relative;
  z-index: 1;
  width: min(500px, 100%);
}

.hero-logo {
  display: block;
  width: min(320px, 76vw);
  max-width: 100%;
  height: auto;
  margin-bottom: 18px;
  filter: drop-shadow(0 14px 28px rgba(0, 0, 0, 0.28)) drop-shadow(0 0 34px rgba(88, 101, 242, 0.2));
}

.eyebrow {
  display: inline-flex;
  align-items: center;
  color: var(--primary);
  font-weight: 800;
  text-transform: uppercase;
  font-size: 0.78rem;
  letter-spacing: 0;
}

.hero .eyebrow {
  color: #a5b4fc;
}

h1,
h2,
h3,
p {
  margin-top: 0;
}

.hero h1 {
  margin: 14px 0 18px;
  max-width: 500px;
  font-size: clamp(2.8rem, 5.2vw, 4.3rem);
  line-height: 0.95;
  letter-spacing: 0;
}

.hero p {
  max-width: 500px;
  color: rgba(255, 255, 255, 0.88);
  font-size: clamp(1.04rem, 2vw, 1.28rem);
  line-height: 1.7;
}

.hero-actions,
.row-actions,
.group-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
}

.button,
.icon-button {
  position: relative;
  overflow: hidden;
  border: 0;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 42px;
  border-radius: 8px;
  font-weight: 800;
  transform: translateY(0) scale(1);
  transition: transform 0.18s ease, box-shadow 0.18s ease, background 0.18s ease, border-color 0.18s ease, color 0.18s ease, filter 0.18s ease;
}

.button {
  max-width: 100%;
  padding: 10px 16px;
  text-align: center;
  white-space: normal;
}

.button::after,
.icon-button::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0;
  background: linear-gradient(110deg, transparent 0 34%, rgba(255, 255, 255, 0.24) 46%, transparent 58% 100%);
  transform: translateX(-100%);
}

.button:hover,
.icon-button:hover {
  transform: translateY(-2px) scale(1.01);
  filter: saturate(1.08);
}

.button:hover::after,
.icon-button:hover::after {
  opacity: 1;
  animation: ticketHubShine 0.78s ease forwards;
}

.compact-button {
  min-height: 34px;
  padding: 7px 10px;
  font-size: 0.88rem;
}

.button svg,
.icon-button svg,
.site-nav svg {
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
}

.button.primary {
  color: #fff;
  background: linear-gradient(135deg, var(--primary), var(--violet) 54%, var(--rose));
  background-size: 180% 180%;
  box-shadow: 0 14px 36px rgba(88, 101, 242, 0.38), inset 0 1px 0 rgba(255, 255, 255, 0.18);
  animation: ticketHubGradientShift 8s ease-in-out infinite;
}

.button.primary:hover {
  background: linear-gradient(135deg, var(--primary-strong), #9f7aea 50%, var(--rose));
  box-shadow: 0 18px 52px rgba(88, 101, 242, 0.48), 0 0 34px rgba(235, 69, 158, 0.16);
}

.button.secondary {
  color: #fff;
  background: linear-gradient(135deg, rgba(49, 54, 76, 0.96), rgba(28, 31, 48, 0.96) 62%, rgba(34, 211, 238, 0.16));
  border: 1px solid rgba(142, 161, 255, 0.16);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

.button.discord {
  color: #fff;
  background: linear-gradient(135deg, #5865f2, #22d3ee 64%, #57f287);
  background-size: 180% 180%;
  box-shadow: 0 16px 42px rgba(88, 101, 242, 0.32), 0 0 28px rgba(34, 211, 238, 0.14);
  animation: ticketHubGradientShift 9s ease-in-out infinite reverse;
}

.button.ghost {
  color: #fff;
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(142, 161, 255, 0.34);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.button.quiet {
  color: var(--ink);
  background: rgba(255, 255, 255, 0.07);
  border: 1px solid rgba(142, 161, 255, 0.14);
}

.button.danger {
  color: #fff;
  background: linear-gradient(135deg, var(--danger), #be123c 58%, var(--rose));
  box-shadow: 0 14px 34px rgba(237, 66, 69, 0.24);
}

.button.full {
  width: 100%;
}

.icon-button {
  width: 42px;
  height: 42px;
  padding: 0;
  color: var(--ink);
  background: rgba(255, 255, 255, 0.075);
  border: 1px solid rgba(142, 161, 255, 0.16);
}

.invite-bot-button {
  color: #d8fff1;
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.22), rgba(87, 242, 135, 0.16)),
    rgba(255, 255, 255, 0.075);
  border-color: rgba(87, 242, 135, 0.3);
  box-shadow: 0 10px 26px rgba(88, 101, 242, 0.16);
}

.invite-bot-button:hover {
  color: #fff;
  border-color: rgba(87, 242, 135, 0.58);
  box-shadow: 0 14px 34px rgba(88, 101, 242, 0.22), 0 0 24px rgba(87, 242, 135, 0.12);
}

.danger-icon {
  color: var(--danger);
  background: rgba(242, 63, 66, 0.14);
}

.section {
  width: min(1180px, calc(100% - 36px));
  margin: 0 auto;
  padding: 70px 0;
}

.compact-section {
  padding: 18px 0;
}

.section-heading {
  max-width: 720px;
  margin-bottom: 28px;
}

.section-heading h2,
.page-hero h1,
.workspace-heading h1 {
  margin: 8px 0 0;
  font-size: clamp(2rem, 4vw, 3.4rem);
  line-height: 1.04;
  letter-spacing: 0;
  color: #fff;
  text-shadow: 0 18px 42px rgba(88, 101, 242, 0.16);
}

.section-heading h2,
.page-hero h1 {
  background: linear-gradient(135deg, #fff 0%, #dce2ff 42%, #a5f3fc 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.section-heading::after {
  content: "";
  display: block;
  width: 86px;
  height: 3px;
  margin-top: 16px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--primary), var(--cyan), var(--amber));
}

.rank-band {
  padding-top: 54px;
}

.rank-ladder {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.rank-tile,
.feature-card,
.price-box,
.guild-card,
.empty-state,
.panel-section,
.stat-grid article,
.auth-panel,
.doc-block {
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.1), transparent 35%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.06), transparent 48%),
    var(--surface);
  border: 1px solid rgba(142, 161, 255, 0.2);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  backdrop-filter: none;
  transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease, background 0.22s ease, filter 0.22s ease;
}

.rank-tile:hover,
.feature-card:hover,
.price-box:hover,
.guild-card:hover,
.panel-section:hover,
.stat-grid article:hover,
.auth-panel:hover,
.doc-block:hover {
  border-color: rgba(34, 211, 238, 0.44);
  box-shadow: var(--shadow), var(--shadow-color), 0 0 34px rgba(34, 211, 238, 0.08);
  filter: saturate(1.06);
}

.rank-tile {
  min-height: 152px;
  padding: 20px;
  display: grid;
  align-content: space-between;
}

.rank-tile.high {
  color: #fff;
  border-color: rgba(56, 189, 248, 0.55);
  background: linear-gradient(135deg, #5865f2, #22d3ee 78%, #57f287 120%);
  background-size: 170% 170%;
  box-shadow: var(--glow-primary);
  animation: ticketHubGradientShift 8s ease-in-out infinite;
}

.rank-tile span {
  font-size: 1.18rem;
  font-weight: 900;
}

.rank-tile small {
  color: inherit;
  opacity: 0.76;
}

.rank-tile svg {
  width: 28px;
  height: 28px;
  color: #fee75c;
}

.features-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.features-grid .section-heading {
  grid-column: 1 / -1;
}

.feature-card {
  position: relative;
  min-height: 210px;
  padding: 22px;
  overflow: hidden;
}

.feature-card::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0;
  background: linear-gradient(135deg, rgba(88, 101, 242, 0.18), transparent 48%, rgba(56, 189, 248, 0.08));
  transition: opacity 0.2s ease;
}

.feature-card:hover::before {
  opacity: 1;
}

.feature-card svg {
  position: relative;
  color: var(--cyan);
  width: 30px;
  height: 30px;
  margin-bottom: 18px;
  filter: drop-shadow(0 0 16px rgba(56, 189, 248, 0.25));
  transition: transform 0.2s ease, color 0.2s ease;
}

.feature-card:hover svg {
  color: var(--amber);
  transform: translateY(-2px) rotate(-4deg);
}

.feature-card h3 {
  position: relative;
  margin-bottom: 10px;
}

.feature-card p,
.doc-block p,
.section-title p,
.muted,
.auth-switch,
.price-box p,
.guild-card p {
  color: var(--muted);
  line-height: 1.6;
}

.page-hero {
  width: min(1180px, calc(100% - 36px));
  margin: 0 auto;
  padding: 84px 0 24px;
}

.compact-hero {
  max-width: 880px;
}

.two-columns,
.pricing-strip {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.doc-block,
.price-box {
  padding: 24px;
}

.doc-block.wide {
  width: min(920px, calc(100% - 36px));
}

.legal-page main {
  padding-bottom: 24px;
}

.legal-hero {
  max-width: 980px;
}

.legal-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 18px;
}

.legal-meta span {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 7px 10px;
  color: #dbdee1;
  background: #2b2d31;
  border: 1px solid var(--line);
  border-radius: 8px;
  font-size: 0.9rem;
  font-weight: 800;
}

.legal-actions {
  margin-top: 22px;
}

.legal-layout {
  width: min(980px, calc(100% - 36px));
  display: grid;
  gap: 16px;
  padding-top: 28px;
}

.legal-card {
  box-shadow: none;
}

.legal-card h2 {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
  font-size: 1.2rem;
  line-height: 1.35;
}

.legal-card h2 svg {
  flex: 0 0 22px;
  width: 22px;
  height: 22px;
  color: var(--primary);
}

.legal-card p:last-child,
.legal-card .legal-list:last-child {
  margin-bottom: 0;
}

.legal-list {
  display: grid;
  gap: 10px;
  margin: 14px 0 0;
  padding-left: 1.1rem;
  color: var(--muted);
  line-height: 1.65;
}

.legal-list strong {
  color: #f2f3f5;
}

.legal-card a,
.legal-login-links a {
  color: #a5b4fc;
  font-weight: 800;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

.legal-note {
  border-color: rgba(88, 101, 242, 0.62);
  background: linear-gradient(135deg, rgba(88, 101, 242, 0.16), rgba(43, 45, 49, 0.96));
}

.price-box.accent {
  border-color: rgba(88, 101, 242, 0.55);
  box-shadow: 0 18px 40px rgba(88, 101, 242, 0.18);
}

.price {
  color: var(--primary-strong);
  font-size: 2.4rem;
  font-weight: 900;
}

.auth-body {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 24px;
  background: var(--page-bg);
  background-attachment: scroll;
}

.maintenance-body {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 24px;
  background: var(--page-bg);
  background-attachment: scroll;
}

.auth-shell {
  width: min(460px, 100%);
}

.auth-panel {
  padding: 30px;
}

.maintenance-shell {
  width: min(720px, 100%);
}

.maintenance-panel {
  display: grid;
  gap: 18px;
  padding: 32px;
}

.maintenance-logo {
  display: block;
  width: min(220px, 64vw);
  height: auto;
  object-fit: contain;
  filter: drop-shadow(0 14px 28px rgba(0, 0, 0, 0.28));
}

.maintenance-panel h1 {
  margin: 0;
  text-align: center;
  font-size: 2rem;
}

.maintenance-text {
  margin: 0;
  text-align: center;
  color: #dbdee1;
  line-height: 1.6;
}

.maintenance-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.maintenance-summary article {
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #1e1f22;
}

.maintenance-summary strong {
  display: block;
  color: #fff;
  font-size: 1.15rem;
  margin-bottom: 4px;
}

.maintenance-summary span {
  color: var(--muted);
  font-weight: 700;
}

.maintenance-note {
  margin: 0;
  text-align: center;
  color: var(--muted);
}

.maintenance-popup {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 80;
  width: min(430px, calc(100vw - 28px));
}

.maintenance-popup[hidden] {
  display: none;
}

.maintenance-popup-card {
  position: relative;
  display: grid;
  gap: 12px;
  padding: 18px;
  border: 1px solid rgba(142, 161, 255, 0.34);
  border-radius: 12px;
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.16), rgba(235, 69, 158, 0.08) 56%, transparent),
    rgba(14, 17, 31, 0.96);
  box-shadow: 0 20px 70px rgba(0, 0, 0, 0.44), 0 0 34px rgba(88, 101, 242, 0.14);
  backdrop-filter: none;
}

.maintenance-popup-card h2 {
  margin: 0;
  font-size: 1.15rem;
}

.maintenance-popup-close {
  position: absolute;
  top: 12px;
  right: 12px;
}

.maintenance-popup-list {
  display: grid;
  gap: 10px;
}

.maintenance-popup-list article {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 12px;
  align-items: flex-start;
  padding: 12px;
  border: 1px solid rgba(142, 161, 255, 0.16);
  border-radius: 8px;
  background: rgba(31, 35, 54, 0.78);
}

.maintenance-popup-list strong,
.maintenance-popup-list p,
.maintenance-popup-list small {
  display: block;
}

.maintenance-popup-list p {
  margin: 4px 0;
  color: #dbdee1;
  line-height: 1.45;
}

.maintenance-popup-list small {
  color: var(--muted);
}

.maintenance-schedule-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.maintenance-power-panel {
  border-color: rgba(34, 211, 238, 0.32);
}

.maintenance-power-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.maintenance-power-grid article {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  min-width: 0;
  padding: 16px;
  border: 1px solid rgba(142, 161, 255, 0.22);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.12), rgba(34, 211, 238, 0.05)),
    rgba(20, 24, 40, 0.9);
}

.maintenance-power-grid article.is-offline {
  border-color: rgba(237, 66, 69, 0.42);
  background:
    linear-gradient(135deg, rgba(237, 66, 69, 0.13), rgba(235, 69, 158, 0.07)),
    rgba(20, 24, 40, 0.9);
}

.maintenance-power-grid article.is-online {
  border-color: rgba(60, 231, 174, 0.28);
}

.maintenance-power-icon {
  display: inline-grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 8px;
  color: #fff;
  background: rgba(88, 101, 242, 0.22);
}

.maintenance-power-grid strong,
.maintenance-power-grid small {
  display: block;
}

.maintenance-power-grid small {
  margin-top: 4px;
  color: var(--muted);
  line-height: 1.35;
}

.maintenance-power-grid form,
.maintenance-power-actions {
  grid-column: 1 / -1;
}

.maintenance-power-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.maintenance-power-actions form {
  margin: 0;
}

.auth-panel h1 {
  text-align: center;
  margin: 24px 0;
}

.auth-switch {
  text-align: center;
  margin: 18px 0 0;
}

.auth-switch a {
  color: var(--primary-strong);
  font-weight: 800;
}

.fallback-login {
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid var(--line);
}

.fallback-login summary {
  cursor: pointer;
  color: var(--muted);
  font-weight: 800;
  margin-bottom: 14px;
}

.stack-form,
.inline-form,
.settings-grid,
.rank-create-form,
.rank-main-form,
.sub-role-add {
  display: grid;
  gap: 14px;
}

.stack-form label,
.inline-form label,
.settings-grid label,
.rank-create-form label,
.rank-main-form label {
  display: grid;
  gap: 7px;
  color: #dbdee1;
  font-weight: 800;
}

input,
textarea,
select {
  width: 100%;
  min-width: 0;
  min-height: 42px;
  padding: 10px 12px;
  border: 1px solid rgba(142, 161, 255, 0.22);
  border-radius: 8px;
  color: var(--ink);
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.08), transparent 54%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.045), transparent),
    rgba(10, 13, 26, 0.88);
  outline: none;
  transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

textarea {
  resize: vertical;
  line-height: 1.45;
}

input:focus,
textarea:focus,
select:focus {
  border-color: var(--cyan);
  box-shadow: 0 0 0 3px rgba(34, 211, 238, 0.17), 0 0 32px rgba(88, 101, 242, 0.2);
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.12), rgba(34, 211, 238, 0.05)),
    #151a28;
}

input[type="checkbox"] {
  width: 18px;
  min-height: 18px;
  accent-color: var(--primary);
}

input[type="color"] {
  padding: 4px;
}

select[multiple] {
  min-height: 180px;
}

.field-group {
  display: grid;
  gap: 8px;
}

.field-group > span {
  color: #dbdee1;
  font-weight: 800;
}

.multi-select {
  position: relative;
  width: 100%;
}

.multi-select summary {
  list-style: none;
}

.multi-select summary::-webkit-details-marker {
  display: none;
}

.multi-select-summary {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
  min-height: 42px;
  padding: 10px 12px;
  border: 1px solid rgba(142, 161, 255, 0.22);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.1), transparent 62%),
    rgba(12, 15, 29, 0.9);
  cursor: pointer;
  user-select: none;
}

.multi-select[open] .multi-select-summary {
  border-color: var(--cyan);
  box-shadow: 0 0 0 3px rgba(34, 211, 238, 0.16), 0 0 28px rgba(88, 101, 242, 0.16);
}

.multi-select-summary-label {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 800;
}

.multi-select-summary-label.is-placeholder {
  color: var(--muted);
  font-weight: 700;
}

.multi-select-summary-count {
  flex: 0 0 auto;
  color: var(--muted);
  font-size: 0.8rem;
  font-weight: 800;
  white-space: nowrap;
}

.multi-select-summary-count[hidden] {
  display: none;
}

.multi-select-summary svg {
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
  color: var(--muted);
  transition: transform 0.15s ease;
}

.multi-select[open] .multi-select-summary svg {
  transform: rotate(180deg);
}

.multi-select-panel {
  position: absolute;
  z-index: 30;
  top: calc(100% + 6px);
  left: 0;
  width: max(100%, 280px);
  min-width: 100%;
  max-height: min(320px, 50vh);
  overflow: auto;
  overscroll-behavior: contain;
  border: 1px solid rgba(142, 161, 255, 0.24);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(88, 101, 242, 0.12), transparent 48%),
    rgba(16, 19, 32, 0.98);
  box-shadow: var(--shadow), 0 0 38px rgba(88, 101, 242, 0.14);
  backdrop-filter: none;
}

.multi-select-options {
  display: grid;
}

.multi-select-search {
  position: sticky;
  top: 0;
  z-index: 2;
  padding: 10px;
  border-bottom: 1px solid rgba(142, 161, 255, 0.14);
  background: rgba(12, 15, 29, 0.98);
}

.multi-select-search input {
  min-height: 38px;
  width: 100%;
  padding: 9px 11px;
  border: 1px solid rgba(142, 161, 255, 0.2);
  border-radius: 8px;
  color: #f8fbff;
  background: rgba(255, 255, 255, 0.055);
  font-weight: 800;
}

.multi-select-option,
.role-check {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  min-height: 48px;
  padding: 10px 12px;
  border-bottom: 1px solid rgba(142, 161, 255, 0.12);
  background: rgba(18, 21, 35, 0.9);
  cursor: pointer;
  transition: background 0.16s ease, color 0.16s ease;
}

.multi-select-option:last-child,
.role-check:last-child {
  border-bottom: 0;
}

.multi-select-option:hover,
.role-check:hover {
  background: linear-gradient(135deg, rgba(88, 101, 242, 0.24), rgba(34, 211, 238, 0.08));
}

.multi-select-option input,
.role-check input {
  width: 18px;
  min-height: 18px;
  margin-top: 2px;
  flex: 0 0 auto;
  accent-color: var(--primary);
}

.multi-select-option span,
.role-check span {
  display: grid;
  gap: 2px;
  min-width: 0;
  overflow-wrap: anywhere;
}

.multi-select-option small,
.role-check small {
  color: var(--muted);
  word-break: break-word;
}

.multi-select-option strong,
.role-check strong {
  font-weight: 800;
  overflow-wrap: anywhere;
}

.multi-select-option input:disabled,
.multi-select-option input:disabled + span,
.role-check input:disabled,
.role-check input:disabled + span {
  opacity: 0.55;
  cursor: not-allowed;
}

.inline-form {
  grid-template-columns: minmax(180px, 1fr) minmax(180px, 1fr) auto;
  align-items: end;
}

.compact-form {
  grid-template-columns: minmax(180px, 1fr) 120px minmax(90px, auto) auto;
}

.check-label {
  display: flex !important;
  align-items: center;
  gap: 8px !important;
}

.flash {
  position: relative;
  z-index: 2;
  width: min(1180px, calc(100% - 36px));
  margin: 16px auto 0;
  padding: 14px 16px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 8px;
  font-weight: 800;
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.18);
}

.flash.inline {
  width: 100%;
  margin: 0 0 18px;
}

.flash-success {
  color: #d4f8df;
  background: linear-gradient(135deg, rgba(34, 197, 94, 0.2), rgba(88, 101, 242, 0.08));
  border-color: rgba(34, 197, 94, 0.28);
}

.flash-error {
  color: #ffd8d9;
  background: linear-gradient(135deg, rgba(251, 75, 87, 0.22), rgba(15, 17, 23, 0.12));
  border-color: rgba(251, 75, 87, 0.3);
}

.flash-info {
  color: #dce2ff;
  background: linear-gradient(135deg, rgba(88, 101, 242, 0.22), rgba(56, 189, 248, 0.08));
  border-color: rgba(88, 101, 242, 0.3);
}

.premium-purchase-alert {
  margin-top: 10px;
  margin-bottom: 28px;
  line-height: 1.55;
}

.hero-actions .premium-purchase-alert {
  flex: 1 1 100%;
  margin: 8px 0 6px;
}

.app-shell {
  display: grid;
  grid-template-columns: clamp(204px, 18vw, 252px) minmax(0, 1fr);
  gap: clamp(14px, 2vw, 24px);
  width: min(1460px, calc(100% - 32px));
  margin: 24px auto 32px;
}

.sidebar {
  position: sticky;
  top: 92px;
  height: calc(100vh - 116px);
  min-width: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: rgba(142, 161, 255, 0.5) rgba(255, 255, 255, 0.05);
  padding: 14px;
  border: 1px solid rgba(142, 161, 255, 0.22);
  border-radius: var(--radius);
  background:
    linear-gradient(180deg, rgba(88, 101, 242, 0.18), transparent 48%),
    linear-gradient(145deg, rgba(34, 211, 238, 0.08), transparent 38%),
    rgba(15, 18, 32, 0.9);
  box-shadow: var(--shadow), inset 0 1px 0 rgba(255, 255, 255, 0.05);
  backdrop-filter: none;
}

/* Les rubriques du panel serveur sont des vues distinctes. */
.guild-section-page .guild-page-content { display: none; }
.guild-section-overview .guild-page-overview,
.guild-section-settings .guild-page-settings,
.guild-section-assistant .guild-page-assistant,
.guild-section-premium .guild-page-premium,
.guild-section-premium-bot .guild-page-premium-bot,
.guild-section-branding .guild-page-branding,
.guild-section-theme .guild-page-theme,
.guild-section-stats .guild-page-stats,
.guild-section-satisfaction .guild-page-satisfaction,
.guild-section-categories .guild-page-categories,
.guild-section-panels .guild-page-panels,
.guild-section-auto-replies .guild-page-auto-replies,
.guild-section-reminders .guild-page-reminders,
.guild-section-diagnostic .guild-page-diagnostic,
.guild-section-managers .guild-page-managers { display: block; }

.sidebar::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

.sidebar::-webkit-scrollbar-track {
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.05);
}

.sidebar::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgba(142, 161, 255, 0.48);
}

.side-link {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  min-height: 44px;
  padding: 10px 12px;
  border-radius: 8px;
  color: var(--muted);
  font-weight: 800;
  line-height: 1.2;
  overflow-wrap: anywhere;
  transition: transform 0.18s ease, background 0.18s ease, color 0.18s ease, box-shadow 0.18s ease;
}

.side-link svg {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
}

.side-link.active,
.side-link:hover {
  color: #fff;
  background: linear-gradient(135deg, rgba(88, 101, 242, 0.26), rgba(34, 211, 238, 0.08));
  box-shadow: inset 3px 0 0 var(--cyan), 0 12px 26px rgba(88, 101, 242, 0.14);
}

.side-link:hover {
  transform: translateX(3px);
}

.guild-sidebar {
  padding: 12px;
  background:
    radial-gradient(circle at 15% 0%, rgba(88, 101, 242, 0.3), transparent 32%),
    linear-gradient(180deg, rgba(24, 28, 48, 0.98), rgba(10, 13, 27, 0.96));
}

.guild-sidebar-header {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 11px;
  align-items: center;
  padding: 10px 8px 14px;
  margin-bottom: 8px;
  border-bottom: 1px solid rgba(142, 161, 255, 0.2);
}

.guild-sidebar-header > span:last-child {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.guild-sidebar-header small {
  color: var(--muted);
  font-size: 0.7rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.guild-sidebar-header strong {
  overflow: hidden;
  color: #fff;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.guild-sidebar-icon {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border: 1px solid rgba(142, 161, 255, 0.32);
  border-radius: 10px;
  color: #fff;
  background: linear-gradient(135deg, rgba(88, 101, 242, 0.9), rgba(34, 211, 238, 0.5));
  box-shadow: 0 10px 26px rgba(88, 101, 242, 0.25);
}

.guild-sidebar-back {
  min-height: 38px;
  margin-bottom: 12px;
  color: #d8ddf0;
  background: rgba(255, 255, 255, 0.045);
}

.guild-sidebar-nav,
.guild-nav-group,
.guild-nav-subcategories {
  display: grid;
}

.guild-sidebar-nav {
  gap: 15px;
}

.guild-nav-group {
  gap: 5px;
}

.guild-nav-category {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 0 9px;
  color: #8f9ab8;
  font-size: 0.75rem;
  font-weight: 950;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.guild-nav-category svg {
  width: 14px;
  height: 14px;
  color: #7dd3fc;
}

.guild-nav-subcategories {
  gap: 3px;
  padding-left: 8px;
  border-left: 1px solid rgba(142, 161, 255, 0.16);
}

.guild-sidebar .guild-nav-subcategory {
  position: relative;
  min-height: 43px;
  padding: 10px 11px;
  font-size: 0.95rem;
  font-weight: 820;
  line-height: 1.3;
}

.guild-nav-subcategory.active {
  color: #fff;
  background: linear-gradient(100deg, rgba(88, 101, 242, 0.34), rgba(34, 211, 238, 0.09));
  box-shadow: inset 3px 0 0 #67e8f9, 0 8px 22px rgba(88, 101, 242, 0.16);
}

.guild-nav-subcategory.active::after {
  content: "";
  position: absolute;
  right: 9px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #67e8f9;
  box-shadow: 0 0 10px #22d3ee;
}

.admin-sidebar {
  background:
    radial-gradient(circle at 18% 0%, rgba(235, 69, 158, 0.2), transparent 30%),
    radial-gradient(circle at 92% 15%, rgba(88, 101, 242, 0.22), transparent 28%),
    linear-gradient(180deg, rgba(25, 26, 47, 0.98), rgba(10, 13, 27, 0.97));
}

.admin-sidebar-icon {
  background: linear-gradient(135deg, #7c3aed, #5865f2 48%, #22d3ee);
  box-shadow: 0 10px 28px rgba(124, 58, 237, 0.3);
}

.admin-sidebar .guild-nav-category svg {
  color: #c4b5fd;
}

.admin-sidebar .guild-nav-subcategory.active {
  background: linear-gradient(100deg, rgba(124, 58, 237, 0.34), rgba(34, 211, 238, 0.09));
  box-shadow: inset 3px 0 0 #c4b5fd, 0 8px 22px rgba(88, 101, 242, 0.18);
}

.admin-sidebar .guild-nav-subcategory.active::after {
  background: #c4b5fd;
  box-shadow: 0 0 10px #8b5cf6;
}

.member-sidebar {
  background:
    radial-gradient(circle at 12% 0%, rgba(88, 101, 242, 0.34), transparent 34%),
    radial-gradient(circle at 94% 20%, rgba(34, 211, 238, 0.18), transparent 30%),
    linear-gradient(165deg, rgba(22, 27, 52, 0.99), rgba(10, 14, 31, 0.98) 58%, rgba(8, 20, 34, 0.98));
  border-color: rgba(110, 132, 255, 0.34);
  box-shadow: 0 20px 48px rgba(0, 0, 0, 0.32), 0 8px 34px rgba(88, 101, 242, 0.13), inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

.member-sidebar-icon {
  background: linear-gradient(135deg, #5865f2, #6366f1 48%, #22d3ee);
  box-shadow: 0 10px 28px rgba(88, 101, 242, 0.3);
  overflow: hidden;
  font-size: 1.05rem;
  font-weight: 950;
}

.member-sidebar-icon.has-avatar {
  padding: 2px;
  background: linear-gradient(135deg, #8ea1ff, #5865f2 48%, #22d3ee);
}

.member-sidebar-icon img {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 8px;
  object-fit: cover;
}

.member-sidebar .guild-nav-category svg {
  color: #a5b4fc;
}

.member-sidebar .guild-nav-subcategory.active {
  background: linear-gradient(100deg, rgba(88, 101, 242, 0.42), rgba(34, 211, 238, 0.1));
  box-shadow: inset 3px 0 0 #8ea1ff, 0 10px 25px rgba(88, 101, 242, 0.2);
}

.member-sidebar .guild-nav-subcategory.active::after {
  background: #a5b4fc;
  box-shadow: 0 0 11px #5865f2;
}

.side-link-external {
  width: 13px !important;
  height: 13px !important;
  margin-left: auto;
  opacity: 0.65;
}

.workspace {
  min-width: 0;
}

.workspace-heading {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 18px;
}

.workspace-heading h1 {
  font-size: clamp(2rem, 3vw, 3rem);
}

.panel-section {
  position: relative;
  overflow: hidden;
  padding: 22px;
  margin-bottom: 18px;
}

.panel-section::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.9;
  background:
    linear-gradient(90deg, rgba(88, 101, 242, 0.13), transparent 38%),
    linear-gradient(135deg, transparent 0 62%, rgba(235, 69, 158, 0.06) 62% 78%, transparent 78% 100%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.04), transparent 44%);
}

.panel-section > * {
  position: relative;
}

.panel-card {
  position: relative;
  min-width: 0;
  padding: 18px;
  margin-top: 16px;
  border: 1px solid rgba(142, 161, 255, 0.2);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.1), transparent 42%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.05), transparent 54%),
    var(--surface-strong);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.panel-list,
.option-list,
.ticket-list,
.discord-guild-list {
  display: grid;
  gap: 12px;
  margin-top: 16px;
}

.sub-section {
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
}

.sub-section h3 {
  margin-bottom: 12px;
}

.section-title {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 18px;
}

.section-title h2 {
  margin-bottom: 4px;
}

.section-title-actions {
  display: inline-flex;
  align-items: flex-start;
  gap: 10px;
  flex-wrap: wrap;
}

.guild-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.guild-card {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr) auto;
  gap: 16px;
  align-items: center;
  padding: 18px;
  overflow: hidden;
}

.guild-card-ready {
  border-color: rgba(35, 165, 89, 0.42);
  box-shadow: inset 4px 0 0 rgba(35, 165, 89, 0.72);
}

.guild-card-custom {
  border-color: color-mix(in srgb, var(--guild-card-accent, #5865f2) 58%, transparent);
  box-shadow: inset 4px 0 0 var(--guild-card-accent, #5865f2);
}

.guild-card-highlighted {
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--guild-card-accent, #5865f2) 18%, transparent), rgba(255, 255, 255, 0.03)),
    var(--panel);
  box-shadow:
    inset 4px 0 0 var(--guild-card-accent, #5865f2),
    0 18px 44px rgba(0, 0, 0, 0.2);
}

.guild-card-official {
  grid-column: 1 / -1;
  position: relative;
  overflow: hidden;
  border-color: rgba(254, 231, 92, 0.5);
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.18), rgba(254, 231, 92, 0.08)),
    var(--panel);
  box-shadow:
    inset 4px 0 0 rgba(254, 231, 92, 0.9),
    0 18px 45px rgba(0, 0, 0, 0.22);
}

.guild-card-official .guild-avatar {
  border: 1px solid rgba(254, 231, 92, 0.55);
  box-shadow: 0 0 0 4px rgba(254, 231, 92, 0.08);
}

.guild-card-official.guild-card-custom {
  border-color: color-mix(in srgb, var(--guild-card-accent, #fee75c) 58%, transparent);
  box-shadow:
    inset 4px 0 0 var(--guild-card-accent, #fee75c),
    0 18px 45px rgba(0, 0, 0, 0.22);
}

.guild-card-official.guild-card-highlighted {
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--guild-card-accent, #fee75c) 18%, transparent), rgba(254, 231, 92, 0.08)),
    var(--panel);
}

.guild-card-banned {
  border-color: rgba(242, 63, 66, 0.42);
  box-shadow: inset 4px 0 0 rgba(242, 63, 66, 0.72);
  opacity: 0.72;
}

.guild-card-suspended {
  border-color: rgba(251, 146, 60, 0.38);
  box-shadow: inset 4px 0 0 rgba(251, 146, 60, 0.72);
}

.guild-card > form {
  display: inline-flex;
  justify-self: end;
}

.guild-avatar {
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  border-radius: 8px;
  color: #fff;
  background: linear-gradient(135deg, #5865f2, #22d3ee 72%, #232428);
  box-shadow: 0 12px 28px rgba(88, 101, 242, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.16);
  font-weight: 900;
}

.guild-avatar.has-image {
  padding: 0;
  overflow: hidden;
  background: transparent;
}

.guild-avatar.has-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.guild-card h2 {
  margin-bottom: 4px;
  font-size: 1.12rem;
}

.guild-title-line {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  flex-wrap: wrap;
}

.guild-title-line h1,
.guild-title-line h2 {
  margin: 0;
}

.official-crown {
  display: inline-grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 8px;
  color: #fff5bc;
  background: rgba(254, 231, 92, 0.16);
  border: 1px solid rgba(254, 231, 92, 0.48);
  box-shadow: 0 0 22px rgba(254, 231, 92, 0.16);
}

.official-crown svg {
  width: 18px;
  height: 18px;
  stroke-width: 2.5;
}

.guild-custom-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 28px;
  padding: 5px 9px;
  border-radius: 8px;
  color: var(--guild-badge-color, #fff);
  background: var(--guild-badge-bg, #5865f2);
  border: 1px solid color-mix(in srgb, var(--guild-badge-bg, #5865f2) 68%, #fff 20%);
  box-shadow: 0 8px 22px color-mix(in srgb, var(--guild-badge-bg, #5865f2) 28%, transparent);
  font-size: 0.82rem;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
}

.guild-custom-badge svg {
  width: 14px;
  height: 14px;
  flex: 0 0 auto;
  stroke-width: 2.6;
}

.guild-heading-title {
  margin-top: 4px;
}

.official-meta {
  gap: 6px;
  border: 1px solid rgba(254, 231, 92, 0.28);
}

.official-meta svg {
  width: 14px;
  height: 14px;
}

.official-guild-banner {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 16px 0 18px;
  padding: 14px;
  border-radius: 8px;
  color: #fff7c7;
  border: 1px solid rgba(254, 231, 92, 0.32);
  background: linear-gradient(135deg, rgba(254, 231, 92, 0.14), rgba(88, 101, 242, 0.12));
}

.official-guild-banner > svg {
  flex: 0 0 auto;
  width: 28px;
  height: 28px;
  color: #fee75c;
}

.official-guild-banner strong,
.official-guild-banner span {
  display: block;
}

.official-guild-banner span {
  margin-top: 3px;
  color: var(--muted);
}

.official-premium-alert {
  gap: 8px;
}

.official-premium-alert svg {
  width: 16px;
  height: 16px;
}

.premium-panel {
  display: grid;
  gap: 24px;
  padding: clamp(26px, 3vw, 34px);
  border-color: rgba(142, 161, 255, 0.28);
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.14), transparent 42%),
    linear-gradient(225deg, rgba(34, 211, 238, 0.08), transparent 46%),
    rgba(13, 16, 30, 0.94);
}

.premium-panel::before {
  background:
    linear-gradient(90deg, rgba(88, 101, 242, 0.12), transparent 48%),
    linear-gradient(135deg, transparent 0 62%, rgba(235, 69, 158, 0.08) 62% 78%, transparent 78% 100%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.05), transparent 54%);
}

.premium-panel-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 24px;
  align-items: start;
}

.premium-panel-title {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.premium-panel-title h2,
.premium-panel-title p {
  margin: 0;
}

.premium-panel-title h2 {
  font-size: clamp(1.55rem, 2vw, 2.05rem);
}

.premium-panel-title p {
  max-width: 760px;
  color: #cbd3ea;
  font-size: 1rem;
  line-height: 1.65;
}

.premium-status-card {
  min-width: 176px;
  display: grid;
  gap: 10px;
  justify-items: start;
  padding: 14px;
  border: 1px solid rgba(254, 231, 92, 0.2);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(254, 231, 92, 0.14), rgba(88, 101, 242, 0.1)),
    rgba(255, 255, 255, 0.05);
}

.premium-status-card .status-pill {
  margin: 0;
}

.premium-status-card small {
  color: var(--muted);
  font-weight: 800;
}

.premium-metrics-grid {
  gap: 16px;
  margin: 0;
}

.premium-metrics-grid article {
  min-height: 148px;
  display: grid;
  align-content: space-between;
  gap: 10px;
  padding: 20px 22px;
  border-color: rgba(142, 161, 255, 0.22);
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.12), transparent 58%),
    rgba(8, 11, 24, 0.7);
}

.premium-metrics-grid .premium-metric-icon {
  width: 38px;
  height: 38px;
  display: inline-grid;
  place-items: center;
  border-radius: 8px;
  color: #b9f2ff;
  background: rgba(34, 211, 238, 0.12);
  border: 1px solid rgba(34, 211, 238, 0.2);
}

.premium-metrics-grid .premium-metric-icon svg {
  width: 18px;
  height: 18px;
  stroke-width: 2.4;
}

.premium-metrics-grid strong {
  font-size: clamp(2rem, 3vw, 2.75rem);
  line-height: 1;
}

.premium-metrics-grid span:last-child {
  color: #d8def3;
  font-size: 0.95rem;
}

.premium-panel-footer {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 22px;
  align-items: end;
  padding-top: 22px;
  border-top: 1px solid rgba(142, 161, 255, 0.16);
}

.premium-feature-badges {
  margin-top: 0;
  gap: 10px;
}

.premium-feature-badges span {
  min-height: 34px;
  padding: 7px 12px;
  color: #eef3ff;
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.24), rgba(34, 211, 238, 0.08)),
    rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(142, 161, 255, 0.18);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.premium-panel-actions {
  justify-content: flex-end;
  align-items: center;
  gap: 12px;
  min-width: min(100%, 520px);
}

.premium-panel-actions .inline-form {
  width: auto;
  display: flex;
  gap: 0;
}

.premium-panel-actions .button {
  min-height: 46px;
  padding-inline: 18px;
}

.premium-panel-actions .premium-purchase-alert,
.premium-panel-actions .official-premium-alert {
  width: auto;
  min-width: min(100%, 320px);
  margin: 0;
}

.guild-card p {
  margin-bottom: 8px;
  overflow-wrap: anywhere;
}

.meta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  color: var(--muted);
  font-size: 0.9rem;
}

.meta-row span,
.status-pill {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 4px 8px;
  border-radius: 8px;
  background: #383a40;
  font-weight: 800;
}

.status-online,
.status-pill.online {
  color: #d4f8df;
  background: rgba(35, 165, 89, 0.2);
}

.meta-row .managed-access {
  color: #dce2ff;
  background: rgba(88, 101, 242, 0.2);
  border: 1px solid rgba(142, 161, 255, 0.28);
}

.status-offline,
.status-pill.offline {
  color: #fff3bf;
  background: rgba(254, 231, 92, 0.16);
}

.status-pill.warning {
  color: #ffe7c2;
  background: rgba(251, 146, 60, 0.18);
}

.button.disabled {
  opacity: 0.45;
  pointer-events: none;
}

.empty-state {
  grid-column: 1 / -1;
  min-height: 230px;
  display: grid;
  place-items: center;
  text-align: center;
  padding: 32px;
}

.empty-state svg {
  width: 42px;
  height: 42px;
  color: var(--primary);
}

.settings-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.settings-grid > *,
.panel-section > *,
.manager-card > * {
  min-width: 0;
}

.wide-field {
  grid-column: 1 / -1;
}

.toggle-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}

.toggle-grid label {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #1e1f22;
}

.admin-tag-toggle-grid {
  grid-template-columns: repeat(3, minmax(180px, 1fr));
  margin: 0;
  padding: 0;
  border: 0;
}

.admin-tag-toggle-grid legend {
  grid-column: 1 / -1;
  margin-bottom: 2px;
  color: #dbdee1;
  font-weight: 900;
}

.admin-tag-toggle-grid label {
  min-height: 58px;
  align-items: center;
  padding: 14px;
  line-height: 1.35;
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.12), transparent 58%),
    rgba(12, 15, 28, 0.78);
}

.admin-tag-toggle-grid input[type="checkbox"] {
  flex: 0 0 auto;
  width: 20px;
  min-height: 20px;
}

.tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 16px;
}

.tabs a {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  padding: 8px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: #dbdee1;
  font-weight: 800;
  background: #1e1f22;
}

.tabs a.active {
  color: #fff;
  border-color: var(--primary);
  background: var(--primary);
}

.group-actions {
  margin: 12px 0 18px;
}

.rank-create-form {
  grid-template-columns: repeat(4, minmax(0, 1fr)) auto;
  align-items: end;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #1e1f22;
}

.rank-list {
  display: grid;
  gap: 12px;
  margin-top: 18px;
}

.rank-editor {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--line);
  border-left: 5px solid var(--rank-color, var(--primary));
  border-radius: 8px;
  background: var(--surface-strong);
}

.rank-main-form {
  grid-template-columns: 18px minmax(110px, 1.2fr) minmax(170px, 1.6fr) 94px 94px minmax(90px, 1fr) minmax(90px, 1fr) 70px 42px;
  align-items: end;
}

.rank-color {
  width: 14px;
  height: 42px;
  border-radius: 6px;
  background: var(--rank-color, var(--primary));
}

.delete-inline {
  display: inline-flex;
  align-self: end;
}

.panel-card > .settings-grid + .delete-inline,
.manager-card > .manager-permissions-form + .delete-inline {
  margin-top: 14px;
}

.sub-role-row {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding-top: 10px;
  border-top: 1px solid var(--line);
}

.sub-role-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 34px;
  padding: 4px 8px;
  border-radius: 8px;
  background: rgba(88, 101, 242, 0.18);
  color: #dce2ff;
  font-weight: 800;
}

.sub-role-chip button,
.sub-role-add button {
  border: 0;
  background: transparent;
  cursor: pointer;
  display: inline-flex;
  color: inherit;
}

.sub-role-chip svg,
.sub-role-add svg {
  width: 16px;
  height: 16px;
}

.sub-role-add {
  grid-template-columns: 120px 180px 34px;
  align-items: center;
}

.sub-role-add input {
  min-height: 34px;
  padding: 6px 8px;
}

.split-section {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.recruitment-page,
.recruitment-admin-page {
  display: grid;
  gap: 18px;
}

.recruitment-page .split-section,
.recruitment-admin-page .split-section {
  align-items: start;
}

.recruitment-steps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.recruitment-steps article {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 16px;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.03);
}

.recruitment-steps article > span {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 11px;
  font-weight: 900;
  color: #fff;
  background: rgba(88, 101, 242, 0.22);
  border: 1px solid rgba(88, 101, 242, 0.45);
  flex: 0 0 auto;
}

.recruitment-steps strong,
.recruitment-steps small {
  display: block;
}

.recruitment-steps small {
  color: var(--muted);
  line-height: 1.5;
}

.recruitment-category-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.recruitment-category-card {
  position: relative;
  display: grid;
  gap: 14px;
  padding: 18px;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 18px;
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--recruitment-accent, #5865f2) 16%, transparent), rgba(255, 255, 255, 0.025)),
    rgba(255, 255, 255, 0.03);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

.recruitment-category-card.is-selected {
  border-color: color-mix(in srgb, var(--recruitment-accent, #5865f2) 58%, transparent);
  box-shadow:
    inset 4px 0 0 var(--recruitment-accent, #5865f2),
    0 18px 48px rgba(0, 0, 0, 0.24);
}

.recruitment-category-card.is-closed {
  opacity: 0.92;
}

.recruitment-category-card header {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.recruitment-category-icon,
.recruitment-category-mini,
.recruitment-application-mini {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border-radius: 14px;
  color: #fff;
  background: linear-gradient(135deg, color-mix(in srgb, var(--recruitment-accent, #5865f2) 86%, #fff 14%), color-mix(in srgb, var(--recruitment-accent, #5865f2) 52%, #000 48%));
  box-shadow: 0 12px 28px color-mix(in srgb, var(--recruitment-accent, #5865f2) 24%, transparent);
  flex: 0 0 auto;
}

.recruitment-category-card p,
.recruitment-meta-box span,
.recruitment-answer-list p,
.recruitment-response-box p {
  color: var(--muted);
  line-height: 1.6;
}

.recruitment-meta-box,
.recruitment-response-box,
.recruitment-answer-list > div {
  display: grid;
  gap: 6px;
  padding: 14px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.035);
}

.recruitment-category-card footer,
.recruitment-application-card footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.recruitment-form,
.recruitment-admin-form,
.recruitment-review-form {
  display: grid;
  gap: 16px;
}

.recruitment-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.recruitment-form-grid > .wide-field {
  grid-column: 1 / -1;
}

.recruitment-questionnaire {
  display: grid;
  gap: 14px;
  padding-top: 8px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.recruitment-question-list {
  display: grid;
  gap: 14px;
}

.recruitment-application-list {
  display: grid;
  gap: 14px;
}

.recruitment-application-card {
  display: grid;
  gap: 14px;
  padding: 18px;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.03);
}

.recruitment-application-card header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
}

.recruitment-application-badge {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 4px 10px;
  border-radius: 999px;
  color: #dce2ff;
  background: rgba(88, 101, 242, 0.16);
  border: 1px solid rgba(88, 101, 242, 0.35);
  font-size: 0.8rem;
  font-weight: 800;
}

.recruitment-application-summary,
.recruitment-application-full {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.recruitment-application-summary > span,
.recruitment-application-full > div {
  display: grid;
  gap: 4px;
  padding: 12px;
  border-radius: 14px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(255, 255, 255, 0.03);
}

.recruitment-application-summary small,
.recruitment-application-full span,
.recruitment-application-history small {
  color: var(--muted);
}

.recruitment-application-history {
  display: grid;
  gap: 10px;
  padding-top: 6px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.recruitment-application-history > summary {
  cursor: pointer;
  color: var(--text);
  font-weight: 800;
}

.recruitment-application-history > div {
  display: grid;
  gap: 10px;
  margin-top: 8px;
}

.recruitment-application-history article,
.recruitment-admin-application-row,
.recruitment-category-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto auto auto auto;
  gap: 12px;
  align-items: center;
  padding: 14px 16px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.03);
}

.recruitment-application-history article {
  grid-template-columns: auto minmax(0, 1fr);
}

.recruitment-application-history article.is-internal {
  border-color: rgba(251, 191, 36, 0.28);
  background: rgba(251, 191, 36, 0.05);
}

.recruitment-admin-toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(180px, 230px) auto;
  gap: 14px;
  align-items: end;
  margin-bottom: 16px;
}

.recruitment-admin-toolbar label,
.recruitment-form-grid label,
.recruitment-question-list label {
  display: grid;
  gap: 8px;
}

.recruitment-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.recruitment-tabs a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 36px;
  padding: 8px 12px;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 999px;
  color: var(--muted);
  background: rgba(255, 255, 255, 0.03);
}

.recruitment-tabs a.active {
  color: var(--text);
  border-color: rgba(88, 101, 242, 0.45);
  background: rgba(88, 101, 242, 0.14);
}

.recruitment-category-list,
.recruitment-admin-application-list {
  display: grid;
  gap: 10px;
}

.recruitment-admin-application-row {
  color: var(--text);
}

.recruitment-admin-application-row:hover,
.recruitment-category-row:hover {
  border-color: rgba(88, 101, 242, 0.4);
  background: rgba(88, 101, 242, 0.08);
}

.recruitment-admin-application-row.active {
  border-color: rgba(88, 101, 242, 0.56);
  background: rgba(88, 101, 242, 0.13);
}

.recruitment-admin-application-row > span,
.recruitment-category-row > span {
  min-width: 0;
}

.recruitment-application-mini,
.recruitment-category-mini {
  width: 44px;
  height: 44px;
}

.recruitment-admin-application-row small,
.recruitment-category-row small {
  color: var(--muted);
}

.recruitment-application-layout {
  align-items: start;
}

.recruitment-application-detail,
.recruitment-application-list-panel,
.recruitment-category-editor,
.recruitment-category-list-panel {
  min-width: 0;
}

@media (max-width: 1180px) {
  .recruitment-steps,
  .recruitment-category-grid,
  .recruitment-form-grid,
  .recruitment-application-summary,
  .recruitment-application-full {
    grid-template-columns: 1fr;
  }

  .recruitment-admin-toolbar {
    grid-template-columns: 1fr;
  }

  .recruitment-application-layout,
  .split-section.recruitment-admin-top,
  .split-section.recruitment-form-section {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 820px) {
  .recruitment-category-card header,
  .recruitment-application-card header,
  .recruitment-category-row,
  .recruitment-admin-application-row {
    grid-template-columns: 1fr;
    align-items: start;
  }

  .recruitment-category-row > .row-actions,
  .recruitment-admin-application-row > .status-pill,
  .recruitment-admin-application-row > span:last-child,
  .recruitment-category-row > span:last-child {
    justify-self: start;
  }
}

.manager-list,
.log-list,
.health-list {
  display: grid;
  gap: 14px;
}

.manager-card {
  display: grid;
  gap: 14px;
  overflow: visible;
}

.manager-header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
}

.manager-meta {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.manager-meta small {
  color: var(--muted);
  word-break: break-word;
}

.manager-permissions,
.permission-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  min-width: 0;
}

.permission-pill {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 4px 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #1b1c20;
  color: #e6e9ef;
  font-size: 0.78rem;
  font-weight: 700;
}

.permission-pill-muted {
  color: var(--muted);
  background: rgba(255, 255, 255, 0.04);
}

.permission-pill-full {
  color: #dce2ff;
  background: rgba(88, 101, 242, 0.18);
  border-color: rgba(88, 101, 242, 0.45);
}

.personal-profile-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}

.personal-profile-row .guild-avatar {
  width: 78px;
  height: 78px;
  font-size: 1.55rem;
}

.personal-action-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 10px;
}

.personal-access-list {
  margin-top: 16px;
}

.personal-email-note {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  margin: 16px 0 0;
  font-size: 0.84rem;
  line-height: 1.55;
}

.personal-email-note p,
.personal-email-sync {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  margin: 0;
}

.personal-email-note svg,
.personal-email-sync svg {
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
  margin-top: 2px;
  color: var(--cyan);
}

.personal-email-sync {
  align-items: center;
  flex: 0 0 auto;
  color: #dce6ff;
  font-weight: 800;
  text-decoration: none;
}

.personal-email-sync:hover {
  color: #fff;
}

@media (max-width: 640px) {
  .personal-email-note {
    align-items: flex-start;
    flex-direction: column;
  }
}

.personal-activity-list {
  gap: 10px;
}

.personal-activity-row {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) minmax(128px, auto);
  gap: 12px;
  align-items: center;
  min-width: 0;
  padding: 12px;
  border: 1px solid rgba(142, 161, 255, 0.16);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.1), transparent 48%),
    rgba(17, 20, 35, 0.82);
}

.personal-activity-row:hover {
  border-color: rgba(34, 211, 238, 0.36);
  background:
    linear-gradient(135deg, rgba(34, 211, 238, 0.1), transparent 50%),
    rgba(24, 28, 46, 0.94);
}

.personal-activity-icon {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(142, 161, 255, 0.18);
  border-radius: 8px;
  color: #b9f2ff;
  background: rgba(88, 101, 242, 0.14);
}

.personal-activity-icon svg {
  width: 19px;
  height: 19px;
  stroke-width: 2.4;
}

.personal-activity-main {
  min-width: 0;
  display: grid;
  gap: 6px;
}

.personal-activity-main strong,
.personal-activity-main small,
.personal-activity-date {
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
  line-height: 1.35;
}

.personal-activity-main strong {
  color: #fff;
  font-size: 0.98rem;
}

.personal-activity-main small {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
  color: var(--muted);
}

.personal-activity-action {
  display: inline-flex;
  max-width: 100%;
  min-height: 24px;
  align-items: center;
  padding: 4px 8px;
  border: 1px solid rgba(142, 161, 255, 0.14);
  border-radius: 8px;
  color: #dce2ff;
  background: rgba(255, 255, 255, 0.055);
  font-size: 0.78rem;
  font-weight: 850;
}

.personal-activity-date {
  justify-self: end;
  color: var(--muted);
  font-size: 0.86rem;
  font-weight: 850;
  text-align: right;
}

.personal-activity-success .personal-activity-icon {
  color: #bbf7d0;
  border-color: rgba(87, 242, 135, 0.22);
  background: rgba(87, 242, 135, 0.1);
}

.personal-activity-warning .personal-activity-icon,
.personal-activity-critical .personal-activity-icon {
  color: #fde68a;
  border-color: rgba(250, 204, 21, 0.24);
  background: rgba(250, 204, 21, 0.1);
}

.api-key-reveal {
  display: grid;
  gap: 8px;
}

.api-key-reveal code,
.dev-command-row code {
  display: block;
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.source-config-note {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr);
  gap: 11px;
  align-items: start;
  margin-bottom: 14px;
  padding: 14px 15px;
  border: 1px solid rgba(250, 204, 21, .2);
  border-radius: 11px;
  color: #e8dca6;
  background: rgba(250, 204, 21, .065);
  line-height: 1.55;
}

.source-config-note > svg {
  width: 20px;
  margin-top: 2px;
  color: #f4d76e;
}

.source-config-note code {
  color: #fff2b3;
}

.source-config-block {
  max-width: 100%;
  max-height: 620px;
  margin: 0;
  overflow: auto;
  padding: clamp(16px, 2.5vw, 24px);
  border: 1px solid rgba(142, 161, 255, .2);
  border-radius: 12px;
  color: #dfe5ff;
  background: #090d1b;
  font: 500 .78rem/1.7 ui-monospace, SFMono-Regular, Consolas, monospace;
  white-space: pre;
}

.manager-create-form,
.manager-permissions-form {
  margin-top: 16px;
}

.manager-create-form {
  grid-template-columns: minmax(0, 1fr);
  align-items: end;
}

.manager-create-form .field-group,
.manager-permissions-form .field-group {
  align-self: stretch;
}

.manager-permissions-form {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
}

.manager-create-form .button,
.manager-permissions-form .button {
  justify-self: start;
}

.member-search-field { position: relative; display: grid; gap: 8px; min-width: 0; }
.member-search-help { color: var(--muted); line-height: 1.45; }
.member-search-results {
  position: absolute;
  z-index: 80;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  display: grid;
  gap: 6px;
  max-height: min(320px, 45vh);
  padding: 8px;
  overflow-y: auto;
  border: 1px solid rgba(130, 145, 255, 0.28);
  border-radius: 14px;
  background: rgba(10, 15, 32, 0.98);
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.34);
  scrollbar-width: thin;
  scrollbar-color: rgba(111, 120, 255, 0.8) rgba(255, 255, 255, 0.05);
}
.member-search-results[hidden], .member-search-selection[hidden],
.member-search-result[hidden], .member-search-empty[hidden] { display: none !important; }
.member-search-result, .member-search-selection {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 12px 14px;
  border: 1px solid rgba(130, 145, 255, 0.18);
  border-radius: 11px;
  color: var(--text);
  background: rgba(255, 255, 255, 0.035);
}
.member-search-result { cursor: pointer; text-align: left; }
.member-search-result:hover, .member-search-result:focus-visible {
  border-color: rgba(111, 120, 255, 0.7);
  background: rgba(92, 101, 255, 0.14);
}
.member-search-result span, .member-search-selection span { display: grid; gap: 3px; min-width: 0; }
.member-search-result small, .member-search-selection small { color: var(--muted); overflow-wrap: anywhere; }
.member-search-selection { border-color: rgba(72, 214, 159, 0.38); background: rgba(72, 214, 159, 0.09); }
.member-search-selection button {
  flex: 0 0 auto;
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: 9px;
  color: var(--text);
  background: rgba(255, 255, 255, 0.08);
  cursor: pointer;
}
.member-search-empty { margin: 0; padding: 14px; color: var(--muted); text-align: center; }

.global-announcement {
  --announcement-accent: #6f78ff;
  width: min(1380px, calc(100% - 32px));
  margin: 14px auto 0;
  padding: 15px 18px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  border: 1px solid color-mix(in srgb, var(--announcement-accent) 48%, transparent);
  border-radius: 16px;
  background: linear-gradient(115deg, color-mix(in srgb, var(--announcement-accent) 15%, rgba(16, 22, 44, 0.98)), rgba(14, 20, 38, 0.96));
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.2);
}
.global-announcement.is-success { --announcement-accent: #47d59f; }
.global-announcement.is-warning { --announcement-accent: #f4c95d; }
.global-announcement.is-danger { --announcement-accent: #ff657f; }
.global-announcement-icon {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  color: var(--announcement-accent);
  background: color-mix(in srgb, var(--announcement-accent) 15%, transparent);
}
.global-announcement-content { min-width: 0; }
.global-announcement-content strong { display: block; font-size: 1rem; }
.global-announcement-content p { margin: 3px 0 0; color: var(--muted); line-height: 1.45; overflow-wrap: anywhere; }
@media (max-width: 720px) {
  .global-announcement { grid-template-columns: auto minmax(0, 1fr); width: min(100% - 20px, 1380px); }
  .global-announcement .button { grid-column: 1 / -1; width: 100%; }
}

.twitch-live-banner { width: min(1380px, calc(100% - 32px)); margin: 14px auto 0; padding: 14px 18px; display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: 14px; border: 1px solid rgba(176, 92, 255, .5); border-radius: 16px; background: linear-gradient(110deg, rgba(110, 44, 170, .24), rgba(15, 20, 39, .97)); }
.twitch-live-banner p { margin: 3px 0 0; color: var(--muted); overflow-wrap: anywhere; }
.twitch-live-pulse { width: 12px; height: 12px; border-radius: 50%; background: #f052ff; box-shadow: 0 0 0 0 rgba(240,82,255,.65); animation: twitch-pulse 1.6s infinite; }
@keyframes twitch-pulse { 70% { box-shadow: 0 0 0 10px rgba(240,82,255,0); } 100% { box-shadow: 0 0 0 0 rgba(240,82,255,0); } }
.twitch-live-popup { position: fixed; z-index: 1000; inset: 0; display: grid; place-items: center; padding: 20px; background: rgba(3, 6, 17, .78); backdrop-filter: blur(9px); }
.twitch-live-popup[hidden] { display: none !important; }
.twitch-live-card { position: relative; width: min(760px, 100%); max-height: calc(100vh - 40px); overflow-y: auto; padding: 24px; border: 1px solid rgba(176, 92, 255, .55); border-radius: 22px; background: linear-gradient(145deg, rgba(34, 24, 58, .99), rgba(13, 19, 36, .99)); box-shadow: 0 30px 90px rgba(0,0,0,.55); }
.twitch-live-close { position: absolute; top: 16px; right: 16px; }
.twitch-live-heading { display: flex; align-items: center; gap: 14px; padding-right: 48px; }
.twitch-live-heading h2 { margin: 3px 0 0; }
.twitch-player { position: relative; aspect-ratio: 16/9; margin: 18px 0 14px; overflow: hidden; border-radius: 15px; background: #080b16; }
.twitch-player iframe { width: 100%; height: 100%; border: 0; }
.twitch-live-meta { display: grid; gap: 4px; margin-bottom: 16px; }
.twitch-live-meta small { color: var(--muted); }
@media (max-width: 720px) { .twitch-live-banner { grid-template-columns: auto minmax(0,1fr); width: calc(100% - 20px); } .twitch-live-banner .button { grid-column: 1/-1; width: 100%; } .twitch-live-card { padding: 20px 16px; } }

.panel-test-modal { position: fixed; z-index: 1100; inset: 0; display: grid; place-items: center; padding: 22px; background: rgba(3, 7, 18, .82); backdrop-filter: blur(10px); }
.panel-test-modal[hidden] { display: none !important; }
.panel-test-dialog { width: min(1080px, 100%); max-height: calc(100vh - 44px); overflow-y: auto; padding: 24px; border: 1px solid rgba(111,120,255,.42); border-radius: 22px; background: linear-gradient(145deg, rgba(25,31,57,.99), rgba(11,17,33,.99)); box-shadow: 0 30px 100px rgba(0,0,0,.58); }
.panel-test-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding-bottom: 18px; border-bottom: 1px solid rgba(255,255,255,.09); }
.panel-test-header h2 { margin: 4px 0; }
.panel-test-header p { margin: 0; color: var(--muted); }
.panel-test-grid { display: grid; grid-template-columns: minmax(300px,.82fr) minmax(360px,1.18fr); gap: 22px; margin-top: 22px; }
.panel-test-controls, .panel-test-questions { display: grid; gap: 13px; align-content: start; }
.panel-test-discord { --panel-test-accent: #5865f2; align-self: start; padding: 22px; border: 1px solid rgba(255,255,255,.1); border-radius: 17px; background: #313338; color: #f2f3f5; }
.panel-test-discord-label { display: block; margin-bottom: 12px; color: #b5bac1; font-size: .72rem; font-weight: 800; letter-spacing: .08em; }
.panel-test-embed { padding: 16px; border-left: 5px solid var(--panel-test-accent); border-radius: 5px; background: #2b2d31; }
.panel-test-embed h3 { margin: 0 0 9px; color: #fff; }
.panel-test-embed p { margin: 0 0 12px; color: #dbdee1; white-space: pre-wrap; }
.panel-test-embed img { display: block; width: 100%; max-height: 260px; margin: 12px 0; object-fit: contain; border-radius: 6px; }
.panel-test-embed small { color: #b5bac1; }
.panel-test-discord-button { margin-top: 12px; padding: 10px 15px; border: 0; border-radius: 4px; color: #fff; background: var(--panel-test-accent); font-weight: 700; pointer-events: none; }
.panel-test-result { display: grid; gap: 5px; padding: 14px; border-radius: 12px; }
.panel-test-result[hidden] { display: none !important; }
.panel-test-result.is-success { border: 1px solid rgba(72,214,159,.4); background: rgba(72,214,159,.1); }
.panel-test-result.is-error { border: 1px solid rgba(255,101,127,.42); background: rgba(255,101,127,.1); }
.panel-test-result small { color: var(--muted); }
body.modal-open { overflow: hidden; }
@media (max-width: 820px) { .panel-test-grid { grid-template-columns: 1fr; } .panel-test-modal { padding: 10px; } .panel-test-dialog { max-height: calc(100vh - 20px); padding: 18px 14px; } }

.site-countdowns { width: min(1380px, calc(100% - 32px)); margin: 14px auto 0; display: grid; gap: 10px; }
.site-countdown { --countdown-accent:#7c6cff; display: grid; grid-template-columns: auto minmax(180px,1fr) auto auto; align-items: center; gap: 16px; padding: 16px 18px; border: 1px solid color-mix(in srgb,var(--countdown-accent) 48%,transparent); border-radius: 17px; background: linear-gradient(115deg,color-mix(in srgb,var(--countdown-accent) 14%,rgba(18,24,45,.98)),rgba(12,18,34,.97)); }
.site-countdown-icon { width: 44px; height: 44px; display:grid; place-items:center; border-radius:13px; color:var(--countdown-accent); background:color-mix(in srgb,var(--countdown-accent) 16%,transparent); }
.site-countdown-copy { display:grid; gap:3px; min-width:0; }.site-countdown-copy strong{font-size:1.04rem}.site-countdown-copy p{margin:0;color:var(--muted);overflow-wrap:anywhere}
.site-countdown-timer { display:flex; gap:7px; }.site-countdown-timer span{min-width:58px;padding:8px 7px;text-align:center;border:1px solid rgba(255,255,255,.1);border-radius:10px;background:rgba(255,255,255,.04)}.site-countdown-timer strong,.site-countdown-timer small{display:block}.site-countdown-timer strong{font-size:1.05rem}.site-countdown-timer small{margin-top:2px;color:var(--muted);font-size:.66rem;text-transform:uppercase}
.site-countdown.is-complete { opacity:.65; }.countdown-admin-list{display:grid;gap:10px;margin-top:20px}.countdown-admin-card{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px;border-left:4px solid var(--countdown-accent);border-radius:12px;background:rgba(255,255,255,.035)}.countdown-admin-card>div:first-child{display:grid;gap:4px}.countdown-admin-card small{color:var(--muted)}
@media(max-width:900px){.site-countdown{grid-template-columns:auto minmax(0,1fr)}.site-countdown-timer,.site-countdown>.button{grid-column:1/-1}.site-countdown-timer{display:grid;grid-template-columns:repeat(4,1fr)}.site-countdown>.button{width:100%}}
@media(max-width:520px){.site-countdowns{width:calc(100% - 20px)}.site-countdown{padding:14px}.site-countdown-timer span{min-width:0}.site-countdown-timer small{font-size:.57rem}.countdown-admin-card{align-items:flex-start;flex-direction:column}}

.moderation-layout{display:grid;grid-template-columns:minmax(300px,.72fr) minmax(420px,1.28fr);gap:20px}.moderation-case-list,.moderation-history{display:grid;gap:10px}.moderation-case-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px;border:1px solid rgba(255,255,255,.09);border-radius:12px;color:var(--text);background:rgba(255,255,255,.025)}.moderation-case-row:hover,.moderation-case-row.active{border-color:rgba(111,120,255,.55);background:rgba(111,120,255,.1)}.moderation-case-row>span:first-child{display:grid;gap:4px}.moderation-case-row small{color:var(--muted)}.moderation-tools{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:20px 0}.moderation-tools>form{padding:16px;border:1px solid rgba(255,255,255,.09);border-radius:14px;background:rgba(255,255,255,.025)}.moderation-history>article{padding:14px;border-left:3px solid rgba(111,120,255,.55);border-radius:10px;background:rgba(255,255,255,.03)}.moderation-history article>span:first-child{display:grid;gap:4px}.moderation-history p{overflow-wrap:anywhere}.moderation-appeals-page{width:min(1100px,calc(100% - 32px));margin:32px auto}.status-pill.low{color:#8ee5bf}.status-pill.medium{color:#f4d06f}.status-pill.high,.status-pill.critical{color:#ff8296}
@media(max-width:1000px){.moderation-layout,.moderation-tools{grid-template-columns:1fr}}@media(max-width:600px){.moderation-case-row{align-items:flex-start;flex-direction:column}.moderation-appeals-page{width:calc(100% - 20px)}}

.app-shell .moderation-appeals-page { width: auto; margin: 0; min-width: 0; }
.moderation-appeals-page .panel-list { display: grid; gap: 16px; }
.appeal-member-form { margin-top: 18px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.09); }
@media (max-width: 600px) { .app-shell .moderation-appeals-page { width: auto; } }

.personal-payment-history { min-width: 0; }
.payment-history-table .data-head,
.payment-history-table .data-row { grid-template-columns: minmax(145px,.8fr) minmax(210px,1.35fr) minmax(120px,.65fr) minmax(120px,.65fr) minmax(145px,.85fr) minmax(130px,.7fr); }
.payment-history-table code { max-width: 100%; overflow-wrap: anywhere; }
.payment-history-table .data-row > span {
  display: grid;
  align-content: center;
  justify-items: start;
  gap: 6px;
  min-width: 0;
}
.payment-history-table .data-row > span > strong,
.payment-history-table .data-row > span > small {
  display: block;
  max-width: 100%;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.payment-history-table .data-row > span > small { color: var(--muted); }
.payment-history-table [data-label="Statut"] { display: grid; justify-items: start; gap: 5px; }
.payment-history-empty { grid-template-columns: 1fr !important; }
.payment-history-empty > span { display: grid; gap: 5px; padding: 8px 2px; }
.payment-history-manual { border-color: rgba(72,214,159,.2); background: rgba(72,214,159,.035); }
.payment-history-manual [data-label="Transaction"] strong { display: inline-flex; align-items: center; gap: 7px; }
.payment-history-manual [data-label="Transaction"] svg { width: 16px; color: #48d69f; }
@media (max-width: 1050px) {
  .payment-history-table .data-head { display: none; }
  .payment-history-table .data-row { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
  .payment-history-table .data-row > span::before { content: attr(data-label); display: block; margin-bottom: 4px; color: var(--muted); font-size: .72rem; font-weight: 800; text-transform: uppercase; }
}
@media (max-width: 560px) { .payment-history-table .data-row { grid-template-columns: 1fr; } }

.admin-guild-badge-form {
  margin-bottom: 20px;
}

.admin-guild-search {
  display: grid;
  gap: 8px;
  max-width: 520px;
  margin-bottom: 14px;
  color: #dbdee1;
  font-weight: 900;
}

.admin-guild-scroll {
  max-height: min(620px, 62vh);
  overflow: auto;
  padding: 10px;
  border: 1px solid rgba(142, 161, 255, 0.2);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(88, 101, 242, 0.08), transparent 38%),
    rgba(12, 15, 29, 0.58);
  scrollbar-color: rgba(88, 101, 242, 0.82) rgba(255, 255, 255, 0.08);
  scrollbar-width: thin;
}

.admin-guild-scroll::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

.admin-guild-scroll::-webkit-scrollbar-track {
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.07);
}

.admin-guild-scroll::-webkit-scrollbar-thumb {
  border: 2px solid rgba(12, 15, 29, 0.9);
  border-radius: 999px;
  background: linear-gradient(180deg, var(--primary), var(--cyan));
}

.admin-guild-scroll:focus {
  outline: 3px solid rgba(88, 101, 242, 0.22);
  outline-offset: 3px;
}

.admin-guild-table .guild-custom-badge {
  width: fit-content;
}

.admin-guild-table [hidden] {
  display: none !important;
}

.admin-guild-empty {
  margin: 12px 0 0;
}

.admin-live {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 95;
  pointer-events: none;
}

.admin-live-button,
.admin-live-panel,
.admin-live-toasts {
  pointer-events: auto;
}

.admin-live-button {
  position: relative;
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  margin-left: auto;
  border: 1px solid rgba(142, 161, 255, 0.34);
  border-radius: 999px;
  color: #fff;
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.92), rgba(34, 211, 238, 0.72)),
    rgba(15, 18, 32, 0.96);
  box-shadow: 0 16px 44px rgba(0, 0, 0, 0.34), 0 0 28px rgba(88, 101, 242, 0.28);
  cursor: pointer;
}

.admin-live-count {
  position: absolute;
  top: -4px;
  right: -4px;
  display: grid;
  place-items: center;
  min-width: 22px;
  height: 22px;
  padding: 0 6px;
  border: 2px solid #080b17;
  border-radius: 999px;
  color: #fff;
  background: var(--danger);
  font-size: 0.72rem;
  font-weight: 950;
}

.admin-live-panel {
  position: absolute;
  right: 0;
  bottom: 60px;
  width: min(430px, calc(100vw - 28px));
  max-height: min(620px, calc(100vh - 112px));
  display: grid;
  gap: 12px;
  padding: 16px;
  overflow: hidden;
  border: 1px solid rgba(142, 161, 255, 0.28);
  border-radius: 12px;
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.16), rgba(34, 211, 238, 0.08) 42%, rgba(235, 69, 158, 0.08)),
    rgba(12, 15, 29, 0.98);
  box-shadow: 0 22px 70px rgba(0, 0, 0, 0.52);
}

.admin-live-panel[hidden] {
  display: none;
}

.admin-live-panel header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
}

.admin-live-panel h2 {
  margin: 2px 0 0;
  font-size: 1.2rem;
}

.admin-live-actions {
  display: flex;
  flex: 0 0 auto;
  gap: 8px;
  align-items: center;
}

.admin-live-actions .icon-button {
  width: 38px;
  min-width: 38px;
  height: 38px;
}

.admin-live-actions .icon-button:disabled {
  cursor: not-allowed;
  opacity: 0.46;
  transform: none;
}

.admin-live-panel [data-admin-live-sound].is-active {
  color: #10131f;
  background: linear-gradient(135deg, var(--amber), var(--mint));
  border-color: rgba(254, 231, 92, 0.58);
}

.admin-live-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.admin-live-metrics span {
  display: grid;
  gap: 3px;
  min-height: 54px;
  padding: 9px;
  border: 1px solid rgba(142, 161, 255, 0.16);
  border-radius: 8px;
  color: var(--muted);
  background: rgba(255, 255, 255, 0.055);
  font-size: 0.78rem;
  font-weight: 800;
}

.admin-live-metrics strong {
  color: #fff;
  font-size: 1.05rem;
}

.admin-live-list {
  display: grid;
  gap: 9px;
  max-height: min(410px, calc(100vh - 280px));
  overflow-y: auto;
  padding-right: 4px;
  scrollbar-width: thin;
}

.admin-live-item {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 10px;
  border: 1px solid rgba(142, 161, 255, 0.14);
  border-radius: 8px;
  color: var(--ink);
  background: rgba(17, 20, 35, 0.82);
}

.admin-live-item:hover {
  border-color: rgba(34, 211, 238, 0.32);
  background: rgba(26, 30, 49, 0.96);
}

.admin-live-item-icon {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 8px;
  color: #dce2ff;
  background: rgba(88, 101, 242, 0.18);
}

.admin-event-success .admin-live-item-icon {
  color: #d8fff1;
  background: rgba(87, 242, 135, 0.15);
}

.admin-event-warning .admin-live-item-icon,
.admin-event-critical .admin-live-item-icon {
  color: #fff7c2;
  background: rgba(254, 231, 92, 0.18);
}

.admin-event-critical {
  border-color: rgba(237, 66, 69, 0.42);
  box-shadow: inset 3px 0 0 var(--danger);
}

.admin-live-item-copy {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.admin-live-item-copy strong,
.admin-live-item-copy small,
.admin-live-item-copy em {
  overflow-wrap: anywhere;
}

.admin-live-item-copy small {
  color: var(--muted);
  line-height: 1.35;
}

.admin-live-item-copy em {
  color: #8ea1ff;
  font-style: normal;
  font-size: 0.76rem;
  font-weight: 900;
}

.admin-live-toasts {
  position: absolute;
  right: 0;
  bottom: 60px;
  display: grid;
  gap: 10px;
  width: min(390px, calc(100vw - 28px));
}

.admin-live-panel:not([hidden]) + .admin-live-toasts {
  display: none;
}

.admin-live-toast {
  grid-template-columns: 34px minmax(0, 1fr);
  animation: adminLiveToastIn 0.22s ease both;
  box-shadow: 0 16px 46px rgba(0, 0, 0, 0.34);
}

.admin-timeline-section {
  overflow: visible;
}

.admin-timeline-toolbar {
  display: grid;
  grid-template-columns: minmax(220px, 1.4fr) repeat(2, minmax(150px, 0.7fr));
  gap: 12px;
  margin-bottom: 16px;
  align-items: end;
}

.admin-timeline-toolbar label {
  display: grid;
  gap: 7px;
  color: #dbdee1;
  font-weight: 900;
}

.admin-timeline-list {
  display: grid;
  gap: 10px;
}

.admin-timeline-item {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 12px;
  border: 1px solid rgba(142, 161, 255, 0.16);
  border-radius: 8px;
  color: var(--ink);
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.08), transparent 38%),
    rgba(17, 20, 35, 0.82);
}

.admin-timeline-item:hover {
  border-color: rgba(34, 211, 238, 0.34);
  transform: translateY(-1px);
}

.admin-timeline-item[hidden] {
  display: none !important;
}

.admin-timeline-icon {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 8px;
  color: #dce2ff;
  background: rgba(88, 101, 242, 0.18);
}

.admin-timeline-copy {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.admin-timeline-copy strong,
.admin-timeline-copy small,
.admin-timeline-copy em {
  overflow-wrap: anywhere;
}

.admin-timeline-copy small {
  color: var(--muted);
  line-height: 1.45;
}

.admin-timeline-copy em {
  color: #8ea1ff;
  font-style: normal;
  font-size: 0.78rem;
  font-weight: 900;
}

.admin-timeline-empty {
  margin-top: 12px;
}

@keyframes adminLiveToastIn {
  from {
    opacity: 0;
    transform: translateY(10px) scale(0.98);
  }

  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

.guild-custom-badge + .guild-custom-badge {
  margin-left: 6px;
}

.admin-tags-layout {
  align-items: start;
}

.admin-tag-form {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.admin-tag-grants h3 {
  margin: 0 0 12px;
  font-size: 1rem;
}

.grant-check-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.grant-option {
  align-content: start;
  min-height: 112px;
  padding: 12px;
  border: 1px solid rgba(142, 161, 255, 0.16);
  border-radius: 8px;
  background: rgba(12, 15, 28, 0.72);
}

.grant-option span {
  display: flex;
  align-items: center;
  gap: 8px;
}

.grant-option small {
  color: var(--muted);
  line-height: 1.35;
}

.grant-option input[type="number"] {
  margin-top: 4px;
}

.admin-tag-guild-picker {
  display: grid;
  gap: 8px;
  max-height: 360px;
  overflow: auto;
  padding-right: 4px;
}

.admin-tag-guild-picker [hidden] {
  display: none !important;
}

.admin-tag-guild-picker label {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 10px;
  border: 1px solid rgba(142, 161, 255, 0.14);
  border-radius: 8px;
  background: rgba(12, 15, 28, 0.7);
}

.admin-tag-guild-picker span {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.admin-tag-guild-picker small,
.admin-tag-assignment-table small {
  display: block;
  color: var(--muted);
  overflow-wrap: anywhere;
}

.admin-tag-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.admin-tag-card {
  display: grid;
  gap: 12px;
  min-width: 0;
  padding: 14px;
  border: 1px solid rgba(142, 161, 255, 0.16);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.08), transparent 64%),
    rgba(12, 15, 28, 0.78);
}

.admin-tag-card p {
  margin: 0;
}

.admin-tag-card-head,
.admin-tag-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.admin-tag-card-head > div {
  display: grid;
  gap: 7px;
  min-width: 0;
}

.admin-tag-card-head small {
  color: var(--muted);
}

.admin-tag-actions {
  flex-wrap: wrap;
  justify-content: flex-start;
}

.admin-tag-actions form,
.admin-tag-assignment-table form {
  margin: 0;
}

.admin-tag-assignment-table .data-head,
.admin-tag-assignment-table .data-row {
  grid-template-columns: minmax(150px, 1fr) minmax(170px, 1.1fr) minmax(140px, 1fr) minmax(120px, 0.8fr) 118px auto;
}

#managers {
  overflow: visible;
}

.manager-row,
.log-row,
.ticket-row,
.option-row,
.discord-guild-row,
.health-list div,
.data-row,
.data-head {
  display: grid;
  gap: 10px;
  align-items: center;
  min-height: 46px;
  padding: 10px 12px;
  border-radius: 8px;
  border: 1px solid rgba(142, 161, 255, 0.12);
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.08), transparent 58%),
    rgba(18, 21, 35, 0.82);
}

.manager-row {
  grid-template-columns: minmax(0, 1fr) auto auto;
}

.manager-row span {
  display: grid;
}

.manager-row small {
  color: var(--muted);
}

.log-row {
  grid-template-columns: 70px minmax(0, 1fr) minmax(0, 1.2fr) 120px;
}

.ticket-row {
  grid-template-columns: 92px minmax(0, 1.4fr) minmax(120px, 0.7fr) 130px;
}

.option-row {
  grid-template-columns: minmax(0, 1fr) 42px;
}

.discord-error-row {
  grid-template-columns: minmax(0, 1fr) auto;
}

.admin-command-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin: 0 0 18px;
}

.admin-command-card {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  min-width: 0;
  min-height: 96px;
  padding: 14px;
  border: 1px solid rgba(142, 161, 255, 0.18);
  border-radius: 10px;
  color: var(--ink);
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.12), transparent 54%),
    rgba(18, 21, 35, 0.82);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.admin-command-card:hover {
  transform: translateY(-2px);
  border-color: rgba(34, 211, 238, 0.42);
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.18), rgba(34, 211, 238, 0.08)),
    rgba(21, 26, 42, 0.94);
}

.admin-command-live {
  border-color: rgba(34, 211, 238, 0.28);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 12px 34px rgba(34, 211, 238, 0.08);
}

.admin-command-icon {
  display: inline-grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 10px;
  color: #dce2ff;
  background: rgba(88, 101, 242, 0.18);
  border: 1px solid rgba(142, 161, 255, 0.2);
}

.admin-command-card strong,
.admin-command-card small {
  display: block;
  overflow-wrap: anywhere;
}

.admin-command-card strong {
  color: #fff;
  margin-bottom: 4px;
}

.admin-command-card small {
  color: var(--muted);
  line-height: 1.35;
}

.admin-dashboard-split {
  align-items: start;
}

.admin-dashboard-guild-list,
.admin-dashboard-team-list {
  display: grid;
  gap: 10px;
}

.admin-dashboard-guild-row,
.admin-dashboard-team-row {
  display: grid;
  gap: 10px;
  align-items: center;
  min-width: 0;
  padding: 11px;
  border: 1px solid rgba(142, 161, 255, 0.14);
  border-radius: 8px;
  color: var(--ink);
  background: rgba(17, 20, 35, 0.82);
}

.admin-dashboard-guild-row {
  grid-template-columns: minmax(0, 1fr) auto auto;
}

.admin-dashboard-team-row {
  grid-template-columns: 42px minmax(0, 1fr) auto;
}

.admin-dashboard-guild-row:hover {
  border-color: rgba(34, 211, 238, 0.32);
  background: rgba(26, 30, 49, 0.94);
}

.admin-dashboard-guild-row strong,
.admin-dashboard-guild-row small,
.admin-dashboard-team-row strong,
.admin-dashboard-team-row small {
  display: block;
  overflow-wrap: anywhere;
}

.admin-dashboard-guild-row small,
.admin-dashboard-team-row small {
  color: var(--muted);
  margin-top: 3px;
}

.admin-dashboard-team-row .team-avatar {
  width: 42px;
  height: 42px;
}

.danger-clear-panel {
  border-color: rgba(237, 66, 69, 0.34);
  background:
    linear-gradient(135deg, rgba(237, 66, 69, 0.1), transparent 42%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.045), transparent 46%),
    rgba(18, 21, 35, 0.94);
}

.danger-clear-form {
  display: grid;
  gap: 14px;
}

.danger-clear-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.danger-clear-option {
  display: flex;
  gap: 11px;
  align-items: flex-start;
  min-width: 0;
  padding: 13px;
  border: 1px solid rgba(237, 66, 69, 0.2);
  border-radius: 8px;
  background: rgba(237, 66, 69, 0.07);
}

.danger-clear-option input {
  width: auto;
  min-height: 0;
  margin-top: 4px;
}

.danger-clear-option span {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.danger-clear-option strong {
  color: #fff;
}

.danger-clear-option small,
.danger-clear-option em {
  color: var(--muted);
  overflow-wrap: anywhere;
}

.danger-clear-option em {
  color: #ffd8d9;
  font-style: normal;
  font-weight: 900;
}

.danger-clear-confirm {
  max-width: 360px;
}

.admin-service-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.admin-service-card {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr) 28px;
  align-items: center;
  gap: 14px;
  min-width: 0;
  min-height: 104px;
  padding: 16px;
  border: 1px solid rgba(142, 161, 255, 0.18);
  border-radius: 10px;
  color: var(--ink);
  text-decoration: none;
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.12), transparent 56%),
    rgba(18, 21, 35, 0.82);
  transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease;
}

.admin-service-card:hover {
  transform: translateY(-2px);
  border-color: rgba(34, 211, 238, 0.42);
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.18), rgba(34, 211, 238, 0.06)),
    rgba(21, 26, 42, 0.92);
}

.admin-service-icon {
  display: inline-grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border-radius: 10px;
  color: #dce2ff;
  background: rgba(88, 101, 242, 0.18);
  border: 1px solid rgba(142, 161, 255, 0.22);
}

.admin-service-icon svg,
.admin-service-arrow {
  width: 20px;
  height: 20px;
}

.admin-service-copy {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.admin-service-copy strong {
  color: #fff;
  font-size: 1rem;
}

.admin-service-copy small {
  color: var(--muted);
  line-height: 1.45;
}

.admin-service-arrow {
  color: var(--cyan);
  justify-self: end;
}

.dev-guide-list {
  display: grid;
  gap: 8px;
  margin: 0;
  padding-left: 18px;
  color: var(--muted);
}

.dev-guide-list li {
  line-height: 1.45;
}

.dev-command-row code {
  display: block;
  margin-top: 8px;
  max-width: 100%;
  overflow-x: auto;
  padding: 8px 10px;
  border: 1px solid rgba(142, 161, 255, 0.18);
  border-radius: 8px;
  color: #dce2ff;
  background: rgba(10, 13, 26, 0.72);
}

.discord-guild-row {
  grid-template-columns: minmax(0, 1fr) auto;
}

.option-row span,
.ticket-row span,
.discord-guild-row span {
  display: grid;
  min-width: 0;
}

.option-row small,
.ticket-row small,
.discord-guild-row small {
  color: var(--muted);
}

.log-direction {
  font-weight: 900;
  color: var(--primary-strong);
}

.stat-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 18px;
}

.stat-grid article {
  position: relative;
  overflow: hidden;
  padding: 22px;
}

.stat-grid article::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(135deg, rgba(88, 101, 242, 0.18), transparent 46%, rgba(250, 204, 21, 0.08));
  opacity: 0;
  transition: opacity 0.2s ease;
}

.stat-grid article:hover::before {
  opacity: 1;
}

.stat-grid strong {
  position: relative;
  display: block;
  font-size: 2rem;
  color: #fff;
  text-shadow: 0 0 28px rgba(88, 101, 242, 0.22);
}

.stat-grid span,
.health-list dt {
  position: relative;
  color: var(--muted);
  font-weight: 800;
}

.health-list {
  margin: 0;
}

.health-list div {
  grid-template-columns: 120px minmax(0, 1fr);
}

.health-list dd,
.health-list dt {
  margin: 0;
  overflow-wrap: anywhere;
}

.data-table {
  display: grid;
  gap: 8px;
}

.data-head,
.data-row {
  grid-template-columns: minmax(130px, 1fr) minmax(180px, 1.2fr) 90px 90px 110px;
}

.data-head {
  color: var(--muted);
  font-weight: 900;
  border-color: transparent;
  background: transparent;
}

.data-row {
  color: var(--ink);
  transition: transform 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease, background 0.16s ease;
}

.data-row:hover,
.manager-row:hover,
.log-row:hover,
.ticket-row:hover,
.option-row:hover,
.discord-guild-row:hover {
  border-color: rgba(34, 211, 238, 0.28);
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.16), rgba(34, 211, 238, 0.06) 58%, transparent),
    rgba(22, 26, 43, 0.92);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.18);
}

.data-row span {
  overflow-wrap: anywhere;
}

.ticket-filter-form {
  display: grid;
  grid-template-columns: minmax(220px, 1.5fr) repeat(4, minmax(130px, 1fr)) minmax(110px, 0.8fr) minmax(110px, 0.8fr) minmax(95px, 0.65fr) auto auto;
  gap: 12px;
  align-items: end;
}

.ticket-filter-form label {
  display: grid;
  gap: 7px;
  min-width: 0;
  color: #dbdee1;
  font-weight: 800;
}

.ticket-filter-search {
  min-width: 260px;
}

.ticket-manager-section {
  overflow: hidden;
}

.ticket-scroll {
  max-height: min(760px, 72vh);
  overflow: auto;
  padding: 0 2px 8px 0;
  border: 1px solid rgba(142, 161, 255, 0.2);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(88, 101, 242, 0.08), transparent 38%),
    rgba(12, 15, 29, 0.58);
  scrollbar-color: rgba(88, 101, 242, 0.8) rgba(255, 255, 255, 0.08);
}

.ticket-scroll:focus {
  outline: 3px solid rgba(88, 101, 242, 0.22);
  outline-offset: 3px;
}

.ticket-admin-table {
  width: 100%;
  min-width: 0;
  gap: 10px;
  padding: 10px;
}

/* Le conteneur parent gere deja les deux axes de defilement. */
.ticket-scroll > .ticket-admin-table {
  max-width: none;
  overflow: visible;
  padding-bottom: 10px;
}

.ticket-admin-table .data-head,
.ticket-admin-table .data-row {
  grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr) minmax(0, 0.65fr) minmax(0, 0.9fr) minmax(0, 1.05fr) minmax(0, 0.7fr);
}

.ticket-admin-table .data-head {
  position: sticky;
  top: 0;
  z-index: 3;
  min-height: 42px;
  border-bottom: 1px solid rgba(142, 161, 255, 0.18);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.18), rgba(34, 211, 238, 0.06)),
    rgba(20, 23, 38, 0.98);
  backdrop-filter: none;
}

.ticket-record {
  display: grid;
  gap: 8px;
  scroll-margin-top: 90px;
}

.ticket-record:target .data-row {
  outline: 2px solid rgba(88, 101, 242, 0.7);
  outline-offset: 2px;
}

.ticket-id-cell,
.ticket-main-cell,
.ticket-member-cell,
.ticket-activity-cell,
.ticket-priority-cell,
.ticket-discord-cell {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.ticket-title-line {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.ticket-title-line .status-pill {
  flex: 0 0 auto;
}

@media (max-width: 900px) {
  .ticket-admin-table .data-head {
    display: none;
  }

  .ticket-admin-table .data-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
  }

  .ticket-admin-table .ticket-main-cell,
  .ticket-admin-table .ticket-action-buttons {
    grid-column: 1 / -1;
  }
}

@media (max-width: 620px) {
  .ticket-admin-table,
  .ticket-admin-table .data-row {
    min-width: 0;
  }

  .ticket-admin-table .data-row {
    grid-template-columns: minmax(0, 1fr);
  }

  .ticket-admin-table .ticket-main-cell,
  .ticket-admin-table .ticket-action-buttons {
    grid-column: auto;
  }
}

.member-feature-settings-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.member-feature-setting {
  display: grid;
  align-content: start;
  gap: 16px;
  min-width: 0;
  padding: 17px;
  border: 1px solid rgba(142, 161, 255, .18);
  border-radius: 15px;
  background: rgba(255, 255, 255, .025);
  transition: border-color .18s ease, background .18s ease, opacity .18s ease;
}

.member-feature-setting.is-enabled {
  border-color: rgba(52, 211, 153, .3);
  background: linear-gradient(145deg, rgba(52, 211, 153, .075), rgba(255, 255, 255, .025));
}

.member-feature-setting.is-disabled {
  border-color: rgba(251, 191, 36, .28);
  background: linear-gradient(145deg, rgba(251, 191, 36, .065), rgba(255, 255, 255, .02));
}

.member-feature-setting > header {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  gap: 11px;
  align-items: center;
}

.member-feature-setting > header > span {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  color: #aebaff;
  border-radius: 12px;
  background: rgba(88, 101, 242, .14);
}

.member-feature-setting > header > span svg {
  width: 20px;
}

.member-feature-setting > header > div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.member-feature-setting > header strong {
  color: #fff;
}

.member-feature-setting > header small,
.member-feature-setting > label {
  color: var(--muted);
}

.feature-toggle {
  display: grid;
  grid-template-columns: auto;
  justify-items: center;
  gap: 4px;
  color: var(--muted);
  cursor: pointer;
}

.feature-toggle > input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
}

.feature-toggle > span {
  position: relative;
  width: 44px;
  height: 25px;
  border: 1px solid rgba(142, 161, 255, .35);
  border-radius: 999px;
  background: rgba(7, 11, 24, .72);
}

.feature-toggle > span::after {
  content: '';
  position: absolute;
  top: 3px;
  left: 3px;
  width: 17px;
  height: 17px;
  border-radius: 50%;
  background: #9ba7c9;
  transition: transform .18s ease, background .18s ease, box-shadow .18s ease;
}

.feature-toggle > input:checked + span {
  border-color: rgba(52, 211, 153, .6);
  background: rgba(52, 211, 153, .18);
}

.feature-toggle > input:checked + span::after {
  transform: translateX(19px);
  background: #65efbd;
  box-shadow: 0 0 13px rgba(52, 211, 153, .45);
}

.feature-toggle > input:focus-visible + span {
  outline: 3px solid rgba(34, 211, 238, .35);
  outline-offset: 3px;
}

.feature-toggle > em {
  color: inherit;
  font-size: .68rem;
  font-style: normal;
  font-weight: 850;
}

.feature-unavailable-banner {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr);
  gap: 14px;
  align-items: center;
  padding: 16px;
  border: 1px solid rgba(251, 191, 36, .28);
  border-radius: 14px;
  background: linear-gradient(120deg, rgba(251, 191, 36, .09), rgba(255, 255, 255, .025));
}

.feature-unavailable-banner > svg {
  width: 28px;
  color: #f6d47a;
  justify-self: center;
}

.feature-unavailable-banner strong,
.feature-unavailable-banner p,
.feature-unavailable-panel h2,
.feature-unavailable-panel p {
  margin: 0;
}

.feature-unavailable-banner p,
.feature-unavailable-panel p {
  margin-top: 4px;
  color: var(--muted);
  line-height: 1.55;
}

.feature-unavailable-panel {
  display: grid;
  grid-template-columns: 76px minmax(0, 1fr);
  gap: 22px;
  align-items: start;
  max-width: 860px;
  padding: clamp(24px, 4vw, 42px);
  border: 1px solid rgba(251, 191, 36, .25);
  border-radius: 20px;
  background: linear-gradient(140deg, rgba(251, 191, 36, .08), rgba(19, 25, 47, .94));
}

.feature-unavailable-panel > span {
  display: grid;
  place-items: center;
  width: 76px;
  height: 76px;
  color: #f7d77e;
  border-radius: 20px;
  background: rgba(251, 191, 36, .11);
}

.feature-unavailable-panel > span svg {
  width: 34px;
}

.feature-unavailable-panel > div {
  display: grid;
  justify-items: start;
  gap: 9px;
}

.feature-unavailable-panel small {
  color: #f6d47a;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.public-feature-unavailable-shell {
  display: grid;
  place-items: center;
  width: min(1160px, calc(100% - 32px));
  min-height: clamp(480px, 68vh, 760px);
  margin: 0 auto;
  padding: clamp(42px, 8vw, 96px) 0;
}

.public-feature-unavailable-shell .feature-unavailable-panel {
  width: min(100%, 900px);
  box-shadow: 0 26px 80px rgba(0, 0, 0, .28);
}

.public-feature-unavailable-shell h1 {
  margin: 0;
  font-size: clamp(1.8rem, 4vw, 3rem);
}

.public-feature-unavailable-shell .hero-actions {
  margin-top: 8px;
}

.suggestion-private-choice {
  align-items: flex-start !important;
  padding: 14px;
  border: 1px solid rgba(167, 139, 250, .22);
  border-radius: 12px;
  background: rgba(139, 92, 246, .07);
}

.suggestion-private-choice > span {
  display: grid;
  gap: 3px;
}

.suggestion-private-choice small {
  color: var(--muted);
  font-weight: 500;
}

.suggestion-labels {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
}

.suggestion-domain.is-private {
  color: #ddd2ff;
  border-color: rgba(167, 139, 250, .32);
  background: rgba(139, 92, 246, .13);
}

.suggestion-domain.is-private svg {
  width: 14px;
}

.suggestion-card.is-private,
.suggestion-admin-list > article.is-private {
  border-color: rgba(167, 139, 250, .3);
  background: linear-gradient(140deg, rgba(139, 92, 246, .08), rgba(255, 255, 255, .02));
}

.suggestion-private-note {
  display: inline-flex;
  gap: 7px;
  align-items: center;
  color: #b9b2d7;
  font-size: .8rem;
}

.suggestion-private-note svg {
  width: 16px;
}

@media (max-width: 1080px) {
  .member-feature-settings-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 620px) {
  .member-feature-setting > header {
    grid-template-columns: 42px minmax(0, 1fr);
  }

  .feature-toggle {
    grid-column: 1 / -1;
    grid-template-columns: auto auto;
    justify-self: start;
    align-items: center;
  }

  .feature-unavailable-panel {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* Navigation publique adaptative : passe en menu compact dès que les liens
   ne tiennent plus, y compris avec les boutons Panel/Admin d'un membre connecté. */
html,
body {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
  overflow-x: clip;
}

.site-header {
  width: 100%;
  max-width: 100vw;
}

@media (min-width: 881px) {
  .site-header:not(.is-nav-compact) {
    height: auto;
    min-height: 72px;
  }

  .site-header:not(.is-nav-compact) .brand {
    flex: 0 0 auto;
  }

  .site-header:not(.is-nav-compact) .site-nav {
    flex-wrap: nowrap;
  }

  .site-header:not(.is-nav-compact) .site-nav a {
    flex: 0 0 auto;
    white-space: nowrap;
  }

  .site-header.is-nav-compact {
    height: auto;
    min-height: 68px;
    align-items: center;
    overflow: visible;
  }

  .site-header.is-nav-compact .brand {
    flex: 0 1 auto;
  }

  .site-header.is-nav-compact .nav-toggle {
    display: inline-flex !important;
  }

  .site-header.is-nav-compact .site-nav {
    position: absolute;
    top: calc(100% + 8px);
    right: clamp(18px, 3vw, 38px);
    left: auto;
    z-index: 70;
    display: none;
    width: min(390px, calc(100vw - 36px));
    max-height: calc(100vh - 92px);
    padding: 12px;
    overflow-x: hidden;
    overflow-y: auto;
    flex: none;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: stretch;
    gap: 5px;
    border: 1px solid rgba(142, 161, 255, .3);
    border-radius: 14px;
    background:
      linear-gradient(135deg, rgba(88, 101, 242, .16), transparent 48%),
      rgba(10, 14, 29, .99);
    box-shadow: 0 24px 70px rgba(0, 0, 0, .5);
  }

  .site-header.is-nav-compact .site-nav.open {
    display: flex;
  }

  .site-header.is-nav-compact .site-nav a {
    width: 100%;
    max-width: none;
    justify-content: flex-start;
    white-space: normal;
  }

  .site-header.is-nav-compact .nav-icon-link {
    width: 100%;
  }
}

.ticket-id-cell strong,
.ticket-main-cell strong {
  color: #fff;
}

.ticket-priority {
  display: inline-flex;
  width: fit-content;
  min-height: 28px;
  align-items: center;
  padding: 4px 9px;
  border-radius: 8px;
  font-weight: 900;
}

.ticket-priority.hot {
  color: #ffd8d8;
  background: rgba(242, 63, 66, 0.18);
}

.ticket-priority.warm {
  color: #fff1b8;
  background: rgba(250, 204, 21, 0.18);
}

.ticket-priority.soft {
  color: #dce2ff;
  background: rgba(88, 101, 242, 0.18);
}

.ticket-priority.quiet {
  color: #c8f7dd;
  background: rgba(35, 165, 89, 0.16);
}

.ticket-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.ticket-tags span {
  display: inline-flex;
  min-height: 24px;
  align-items: center;
  padding: 3px 7px;
  border-radius: 8px;
  color: #dbdee1;
  background: #2b2d31;
  font-size: 0.78rem;
  font-weight: 800;
}

.ticket-discord-cell a {
  color: #a5b4fc;
  font-weight: 900;
}

.ticket-action-buttons {
  display: flex !important;
  flex-wrap: wrap;
  gap: 8px;
}

.ticket-detail-panel {
  border: 1px solid rgba(142, 161, 255, 0.18);
  border-radius: 8px;
  background: rgba(12, 15, 29, 0.72);
}

.ticket-detail-panel summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 42px;
  padding: 10px 12px;
  cursor: pointer;
  color: #dbdee1;
  font-weight: 900;
  list-style: none;
}

.ticket-detail-panel summary::-webkit-details-marker {
  display: none;
}

.ticket-detail-panel summary svg {
  width: 18px;
  height: 18px;
  transition: transform 0.15s ease;
}

.ticket-detail-panel[open] summary svg {
  transform: rotate(180deg);
}

.ticket-detail-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  padding: 12px;
  border-top: 1px solid var(--line);
}

.ticket-detail-block,
.ticket-meta-form,
.ticket-note-form,
.ticket-discord-form {
  display: grid;
  gap: 10px;
  align-content: start;
  min-width: 0;
  padding: 12px;
  border: 1px solid rgba(142, 161, 255, 0.16);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.08), transparent 52%),
    rgba(18, 21, 35, 0.86);
}

.ticket-detail-block h3,
.ticket-meta-form h3,
.ticket-note-form h3,
.ticket-discord-form h3 {
  margin: 0;
  font-size: 1rem;
}

.ticket-info-list {
  display: grid;
  gap: 8px;
  margin: 0;
}

.ticket-info-list div {
  display: grid;
  grid-template-columns: 94px minmax(0, 1fr);
  gap: 10px;
}

.ticket-info-list dt,
.ticket-info-list dd {
  margin: 0;
  overflow-wrap: anywhere;
}

.ticket-info-list dt {
  color: var(--muted);
  font-weight: 900;
}

.ticket-answer-list {
  display: grid;
  gap: 8px;
}

.ticket-answer-list div {
  display: grid;
  gap: 3px;
  padding: 8px;
  border-radius: 8px;
  background: rgba(43, 48, 70, 0.72);
}

.ticket-answer-list strong,
.ticket-answer-list span,
.ticket-transcript-excerpt p {
  overflow-wrap: anywhere;
}

.ticket-transcript-excerpt {
  grid-column: 1 / -1;
}

.ticket-meta-form label,
.ticket-note-form label,
.ticket-discord-form label {
  display: grid;
  gap: 7px;
  color: #dbdee1;
  font-weight: 800;
}

.report-manager-section {
  overflow: hidden;
}

.report-command-panel {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin: 0 0 18px;
}

.report-command-card {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  min-width: 0;
  min-height: 96px;
  padding: 14px;
  border: 1px solid rgba(142, 161, 255, 0.18);
  border-radius: 10px;
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.12), transparent 52%),
    rgba(18, 21, 35, 0.82);
}

.report-command-critical {
  border-color: rgba(237, 66, 69, 0.28);
  background:
    linear-gradient(135deg, rgba(237, 66, 69, 0.14), transparent 54%),
    rgba(18, 21, 35, 0.9);
}

.report-command-card > span {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 10px;
  color: #dce2ff;
  background: rgba(88, 101, 242, 0.18);
  border: 1px solid rgba(142, 161, 255, 0.2);
}

.report-command-critical > span {
  color: #ffd8d9;
  background: rgba(237, 66, 69, 0.16);
  border-color: rgba(237, 66, 69, 0.28);
}

.report-command-card strong,
.report-command-card small {
  display: block;
  overflow-wrap: anywhere;
}

.report-command-card strong {
  color: #fff;
  margin-bottom: 4px;
}

.report-command-card small {
  color: var(--muted);
  line-height: 1.4;
}

.report-filter-form {
  display: grid;
  grid-template-columns: minmax(240px, 1.4fr) repeat(3, minmax(135px, 0.8fr)) auto auto;
  gap: 12px;
  align-items: end;
  margin-bottom: 14px;
}

.report-filter-form label {
  display: grid;
  gap: 7px;
  min-width: 0;
  color: #dbdee1;
  font-weight: 800;
}

.report-filter-search {
  min-width: 250px;
}

.report-scroll {
  max-height: min(680px, 68vh);
  overflow-y: auto;
  overflow-x: hidden;
  padding: 8px;
  border: 1px solid rgba(142, 161, 255, 0.2);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(88, 101, 242, 0.08), transparent 38%),
    rgba(12, 15, 29, 0.58);
  scrollbar-color: rgba(34, 211, 238, 0.72) rgba(255, 255, 255, 0.08);
}

.report-scroll:focus {
  outline: 3px solid rgba(34, 211, 238, 0.2);
  outline-offset: 3px;
}

.report-admin-table {
  width: 100%;
  min-width: 0;
  overflow: visible;
  gap: 10px;
  padding: 0;
}

.report-admin-table .data-head,
.report-admin-table .data-row {
  grid-template-columns: minmax(0, 1.65fr) minmax(0, 0.9fr) minmax(0, 0.9fr) minmax(0, 0.66fr) minmax(0, 0.76fr) minmax(0, 0.82fr) minmax(76px, 0.48fr);
}

.report-admin-table .data-head {
  position: sticky;
  top: 0;
  z-index: 3;
  min-height: 42px;
  border-bottom: 1px solid rgba(142, 161, 255, 0.18);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.18), rgba(34, 211, 238, 0.06)),
    rgba(20, 23, 38, 0.98);
}

.report-row.active {
  border-color: rgba(34, 211, 238, 0.45);
  box-shadow: 0 0 0 2px rgba(34, 211, 238, 0.12);
}

.report-row {
  min-height: 96px;
}

.report-admin-table .data-row > span {
  display: grid;
  gap: 5px;
  align-content: center;
}

.report-admin-table .data-row > span > small,
.report-admin-table .data-row > span > strong {
  display: block;
}

.report-admin-table .data-row > span > small {
  line-height: 1.35;
}

.report-admin-table .status-pill,
.report-admin-table .ticket-priority,
.report-admin-table .permission-pill,
.report-admin-table .compact-button {
  width: fit-content;
}

.report-empty-state {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  min-height: 118px;
  padding: 18px;
  border: 1px solid rgba(142, 161, 255, 0.18);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.14), rgba(34, 211, 238, 0.05)),
    rgba(12, 15, 29, 0.72);
}

.report-empty-state > svg {
  width: 28px;
  height: 28px;
  color: var(--cyan);
}

.report-empty-state strong {
  display: block;
  color: #fff;
  font-size: 1.08rem;
}

.report-empty-state p {
  margin: 4px 0 0;
  color: var(--muted);
  line-height: 1.5;
}

.report-main-cell {
  display: grid;
  gap: 6px;
}

.report-main-cell strong {
  color: #fff;
}

.report-main-cell em {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  font-style: normal;
}

.report-sla {
  display: inline-flex !important;
  align-items: center;
  gap: 5px;
  margin-top: 6px;
  font-weight: 900;
}

.report-sla svg {
  width: 14px;
  height: 14px;
}

.report-sla.online {
  color: var(--mint);
}

.report-sla.warning {
  color: var(--amber);
}

.report-sla.offline {
  color: #ffd8d9;
}

.report-admin-table .compact-button {
  width: fit-content;
  min-width: 0;
}

.report-detail-panel {
  scroll-margin-top: 92px;
}

.report-detail-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(360px, 0.75fr);
  gap: 16px;
  align-items: stretch;
  margin-bottom: 14px;
  padding: 16px;
  border: 1px solid rgba(142, 161, 255, 0.18);
  border-radius: 12px;
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.14), transparent 46%),
    rgba(12, 15, 29, 0.72);
}

.report-detail-hero.admin-event-critical {
  border-color: rgba(237, 66, 69, 0.34);
  background:
    linear-gradient(135deg, rgba(237, 66, 69, 0.14), transparent 46%),
    rgba(12, 15, 29, 0.78);
}

.report-detail-identity {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr);
  gap: 14px;
  align-items: center;
  min-width: 0;
}

.report-detail-icon {
  display: grid;
  place-items: center;
  width: 54px;
  height: 54px;
  border-radius: 14px;
  color: #dce2ff;
  background: rgba(88, 101, 242, 0.2);
  border: 1px solid rgba(142, 161, 255, 0.22);
}

.report-detail-icon svg {
  width: 25px;
  height: 25px;
}

.report-detail-identity h3 {
  margin: 5px 0 4px;
  color: #fff;
  font-size: clamp(1.35rem, 2vw, 2rem);
  line-height: 1.12;
}

.report-detail-identity p {
  margin: 0;
  color: var(--muted);
}

.report-detail-kpis {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.report-detail-kpis article {
  display: grid;
  gap: 4px;
  min-height: 72px;
  padding: 12px;
  border: 1px solid rgba(142, 161, 255, 0.14);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.055);
}

.report-detail-kpis strong {
  color: #fff;
  font-size: 1.05rem;
}

.report-detail-kpis span {
  color: var(--muted);
  font-weight: 900;
  font-size: 0.82rem;
}

.report-progress,
.report-support-checklist {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 14px;
}

.report-progress span,
.report-support-checklist span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 36px;
  padding: 7px 10px;
  border: 1px solid rgba(142, 161, 255, 0.16);
  border-radius: 999px;
  color: var(--muted);
  background: rgba(255, 255, 255, 0.055);
  font-weight: 900;
  font-size: 0.86rem;
}

.report-progress span svg,
.report-support-checklist span svg {
  width: 15px;
  height: 15px;
}

.report-progress span.done,
.report-progress span.active,
.report-support-checklist span.is-ok {
  color: #d8fff1;
  border-color: rgba(87, 242, 135, 0.3);
  background: rgba(87, 242, 135, 0.11);
}

.report-progress span.active {
  box-shadow: 0 0 0 2px rgba(87, 242, 135, 0.08);
}

.report-support-checklist span.is-missing {
  color: #ffd8d9;
  border-color: rgba(237, 66, 69, 0.32);
  background: rgba(237, 66, 69, 0.1);
}

.report-support-checklist span.is-muted {
  opacity: 0.74;
}

.report-detail-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.report-description-block,
.report-notes-block {
  grid-column: span 2;
}

.report-description-block p,
.report-note-list p {
  margin: 0;
  overflow-wrap: anywhere;
  color: #dce2ff;
  line-height: 1.6;
}

.report-links-block .row-actions {
  align-items: stretch;
}

.report-payload-block dd,
.report-links-block dd {
  display: grid;
  gap: 3px;
}

.report-note-list {
  display: grid;
  gap: 10px;
}

.report-note-list div {
  display: grid;
  gap: 5px;
  padding: 10px;
  border: 1px solid rgba(142, 161, 255, 0.15);
  border-radius: 8px;
  background: rgba(43, 48, 70, 0.62);
}

.report-note-list small {
  color: var(--muted);
  font-weight: 800;
}

.pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 16px;
}

.pagination span {
  color: var(--muted);
  font-weight: 900;
}

.guide-flow-table .data-head,
.guide-flow-table .data-row {
  grid-template-columns: minmax(120px, 0.8fr) minmax(190px, 1.2fr) minmax(190px, 1.2fr) minmax(150px, 0.9fr);
}

.team-hero {
  padding-bottom: 36px;
}

.team-section {
  padding-top: 40px;
}

.team-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 320px));
  gap: 18px;
  justify-content: center;
}

.team-card {
  min-height: 320px;
  display: grid;
  align-content: space-between;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--team-role-color, #8ea1ff) 34%, rgba(142, 161, 255, 0.2));
  border-radius: var(--radius);
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--team-role-color, #5865f2) 16%, transparent), transparent 48%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.04), transparent 50%),
    var(--surface);
  box-shadow: var(--shadow);
  transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.team-card:hover {
  border-color: color-mix(in srgb, var(--team-role-color, #22d3ee) 58%, rgba(34, 211, 238, 0.42));
  box-shadow: var(--shadow), 0 0 34px color-mix(in srgb, var(--team-role-color, #5865f2) 24%, transparent);
}

.team-card-link {
  color: inherit;
  text-decoration: none;
  cursor: pointer;
}

.team-card-link:focus-visible {
  outline: 3px solid rgba(34, 211, 238, 0.42);
  outline-offset: 4px;
}

.team-avatar {
  display: grid;
  place-items: center;
  position: relative;
  overflow: hidden;
  width: 100%;
  aspect-ratio: 1 / 1;
  color: #fff;
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.86), rgba(34, 211, 238, 0.72) 58%, rgba(235, 69, 158, 0.54)),
    #232428;
  font-size: 4rem;
  font-weight: 900;
}

.team-avatar.has-image {
  background: #1e1f22;
}

.team-avatar-fallback {
  grid-area: 1 / 1;
}

.team-avatar img {
  grid-area: 1 / 1;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: relative;
  z-index: 1;
  image-rendering: auto;
}

.team-card-body {
  padding: 18px;
}

.team-role {
  display: inline-flex;
  min-height: 28px;
  align-items: center;
  padding: 4px 10px;
  border-radius: 999px;
  color: #f8fbff;
  background: color-mix(in srgb, var(--team-role-color, #5865f2) 34%, rgba(88, 101, 242, 0.18));
  border: 1px solid color-mix(in srgb, var(--team-role-color, #5865f2) 45%, rgba(142, 161, 255, 0.18));
  font-weight: 900;
  font-size: 0.82rem;
}

.team-card h3 {
  margin: 12px 0 0;
  font-size: 1.45rem;
}

.team-empty {
  width: min(760px, 100%);
  margin: 0 auto;
}

.team-admin-form,
.team-admin-edit-form {
  display: grid;
  gap: 14px;
  align-items: end;
}

.team-admin-form {
  grid-template-columns: minmax(150px, 1fr) minmax(160px, 1fr) 90px;
}

.team-discord-form {
  grid-template-columns: minmax(170px, 0.9fr) minmax(130px, 0.55fr) minmax(150px, 0.7fr) minmax(150px, 0.7fr) auto;
}

.team-discord-form .team-admin-wide {
  grid-column: 1 / -1;
}

.team-role-select .multi-select-panel {
  max-height: min(380px, 52vh);
}

.team-role-option {
  border-left: 3px solid var(--team-role-color, #5865f2);
}

.team-sync-refresh {
  margin-top: 12px;
}

.team-preview-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 10px;
  margin-top: 16px;
}

.team-preview-card {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  min-width: 0;
  padding: 10px;
  border: 1px solid color-mix(in srgb, var(--team-role-color, #5865f2) 36%, rgba(142, 161, 255, 0.16));
  border-radius: 8px;
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--team-role-color, #5865f2) 12%, transparent), transparent 56%),
    rgba(255, 255, 255, 0.045);
}

.team-preview-card .team-avatar {
  width: 52px;
  height: 52px;
  aspect-ratio: auto;
  border-radius: 8px;
  font-size: 1.15rem;
}

.team-preview-card span {
  min-width: 0;
}

.team-preview-card strong,
.team-preview-card small {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
  line-height: 1.35;
}

.team-preview-card small {
  color: var(--muted);
  margin-top: 3px;
}

.team-admin-form label,
.team-admin-edit-form label {
  display: grid;
  gap: 7px;
  color: #dbdee1;
  font-weight: 800;
}

.team-admin-wide {
  grid-column: span 2;
}

.team-admin-list {
  display: grid;
  gap: 14px;
}

.team-admin-card {
  display: grid;
  grid-template-columns: 86px minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface-strong);
}

.team-admin-card .team-avatar {
  width: 86px;
  height: 86px;
  aspect-ratio: auto;
  border-radius: 8px;
  overflow: hidden;
  font-size: 2rem;
}

.team-admin-edit-form {
  grid-template-columns: minmax(140px, 1fr) minmax(150px, 1fr) 84px minmax(160px, 1fr) minmax(140px, 0.8fr) auto auto;
}

.team-admin-readonly {
  display: grid;
  gap: 6px;
}

.permission-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: flex-start;
  min-width: 0;
  margin-top: 14px;
}

.permission-badges span {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  min-height: 30px;
  padding: 6px 10px;
  border-radius: 8px;
  color: #dce2ff;
  background: rgba(88, 101, 242, 0.18);
  font-weight: 800;
  font-size: 0.88rem;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.manager-permissions .permission-badges {
  margin-top: 0;
}

.permission-form {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) minmax(180px, 1fr) auto;
  gap: 14px;
  align-items: end;
}

.permission-form > label {
  display: grid;
  gap: 7px;
  color: #dbdee1;
  font-weight: 800;
}

.permission-checks {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.permission-checks label {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  min-width: 0;
  min-height: 74px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #1e1f22;
}

.permission-checks span {
  display: grid;
  gap: 4px;
  min-width: 0;
  overflow-wrap: anywhere;
}

.permission-checks small,
.data-row small {
  color: var(--muted);
  overflow-wrap: anywhere;
}

.permission-table .data-head,
.permission-table .data-row {
  grid-template-columns: minmax(150px, 1fr) minmax(150px, 1fr) minmax(220px, 1.4fr) 120px 90px;
}

.admin-guild-table .data-head,
.admin-guild-table .data-row {
  grid-template-columns: minmax(130px, 1.1fr) minmax(150px, 0.9fr) minmax(120px, 0.85fr) minmax(110px, 0.75fr) minmax(120px, 0.85fr) 90px 90px 110px 72px;
}

.premium-subscription-table .data-head,
.premium-subscription-table .data-row {
  grid-template-columns: minmax(210px, 1.35fr) minmax(105px,.65fr) minmax(120px,.72fr) minmax(145px,.82fr) minmax(145px,.82fr) minmax(300px, auto);
}

.premium-subscription-table .data-row > span:not(.row-actions) {
  display: grid;
  align-content: center;
  justify-items: start;
  gap: 6px;
  min-width: 0;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.premium-subscription-table .data-row > span:not(.row-actions) small { display: block; color: var(--muted); line-height: 1.35; }

.service-ban-table .data-head,
.service-ban-table .data-row {
  grid-template-columns: minmax(180px, 1.1fr) minmax(180px, 1.2fr) 130px 150px 110px;
}

.admin-audit-table .data-head,
.admin-audit-table .data-row {
  grid-template-columns: minmax(190px, 1.2fr) minmax(220px, 1.4fr) minmax(170px, 1fr) 140px;
}

.admin-audit-table .data-row > span {
  display: grid;
  gap: 5px;
  align-content: center;
}

.admin-audit-table .data-row > span > strong,
.admin-audit-table .data-row > span > small {
  display: block;
}

.admin-audit-table .data-row > span > small {
  line-height: 1.35;
}

.bot-api-table .data-head,
.bot-api-table .data-row {
  grid-template-columns: minmax(0, 1fr) minmax(0, 0.95fr) minmax(92px, 0.48fr) minmax(0, 0.95fr) minmax(0, 0.95fr);
}

.personal-report-table .data-head,
.personal-report-table .data-row {
  grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) minmax(96px, 0.52fr) minmax(0, 0.76fr) minmax(0, 0.86fr) minmax(92px, 0.46fr);
}

.personal-report-table .data-row {
  gap: 12px;
  align-items: stretch;
  padding: 13px;
}

.personal-report-table .data-row > span {
  display: grid;
  gap: 5px;
  align-content: center;
  min-height: 46px;
}

.personal-report-table .data-row > span::before {
  display: none;
}

.personal-report-table .data-row > span > strong,
.personal-report-table .data-row > span > small {
  display: block;
  min-width: 0;
  line-height: 1.35;
}

.personal-report-table .data-row > span > strong {
  color: #fff;
}

.personal-report-table .data-row > span > .status-pill,
.personal-report-table .data-row > span > .ticket-priority,
.personal-report-table .data-row > span > .button,
.personal-report-table .data-row > span > .muted {
  justify-self: start;
}

.personal-report-table .data-row > span > .muted {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 7px 10px;
  border: 1px solid rgba(142, 161, 255, 0.14);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.055);
  line-height: 1.2;
}

.personal-report-empty {
  grid-template-columns: minmax(0, 1fr) !important;
}

.personal-report-empty > span {
  min-height: 0;
}

.paypal-payment-table .data-head,
.paypal-payment-table .data-row {
  grid-template-columns: minmax(150px, 1.1fr) minmax(150px, 1fr) minmax(150px, 1fr) 100px minmax(130px, 0.8fr) 120px;
}

.premium-leaderboard-list {
  display: grid;
  gap: 10px;
}

.premium-leaderboard-item {
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr) minmax(0, 1.4fr);
  gap: 14px;
  align-items: center;
  min-height: 72px;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #1e1f22;
}

.premium-rank {
  display: inline-grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 8px;
  color: #fff;
  font-weight: 900;
  background: rgba(88, 101, 242, 0.18);
}

.premium-leaderboard-main {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.premium-leaderboard-main strong,
.premium-leaderboard-main small {
  overflow-wrap: anywhere;
}

.premium-leaderboard-main small {
  color: var(--muted);
}

.premium-leaderboard-meta {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.claim-analytics {
  margin-top: 18px;
}

.analytics-trend-card {
  margin: 16px 0;
}

.analytics-bars {
  display: grid;
  gap: 9px;
}

.analytics-bar-row {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr) 90px;
  gap: 10px;
  align-items: center;
}

.analytics-bar-row > span,
.analytics-bar-row > small {
  color: var(--muted);
  font-weight: 900;
}

.analytics-bar-row > small {
  text-align: right;
}

.analytics-bar-track {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 4px;
  min-height: 18px;
}

.analytics-bar-track i,
.analytics-legend i,
.rating-row i {
  display: block;
  border-radius: 999px;
}

.analytics-bar-track i {
  min-width: 4px;
  height: 18px;
}

.analytics-opened {
  background: #5865f2;
}

.analytics-closed {
  background: #23a559;
}

.analytics-claimed {
  background: #22d3ee;
}

.analytics-reminders {
  background: #fee75c;
}

.analytics-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 14px;
}

.analytics-legend span {
  display: inline-flex;
  gap: 7px;
  align-items: center;
  color: var(--muted);
  font-weight: 900;
}

.analytics-legend i {
  width: 12px;
  height: 12px;
}

.rating-distribution {
  display: grid;
  gap: 10px;
}

.rating-row {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) 34px;
  gap: 10px;
  align-items: center;
}

.rating-row span,
.rating-row small {
  color: var(--muted);
  font-weight: 900;
}

.rating-row i {
  height: 12px;
  min-width: 3px;
  background: linear-gradient(90deg, var(--primary), var(--cyan));
}

.claim-filter-form {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) repeat(2, minmax(160px, 0.75fr)) auto;
  gap: 12px;
  align-items: end;
  margin-bottom: 16px;
}

.claim-filter-form > label {
  display: grid;
  gap: 7px;
  color: #dbdee1;
  font-weight: 800;
}

.claim-filter-form button {
  min-width: 140px;
}

.claim-stats-grid {
  margin-bottom: 16px;
}

.claim-table .data-head,
.claim-table .data-row {
  grid-template-columns: 58px minmax(180px, 1.3fr) 92px 108px 124px 124px;
}

.claim-member {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.claim-member strong,
.claim-member small {
  overflow-wrap: anywhere;
}

.claim-member small {
  color: var(--muted);
}

.claim-rank {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 30px;
  padding: 4px 8px;
  border-radius: 8px;
  color: #dce2ff;
  background: rgba(88, 101, 242, 0.18);
  font-weight: 900;
}

.guild-table .data-row {
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.guild-table .data-row:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 20px rgba(16, 24, 40, 0.08);
}

.status-hero {
  width: min(1180px, calc(100% - 36px));
  margin: 0 auto;
  padding: 76px 0 22px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
  gap: 22px;
  align-items: end;
}

.status-hero h1 {
  margin: 8px 0 0;
  font-size: clamp(2.2rem, 5vw, 4.2rem);
  line-height: 1;
  letter-spacing: 0;
}

.status-hero p {
  max-width: 720px;
  color: var(--muted);
  line-height: 1.65;
}

.status-summary-card {
  min-height: 150px;
  display: grid;
  align-content: center;
  gap: 10px;
  padding: 24px;
  border: 1px solid rgba(142, 161, 255, 0.2);
  border-radius: var(--radius);
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.13), transparent 46%),
    var(--surface);
  box-shadow: var(--shadow);
}

.status-summary-card strong {
  font-size: 1.28rem;
  line-height: 1.25;
}

.status-summary-card small {
  color: var(--muted);
  font-weight: 800;
}

.status-summary-ok {
  border-color: rgba(35, 165, 89, 0.42);
}

.status-summary-warn {
  border-color: rgba(254, 231, 92, 0.42);
}

.status-summary-down {
  border-color: rgba(242, 63, 66, 0.42);
}

.status-overview {
  width: min(1180px, calc(100% - 36px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.status-overview article {
  min-height: 116px;
  padding: 22px;
  border: 1px solid rgba(142, 161, 255, 0.2);
  border-radius: var(--radius);
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.14), transparent 52%),
    rgba(20, 23, 38, 0.88);
  box-shadow: 0 14px 38px rgba(0, 0, 0, 0.24);
}

.status-overview strong {
  display: block;
  font-size: 2rem;
}

.status-overview span {
  color: var(--muted);
  font-weight: 800;
}

.status-section {
  padding-top: 54px;
}

.status-service-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.status-service-card {
  min-height: 330px;
  display: grid;
  align-content: start;
  gap: 12px;
  padding: 22px;
  border: 1px solid rgba(142, 161, 255, 0.2);
  border-radius: var(--radius);
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.12), transparent 44%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.045), transparent 52%),
    var(--surface);
  box-shadow: var(--shadow);
  transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.status-service-card:hover {
  border-color: rgba(34, 211, 238, 0.42);
  box-shadow: var(--shadow), var(--shadow-color);
}

.status-card-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
}

.status-card-head > svg {
  width: 30px;
  height: 30px;
  color: var(--primary);
}

.status-service-card h3 {
  margin: 4px 0 0;
  font-size: 1.28rem;
}

.status-service-card > strong {
  color: #fff;
}

.status-service-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}

.status-pill-ok {
  color: #d4f8df;
  background: rgba(35, 165, 89, 0.2);
}

.status-pill-warn {
  color: #fff3bf;
  background: rgba(254, 231, 92, 0.16);
}

.status-pill-down {
  color: #ffd8d8;
  background: rgba(242, 63, 66, 0.16);
}

.status-dot {
  display: inline-block;
  width: 11px;
  height: 11px;
  border-radius: 999px;
  background: var(--success);
  box-shadow: 0 0 0 4px rgba(35, 165, 89, 0.14);
}

.status-dot.warn {
  background: var(--amber);
  box-shadow: 0 0 0 4px rgba(254, 231, 92, 0.14);
}

.status-dot.down {
  background: var(--danger);
  box-shadow: 0 0 0 4px rgba(242, 63, 66, 0.14);
}

.status-metrics {
  display: grid;
  gap: 8px;
  margin: 4px 0 0;
}

.status-metrics div {
  display: grid;
  grid-template-columns: minmax(110px, 0.8fr) minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  min-height: 36px;
  padding: 8px 10px;
  border-radius: 8px;
  background: rgba(18, 21, 35, 0.82);
}

.status-metrics dt,
.status-metrics dd {
  margin: 0;
  overflow-wrap: anywhere;
}

.status-metrics dt {
  color: var(--muted);
  font-weight: 800;
}

.status-timeline {
  display: grid;
  gap: 10px;
}

.status-timeline article {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  min-height: 64px;
  padding: 14px 16px;
  border: 1px solid rgba(142, 161, 255, 0.18);
  border-radius: var(--radius);
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.1), transparent 52%),
    var(--surface);
}

.status-timeline strong,
.status-timeline small {
  display: block;
}

.status-timeline small {
  margin-top: 2px;
  color: var(--muted);
}

.launch-body {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 24px;
  background: var(--page-bg);
  background-attachment: scroll;
}

.launch-shell {
  width: min(1040px, 100%);
  min-height: auto;
  display: grid;
  place-items: center;
}

.launch-panel {
  position: relative;
  width: 100%;
  display: grid;
  justify-items: center;
  gap: 18px;
  padding: clamp(26px, 6vw, 58px);
  overflow: hidden;
  border: 1px solid rgba(142, 161, 255, 0.26);
  border-radius: var(--radius);
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.16), transparent 46%),
    linear-gradient(225deg, rgba(34, 211, 238, 0.1), transparent 44%),
    rgba(13, 16, 30, 0.9);
  box-shadow: var(--shadow), 0 0 60px rgba(88, 101, 242, 0.16);
  text-align: center;
  backdrop-filter: none;
}

.launch-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.55;
  background:
    linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.08), transparent),
    linear-gradient(180deg, rgba(255, 255, 255, 0.05), transparent 45%);
  background-size: 240% 100%, 100% 100%;
}

.launch-panel > * {
  position: relative;
}

.launch-logo {
  display: block;
  width: min(310px, 76vw);
  height: auto;
  object-fit: contain;
  filter: drop-shadow(0 18px 36px rgba(0, 0, 0, 0.34)) drop-shadow(0 0 34px rgba(88, 101, 242, 0.22));
}

.launch-panel h1 {
  max-width: 820px;
  margin: 0;
  font-size: clamp(2.5rem, 7vw, 5rem);
  line-height: 0.98;
  background: linear-gradient(135deg, #fff 0%, #dce2ff 42%, var(--cyan) 72%, var(--mint));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.launch-subtitle,
.launch-message,
.launch-date {
  max-width: 760px;
  margin: 0;
  color: var(--muted);
  line-height: 1.65;
}

.launch-subtitle {
  color: #eef2ff;
  font-size: clamp(1.02rem, 2vw, 1.22rem);
}

.launch-countdown {
  width: min(860px, 100%);
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin: 10px 0 0;
}

.launch-countdown article {
  min-height: 124px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 8px;
  padding: 16px;
  border: 1px solid rgba(142, 161, 255, 0.24);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.18), transparent 54%),
    rgba(18, 21, 35, 0.88);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 14px 34px rgba(0, 0, 0, 0.2);
}

.launch-countdown strong {
  font-size: clamp(2rem, 5vw, 4rem);
  line-height: 0.95;
  color: #fff;
  text-shadow: 0 0 34px rgba(88, 101, 242, 0.26);
  font-variant-numeric: tabular-nums;
}

.launch-countdown span {
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 900;
  text-transform: uppercase;
}

.launch-countdown.is-complete article {
  border-color: rgba(87, 242, 135, 0.36);
  background:
    linear-gradient(135deg, rgba(87, 242, 135, 0.14), rgba(88, 101, 242, 0.08)),
    rgba(18, 21, 35, 0.88);
}

.launch-countdown-muted {
  opacity: 0.58;
}

.launch-actions {
  justify-content: center;
}

.launch-admin-note {
  margin-top: 4px;
  text-align: left;
}

.launch-admin-form {
  margin-top: 8px;
}

.launch-admin-stats {
  margin-bottom: 16px;
}

.launch-toggle-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.reveal-on-scroll {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity 0.52s ease, transform 0.52s ease;
}

.reveal-on-scroll.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.reveal-on-scroll.is-visible:hover {
  transform: translateY(-4px);
}

@keyframes ticketHubBackdrop {
  0% {
    background-position: 0% 0%, 100% 0%, 50% 0%;
  }
  100% {
    background-position: 100% 100%, 0% 100%, 80% 100%;
  }
}

@keyframes ticketHubShine {
  0% {
    transform: translateX(-120%);
  }
  100% {
    transform: translateX(120%);
  }
}

@keyframes ticketHubAccentSweep {
  0% {
    background-position: 0% 50%;
  }
  100% {
    background-position: 260% 50%;
  }
}

@keyframes ticketHubAmbientDrift {
  0% {
    background-position: 0% 50%, 0 0;
  }
  100% {
    background-position: 100% 50%, 0 0;
  }
}

@keyframes ticketHubGradientShift {
  0%, 100% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
}

@keyframes ticketHubHeroPan {
  0% {
    background-position: center center;
  }
  100% {
    background-position: 54% center;
  }
}

@keyframes ticketHubBorderBeat {
  0%, 100% {
    border-color: rgba(142, 161, 255, 0.2);
  }
  50% {
    border-color: rgba(34, 211, 238, 0.38);
  }
}

@keyframes ticketHubFloat {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-5px);
  }
}

@keyframes ticketHubPulse {
  0%, 100% {
    box-shadow: 0 0 0 0 rgba(88, 101, 242, 0.28);
  }
  50% {
    box-shadow: 0 0 0 6px rgba(88, 101, 242, 0);
  }
}

.brand-logo,
.official-crown,
.guild-custom-badge {
  animation: none;
}

.feature-card,
.price-box,
.panel-section,
.guild-card,
.status-service-card,
.team-card,
.auth-panel,
.doc-block {
  animation: none;
}

.stat-grid strong,
.price,
.status-overview strong {
  background: linear-gradient(135deg, #fff, #dce2ff 42%, var(--cyan) 72%, var(--mint));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.status-pill.online,
.status-online {
  animation: none;
}

.scroll-progress,
.site-header::before,
.nav-pill,
.button.primary,
.button.discord,
.rank-tile.high,
.hero {
  animation: none;
}

body.app-page .scroll-progress {
  display: none;
}

body.app-page .button,
body.app-page .icon-button,
body.app-page .rank-tile,
body.app-page .feature-card,
body.app-page .price-box,
body.app-page .guild-card,
body.app-page .panel-section,
body.app-page .stat-grid article,
body.app-page .auth-panel,
body.app-page .doc-block {
  transition: background 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease, color 0.16s ease;
}

body.app-page .button::after,
body.app-page .icon-button::after {
  display: none;
}

body.app-page .button:hover,
body.app-page .icon-button:hover,
body.app-page .rank-tile:hover,
body.app-page .feature-card:hover,
body.app-page .price-box:hover,
body.app-page .guild-card:hover,
body.app-page .panel-section:hover,
body.app-page .stat-grid article:hover,
body.app-page .auth-panel:hover,
body.app-page .doc-block:hover {
  transform: none;
  filter: none;
}

body.app-page .guild-card,
body.app-page .team-card,
body.app-page .ticket-record,
body.app-page .status-service-card {
  content-visibility: auto;
  contain-intrinsic-size: 220px;
}

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

  .reveal-on-scroll {
    opacity: 1;
    transform: none;
  }
}

@media (max-width: 1120px) {
  .app-shell {
    grid-template-columns: minmax(184px, 212px) minmax(0, 1fr);
  }

  .sidebar {
    padding: 10px;
  }

  .side-link {
    gap: 8px;
    padding: 9px 10px;
    font-size: 0.94rem;
  }

  .admin-service-grid,
  .admin-command-grid,
  .danger-clear-grid,
  .features-grid,
  .status-service-grid,
  .settings-grid,
  .rank-ladder,
  .stat-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .rank-create-form,
  .rank-main-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .manager-create-form,
  .manager-permissions-form {
    grid-template-columns: minmax(0, 1fr);
  }

  .ticket-filter-form {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .report-filter-form {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .report-command-panel,
  .report-detail-hero {
    grid-template-columns: minmax(0, 1fr);
  }

  .ticket-filter-search {
    grid-column: 1 / -1;
    min-width: 0;
  }

  .report-filter-search {
    grid-column: 1 / -1;
    min-width: 0;
  }

  .ticket-detail-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .report-description-block,
  .report-notes-block {
    grid-column: 1 / -1;
  }

  .admin-tag-list,
  .grant-check-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .admin-tag-assignment-table .data-head,
  .admin-tag-assignment-table .data-row {
    grid-template-columns: minmax(150px, 1fr) minmax(170px, 1fr) minmax(120px, 1fr) auto;
  }

  .admin-tag-assignment-table .data-head span:nth-child(4),
  .admin-tag-assignment-table .data-head span:nth-child(5),
  .admin-tag-assignment-table .data-row > span:nth-child(4),
  .admin-tag-assignment-table .data-row > span:nth-child(5) {
    display: none;
  }

  .premium-panel-header,
  .premium-panel-footer {
    grid-template-columns: minmax(0, 1fr);
  }

  .premium-status-card {
    justify-self: start;
  }

  .premium-panel-actions {
    min-width: 0;
    justify-content: flex-start;
  }

  .rank-color {
    display: none;
  }
}

@media (max-width: 980px) {
  .app-shell {
    grid-template-columns: 1fr;
  }

  .sidebar {
    position: static;
    height: auto;
    max-height: none;
    display: flex;
    gap: 8px;
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
  }

  .side-link {
    flex: 0 0 auto;
  }

  .side-link:hover {
    transform: translateY(-1px);
  }
}

@media (max-width: 880px) {
  .admin-service-grid,
  .admin-command-grid,
  .danger-clear-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .admin-tag-form,
  .admin-tag-list,
  .grant-check-grid,
  .admin-tag-toggle-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .premium-panel {
    padding: 20px;
    gap: 18px;
  }

  .premium-metrics-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .premium-metrics-grid article {
    min-height: 124px;
  }

  .premium-panel-actions,
  .premium-panel-actions .inline-form,
  .premium-panel-actions .button,
  .premium-checkout-card,
  .premium-checkout-card-compact {
    width: 100%;
  }

  .premium-checkout-card,
  .premium-checkout-card-compact {
    grid-template-columns: minmax(0, 1fr);
  }

  .maintenance-popup {
    left: 14px;
    right: 14px;
    bottom: 14px;
    width: auto;
  }

  .maintenance-schedule-grid {
    grid-template-columns: 1fr;
  }

  .maintenance-power-grid {
    grid-template-columns: 1fr;
  }

  .site-header {
    height: auto;
    min-height: 68px;
    padding: 12px 18px;
    align-items: flex-start;
  }

  .nav-toggle {
    display: inline-flex !important;
  }

  .site-nav {
    position: absolute;
    left: 18px;
    right: 18px;
    top: calc(100% + 8px);
    z-index: 60;
    display: none;
    flex-direction: column;
    align-items: stretch;
    padding: 12px;
    border: 1px solid rgba(142, 161, 255, 0.28);
    border-radius: 8px;
    background:
      linear-gradient(135deg, rgba(88, 101, 242, 0.14), transparent 48%),
      rgba(13, 16, 30, 0.98);
    box-shadow: var(--shadow), 0 18px 46px rgba(0, 0, 0, 0.36);
  }

  .site-nav.open {
    display: flex;
  }

  .site-nav a {
    justify-content: flex-start;
  }

  .hero {
    min-height: 650px;
    align-items: flex-end;
    background-position: left center;
  }

  .hero-overlay {
    background: linear-gradient(0deg, rgba(6, 12, 24, 0.88), rgba(6, 12, 24, 0.26));
  }

  .app-shell {
    grid-template-columns: 1fr;
  }

  .sidebar {
    position: static;
    height: auto;
    display: flex;
    overflow-x: auto;
  }

  .side-link {
    flex: 0 0 auto;
  }

  .guild-grid,
  .team-grid,
  .status-hero,
  .split-section,
  .two-columns,
  .pricing-strip {
    grid-template-columns: 1fr;
  }

  .inline-form,
  .compact-form,
  .settings-grid,
  .ticket-filter-form,
  .toggle-grid,
  .role-check-grid,
  .permission-form,
  .permission-checks,
  .team-admin-form,
  .team-admin-edit-form,
  .rank-create-form,
  .rank-main-form,
  .sub-role-add {
    grid-template-columns: 1fr;
  }

  .team-admin-wide {
    grid-column: auto;
  }

  .ticket-filter-search,
  .report-filter-search,
  .ticket-transcript-excerpt {
    grid-column: auto;
  }

  .ticket-detail-grid,
  .report-detail-grid {
    grid-template-columns: 1fr;
  }

  .report-filter-form {
    grid-template-columns: 1fr;
  }

  .status-overview {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .launch-countdown {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .role-check-grid {
    max-height: none;
  }

  .multi-select-panel {
    max-height: min(260px, 45vh);
  }

  .section-title,
  .workspace-heading {
    flex-direction: column;
    align-items: flex-start;
  }

  .manager-header {
    flex-direction: column;
  }

  .log-row,
  .ticket-row,
  .option-row,
  .discord-guild-row,
  .manager-row,
  .team-admin-card,
  .premium-leaderboard-item,
  .claim-filter-form,
  .permission-table .data-head,
  .permission-table .data-row,
  .claim-table .data-head,
  .claim-table .data-row,
  .data-head,
  .data-row,
  .health-list div {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 620px) {
  .features-grid,
  .status-service-grid,
  .rank-ladder,
  .stat-grid,
  .status-overview {
    grid-template-columns: 1fr;
  }

  .hero h1 {
    font-size: 3rem;
  }

  .premium-leaderboard-meta {
    justify-content: flex-start;
  }

  .claim-filter-form button {
    min-width: 0;
  }

  .section,
  .status-hero,
  .status-overview,
  .page-hero,
  .app-shell,
  .legal-layout {
    width: min(100% - 24px, 1180px);
  }

  .legal-meta span,
  .legal-actions .button,
  .ticket-filter-form .button,
  .pagination .button {
    width: 100%;
  }

  .ticket-scroll {
    max-height: 68vh;
  }

  .ticket-admin-table {
    min-width: 0;
  }

  .auth-body {
    padding: 12px;
  }

  .auth-panel,
  .panel-section,
  .status-summary-card,
  .status-service-card {
    padding: 18px;
  }

  .status-metrics div {
    grid-template-columns: 1fr;
  }

  .launch-body {
    padding: 12px;
  }

  .launch-panel {
    padding: 22px;
  }

  .launch-countdown {
    grid-template-columns: 1fr;
  }

  .launch-countdown article {
    min-height: 96px;
  }

  .guild-card {
    grid-template-columns: 46px minmax(0, 1fr);
  }

  .guild-card .icon-button,
  .guild-card form {
    grid-column: 1 / -1;
    width: 100%;
  }

  .guild-card .button.primary {
    width: 100%;
  }

  .team-admin-card {
    grid-template-columns: 1fr;
  }

  .team-admin-card .team-avatar {
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
  }
}

/* Global responsive stabilization */
img,
picture,
video,
canvas {
  max-width: 100%;
  height: auto;
}

:where(
  .site-header,
  .brand,
  .site-nav,
  .section,
  .page-hero,
  .workspace,
  .workspace-heading,
  .workspace-heading > div,
  .section-title,
  .section-title > div,
  .panel-section,
  .panel-card,
  .guild-card,
  .team-card,
  .status-service-card,
  .status-summary-card,
  .premium-panel,
  .premium-panel-title,
  .premium-status-card,
  .maintenance-panel,
  .auth-panel,
  .data-table,
  .data-row,
  .data-head,
  form,
  label,
  .field-group,
  .multi-select,
  .permission-badges,
  .row-actions,
  .group-actions,
  .hero-actions,
  .section-title-actions,
  .premium-panel-actions,
  .ticket-action-buttons,
  .pagination,
  .tabs
) {
  min-width: 0;
}

:where(h1, h2, h3, h4, p, li, dt, dd, span, strong, small, a, label, button, .button, .status-pill, .permission-badges span) {
  overflow-wrap: anywhere;
}

.site-header {
  gap: 16px;
}

.brand {
  min-width: 0;
  flex: 0 1 auto;
}

.brand span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.site-nav {
  min-width: 0;
  flex: 1 1 auto;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.site-nav a {
  max-width: 100%;
}

.section-title,
.workspace-heading,
.manager-header,
.premium-panel-header,
.premium-panel-footer,
.status-card-head,
.official-guild-banner {
  min-width: 0;
}

.section-title > div,
.workspace-heading > div,
.manager-meta,
.premium-panel-title,
.status-card-head > div,
.official-guild-banner > div {
  min-width: 0;
}

.section-title h2,
.workspace-heading h1,
.guild-title-line h1,
.guild-title-line h2,
.premium-panel-title h2,
.status-card-head h3 {
  max-width: 100%;
}

.stack-form,
.inline-form,
.compact-form,
.settings-grid,
.rank-create-form,
.rank-main-form,
.manager-create-form,
.manager-permissions-form,
.permission-form,
.permission-checks,
.ticket-filter-form,
.report-filter-form,
.claim-filter-form,
.team-admin-form,
.team-admin-edit-form,
.admin-tag-form,
.grant-check-grid,
.toggle-grid,
.role-check-grid,
.sub-role-add {
  width: 100%;
}

:where(
  .stack-form,
  .inline-form,
  .compact-form,
  .settings-grid,
  .rank-create-form,
  .rank-main-form,
  .manager-create-form,
  .manager-permissions-form,
  .permission-form,
  .ticket-filter-form,
  .report-filter-form,
  .claim-filter-form,
  .team-admin-form,
  .team-admin-edit-form,
  .admin-tag-form,
  .grant-check-grid,
  .toggle-grid,
  .role-check-grid,
  .sub-role-add
) > label {
  min-width: 0;
}

input,
textarea,
select {
  max-width: 100%;
}

textarea {
  min-height: 112px;
}

select {
  text-overflow: ellipsis;
}

.button {
  min-width: 0;
  line-height: 1.2;
}

.row-actions .button,
.group-actions .button,
.hero-actions .button,
.section-title-actions .button,
.ticket-action-buttons .button,
.pagination .button,
.tabs a {
  flex: 0 1 auto;
}

.icon-button {
  flex: 0 0 auto;
}

.status-pill,
.meta-row span,
.permission-pill,
.guild-custom-badge,
.ticket-priority,
.ticket-tags span {
  max-width: 100%;
}

.toggle-grid label,
.permission-checks label,
.grant-option,
.role-check,
.multi-select-option,
.admin-tag-guild-picker label {
  min-width: 0;
  line-height: 1.35;
}

.data-table,
.ticket-scroll,
.report-scroll,
.admin-guild-scroll {
  max-width: 100%;
  overscroll-behavior-x: contain;
  scrollbar-width: thin;
}

.data-table {
  overflow-x: auto;
  padding-bottom: 2px;
}

.data-table.report-admin-table {
  overflow-x: visible;
  padding-bottom: 0;
}

.data-table::-webkit-scrollbar,
.ticket-scroll::-webkit-scrollbar,
.report-scroll::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

.data-table::-webkit-scrollbar-track,
.ticket-scroll::-webkit-scrollbar-track,
.report-scroll::-webkit-scrollbar-track {
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.07);
}

.data-table::-webkit-scrollbar-thumb,
.ticket-scroll::-webkit-scrollbar-thumb,
.report-scroll::-webkit-scrollbar-thumb {
  border: 2px solid rgba(12, 15, 29, 0.9);
  border-radius: 999px;
  background: linear-gradient(180deg, var(--primary), var(--cyan));
}

.data-row > span,
.data-head > span {
  min-width: 0;
}

@media (min-width: 881px) {
  .admin-guild-table > .data-head,
  .admin-guild-table > .data-row {
    min-width: 1080px;
  }

  .permission-table > .data-head,
  .permission-table > .data-row,
  .premium-subscription-table > .data-head,
  .premium-subscription-table > .data-row,
  .service-ban-table > .data-head,
  .service-ban-table > .data-row,
  .paypal-payment-table > .data-head,
  .paypal-payment-table > .data-row,
  .claim-table > .data-head,
  .claim-table > .data-row,
  .guide-flow-table > .data-head,
  .guide-flow-table > .data-row {
    min-width: 760px;
  }
}

@media (max-width: 880px) {
  .site-header {
    align-items: center;
  }

  .site-nav {
    max-height: calc(100vh - 92px);
    overflow-y: auto;
    overscroll-behavior: contain;
    background:
      linear-gradient(135deg, rgba(88, 101, 242, 0.16), transparent 48%),
      #0d1020;
  }

  .site-nav a {
    width: 100%;
  }

  .app-shell {
    gap: 14px;
    margin-top: 16px;
  }

  .sidebar {
    gap: 8px;
    padding: 10px;
    scrollbar-width: thin;
  }

  .sidebar::-webkit-scrollbar {
    height: 8px;
  }

  .sidebar::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgba(142, 161, 255, 0.48);
  }

  .section-title-actions,
  .row-actions,
  .group-actions,
  .ticket-action-buttons,
  .premium-panel-actions,
  .pagination {
    width: 100%;
  }

  .premium-panel-actions {
    justify-content: stretch;
  }

  .data-table:not(.ticket-admin-table):not(.report-admin-table) > .data-head {
    display: none;
  }

  .data-table:not(.ticket-admin-table):not(.report-admin-table) > .data-row {
    align-items: stretch;
  }

  .data-table:not(.ticket-admin-table):not(.report-admin-table) > .data-row > span:empty {
    display: none;
  }

  .report-admin-table .data-head {
    display: none;
  }

  .report-admin-table .data-row {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .report-admin-table .data-row > span {
    display: grid;
    gap: 4px;
  }

  .report-admin-table .data-row > span:nth-child(2)::before {
    content: "Serveur";
  }

  .report-admin-table .data-row > span:nth-child(3)::before {
    content: "Auteur";
  }

  .report-admin-table .data-row > span:nth-child(4)::before {
    content: "Etat";
  }

  .report-admin-table .data-row > span:nth-child(5)::before {
    content: "Assignation";
  }

  .report-admin-table .data-row > span:nth-child(6)::before {
    content: "Date";
  }

  .report-admin-table .data-row > span:nth-child(n + 2)::before {
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 900;
    text-transform: uppercase;
  }

  .ticket-info-list div,
  .status-metrics div {
    grid-template-columns: 1fr;
  }

  .report-empty-state {
    grid-template-columns: 1fr;
    align-items: start;
  }

  .report-command-panel,
  .report-detail-kpis {
    grid-template-columns: minmax(0, 1fr);
  }

  .report-detail-identity {
    grid-template-columns: 1fr;
  }

  .admin-dashboard-guild-row,
  .admin-dashboard-team-row {
    grid-template-columns: 1fr;
    align-items: stretch;
  }
}

@media (max-width: 620px) {
  .site-header {
    padding-inline: 12px;
  }

  .brand span {
    max-width: 48vw;
  }

  .hero {
    min-height: auto;
    padding: 96px 18px 44px;
  }

  .hero h1 {
    font-size: clamp(2.2rem, 12vw, 3rem);
    line-height: 1;
  }

  .hero p,
  .page-hero p,
  .status-hero p,
  .launch-subtitle,
  .launch-message,
  .launch-date {
    font-size: 1rem;
    line-height: 1.58;
  }

  .section {
    padding: 46px 0;
  }

  .page-hero,
  .status-hero {
    padding-top: 52px;
  }

  .section-heading h2,
  .page-hero h1,
  .workspace-heading h1,
  .status-hero h1 {
    font-size: clamp(1.85rem, 10vw, 2.65rem);
    line-height: 1.08;
  }

  .panel-section,
  .panel-card,
  .guild-card,
  .team-card-body,
  .premium-panel,
  .status-summary-card,
  .status-service-card,
  .doc-block,
  .price-box {
    padding: 16px;
  }

  .button {
    width: 100%;
    min-height: 44px;
    padding-inline: 12px;
  }

  .icon-button,
  .nav-toggle {
    width: 42px;
    min-width: 42px;
    height: 42px;
  }

  .row-actions .button,
  .group-actions .button,
  .hero-actions .button,
  .section-title-actions .button,
  .ticket-action-buttons .button,
  .pagination .button,
  form .button {
    flex-basis: 100%;
  }

  .compact-button {
    width: auto;
    min-height: 36px;
  }

  .maintenance-summary,
  .launch-toggle-grid {
    grid-template-columns: 1fr;
  }

  .maintenance-panel h1 {
    font-size: clamp(1.55rem, 8vw, 2rem);
  }

  .official-guild-banner,
  .status-card-head {
    align-items: flex-start;
  }

  .guild-custom-badge {
    white-space: normal;
    line-height: 1.2;
  }

  .data-row,
  .data-head,
  .manager-row,
  .log-row,
  .ticket-row,
  .option-row,
  .discord-guild-row,
  .health-list div {
    padding: 10px;
  }

  .ticket-scroll,
  .report-scroll,
  .admin-guild-scroll {
    max-height: 64vh;
  }

  .multi-select-panel {
    width: 100%;
    min-width: 100%;
  }

  .personal-activity-row {
    grid-template-columns: 42px minmax(0, 1fr);
    align-items: start;
  }

  .personal-activity-date {
    grid-column: 2;
    justify-self: start;
    text-align: left;
  }
}

@media (max-width: 420px) {
  .section,
  .status-hero,
  .status-overview,
  .page-hero,
  .app-shell,
  .legal-layout {
    width: min(100% - 18px, 1180px);
  }

  .site-nav {
    left: 10px;
    right: 10px;
  }

  .panel-section,
  .panel-card,
  .guild-card,
  .premium-panel,
  .auth-panel,
  .maintenance-panel {
    padding: 14px;
  }

  input,
  textarea,
  select {
    padding-inline: 10px;
  }
}

@media (max-width: 720px) {
  .personal-profile-row {
    grid-template-columns: minmax(0, 1fr);
  }

  .personal-profile-row .guild-avatar {
    width: 64px;
    height: 64px;
  }

  .personal-action-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* Global overflow guard: keep dense admin/member surfaces readable on narrow laptops and phones. */
:where(
  .app-shell,
  .workspace,
  .workspace > *,
  .panel-section,
  .panel-card,
  .section-title,
  .workspace-heading,
  .guild-card,
  .premium-panel,
  .manager-card,
  .team-admin-card,
  .data-table,
  .data-head,
  .data-row,
  .ticket-row,
  .manager-row,
  .option-row,
  .discord-guild-row,
  .health-list div,
  .report-detail-hero,
  .report-detail-grid,
  .ticket-detail-grid,
  .admin-live-panel,
  .admin-timeline-item
) {
  min-width: 0;
  max-width: 100%;
}

:where(
  .data-head,
  .data-row,
  .ticket-row,
  .manager-row,
  .option-row,
  .discord-guild-row,
  .health-list div,
  .admin-dashboard-guild-row,
  .admin-dashboard-team-row,
  .admin-timeline-item,
  .admin-live-item,
  .premium-leaderboard-item
) > * {
  min-width: 0;
  max-width: 100%;
}

:where(
  h1,
  h2,
  h3,
  h4,
  p,
  li,
  dt,
  dd,
  span,
  strong,
  small,
  em,
  code,
  a,
  label,
  th,
  td,
  button,
  .button,
  .status-pill,
  .permission-pill,
  .guild-custom-badge,
  .ticket-priority,
  .ticket-tags span
) {
  overflow-wrap: anywhere;
  word-break: normal;
}

.button,
.status-pill,
.permission-pill,
.guild-custom-badge,
.ticket-priority,
.ticket-tags span,
.meta-row span {
  height: auto;
  min-width: 0;
  white-space: normal;
  line-height: 1.22;
  text-align: center;
  flex-wrap: wrap;
}

.button {
  align-content: center;
}

.button svg,
.icon-button svg,
.status-pill svg,
.permission-pill svg,
.guild-custom-badge svg,
.ticket-priority svg {
  flex: 0 0 auto;
}

.row-actions,
.group-actions,
.hero-actions,
.section-title-actions,
.ticket-action-buttons,
.premium-panel-actions,
.pagination,
.meta-row,
.permission-badges,
.ticket-tags {
  min-width: 0;
  max-width: 100%;
}

.row-actions > *,
.group-actions > *,
.hero-actions > *,
.section-title-actions > *,
.ticket-action-buttons > *,
.premium-panel-actions > *,
.pagination > * {
  min-width: 0;
  max-width: 100%;
}

.data-head,
.data-row {
  align-items: start;
}

.data-row > span,
.data-row > div,
.ticket-row > span,
.ticket-row > div,
.manager-row > span,
.manager-row > div,
.option-row > span,
.option-row > div,
.discord-guild-row > span,
.discord-guild-row > div {
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
}

.data-row small,
.data-row strong,
.ticket-row small,
.ticket-row strong,
.manager-row small,
.manager-row strong,
.option-row small,
.option-row strong {
  max-width: 100%;
}

.guild-card > div,
.guild-card h2,
.guild-title-line,
.manager-meta,
.premium-panel-title,
.admin-service-copy,
.admin-command-card,
.report-main-cell,
.ticket-main-cell,
.ticket-id-cell,
.team-admin-readonly {
  min-width: 0;
  max-width: 100%;
}

.guild-card > .icon-button {
  justify-self: end;
}

.sidebar,
.side-link,
.site-nav,
.site-nav a {
  min-width: 0;
  max-width: 100%;
}

.side-link,
.site-nav a {
  white-space: normal;
}

input,
textarea,
select {
  min-width: 0;
  width: 100%;
}

.stack-form label,
.settings-grid label,
.ticket-filter-form label,
.report-filter-form label,
.claim-filter-form label,
.team-admin-form label,
.team-admin-edit-form label,
.admin-tag-form label,
.manager-create-form label,
.manager-permissions-form label,
.permission-form label {
  min-width: 0;
}

@media (max-width: 1320px) {
  .ticket-filter-form {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .report-filter-form {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .claim-filter-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .team-admin-edit-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .team-admin-edit-form .delete-inline,
  .team-admin-edit-form .button {
    justify-self: start;
  }

  .admin-tag-assignment-table .data-head,
  .admin-tag-assignment-table .data-row,
  .permission-table .data-head,
  .permission-table .data-row,
  .premium-subscription-table .data-head,
  .premium-subscription-table .data-row,
  .service-ban-table .data-head,
  .service-ban-table .data-row,
  .paypal-payment-table .data-head,
  .paypal-payment-table .data-row,
  .claim-table .data-head,
  .claim-table .data-row {
    min-width: 0;
  }
}

@media (max-width: 1180px) {
  .report-admin-table .data-head {
    display: none;
  }

  .report-admin-table .data-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
  }

  .report-admin-table .data-row > span {
    display: grid;
    gap: 4px;
    align-content: start;
    min-height: 0;
  }

  .report-admin-table .data-row > span:first-child,
  .report-admin-table .data-row > span:last-child {
    grid-column: 1 / -1;
  }

  .report-admin-table .data-row > span:nth-child(2)::before {
    content: "Serveur";
  }

  .report-admin-table .data-row > span:nth-child(3)::before {
    content: "Auteur";
  }

  .report-admin-table .data-row > span:nth-child(4)::before {
    content: "Etat";
  }

  .report-admin-table .data-row > span:nth-child(5)::before {
    content: "Assignation";
  }

  .report-admin-table .data-row > span:nth-child(6)::before {
    content: "Date";
  }

  .report-admin-table .data-row > span:nth-child(n + 2)::before {
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 900;
    text-transform: uppercase;
  }

  .admin-audit-table .data-head,
  .admin-audit-table .data-row,
  .bot-api-table .data-head,
  .bot-api-table .data-row,
  .personal-report-table .data-head,
  .personal-report-table .data-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .admin-audit-table .data-head,
  .bot-api-table .data-head,
  .personal-report-table .data-head {
    display: none;
  }

  .admin-audit-table .data-row > span:first-child,
  .bot-api-table .data-row > span:first-child,
  .personal-report-table .data-row > span:first-child {
    grid-column: 1 / -1;
  }

  .personal-report-table .data-row {
    gap: 10px;
    padding: 14px;
  }

  .personal-report-table .data-row > span {
    align-content: start;
    min-height: 0;
    padding: 10px;
    border: 1px solid rgba(142, 161, 255, 0.12);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.035);
  }

  .personal-report-table .data-row > span::before {
    content: attr(data-label);
    display: block;
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 950;
    letter-spacing: 0.04em;
    line-height: 1.1;
    text-transform: uppercase;
  }

  .personal-report-empty > span {
    border: 0;
    background: transparent;
  }

  .personal-report-empty > span::before {
    display: none;
  }
}

@media (max-width: 980px) {
  .sidebar {
    flex-wrap: wrap;
    overflow-x: hidden;
    white-space: normal;
  }

  .side-link {
    flex: 1 1 168px;
    min-width: min(100%, 148px);
  }

  .section-title,
  .workspace-heading,
  .premium-panel-header,
  .premium-panel-footer,
  .manager-header,
  .report-detail-hero,
  .ticket-detail-grid,
  .report-detail-grid {
    grid-template-columns: minmax(0, 1fr);
    flex-direction: column;
    align-items: stretch;
  }

  .section-title-actions,
  .workspace-heading > .button,
  .workspace-heading > .row-actions {
    justify-content: flex-start;
  }

  .guild-grid,
  .features-grid,
  .pricing-strip,
  .two-columns,
  .admin-dashboard-split,
  .admin-service-grid,
  .admin-command-grid,
  .report-command-panel,
  .premium-metrics-grid,
  .stat-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .guild-card,
  .team-admin-card {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .guild-card > .icon-button,
  .guild-card > form,
  .team-admin-card > .delete-inline,
  .team-admin-card > .button {
    grid-column: 1 / -1;
    justify-self: start;
  }
}

@media (max-width: 760px) {
  .ticket-filter-form,
  .report-filter-form,
  .claim-filter-form,
  .team-admin-form,
  .team-admin-edit-form,
  .admin-tag-form,
  .permission-form,
  .permission-checks,
  .manager-create-form,
  .manager-permissions-form,
  .admin-tag-toggle-grid,
  .grant-check-grid,
  .toggle-grid,
  .role-check-grid,
  .sub-role-add {
    grid-template-columns: minmax(0, 1fr);
  }

  .team-admin-wide,
  .manager-permissions-form .field-group,
  .manager-create-form .field-group {
    grid-column: auto;
  }

  .data-table:not(.ticket-admin-table) .data-head {
    display: none;
  }

  .data-table:not(.ticket-admin-table) .data-row,
  .admin-audit-table .data-row,
  .bot-api-table .data-row,
  .personal-report-table .data-row,
  .permission-table .data-row,
  .premium-subscription-table .data-row,
  .service-ban-table .data-row,
  .paypal-payment-table .data-row,
  .claim-table .data-row,
  .guide-flow-table .data-row {
    grid-template-columns: minmax(0, 1fr);
  }

  .report-admin-table .data-row > span:first-child,
  .report-admin-table .data-row > span:last-child,
  .admin-audit-table .data-row > span:first-child,
  .bot-api-table .data-row > span:first-child,
  .personal-report-table .data-row > span:first-child {
    grid-column: auto;
  }

  .row-actions,
  .group-actions,
  .hero-actions,
  .section-title-actions,
  .ticket-action-buttons,
  .premium-panel-actions,
  .pagination {
    align-items: stretch;
  }

  .row-actions > .button,
  .group-actions > .button,
  .hero-actions > .button,
  .section-title-actions > .button,
  .ticket-action-buttons > .button,
  .premium-panel-actions .button,
  .pagination > .button,
  form > .button {
    flex: 1 1 100%;
    width: 100%;
  }

  .compact-button,
  .report-admin-table .compact-button,
  .ticket-action-buttons .compact-button {
    width: auto;
    flex-basis: auto;
  }
}

@media (max-width: 520px) {
  .guild-card,
  .team-admin-card,
  .premium-leaderboard-item,
  .admin-live-item,
  .admin-timeline-item,
  .report-empty-state {
    grid-template-columns: minmax(0, 1fr);
  }

  .guild-avatar,
  .team-admin-card .team-avatar,
  .premium-rank {
    justify-self: start;
  }

  .status-pill,
  .permission-pill,
  .guild-custom-badge,
  .ticket-priority {
    width: fit-content;
    max-width: 100%;
  }
}

/* Floating live notifications must size against the viewport, not the 48px bell button. */
.admin-live-panel,
.admin-live-toasts {
  max-width: calc(100vw - 28px);
}

.admin-live-panel {
  width: min(430px, calc(100vw - 28px));
  min-width: min(340px, calc(100vw - 28px));
}

.admin-live-panel :where(.eyebrow, h2, p, span, strong, small, em, button),
.admin-live-toasts :where(span, strong, small, em) {
  overflow-wrap: normal;
  word-break: normal;
}

.admin-live-item-copy strong,
.admin-live-item-copy small,
.admin-live-item-copy em {
  overflow-wrap: break-word;
}

.price-box {
  border-color: color-mix(in srgb, var(--offer-accent, #5865f2) 30%, rgba(142, 161, 255, 0.2));
}

.price-box.accent {
  border-color: color-mix(in srgb, var(--offer-accent, #5865f2) 72%, transparent);
  box-shadow: 0 18px 40px color-mix(in srgb, var(--offer-accent, #5865f2) 20%, transparent);
}

.price-box-head,
.premium-offer-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  min-width: 0;
}

.price-box-head h3,
.premium-offer-card-head h3,
.premium-offer-card-head p {
  margin: 0;
  min-width: 0;
  overflow-wrap: anywhere;
}

.price-box-head .status-pill {
  flex: 0 0 auto;
}

.premium-comparison-section {
  position: relative;
  display: grid;
  gap: 24px;
  padding: clamp(20px, 3vw, 34px);
  overflow: hidden;
  border: 1px solid rgba(142, 161, 255, 0.24);
  border-radius: 14px;
  background:
    radial-gradient(circle at 8% 0%, rgba(88, 101, 242, 0.3), transparent 34%),
    radial-gradient(circle at 94% 18%, rgba(235, 69, 158, 0.16), transparent 30%),
    linear-gradient(145deg, rgba(20, 23, 42, 0.98), rgba(9, 12, 25, 0.98));
  box-shadow: 0 26px 70px rgba(0, 0, 0, 0.32), inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.premium-comparison-section::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 3px;
  background: linear-gradient(90deg, #5865f2, #22d3ee, #57f287, #eb459e, #5865f2);
  background-size: 220% 100%;
  animation: ticketHubAccentSweep 7s linear infinite;
}

.premium-comparison-heading {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(260px, 0.65fr);
  gap: 24px;
  align-items: center;
  padding-bottom: 22px;
  border-bottom: 1px solid rgba(142, 161, 255, 0.16);
}

.premium-comparison-copy {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  gap: 16px;
  align-items: center;
}

.premium-comparison-copy h2 {
  margin: 4px 0 7px;
  font-size: clamp(1.75rem, 3vw, 2.55rem);
  letter-spacing: -0.035em;
}

.premium-comparison-copy p {
  max-width: 720px;
  margin: 0;
  color: var(--muted);
  line-height: 1.65;
}

.premium-comparison-icon {
  display: grid;
  width: 58px;
  height: 58px;
  place-items: center;
  border: 1px solid rgba(165, 180, 252, 0.4);
  border-radius: 14px;
  color: #fff;
  background: linear-gradient(135deg, #5865f2, #9b6dff 52%, #eb459e);
  box-shadow: 0 14px 34px rgba(88, 101, 242, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.22);
}

.premium-comparison-icon svg {
  width: 28px;
  height: 28px;
}

.premium-comparison-benefits {
  display: grid;
  gap: 9px;
}

.premium-comparison-benefits span {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 38px;
  padding: 8px 11px;
  border: 1px solid rgba(142, 161, 255, 0.15);
  border-radius: 9px;
  color: #e8ebf7;
  background: rgba(255, 255, 255, 0.045);
  font-size: 0.86rem;
  font-weight: 800;
}

.premium-comparison-benefits svg {
  width: 17px;
  height: 17px;
  color: #67e8f9;
}

.premium-pricing-strip {
  position: relative;
  gap: 20px;
}

.premium-price-box {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--offer-accent, #5865f2) 13%, transparent), transparent 45%),
    rgba(15, 18, 32, 0.92);
  transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.premium-price-box::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  background: var(--offer-accent, #5865f2);
  opacity: 0.85;
}

.premium-price-box:hover {
  transform: translateY(-4px);
  border-color: color-mix(in srgb, var(--offer-accent, #5865f2) 62%, transparent);
  box-shadow: 0 22px 48px color-mix(in srgb, var(--offer-accent, #5865f2) 18%, rgba(0, 0, 0, 0.28));
}

.premium-price-box.accent {
  padding-top: 54px;
}

.premium-recommended {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  display: flex;
  min-height: 34px;
  align-items: center;
  justify-content: center;
  gap: 7px;
  color: #fff;
  background: linear-gradient(90deg, var(--offer-accent, #5865f2), #9b6dff, #eb459e);
  font-size: 0.76rem;
  font-weight: 950;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.premium-recommended svg {
  width: 15px;
  height: 15px;
}

@media (max-width: 820px) {
  .premium-comparison-heading {
    grid-template-columns: minmax(0, 1fr);
  }

  .premium-comparison-benefits {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {
  .premium-comparison-copy {
    grid-template-columns: minmax(0, 1fr);
  }

  .premium-comparison-benefits {
    grid-template-columns: minmax(0, 1fr);
  }
}

.premium-offer-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  justify-content: flex-end;
}

.premium-offer-actions.compact {
  justify-content: flex-start;
  margin-top: 10px;
}

.premium-offer-actions .inline-form {
  flex: 0 1 auto;
  width: auto;
}

.premium-offer-actions .button {
  max-width: 100%;
  white-space: normal;
  text-align: left;
}

.premium-checkout-form {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.premium-offer-actions-single,
.premium-offer-actions.compact {
  width: 100%;
}

.premium-checkout-card {
  width: min(100%, 860px);
  display: grid;
  grid-template-columns: minmax(230px, 1.2fr) minmax(170px, 0.8fr) auto;
  gap: 10px;
  align-items: end;
  padding: 12px;
  border: 1px solid rgba(142, 161, 255, 0.2);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.12), rgba(34, 211, 238, 0.06)),
    rgba(8, 11, 24, 0.72);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.premium-checkout-card-compact {
  width: 100%;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.85fr);
}

.premium-checkout-card-compact .button {
  grid-column: 1 / -1;
  width: 100%;
  min-width: 0;
  justify-content: center;
  text-align: center;
}

.premium-checkout-field {
  min-width: 0;
  display: grid;
  gap: 6px;
  margin: 0;
}

.premium-checkout-field > span {
  min-width: 0;
  color: rgba(219, 226, 255, 0.72);
  font-size: 0.78rem;
  font-weight: 900;
  line-height: 1.1;
  text-transform: uppercase;
  overflow-wrap: anywhere;
}

.premium-offer-select,
.premium-checkout-card .promo-code-input {
  width: 100%;
  min-width: 0;
  max-width: none;
  min-height: 44px;
}

.premium-offer-select {
  padding: 10px 38px 10px 12px;
  border: 1px solid rgba(142, 161, 255, 0.24);
  border-radius: 8px;
  color: #f8fbff;
  background-color: rgba(255, 255, 255, 0.055);
  background-image:
    linear-gradient(45deg, transparent 50%, #dbeafe 50%),
    linear-gradient(135deg, #dbeafe 50%, transparent 50%);
  background-position:
    calc(100% - 18px) 50%,
    calc(100% - 13px) 50%;
  background-repeat: no-repeat;
  background-size: 5px 5px;
  appearance: none;
  font-weight: 800;
  overflow: hidden;
  text-overflow: ellipsis;
}

.premium-offer-select option {
  color: #f8fbff;
  background: #0b1020;
}

.premium-offer-select:focus,
.premium-checkout-card .promo-code-input:focus {
  border-color: rgba(34, 211, 238, 0.72);
  outline: 2px solid rgba(34, 211, 238, 0.18);
  outline-offset: 2px;
}

.premium-checkout-card .button {
  min-height: 44px;
  white-space: nowrap;
}

.promo-code-input {
  min-width: min(180px, 100%);
  max-width: 220px;
  min-height: 42px;
  padding: 10px 12px;
  border: 1px solid rgba(142, 161, 255, 0.2);
  border-radius: 8px;
  color: #f8fbff;
  background: rgba(255, 255, 255, 0.055);
  font-weight: 800;
  text-transform: uppercase;
}

.promo-code-input::placeholder {
  color: rgba(219, 226, 255, 0.64);
  text-transform: none;
}

.premium-panel-title h2,
.premium-panel-title p,
.premium-status-card,
.premium-status-card .status-pill,
.premium-status-card small,
.premium-metrics-grid article,
.premium-metrics-grid article > *,
.premium-feature-badges,
.premium-feature-badges span {
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
}

.premium-panel-actions {
  align-items: stretch;
}

.premium-status-card {
  width: min(220px, 100%);
}

.premium-status-card .status-pill {
  width: 100%;
  justify-content: center;
  text-align: center;
  white-space: normal;
}

@media (max-width: 880px) {
  .premium-checkout-card,
  .premium-checkout-card-compact {
    width: 100%;
    grid-template-columns: minmax(0, 1fr);
  }

  .premium-checkout-card .button {
    width: 100%;
    justify-content: center;
    white-space: normal;
  }
}

.premium-offer-admin {
  display: grid;
  gap: 18px;
}

.premium-offer-list {
  display: grid;
  gap: 18px;
}

.premium-offer-card {
  display: grid;
  gap: 16px;
  padding: clamp(18px, 2.5vw, 24px);
  border: 1px solid color-mix(in srgb, var(--offer-accent, #5865f2) 36%, rgba(142, 161, 255, 0.18));
  border-radius: 8px;
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--offer-accent, #5865f2) 12%, transparent), transparent 46%),
    rgba(9, 12, 25, 0.74);
}

.premium-offer-form {
  gap: 18px;
}

.premium-offer-settings {
  margin-top: 0;
}

.premium-limit-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(120px, 1fr));
  gap: 12px;
}

.premium-limit-grid label,
.premium-option-checks label {
  min-width: 0;
}

.premium-option-checks {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 10px;
}

.premium-option-checks label,
.offer-danger-form {
  min-height: 42px;
  display: flex;
  align-items: center;
  gap: 10px;
}

.premium-option-checks label {
  padding: 10px 12px;
  border: 1px solid rgba(142, 161, 255, 0.15);
  border-radius: 8px;
  color: #eef3ff;
  font-weight: 800;
  background: rgba(255, 255, 255, 0.04);
}

.premium-option-checks input,
.premium-bot-form .check-label input {
  flex: 0 0 auto;
}

.offer-danger-form {
  justify-content: flex-end;
  padding-top: 12px;
  border-top: 1px solid rgba(142, 161, 255, 0.14);
}

.premium-bot-panel {
  display: grid;
  gap: 18px;
}

.premium-detail-hero { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:clamp(20px,3vw,30px); border:1px solid rgba(142,161,255,.3); border-radius:14px; background:radial-gradient(circle at 12% 10%,rgba(88,101,242,.24),transparent 36%),linear-gradient(135deg,rgba(21,28,54,.96),rgba(11,15,29,.94)); box-shadow:0 20px 48px rgba(0,0,0,.24); }
.premium-detail-hero>div,.premium-detail-grid article,.premium-detail-grid article>span { display:flex; align-items:center; }
.premium-detail-hero>div { min-width:0; gap:16px; }
.premium-detail-hero>div>span:last-child { display:grid; min-width:0; gap:3px; }
.premium-detail-icon { width:56px; height:56px; flex:0 0 56px; display:grid; place-items:center; border:1px solid rgba(111,225,255,.36); border-radius:14px; color:#d9f8ff; background:linear-gradient(145deg,#5865f2,#22c7d9); box-shadow:0 12px 28px rgba(55,111,235,.28); }
.premium-detail-icon svg { width:27px; height:27px; }
.premium-detail-hero small,.premium-detail-grid small { color:var(--muted); font-size:.75rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; }
.premium-detail-hero strong { color:#fff; font-size:clamp(1.3rem,2.4vw,1.8rem); line-height:1.12; }
.premium-detail-hero em { color:#aebaff; font-style:normal; font-weight:800; }
.premium-detail-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.premium-detail-grid article { min-width:0; gap:12px; padding:16px; border:1px solid rgba(142,161,255,.18); border-radius:11px; background:rgba(255,255,255,.035); }
.premium-detail-grid article>svg { width:22px; height:22px; flex:0 0 22px; color:#8e9dff; }
.premium-detail-grid article>span { min-width:0; align-items:flex-start; flex-direction:column; gap:4px; }
.premium-detail-grid strong { max-width:100%; color:#f6f8ff; overflow-wrap:anywhere; }
.premium-detail-columns { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:16px; }
.premium-limits-card,.premium-capabilities-card { margin:0; }
.premium-limits-card dl { display:grid; gap:8px; margin:0; }
.premium-limits-card dl>div { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:11px 12px; border-radius:8px; background:rgba(255,255,255,.035); }
.premium-limits-card dt { color:#cbd3ec; font-weight:750; }
.premium-limits-card dd { margin:0; color:#fff; font-weight:900; }
.premium-capability-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
.premium-capability-list span { min-width:0; display:flex; align-items:center; gap:9px; padding:11px 12px; border:1px solid rgba(142,161,255,.14); border-radius:9px; color:#dbe1f5; background:rgba(255,255,255,.03); font-weight:800; }
.premium-capability-list svg { width:17px; height:17px; flex:0 0 17px; }
.premium-capability-list .is-enabled { border-color:rgba(61,214,154,.24); color:#caffea; background:rgba(29,151,104,.1); }
.premium-capability-list .is-enabled svg { color:#43e1a4; }
.premium-capability-list .is-disabled { color:#8f98af; opacity:.72; }
.premium-detail-actions { display:flex; flex-wrap:wrap; gap:10px; }

.premium-suspension-notice {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 18px 20px;
  border: 1px solid rgba(251, 191, 36, .34);
  border-radius: 12px;
  color: #fff3c4;
  background: linear-gradient(135deg, rgba(245, 158, 11, .16), rgba(120, 53, 15, .08));
}

.premium-suspension-notice > svg { width: 24px; height: 24px; flex: 0 0 24px; color: #fbbf24; }
.premium-suspension-notice > div { display: grid; gap: 5px; }
.premium-suspension-notice strong { color: #fff8dc; font-size: 1.02rem; }
.premium-suspension-notice span { color: #e7d8ad; line-height: 1.55; }

.premium-suspend-control { position: relative; }
.premium-suspend-control > summary { list-style: none; cursor: pointer; }
.premium-suspend-control > summary::-webkit-details-marker { display: none; }
.premium-suspend-form {
  width: min(310px, 76vw);
  display: grid;
  gap: 10px;
  margin-top: 10px;
  padding: 14px;
  border: 1px solid rgba(251, 191, 36, .3);
  border-radius: 10px;
  background: #11172a;
  box-shadow: 0 18px 38px rgba(0, 0, 0, .38);
}
.premium-suspend-form label { display: grid; gap: 7px; color: #e9edff; font-size: .82rem; font-weight: 800; }
.premium-suspend-form input { width: 100%; min-width: 0; }

.premium-edit-modal { position: fixed; z-index: 1200; inset: 0; display: grid; place-items: center; padding: 20px; background: rgba(3,7,18,.8); backdrop-filter: blur(9px); }
.premium-edit-modal[hidden] { display: none !important; }
.premium-edit-dialog { width: min(520px,100%); max-height: calc(100vh - 40px); overflow-y: auto; display: grid; gap: 18px; padding: 22px; border: 1px solid rgba(111,120,255,.42); border-radius: 20px; background: linear-gradient(145deg,#19203a,#0d1325); box-shadow: 0 30px 90px rgba(0,0,0,.58); }
.premium-edit-modal-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; padding-bottom: 14px; border-bottom: 1px solid rgba(255,255,255,.09); }
.premium-edit-modal-header > span:first-child { display: grid; gap: 4px; }
.premium-edit-modal-header strong { font-size: 1.16rem; }
.premium-edit-modal-header small { color: var(--muted); overflow-wrap: anywhere; }
.premium-edit-form {
  display: grid;
  gap: 11px;
}
.premium-edit-form label { display: grid; gap: 7px; color: #e9edff; font-size: .82rem; font-weight: 800; }
.premium-edit-form input, .premium-edit-form select, .premium-edit-form textarea { width: 100%; min-width: 0; }
.custom-bot-pause-dialog { width: min(560px, 100%); }
.custom-bot-pause-dialog .flash { margin: 0; }
.custom-bot-pause-modal-actions { justify-content: flex-end; padding-top: 5px; }

/* Devblogs et journal des versions */
.devblog-admin-page,.updates-page{--devblog-accent:#7c6cff}.devblog-stats{grid-template-columns:repeat(5,minmax(0,1fr))}.devblog-form{display:grid;gap:22px}.devblog-form-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.devblog-form-grid .wide-field{grid-column:1/-1}.devblog-change-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.devblog-change-grid label{display:grid;gap:8px;padding:15px;border:1px solid rgba(255,255,255,.09);border-radius:14px;background:rgba(255,255,255,.025)}.devblog-change-grid label>span{display:flex;align-items:center;gap:8px;font-weight:900}.devblog-change-grid label>span svg{width:17px;color:#8b93ff}.devblog-change-grid textarea{min-height:128px}.devblog-admin-list{display:grid;gap:12px}.devblog-admin-card{display:grid;grid-template-columns:minmax(260px,1.3fr) minmax(140px,.8fr) auto auto;align-items:center;gap:18px;padding:17px;border:1px solid rgba(255,255,255,.09);border-left:4px solid var(--devblog-accent);border-radius:15px;background:linear-gradient(110deg,color-mix(in srgb,var(--devblog-accent) 8%,rgba(18,24,44,.96)),rgba(12,18,34,.96))}.devblog-admin-main{display:flex;align-items:center;gap:13px;min-width:0}.devblog-admin-main>div{display:grid;gap:5px;min-width:0}.devblog-admin-main strong{overflow-wrap:anywhere}.devblog-admin-main small{color:var(--muted)}.devblog-version{display:inline-flex;align-items:center;justify-content:center;min-width:max-content;padding:6px 10px;border:1px solid color-mix(in srgb,var(--devblog-accent) 45%,transparent);border-radius:999px;color:#dfe2ff;background:color-mix(in srgb,var(--devblog-accent) 16%,transparent);font-size:.78rem;font-weight:900}.devblog-progress{height:9px;overflow:hidden;border-radius:999px;background:rgba(255,255,255,.08)}.devblog-progress span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--devblog-accent),#22d3ee)}.devblog-progress-label{font-size:.84rem}
.updates-page{width:min(1320px,calc(100% - 32px));margin:0 auto;padding:56px 0 90px}.updates-hero{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:30px;padding:38px 0}.updates-hero h1{max-width:760px;margin:8px 0 12px;font-size:clamp(2.5rem,6vw,5.4rem);line-height:.96}.updates-hero p{max-width:750px;margin:0;color:var(--muted);font-size:1.08rem;line-height:1.7}.updates-hero-status{min-width:170px;display:grid;justify-items:center;gap:3px;padding:22px;border:1px solid rgba(124,108,255,.35);border-radius:22px;background:rgba(124,108,255,.09)}.updates-hero-status>span{width:43px;height:43px;display:grid;place-items:center;border-radius:13px;color:#8b93ff;background:rgba(124,108,255,.16)}.updates-hero-status strong{font-size:2rem}.updates-hero-status small{color:var(--muted)}.update-featured{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:35px;padding:clamp(26px,5vw,54px);border:1px solid color-mix(in srgb,var(--devblog-accent) 48%,transparent);border-radius:28px;background:radial-gradient(circle at 90% 15%,color-mix(in srgb,var(--devblog-accent) 26%,transparent),transparent 35%),linear-gradient(135deg,color-mix(in srgb,var(--devblog-accent) 13%,#151b32),#0c1222);box-shadow:0 30px 80px rgba(0,0,0,.3)}.update-featured h2{margin:15px 0 8px;font-size:clamp(1.8rem,4vw,3rem)}.update-featured p{max-width:760px;color:var(--muted);line-height:1.65}.update-featured-version{min-width:220px;display:grid;justify-items:center;gap:7px;padding:28px;border:1px solid rgba(255,255,255,.13);border-radius:22px;background:rgba(7,12,25,.56)}.update-featured-version strong{font-size:2.2rem}.update-featured-version small,.update-featured-version span{color:var(--muted)}.update-meta{display:flex;align-items:center;flex-wrap:wrap;gap:9px;color:var(--muted);font-size:.82rem}.updates-layout{display:grid;grid-template-columns:210px minmax(0,1fr);gap:50px;margin-top:62px}.updates-index{position:sticky;top:100px;align-self:start;display:grid;gap:13px}.updates-index nav{display:grid;gap:6px}.updates-index a{display:flex;justify-content:space-between;gap:10px;padding:10px;border-left:2px solid rgba(124,108,255,.25);color:var(--muted)}.updates-index a:hover{border-color:#8b93ff;color:#fff;background:rgba(124,108,255,.06)}.updates-index small{font-size:.7rem}.updates-timeline{position:relative;display:grid;gap:38px}.updates-timeline:before{content:"";position:absolute;left:-26px;top:18px;bottom:18px;width:1px;background:linear-gradient(var(--devblog-accent),rgba(124,108,255,.1))}.update-entry{position:relative;scroll-margin-top:100px;padding:clamp(22px,4vw,36px);border:1px solid rgba(255,255,255,.1);border-radius:22px;background:linear-gradient(145deg,rgba(24,30,53,.95),rgba(11,17,32,.96))}.update-timeline-dot{position:absolute;left:-42px;top:31px;width:32px;height:32px;display:grid;place-items:center;border:1px solid color-mix(in srgb,var(--devblog-accent) 60%,transparent);border-radius:50%;color:var(--devblog-accent);background:#0b1120}.update-timeline-dot svg{width:18px}.update-entry h2{margin:12px 0 8px;font-size:clamp(1.5rem,3vw,2.3rem)}.update-summary,.update-content{color:var(--muted);line-height:1.75}.update-content{margin-top:20px;padding-top:20px;border-top:1px solid rgba(255,255,255,.08)}.update-cover{width:100%;max-height:420px;object-fit:cover;margin-top:22px;border-radius:16px}.update-change-groups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px;margin-top:25px}.update-change-group{padding:16px;border:1px solid rgba(255,255,255,.08);border-radius:15px;background:rgba(255,255,255,.025)}.update-change-group h3{display:flex;align-items:center;gap:9px;margin:0 0 12px;font-size:1rem}.update-change-group h3>span{width:31px;height:31px;display:grid;place-items:center;border-radius:9px;background:rgba(124,108,255,.13)}.update-change-group h3 svg{width:16px}.update-change-group h3 small{margin-left:auto;color:var(--muted)}.update-change-group ul{display:grid;gap:8px;margin:0;padding-left:20px;color:#d9def1;line-height:1.5}.update-change-group.is-success h3{color:#79f2c0}.update-change-group.is-warning h3{color:#fcd77f}.update-change-group.is-danger h3{color:#ff9ba7}.update-change-group.is-info h3{color:#9bbcff}.updates-empty{min-height:300px}
@media(max-width:1000px){.devblog-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.devblog-admin-card{grid-template-columns:1fr auto}.devblog-progress{grid-column:1/-1}.devblog-progress-label{display:none}.updates-layout{grid-template-columns:1fr}.updates-index{position:static}.updates-index nav{display:flex;overflow-x:auto}.updates-index a{min-width:120px}.updates-timeline:before,.update-timeline-dot{display:none}}
@media(max-width:700px){.devblog-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.devblog-form-grid,.devblog-change-grid,.update-change-groups{grid-template-columns:1fr}.devblog-admin-card{grid-template-columns:1fr}.devblog-admin-card .row-actions{justify-content:flex-start;flex-wrap:wrap}.updates-page{width:calc(100% - 20px);padding-top:24px}.updates-hero,.update-featured{grid-template-columns:1fr}.updates-hero-status,.update-featured-version{min-width:0}.updates-hero-status{justify-items:start}.update-featured-version{justify-items:start}}

/* Suggestions membres et suivi produit */
.suggestions-page,.suggestion-admin-page{display:grid;gap:24px}.suggestion-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}.suggestion-steps article{display:flex;align-items:center;gap:13px;padding:17px;border:1px solid rgba(255,255,255,.09);border-radius:15px;background:rgba(255,255,255,.025)}.suggestion-steps article>span{width:38px;height:38px;flex:0 0 auto;display:grid;place-items:center;border-radius:12px;color:#fff;background:linear-gradient(135deg,#5968ff,#9b5cff);font-weight:950}.suggestion-steps article>div{display:grid;gap:3px}.suggestion-steps small{color:var(--muted)}.suggestion-form,.suggestion-review-form{display:grid;gap:18px}.suggestion-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.suggestion-form-grid .wide-field{grid-column:1/-1}.suggestion-locked{display:flex;align-items:center;gap:17px;padding:19px;border:1px solid rgba(251,191,36,.25);border-radius:15px;background:rgba(251,191,36,.06)}.suggestion-locked>svg{width:42px;height:42px;color:#facc15}.suggestion-locked>div{display:grid;gap:4px;flex:1}.suggestion-locked p{margin:0;color:var(--muted)}.suggestion-tabs{display:flex;gap:6px;flex-wrap:wrap}.suggestion-tabs a{padding:8px 11px;border:1px solid rgba(255,255,255,.09);border-radius:9px;color:var(--muted);font-size:.8rem;font-weight:850}.suggestion-tabs a.active,.suggestion-tabs a:hover{color:#fff;border-color:rgba(124,108,255,.45);background:rgba(124,108,255,.13)}.suggestion-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.suggestion-card{display:flex;flex-direction:column;gap:17px;padding:21px;border:1px solid rgba(255,255,255,.09);border-radius:18px;background:linear-gradient(145deg,rgba(25,31,54,.96),rgba(11,17,32,.97));scroll-margin-top:100px}.suggestion-card header{display:flex;align-items:flex-start;justify-content:space-between;gap:15px}.suggestion-card header>div{display:grid;gap:7px}.suggestion-card h3{margin:0;font-size:1.18rem}.suggestion-card header small,.suggestion-card footer{color:var(--muted);font-size:.77rem}.suggestion-domain{width:max-content;display:inline-flex;align-items:center;gap:6px;color:#aeb5ff;font-size:.72rem;font-weight:900;text-transform:uppercase;letter-spacing:.04em}.suggestion-domain svg{width:15px}.suggestion-description{margin:0;color:#d7dcef;line-height:1.65}.suggestion-benefit{display:grid;gap:5px;padding:12px;border-left:3px solid #22d3ee;border-radius:8px;background:rgba(34,211,238,.06)}.suggestion-benefit span{color:var(--muted);font-size:.87rem}.suggestion-progress{display:grid;gap:7px}.suggestion-progress>div:first-child{display:flex;justify-content:space-between;font-size:.78rem}.suggestion-official{display:flex;align-items:flex-start;gap:11px;padding:14px;border:1px solid rgba(52,211,153,.25);border-radius:12px;background:rgba(52,211,153,.06)}.suggestion-official>svg{flex:0 0 auto;color:#6ee7b7}.suggestion-official p{margin:4px 0 0;color:#d6efe6;line-height:1.55}.suggestion-history summary{cursor:pointer;color:#aeb5ff;font-weight:850}.suggestion-history>div{display:grid;gap:11px;margin-top:13px;padding-left:6px}.suggestion-history article{display:flex;gap:10px}.suggestion-history article>span{width:9px;height:9px;margin-top:6px;border-radius:50%;background:#7c6cff}.suggestion-history article>div{display:grid;gap:3px}.suggestion-history p{margin:0;color:var(--muted);line-height:1.5}.suggestion-card footer{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto;padding-top:13px;border-top:1px solid rgba(255,255,255,.07)}.suggestion-admin-context{display:grid;gap:12px;margin-bottom:18px;padding:17px;border:1px solid rgba(255,255,255,.08);border-radius:14px;background:rgba(255,255,255,.025)}.suggestion-admin-context p{margin:0;line-height:1.65}.suggestion-admin-context>div{display:grid;gap:4px;color:var(--muted)}.suggestion-admin-history{display:grid;gap:9px;margin-top:20px}.suggestion-admin-history article{display:flex;align-items:flex-start;gap:12px;padding:13px;border-radius:11px;background:rgba(255,255,255,.025)}.suggestion-admin-history article>div{display:grid;gap:4px}.suggestion-admin-history p{margin:0;color:var(--muted)}.suggestion-admin-list{display:grid;gap:10px}.suggestion-admin-list>article{display:grid;grid-template-columns:auto minmax(230px,1fr) auto minmax(110px,.4fr) auto auto;align-items:center;gap:14px;padding:15px;border:1px solid rgba(255,255,255,.08);border-radius:13px;background:rgba(255,255,255,.025)}.suggestion-admin-id{display:grid;justify-items:center;gap:3px}.suggestion-admin-id span{color:var(--muted);font-size:.7rem}.suggestion-admin-list>article>div:nth-child(2){display:grid;gap:5px}.suggestion-admin-list small{color:var(--muted)}
@media(max-width:1050px){.suggestion-list{grid-template-columns:1fr}.suggestion-admin-list>article{grid-template-columns:auto minmax(0,1fr) auto}.suggestion-admin-list .devblog-progress{grid-column:1/-1}}
@media(max-width:700px){.suggestion-steps,.suggestion-form-grid{grid-template-columns:1fr}.suggestion-form-grid .wide-field{grid-column:auto}.suggestion-locked{align-items:flex-start;flex-direction:column}.suggestion-card header,.suggestion-card footer{align-items:flex-start;flex-direction:column}.suggestion-admin-list>article{grid-template-columns:1fr;justify-items:start}.suggestion-admin-list .devblog-progress{width:100%}}

/* Programme bêta et accès maintenance */
.beta-tester-badge{--beta-color:#8b5cf6;width:max-content;display:inline-flex;align-items:center;gap:5px;padding:4px 8px;border:1px solid color-mix(in srgb,var(--beta-color) 58%,transparent);border-radius:999px;color:color-mix(in srgb,var(--beta-color) 35%,white);background:color-mix(in srgb,var(--beta-color) 15%,rgba(10,15,29,.8));font-size:.68rem;font-weight:950;line-height:1;text-transform:uppercase;letter-spacing:.035em;box-shadow:0 0 18px color-mix(in srgb,var(--beta-color) 12%,transparent)}.beta-tester-badge svg{width:12px;height:12px}.member-sidebar-header>span:last-child{align-items:flex-start}.personal-badge-stack{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.beta-admin-page{display:grid;gap:24px}.beta-access-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}.beta-access-summary article{display:flex;align-items:center;gap:14px;padding:17px;border:1px solid rgba(139,92,246,.22);border-radius:15px;background:linear-gradient(135deg,rgba(139,92,246,.09),rgba(255,255,255,.02))}.beta-access-summary article>svg{width:31px;height:31px;color:#a78bfa}.beta-access-summary article>div{display:grid;gap:4px}.beta-access-summary span{color:var(--muted);font-size:.82rem}.beta-tester-form{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.beta-tester-form .wide-field{grid-column:1/-1}.beta-tester-list{display:grid;gap:11px}.beta-tester-row{display:grid;grid-template-columns:auto minmax(240px,1fr) auto minmax(130px,.35fr) auto;align-items:center;gap:15px;padding:16px;border:1px solid rgba(255,255,255,.09);border-left:4px solid #8b5cf6;border-radius:14px;background:rgba(255,255,255,.025)}.beta-tester-row.is-inactive{opacity:.68;border-left-color:#64748b}.beta-tester-row>div:nth-child(2){display:grid;gap:5px}.beta-tester-row>div:nth-child(2)>strong{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.beta-tester-row small{color:var(--muted)}.beta-tester-row p{margin:2px 0 0;color:var(--muted);font-size:.82rem}.beta-tester-row>span:nth-child(4){display:grid;gap:4px}.member-avatar{width:44px;height:44px;display:grid;place-items:center;overflow:hidden;border-radius:13px;background:rgba(139,92,246,.14);font-weight:950}.member-avatar img{width:100%;height:100%;object-fit:cover}
@media(max-width:1000px){.beta-tester-row{grid-template-columns:auto minmax(0,1fr) auto}.beta-tester-row>span:nth-child(4),.beta-tester-row>.row-actions{grid-column:2/-1}}
@media(max-width:700px){.beta-access-summary,.beta-tester-form{grid-template-columns:1fr}.beta-tester-form .wide-field{grid-column:auto}.beta-tester-row{grid-template-columns:auto minmax(0,1fr)}.beta-tester-row>.status-pill,.beta-tester-row>span:nth-child(4),.beta-tester-row>.row-actions{grid-column:1/-1}}
.beta-briefing-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.beta-briefing-form .wide-field{grid-column:1/-1}.beta-briefing-page{display:grid;gap:24px}.beta-briefing-hero,.beta-feedback-card{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px;border:1px solid rgba(139,92,246,.3);border-radius:18px;background:linear-gradient(120deg,rgba(139,92,246,.14),rgba(34,211,238,.05))}.beta-briefing-hero>div,.beta-feedback-card>div{display:flex;align-items:center;gap:14px}.beta-briefing-hero p,.beta-feedback-card p{margin:5px 0 0;color:var(--muted)}.beta-briefing-icon{width:48px;height:48px;flex:0 0 auto;display:grid;place-items:center;border-radius:15px;color:#c4b5fd;background:rgba(139,92,246,.18)}.beta-briefing-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.beta-checklist,.beta-rules{display:grid;gap:11px;margin:0;padding:0;list-style:none}.beta-checklist li{display:flex;align-items:center;gap:12px;padding:12px;border-radius:11px;background:rgba(255,255,255,.03)}.beta-checklist li>span{width:31px;height:31px;display:grid;place-items:center;border-radius:9px;color:#fff;background:linear-gradient(135deg,#7c6cff,#22d3ee);font-weight:900}.beta-checklist p{margin:0}.beta-rules li{display:flex;align-items:flex-start;gap:10px;padding:11px;border-bottom:1px solid rgba(255,255,255,.07)}.beta-rules svg{width:18px;color:#6ee7b7}.beta-acknowledge{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:19px;border:1px solid rgba(251,191,36,.3);border-radius:15px;background:rgba(251,191,36,.06)}
@media(max-width:750px){.beta-briefing-form,.beta-briefing-grid{grid-template-columns:1fr}.beta-briefing-form .wide-field{grid-column:auto}.beta-briefing-hero,.beta-feedback-card,.beta-acknowledge{align-items:flex-start;flex-direction:column}}
.beta-reading-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.beta-reading-list article{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;padding:13px;border:1px solid rgba(255,255,255,.08);border-radius:12px;background:rgba(255,255,255,.025)}.beta-reading-list article>div{display:grid;gap:3px}.beta-reading-list small{color:var(--muted)}
@media(max-width:750px){.beta-reading-list{grid-template-columns:1fr}.beta-reading-list article{grid-template-columns:auto minmax(0,1fr)}.beta-reading-list .status-pill{grid-column:1/-1;width:max-content}}

/* Page abonnement : rythme plus ample pour distinguer chaque niveau d'information. */
.guild-section-premium .guild-page-premium {
  display: grid;
  gap: clamp(30px, 4vw, 46px);
  padding: clamp(28px, 4vw, 44px);
}

.guild-section-premium .premium-panel-header {
  margin-bottom: 2px;
}

.guild-section-premium .premium-detail-hero {
  min-height: 132px;
  padding: clamp(24px, 3.5vw, 36px);
}

.guild-section-premium .premium-detail-grid {
  gap: clamp(14px, 2vw, 22px);
}

.guild-section-premium .premium-detail-grid article {
  min-height: 116px;
  padding: 20px;
}

.guild-section-premium .premium-detail-columns {
  gap: clamp(20px, 3vw, 30px);
}

.guild-section-premium .premium-limits-card,
.guild-section-premium .premium-capabilities-card {
  padding: clamp(22px, 3vw, 30px);
}

.guild-section-premium .premium-limits-card dl,
.guild-section-premium .premium-capability-list {
  margin-top: 10px;
  gap: 12px;
}

.guild-section-premium .premium-limits-card dl > div,
.guild-section-premium .premium-capability-list span {
  min-height: 52px;
  padding: 13px 15px;
}

.guild-section-premium .premium-detail-actions {
  gap: 14px;
  padding: 4px 0 6px;
}

.guild-section-premium .premium-metrics-grid {
  gap: clamp(16px, 2.4vw, 24px);
  padding-top: clamp(24px, 3vw, 34px);
  border-top: 1px solid rgba(142, 161, 255, .16);
}

.guild-section-premium .premium-panel-footer {
  gap: 28px;
  padding-top: clamp(22px, 3vw, 32px);
  border-top: 1px solid rgba(142, 161, 255, .16);
}

@media (max-width:980px) {
  .premium-detail-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .premium-detail-columns { grid-template-columns:1fr; }
}

@media (max-width:620px) {
  .guild-section-premium .guild-page-premium {
    gap: 24px;
    padding: 20px;
  }

  .premium-detail-hero { align-items:flex-start; flex-direction:column; }
  .premium-detail-grid,.premium-capability-list { grid-template-columns:1fr; }
  .premium-detail-actions .button { width:100%; justify-content:center; }
}

.premium-bot-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
}

.premium-bot-summary article {
  min-height: 102px;
  display: grid;
  align-content: space-between;
  gap: 10px;
  padding: 16px;
  border: 1px solid rgba(142, 161, 255, 0.18);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.04);
}

.premium-bot-summary strong,
.premium-bot-summary span {
  min-width: 0;
  overflow-wrap: anywhere;
}

.premium-bot-summary strong {
  color: #f8fbff;
  font-size: 1.05rem;
}

.premium-bot-summary span {
  color: var(--muted);
  font-weight: 800;
}

.premium-bot-form {
  margin-top: 0;
}

.premium-promo-admin,
.premium-promo-list,
.premium-promo-card {
  display: grid;
  gap: 16px;
}

.premium-promo-card {
  padding: clamp(16px, 2.2vw, 22px);
  border: 1px solid rgba(142, 161, 255, 0.18);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(34, 211, 238, 0.09), transparent 42%),
    rgba(9, 12, 25, 0.72);
}

.premium-promo-form {
  margin: 0;
}

.promo-code-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.premium-custom-bots {
  display: grid;
  gap: 16px;
}

.premium-custom-bot-table .data-head,
.premium-custom-bot-table .data-row {
  grid-template-columns: minmax(220px, 1.25fr) minmax(150px, 0.85fr) minmax(150px, 0.85fr) minmax(150px, 0.85fr) minmax(160px, 0.85fr) minmax(150px, auto);
}

.premium-custom-bot-table small {
  display: block;
  margin-top: 4px;
  overflow-wrap: anywhere;
}

/* ================================================================
   TicketHub unified visual language
   Couche finale commune aux pages publiques, membre, serveur et admin.
   ================================================================ */
:root {
  --radius: 12px;
  --radius-small: 9px;
  --radius-large: 16px;
  --th-surface: rgba(16, 20, 35, 0.94);
  --th-surface-soft: rgba(24, 29, 48, 0.82);
  --th-border: rgba(142, 161, 255, 0.2);
  --th-border-strong: rgba(142, 161, 255, 0.36);
  --th-highlight: rgba(255, 255, 255, 0.055);
  --th-card-shadow: 0 18px 46px rgba(0, 0, 0, 0.28);
}

html {
  scroll-padding-top: 92px;
}

body {
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

::selection {
  color: #fff;
  background: rgba(88, 101, 242, 0.72);
}

:where(a, button, input, select, textarea, summary):focus-visible {
  outline: 3px solid rgba(34, 211, 238, 0.52);
  outline-offset: 3px;
}

.site-header {
  min-height: 72px;
  padding-inline: clamp(18px, 3vw, 38px);
  background:
    linear-gradient(90deg, rgba(8, 11, 23, 0.97), rgba(20, 24, 42, 0.94) 56%, rgba(29, 22, 47, 0.94)),
    #090c18;
}

.site-nav {
  gap: 5px;
}

.site-nav a {
  min-height: 38px;
  padding: 8px 11px;
  border-radius: var(--radius-small);
}

.nav-pill,
.nav-pill-alt {
  padding-inline: 14px !important;
}

body.content-page main,
body.app-page main {
  padding-bottom: 42px;
}

body.content-page .page-hero {
  position: relative;
  max-width: 1180px;
  margin-top: 34px;
  padding: clamp(30px, 5vw, 58px);
  overflow: hidden;
  border: 1px solid var(--th-border);
  border-radius: var(--radius-large);
  background:
    radial-gradient(circle at 8% 0%, rgba(88, 101, 242, 0.25), transparent 35%),
    radial-gradient(circle at 94% 12%, rgba(34, 211, 238, 0.1), transparent 30%),
    linear-gradient(145deg, rgba(20, 24, 43, 0.97), rgba(10, 13, 27, 0.96));
  box-shadow: var(--th-card-shadow), inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

body.content-page .page-hero::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: min(360px, 45%);
  height: 100%;
  pointer-events: none;
  opacity: 0.35;
  background: linear-gradient(135deg, transparent 28%, rgba(88, 101, 242, 0.16), transparent 72%);
  transform: skewX(-14deg) translateX(28%);
}

.page-hero > *,
.section > * {
  position: relative;
  z-index: 1;
}

.page-hero h1,
.workspace-heading h1,
.section-heading h2,
.section-title h2 {
  color: #fff;
  letter-spacing: -0.025em;
  text-wrap: balance;
}

.page-hero p,
.section-heading p,
.section-title p {
  max-width: 760px;
}

.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  width: fit-content;
  color: #9ae6f5;
  letter-spacing: 0.11em;
}

.eyebrow::before {
  content: "";
  width: 18px;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--primary), var(--cyan));
  box-shadow: 0 0 10px rgba(34, 211, 238, 0.38);
}

.section {
  padding-top: clamp(42px, 6vw, 72px);
}

.section-heading {
  position: relative;
  margin-bottom: 24px;
  padding-left: 18px;
}

.section-heading::before {
  content: "";
  position: absolute;
  top: 3px;
  bottom: 3px;
  left: 0;
  width: 3px;
  border-radius: 999px;
  background: linear-gradient(180deg, var(--primary), var(--cyan));
  box-shadow: 0 0 16px rgba(88, 101, 242, 0.3);
}

:where(
  .feature-card,
  .price-box,
  .guild-card,
  .team-card,
  .panel-section,
  .panel-card,
  .auth-panel,
  .doc-block,
  .legal-card,
  .status-service-card,
  .status-summary-card,
  .premium-offer-card,
  .maintenance-panel
) {
  border: 1px solid var(--th-border);
  border-radius: var(--radius);
  background:
    linear-gradient(145deg, rgba(88, 101, 242, 0.07), transparent 42%),
    var(--th-surface);
  box-shadow: var(--th-card-shadow), inset 0 1px 0 rgba(255, 255, 255, 0.045);
}

:where(.feature-card, .guild-card, .team-card, .panel-card, .doc-block, .status-service-card) {
  transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

:where(.feature-card, .guild-card, .team-card, .panel-card, .doc-block, .status-service-card):hover {
  transform: translateY(-3px);
  border-color: var(--th-border-strong);
  background:
    linear-gradient(145deg, rgba(88, 101, 242, 0.13), rgba(34, 211, 238, 0.035) 55%, transparent),
    rgba(18, 22, 38, 0.97);
  box-shadow: 0 22px 52px rgba(0, 0, 0, 0.32), 0 10px 32px rgba(88, 101, 242, 0.1);
}

.panel-section {
  border-radius: var(--radius-large);
}

.section-title,
.workspace-heading {
  min-width: 0;
}

.workspace-heading {
  padding: 4px 2px 18px;
  border-bottom: 1px solid rgba(142, 161, 255, 0.13);
}

.section-title {
  padding-bottom: 16px;
  border-bottom: 1px solid rgba(142, 161, 255, 0.13);
}

.button {
  min-height: 42px;
  border-radius: var(--radius-small);
  font-weight: 850;
  letter-spacing: 0.005em;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.09);
}

.button.primary,
.button.discord {
  border-color: rgba(165, 180, 252, 0.4);
  background: linear-gradient(135deg, #5865f2, #7667f3 54%, #9b6dff);
  box-shadow: 0 12px 28px rgba(88, 101, 242, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.16);
}

.button.secondary,
.button.ghost,
.button.quiet {
  border-color: rgba(142, 161, 255, 0.22);
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.075), rgba(88, 101, 242, 0.06));
}

.button.danger {
  border-color: rgba(237, 66, 69, 0.38);
  background: linear-gradient(135deg, rgba(237, 66, 69, 0.9), rgba(190, 42, 62, 0.94));
}

:where(input, select, textarea) {
  min-height: 42px;
  border: 1px solid rgba(142, 161, 255, 0.2);
  border-radius: var(--radius-small);
  color: #f8faff;
  background: rgba(7, 10, 22, 0.78);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.025);
  transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

:where(input, select, textarea):hover {
  border-color: rgba(142, 161, 255, 0.35);
  background: rgba(10, 14, 28, 0.9);
}

:where(input, select, textarea):focus {
  border-color: rgba(34, 211, 238, 0.62);
  box-shadow: 0 0 0 3px rgba(34, 211, 238, 0.12), 0 10px 24px rgba(0, 0, 0, 0.18);
}

label {
  color: #dce2f2;
}

.stat-grid {
  gap: 14px;
}

.stat-grid article {
  min-height: 108px;
  padding: 17px;
  border: 1px solid var(--th-border);
  border-radius: var(--radius);
  background:
    linear-gradient(145deg, rgba(88, 101, 242, 0.1), transparent 55%),
    rgba(15, 19, 33, 0.92);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.045), 0 12px 30px rgba(0, 0, 0, 0.2);
}

.stat-grid strong {
  color: #fff;
  font-size: clamp(1.45rem, 2.4vw, 2rem);
}

.status-pill,
.permission-pill,
.ticket-priority,
.meta-row span {
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 999px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.055);
}

.flash {
  border-radius: var(--radius);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.data-table {
  gap: 9px;
}

.data-head {
  min-height: 44px;
  border: 1px solid rgba(142, 161, 255, 0.14);
  border-radius: var(--radius-small);
  background: linear-gradient(135deg, rgba(88, 101, 242, 0.14), rgba(34, 211, 238, 0.035)), rgba(13, 17, 31, 0.94);
}

.data-row {
  border: 1px solid rgba(142, 161, 255, 0.14);
  border-radius: var(--radius-small);
  background: rgba(13, 17, 31, 0.8);
}

.empty-state,
.ops-empty {
  border: 1px dashed rgba(142, 161, 255, 0.28);
  border-radius: var(--radius);
  background: rgba(88, 101, 242, 0.045);
}

.pagination {
  padding-top: 16px;
  border-top: 1px solid rgba(142, 161, 255, 0.12);
}

.sidebar {
  border-radius: var(--radius-large);
}

@media (max-width: 760px) {
  body.content-page .page-hero {
    width: min(100% - 24px, 1180px);
    margin-top: 18px;
    padding: 24px 20px;
  }

  .section {
    width: min(100% - 24px, 1180px);
  }

  .section-heading {
    padding-left: 14px;
  }
}

@media (max-width: 980px) {
  .sidebar.guild-sidebar {
    display: grid;
    overflow: visible;
    white-space: normal;
  }

  .guild-sidebar-nav {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
  }

  .guild-sidebar .side-link {
    min-width: 0;
  }
}

@media (max-width: 620px) {
  .guild-sidebar-nav {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* Filtres tickets: la largeur disponible depend de la sidebar du serveur. */
.ticket-filter-form {
  grid-template-columns: repeat(auto-fit, minmax(145px, 1fr));
  gap: 16px;
}

.ticket-filter-form .ticket-filter-search {
  grid-column: span 2;
  min-width: 0;
}

.ticket-filter-form > .button {
  width: 100%;
  min-width: 0;
}

@media (max-width: 760px) {
  .ticket-filter-form {
    grid-template-columns: minmax(0, 1fr);
  }

  .ticket-filter-form .ticket-filter-search {
    grid-column: auto;
  }
}

/* Le contenu Premium ne doit jamais comprimer les avantages en colonne etroite. */
.premium-panel-footer {
  grid-template-columns: minmax(0, 1fr);
  align-items: stretch;
}

.premium-panel-footer .premium-feature-badges {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  min-width: 0;
}

.premium-panel-footer .premium-feature-badges span {
  flex: 0 1 auto;
  width: auto;
  min-width: 0;
  max-width: 100%;
  white-space: normal;
  overflow-wrap: normal;
  word-break: normal;
}

.premium-panel-footer .premium-panel-actions {
  width: 100%;
  min-width: 0;
  justify-content: flex-start;
}

.premium-panel-footer .premium-panel-actions > * {
  flex: 0 1 auto;
}

.text-online {
  color: #6ee7b7 !important;
}

.text-offline {
  color: #fda4af !important;
}

@media (max-width: 1100px) {
  .premium-limit-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .premium-bot-summary {
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
  }
}

@media (max-width: 760px) {
  .price-box-head,
  .premium-offer-card-head {
    display: grid;
    justify-items: start;
  }

  .premium-offer-actions,
  .premium-offer-actions .inline-form,
  .premium-checkout-form,
  .premium-checkout-card,
  .premium-checkout-card-compact,
  .premium-offer-actions .button,
  .premium-offer-select,
  .promo-code-input,
  .premium-limit-grid {
    width: 100%;
    max-width: none;
  }

  .premium-checkout-card,
  .premium-checkout-card-compact {
    grid-template-columns: minmax(0, 1fr);
  }

  .premium-offer-actions {
    justify-content: stretch;
  }

  .premium-custom-bot-table .data-head,
  .premium-custom-bot-table .data-row {
    grid-template-columns: minmax(180px, 1fr) minmax(135px, 0.8fr) minmax(135px, 0.8fr) minmax(135px, 0.8fr) minmax(150px, 0.8fr) minmax(140px, auto);
  }

  .premium-limit-grid,
  .premium-option-checks {
    grid-template-columns: minmax(0, 1fr);
  }

  .offer-danger-form {
    justify-content: stretch;
  }
}

.server-assistant-panel,
.template-card-grid,
.setup-action-grid,
.ops-grid,
.ops-list,
.ops-timeline {
  display: grid;
  gap: 16px;
}

.setup-score-card {
  display: grid;
  gap: 14px;
  padding: clamp(16px, 2.4vw, 22px);
  border: 1px solid rgba(142, 161, 255, 0.18);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(34, 211, 238, 0.08), transparent 48%),
    rgba(255, 255, 255, 0.035);
}

.setup-score-card strong,
.template-card strong,
.setup-action-grid strong,
.ops-list-row strong,
.ops-timeline-row strong {
  color: #f8fbff;
  overflow-wrap: anywhere;
}

.setup-score-card small,
.template-card small,
.setup-action-grid small,
.ops-list-row small,
.ops-timeline-row small {
  color: var(--muted);
  font-weight: 750;
  overflow-wrap: anywhere;
}

.setup-score-bar {
  height: 10px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(142, 161, 255, 0.13);
}

.setup-score-bar span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #5865f2, #22d3ee);
}

.setup-checks,
.template-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.setup-checks span,
.template-meta span {
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 6px 10px;
  border-radius: 8px;
  font-weight: 850;
  color: #dce4ff;
  background: rgba(255, 255, 255, 0.055);
  border: 1px solid rgba(142, 161, 255, 0.14);
}

.setup-checks svg,
.template-meta svg {
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
}

.setup-checks .is-done {
  color: #d4f8df;
  background: rgba(35, 165, 89, 0.15);
}

.setup-checks .is-missing {
  color: #ffe7c2;
  background: rgba(251, 146, 60, 0.14);
}

.installation-entry-panel {
  display: grid;
  gap: 22px;
  overflow: hidden;
  background:
    radial-gradient(circle at 88% 12%, rgba(34, 211, 238, 0.12), transparent 32%),
    linear-gradient(135deg, rgba(88, 101, 242, 0.12), transparent 54%),
    rgba(10, 14, 29, 0.92);
}

.installation-entry-hero {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
}

.installation-entry-hero h2,
.installation-entry-hero p {
  margin: 3px 0 0;
}

.installation-entry-icon,
.installation-next-icon,
.installation-subheading-icon {
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  color: #f8fbff;
  border: 1px solid rgba(130, 151, 255, 0.34);
  background: linear-gradient(135deg, #5865f2, #8b5cf6 58%, #22d3ee);
  box-shadow: 0 16px 34px rgba(88, 101, 242, 0.2);
}

.installation-entry-icon {
  width: 64px;
  height: 64px;
  border-radius: 18px;
}

.installation-entry-icon svg {
  width: 30px;
  height: 30px;
}

.installation-entry-steps {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.installation-entry-steps article {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 11px;
  align-items: start;
  min-width: 0;
  padding: 16px;
  border: 1px solid rgba(142, 161, 255, 0.17);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.035);
}

.installation-entry-steps article > span {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  color: #e9edff;
  font-weight: 950;
  background: rgba(88, 101, 242, 0.2);
  border: 1px solid rgba(124, 140, 255, 0.32);
}

.installation-entry-steps article div {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.installation-entry-steps strong {
  color: #f8fbff;
}

.installation-entry-steps small {
  color: var(--muted);
  line-height: 1.55;
}

.installation-help-note {
  display: flex;
  gap: 12px;
  align-items: center;
  padding: 14px 16px;
  color: #dce7ff;
  line-height: 1.5;
  border: 1px solid rgba(34, 211, 238, 0.22);
  border-radius: 10px;
  background: rgba(34, 211, 238, 0.07);
}

.installation-help-note svg {
  width: 21px;
  height: 21px;
  flex: 0 0 auto;
  color: #67e8f9;
}

.installation-next-action {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) auto;
  gap: 16px;
  align-items: center;
  padding: 18px;
  border: 1px solid rgba(124, 140, 255, 0.33);
  border-radius: 12px;
  background:
    linear-gradient(100deg, rgba(88, 101, 242, 0.18), rgba(139, 92, 246, 0.09) 58%, rgba(34, 211, 238, 0.08)),
    rgba(10, 14, 29, 0.8);
}

.installation-next-action.is-complete {
  border-color: rgba(52, 211, 153, 0.3);
  background: linear-gradient(100deg, rgba(16, 185, 129, 0.15), rgba(34, 211, 238, 0.06));
}

.installation-next-icon {
  width: 48px;
  height: 48px;
  border-radius: 14px;
}

.installation-next-action > div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.installation-next-action small,
.installation-next-action > div span {
  color: var(--muted);
}

.installation-next-action strong {
  color: #fff;
  font-size: 1.08rem;
}

.installation-step-list {
  display: grid;
  gap: 12px;
}

.installation-step {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 16px;
  padding: 18px;
  border: 1px solid rgba(142, 161, 255, 0.16);
  border-radius: 12px;
  background: rgba(8, 11, 24, 0.56);
  transition: border-color 160ms ease, transform 160ms ease, background 160ms ease;
}

.installation-step.is-current {
  border-color: rgba(124, 140, 255, 0.5);
  background:
    linear-gradient(110deg, rgba(88, 101, 242, 0.12), transparent 62%),
    rgba(8, 11, 24, 0.72);
  box-shadow: inset 3px 0 0 #7c8cff;
}

.installation-step.is-done {
  border-color: rgba(52, 211, 153, 0.2);
}

.installation-step-index {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  color: #dce4ff;
  font-weight: 950;
  border: 1px solid rgba(142, 161, 255, 0.24);
  border-radius: 13px;
  background: rgba(88, 101, 242, 0.14);
}

.installation-step.is-done .installation-step-index {
  color: #bdfbd3;
  border-color: rgba(52, 211, 153, 0.28);
  background: rgba(16, 185, 129, 0.14);
}

.installation-step-index svg {
  width: 20px;
  height: 20px;
}

.installation-step-main {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.installation-step-main > p {
  margin: 0;
  color: #c8d2eb;
  line-height: 1.55;
}

.installation-step-head {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) auto;
  gap: 11px;
  align-items: center;
}

.installation-step-head > div {
  display: grid;
  gap: 2px;
}

.installation-step-head small,
.installation-step-detail small {
  color: var(--muted);
  font-weight: 750;
}

.installation-step-head strong {
  color: #fff;
  font-size: 1.04rem;
}

.installation-step-title-icon {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  color: #aeb9ff;
  border-radius: 10px;
  background: rgba(88, 101, 242, 0.11);
}

.installation-step-title-icon svg {
  width: 19px;
  height: 19px;
}

.installation-step-status {
  padding: 6px 9px;
  color: #b8c3df;
  font-size: 0.74rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  border: 1px solid rgba(142, 161, 255, 0.17);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.04);
}

.installation-step.is-current .installation-step-status {
  color: #eef0ff;
  border-color: rgba(124, 140, 255, 0.33);
  background: rgba(88, 101, 242, 0.16);
}

.installation-step.is-done .installation-step-status {
  color: #bdfbd3;
  border-color: rgba(52, 211, 153, 0.23);
  background: rgba(16, 185, 129, 0.12);
}

.installation-step-details {
  display: grid;
  grid-template-columns: minmax(220px, 0.8fr) minmax(280px, 1.4fr);
  gap: 10px;
}

.installation-step-detail {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  gap: 9px;
  align-items: start;
  min-width: 0;
  padding: 12px;
  border-radius: 9px;
  background: rgba(255, 255, 255, 0.035);
}

.installation-step-detail > svg {
  width: 18px;
  height: 18px;
  margin-top: 2px;
  color: #8fa0ff;
}

.installation-step-detail span {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.installation-step-detail strong {
  color: #dce4f8;
  font-size: 0.88rem;
  line-height: 1.45;
}

.installation-step-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
}

.installation-command-hint {
  display: inline-flex;
  gap: 7px;
  align-items: center;
  color: var(--muted);
  font-size: 0.86rem;
}

.installation-command-hint svg {
  width: 16px;
  height: 16px;
}

.installation-command-hint code {
  padding: 3px 7px;
  color: #dce4ff;
  border-radius: 6px;
  background: rgba(88, 101, 242, 0.16);
}

.installation-quick-panel {
  display: grid;
  gap: 18px;
  margin-top: 10px;
  padding: clamp(18px, 2.5vw, 26px);
  border: 1px solid rgba(34, 211, 238, 0.22);
  border-radius: 12px;
  background:
    linear-gradient(135deg, rgba(34, 211, 238, 0.08), transparent 45%),
    rgba(8, 12, 25, 0.68);
}

.installation-subheading {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  gap: 14px;
  align-items: center;
}

.installation-subheading-icon {
  width: 48px;
  height: 48px;
  border-radius: 14px;
}

.installation-subheading h3,
.installation-subheading p,
.installation-template-heading h3,
.installation-template-heading p {
  margin: 3px 0 0;
}

.installation-quick-form {
  display: grid;
  gap: 18px;
}

.installation-quick-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.installation-quick-grid > label,
.installation-quick-grid > .installation-field-group {
  display: grid;
  align-content: start;
  gap: 8px;
  min-width: 0;
}

.installation-quick-grid > label > span,
.installation-quick-grid > .installation-field-group > span {
  color: #eef2ff;
  font-weight: 850;
}

.installation-quick-grid > label > span em,
.installation-quick-grid > .installation-field-group > span em {
  margin-left: 5px;
  color: #9ba9ff;
  font-size: 0.7rem;
  font-style: normal;
  text-transform: uppercase;
}

.installation-quick-grid > label > small,
.installation-quick-grid > .installation-field-group > small {
  color: var(--muted);
  line-height: 1.45;
}

.installation-field-wide {
  grid-column: 1 / -1;
}

.installation-rating-option {
  padding: 14px;
  border: 1px solid rgba(142, 161, 255, 0.15);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.03);
}

.installation-rating-option > span {
  display: grid;
  gap: 3px;
}

.installation-rating-option small {
  color: var(--muted);
  font-weight: 650;
}

.installation-quick-actions {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: center;
}

.installation-quick-actions > span {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  color: #b9c5de;
  font-size: 0.88rem;
}

.installation-quick-actions > span svg {
  width: 18px;
  height: 18px;
  color: #6ee7b7;
}

.installation-template-heading {
  margin-top: 14px;
  padding-top: 24px;
  border-top: 1px solid rgba(142, 161, 255, 0.14);
}

.template-apply-form {
  display: grid;
  grid-template-columns: minmax(260px, 1.4fr) minmax(190px, 0.75fr) auto;
  gap: 12px;
  align-items: end;
}

.template-card-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.template-card {
  display: grid;
  align-content: start;
  gap: 14px;
  min-height: 220px;
  padding: clamp(16px, 2vw, 20px);
  border: 1px solid color-mix(in srgb, var(--template-accent, #5865f2) 34%, rgba(142, 161, 255, 0.14));
  border-radius: 8px;
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--template-accent, #5865f2) 16%, transparent), transparent 54%),
    rgba(9, 12, 25, 0.74);
}

.template-card p {
  min-height: 58px;
  margin: 0;
  color: #d2d9ef;
  line-height: 1.6;
  overflow-wrap: anywhere;
}

.template-card-head,
.setup-action-grid article,
.ops-status-card,
.ops-list-row,
.ops-timeline-row {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
}

.template-icon,
.ops-status-icon,
.ops-row-icon {
  width: 42px;
  height: 42px;
  display: inline-grid;
  place-items: center;
  border-radius: 8px;
  color: #dfe7ff;
  background: rgba(88, 101, 242, 0.2);
  border: 1px solid rgba(142, 161, 255, 0.22);
}

.setup-action-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.setup-action-grid article {
  padding: 16px;
  border-radius: 8px;
  border: 1px solid rgba(142, 161, 255, 0.16);
  background: rgba(255, 255, 255, 0.04);
}

.setup-action-grid article > svg {
  width: 38px;
  height: 38px;
  padding: 9px;
  border-radius: 8px;
  color: #b9f2ff;
  background: rgba(34, 211, 238, 0.12);
}

.ops-hero {
  display: grid;
  grid-template-columns: minmax(280px, 1.4fr) repeat(3, minmax(150px, 0.75fr));
  gap: 16px;
}

.ops-hero article,
.ops-panel {
  min-width: 0;
}

.ops-hero article {
  display: grid;
  align-content: center;
  gap: 8px;
  min-height: 132px;
  padding: 18px;
  border: 1px solid rgba(142, 161, 255, 0.18);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.04);
}

.ops-hero article strong {
  color: #f8fbff;
  font-size: clamp(1.65rem, 2.8vw, 2.25rem);
  line-height: 1;
}

.ops-hero article span {
  color: var(--muted);
  font-weight: 850;
}

.ops-status-card {
  align-content: center;
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.16), transparent 55%),
    rgba(8, 11, 24, 0.78) !important;
}

.ops-status-card strong {
  display: block;
  margin-bottom: 6px;
}

.ops-status-card.offline .ops-status-icon {
  color: #fecdd3;
  background: rgba(244, 63, 94, 0.15);
}

.ops-status-card.warning .ops-status-icon {
  color: #ffe7c2;
  background: rgba(251, 146, 60, 0.16);
}

.ops-status-card.online .ops-status-icon {
  color: #d4f8df;
  background: rgba(35, 165, 89, 0.16);
}

.ops-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.ops-panel {
  margin: 0;
}

.ops-list-row,
.ops-timeline-row {
  min-height: 66px;
  padding: 12px;
  border: 1px solid rgba(142, 161, 255, 0.13);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.035);
  color: inherit;
  text-decoration: none;
}

.ops-list-row {
  grid-template-columns: 42px minmax(0, 1fr) minmax(110px, auto);
}

.ops-timeline-row {
  grid-template-columns: 38px minmax(0, 1fr) minmax(110px, auto);
}

.ops-list-row:hover,
.ops-timeline-row:hover {
  border-color: rgba(142, 161, 255, 0.28);
  background: rgba(255, 255, 255, 0.055);
}

.ops-timeline-row time {
  color: var(--muted);
  font-weight: 800;
  text-align: right;
}

.ops-empty {
  min-height: 92px;
  display: grid;
  place-items: center;
  gap: 8px;
  padding: 18px;
  text-align: center;
  color: var(--muted);
  font-weight: 850;
  border: 1px dashed rgba(142, 161, 255, 0.2);
  border-radius: 8px;
}

.satisfaction-panel,
.satisfaction-layout,
.feedback-mini-list {
  display: grid;
  gap: 16px;
}

.satisfaction-basic-grid article strong {
  overflow-wrap: anywhere;
}

.satisfaction-layout {
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.65fr);
  align-items: start;
}

.feedback-mini-row {
  display: grid;
  grid-template-columns: 62px minmax(0, 1fr) minmax(116px, auto);
  gap: 12px;
  align-items: center;
  min-height: 72px;
  padding: 12px;
  border: 1px solid rgba(142, 161, 255, 0.13);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.035);
}

.feedback-score {
  min-height: 38px;
  display: inline-grid;
  place-items: center;
  border-radius: 8px;
  font-weight: 950;
  color: #f8fbff;
  background: rgba(142, 161, 255, 0.16);
  border: 1px solid rgba(142, 161, 255, 0.2);
}

.feedback-score.is-good {
  color: #d4f8df;
  background: rgba(35, 165, 89, 0.16);
}

.feedback-score.is-mid {
  color: #ffe7c2;
  background: rgba(251, 146, 60, 0.16);
}

.feedback-score.is-low {
  color: #fecdd3;
  background: rgba(244, 63, 94, 0.16);
}

.inbox-filter-form {
  display: grid;
  grid-template-columns: minmax(240px, 1fr) minmax(180px, 240px) auto auto;
  gap: 12px;
  align-items: end;
  margin-bottom: 18px;
}

.inbox-search {
  min-width: 0;
}

.staff-inbox-list,
.profile-list {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.staff-inbox-row,
.profile-list-row {
  min-width: 0;
  display: grid;
  gap: 12px;
  align-items: center;
  min-height: 72px;
  padding: 12px;
  color: inherit;
  text-decoration: none;
  border: 1px solid rgba(142, 161, 255, 0.14);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.08), transparent 58%),
    rgba(255, 255, 255, 0.035);
}

.staff-inbox-row {
  grid-template-columns: 46px minmax(0, 1fr) auto;
}

.profile-list-row {
  grid-template-columns: 42px minmax(0, 1fr) minmax(92px, auto);
}

.staff-inbox-row:hover,
.profile-list-row:hover {
  border-color: rgba(34, 211, 238, 0.3);
  background:
    linear-gradient(135deg, rgba(34, 211, 238, 0.08), transparent 58%),
    rgba(255, 255, 255, 0.055);
}

.staff-inbox-row.inbox-critical {
  border-color: rgba(244, 63, 94, 0.38);
  background:
    linear-gradient(135deg, rgba(244, 63, 94, 0.13), transparent 58%),
    rgba(255, 255, 255, 0.035);
}

.staff-inbox-row.inbox-warning {
  border-color: rgba(251, 146, 60, 0.34);
}

.staff-inbox-icon,
.profile-row-icon,
.profile-mini-avatar,
.profile-placeholder {
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  border: 1px solid rgba(142, 161, 255, 0.18);
  background: rgba(142, 161, 255, 0.12);
  color: #dfe7ff;
}

.staff-inbox-icon,
.profile-row-icon,
.profile-mini-avatar {
  width: 42px;
  height: 42px;
  border-radius: 8px;
}

.staff-inbox-icon svg,
.profile-row-icon svg,
.profile-mini-avatar svg,
.profile-placeholder svg {
  width: 20px;
  height: 20px;
}

.profile-mini-avatar {
  overflow: hidden;
  background: rgba(34, 211, 238, 0.1);
}

.profile-mini-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.staff-inbox-main,
.profile-list-row > span:nth-child(2) {
  min-width: 0;
}

.staff-inbox-title {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.staff-inbox-title strong,
.staff-inbox-main p,
.profile-list-row strong,
.profile-list-row small {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
}

.staff-inbox-main p {
  margin: 6px 0 0;
  color: var(--muted);
  font-weight: 750;
  line-height: 1.45;
}

.staff-inbox-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 8px;
}

.staff-inbox-meta span {
  max-width: 100%;
  padding: 5px 8px;
  border-radius: 999px;
  color: #cfd8ff;
  font-size: 0.78rem;
  font-weight: 850;
  background: rgba(255, 255, 255, 0.055);
}

.profile-list-row small {
  margin-top: 3px;
  color: var(--muted);
  font-weight: 750;
}

.profile-list-row time {
  color: var(--muted);
  font-weight: 850;
  text-align: right;
}

.staff-roster-row {
  grid-template-columns: 42px minmax(180px, 1fr) minmax(150px, auto);
  padding: 16px;
}

.staff-roster-identity,
.staff-roster-summary {
  min-width: 0;
}

.staff-roster-summary {
  display: grid;
  justify-items: end;
  gap: 6px;
  text-align: right;
}

.staff-roster-summary small {
  margin: 0;
}

.staff-roster-summary small strong {
  display: inline;
  color: var(--text);
}

.staff-shift-row {
  grid-template-columns: 42px minmax(0, 1fr) auto;
}

@media (max-width: 680px) {
  .staff-roster-row {
    grid-template-columns: 42px minmax(0, 1fr);
  }

  .staff-roster-summary {
    grid-column: 1 / -1;
    justify-items: start;
    padding-left: 54px;
    text-align: left;
  }
}

.admin-profile-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: stretch;
  margin-bottom: 16px;
}

.admin-profile-main {
  min-width: 0;
  display: grid;
  grid-template-columns: 86px minmax(0, 1fr);
  gap: 16px;
  align-items: center;
  min-height: 124px;
  padding: 18px;
  border: 1px solid rgba(142, 161, 255, 0.2);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.14), transparent 48%),
    linear-gradient(225deg, rgba(34, 211, 238, 0.08), transparent 52%),
    rgba(255, 255, 255, 0.04);
}

.admin-profile-main > img,
.profile-placeholder {
  width: 86px;
  height: 86px;
  border-radius: 8px;
}

.admin-profile-main > img {
  object-fit: cover;
  border: 1px solid rgba(142, 161, 255, 0.22);
  background: rgba(255, 255, 255, 0.05);
}

.profile-placeholder {
  color: #b9f2ff;
}

.admin-profile-main strong {
  display: block;
  margin-top: 3px;
  color: #f8fbff;
  font-size: clamp(1.35rem, 2.4vw, 2rem);
  line-height: 1.1;
  overflow-wrap: anywhere;
}

.admin-profile-main small {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-weight: 800;
  overflow-wrap: anywhere;
}

.admin-profile-actions {
  min-width: 220px;
  display: grid;
  align-content: center;
  gap: 10px;
  padding: 14px;
  border: 1px solid rgba(142, 161, 255, 0.16);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.035);
}

.admin-profile-actions .button {
  width: 100%;
  justify-content: center;
}

.admin-profile-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin-top: 16px;
}

.admin-profile-stats {
  margin-bottom: 0;
}

.profile-info-list {
  display: grid;
  gap: 8px;
  margin: 0;
}

.profile-info-list div {
  display: grid;
  grid-template-columns: minmax(120px, 0.48fr) minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  min-height: 40px;
  padding: 9px 10px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.04);
}

.profile-info-list dt,
.profile-info-list dd {
  min-width: 0;
  margin: 0;
  overflow-wrap: anywhere;
}

.profile-info-list dt {
  color: var(--muted);
  font-weight: 850;
}

.profile-info-list dd {
  color: #f8fbff;
  font-weight: 800;
}

.profile-info-list dd small,
.profile-note {
  color: var(--muted);
}

.profile-permission-badges {
  margin-top: 0;
}

.decision-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.decision-form .button {
  justify-self: start;
}

.decision-list {
  display: grid;
  gap: 10px;
}

.decision-row {
  min-width: 0;
  display: grid;
  gap: 8px;
  padding: 13px;
  border: 1px solid rgba(142, 161, 255, 0.16);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(88, 101, 242, 0.1), transparent 58%),
    rgba(255, 255, 255, 0.04);
}

.decision-row-head {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.decision-row strong,
.decision-row p {
  min-width: 0;
  overflow-wrap: anywhere;
}

.decision-row strong {
  color: #f8fbff;
  font-size: 1rem;
  line-height: 1.35;
}

.decision-row p {
  margin: 0;
  color: var(--muted);
  font-weight: 760;
  line-height: 1.5;
}

.server-suspension-banner {
  min-width: 0;
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  margin: 0 0 16px;
  padding: 14px;
  border: 1px solid rgba(251, 146, 60, 0.34);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(251, 146, 60, 0.18), rgba(237, 66, 69, 0.08)),
    rgba(255, 255, 255, 0.045);
  box-shadow: 0 18px 46px rgba(0, 0, 0, 0.2);
}

.server-suspension-banner strong,
.server-suspension-banner small {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
}

.server-suspension-banner strong {
  color: #fff4dd;
  font-size: 1rem;
  line-height: 1.25;
}

.server-suspension-banner small {
  margin-top: 3px;
  color: #ffe6c7;
  font-weight: 760;
  line-height: 1.45;
}

.feedback-mini-row strong,
.feedback-mini-row small {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
}

.feedback-mini-row small {
  margin-top: 3px;
  color: var(--muted);
  font-weight: 750;
}

.feedback-mini-row time {
  color: var(--muted);
  font-weight: 850;
  text-align: right;
}

.satisfaction-premium-card {
  align-content: start;
}

.satisfaction-premium-card .button {
  justify-self: start;
}

.satisfaction-overview-grid {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.satisfaction-overview-grid article {
  position: relative;
  display: grid;
  align-content: start;
  gap: 6px;
  min-width: 0;
  min-height: 152px;
  padding: 18px;
  overflow: hidden;
}

.satisfaction-overview-grid article::after {
  content: "";
  position: absolute;
  right: -26px;
  bottom: -32px;
  width: 88px;
  height: 88px;
  border-radius: 50%;
  background: rgba(88, 101, 242, 0.1);
  filter: blur(2px);
}

.satisfaction-overview-grid article > strong {
  position: relative;
  z-index: 1;
  margin-top: 5px;
  font-size: clamp(1.35rem, 2vw, 1.8rem);
  line-height: 1.05;
}

.satisfaction-overview-grid article > span:not(.satisfaction-stat-icon) {
  color: #eef2ff;
  font-weight: 850;
}

.satisfaction-overview-grid article > small {
  color: var(--muted);
  font-weight: 700;
  line-height: 1.4;
}

.satisfaction-stat-icon {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  color: #b8c2ff;
  border: 1px solid rgba(124, 140, 255, 0.22);
  border-radius: 11px;
  background: rgba(88, 101, 242, 0.13);
}

.satisfaction-stat-icon.is-positive {
  color: #86efac;
  border-color: rgba(52, 211, 153, 0.24);
  background: rgba(16, 185, 129, 0.12);
}

.satisfaction-stat-icon.is-negative {
  color: #fda4af;
  border-color: rgba(244, 63, 94, 0.24);
  background: rgba(244, 63, 94, 0.11);
}

.satisfaction-stat-icon svg {
  width: 19px;
  height: 19px;
}

.satisfaction-insight-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.satisfaction-distribution-card,
.satisfaction-staff-card,
.satisfaction-details-card {
  min-width: 0;
}

.satisfaction-card-heading {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 13px;
  align-items: center;
}

.satisfaction-card-heading > span,
.satisfaction-member-avatar,
.feedback-management-icon {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  color: #b8c2ff;
  border: 1px solid rgba(124, 140, 255, 0.2);
  background: rgba(88, 101, 242, 0.12);
}

.satisfaction-card-heading > span {
  width: 44px;
  height: 44px;
  border-radius: 12px;
}

.satisfaction-card-heading h3,
.satisfaction-card-heading p {
  margin: 0;
}

.satisfaction-card-heading p {
  margin-top: 3px;
  color: var(--muted);
  line-height: 1.45;
}

.satisfaction-rating-distribution {
  margin-top: 4px;
}

.satisfaction-rating-distribution .rating-row {
  grid-template-columns: 42px minmax(0, 1fr) 70px;
}

.satisfaction-rating-distribution .rating-row small {
  text-align: right;
}

.satisfaction-locked-insight {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  min-height: 88px;
  padding: 14px;
  border: 1px solid rgba(142, 161, 255, 0.14);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.03);
}

.satisfaction-locked-insight > svg {
  width: 22px;
  color: #aeb8d4;
}

.satisfaction-locked-insight > span {
  display: grid;
  gap: 3px;
}

.satisfaction-locked-insight strong {
  color: #eef2ff;
}

.satisfaction-locked-insight small {
  color: var(--muted);
  line-height: 1.4;
}

.satisfaction-staff-list {
  display: grid;
  gap: 9px;
}

.satisfaction-staff-row {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) minmax(120px, auto);
  gap: 11px;
  align-items: center;
  min-width: 0;
  padding: 11px;
  border: 1px solid rgba(142, 161, 255, 0.12);
  border-radius: 9px;
  background: rgba(255, 255, 255, 0.028);
}

.satisfaction-member-avatar {
  width: 38px;
  height: 38px;
  border-radius: 10px;
}

.satisfaction-staff-row > span:not(.satisfaction-member-avatar) {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.satisfaction-staff-row > span:last-child {
  text-align: right;
}

.satisfaction-staff-row strong {
  color: #f5f7ff;
  overflow-wrap: anywhere;
}

.satisfaction-staff-row small {
  color: var(--muted);
  font-weight: 700;
  overflow-wrap: anywhere;
}

.satisfaction-details-card {
  display: grid;
  gap: 18px;
}

.satisfaction-filter-form {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) minmax(150px, 190px) minmax(120px, 150px) auto auto;
  gap: 12px;
  align-items: end;
  padding: 14px;
  border: 1px solid rgba(142, 161, 255, 0.14);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.025);
}

.satisfaction-filter-form label {
  min-width: 0;
}

.feedback-detail-list {
  display: grid;
  gap: 14px;
}

.feedback-detail-card {
  position: relative;
  display: grid;
  gap: 14px;
  min-width: 0;
  padding: clamp(16px, 2vw, 20px);
  overflow: hidden;
  border: 1px solid rgba(142, 161, 255, 0.16);
  border-radius: 12px;
  background:
    linear-gradient(120deg, rgba(88, 101, 242, 0.07), transparent 44%),
    rgba(8, 11, 24, 0.62);
}

.feedback-detail-card::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  background: #8b9aff;
}

.feedback-detail-card.is-good::before {
  background: #34d399;
}

.feedback-detail-card.is-mid::before {
  background: #fb923c;
}

.feedback-detail-card.is-low::before {
  background: #fb7185;
}

.feedback-detail-head {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr) auto minmax(125px, auto);
  gap: 13px;
  align-items: center;
}

.feedback-detail-head > .feedback-score {
  width: 64px;
  min-height: 48px;
}

.feedback-detail-head > div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.feedback-detail-head h4,
.feedback-detail-head small {
  margin: 0;
  overflow-wrap: anywhere;
}

.feedback-detail-head h4 {
  color: #fff;
  font-size: 1rem;
}

.feedback-detail-head small,
.feedback-detail-head time {
  color: var(--muted);
  font-weight: 750;
}

.feedback-detail-head time {
  text-align: right;
}

.feedback-stars {
  color: #facc15;
  font-size: 0.9rem;
  letter-spacing: 0.08em;
}

.feedback-comment {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  padding: 13px 14px;
  border: 1px solid rgba(142, 161, 255, 0.13);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.032);
}

.feedback-comment.is-empty {
  opacity: 0.72;
}

.feedback-comment > svg {
  width: 19px;
  margin-top: 2px;
  color: #97a5ff;
}

.feedback-comment > span {
  display: grid;
  gap: 4px;
}

.feedback-comment small {
  color: var(--muted);
  font-weight: 750;
}

.feedback-comment strong {
  color: #e9eeff;
  font-weight: 750;
  line-height: 1.5;
}

.feedback-management-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.feedback-management-grid > div {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 9px;
  align-items: start;
  min-width: 0;
  padding: 12px;
  border: 1px solid rgba(142, 161, 255, 0.11);
  border-radius: 9px;
  background: rgba(255, 255, 255, 0.026);
}

.feedback-management-icon {
  width: 34px;
  height: 34px;
  border-radius: 9px;
}

.feedback-management-icon svg {
  width: 17px;
  height: 17px;
}

.feedback-management-grid > div > span:last-child {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.feedback-management-grid small,
.feedback-management-grid em {
  color: var(--muted);
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 700;
}

.feedback-management-grid strong {
  color: #eef2ff;
  overflow-wrap: anywhere;
}

.feedback-management-grid code {
  max-width: 100%;
  overflow: hidden;
  color: #9aa8ca;
  font-size: 0.72rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.feedback-detail-footer {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 16px;
  align-items: center;
  padding-top: 2px;
}

.feedback-detail-footer > span:not(.feedback-detail-actions) {
  display: inline-flex;
  gap: 6px;
  align-items: center;
  min-width: 0;
  color: var(--muted);
  font-size: 0.8rem;
  font-weight: 700;
  overflow-wrap: anywhere;
}

.feedback-detail-footer > span > svg {
  width: 15px;
  height: 15px;
  flex: 0 0 auto;
}

.feedback-detail-actions {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-left: auto;
}

.feedback-empty {
  min-height: 150px;
}

.feedback-empty strong,
.feedback-empty small {
  display: block;
}

.feedback-empty small {
  margin-top: 5px;
  color: var(--muted);
}

.feedback-pagination {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 12px;
  align-items: center;
}

.feedback-pagination > :last-child {
  justify-self: end;
}

.feedback-pagination > strong {
  color: #dce4ff;
}

/* ================================================================
   Protection globale de mise en page
   Evite les cartes collees, les textes qui debordent et les actions
   qui se superposent dans les espaces public, membre, serveur et admin.
   ================================================================ */
:where(.panel-section, .panel-card) {
  display: grid;
  align-content: start;
}

.panel-section {
  gap: clamp(18px, 2vw, 26px);
}

.panel-card {
  gap: 16px;
  margin-top: 0;
}

/* Les vues serveur etaient affichees en block, ce qui annulait leur gap. */
.guild-section-page :where(
  .guild-page-overview,
  .guild-page-settings,
  .guild-page-assistant,
  .guild-page-premium,
  .guild-page-premium-bot,
  .guild-page-theme,
  .guild-page-stats,
  .guild-page-satisfaction,
  .guild-page-categories,
  .guild-page-panels,
  .guild-page-auto-replies,
  .guild-page-reminders,
  .guild-page-diagnostic,
  .guild-page-managers
) {
  gap: clamp(18px, 2vw, 26px);
}

.guild-section-overview .guild-page-overview,
.guild-section-settings .guild-page-settings,
.guild-section-assistant .guild-page-assistant,
.guild-section-premium .guild-page-premium,
.guild-section-premium-bot .guild-page-premium-bot,
.guild-section-branding .guild-page-branding,
.guild-section-theme .guild-page-theme,
.guild-section-stats .guild-page-stats,
.guild-section-satisfaction .guild-page-satisfaction,
.guild-section-categories .guild-page-categories,
.guild-section-panels .guild-page-panels,
.guild-section-auto-replies .guild-page-auto-replies,
.guild-section-reminders .guild-page-reminders,
.guild-section-diagnostic .guild-page-diagnostic,
.guild-section-managers .guild-page-managers {
  display: grid;
}

:where(
  .panel-section,
  .panel-card,
  .section-title,
  .workspace-heading,
  .hero-actions,
  .row-actions,
  .section-title-actions,
  .permission-badges,
  .premium-panel-actions,
  .guild-title-line,
  .data-head,
  .data-row
) > * {
  min-width: 0;
  max-width: 100%;
}

:where(.section-title, .workspace-heading, .guild-title-line) {
  align-items: flex-start;
  flex-wrap: wrap;
  row-gap: 12px;
}

:where(.hero-actions, .row-actions, .section-title-actions, .premium-panel-actions) {
  flex-wrap: wrap;
  align-items: center;
  row-gap: 10px;
}

:where(.button, .icon-button, .status-pill, .permission-badges span) {
  max-width: 100%;
}

.button {
  white-space: normal;
  overflow-wrap: anywhere;
  text-align: center;
}

:where(.panel-section, .panel-card, .data-row, .data-head) :where(p, span, strong, small, label, dt, dd) {
  overflow-wrap: anywhere;
}

:where(.settings-grid, .stat-grid, .features-grid, .satisfaction-layout, .premium-bot-summary, .premium-detail-grid, .premium-detail-columns) > * {
  min-width: 0;
}

:where(.stack-form, .inline-form, .compact-form, .settings-grid, .ticket-filter-form) :where(input, select, textarea, button) {
  min-width: 0;
  max-width: 100%;
}

.satisfaction-premium-card .premium-feature-badges {
  margin: 2px 0 4px;
}

.premium-bot-panel > .flash,
.premium-bot-panel > .premium-bot-form {
  margin-top: 0;
}

@media (max-width: 680px) {
  .panel-section {
    gap: 18px;
  }

  .panel-card {
    gap: 14px;
  }

  :where(.hero-actions, .section-title-actions, .premium-panel-actions) > .button {
    width: 100%;
    justify-content: center;
  }
}

@media (max-width: 1180px) {
  .satisfaction-overview-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .feedback-management-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .installation-entry-steps {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .template-card-grid,
  .setup-action-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ops-hero {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ops-status-card {
    grid-column: 1 / -1;
  }
}

@media (max-width: 860px) {
  .satisfaction-insight-grid,
  .satisfaction-filter-form {
    grid-template-columns: minmax(0, 1fr);
  }

  .satisfaction-filter-form .button {
    width: 100%;
    justify-content: center;
  }

  .feedback-detail-head {
    grid-template-columns: 64px minmax(0, 1fr);
  }

  .feedback-detail-head > .status-pill,
  .feedback-detail-head > time {
    grid-column: 2;
    justify-self: start;
    text-align: left;
  }

  .installation-next-action {
    grid-template-columns: 48px minmax(0, 1fr);
  }

  .installation-next-action > .button {
    grid-column: 2;
    justify-self: start;
  }

  .installation-step-details,
  .installation-quick-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .installation-field-wide {
    grid-column: auto;
  }

  .inbox-filter-form,
  .admin-profile-hero,
  .admin-profile-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .admin-profile-actions {
    min-width: 0;
  }

  .staff-inbox-row,
  .profile-list-row {
    grid-template-columns: 42px minmax(0, 1fr);
  }

  .staff-inbox-row > .button,
  .profile-list-row > .status-pill,
  .profile-list-row > time {
    grid-column: 2;
    justify-self: start;
    text-align: left;
  }

  .profile-info-list div {
    grid-template-columns: minmax(0, 1fr);
  }

  .decision-form {
    grid-template-columns: minmax(0, 1fr);
  }

  .server-suspension-banner {
    grid-template-columns: 42px minmax(0, 1fr);
  }

  .server-suspension-banner .button {
    grid-column: 2;
    justify-self: start;
  }

  .template-apply-form,
  .template-card-grid,
  .setup-action-grid,
  .ops-grid,
  .ops-hero,
  .ops-stat-grid,
  .satisfaction-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .template-apply-form .button {
    width: 100%;
    justify-content: center;
  }

  .ops-list-row,
  .ops-timeline-row,
  .feedback-mini-row {
    grid-template-columns: 38px minmax(0, 1fr);
  }

  .ops-list-row > .ticket-priority,
  .ops-list-row > .status-pill,
  .ops-timeline-row time,
  .feedback-mini-row time {
    grid-column: 2;
    justify-self: start;
    text-align: left;
  }

  .feedback-mini-row {
    grid-template-columns: 58px minmax(0, 1fr);
  }
}

@media (max-width: 640px) {
  .satisfaction-overview-grid,
  .feedback-management-grid,
  .feedback-detail-head,
  .satisfaction-locked-insight {
    grid-template-columns: minmax(0, 1fr);
  }

  .feedback-detail-head > .status-pill,
  .feedback-detail-head > time {
    grid-column: auto;
  }

  .feedback-detail-actions {
    width: 100%;
    margin-left: 0;
  }

  .feedback-detail-actions .button {
    flex: 1 1 150px;
    justify-content: center;
  }

  .feedback-pagination {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .feedback-pagination > strong {
    grid-column: 1 / -1;
    grid-row: 1;
    justify-self: center;
  }

  .feedback-pagination .button {
    width: 100%;
    justify-content: center;
  }

  .installation-entry-hero,
  .installation-entry-steps,
  .installation-next-action,
  .installation-step,
  .installation-step-head,
  .installation-subheading {
    grid-template-columns: minmax(0, 1fr);
  }

  .installation-entry-hero .status-pill,
  .installation-step-status {
    justify-self: start;
  }

  .installation-next-action > .button {
    grid-column: auto;
    width: 100%;
    justify-content: center;
  }

  .installation-step {
    gap: 12px;
  }

  .installation-step-head {
    gap: 8px;
  }

  .installation-step-title-icon {
    display: none;
  }

  .installation-step-actions .button,
  .installation-quick-actions .button {
    width: 100%;
    justify-content: center;
  }

  .installation-quick-actions {
    align-items: stretch;
    flex-direction: column;
  }
}
.bot-restart-table {
  margin-top: 20px;
}

.bot-restart-table .data-head,
.bot-restart-table .data-row {
  grid-template-columns: minmax(170px, .9fr) minmax(110px, .55fr) minmax(220px, 1.5fr) minmax(150px, .8fr);
  gap: 18px;
}

.bot-restart-table .data-row > span {
  min-width: 0;
  overflow-wrap: anywhere;
}

@media (max-width: 860px) {
  .bot-restart-table .data-head {
    display: none;
  }

  .bot-restart-table .data-row {
    grid-template-columns: 1fr;
    gap: 10px;
  }
}
.custom-bot-pause-action {
  position: relative;
}

.custom-bot-pause-action > summary {
  list-style: none;
  cursor: pointer;
}

.custom-bot-pause-action > summary::-webkit-details-marker {
  display: none;
}

.compact-popover-form {
  position: absolute;
  z-index: 80;
  right: 0;
  top: calc(100% + 8px);
  width: min(320px, 82vw);
  display: grid;
  gap: 12px;
  padding: 16px;
  border: 1px solid rgba(142, 161, 255, .3);
  border-radius: 12px;
  background: #14192b;
  box-shadow: 0 22px 50px rgba(0, 0, 0, .46);
}

.compact-popover-form label {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: .78rem;
  font-weight: 800;
}
.ip-lookup-link {
  width: max-content;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 7px;
  padding: 5px 8px;
  border: 1px solid rgba(34, 211, 238, .2);
  border-radius: 7px;
  color: #9cecf6;
  background: rgba(34, 211, 238, .07);
  font-size: .7rem;
  font-weight: 850;
  text-decoration: none;
}

.ip-lookup-link:hover {
  border-color: rgba(34, 211, 238, .4);
  background: rgba(34, 211, 238, .12);
}

.ip-lookup-link svg {
  width: 14px;
  height: 14px;
}

.site-global-footer {
  width: min(1280px, calc(100% - 40px));
  min-height: 62px;
  margin: 18px auto 0;
  padding: 18px 5px 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  border-top: 1px solid rgba(150, 163, 199, .17);
  color: #858eaa;
  font-size: .76rem;
}

.site-global-footer span:first-child { color: #aab2ce; }
.launch-global-footer { position: relative; z-index: 2; }

@media (max-width: 600px) {
  .site-global-footer {
    width: calc(100% - 24px);
    margin-top: 12px;
    align-items: flex-start;
    font-size: .7rem;
  }
}

.maintenance-progress-editor {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.maintenance-progress-editor article {
  display: grid;
  align-content: start;
  gap: 12px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(255, 255, 255, .025);
}

.maintenance-progress-editor article > strong { color: var(--primary-strong); }

@media (max-width: 900px) {
  .maintenance-progress-editor { grid-template-columns: 1fr; }
}

/* Événements spéciaux occasionnels */
.special-event-banner {
  width: min(1380px, calc(100% - 32px));
  margin: 14px auto 0;
  padding: 13px 16px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 14px;
  border: 1px solid color-mix(in srgb, var(--event-accent) 48%, transparent);
  border-radius: 16px;
  background: linear-gradient(110deg, color-mix(in srgb, var(--event-accent) 16%, #141a31), rgba(10, 15, 29, .97));
  box-shadow: 0 14px 38px color-mix(in srgb, var(--event-accent) 12%, transparent);
}
.special-event-banner-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 12px; color: var(--event-accent); background: color-mix(in srgb, var(--event-accent) 16%, transparent); }
.special-event-banner > span:nth-child(2) { display: grid; gap: 2px; }
.special-event-banner small { color: color-mix(in srgb, var(--event-accent) 60%, #fff); font-size: .67rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.special-event-banner time { color: var(--muted); font-size: .75rem; }
.special-event-banner .button { border-color: color-mix(in srgb, var(--event-accent) 50%, transparent); background: color-mix(in srgb, var(--event-accent) 22%, #10162a); }

.special-event-shell { width: min(1320px, calc(100% - 32px)); margin: 0 auto; padding: 48px 0 90px; }
.special-event-hero { position: relative; overflow: hidden; min-height: 590px; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(260px, .55fr); align-items: center; gap: 54px; padding: clamp(34px, 6vw, 78px); border: 1px solid color-mix(in srgb, var(--event-accent) 48%, transparent); border-radius: 30px; background: radial-gradient(circle at 86% 14%, color-mix(in srgb, var(--event-accent) 30%, transparent), transparent 34%), linear-gradient(145deg, color-mix(in srgb, var(--event-accent) 12%, #17203a), #0a1020 74%); box-shadow: 0 35px 100px rgba(0,0,0,.4); }
.special-event-hero::before { content: ""; position: absolute; inset: 0; opacity: .26; pointer-events: none; background-image: linear-gradient(rgba(255,255,255,.03) 1px, transparent 1px), linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px); background-size: 42px 42px; mask-image: linear-gradient(120deg,#000,transparent 70%); }
.special-event-copy, .special-event-dates { position: relative; z-index: 1; }
.special-event-copy h1 { max-width: 850px; margin: 12px 0 17px; font-size: clamp(3rem, 7vw, 6.4rem); line-height: .94; letter-spacing: -.055em; }
.special-event-subtitle { margin: 0; color: color-mix(in srgb, var(--event-accent) 45%, #fff); font-size: clamp(1.15rem, 2vw, 1.5rem); font-weight: 850; }
.special-event-description { max-width: 760px; margin: 20px 0 0; color: #bdc5df; font-size: 1rem; line-height: 1.75; }
.special-event-copy .hero-actions { margin-top: 28px; }
.special-event-copy .button.primary { background: linear-gradient(120deg, var(--event-accent), color-mix(in srgb, var(--event-accent) 65%, #d67cff)); box-shadow: 0 16px 38px color-mix(in srgb, var(--event-accent) 28%, transparent); }
.special-event-orb { position: absolute; z-index: 0; right: 9%; top: 12%; width: 190px; height: 190px; display: grid; place-items: center; border: 1px solid color-mix(in srgb, var(--event-accent) 42%, transparent); border-radius: 50%; color: color-mix(in srgb, var(--event-accent) 70%, #fff); background: color-mix(in srgb, var(--event-accent) 14%, transparent); box-shadow: 0 0 90px color-mix(in srgb, var(--event-accent) 28%, transparent); transform: rotate(-8deg); }
.special-event-orb svg { width: 86px; height: 86px; stroke-width: 1.4; }
.special-event-dates { align-self: end; display: grid; gap: 10px; padding: 18px; border: 1px solid rgba(255,255,255,.1); border-radius: 18px; background: rgba(6,10,22,.62); backdrop-filter: blur(12px); }
.special-event-dates > span:not(.status-pill) { display: grid; gap: 4px; padding: 10px; border-radius: 11px; background: rgba(255,255,255,.035); }
.special-event-dates small { color: var(--muted); font-size: .68rem; text-transform: uppercase; letter-spacing: .07em; }
.special-event-highlights { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; margin-top: 18px; }
.special-event-highlights article { min-height: 125px; display: grid; grid-template-columns: auto auto minmax(0,1fr); align-items: center; gap: 12px; padding: 20px; border: 1px solid color-mix(in srgb, var(--event-accent) 28%, rgba(255,255,255,.08)); border-radius: 17px; background: linear-gradient(135deg,color-mix(in srgb,var(--event-accent) 8%,#151b31),#0c1222); }
.special-event-highlights article > span { color: color-mix(in srgb,var(--event-accent) 55%,#fff); font-size: .7rem; font-weight: 900; }
.special-event-highlights svg { width: 20px; color: var(--event-accent); }
.special-event-admin { border-color: color-mix(in srgb, var(--event-accent) 35%, var(--line)); }
.special-event-page.theme-winter .special-event-hero { background-color: #0c2030; }
.special-event-page.theme-halloween .special-event-hero { background-color: #251208; }
.special-event-page.theme-discord .special-event-hero { background-color: #121632; }

@media (max-width: 900px) { .special-event-hero { grid-template-columns: 1fr; min-height: 650px; }.special-event-dates { width: min(100%,500px); }.special-event-highlights { grid-template-columns: 1fr 1fr; }.special-event-banner { grid-template-columns: auto minmax(0,1fr) auto; }.special-event-banner time { display:none; } }
@media (max-width: 620px) { .special-event-shell { width: calc(100% - 20px); padding-top: 22px; }.special-event-hero { min-height: 620px; padding: 27px 21px; border-radius: 21px; }.special-event-copy h1 { font-size: clamp(2.8rem,15vw,4.5rem); }.special-event-orb { width:130px;height:130px;right:-25px;top:60px;opacity:.55}.special-event-orb svg{width:58px;height:58px}.special-event-highlights{grid-template-columns:1fr}.special-event-banner{width:calc(100% - 20px);grid-template-columns:auto minmax(0,1fr)}.special-event-banner .button{grid-column:1/-1;width:100%}.special-event-copy .button{width:100%} }

/* Présentation partageable TicketHub */
.presentation-shell { width: min(1280px, calc(100% - 32px)); margin: 0 auto; padding: 48px 0 90px; }
.presentation-hero { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(380px, .75fr); align-items: center; gap: clamp(32px, 6vw, 76px); min-height: 590px; padding: clamp(30px, 5vw, 66px); border: 1px solid rgba(111,120,255,.35); border-radius: 28px; background: radial-gradient(circle at 86% 14%,rgba(34,211,238,.13),transparent 34%),linear-gradient(145deg,rgba(27,34,65,.97),rgba(10,15,29,.98)); box-shadow: 0 35px 100px rgba(0,0,0,.35); }
.presentation-hero-copy h1 { max-width: 780px; margin: 13px 0 20px; font-size: clamp(3rem, 6vw, 5.8rem); line-height: .95; letter-spacing: -.055em; }
.presentation-hero-copy h1 span { color: transparent; background: linear-gradient(105deg,#9f93ff,#6e83ff 52%,#43dcf4); background-clip: text; -webkit-background-clip: text; }
.presentation-hero-copy > p { max-width: 680px; margin: 0; color: #b9c2dd; font-size: 1.08rem; line-height: 1.75; }
.presentation-hero-copy .hero-actions { margin-top: 28px; }
.presentation-preview { align-self: center; overflow: hidden; padding: 18px; border: 1px solid rgba(255,255,255,.11); border-radius: 20px; background: #313338; box-shadow: 0 28px 65px rgba(0,0,0,.38); transform: rotate(1.4deg); }
.presentation-preview-top { display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: 10px; margin-bottom: 15px; }
.presentation-preview-top > span:nth-child(2) { display: grid; gap: 2px; }.presentation-preview-top small{color:#b5bac1;font-size:.69rem}.presentation-bot-avatar{width:40px;height:40px;overflow:hidden;border-radius:50%}.presentation-bot-avatar img{width:100%;height:100%;object-fit:cover}
.presentation-discord-embed { padding: 18px; border-left: 5px solid #6978ff; border-radius: 5px; background: #2b2d31; }
.presentation-discord-embed h2 { margin: 8px 0; color:#fff;font-size:1.25rem}.presentation-discord-embed p{margin:0;color:#dbdee1;line-height:1.55}.presentation-discord-embed>div{display:flex;flex-wrap:wrap;gap:7px;margin:17px 0}.presentation-discord-embed>div span{padding:7px 9px;border-radius:5px;color:#dbdee1;background:#1e1f22;font-size:.73rem}.presentation-discord-embed button{padding:9px 13px;border:0;border-radius:4px;color:#fff;background:#248046;font-weight:800;pointer-events:none}
.presentation-benefits { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px;margin:18px 0 70px}.presentation-benefits article{display:flex;align-items:flex-start;gap:15px;padding:20px;border:1px solid rgba(255,255,255,.09);border-radius:17px;background:linear-gradient(145deg,rgba(23,29,53,.96),rgba(10,16,30,.97))}.presentation-benefits article>span{width:43px;height:43px;flex:0 0 auto;display:grid;place-items:center;border-radius:12px;color:#8ea1ff;background:rgba(88,101,242,.14)}.presentation-benefits article>div{display:grid;gap:6px}.presentation-benefits p{margin:0;color:var(--muted);font-size:.86rem;line-height:1.55}
.presentation-how { margin-bottom:70px}.presentation-how .section-title h2,.presentation-share h2{font-size:clamp(1.8rem,4vw,3rem)}.presentation-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px;margin-top:24px}.presentation-steps article{position:relative;min-height:210px;display:flex;flex-direction:column;align-items:flex-start;gap:11px;padding:23px;border:1px solid rgba(255,255,255,.09);border-radius:18px;background:rgba(255,255,255,.025)}.presentation-steps article>span{position:absolute;right:18px;top:15px;color:rgba(142,161,255,.34);font-size:2.2rem;font-weight:950}.presentation-steps svg{width:34px;height:34px;color:#7f8fff}.presentation-steps strong{margin-top:auto;font-size:1.05rem}.presentation-steps p{margin:0;color:var(--muted);line-height:1.55}
.presentation-share { display:grid;grid-template-columns:minmax(260px,.6fr) minmax(420px,1fr);align-items:center;gap:40px;padding:clamp(25px,5vw,52px);border:1px solid rgba(111,120,255,.32);border-radius:24px;background:radial-gradient(circle at 4% 0,rgba(88,101,242,.17),transparent 38%),#0c1222}.presentation-share-copy p{color:var(--muted);line-height:1.65}.presentation-message-card{min-width:0;padding:18px;border:1px solid rgba(255,255,255,.1);border-radius:17px;background:#313338}.presentation-message-card pre{max-height:330px;overflow:auto;margin:0;padding:17px;border-radius:10px;color:#e8e9eb;background:#2b2d31;font:500 .87rem/1.6 ui-sans-serif,system-ui,sans-serif;white-space:pre-wrap;overflow-wrap:anywhere}.presentation-message-actions{display:flex;flex-wrap:wrap;gap:9px;margin-top:13px}.presentation-message-actions .is-copied{background:#248046}
@media(max-width:950px){.presentation-hero,.presentation-share{grid-template-columns:1fr}.presentation-preview{width:min(100%,600px);transform:none}.presentation-benefits,.presentation-steps{grid-template-columns:1fr}.presentation-benefits{margin-bottom:45px}}
@media(max-width:600px){.presentation-shell{width:calc(100% - 20px);padding-top:22px}.presentation-hero{min-height:0;padding:26px 20px;border-radius:20px}.presentation-hero-copy h1{font-size:clamp(2.8rem,14vw,4.3rem)}.presentation-hero-copy .button,.presentation-message-actions .button{width:100%}.presentation-preview{padding:12px}.presentation-share{padding:22px 16px}.presentation-message-card{padding:11px}.presentation-benefits{grid-template-columns:1fr}}

/* Documentation publique des commandes Discord */
.commands-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(330px, .55fr);
  gap: clamp(28px, 5vw, 70px);
  align-items: center;
  overflow: hidden;
  background:
    radial-gradient(circle at 88% 16%, rgba(34, 211, 238, .13), transparent 32%),
    linear-gradient(140deg, rgba(88, 101, 242, .15), transparent 54%),
    rgba(10, 15, 29, .92);
}

.commands-hero-copy h1 {
  max-width: 820px;
  margin: 12px 0 18px;
  font-size: clamp(2.5rem, 5.6vw, 5.25rem);
  line-height: .97;
  letter-spacing: -.048em;
}

.commands-hero-copy > p {
  max-width: 750px;
  margin: 0;
  color: #bdc7df;
  font-size: 1.03rem;
  line-height: 1.7;
}

.commands-hero-copy .hero-actions {
  margin-top: 26px;
}

.commands-sync-card {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  gap: 14px;
  align-items: center;
  min-width: 0;
  padding: 20px;
  border: 1px solid rgba(82, 219, 239, .23);
  border-radius: 18px;
  background: rgba(5, 12, 25, .7);
  box-shadow: 0 24px 60px rgba(0, 0, 0, .22);
  backdrop-filter: blur(12px);
}

.commands-sync-icon {
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  color: #cffafe;
  border: 1px solid rgba(34, 211, 238, .3);
  border-radius: 15px;
  background: linear-gradient(135deg, rgba(88, 101, 242, .25), rgba(34, 211, 238, .16));
}

.commands-sync-icon svg {
  width: 24px;
  height: 24px;
}

.commands-sync-card > div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.commands-sync-card small,
.commands-sync-card time {
  color: var(--muted);
  font-weight: 720;
}

.commands-sync-card strong {
  color: #f4f7ff;
  font-size: 1.06rem;
}

.commands-sync-card p {
  margin: 4px 0 0;
  color: #aeb9d3;
  font-size: .84rem;
  line-height: 1.5;
}

.commands-sync-card > .status-pill,
.commands-sync-card > time {
  grid-column: 2;
  justify-self: start;
}

.commands-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.commands-summary-grid article {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr);
  gap: 4px 13px;
  align-items: center;
  min-width: 0;
  padding: 18px;
  border: 1px solid rgba(142, 161, 255, .16);
  border-radius: 15px;
  background: linear-gradient(140deg, rgba(88, 101, 242, .08), rgba(255, 255, 255, .025));
}

.commands-summary-grid article > span {
  grid-row: 1 / 3;
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  color: #aab7ff;
  border-radius: 13px;
  background: rgba(88, 101, 242, .13);
}

.commands-summary-grid article > strong {
  color: #fff;
  font-size: 1.65rem;
  line-height: 1;
}

.commands-summary-grid article > small {
  color: var(--muted);
  font-weight: 760;
}

.commands-browser {
  display: grid;
  gap: 24px;
}

.commands-browser-heading {
  max-width: 880px;
}

.commands-toolbar {
  display: grid;
  grid-template-columns: minmax(280px, .85fr) minmax(0, 1.5fr) auto;
  gap: 14px;
  align-items: end;
  padding: 17px;
  border: 1px solid rgba(142, 161, 255, .17);
  border-radius: 16px;
  background: rgba(8, 12, 25, .78);
}

.commands-search {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.commands-search > span {
  display: inline-flex;
  gap: 7px;
  align-items: center;
  color: #e8ecff;
  font-weight: 850;
}

.commands-search > span svg {
  width: 17px;
}

.commands-category-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.commands-category-filters button {
  display: inline-flex;
  gap: 7px;
  align-items: center;
  min-height: 42px;
  padding: 8px 11px;
  color: #b9c3db;
  font: inherit;
  font-size: .82rem;
  font-weight: 820;
  cursor: pointer;
  border: 1px solid rgba(142, 161, 255, .15);
  border-radius: 10px;
  background: rgba(255, 255, 255, .035);
  transition: border-color .16s ease, color .16s ease, background .16s ease;
}

.commands-category-filters button:hover,
.commands-category-filters button.is-active {
  color: #fff;
  border-color: rgba(124, 140, 255, .42);
  background: rgba(88, 101, 242, .18);
}

.commands-category-filters button svg {
  width: 16px;
  height: 16px;
}

.commands-category-filters button small {
  display: grid;
  place-items: center;
  min-width: 22px;
  height: 22px;
  padding: 0 5px;
  color: #cdd5ff;
  border-radius: 7px;
  background: rgba(255, 255, 255, .075);
}

.commands-result-count {
  align-self: center;
  color: var(--muted);
  font-size: .83rem;
  white-space: nowrap;
}

.commands-result-count strong {
  color: #f1f4ff;
}

.commands-category-list {
  display: grid;
  gap: 34px;
}

.commands-category {
  display: grid;
  gap: 17px;
}

.commands-category[hidden],
.command-card[hidden] {
  display: none !important;
}

.commands-category-heading {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr);
  gap: 14px;
  align-items: center;
}

.commands-category-heading > span {
  display: grid;
  place-items: center;
  width: 54px;
  height: 54px;
  color: #c5ceff;
  border: 1px solid rgba(124, 140, 255, .24);
  border-radius: 15px;
  background: linear-gradient(135deg, rgba(88, 101, 242, .2), rgba(34, 211, 238, .08));
}

.commands-category-heading > div {
  display: grid;
  gap: 2px;
}

.commands-category-heading small {
  color: #8fa0c7;
  font-size: .68rem;
  font-weight: 900;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.commands-category-heading h2,
.commands-category-heading p {
  margin: 0;
}

.commands-category-heading h2 {
  font-size: 1.55rem;
}

.commands-category-heading p {
  color: var(--muted);
}

.command-card-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  align-items: start;
}

.command-card {
  display: grid;
  gap: 15px;
  min-width: 0;
  padding: clamp(17px, 2vw, 22px);
  overflow: hidden;
  border: 1px solid rgba(142, 161, 255, .15);
  border-radius: 16px;
  background:
    linear-gradient(135deg, rgba(88, 101, 242, .08), transparent 46%),
    rgba(8, 12, 25, .7);
}

.commands-browser.is-filtered .commands-category-heading {
  display: none;
}

.command-card:has(.command-details[open]) {
  grid-column: 1 / -1;
  border-color: rgba(124, 140, 255, .32);
}

.command-card-head {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
}

.command-slash {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  color: #fff;
  font: 950 1.45rem/1 ui-monospace, SFMono-Regular, Consolas, monospace;
  border: 1px solid rgba(124, 140, 255, .35);
  border-radius: 12px;
  background: linear-gradient(135deg, #5865f2, #8b5cf6);
  box-shadow: 0 12px 26px rgba(88, 101, 242, .18);
}

.command-card-head > div {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.command-card-head h3,
.command-card-head p {
  margin: 0;
}

.command-card-head h3 {
  color: #fff;
  font: 900 1.2rem/1.15 ui-monospace, SFMono-Regular, Consolas, monospace;
  overflow-wrap: anywhere;
}

.command-card-head p {
  color: #b7c1d9;
  font-size: .86rem;
  line-height: 1.45;
}

.command-quick-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}

.command-quick-meta > span {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 2px 8px;
  align-items: center;
  min-width: 0;
  padding: 11px;
  border: 1px solid rgba(142, 161, 255, .11);
  border-radius: 9px;
  background: rgba(255, 255, 255, .025);
}

.command-quick-meta svg {
  grid-row: 1 / 3;
  width: 17px;
  color: #8f9fff;
}

.command-quick-meta small {
  color: var(--muted);
  font-size: .68rem;
  font-weight: 760;
}

.command-quick-meta strong {
  color: #e8edff;
  font-size: .8rem;
  overflow-wrap: anywhere;
}

.command-aliases,
.command-syntax-list {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
}

.command-aliases > small,
.command-syntax-list > small {
  flex: 0 0 100%;
  color: var(--muted);
  font-size: .69rem;
  font-weight: 900;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.command-aliases code,
.command-syntax-list code,
.command-subcommands code {
  display: inline-block;
  max-width: 100%;
  padding: 6px 9px;
  color: #dbe2ff;
  font: 750 .8rem/1.35 ui-monospace, SFMono-Regular, Consolas, monospace;
  overflow-wrap: anywhere;
  white-space: normal;
  border: 1px solid rgba(124, 140, 255, .17);
  border-radius: 8px;
  background: rgba(88, 101, 242, .11);
}

.command-aliases > span {
  color: #9da8c2;
  font-size: .79rem;
}

.command-details {
  border-top: 1px solid rgba(142, 161, 255, .12);
}

.command-details > summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto 20px;
  gap: 10px;
  align-items: center;
  min-height: 48px;
  padding-top: 11px;
  color: #dfe5fa;
  font-weight: 840;
  cursor: pointer;
  list-style: none;
}

.command-details > summary::-webkit-details-marker {
  display: none;
}

.command-details > summary > span {
  display: inline-flex;
  gap: 8px;
  align-items: center;
}

.command-details > summary > span svg,
.command-details > summary > svg {
  width: 18px;
  height: 18px;
}

.command-details > summary > small {
  color: var(--muted);
  font-weight: 720;
}

.command-details > summary > svg {
  transition: transform .18s ease;
}

.command-details[open] > summary > svg {
  transform: rotate(180deg);
}

.command-details-body {
  display: grid;
  gap: 18px;
  padding-top: 10px;
}

.command-subcommands,
.command-options {
  display: grid;
  gap: 10px;
}

.command-subcommands h4,
.command-options h4 {
  margin: 0;
  color: #fff;
}

.command-subcommands > div {
  display: grid;
  grid-template-columns: minmax(210px, .65fr) minmax(0, 1.35fr);
  gap: 12px;
  align-items: center;
  padding: 11px;
  border: 1px solid rgba(142, 161, 255, .1);
  border-radius: 9px;
  background: rgba(255, 255, 255, .023);
}

.command-subcommands > div > span {
  display: grid;
  gap: 3px;
}

.command-subcommands strong {
  color: #e7ecff;
}

.command-subcommands small {
  color: var(--muted);
}

.command-option-table {
  min-width: 0;
  overflow-x: auto;
  border: 1px solid rgba(142, 161, 255, .12);
  border-radius: 10px;
}

.command-option-head,
.command-option-row {
  display: grid;
  grid-template-columns: minmax(150px, .7fr) minmax(120px, .5fr) minmax(260px, 1.5fr) minmax(105px, .45fr);
  gap: 12px;
  align-items: center;
  min-width: 760px;
  padding: 11px 13px;
}

.command-option-head {
  color: #cdd5ef;
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .04em;
  text-transform: uppercase;
  background: rgba(88, 101, 242, .1);
}

.command-option-row {
  border-top: 1px solid rgba(142, 161, 255, .09);
}

.command-option-row > span {
  display: grid;
  gap: 3px;
  min-width: 0;
  color: #c1cae0;
  font-size: .8rem;
}

.command-option-row code {
  color: #eef1ff;
  font-weight: 850;
}

.command-option-row em,
.command-option-row small {
  color: var(--muted);
  font-size: .7rem;
  font-style: normal;
}

.command-option-row strong {
  color: #e8ecfa;
  font-weight: 740;
  line-height: 1.42;
}

.command-option-required {
  display: inline-flex !important;
  justify-self: start;
  width: auto;
  padding: 5px 7px;
  color: #b9c3da !important;
  font-size: .67rem !important;
  font-weight: 900;
  border-radius: 7px;
  background: rgba(255, 255, 255, .05);
}

.command-option-required.is-required {
  color: #ffe7c2 !important;
  background: rgba(251, 146, 60, .13);
}

.command-no-options {
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 12px;
  border: 1px solid rgba(52, 211, 153, .16);
  border-radius: 9px;
  background: rgba(16, 185, 129, .06);
}

.command-no-options > svg {
  width: 21px;
  color: #6ee7b7;
}

.command-no-options > span {
  display: grid;
  gap: 2px;
}

.command-no-options strong {
  color: #d6fae3;
}

.command-no-options small {
  color: var(--muted);
}

.commands-empty {
  place-items: center;
  min-height: 250px;
  padding: 35px;
  text-align: center;
  border: 1px dashed rgba(142, 161, 255, .22);
  border-radius: 16px;
  background: rgba(255, 255, 255, .02);
}

.commands-empty:not([hidden]) {
  display: grid;
}

.commands-empty svg {
  width: 42px;
  height: 42px;
  color: #8493c9;
}

.commands-empty strong {
  margin-top: 10px;
  color: #f1f4ff;
  font-size: 1.15rem;
}

.commands-empty p {
  margin: 4px 0 0;
  color: var(--muted);
}

.commands-help-banner {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr) auto;
  gap: 16px;
  align-items: center;
  padding: clamp(22px, 3vw, 32px);
  border: 1px solid rgba(34, 211, 238, .2);
  border-radius: 18px;
  background: linear-gradient(110deg, rgba(34, 211, 238, .08), rgba(88, 101, 242, .08));
}

.commands-help-banner > span {
  display: grid;
  place-items: center;
  width: 54px;
  height: 54px;
  color: #a5f3fc;
  border-radius: 15px;
  background: rgba(34, 211, 238, .1);
}

.commands-help-banner h2,
.commands-help-banner p {
  margin: 3px 0 0;
}

.commands-help-banner p {
  color: var(--muted);
}

@media (max-width: 1120px) {
  .commands-hero {
    grid-template-columns: minmax(0, 1fr);
  }
  .commands-sync-card {
    width: min(100%, 680px);
  }
  .commands-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .commands-toolbar {
    grid-template-columns: minmax(0, 1fr);
  }
  .commands-result-count {
    justify-self: start;
  }
  .command-card-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 720px) {
  .commands-summary-grid,
  .command-quick-meta,
  .command-card-head,
  .command-subcommands > div,
  .commands-help-banner {
    grid-template-columns: minmax(0, 1fr);
  }
  .command-card-head > .status-pill {
    justify-self: start;
  }
  .command-details > summary {
    grid-template-columns: minmax(0, 1fr) 20px;
  }
  .command-details > summary > small {
    grid-column: 1;
    grid-row: 2;
  }
  .command-details > summary > svg {
    grid-column: 2;
    grid-row: 1 / 3;
  }
  .commands-help-banner > .button {
    width: 100%;
    justify-content: center;
  }
}

@media (max-width: 520px) {
  .commands-summary-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .commands-category-filters button {
    flex: 1 1 145px;
    justify-content: center;
  }
  .commands-category-heading {
    grid-template-columns: 46px minmax(0, 1fr);
  }
  .commands-category-heading > span {
    width: 46px;
    height: 46px;
  }
  .commands-hero-copy .button {
    width: 100%;
  }
}

.command-visibility-form {
  display: grid;
  gap: 18px;
}

.command-visibility-toolbar {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) auto;
  gap: 16px;
  align-items: end;
}

.command-visibility-toolbar label {
  display: grid;
  gap: 8px;
}

.command-visibility-toolbar label > span {
  color: var(--muted);
  font-size: .82rem;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.command-visibility-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  max-height: 520px;
  overflow-y: auto;
  padding: 4px 8px 4px 4px;
  scrollbar-color: rgba(124, 108, 255, .7) rgba(8, 12, 27, .35);
  scrollbar-width: thin;
}

.command-visibility-item {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  min-width: 0;
  padding: 14px;
  border: 1px solid rgba(105, 123, 187, .3);
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(20, 27, 52, .9), rgba(13, 19, 38, .84));
  cursor: pointer;
  transition: border-color .18s ease, background .18s ease, opacity .18s ease, transform .18s ease;
}

.command-visibility-item[hidden] {
  display: none;
}

.command-visibility-item:hover {
  transform: translateY(-1px);
  border-color: rgba(124, 108, 255, .65);
}

.command-visibility-item.is-command-hidden {
  opacity: .66;
  background: rgba(10, 15, 30, .68);
}

.command-visibility-item > input {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  opacity: 0;
  pointer-events: none;
}

.command-visibility-switch {
  position: relative;
  width: 42px;
  height: 24px;
  border: 1px solid rgba(119, 135, 188, .5);
  border-radius: 999px;
  background: rgba(7, 11, 24, .72);
  transition: .18s ease;
}

.command-visibility-switch::after {
  content: '';
  position: absolute;
  top: 3px;
  left: 3px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #aab4d4;
  transition: .18s ease;
}

.command-visibility-item > input:checked + .command-visibility-switch {
  border-color: rgba(82, 237, 190, .72);
  background: rgba(35, 192, 142, .24);
}

.command-visibility-item > input:checked + .command-visibility-switch::after {
  transform: translateX(18px);
  background: #64f5c4;
  box-shadow: 0 0 14px rgba(82, 237, 190, .55);
}

.command-visibility-item > input:focus-visible + .command-visibility-switch {
  outline: 3px solid rgba(75, 197, 255, .3);
  outline-offset: 3px;
}

.command-visibility-copy {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.command-visibility-copy strong {
  color: var(--text);
  font-size: 1rem;
}

.command-visibility-copy small {
  overflow: hidden;
  color: var(--muted);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.command-visibility-category {
  padding: 5px 8px;
  border: 1px solid rgba(101, 124, 194, .32);
  border-radius: 999px;
  color: #c8d2f3;
  font-size: .72rem;
  font-weight: 800;
  white-space: nowrap;
}

.command-visibility-footer {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
  padding-top: 16px;
  border-top: 1px solid rgba(103, 121, 180, .24);
}

.command-visibility-footer p {
  margin: 0;
  color: var(--muted);
}

.command-visibility-footer strong {
  color: var(--text);
}

@media (max-width: 900px) {
  .command-visibility-toolbar,
  .command-visibility-list {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 620px) {
  .command-visibility-toolbar .row-actions,
  .command-visibility-footer {
    align-items: stretch;
    flex-direction: column;
  }

  .command-visibility-toolbar .button,
  .command-visibility-footer .button {
    width: 100%;
    justify-content: center;
  }

  .command-visibility-item {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .command-visibility-category {
    grid-column: 2;
    justify-self: start;
  }
}

/* Recruitment admin list tweaks */
.recruitment-category-row {
  grid-template-columns: 48px minmax(0, 1.55fr) auto minmax(0, 1fr) auto;
  align-items: center;
}

.recruitment-category-copy {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.recruitment-category-copy strong,
.recruitment-category-copy small {
  overflow-wrap: normal;
  word-break: normal;
}

.recruitment-category-copy strong {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.recruitment-category-copy small {
  color: var(--muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.recruitment-category-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  min-width: 0;
}

.recruitment-category-stats > span {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 6px 10px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.035);
  color: var(--text);
  font-weight: 800;
  white-space: nowrap;
}

.recruitment-category-row .row-actions {
  justify-self: end;
}

@media (max-width: 1100px) {
  .recruitment-category-row {
    grid-template-columns: 48px minmax(0, 1fr);
  }

  .recruitment-category-row > .status-pill,
  .recruitment-category-stats,
  .recruitment-category-row > .row-actions {
    grid-column: 1 / -1;
    justify-self: start;
  }
}
.recruitment-focus-panel {
  display: grid;
  gap: 16px;
}

.recruitment-insight-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.recruitment-insight-grid article {
  display: grid;
  gap: 8px;
  padding: 16px;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.03);
}

.recruitment-insight-grid article strong {
  color: var(--text);
  font-size: 1rem;
}

.recruitment-insight-grid article p {
  color: var(--muted);
  line-height: 1.55;
  margin: 0;
}

.recruitment-form-grid label small {
  color: var(--muted);
  line-height: 1.45;
}

.recruitment-form-grid label.wide-field {
  grid-column: 1 / -1;
}

.recruitment-form-grid label textarea {
  min-height: 152px;
}

.recruitment-form-grid label.wide-field textarea {
  min-height: 176px;
}

.recruitment-form-note {
  display: grid;
  gap: 6px;
  padding: 16px;
  border: 1px solid rgba(88, 101, 242, 0.24);
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(88, 101, 242, 0.14), rgba(255, 255, 255, 0.03));
}

.recruitment-form-note strong {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.recruitment-form-note p {
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}

.recruitment-admin-overview {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
  gap: 22px;
  padding: clamp(22px, 3vw, 32px);
  border: 1px solid rgba(88, 101, 242, 0.24);
  border-radius: 26px;
  background:
    radial-gradient(circle at top right, rgba(88, 101, 242, 0.16), transparent 28%),
    linear-gradient(145deg, rgba(17, 23, 43, 0.98), rgba(10, 15, 28, 0.96));
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.24);
}

.recruitment-admin-overview-copy {
  display: grid;
  gap: 14px;
  align-content: start;
}

.recruitment-admin-overview-copy h2 {
  margin: 0;
  font-size: clamp(1.7rem, 3vw, 2.8rem);
  line-height: 1.05;
}

.recruitment-admin-overview-copy p {
  max-width: 68ch;
  margin: 0;
  color: var(--muted);
  line-height: 1.7;
}

.recruitment-admin-inline-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.recruitment-admin-overview-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.recruitment-admin-overview-grid article {
  display: grid;
  gap: 8px;
  padding: 18px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.03);
}

.recruitment-admin-overview-grid strong {
  color: var(--text);
  font-size: 1.9rem;
  line-height: 1;
}

.recruitment-admin-overview-grid small {
  color: var(--muted);
  line-height: 1.45;
}

.recruitment-admin-tip {
  display: grid;
  gap: 8px;
  padding: 16px 18px;
  border: 1px solid rgba(59, 130, 246, 0.22);
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(59, 130, 246, 0.12), rgba(255, 255, 255, 0.03));
}

.recruitment-admin-tip strong {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--text);
}

.recruitment-admin-tip p {
  margin: 0;
  color: var(--muted);
  line-height: 1.6;
}

.recruitment-admin-page .stat-grid article {
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 18px;
  background: linear-gradient(145deg, rgba(22, 29, 50, 0.95), rgba(11, 17, 32, 0.97));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

.recruitment-admin-page .recruitment-category-row,
.recruitment-admin-page .recruitment-admin-application-row {
  background: linear-gradient(145deg, rgba(21, 28, 49, 0.96), rgba(10, 14, 26, 0.96));
  border-left: 4px solid rgba(88, 101, 242, 0.5);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

.recruitment-admin-page .recruitment-admin-application-row.active {
  border-color: rgba(88, 101, 242, 0.56);
  background: rgba(88, 101, 242, 0.13);
}

.recruitment-admin-page .recruitment-admin-toolbar label small {
  color: var(--muted);
  line-height: 1.45;
}

@media (max-width: 1180px) {
  .recruitment-admin-overview {
    grid-template-columns: 1fr;
  }

  .recruitment-admin-overview-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .recruitment-admin-overview-grid {
    grid-template-columns: 1fr;
  }

  .recruitment-admin-overview {
    padding: 20px;
  }

  .recruitment-admin-overview-grid strong {
    font-size: 1.55rem;
  }
}

@media (max-width: 1180px) {
  .recruitment-insight-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .recruitment-insight-grid {
    grid-template-columns: 1fr;
  }
}

/* Recruitment page polish */
.recruitment-page .recruitment-focus-panel {padding: clamp(24px, 4vw, 34px);border: 1px solid rgba(124, 108, 255, 0.28);border-radius: 24px;background: radial-gradient(circle at top right, rgba(124, 108, 255, 0.16), transparent 30%), linear-gradient(145deg, rgba(18, 24, 44, 0.98), rgba(10, 16, 31, 0.97));box-shadow: 0 28px 70px rgba(0, 0, 0, 0.28);display:grid;gap:18px;}
.recruitment-page .recruitment-focus-panel .section-title {padding-bottom: 14px;border-bottom: 1px solid rgba(255, 255, 255, 0.08);}
.recruitment-page .recruitment-focus-panel .row-actions {justify-content:flex-start;flex-wrap:wrap;}
.recruitment-page .recruitment-insight-grid {grid-template-columns: repeat(4, minmax(0, 1fr));gap: 14px;}
.recruitment-page .recruitment-insight-grid article {min-height: 158px;padding: 18px;border: 1px solid rgba(255, 255, 255, 0.08);border-left: 4px solid rgba(124, 108, 255, 0.72);border-radius: 18px;background: linear-gradient(160deg, rgba(124, 108, 255, 0.08), rgba(255, 255, 255, 0.02));box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);}
.recruitment-page .recruitment-insight-grid article strong {font-size: 1.02rem;line-height: 1.3;}
.recruitment-page .recruitment-insight-grid article p {font-size: 0.95rem;}
.recruitment-page .recruitment-form-grid label {padding: 16px;border: 1px solid rgba(255, 255, 255, 0.08);border-radius: 16px;background: rgba(255, 255, 255, 0.03);box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.02);}
.recruitment-page .recruitment-form-grid label select,.recruitment-page .recruitment-form-grid label textarea {margin-top: 2px;}
.recruitment-page .recruitment-form-grid label textarea {min-height: 148px;}
.recruitment-page .recruitment-form-grid label.wide-field textarea {min-height: 176px;}
.recruitment-page .recruitment-questionnaire {padding: 20px;border: 1px solid rgba(255, 255, 255, 0.08);border-radius: 18px;background: rgba(255, 255, 255, 0.025);}
.recruitment-page .recruitment-questionnaire .section-title {padding-bottom: 0;border-bottom: 0;}
.recruitment-page .recruitment-question-list label {padding: 15px;border: 1px solid rgba(255, 255, 255, 0.08);border-radius: 16px;background: rgba(255, 255, 255, 0.025);}
.recruitment-page .recruitment-form-note {padding: 18px;border: 1px solid rgba(88, 101, 242, 0.24);border-left: 4px solid #5865f2;border-radius: 18px;background: linear-gradient(135deg, rgba(88, 101, 242, 0.16), rgba(255, 255, 255, 0.03));}
.recruitment-page .recruitment-form-note strong {color: #eef2ff;}
.recruitment-page .recruitment-form-note p {color: var(--muted);}
@media (max-width: 1180px) {.recruitment-page .recruitment-insight-grid {grid-template-columns: repeat(2, minmax(0, 1fr));}}
@media (max-width: 760px) {.recruitment-page .recruitment-focus-panel {padding: 20px;}.recruitment-page .recruitment-insight-grid {grid-template-columns: 1fr;}.recruitment-page .recruitment-form-grid label,.recruitment-page .recruitment-question-list label {padding: 14px;}.recruitment-page .recruitment-form-note {padding: 16px;}}

/* Recruitment workspaces: clear hierarchy without compressed columns. */
.recruitment-application-layout {
  grid-template-columns: minmax(0, 1.32fr) minmax(340px, 0.88fr);
  gap: 20px;
}

.recruitment-admin-toolbar {
  grid-template-columns: minmax(240px, 1.35fr) minmax(150px, 0.7fr) minmax(170px, 0.78fr) minmax(150px, 0.68fr) auto;
  gap: 12px;
  padding: 16px;
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 18px;
  background: rgba(4, 8, 18, 0.3);
}

.recruitment-tabs a {
  white-space: nowrap;
}

.recruitment-tabs a > span {
  display: inline-grid;
  min-width: 22px;
  min-height: 22px;
  place-items: center;
  padding: 0 6px;
  border-radius: 999px;
  color: var(--muted);
  background: rgba(255, 255, 255, 0.08);
  font-size: 0.72rem;
  font-weight: 900;
  line-height: 1;
  overflow-wrap: normal;
}

.recruitment-tabs a.active > span {
  color: #eef0ff;
  background: rgba(112, 124, 255, 0.28);
}

.recruitment-admin-application-list {
  gap: 12px;
}

.recruitment-admin-application-row {
  grid-template-columns: 44px minmax(0, 1fr) auto;
  gap: 12px;
  min-width: 0;
  padding: 14px;
  text-decoration: none;
}

.recruitment-admin-application-row > span,
.recruitment-admin-application-row strong,
.recruitment-admin-application-row small {
  min-width: 0;
  overflow-wrap: normal;
  word-break: normal;
}

.recruitment-admin-application-row .status-pill {
  align-self: start;
  white-space: nowrap;
}

.recruitment-admin-application-copy {
  display: grid;
  min-width: 0;
  gap: 8px;
}

.recruitment-admin-application-title {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.recruitment-admin-application-title strong,
.recruitment-admin-application-title small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.recruitment-admin-application-title strong {
  color: var(--text);
  font-size: 0.98rem;
}

.recruitment-admin-application-title small {
  color: var(--muted);
}

.recruitment-admin-application-meta {
  display: flex;
  min-width: 0;
  flex-wrap: wrap;
  gap: 6px;
}

.recruitment-admin-application-meta > span {
  display: inline-flex;
  min-width: 0;
  max-width: 100%;
  align-items: center;
  gap: 5px;
  min-height: 26px;
  padding: 4px 8px;
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 999px;
  color: var(--muted);
  background: rgba(255, 255, 255, 0.035);
  font-size: 0.76rem;
  line-height: 1.2;
  overflow-wrap: normal;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.recruitment-admin-application-meta > span i {
  width: 13px;
  height: 13px;
  flex: 0 0 auto;
  color: #9ba8ff;
}

.recruitment-applicant-avatar {
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--recruitment-accent, #5865f2) 62%, #fff 10%);
}

.recruitment-applicant-avatar img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.recruitment-page .recruitment-category-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 270px), 1fr));
  gap: 16px;
}

.recruitment-page .recruitment-category-card {
  min-height: 238px;
  padding: 20px;
  gap: 16px;
}

.recruitment-page .recruitment-category-card > p {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.recruitment-page .recruitment-category-card .recruitment-meta-box {
  display: none;
}

.recruitment-category-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.recruitment-category-card-meta > span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 30px;
  padding: 5px 9px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 999px;
  color: var(--muted);
  background: rgba(255, 255, 255, 0.035);
  font-size: 0.78rem;
  font-weight: 700;
}

.recruitment-category-card-meta i {
  width: 14px;
  height: 14px;
  color: var(--recruitment-accent, #8e98ff);
}

.recruitment-page .recruitment-category-card footer {
  margin-top: auto;
}

.recruitment-member-spotlight {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(340px, 0.92fr);
  gap: 24px;
  align-items: center;
  padding: clamp(22px, 3vw, 32px);
  overflow: hidden;
  border: 1px solid rgba(104, 119, 255, 0.3);
  border-radius: 24px;
  background:
    radial-gradient(circle at 100% 0%, rgba(105, 117, 255, 0.18), transparent 32%),
    linear-gradient(145deg, rgba(19, 27, 49, 0.98), rgba(9, 14, 27, 0.97));
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.22);
}

.recruitment-member-spotlight-copy {
  display: grid;
  min-width: 0;
  gap: 13px;
}

.recruitment-member-spotlight-copy h2,
.recruitment-member-spotlight-copy p {
  margin: 0;
}

.recruitment-member-spotlight-copy h2 {
  font-size: clamp(1.45rem, 2.4vw, 2.2rem);
  line-height: 1.12;
}

.recruitment-member-spotlight-copy p {
  max-width: 60ch;
  color: var(--muted);
  line-height: 1.65;
}

.recruitment-member-spotlight-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.recruitment-member-spotlight-meta > span:not(.status-pill) {
  display: inline-flex;
  min-width: 0;
  align-items: center;
  gap: 6px;
  min-height: 30px;
  padding: 5px 9px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 999px;
  color: var(--muted);
  background: rgba(255, 255, 255, 0.035);
  font-size: 0.8rem;
}

.recruitment-member-spotlight-meta i {
  width: 14px;
  height: 14px;
  flex: 0 0 auto;
  color: #9ba8ff;
}

.recruitment-member-progress {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.recruitment-member-progress li {
  display: grid;
  min-width: 0;
  gap: 6px;
  min-height: 126px;
  align-content: start;
  padding: 14px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 16px;
  color: var(--muted);
  background: rgba(255, 255, 255, 0.025);
}

.recruitment-member-progress li > span {
  display: grid;
  width: 26px;
  height: 26px;
  place-items: center;
  border-radius: 50%;
  color: #cfd4ff;
  background: rgba(255, 255, 255, 0.08);
  font-size: 0.78rem;
  font-weight: 900;
}

.recruitment-member-progress li strong {
  overflow-wrap: normal;
  color: var(--text);
  font-size: 0.84rem;
}

.recruitment-member-progress li small {
  overflow-wrap: normal;
  color: var(--muted);
  font-size: 0.74rem;
  line-height: 1.35;
}

.recruitment-member-progress li.is-done {
  border-color: rgba(92, 234, 183, 0.28);
  background: linear-gradient(155deg, rgba(42, 194, 137, 0.14), rgba(255, 255, 255, 0.025));
}

.recruitment-member-progress li.is-done > span {
  color: #e6fff5;
  background: rgba(37, 205, 141, 0.42);
}

.recruitment-page .recruitment-insight-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 210px), 1fr));
}

.recruitment-page .split-section.recruitment-form-section {
  grid-template-columns: minmax(0, 1.24fr) minmax(330px, 0.82fr);
  gap: 20px;
}

.recruitment-page .recruitment-form-section > .panel-section {
  min-width: 0;
}

.recruitment-page .recruitment-application-card {
  background: linear-gradient(145deg, rgba(20, 28, 50, 0.96), rgba(9, 14, 27, 0.97));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

@media (max-width: 1320px) {
  .recruitment-application-layout,
  .recruitment-page .split-section.recruitment-form-section {
    grid-template-columns: 1fr;
  }

  .recruitment-admin-toolbar {
    grid-template-columns: minmax(220px, 1fr) minmax(160px, 0.7fr) minmax(160px, 0.7fr) minmax(160px, 0.7fr);
  }

  .recruitment-admin-toolbar .row-actions {
    grid-column: 1 / -1;
  }
}

@media (max-width: 900px) {
  .recruitment-member-spotlight {
    grid-template-columns: 1fr;
  }

  .recruitment-member-progress {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .recruitment-admin-toolbar {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {
  .recruitment-admin-toolbar,
  .recruitment-member-progress {
    grid-template-columns: 1fr;
  }

  .recruitment-admin-application-row {
    grid-template-columns: 42px minmax(0, 1fr);
  }

  .recruitment-admin-application-row .status-pill {
    grid-column: 2;
    justify-self: start;
  }

  .recruitment-admin-application-meta > span {
    max-width: 100%;
  }

  .recruitment-member-spotlight {
    padding: 20px;
  }
}

/* Recruitment administration — dedicated workspace rebuild. */
.recruitment-admin-page {
  --recruitment-admin-accent: #7c82ff;
  --recruitment-admin-accent-soft: rgba(124, 130, 255, 0.16);
  display: grid;
  gap: 22px;
}

.recruitment-admin-page > .recruitment-admin-overview {
  display: none;
}

.recruitment-admin-command-header {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 28px;
  align-items: center;
  overflow: hidden;
  padding: clamp(24px, 3vw, 34px);
  border: 1px solid rgba(124, 130, 255, 0.32);
  border-radius: 24px;
  background:
    radial-gradient(circle at 100% 0, rgba(96, 209, 255, 0.14), transparent 29%),
    radial-gradient(circle at 78% 112%, rgba(135, 92, 255, 0.18), transparent 36%),
    linear-gradient(135deg, rgba(24, 31, 60, 0.98), rgba(9, 14, 28, 0.98));
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.25);
}

.recruitment-admin-command-header::after {
  content: "";
  position: absolute;
  inset: auto -6% -145px auto;
  width: 330px;
  height: 330px;
  border: 1px solid rgba(137, 145, 255, 0.18);
  border-radius: 50%;
  box-shadow: 0 0 0 46px rgba(137, 145, 255, 0.035), 0 0 0 92px rgba(137, 145, 255, 0.025);
  pointer-events: none;
}

.recruitment-admin-command-header > * {
  position: relative;
  z-index: 1;
  min-width: 0;
}

.recruitment-admin-command-header .eyebrow {
  display: inline-flex;
  margin-bottom: 8px;
  color: #83ddff;
}

.recruitment-admin-command-header h1,
.recruitment-admin-command-header p {
  margin: 0;
}

.recruitment-admin-command-header h1 {
  font-size: clamp(2rem, 3.3vw, 3.15rem);
  letter-spacing: -0.045em;
  line-height: 0.98;
}

.recruitment-admin-command-header p {
  max-width: 65ch;
  margin-top: 12px;
  color: #b9c3e5;
  line-height: 1.65;
}

.recruitment-admin-command-actions {
  display: flex;
  max-width: 540px;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
  align-items: center;
}

.recruitment-admin-command-actions .status-pill {
  min-height: 38px;
  padding-inline: 12px;
  border: 1px solid rgba(116, 232, 183, 0.25);
  white-space: nowrap;
}

.recruitment-admin-command-metric {
  display: grid;
  min-width: 104px;
  gap: 2px;
  padding: 10px 12px;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 14px;
  background: rgba(4, 8, 20, 0.36);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.recruitment-admin-command-metric strong {
  color: #f4f6ff;
  font-size: 1.2rem;
  line-height: 1;
}

.recruitment-admin-command-metric small {
  color: #aeb9dc;
  font-size: 0.75rem;
  font-weight: 750;
  line-height: 1.25;
}

.recruitment-admin-command-actions .button {
  min-height: 40px;
  white-space: nowrap;
}

.recruitment-admin-tabs-bar {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 7px;
  overflow-x: auto;
  border: 1px solid rgba(124, 130, 255, 0.2);
  border-radius: 16px;
  background: rgba(8, 12, 25, 0.78);
  scrollbar-width: thin;
}

.recruitment-admin-tabs-bar a {
  display: inline-flex;
  min-width: max-content;
  align-items: center;
  gap: 9px;
  min-height: 42px;
  padding: 8px 14px;
  border: 1px solid transparent;
  border-radius: 11px;
  color: #aeb9d5;
  font-size: 0.9rem;
  font-weight: 850;
  text-decoration: none;
  transition: border-color 160ms ease, background 160ms ease, color 160ms ease, transform 160ms ease;
}

.recruitment-admin-tabs-bar a:hover {
  color: #f5f7ff;
  background: rgba(255, 255, 255, 0.045);
}

.recruitment-admin-tabs-bar a.active {
  color: #f8f9ff;
  border-color: rgba(132, 141, 255, 0.5);
  background: linear-gradient(135deg, rgba(100, 111, 255, 0.38), rgba(65, 183, 255, 0.14));
  box-shadow: 0 8px 22px rgba(77, 89, 240, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.11);
}

.recruitment-admin-tabs-bar i {
  width: 17px;
  height: 17px;
}

.recruitment-admin-tabs-bar em {
  display: inline-grid;
  min-width: 24px;
  min-height: 22px;
  place-items: center;
  padding: 0 6px;
  border-radius: 999px;
  color: #dbe0f7;
  background: rgba(255, 255, 255, 0.1);
  font-size: 0.72rem;
  font-style: normal;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
}

.recruitment-admin-tabs-bar a.active em {
  color: #fff;
  background: rgba(255, 255, 255, 0.17);
}

.recruitment-admin-dossiers,
.recruitment-admin-program-editor,
.recruitment-admin-program-list {
  min-width: 0;
  margin: 0;
  border-color: rgba(122, 137, 211, 0.24);
  border-radius: 22px;
  background:
    linear-gradient(145deg, rgba(24, 31, 55, 0.95), rgba(10, 15, 28, 0.98));
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.035);
}

.recruitment-admin-dossiers {
  display: grid;
  gap: 20px;
  padding: clamp(20px, 2.6vw, 28px);
}

.recruitment-admin-dossiers > .section-title,
.recruitment-admin-program-list > .section-title,
.recruitment-admin-program-editor > .section-title {
  align-items: flex-start;
  margin: 0;
  padding-bottom: 18px;
  border-bottom: 1px solid rgba(171, 183, 230, 0.13);
}

.recruitment-admin-dossiers .section-title h2,
.recruitment-admin-program-list .section-title h2,
.recruitment-admin-program-editor .section-title h2 {
  margin: 0;
  font-size: clamp(1.35rem, 2vw, 1.75rem);
  letter-spacing: -0.025em;
}

.recruitment-admin-dossiers .section-title p,
.recruitment-admin-program-list .section-title p,
.recruitment-admin-program-editor .section-title p {
  margin: 6px 0 0;
  color: var(--muted);
  line-height: 1.55;
}

.recruitment-admin-status-tabs {
  display: flex;
  max-width: 650px;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 7px;
}

.recruitment-admin-status-tabs a {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  gap: 6px;
  padding: 6px 9px;
  border: 1px solid rgba(155, 167, 219, 0.16);
  border-radius: 10px;
  color: #aeb8d6;
  background: rgba(255, 255, 255, 0.025);
  font-size: 0.78rem;
  font-weight: 800;
  text-decoration: none;
  white-space: nowrap;
}

.recruitment-admin-status-tabs a:hover,
.recruitment-admin-status-tabs a.active {
  color: #f5f7ff;
  border-color: rgba(125, 137, 255, 0.47);
  background: rgba(98, 108, 244, 0.18);
}

.recruitment-admin-status-tabs span {
  display: inline-grid;
  min-width: 19px;
  min-height: 19px;
  place-items: center;
  border-radius: 999px;
  color: inherit;
  background: rgba(255, 255, 255, 0.1);
  font-size: 0.67rem;
  line-height: 1;
}

.recruitment-admin-dossier-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 11px;
}

.recruitment-admin-dossier-metrics article {
  position: relative;
  display: grid;
  min-width: 0;
  gap: 5px;
  min-height: 120px;
  align-content: center;
  padding: 16px 17px;
  overflow: hidden;
  border: 1px solid rgba(151, 164, 221, 0.17);
  border-radius: 16px;
  background: linear-gradient(145deg, rgba(117, 126, 255, 0.1), rgba(255, 255, 255, 0.025));
}

.recruitment-admin-dossier-metrics article::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 4px;
  height: 100%;
  background: linear-gradient(#8d96ff, #5ddcff);
}

.recruitment-admin-dossier-metrics article:nth-child(2)::before { background: linear-gradient(#82b4ff, #7783ff); }
.recruitment-admin-dossier-metrics article:nth-child(3)::before { background: linear-gradient(#eab7ff, #9b77ff); }
.recruitment-admin-dossier-metrics article:nth-child(4)::before { background: linear-gradient(#ffd58b, #ff9c66); }

.recruitment-admin-dossier-metrics span,
.recruitment-admin-dossier-metrics small {
  color: var(--muted);
  line-height: 1.35;
}

.recruitment-admin-dossier-metrics span {
  font-size: 0.78rem;
  font-weight: 800;
}

.recruitment-admin-dossier-metrics strong {
  color: #f7f8ff;
  font-size: 1.85rem;
  line-height: 1;
}

.recruitment-admin-dossier-metrics small {
  font-size: 0.78rem;
}

.recruitment-admin-filters {
  display: grid;
  grid-template-columns: minmax(220px, 1.5fr) repeat(3, minmax(132px, 0.74fr)) auto;
  gap: 11px;
  align-items: end;
  padding: 14px;
  border: 1px solid rgba(151, 164, 221, 0.15);
  border-radius: 18px;
  background: rgba(3, 8, 19, 0.34);
}

.recruitment-admin-filters label {
  display: grid;
  min-width: 0;
  gap: 7px;
  color: #dfe4fa;
  font-size: 0.81rem;
  font-weight: 850;
}

.recruitment-admin-filters input,
.recruitment-admin-filters select {
  min-width: 0;
  margin: 0;
}

.recruitment-admin-filters label small {
  min-height: 2.5em;
  color: var(--muted);
  font-size: 0.73rem;
  font-weight: 600;
  line-height: 1.3;
}

.recruitment-admin-filters .row-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: end;
}

.recruitment-admin-filters .button {
  min-height: 42px;
  white-space: nowrap;
}

.recruitment-admin-dossier-workspace {
  display: grid;
  grid-template-columns: minmax(300px, 360px) minmax(0, 1fr);
  gap: 18px;
  align-items: start;
}

.recruitment-admin-dossier-queue,
.recruitment-admin-dossier-detail {
  min-width: 0;
  margin: 0;
  border-color: rgba(151, 164, 221, 0.2);
  border-radius: 18px;
  background: rgba(5, 10, 22, 0.48);
}

.recruitment-admin-dossier-queue {
  order: 1;
  display: grid;
  gap: 14px;
  padding: 16px;
}

.recruitment-admin-dossier-detail {
  order: 2;
  display: grid;
  gap: 18px;
  padding: clamp(18px, 2vw, 24px);
}

.recruitment-admin-dossier-queue > .section-title,
.recruitment-admin-dossier-detail > .section-title {
  align-items: center;
  margin: 0;
  padding-bottom: 13px;
  border-bottom: 1px solid rgba(171, 183, 230, 0.12);
}

.recruitment-admin-dossier-queue .section-title h2,
.recruitment-admin-dossier-detail .section-title h2 {
  margin: 0;
  font-size: 1.08rem;
}

.recruitment-admin-dossier-queue .section-title p,
.recruitment-admin-dossier-detail .section-title p {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 0.84rem;
  line-height: 1.45;
}

.recruitment-admin-dossier-detail > .section-title .status-pill {
  max-width: 100%;
  white-space: nowrap;
}

.recruitment-admin-candidate-list {
  display: grid;
  gap: 9px;
}

.recruitment-admin-candidate {
  display: grid;
  grid-template-columns: 43px minmax(0, 1fr) auto;
  gap: 11px;
  align-items: start;
  min-width: 0;
  padding: 12px;
  border: 1px solid rgba(151, 164, 221, 0.13);
  border-left: 3px solid rgba(122, 132, 255, 0.5);
  border-radius: 14px;
  color: var(--text);
  background: linear-gradient(145deg, rgba(28, 35, 61, 0.68), rgba(9, 14, 27, 0.82));
  text-decoration: none;
  transition: border-color 160ms ease, background 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.recruitment-admin-candidate:hover {
  border-color: rgba(132, 145, 255, 0.48);
  background: rgba(86, 98, 224, 0.12);
  transform: translateY(-1px);
}

.recruitment-admin-candidate.active {
  border-color: rgba(105, 125, 255, 0.72);
  border-left-color: #7c8cff;
  background: linear-gradient(135deg, rgba(94, 105, 247, 0.24), rgba(26, 36, 74, 0.72));
  box-shadow: 0 10px 24px rgba(45, 53, 178, 0.17), inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.recruitment-admin-candidate,
.recruitment-admin-candidate > span,
.recruitment-admin-candidate strong,
.recruitment-admin-candidate small,
.recruitment-admin-candidate i {
  min-width: 0;
  overflow-wrap: normal;
  word-break: normal;
}

.recruitment-admin-candidate .recruitment-application-mini {
  width: 43px;
  height: 43px;
  border-radius: 13px;
}

.recruitment-admin-application-copy {
  display: grid;
  min-width: 0;
  gap: 8px;
}

.recruitment-admin-application-title {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.recruitment-admin-application-title strong,
.recruitment-admin-application-title small {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.recruitment-admin-application-title strong {
  color: #f3f5ff;
  font-size: 0.92rem;
  line-height: 1.25;
}

.recruitment-admin-application-title small {
  color: #aeb8d5;
  font-size: 0.73rem;
  line-height: 1.25;
}

.recruitment-admin-application-meta {
  display: flex;
  min-width: 0;
  flex-wrap: wrap;
  gap: 5px;
}

.recruitment-admin-application-meta > span {
  display: inline-flex;
  min-width: 0;
  max-width: 100%;
  align-items: center;
  gap: 4px;
  min-height: 24px;
  padding: 3px 7px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 999px;
  color: #aeb8d5;
  background: rgba(255, 255, 255, 0.035);
  font-size: 0.7rem;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.recruitment-admin-application-meta > span i {
  width: 12px;
  height: 12px;
  flex: 0 0 auto;
  color: #9faaff;
}

.recruitment-admin-candidate > .status-pill {
  min-height: 28px;
  align-self: start;
  padding-inline: 8px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  font-size: 0.69rem;
  line-height: 1.1;
  text-align: left;
  white-space: nowrap;
}

.recruitment-admin-dossier-detail .recruitment-application-full {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
}

.recruitment-admin-dossier-detail .recruitment-application-full > div {
  min-width: 0;
  padding: 12px;
  border-color: rgba(151, 164, 221, 0.13);
  border-radius: 13px;
  background: rgba(255, 255, 255, 0.028);
}

.recruitment-admin-dossier-detail .recruitment-application-full strong {
  color: #aeb8d5;
  font-size: 0.7rem;
  letter-spacing: 0.035em;
  text-transform: uppercase;
}

.recruitment-admin-dossier-detail .recruitment-application-full span {
  overflow-wrap: anywhere;
  color: #f0f2fd;
  font-size: 0.84rem;
  font-weight: 750;
  line-height: 1.42;
}

.recruitment-admin-dossier-detail .recruitment-answer-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.recruitment-admin-dossier-detail .recruitment-answer-list > .section-title {
  grid-column: 1 / -1;
  margin: 0;
  padding: 0 0 4px;
}

.recruitment-admin-dossier-detail .recruitment-answer-list > div:not(.section-title) {
  min-width: 0;
  min-height: 110px;
  padding: 14px;
  border-color: rgba(151, 164, 221, 0.13);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.027);
}

.recruitment-admin-dossier-detail .recruitment-answer-list strong {
  color: #e8ebff;
  font-size: 0.86rem;
}

.recruitment-admin-dossier-detail .recruitment-answer-list p {
  margin: 0;
  overflow-wrap: anywhere;
  color: #aeb8d5;
  font-size: 0.87rem;
  line-height: 1.62;
}

.recruitment-admin-dossier-detail .recruitment-review-form {
  padding: 18px;
  border: 1px solid rgba(123, 136, 255, 0.25);
  border-radius: 17px;
  background: linear-gradient(140deg, rgba(92, 103, 245, 0.13), rgba(255, 255, 255, 0.027));
}

.recruitment-admin-dossier-detail .recruitment-review-form .recruitment-form-grid {
  gap: 10px;
}

.recruitment-admin-dossier-detail .recruitment-review-form label {
  padding: 11px;
  border: 1px solid rgba(255, 255, 255, 0.075);
  border-radius: 13px;
  background: rgba(5, 9, 22, 0.28);
}

.recruitment-admin-dossier-detail .recruitment-review-form textarea {
  min-height: 118px;
}

.recruitment-admin-dossier-detail .recruitment-review-form .button {
  justify-self: start;
  min-height: 43px;
}

.recruitment-admin-dossier-detail .recruitment-application-history {
  gap: 9px;
  padding-top: 18px;
}

.recruitment-admin-dossier-detail .recruitment-application-history article {
  align-items: start;
  padding: 13px;
  border-color: rgba(151, 164, 221, 0.13);
  border-radius: 13px;
  background: rgba(255, 255, 255, 0.026);
}

.recruitment-admin-dossier-detail .recruitment-application-history article > div {
  display: grid;
  gap: 5px;
}

.recruitment-admin-dossier-detail .recruitment-application-history p {
  margin: 0;
  overflow-wrap: anywhere;
  color: #bac3df;
  line-height: 1.55;
}

.recruitment-admin-dossier-detail .empty-state,
.recruitment-admin-dossier-queue .empty-state {
  min-height: 260px;
  padding: 24px;
  border: 1px dashed rgba(151, 164, 221, 0.22);
  border-radius: 15px;
  background: rgba(255, 255, 255, 0.02);
}

.recruitment-admin-programmes-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 20px;
}

.recruitment-admin-programmes-workspace.has-editor {
  grid-template-columns: minmax(320px, 0.82fr) minmax(0, 1.18fr);
}

.recruitment-admin-program-editor,
.recruitment-admin-program-list {
  display: grid;
  align-content: start;
  gap: 18px;
  padding: clamp(20px, 2.5vw, 28px);
}

.recruitment-admin-program-editor .compact-button,
.recruitment-admin-program-list .compact-button {
  min-height: 39px;
  white-space: nowrap;
}

.recruitment-admin-program-editor .recruitment-admin-tip {
  margin: 0;
  border-color: rgba(92, 201, 255, 0.22);
  background: linear-gradient(135deg, rgba(52, 177, 255, 0.12), rgba(116, 103, 255, 0.08));
}

.recruitment-admin-program-editor .recruitment-admin-form {
  gap: 14px;
}

.recruitment-admin-program-editor .recruitment-form-grid {
  gap: 10px;
}

.recruitment-admin-program-editor .recruitment-form-grid label {
  padding: 11px;
  border: 1px solid rgba(255, 255, 255, 0.075);
  border-radius: 13px;
  background: rgba(4, 8, 19, 0.3);
}

.recruitment-admin-program-editor .recruitment-form-grid textarea {
  min-height: 124px;
}

.recruitment-admin-program-editor .recruitment-form-grid .wide-field textarea {
  min-height: 142px;
}

.recruitment-admin-program-editor .check-label {
  display: flex !important;
  align-items: center;
  gap: 11px;
}

.recruitment-admin-program-editor .check-label input {
  width: 19px;
  height: 19px;
  min-height: 19px;
  flex: 0 0 auto;
}

.recruitment-admin-program-editor .check-label span {
  display: grid;
  gap: 3px;
}

.recruitment-admin-program-editor .check-label small {
  color: var(--muted);
  font-size: 0.76rem;
  line-height: 1.35;
}

.recruitment-admin-program-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 290px), 1fr));
  gap: 13px;
}

.recruitment-admin-program-card {
  display: grid;
  grid-template-columns: 47px minmax(0, 1fr) auto;
  grid-template-areas:
    "icon copy state"
    "icon facts facts"
    "icon actions actions";
  gap: 12px;
  align-items: center;
  min-width: 0;
  padding: 16px;
  overflow: hidden;
  border: 1px solid rgba(151, 164, 221, 0.17);
  border-left: 4px solid var(--recruitment-accent, #7c82ff);
  border-radius: 17px;
  background: linear-gradient(145deg, rgba(34, 41, 70, 0.72), rgba(9, 14, 27, 0.86));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
}

.recruitment-admin-program-card.is-closed {
  border-left-color: rgba(171, 181, 207, 0.46);
  opacity: 0.86;
}

.recruitment-admin-program-card > .recruitment-category-mini { grid-area: icon; }
.recruitment-admin-program-card > .recruitment-category-copy { grid-area: copy; }
.recruitment-admin-program-card > .status-pill { grid-area: state; justify-self: end; }
.recruitment-admin-program-card > .recruitment-category-stats { grid-area: facts; }
.recruitment-admin-program-card > .row-actions { grid-area: actions; }

.recruitment-admin-program-card .recruitment-category-copy {
  display: grid;
  min-width: 0;
  gap: 4px;
}

.recruitment-admin-program-card .recruitment-category-copy strong,
.recruitment-admin-program-card .recruitment-category-copy small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.recruitment-admin-program-card .recruitment-category-copy strong {
  color: #f3f5ff;
  font-size: 0.98rem;
}

.recruitment-admin-program-card .recruitment-category-copy small {
  color: var(--muted);
  font-size: 0.76rem;
}

.recruitment-admin-program-card > .status-pill {
  min-height: 27px;
  padding-inline: 8px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  font-size: 0.69rem;
  white-space: nowrap;
}

.recruitment-admin-program-card .recruitment-category-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.recruitment-admin-program-card .recruitment-category-stats > span {
  display: inline-flex;
  min-height: 27px;
  align-items: center;
  padding: 4px 8px;
  border: 1px solid rgba(255, 255, 255, 0.075);
  border-radius: 999px;
  color: #b8c2de;
  background: rgba(255, 255, 255, 0.03);
  font-size: 0.73rem;
  font-weight: 750;
  line-height: 1.1;
  white-space: nowrap;
}

.recruitment-admin-program-card .row-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding-top: 11px;
  border-top: 1px solid rgba(171, 183, 230, 0.1);
}

.recruitment-admin-program-card .row-actions form {
  display: flex;
}

.recruitment-admin-program-card .row-actions .button {
  min-height: 37px;
  white-space: nowrap;
}

@media (max-width: 1260px) {
  .recruitment-admin-command-header {
    grid-template-columns: 1fr;
  }

  .recruitment-admin-command-actions {
    max-width: none;
    justify-content: flex-start;
  }

  .recruitment-admin-dossier-workspace,
  .recruitment-admin-programmes-workspace.has-editor {
    grid-template-columns: 1fr;
  }

  .recruitment-admin-filters {
    grid-template-columns: minmax(230px, 1.3fr) repeat(2, minmax(150px, 0.75fr));
  }

  .recruitment-admin-filters .row-actions {
    grid-column: 1 / -1;
  }
}

@media (max-width: 880px) {
  .recruitment-admin-dossiers > .section-title,
  .recruitment-admin-program-list > .section-title,
  .recruitment-admin-program-editor > .section-title {
    display: grid;
  }

  .recruitment-admin-status-tabs {
    max-width: none;
    justify-content: flex-start;
  }

  .recruitment-admin-dossier-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .recruitment-admin-filters {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .recruitment-admin-filters label:first-of-type,
  .recruitment-admin-filters .row-actions {
    grid-column: 1 / -1;
  }

  .recruitment-admin-filters label small {
    min-height: auto;
  }

  .recruitment-admin-dossier-detail .recruitment-application-full {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {
  .recruitment-admin-page {
    gap: 16px;
  }

  .recruitment-admin-command-header,
  .recruitment-admin-dossiers,
  .recruitment-admin-program-editor,
  .recruitment-admin-program-list {
    padding: 18px;
    border-radius: 18px;
  }

  .recruitment-admin-command-header h1 {
    font-size: 2rem;
  }

  .recruitment-admin-command-actions,
  .recruitment-admin-command-actions .button {
    width: 100%;
  }

  .recruitment-admin-command-actions .button {
    justify-content: center;
  }

  .recruitment-admin-command-metric {
    flex: 1 1 125px;
  }

  .recruitment-admin-tabs-bar {
    padding: 5px;
  }

  .recruitment-admin-tabs-bar a {
    min-height: 39px;
    padding-inline: 11px;
  }

  .recruitment-admin-dossier-metrics,
  .recruitment-admin-filters,
  .recruitment-admin-dossier-detail .recruitment-application-full,
  .recruitment-admin-dossier-detail .recruitment-answer-list {
    grid-template-columns: 1fr;
  }

  .recruitment-admin-filters .row-actions {
    display: grid;
  }

  .recruitment-admin-filters .button {
    width: 100%;
    justify-content: center;
  }

  .recruitment-admin-dossier-queue,
  .recruitment-admin-dossier-detail {
    padding: 14px;
    border-radius: 15px;
  }

  .recruitment-admin-candidate {
    grid-template-columns: 42px minmax(0, 1fr);
  }

  .recruitment-admin-candidate > .status-pill {
    grid-column: 2;
    justify-self: start;
  }

  .recruitment-admin-dossier-detail .recruitment-answer-list > .section-title {
    grid-column: auto;
  }

  .recruitment-admin-dossier-detail .recruitment-review-form {
    padding: 14px;
  }

  .recruitment-admin-dossier-detail .recruitment-review-form .button {
    width: 100%;
    justify-content: center;
  }

  .recruitment-admin-program-card {
    grid-template-columns: 43px minmax(0, 1fr);
    grid-template-areas:
      "icon copy"
      "icon state"
      "facts facts"
      "actions actions";
  }

  .recruitment-admin-program-card > .status-pill {
    justify-self: start;
  }
}

/* Server suspension: readable server picker instead of the browser datalist. */
.server-suspension-guild-search .member-search-results {
  z-index: 120;
}

.server-suspension-guild-search .member-search-result,
.server-suspension-guild-search .member-search-selection {
  min-width: 0;
}

.server-suspension-guild-search .member-search-result > span,
.server-suspension-guild-search .member-search-selection > span {
  min-width: 0;
}

.server-suspension-guild-search .member-search-result strong,
.server-suspension-guild-search .member-search-result small,
.server-suspension-guild-search .member-search-selection strong,
.server-suspension-guild-search .member-search-selection small {
  display: block;
  min-width: 0;
  overflow: hidden;
  overflow-wrap: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-break: normal;
}

.server-suspension-guild-search .member-search-result strong,
.server-suspension-guild-search .member-search-selection strong {
  color: #f2f4ff;
}

.server-suspension-guild-search .member-search-result small,
.server-suspension-guild-search .member-search-selection small {
  color: #acb7d7;
  font-size: 0.78rem;
}

.server-suspension-guild-search .member-search-result i {
  width: 17px;
  height: 17px;
  flex: 0 0 auto;
  color: #93a0ff;
}

/* Recrutement : champs configurables, pièces jointes et alertes membre. */
.recruitment-admin-field-builder {
  display: grid;
  gap: 16px;
  margin-top: 22px;
  padding: 18px;
  border: 1px solid rgba(111, 129, 255, 0.25);
  border-radius: 16px;
  background: linear-gradient(145deg, rgba(72, 85, 163, 0.16), rgba(8, 13, 28, 0.42));
}

.recruitment-field-guide {
  display: flex;
  align-items: flex-start;
  gap: 11px;
  padding: 13px 14px;
  border: 1px solid rgba(83, 214, 255, 0.2);
  border-radius: 13px;
  background: rgba(33, 96, 146, 0.12);
}

.recruitment-field-guide > i {
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
  color: #79dcff;
}

.recruitment-field-guide > div,
.recruitment-admin-field-copy,
.recruitment-admin-attachment-list li > span {
  min-width: 0;
}

.recruitment-field-guide strong,
.recruitment-admin-field-copy strong {
  display: block;
  color: #f1f4ff;
}

.recruitment-field-guide p,
.recruitment-admin-field-copy p {
  margin: 4px 0 0;
  color: #b6c0df;
  font-size: 0.84rem;
  line-height: 1.48;
}

.recruitment-admin-field-list {
  display: grid;
  gap: 10px;
}

.recruitment-admin-field-card {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 13px;
  border: 1px solid rgba(157, 171, 231, 0.16);
  border-radius: 14px;
  background: rgba(5, 10, 23, 0.38);
}

.recruitment-admin-field-card.is-inactive {
  opacity: 0.64;
}

.recruitment-admin-field-icon,
.recruitment-admin-attachment-icon {
  display: inline-grid;
  width: 42px;
  height: 42px;
  place-items: center;
  flex: 0 0 auto;
  border: 1px solid rgba(115, 133, 255, 0.45);
  border-radius: 12px;
  color: #b7c0ff;
  background: linear-gradient(145deg, rgba(86, 101, 242, 0.29), rgba(42, 58, 136, 0.18));
}

.recruitment-admin-field-copy {
  display: grid;
  gap: 3px;
}

.recruitment-admin-field-copy small,
.recruitment-admin-field-options {
  color: #aab5d7;
  font-size: 0.76rem;
  line-height: 1.4;
}

.recruitment-admin-field-options {
  display: block;
  margin-top: 5px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.recruitment-admin-field-card > .row-actions {
  grid-column: 2 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.recruitment-admin-field-card > .status-pill {
  justify-self: end;
  white-space: nowrap;
}

.recruitment-admin-field-card .row-actions form {
  display: flex;
}

.recruitment-admin-field-empty {
  display: flex;
  align-items: center;
  gap: 13px;
  min-height: 92px;
  padding: 17px;
  border: 1px dashed rgba(155, 169, 232, 0.27);
  border-radius: 14px;
  color: #bcc6e4;
  background: rgba(255, 255, 255, 0.022);
}

.recruitment-admin-field-empty > i {
  width: 26px;
  height: 26px;
  color: #8997ff;
}

.recruitment-admin-field-empty strong {
  display: block;
  color: #f0f3ff;
}

.recruitment-admin-field-empty p {
  margin: 3px 0 0;
  color: #aeb9dc;
  font-size: 0.84rem;
}

.recruitment-admin-field-form {
  display: grid;
  gap: 15px;
  padding: 17px;
  border: 1px solid rgba(126, 145, 255, 0.28);
  border-radius: 15px;
  background: rgba(2, 7, 18, 0.42);
}

.recruitment-admin-field-form .recruitment-form-grid label {
  min-width: 0;
  padding: 10px;
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 11px;
  background: rgba(255, 255, 255, 0.018);
}

.recruitment-admin-field-form .check-label {
  display: flex;
  align-items: center;
  gap: 10px;
}

.recruitment-admin-field-form .check-label input {
  width: 18px;
  height: 18px;
  min-height: 18px;
  flex: 0 0 auto;
}

.recruitment-advanced-questionnaire {
  display: grid;
  gap: 15px;
  margin-top: 18px;
  padding: clamp(15px, 2vw, 21px);
  border: 1px solid rgba(116, 135, 255, 0.25);
  border-radius: 16px;
  background: linear-gradient(150deg, rgba(42, 50, 105, 0.23), rgba(8, 13, 28, 0.45));
}

.recruitment-advanced-questionnaire .section-title {
  margin: 0;
}

.recruitment-dynamic-field-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 13px;
}

.recruitment-dynamic-field {
  display: grid;
  min-width: 0;
  gap: 8px;
  align-content: start;
  padding: 12px;
  border: 1px solid rgba(164, 176, 230, 0.12);
  border-radius: 13px;
  background: rgba(3, 8, 20, 0.32);
  color: #e6eaff;
  font-weight: 730;
}

.recruitment-dynamic-field.wide-field {
  grid-column: 1 / -1;
}

.recruitment-dynamic-field > small,
.recruitment-dynamic-field .recruitment-file-help {
  color: #aab6d8;
  font-size: 0.76rem;
  font-weight: 540;
  line-height: 1.45;
}

.recruitment-dynamic-field textarea {
  min-height: 126px;
}

.recruitment-checkbox-control {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 44px;
  padding: 9px 11px;
  border: 1px solid rgba(145, 159, 224, 0.18);
  border-radius: 10px;
  color: #cbd4ec;
  background: rgba(255, 255, 255, 0.025);
  font-size: 0.85rem;
  font-weight: 600;
}

.recruitment-checkbox-control input,
.recruitment-attachment-remove input {
  width: 17px;
  height: 17px;
  min-height: 17px;
  flex: 0 0 auto;
}

.recruitment-attachment-list,
.recruitment-admin-attachment-list {
  display: grid;
  gap: 8px;
  margin: 2px 0 0;
  padding: 0;
  list-style: none;
}

.recruitment-attachment-list li {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 8px 9px;
  border: 1px solid rgba(139, 156, 227, 0.16);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.026);
}

.recruitment-attachment-list a {
  display: inline-flex;
  min-width: 0;
  align-items: center;
  gap: 6px;
  overflow: hidden;
  color: #c9d0ff;
  font-size: 0.8rem;
  font-weight: 720;
  text-decoration: none;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.recruitment-attachment-list a:hover {
  color: #ffffff;
  text-decoration: underline;
}

.recruitment-attachment-list a > i {
  width: 15px;
  height: 15px;
  flex: 0 0 auto;
}

.recruitment-attachment-list small {
  color: #9da9cc;
  font-size: 0.74rem;
}

.recruitment-attachment-remove {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-left: auto;
  color: #d2d9f1;
  font-size: 0.76rem;
  font-weight: 700;
}

.recruitment-upload-security {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: 0;
  padding: 11px 12px;
  border: 1px solid rgba(240, 192, 89, 0.2);
  border-radius: 11px;
  color: #d9c68e;
  background: rgba(158, 112, 22, 0.1);
  font-size: 0.79rem;
  line-height: 1.45;
}

.recruitment-upload-security > i {
  width: 17px;
  height: 17px;
  flex: 0 0 auto;
}

.recruitment-admin-attachment-section {
  gap: 12px;
}

.recruitment-admin-attachment-list {
  grid-column: 1 / -1;
}

.recruitment-admin-attachment-list li {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  gap: 11px;
  align-items: center;
  padding: 11px;
  border: 1px solid rgba(153, 166, 229, 0.15);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.024);
}

.recruitment-admin-attachment-list strong,
.recruitment-admin-attachment-list small {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.recruitment-admin-attachment-list strong {
  color: #edf0ff;
  font-size: 0.84rem;
}

.recruitment-admin-attachment-list small {
  margin-top: 3px;
  color: #a9b5d6;
  font-size: 0.74rem;
}

.member-sidebar .side-link .member-sidebar-notification {
  width: 8px;
  height: 8px;
  min-width: 8px;
  margin-left: auto;
  border: 1px solid rgba(207, 217, 255, 0.86);
  border-radius: 999px;
  background: #8da0ff;
  box-shadow: 0 0 0 3px rgba(100, 118, 255, 0.16), 0 0 11px rgba(103, 123, 255, 0.86);
}

.member-sidebar .side-link.active .member-sidebar-notification {
  background: #c2ccff;
}

@media (max-width: 720px) {
  .recruitment-dynamic-field-grid {
    grid-template-columns: 1fr;
  }

  .recruitment-dynamic-field.wide-field {
    grid-column: auto;
  }

  .recruitment-admin-field-card {
    grid-template-columns: 40px minmax(0, 1fr);
  }

  .recruitment-admin-field-card > .status-pill,
  .recruitment-admin-field-card > .row-actions {
    grid-column: 1 / -1;
    justify-self: start;
  }

  .recruitment-admin-attachment-list li {
    grid-template-columns: 39px minmax(0, 1fr);
  }

  .recruitment-admin-attachment-list .button {
    grid-column: 1 / -1;
    width: 100%;
    justify-content: center;
  }
}