:root{
  color-scheme:dark;
  --ui-font-sans:"Segoe UI Variable","Segoe UI","Helvetica Neue",Arial,sans-serif;
  --ui-font-display:"Segoe UI Variable","Segoe UI","Helvetica Neue",Arial,sans-serif;
  --ui-font-size-0:.8125rem;
  --ui-font-size-1:.875rem;
  --ui-font-size-2:1rem;
  --ui-font-size-3:1.125rem;
  --ui-font-size-4:1.375rem;
  --ui-font-size-5:1.75rem;
  --ui-font-size-6:2.25rem;
  --ui-line-height-tight:1.1;
  --ui-line-height-base:1.6;
  --ui-space-1:4px;
  --ui-space-2:8px;
  --ui-space-3:12px;
  --ui-space-4:16px;
  --ui-space-5:20px;
  --ui-space-6:24px;
  --ui-space-7:28px;
  --ui-space-8:32px;
  --ui-space-10:40px;
  --ui-space-12:48px;
  --ui-radius-xs:10px;
  --ui-radius-sm:14px;
  --ui-radius-md:18px;
  --ui-radius-lg:24px;
  --ui-radius-xl:30px;
  --ui-radius-pill:999px;
  --ui-bg:#060913;
  --ui-bg-2:#0a1020;
  --ui-bg-3:#10192f;
  --ui-surface:#101827;
  --ui-surface-2:#162033;
  --ui-surface-3:rgba(255,255,255,.04);
  --ui-line:rgba(255,255,255,.09);
  --ui-line-strong:rgba(255,255,255,.16);
  --ui-line-soft:rgba(255,255,255,.05);
  --ui-text:#f7f9ff;
  --ui-text-soft:#e6ebf5;
  --ui-text-muted:#95a3bf;
  --ui-text-faint:#6f7e9a;
  --ui-primary:#ff4d4d;
  --ui-primary-strong:#e23434;
  --ui-primary-soft:rgba(255,77,77,.12);
  --ui-success:#22c55e;
  --ui-warning:#f59e0b;
  --ui-danger:#f43f5e;
  --ui-info:#3b82f6;
  --ui-overlay:rgba(5,10,20,.68);
  --ui-shadow-xs:0 6px 16px rgba(3,7,18,.12);
  --ui-shadow-sm:0 12px 28px rgba(3,7,18,.18);
  --ui-shadow-md:0 20px 48px rgba(3,7,18,.24);
  --ui-shadow-lg:0 32px 76px rgba(2,6,18,.34);
  --ui-focus-ring:0 0 0 4px rgba(255,77,77,.16);
  --ui-z-toast:1700;
  --ui-z-modal:1800;
}

*,
*::before,
*::after{
  box-sizing:border-box;
}

html{
  scroll-behavior:smooth;
}

