/* English вдвоём. Стиль «закат над Нью-Йорком»: персик → фиолетовый, как на обложке.
   Фон и текст из темы Telegram (--tg-theme-*), запасные значения ниже. */
:root {
  --fb-bg: #fbf4ef; --fb-surface: #ffffff; --fb-text: #2a1f3d; --fb-hint: #8a7f95; --fb-link: #7b4fd6;
  --polina: #eb6834; --shadow: #7b4fd6; --team: #b0a6bb;
  --ok: #1f9d5c; --bad: #d64545; --ok-bg: rgba(31, 157, 92, .13); --bad-bg: rgba(214, 69, 69, .12);
  --line: rgba(90, 60, 120, .13);
  --peach: #ffad7a; --rose: #f08f8f; --violet: #7b4fd6; --night: #2d1b5c; --sun: #ffd98a;
  --sunset: linear-gradient(170deg, #ffb27d 0%, #f6938a 36%, #c97db8 66%, #8b62d4 100%);
  --glow: 0 10px 30px -12px rgba(123, 79, 214, .55);
  --skyline: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 80' preserveAspectRatio='none'%3E%3Cpath fill='%232d1b5c' d='M0 80V52h18V38h22v42h6V30h20v50h8V44h26v36h6V24h4V14h3v10h4v56h8V40h24v40h6V50h18v30h8V34h22v46h6V8h3V0h2v8h3v24h8v48h6V46h20v34h8V28h24v52h6V44h22v36h8V36h22v44z'/%3E%3Cg fill='%23ffd98a'%3E%3Crect x='24' y='44' width='3' height='4'/%3E%3Crect x='32' y='56' width='3' height='4'/%3E%3Crect x='54' y='38' width='3' height='4'/%3E%3Crect x='60' y='52' width='3' height='4'/%3E%3Crect x='82' y='50' width='3' height='4'/%3E%3Crect x='94' y='62' width='3' height='4'/%3E%3Crect x='126' y='30' width='3' height='4'/%3E%3Crect x='150' y='48' width='3' height='4'/%3E%3Crect x='162' y='60' width='3' height='4'/%3E%3Crect x='198' y='42' width='3' height='4'/%3E%3Crect x='236' y='16' width='2' height='4'/%3E%3Crect x='242' y='40' width='3' height='4'/%3E%3Crect x='270' y='54' width='3' height='4'/%3E%3Crect x='300' y='36' width='3' height='4'/%3E%3Crect x='312' y='60' width='3' height='4'/%3E%3Crect x='340' y='50' width='3' height='4'/%3E%3Crect x='372' y='42' width='3' height='4'/%3E%3Crect x='386' y='58' width='3' height='4'/%3E%3C/g%3E%3C/svg%3E");
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --fb-bg: #17121f; --fb-surface: #221b2e; --fb-text: #f3eef8; --fb-hint: #a99fb6; --fb-link: #b49af5;
    --polina: #e0703e; --shadow: #9a7cf0; --team: #7d7488;
    --ok: #3cc47a; --bad: #ff6b6b; --ok-bg: rgba(60, 196, 122, .15); --bad-bg: rgba(255, 107, 107, .14);
    --line: rgba(230, 215, 255, .11); color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --fb-bg: #17121f; --fb-surface: #221b2e; --fb-text: #f3eef8; --fb-hint: #a99fb6; --fb-link: #b49af5;
  --polina: #e0703e; --shadow: #9a7cf0; --team: #7d7488;
  --ok: #3cc47a; --bad: #ff6b6b; --ok-bg: rgba(60, 196, 122, .15); --bad-bg: rgba(255, 107, 107, .14);
  --line: rgba(230, 215, 255, .11); color-scheme: dark;
}
:root {
  --bg: var(--tg-theme-secondary-bg-color, var(--fb-bg));
  --surface: var(--tg-theme-section-bg-color, var(--tg-theme-bg-color, var(--fb-surface)));
  --text: var(--tg-theme-text-color, var(--fb-text));
  --hint: var(--tg-theme-hint-color, var(--fb-hint));
  --link: var(--fb-link);
}

* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html, body { margin: 0; }
body {
  background: var(--bg); color: var(--text); min-height: 100vh; overflow-x: hidden;
  font: 16px/1.42 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
button { font: inherit; color: inherit; cursor: pointer; }
a { color: var(--link); }
#view { max-width: 520px; margin: 0 auto; padding: 12px 16px 104px; animation: enter .28s ease; }
body.flow #view { padding-bottom: 96px; }
@keyframes enter { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.loading { display: grid; place-items: center; padding: 90px 0; }
.spinner { width: 34px; height: 34px; border-radius: 50%; border: 4px solid var(--line); border-top-color: var(--violet); animation: spin .8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

#topbar { max-width: 520px; margin: 0 auto; padding: 8px 16px 0; }
#back { background: none; border: 0; color: var(--link); padding: 6px 0; font-weight: 600; }

h1 { font-size: 24px; margin: 6px 0 10px; letter-spacing: -.3px; }
h2 { font-size: 16px; margin: 22px 4px 10px; color: var(--hint); font-weight: 600; text-transform: lowercase; }
.hint { color: var(--hint); font-size: 14px; }
.small { font-size: 13px; }
.center { text-align: center; }
.row { display: flex; align-items: center; gap: 10px; }
.grow { flex: 1; min-width: 0; }

/* одна строка-подсказка «что сейчас делать» на каждом экране */
.doing {
  display: flex; gap: 8px; align-items: center; font-size: 14px; color: var(--hint);
  background: var(--surface); border-radius: 14px; padding: 9px 12px; margin: 0 0 12px;
}
.doing b { color: var(--text); font-weight: 600; }

.card { background: var(--surface); border-radius: 24px; padding: 16px 18px; margin: 0 0 12px; box-shadow: 0 1px 2px rgba(40, 20, 60, .05); }

/* ---------- закат ---------- */
.sunset {
  position: relative; overflow: hidden; color: #fff; background: var(--sunset);
  border-radius: 28px; padding: 22px 20px 92px; margin: 0 0 14px; box-shadow: var(--glow);
}
.sunset::before { /* солнце */
  content: ""; position: absolute; right: 26px; bottom: 34px; width: 92px; height: 92px; border-radius: 50%;
  background: radial-gradient(circle, #ffe7a6 0%, var(--sun) 58%, rgba(255, 217, 138, 0) 72%);
  animation: sunrise 1.2s ease-out both;
}
.sunset::after { /* силуэт Нью-Йорка */
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 78px;
  background: var(--skyline) bottom / 100% 100% no-repeat;
}
@keyframes sunrise { from { transform: translateY(40px); opacity: 0; } to { transform: none; opacity: 1; } }
.sunset > * { position: relative; z-index: 1; }
.sunset .date { font-size: 13px; opacity: .9; text-transform: lowercase; }
.sunset .title { font-size: 27px; font-weight: 800; line-height: 1.12; margin: 4px 0 10px; letter-spacing: -.4px; text-shadow: 0 2px 10px rgba(60, 20, 90, .25); }
.chips { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 16px; }
.chips span { background: rgba(255, 255, 255, .24); backdrop-filter: blur(4px); border-radius: 99px; padding: 4px 10px; font-size: 13px; font-weight: 600; }
.sunset.done { padding-bottom: 92px; }
.sunset .big-streak { font-size: 15px; font-weight: 600; opacity: .95; }

.btn-go {
  display: block; width: 100%; border: 0; border-radius: 18px; padding: 17px; font-size: 19px; font-weight: 800;
  background: #fff; color: var(--violet); box-shadow: 0 8px 22px -8px rgba(45, 27, 92, .55);
  animation: breathe 2.6s ease-in-out infinite; transition: transform .1s;
}
.btn-go:active { transform: scale(.97); }
@keyframes breathe { 0%, 100% { box-shadow: 0 8px 22px -8px rgba(45, 27, 92, .55), 0 0 0 0 rgba(255, 255, 255, .55); } 50% { box-shadow: 0 8px 22px -8px rgba(45, 27, 92, .55), 0 0 0 9px rgba(255, 255, 255, 0); } }

/* ---------- люди ---------- */
.ava {
  width: 56px; height: 56px; border-radius: 50%; display: grid; place-items: center; flex: none; position: relative;
  font-size: 22px; font-weight: 800; color: #fff; overflow: hidden; background-size: cover; background-position: center;
}
.ava.polina { background-color: var(--polina); box-shadow: 0 0 0 3px var(--surface), 0 0 0 5px var(--polina); }
.ava.shadow { background-color: var(--shadow); box-shadow: 0 0 0 3px var(--surface), 0 0 0 5px var(--shadow); }
.ava.has-img { color: transparent; }
.ava.sm { width: 30px; height: 30px; font-size: 13px; box-shadow: none; }
.ava.lg { width: 84px; height: 84px; font-size: 32px; }
.person { display: flex; align-items: center; gap: 14px; padding: 10px 0; }
.person + .person { border-top: 1px solid var(--line); }
.person .nm { font-weight: 700; font-size: 17px; }
.person .sub { font-size: 13px; color: var(--hint); }
.status { font-size: 13px; font-weight: 700; padding: 5px 10px; border-radius: 99px; white-space: nowrap; }
.status.yes { background: var(--ok-bg); color: var(--ok); }
.status.no { background: var(--line); color: var(--hint); }

.bar { height: 12px; border-radius: 99px; background: var(--line); overflow: hidden; display: flex; gap: 2px; margin: 10px 0 8px; }
.bar i { display: block; height: 100%; transition: width .6s ease; }
.bar .p { background: var(--polina); } .bar .s { background: var(--shadow); } .bar .t { background: var(--team); }
.bar .fill { background: linear-gradient(90deg, var(--peach), var(--violet)); border-radius: 99px; }
.legend { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 13px; color: var(--hint); }
.legend b { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 5px; vertical-align: -1px; }

/* ---------- плитки «Ещё» ---------- */
.tile {
  display: flex; align-items: center; gap: 14px; width: 100%; text-align: left; border: 0;
  background: var(--surface); border-radius: 22px; padding: 15px 16px; margin: 0 0 10px; transition: transform .08s;
}
.tile:active { transform: scale(.98); }
.tile .ic { font-size: 26px; width: 48px; height: 48px; display: grid; place-items: center; border-radius: 16px; background: var(--bg); flex: none; }
.tile .t1 { font-weight: 700; }
.tile .t2 { font-size: 13px; color: var(--hint); }
.tile .go { color: var(--hint); font-size: 22px; }
.tile.locked { opacity: .55; }

/* ---------- кнопки ---------- */
.btn {
  display: block; width: 100%; border: 0; border-radius: 18px; padding: 16px; font-weight: 700; font-size: 17px;
  background: linear-gradient(135deg, #f0906e, var(--violet)); color: #fff; margin: 10px 0; box-shadow: var(--glow);
}
.btn:active { transform: scale(.98); }
.btn.ghost { background: var(--surface); color: var(--link); box-shadow: none; }
.btn:disabled { opacity: .5; }
.pair { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 14px; }
.pair .btn { margin: 0; }
.btn.yes { background: var(--ok); }
.btn.no { background: var(--surface); color: var(--bad); border: 2px solid var(--bad-bg); box-shadow: none; }

#mainbtn-wrap { position: fixed; left: 0; right: 0; bottom: 0; padding: 10px 16px calc(12px + env(safe-area-inset-bottom)); background: linear-gradient(transparent, var(--bg) 35%); z-index: 20; }
#mainbtn { display: block; width: 100%; max-width: 488px; margin: 0 auto; border: 0; border-radius: 18px; padding: 16px; font-weight: 800; font-size: 17px; background: linear-gradient(135deg, #f0906e, var(--violet)); color: #fff; box-shadow: var(--glow); }

#tabs {
  position: fixed; left: 12px; right: 12px; bottom: calc(10px + env(safe-area-inset-bottom)); z-index: 10;
  max-width: 420px; margin: 0 auto; display: flex; gap: 4px; padding: 6px;
  background: var(--surface); border-radius: 24px; box-shadow: 0 8px 28px -10px rgba(45, 27, 92, .35);
}
#tabs button { flex: 1; border: 0; background: none; font-size: 12px; color: var(--hint); padding: 6px 0; border-radius: 18px; display: flex; flex-direction: column; align-items: center; gap: 1px; transition: background .2s, color .2s; }
#tabs button span { font-size: 20px; filter: grayscale(.7); opacity: .75; transition: transform .2s; }
#tabs button.on { background: linear-gradient(135deg, rgba(255, 173, 122, .22), rgba(123, 79, 214, .22)); color: var(--text); font-weight: 700; }
#tabs button.on span { filter: none; opacity: 1; transform: scale(1.1); }

#toast { position: fixed; left: 50%; top: 14px; transform: translateX(-50%); background: var(--night); color: #fff; padding: 10px 16px; border-radius: 14px; font-size: 14px; z-index: 50; max-width: 90vw; box-shadow: var(--glow); }

/* ---------- шаги чек-ина ---------- */
.steps { display: flex; gap: 6px; margin: 4px 0 6px; }
.steps i { flex: 1; height: 7px; border-radius: 9px; background: var(--line); overflow: hidden; position: relative; }
.steps i.done { background: linear-gradient(90deg, var(--peach), var(--violet)); }
.steps i.cur::after { content: ""; position: absolute; inset: 0; width: var(--p, 0%); background: linear-gradient(90deg, var(--peach), var(--violet)); border-radius: 9px; transition: width .3s; }
.steplabel { font-size: 13px; color: var(--hint); margin-bottom: 12px; font-weight: 600; }
.interstitial { text-align: center; padding: 70px 10px 30px; animation: pop .45s cubic-bezier(.3, 1.5, .5, 1); }
.interstitial .em { font-size: 64px; }
.interstitial .tt { font-size: 24px; font-weight: 800; margin: 10px 0 6px; }

/* ---------- вопрос ---------- */
.progress { display: flex; gap: 4px; margin: 0 0 14px; }
.progress i { flex: 1; height: 4px; border-radius: 9px; background: var(--line); }
.progress i.ok { background: var(--ok); } .progress i.bad { background: var(--bad); } .progress i.cur { background: var(--violet); }
.qcard { background: var(--surface); border-radius: 24px; padding: 20px 18px; }
.prompt { font-size: 26px; font-weight: 800; line-height: 1.22; margin: 2px 0; display: flex; gap: 10px; align-items: flex-start; letter-spacing: -.2px; }
.prompt.ru { font-size: 23px; }
.prompt.long { font-size: 19px; font-weight: 700; }
.sub-ru { color: var(--hint); font-size: 14px; margin-top: 4px; }
.say { border: 0; background: var(--bg); border-radius: 12px; width: 40px; height: 40px; flex: none; font-size: 18px; display: inline-grid; place-items: center; }
.say:active { transform: scale(.9); }
.opts { display: grid; gap: 9px; margin-top: 16px; }
.opt { border: 2px solid var(--line); background: var(--surface); border-radius: 16px; padding: 14px 15px; text-align: left; font-size: 16px; transition: background .15s, border-color .15s, transform .08s; }
.opt:active { transform: scale(.985); }
.opt.ok { border-color: var(--ok); background: var(--ok-bg); animation: pop .3s; }
.opt.bad { border-color: var(--bad); background: var(--bad-bg); animation: shake .3s; }
.opt.dim { opacity: .5; }
.opt:disabled { cursor: default; color: var(--text); }
@keyframes shake { 0%, 100% { transform: translateX(0); } 25% { transform: translateX(-6px); } 75% { transform: translateX(6px); } }
@keyframes pop { from { transform: scale(.85); opacity: .3; } to { transform: scale(1); opacity: 1; } }

.reveal { margin-top: 14px; border-radius: 18px; padding: 13px 15px; background: var(--bg); animation: enter .22s ease; }
.reveal .ans { font-size: 20px; font-weight: 800; display: flex; gap: 8px; align-items: center; }
.reveal .note { margin-top: 6px; font-size: 15px; }
.reveal .ex { margin-top: 8px; font-size: 15px; display: flex; gap: 8px; align-items: center; font-style: italic; }
.verdict { font-weight: 800; margin-bottom: 4px; }
.verdict.ok { color: var(--ok); } .verdict.bad { color: var(--bad); }
.plus { position: fixed; font-weight: 900; color: var(--ok); pointer-events: none; animation: fly .8s ease-out forwards; z-index: 40; font-size: 22px; }
@keyframes fly { to { transform: translateY(-50px); opacity: 0; } }
.blank { font-size: 22px; font-weight: 700; }
.blank u { text-decoration: none; border-bottom: 3px solid var(--violet); padding: 0 18px; }
.newphrase .tag { display: inline-block; font-size: 12px; font-weight: 800; color: #fff; background: linear-gradient(135deg, var(--peach), var(--violet)); border-radius: 99px; padding: 3px 10px; margin-bottom: 10px; }

/* ---------- итог чек-ина ---------- */
.done-hero { text-align: center; padding-bottom: 96px; }
.done-hero .check { font-size: 64px; animation: pulse 1.4s ease-in-out 2; display: inline-block; }
@keyframes pulse { 0%, 100% { transform: scale(1); } 40% { transform: scale(1.22); } }
.done-hero .ava { margin: 0 auto 10px; }
.stats { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; margin: 12px 0 4px; }
.stat { background: var(--surface); border-radius: 18px; padding: 10px 6px; text-align: center; }
.stat .v { font-size: 22px; font-weight: 800; }
.stat .l { font-size: 12px; color: var(--hint); }
.confetti { position: fixed; top: -12px; width: 9px; height: 14px; border-radius: 2px; z-index: 60; pointer-events: none; animation: fall linear forwards; }
@keyframes fall { to { transform: translateY(105vh) rotate(720deg); opacity: .8; } }

/* ---------- онбординг ---------- */
.onb { position: fixed; inset: 0; z-index: 30; background: var(--sunset); color: #fff; display: flex; flex-direction: column; padding: 28px 22px calc(26px + env(safe-area-inset-bottom)); overflow: hidden; }
.onb::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 110px; background: var(--skyline) bottom / 100% 100% no-repeat; pointer-events: none; }
.onb > * { position: relative; z-index: 1; }
.onb .slide { flex: 1; display: flex; flex-direction: column; justify-content: center; text-align: center; max-width: 420px; margin: 0 auto; animation: enter .35s ease; }
.onb .em { font-size: 76px; margin-bottom: 14px; animation: pop .5s cubic-bezier(.3, 1.5, .5, 1); }
.onb h1 { font-size: 28px; margin: 0 0 10px; color: #fff; }
.onb p { font-size: 17px; opacity: .95; margin: 0; }
.onb .duo { display: flex; justify-content: center; gap: 18px; margin-top: 22px; }
.onb .dots { display: flex; gap: 8px; justify-content: center; margin: 18px 0; }
.onb .dots i { width: 8px; height: 8px; border-radius: 9px; background: rgba(255, 255, 255, .45); transition: width .25s; }
.onb .dots i.on { width: 24px; background: #fff; }
.onb .btn-go { max-width: 420px; margin: 0 auto; animation: none; }
.onb .skip { background: none; border: 0; color: #fff; opacity: .8; margin-top: 10px; font-size: 14px; }

/* ---------- урок, дуэль, квест ---------- */
.story .ln { padding: 9px 0; border-bottom: 1px solid var(--line); }
.story .ln:last-child { border-bottom: 0; }
.story .en { display: flex; gap: 8px; align-items: flex-start; font-size: 17px; }
.story .ru { color: var(--hint); font-size: 14px; margin-top: 3px; }
.tap { border: 0; background: none; color: var(--link); padding: 2px 0; font-size: 13px; font-weight: 600; }
.phr { display: flex; gap: 10px; align-items: center; padding: 9px 0; border-bottom: 1px solid var(--line); }
.phr:last-child { border-bottom: 0; }
.phr .en { font-weight: 700; }
.phr .ru { color: var(--hint); font-size: 14px; }
.pattern { border-left: 5px solid var(--violet); }
.vs { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; text-align: center; gap: 8px; }
.vs .ava { margin: 0 auto 6px; }
.vs .n { font-size: 32px; font-weight: 900; }
.cmp { padding: 11px 0; border-bottom: 1px solid var(--line); }
.cmp:last-child { border-bottom: 0; }
.cmp .q { font-weight: 700; margin-bottom: 6px; }
.cmp .who { display: flex; align-items: center; gap: 8px; font-size: 15px; margin: 4px 0; }
.match { display: inline-block; font-size: 12px; padding: 2px 8px; border-radius: 99px; background: var(--ok-bg); color: var(--ok); font-weight: 700; margin-left: 6px; }
.finish { text-align: center; padding: 30px 16px; }
.finish .em { font-size: 58px; animation: pop .5s cubic-bezier(.3, 1.6, .5, 1); }
.finish .score { font-size: 36px; font-weight: 900; margin: 6px 0; }

.inv { font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; font-size: 14px; background: rgba(255, 255, 255, .2); border-radius: 14px; padding: 10px 12px; margin-top: 10px; white-space: pre-wrap; text-align: left; }
.log { display: flex; flex-direction: column; gap: 8px; }
.scene { text-align: center; font-size: 12px; color: var(--hint); text-transform: uppercase; letter-spacing: 1px; margin: 12px 0 2px; font-weight: 700; }
.narr { background: var(--surface); border-radius: 16px; padding: 12px 14px; font-style: italic; animation: enter .25s ease; }
.bub { max-width: 86%; border-radius: 20px; padding: 10px 13px; animation: enter .25s ease; }
.bub.them { background: var(--surface); align-self: flex-start; border-bottom-left-radius: 6px; }
.bub.me { background: linear-gradient(135deg, #f0906e, var(--violet)); color: #fff; align-self: flex-end; border-bottom-right-radius: 6px; }
.bub .sp { font-size: 12px; color: var(--hint); margin-bottom: 3px; }
.bub .en { display: flex; gap: 8px; align-items: flex-start; font-size: 17px; }
.bub .ru { font-size: 14px; color: var(--hint); margin-top: 4px; }
.qnote { align-self: center; font-size: 14px; color: var(--hint); font-style: italic; text-align: center; max-width: 92%; animation: enter .25s ease; }
.task { font-size: 14px; color: var(--link); text-align: center; margin: 4px 0; font-weight: 600; }
.actions { margin-top: 12px; }
.tiles { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin: 10px 0; }
.tiles button { border: 2px solid var(--line); background: var(--surface); border-radius: 14px; padding: 9px 13px; font-size: 16px; }
.answer-line { min-height: 56px; border: 2px dashed var(--line); border-radius: 16px; padding: 8px; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; justify-content: center; }
.answer-line button { border: 0; background: var(--violet); color: #fff; border-radius: 12px; padding: 7px 11px; font-size: 16px; }
.answer-line.bad { border-color: var(--bad); animation: shake .3s; }
.answer-line.ok { border-color: var(--ok); border-style: solid; }

/* ---------- вместе ---------- */
.chart svg { width: 100%; height: auto; display: block; overflow: visible; }
.chart .tip { min-height: 20px; font-size: 14px; margin-top: 6px; color: var(--text); }
.chart text { fill: var(--hint); font-size: 10px; }
.feed .it { display: flex; gap: 10px; align-items: center; padding: 9px 0; border-bottom: 1px solid var(--line); font-size: 15px; }
.feed .it:last-child { border-bottom: 0; }
.feed .dot { width: 10px; height: 10px; border-radius: 50%; flex: none; }
.feed .pt { color: var(--hint); font-size: 13px; white-space: nowrap; }
.mini { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin-top: 8px; text-align: center; }
.mini div { background: var(--bg); border-radius: 12px; padding: 7px 2px; }
.mini b { display: block; font-size: 18px; }
.mini span { font-size: 11px; color: var(--hint); }

.deny { min-height: 80vh; display: flex; flex-direction: column; justify-content: center; text-align: center; padding: 30px 10px; }
.deny .sunset { padding-bottom: 100px; }
.deny .em { font-size: 60px; }
.deny a.btn-go { text-decoration: none; margin-top: 14px; animation: none; }
table.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } }