/* Панель admin.questdoma.ru – досылка квеста (31.10.2026).
   Вёрстка – по макету flow.html (принят Сергеем 30.10), значения – токены /Бренд/tokens.css (светлая тема,
   редакция 31.07.2026), шрифты – файлы /Бренд/UI-кит/_fonts/ со своего адреса: CSP панели – только 'self'.
   Экран – прежде всего телефон 360 px. */

@font-face { font-family: 'Comfortaa'; font-weight: 700; font-style: normal; font-display: swap;
             src: url('/static/fonts/Comfortaa-700.woff2') format('woff2'); }
@font-face { font-family: 'Golos Text'; font-weight: 400; font-style: normal; font-display: swap;
             src: url('/static/fonts/GolosText-Regular.woff2') format('woff2'); }
@font-face { font-family: 'Golos Text'; font-weight: 500; font-style: normal; font-display: swap;
             src: url('/static/fonts/GolosText-Medium.woff2') format('woff2'); }
@font-face { font-family: 'Golos Text'; font-weight: 600; font-style: normal; font-display: swap;
             src: url('/static/fonts/GolosText-SemiBold.woff2') format('woff2'); }

:root {
  /* из /Бренд/tokens.css */
  --qd-bg:           #FFFFFF;
  --qd-surface:      #F6F8F8;
  --qd-surface-2:    #FBF7F1;
  --qd-line:         #E2E8E7;
  --qd-line-control: #798886;
  --qd-text:         #2B2A29;
  --qd-text-mute:    #5F6C6A;
  --qd-action:       #D80300;
  --qd-action-h:     #B80200;
  --qd-action-a:     #9C0100;
  --qd-on-action:    #FFFFFF;
  --qd-link:         #1868E6;
  --qd-link-h:       #0F4FB0;
  --qd-ok:           #0E7350;
  --qd-warn:         #7D5210;
  --qd-error:        #B32424;
  --qd-ok-bg:        #E4F5EC;
  --qd-warn-bg:      #FBF0DC;
  --qd-error-bg:     #FCE8E8;
  --qd-select-bg:    #E7F0FD;
  --qd-font-display: 'Comfortaa', system-ui, sans-serif;
  --qd-font-text:    'Golos Text', -apple-system, 'Segoe UI', Roboto, sans-serif;
  --qd-r-sm: 12px;
  --qd-tap: 44px;
  --qd-focus: 0 0 0 3px rgba(24,104,230,.45);
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0 auto; max-width: 560px; min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column;
       background: var(--qd-bg); color: var(--qd-text); font-family: var(--qd-font-text); font-size: 16px;
       line-height: 1.45; }
a { color: var(--qd-link); }
a:hover { color: var(--qd-link-h); }
:focus-visible { outline: none; box-shadow: var(--qd-focus); }

/* шапка */
.top { display: flex; align-items: center; gap: 10px; min-height: 52px; padding: 10px 16px 12px;
       border-bottom: 1px solid var(--qd-line); background: var(--qd-bg); }
.top form { margin: 0; }
.top__title { font-family: var(--qd-font-display); font-weight: 700; font-size: 17px; }
.top .top__right { margin-left: auto; }   /* сильнее «.top form { margin: 0 }» */
.back { color: var(--qd-link); font-size: 15px; text-decoration: none; }
.linkbtn { border: 0; background: none; padding: 0; min-height: var(--qd-tap); font: inherit; font-size: 15px;
           color: var(--qd-link); cursor: pointer; }

/* экран: прокручиваемая середина и низ с кнопкой */
.screen { flex: 1; display: flex; flex-direction: column; margin: 0; }
.scr { flex: 1; padding: 14px 16px 16px; }
.foot { position: sticky; bottom: 0; padding: 12px 16px 18px; border-top: 1px solid var(--qd-line);
        background: var(--qd-bg); }

/* поля */
.inp { display: block; width: 100%; min-height: 48px; border: 1.5px solid var(--qd-line-control);
       border-radius: var(--qd-r-sm); padding: 11px 14px; font: inherit; font-size: 16px; color: var(--qd-text);
       background: var(--qd-bg); }
select.inp { appearance: none; padding-right: 36px;
             background-image: linear-gradient(45deg, transparent 50%, currentColor 50%),
                               linear-gradient(135deg, currentColor 50%, transparent 50%);
             background-position: calc(100% - 20px) 55%, calc(100% - 14px) 55%;
             background-size: 6px 6px, 6px 6px; background-repeat: no-repeat; }