body{
  margin:0;
  min-height:100vh;
  font-family:var(--ui-font-sans);
  font-size:var(--ui-font-size-2);
  line-height:var(--ui-line-height-base);
  color:var(--ui-text);
  background:var(--ui-bg);
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

a{
  color:inherit;
  text-decoration:none;
}

img{
  max-width:100%;
  display:block;
}

button,
input,
select,
textarea{
  font:inherit;
}

button{
  border:0;
  background:none;
}

::selection{
  background:rgba(255,77,77,.22);
  color:#fff;
}

.ui-hide-visually{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  padding:0 !important;
  margin:-1px !important;
  overflow:hidden !important;
  clip:rect(0, 0, 0, 0) !important;
  white-space:nowrap !important;
  border:0 !important;
}

.ui-container{
  width:min(100%, 1180px);
  margin:0 auto;
}

.ui-stack{
  display:grid;
  gap:var(--ui-space-4);
}

.ui-stack--tight{
  gap:var(--ui-space-3);
}

.ui-stack--loose{
  gap:var(--ui-space-6);
}

.ui-cluster{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:var(--ui-space-3);
}

.ui-cluster--spread{
  justify-content:space-between;
}

.ui-grid{
  display:grid;
  gap:var(--ui-space-4);
}

.ui-grid--2{
  grid-template-columns:repeat(2, minmax(0, 1fr));
}

.ui-section-head{
  display:grid;
  gap:var(--ui-space-2);
}

.ui-title-1,
.ui-title-2,
.ui-title-3,
.ui-body,
.ui-meta,
.ui-kicker{
  margin:0;
}

.ui-title-1,
.ui-title-2,
.ui-title-3{
  font-family:var(--ui-font-display);
  letter-spacing:-.04em;
  color:var(--ui-text);
}

.ui-title-1{
  font-size:clamp(2rem, 4vw, 3rem);
  line-height:var(--ui-line-height-tight);
  font-weight:900;
}

.ui-title-2{
  font-size:clamp(1.4rem, 3vw, 2rem);
  line-height:1.14;
  font-weight:850;
}

.ui-title-3{
  font-size:var(--ui-font-size-3);
  line-height:1.25;
  font-weight:800;
}

.ui-body{
  font-size:var(--ui-font-size-2);
  color:var(--ui-text-soft);
}

.ui-meta{
  font-size:var(--ui-font-size-1);
  line-height:1.55;
  color:var(--ui-text-muted);
}

.ui-kicker{
  display:inline-flex;
  align-items:center;
  gap:var(--ui-space-2);
  width:max-content;
  min-height:34px;
  padding:0 14px;
  border-radius:var(--ui-radius-pill);
  border:1px solid rgba(255,77,77,.18);
  background:rgba(255,77,77,.1);
  color:#ffd8d8;
  font-size:.76rem;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.ui-kicker::before{
  content:"";
  width:8px;
  height:8px;
  border-radius:999px;
  background:var(--ui-primary);
  box-shadow:0 0 0 6px rgba(255,77,77,.12);
}

.ui-card{
  position:relative;
  overflow:hidden;
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02)),
    linear-gradient(180deg, rgba(16,24,39,.96), rgba(9,15,27,.98));
  box-shadow:var(--ui-shadow-md);
  padding:var(--ui-space-6);
}

.ui-card::before{
  content:"";
  position:absolute;
  inset:auto -20% -60% auto;
  width:220px;
  height:220px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(255,77,77,.12), rgba(255,77,77,0) 70%);
  pointer-events:none;
}

.ui-card > *{
  position:relative;
  z-index:1;
}

.ui-card--soft{
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.025)),
    rgba(16,24,39,.88);
}

.ui-card--flat::before{
  display:none;
}

.ui-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height:48px;
  padding:0 18px;
  border:1px solid transparent;
  border-radius:var(--ui-radius-md);
  background:linear-gradient(180deg, var(--ui-primary), var(--ui-primary-strong));
  color:#fff;
  font-size:.96rem;
  font-weight:850;
  line-height:1;
  letter-spacing:.01em;
  text-decoration:none;
  cursor:pointer;
  box-shadow:0 14px 30px rgba(255,77,77,.18);
  transition:transform .16s ease, filter .16s ease, border-color .16s ease, background .16s ease, opacity .16s ease, box-shadow .16s ease;
}

.ui-btn:hover{
  transform:translateY(-1px);
  filter:brightness(1.03);
}

.ui-btn:active{
  transform:translateY(0);
}

.ui-btn:focus-visible{
  outline:none;
  box-shadow:var(--ui-shadow-sm), var(--ui-focus-ring);
}

.ui-btn:disabled,
.ui-btn[aria-disabled="true"]{
  opacity:.58;
  cursor:not-allowed;
  pointer-events:none;
}

.ui-btn--ghost{
  background:rgba(255,255,255,.04);
  border-color:var(--ui-line);
  color:var(--ui-text);
  box-shadow:none;
}

.ui-btn--ghost:hover{
  background:rgba(255,255,255,.07);
  border-color:var(--ui-line-strong);
}

.ui-btn--quiet{
  background:transparent;
  border-color:transparent;
  color:var(--ui-text-muted);
  box-shadow:none;
}

.ui-btn--danger{
  background:linear-gradient(180deg, rgba(244,63,94,.22), rgba(225,29,72,.16));
  border-color:rgba(244,63,94,.22);
  color:#fff1f3;
  box-shadow:none;
}

