/* Общая дизайн-система: приложение для людей и панель админов. */
@font-face{font-family:"Inter";font-style:normal;font-weight:100 900;font-display:swap;
  src:url(/fonts/inter-cyrillic-ext.woff2) format("woff2");unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}
@font-face{font-family:"Inter";font-style:normal;font-weight:100 900;font-display:swap;
  src:url(/fonts/inter-cyrillic.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Inter";font-style:normal;font-weight:100 900;font-display:swap;
  src:url(/fonts/inter-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  color-scheme:light;
  --bg:#f5f2eb; --bg-2:#efebe2; --surface:#ffffff; --surface-2:#faf8f4; --sunken:#ece8df;
  --ink:#16191d; --ink-2:#4a5058; --ink-3:#7c828a; --line:#e6e1d7; --line-2:#d9d3c7;
  /* Medina Media: чёрный + золото */
  --accent:#141414; --accent-hover:#2b2926; --accent-ink:#efbb7c; --accent-soft:#f3e7d6; --accent-soft-ink:#7a4f22;
  --pattern:url(/icons/pattern.svg) 0 0/104px 120px;
  --brand:#a8692c; --brand-2:#efbb7c; --brand-grad:linear-gradient(100deg,#c08a56,#f0b876);
  --gold:#a8692c; --gold-soft:#f6ecdc;
  --danger:#b4321f; --danger-soft:#fbe9e5; --warn:#9a6a00; --warn-soft:#fbf1d7;
  --mine:#1a1918; --mine-ink:#f7ecdd;
  --shadow-1:0 1px 2px rgba(22,25,29,.05),0 1px 1px rgba(22,25,29,.03);
  --shadow-2:0 1px 2px rgba(22,25,29,.05),0 12px 32px -12px rgba(22,25,29,.18);
  --shadow-3:0 24px 64px -16px rgba(22,25,29,.32);
  --r-sm:10px; --r:14px; --r-lg:20px; --r-xl:28px;
  --font:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --ease:cubic-bezier(.2,.7,.2,1);
  --safe-b:env(safe-area-inset-bottom,0px); --safe-t:env(safe-area-inset-top,0px);
}
/* Тёмная тема — по настройке телефона: тёмный фон, золотые кнопки с чёрным текстом */
@media (prefers-color-scheme:dark){
  :root{
    color-scheme:dark;
    --bg:#11100f; --bg-2:#161513; --surface:#1c1a18; --surface-2:#22201d; --sunken:#262320;
    --ink:#f1ece4; --ink-2:#bdb5aa; --ink-3:#8b847a; --line:#2c2925; --line-2:#3a3631;
    --accent:#e7b072; --accent-hover:#f0bf86; --accent-ink:#141210; --accent-soft:#2e2619; --accent-soft-ink:#efc38e;
    --pattern:url(/icons/pattern-dark.svg) 0 0/104px 120px;
    --brand:#e7b072; --brand-2:#c08a56;
    --gold:#e7b072; --gold-soft:#2e2619;
    --danger:#f0715c; --danger-soft:#3a1d18; --warn:#e8b54a; --warn-soft:#2f2612;
    --mine:#2c2722; --mine-ink:#f6ead9;
    --shadow-1:0 1px 2px rgba(0,0,0,.4);
    --shadow-2:0 1px 2px rgba(0,0,0,.4),0 16px 40px -16px rgba(0,0,0,.6);
    --shadow-3:0 24px 64px -16px rgba(0,0,0,.7);
  }
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
html,body{margin:0;padding:0}
body{background:var(--bg) var(--pattern);color:var(--ink);font-family:var(--font);font-size:16px;line-height:1.5;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-feature-settings:"cv11","ss01";
  -webkit-tap-highlight-color:transparent}
button,input,textarea,select{font:inherit;color:inherit}
a{color:var(--brand)}
[hidden]{display:none!important}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* ---- кнопки ---- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:var(--r);
  padding:13px 20px;font-size:15px;font-weight:600;letter-spacing:-.005em;cursor:pointer;white-space:nowrap;
  background:var(--accent);color:var(--accent-ink);text-decoration:none;transition:background .15s,transform .08s,opacity .2s,box-shadow .15s}
.btn:hover{background:var(--accent-hover)}
.btn:active{transform:translateY(1px)}
.btn:disabled{opacity:.5;cursor:default;transform:none}
.btn--block{width:100%}
.btn--lg{padding:16px 22px;font-size:16px;border-radius:16px}
.btn--sm{padding:8px 13px;font-size:13.5px;border-radius:10px}
.btn--ghost{background:var(--surface);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line-2)}
.btn--ghost:hover{background:var(--surface-2)}
.btn--soft{background:var(--accent-soft);color:var(--accent-soft-ink)}
.btn--soft:hover{background:var(--accent-soft);filter:brightness(.97)}
.btn--quiet{background:transparent;color:var(--ink-2)}
.btn--quiet:hover{background:var(--sunken);color:var(--ink)}
.btn--danger{background:var(--danger-soft);color:var(--danger)}
.btn--danger:hover{background:var(--danger-soft);filter:brightness(.96)}
.icon-btn{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:12px;border:0;background:transparent;color:var(--ink-2);cursor:pointer;transition:background .15s,color .15s}
.icon-btn:hover{background:var(--sunken);color:var(--ink)}
.icon{width:20px;height:20px;flex:none;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.icon--sm{width:16px;height:16px}

/* ---- поля ---- */
.input,.textarea{width:100%;background:var(--surface);border:1px solid var(--line-2);border-radius:var(--r);padding:14px 16px;font-size:16px;
  transition:border-color .15s,box-shadow .15s;outline:none}
.input::placeholder,.textarea::placeholder{color:var(--ink-3)}
.input:focus,.textarea:focus{border-color:var(--accent);box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 16%,transparent)}
.input.is-invalid,.textarea.is-invalid{border-color:var(--danger);box-shadow:0 0 0 4px color-mix(in srgb,var(--danger) 14%,transparent)}
.textarea{resize:none;line-height:1.5}
.label{display:block;font-size:14px;font-weight:600;margin:0 0 8px}
.hint{font-size:13.5px;color:var(--ink-3);margin:8px 0 0}
.error{font-size:13.5px;color:var(--danger);margin:8px 0 0;min-height:0}
.error:empty{display:none}

/* ---- мелочи ---- */
.chip{display:inline-flex;align-items:center;gap:6px;max-width:100%;font-size:12px;font-weight:600;letter-spacing:.005em;
  padding:4px 10px;border-radius:999px;background:var(--sunken);color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chip--accent{background:var(--accent-soft);color:var(--accent-soft-ink)}
.chip--gold{background:var(--gold-soft);color:var(--gold)}
.chip--warn{background:var(--warn-soft);color:var(--warn)}
.chip--danger{background:var(--danger-soft);color:var(--danger)}
.muted{color:var(--ink-3)}
.count{font-variant-numeric:tabular-nums}
.avatar{display:inline-grid;place-items:center;width:36px;height:36px;border-radius:50%;flex:none;font-size:14px;font-weight:700;color:#fff;letter-spacing:-.02em}
.spinner{width:18px;height:18px;border-radius:50%;border:2px solid currentColor;border-right-color:transparent;animation:spin .7s linear infinite;flex:none}
@keyframes spin{to{transform:rotate(360deg)}}
.dots{display:inline-flex;gap:3px;align-items:center}
.dots i{width:5px;height:5px;border-radius:50%;background:currentColor;opacity:.35;animation:dot 1.2s infinite}
.dots i:nth-child(2){animation-delay:.15s}.dots i:nth-child(3){animation-delay:.3s}
@keyframes dot{0%,60%,100%{opacity:.25;transform:translateY(0)}30%{opacity:1;transform:translateY(-2px)}}

/* ---- логотип: восьмиконечная звезда ---- */
.mark{display:inline-grid;place-items:center}
.mark svg{display:block}

/* ---- нижние шторки и диалоги ---- */
dialog.sheet{border:0;padding:0;margin:auto auto 0;width:100%;max-width:560px;max-height:min(86vh,760px);
  background:var(--surface);color:var(--ink);border-radius:var(--r-xl) var(--r-xl) 0 0;box-shadow:var(--shadow-3);
  overflow:hidden;display:flex;flex-direction:column}
dialog.sheet:not([open]){display:none}
dialog.sheet::backdrop{background:rgba(10,12,14,.42);backdrop-filter:blur(2px)}
dialog.sheet[open]{animation:sheetIn .32s var(--ease)}
@keyframes sheetIn{from{transform:translateY(40px);opacity:.4}to{transform:none;opacity:1}}
@media (min-width:640px){dialog.sheet{margin:auto;border-radius:var(--r-xl)}}
.sheet__grab{width:40px;height:5px;border-radius:9px;background:var(--line-2);margin:10px auto 0;flex:none}
.sheet__head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 20px 10px;flex:none}
.sheet__title{font-size:18px;font-weight:700;letter-spacing:-.015em;margin:0}
.sheet__body{padding:4px 20px calc(20px + var(--safe-b));overflow-y:auto;-webkit-overflow-scrolling:touch}
dialog.modal{border:0;padding:24px;border-radius:var(--r-lg);max-width:400px;width:calc(100% - 32px);background:var(--surface);color:var(--ink);box-shadow:var(--shadow-3)}
dialog.modal::backdrop{background:rgba(10,12,14,.42)}
.modal__title{font-size:18px;font-weight:700;margin:0 0 8px;letter-spacing:-.01em}
.modal__text{color:var(--ink-2);font-size:15px;margin:0 0 20px}
.modal__actions{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap}

/* ---- уведомления на экране ---- */
.toasts{position:fixed;left:0;right:0;bottom:calc(16px + var(--safe-b));display:flex;flex-direction:column;align-items:center;gap:8px;z-index:100;pointer-events:none;padding:0 16px}
.toast{background:var(--ink);color:var(--bg);font-size:14px;font-weight:500;padding:11px 16px;border-radius:12px;box-shadow:var(--shadow-2);max-width:440px;
  animation:toastIn .25s var(--ease);pointer-events:auto}
.toast--error{background:var(--danger);color:#fff}
@keyframes toastIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* ---- вход ---- */
.auth{min-height:100svh;display:grid;place-items:center;padding:calc(32px + var(--safe-t)) 16px calc(32px + var(--safe-b));position:relative;overflow:hidden}
.auth__bg{position:absolute;inset:0;pointer-events:none;opacity:.55;
  background:radial-gradient(1200px 500px at 50% -10%,color-mix(in srgb,var(--brand-2) 22%,transparent),transparent 70%)}
.auth__pattern{display:none}
.auth__card{position:relative;width:100%;max-width:420px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-xl);
  padding:clamp(28px,6vw,40px) clamp(22px,5vw,36px);box-shadow:var(--shadow-2)}
.auth__mark{margin:0 0 22px}
.auth__eyebrow{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--brand);margin:0 0 10px}
.auth__title{font-size:clamp(28px,7vw,34px);line-height:1.1;letter-spacing:-.03em;font-weight:750;margin:0 0 12px}
.auth__lede{color:var(--ink-2);margin:0 0 28px;font-size:16px}
.auth__step{animation:stepIn .4s var(--ease)}
@keyframes stepIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.auth__foot{margin:18px 0 0;font-size:13px;color:var(--ink-3);text-align:center}
.code-input{font-size:28px;font-weight:700;letter-spacing:.42em;text-align:center;padding:14px 10px 14px 22px;font-variant-numeric:tabular-nums}
.linkbtn{background:none;border:0;padding:0;color:var(--brand);font-weight:600;cursor:pointer;font-size:inherit}
.linkbtn:disabled{color:var(--ink-3);cursor:default}
.spam-note{display:flex;gap:12px;align-items:flex-start;margin:-12px 0 24px;padding:14px 16px;border-radius:14px;background:var(--warn-soft);border:1px solid color-mix(in srgb,var(--warn) 28%,transparent);color:var(--ink-2);font-size:14px;line-height:1.45}
.spam-note .icon{color:var(--warn);margin-top:1px}
.spam-note b{display:block;color:var(--ink);font-size:15px;margin:0 0 2px}
.devcode{margin:14px 0 0;padding:10px 12px;border-radius:12px;background:var(--warn-soft);color:var(--warn);font-size:13.5px}
.nick-reveal{text-align:center;padding:8px 0 4px}
.nick-reveal__avatar{width:84px;height:84px;font-size:30px;margin:0 auto 16px;box-shadow:0 10px 30px -10px rgba(0,0,0,.35);animation:pop .5s var(--ease)}
@keyframes pop{0%{transform:scale(.6);opacity:0}70%{transform:scale(1.06)}100%{transform:scale(1);opacity:1}}
.nick-reveal__name{font-size:26px;font-weight:750;letter-spacing:-.025em;margin:0 0 6px}

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