.inp:focus, .letter:focus { outline: none; border-color: var(--qd-link); box-shadow: var(--qd-focus); }
.inp[readonly], .letter[readonly] { background: var(--qd-surface); }
.hint { font-size: 13px; color: var(--qd-text-mute); margin: 6px 2px 14px; }
.lbl { display: block; font-size: 12px; font-weight: 600; color: var(--qd-text-mute); text-transform: uppercase;
       letter-spacing: .04em; margin: 14px 2px 6px; }
.field { border: 1.5px solid var(--qd-line); border-radius: var(--qd-r-sm); padding: 10px 12px; font-size: 15px;
         background: var(--qd-surface); }
.letter { display: block; width: 100%; border: 1.5px solid var(--qd-line-control); border-radius: var(--qd-r-sm);
          padding: 12px; font: inherit; font-size: 14px; line-height: 1.5; color: var(--qd-text);
          background: var(--qd-bg); resize: vertical; }
.chk { font-size: 13px; color: var(--qd-ok); margin: 0 2px 10px; }

/* поиск и карточки */
.search { margin: 0; }
.search__row { display: flex; gap: 8px; }
.search__row .inp { flex: 1; min-width: 0; }
form:has(> .card) { margin: 0; }
.card { display: block; width: 100%; text-align: left; font: inherit; color: inherit; cursor: pointer;
        border: 1px solid var(--qd-line); border-radius: 14px; padding: 12px 14px; margin: 0 0 10px;
        background: var(--qd-bg); }
.card:hover { border-color: var(--qd-link); background: var(--qd-select-bg); }
.t { display: block; font-weight: 600; font-size: 15px; line-height: 1.3; }
.m { display: block; font-size: 13px; color: var(--qd-text-mute); margin-top: 3px; line-height: 1.4;
     overflow-wrap: anywhere; }
.m--big { font-size: 15px; }
.badge { display: inline-block; font-size: 12px; font-weight: 600; border-radius: 999px; padding: 2px 9px;
         margin-top: 7px; }
.b-red { background: var(--qd-error-bg); color: var(--qd-error); }
.b-ok { background: var(--qd-ok-bg); color: var(--qd-ok); }
.b-warn { background: var(--qd-warn-bg); color: var(--qd-warn); }

/* кнопки */
.btn { display: block; width: 100%; min-height: 50px; border: 0; border-radius: var(--qd-r-sm); padding: 14px;
       text-align: center; text-decoration: none; font: inherit; font-weight: 600; font-size: 16px;
       background: var(--qd-action); color: var(--qd-on-action); cursor: pointer; }
.btn:hover { background: var(--qd-action-h); }
.btn:active { background: var(--qd-action-a); }
.btn--sm { width: auto; min-height: 48px; padding: 0 16px; font-size: 15px; }
.btn2 { display: block; width: 100%; text-align: center; text-decoration: none; color: var(--qd-text);
        border: 1.5px solid var(--qd-line-control); border-radius: var(--qd-r-sm); padding: 12px; font-weight: 500;
        font-size: 15px; }
.btn2:hover { color: var(--qd-text); background: var(--qd-surface); }

/* сообщения */
.note { background: var(--qd-surface-2); border-radius: var(--qd-r-sm); padding: 10px 12px; font-size: 13px;
        color: var(--qd-text-mute); line-height: 1.45; margin: 10px 0 0; }
.alert { border-radius: var(--qd-r-sm); padding: 10px 12px; font-size: 14px; line-height: 1.45; margin: 0 0 10px;
         font-weight: 500; }
.alert--bad { background: var(--qd-error-bg); color: var(--qd-error); }
.alert--warn { background: var(--qd-warn-bg); color: var(--qd-warn); }
.links { margin: 0 0 4px; padding: 0 0 0 18px; font-size: 13px; overflow-wrap: anywhere; }
.links .m { display: inline; }

/* экран 3 */
.done { text-align: center; padding-top: 48px; }
.ic { width: 72px; height: 72px; border-radius: 50%; font-size: 38px; line-height: 72px; margin: 0 auto 16px; }
.ic--ok { background: var(--qd-ok-bg); color: var(--qd-ok); }
.ic--bad { background: var(--qd-error-bg); color: var(--qd-error); }
.done h2 { font-family: var(--qd-font-display); font-weight: 700; font-size: 21px; margin: 0 0 10px; }