.ui-btn--wide{
  width:100%;
}

.ui-field{
  display:grid;
  gap:var(--ui-space-2);
}

.ui-label{
  color:var(--ui-text);
  font-size:.92rem;
  font-weight:800;
  letter-spacing:.01em;
}

.ui-help{
  color:var(--ui-text-muted);
  font-size:.88rem;
  line-height:1.55;
}

.ui-input,
.ui-select,
.ui-textarea{
  width:100%;
  min-height:50px;
  padding:13px 15px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:var(--ui-radius-md);
  background:rgba(3,7,18,.38);
  color:var(--ui-text);
  font-size:1rem;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
  transition:border-color .16s ease, box-shadow .16s ease, background .16s ease, transform .16s ease;
}

.ui-input::placeholder,
.ui-textarea::placeholder{
  color:var(--ui-text-faint);
}

.ui-select{
  appearance:none;
  background-image:
    linear-gradient(45deg, transparent 50%, rgba(255,255,255,.72) 50%),
    linear-gradient(135deg, rgba(255,255,255,.72) 50%, transparent 50%);
  background-position:
    calc(100% - 22px) calc(50% - 2px),
    calc(100% - 16px) calc(50% - 2px);
  background-size:6px 6px, 6px 6px;
  background-repeat:no-repeat;
  padding-right:42px;
}

.ui-textarea{
  min-height:128px;
  resize:vertical;
}

.ui-input:focus,
.ui-select:focus,
.ui-textarea:focus{
  outline:none;
  border-color:rgba(255,77,77,.4);
  box-shadow:var(--ui-focus-ring);
  background:rgba(5,10,22,.52);
}

.ui-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:30px;
  padding:0 10px;
  border-radius:var(--ui-radius-pill);
  border:1px solid var(--ui-line);
  background:rgba(255,255,255,.05);
  color:var(--ui-text);
  font-size:.78rem;
  font-weight:850;
  white-space:nowrap;
}

.ui-badge--neutral{
  background:rgba(255,255,255,.06);
  border-color:rgba(255,255,255,.12);
  color:var(--ui-text-soft);
}

.ui-badge--success{
  background:rgba(34,197,94,.14);
  border-color:rgba(34,197,94,.24);
  color:#d9ffe6;
}

.ui-badge--warning{
  background:rgba(245,158,11,.14);
  border-color:rgba(245,158,11,.22);
  color:#ffe8be;
}

.ui-badge--danger{
  background:rgba(244,63,94,.14);
  border-color:rgba(244,63,94,.24);
  color:#ffd8df;
}

.ui-badge--info{
  background:rgba(59,130,246,.14);
  border-color:rgba(59,130,246,.22);
  color:#dbeafe;
}

.ui-alert{
  position:relative;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:start;
  gap:var(--ui-space-3);
  padding:15px 16px;
  border-radius:var(--ui-radius-lg);
  border:1px solid rgba(255,255,255,.1);
  background:linear-gradient(180deg, rgba(13,18,31,.96), rgba(10,14,25,.92));
  color:var(--ui-text);
  box-shadow:0 20px 44px rgba(2,6,23,.22);
  overflow:hidden;
}

.ui-alert::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:4px;
  border-radius:inherit;
  background:rgba(255,255,255,.16);
}

.ui-alert--success{
  border-color:rgba(34,197,94,.24);
  background:linear-gradient(180deg, rgba(6,32,22,.95), rgba(10,20,18,.92));
}

.ui-alert--success::before{ background:linear-gradient(180deg, rgba(34,197,94,.98), rgba(22,163,74,.88)); }

.ui-alert--warning{
  border-color:rgba(245,158,11,.24);
  background:linear-gradient(180deg, rgba(43,28,8,.95), rgba(23,17,10,.92));
}

.ui-alert--warning::before{ background:linear-gradient(180deg, rgba(245,158,11,.98), rgba(217,119,6,.88)); }

.ui-alert--error{
  border-color:rgba(244,63,94,.24);
  background:linear-gradient(180deg, rgba(42,14,24,.96), rgba(23,12,18,.92));
}

.ui-alert--error::before{ background:linear-gradient(180deg, rgba(244,63,94,.98), rgba(225,29,72,.88)); }

.ui-alert--info{
  border-color:rgba(59,130,246,.24);
  background:linear-gradient(180deg, rgba(13,25,47,.96), rgba(10,15,29,.92));
}

.ui-alert--info::before{ background:linear-gradient(180deg, rgba(96,165,250,.98), rgba(59,130,246,.88)); }

.ui-alert__icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:28px;
  height:28px;
  margin-top:1px;
  border-radius:999px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.08);
  color:#fff;
  font-size:.82rem;
  font-weight:900;
}

.ui-alert__body{
  min-width:0;
  display:grid;
  gap:4px;
}

.ui-alert__title{
  display:block;
  font-size:.94rem;
  font-weight:900;
  color:#fff;
}

.ui-alert__message{
  font-size:.94rem;
  line-height:1.55;
  color:inherit;
}

.ui-alert__close{
  width:30px;
  height:30px;
  border:0;
  border-radius:12px;
  background:transparent;
  color:rgba(255,255,255,.8);
  cursor:pointer;
  font-size:1rem;
  line-height:1;
}

.ui-alert__close:hover{
  background:rgba(255,255,255,.08);
  color:#fff;
}

.ui-empty{
  position:relative;
  display:grid;
  gap:var(--ui-space-3);
  justify-items:start;
  padding:clamp(20px, 3vw, 28px);
  border-radius:var(--ui-radius-xl);
  border:1px dashed rgba(255,255,255,.16);
  background:linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.022));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
  overflow:hidden;
}

.ui-empty::after{
  content:"";
  position:absolute;
  inset:auto -20% -40% auto;
  width:180px;
  height:180px;
  border-radius:999px;
  background:radial-gradient(circle, rgba(255,77,77,.1), transparent 68%);
  pointer-events:none;
}

.ui-empty--center{
  justify-items:center;
  text-align:center;
}

.ui-empty__icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:58px;
  height:58px;
  border-radius:20px;
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.04));
  border:1px solid rgba(255,255,255,.12);
  color:var(--ui-text);
  font-size:1.55rem;
  line-height:1;
  box-shadow:0 16px 30px rgba(2,6,23,.18);
}

.ui-empty__title{
  margin:0;
  color:var(--ui-text);
  font-size:clamp(1.16rem, 2vw, var(--ui-font-size-4));
  line-height:1.16;
  font-weight:900;
  letter-spacing:-.02em;
}

.ui-empty__body,
.ui-empty__text{
  margin:0;
  max-width:54ch;
  color:var(--ui-text-muted);
  line-height:1.62;
  font-size:.99rem;
}

.ui-empty__actions{
  display:flex;
  flex-wrap:wrap;
  gap:var(--ui-space-3);
}

.ui-skeleton{
  position:relative;
  overflow:hidden;
  border-radius:var(--ui-radius-md);
  background:rgba(255,255,255,.06);
}

.ui-skeleton::after{
  content:"";
  position:absolute;
  inset:0;
  transform:translateX(-100%);
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.11), transparent);
  animation:uiShimmer 1.5s linear infinite;
}

.ui-busy,
.ui-is-busy{
  pointer-events:none;
  opacity:.72;
}

.ui-toast-stack{
  position:fixed;
  top:max(16px, env(safe-area-inset-top, 0px) + 12px);
  right:16px;
  z-index:var(--ui-z-toast);
  display:grid;
  gap:12px;
  width:min(100vw - 32px, 360px);
  pointer-events:none;
}

.ui-toast{
  pointer-events:auto;
  position:relative;
  display:grid;
  grid-template-columns:1fr auto;
  gap:var(--ui-space-3);
  align-items:start;
  padding:15px 16px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.12);
  background:linear-gradient(180deg, rgba(11,16,28,.985), rgba(8,12,22,.96));
  color:#fff;
  box-shadow:0 22px 54px rgba(2,6,23,.38);
  opacity:0;
  transform:translateY(-8px);
  transition:opacity .18s ease, transform .18s ease;
  overflow:hidden;
}

.ui-toast::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:4px;
  background:rgba(255,255,255,.22);
}

.ui-toast.is-visible{
  opacity:1;
  transform:translateY(0);
}

.ui-toast.is-leaving{
  opacity:0;
  transform:translateY(-6px);
}

.ui-toast--success{ border-color:rgba(34,197,94,.28); }
.ui-toast--success::before{ background:linear-gradient(180deg, rgba(34,197,94,.98), rgba(22,163,74,.88)); }
.ui-toast--warning{ border-color:rgba(245,158,11,.28); }
.ui-toast--warning::before{ background:linear-gradient(180deg, rgba(245,158,11,.98), rgba(217,119,6,.88)); }
.ui-toast--error{ border-color:rgba(244,63,94,.28); }
.ui-toast--error::before{ background:linear-gradient(180deg, rgba(244,63,94,.98), rgba(225,29,72,.88)); }
.ui-toast--info{ border-color:rgba(59,130,246,.28); }
.ui-toast--info::before{ background:linear-gradient(180deg, rgba(96,165,250,.98), rgba(59,130,246,.88)); }

.ui-toast__body{
  min-width:0;
  display:grid;
  gap:4px;
}

.ui-toast__title{
  margin:0;
  font-size:.92rem;
  line-height:1.2;
  font-weight:900;
}

.ui-toast__message{
  margin:0;
  font-size:.92rem;
  line-height:1.52;
  color:#d9e1ef;
}

.ui-toast__close{
  width:28px;
  height:28px;
  border:0;
  border-radius:10px;
  background:rgba(255,255,255,.06);
  color:#fff;
  cursor:pointer;
}

.ui-toast__close:hover{
  background:rgba(255,255,255,.1);
}

.ui-modal-root{
  position:fixed;
  inset:0;
  z-index:var(--ui-z-modal);
  pointer-events:none;
}

.ui-modal-root.is-active{
  pointer-events:auto;
}

.ui-modal-backdrop{
  position:absolute;
  inset:0;
  background:var(--ui-overlay);
  backdrop-filter:blur(8px);
  opacity:0;
  transition:opacity .18s ease;
}

.ui-modal-root.is-active .ui-modal-backdrop{
  opacity:1;
}

.ui-modal{
  position:relative;
  width:min(100vw - 32px, 520px);
  margin:min(12vh, 80px) auto 0;
  padding:20px;
  border-radius:var(--ui-radius-xl);
  border:1px solid var(--ui-line);
  background:linear-gradient(180deg, rgba(17,24,39,.99), rgba(10,15,28,.99));
  box-shadow:var(--ui-shadow-lg);
  color:var(--ui-text);
  transform:translateY(10px);
  opacity:0;
  transition:transform .18s ease, opacity .18s ease;
}

.ui-modal-root.is-active .ui-modal{
  transform:translateY(0);
  opacity:1;
}

.ui-modal__title{
  margin:0;
  font-size:1.2rem;
  line-height:1.2;
  font-weight:900;
}

.ui-modal__body{
  margin-top:10px;
  color:var(--ui-text-muted);
  line-height:1.6;
}

.ui-modal__actions{
  display:flex;
  justify-content:flex-end;
  flex-wrap:wrap;
  gap:var(--ui-space-3);
  margin-top:20px;
}

body.ui-modal-open{
  overflow:hidden;
}

@keyframes uiShimmer{
  100%{
    transform:translateX(100%);
  }
}

@media (prefers-reduced-motion: reduce){
  html{
    scroll-behavior:auto;
  }

  *,
  *::before,
  *::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
    scroll-behavior:auto !important;
  }
}

@media (max-width: 720px){
  .ui-card{
    padding:var(--ui-space-5);
  }

  .ui-grid--2{
    grid-template-columns:1fr;
  }
}

@media (max-width: 640px){
  .ui-toast-stack{
    left:16px;
    right:16px;
    width:auto;
  }

  .ui-modal{
    margin:24px 16px 0;
    width:auto;
  }

  .ui-empty{
    padding:var(--ui-space-5);
  }
}
