/* #1318 (макеты #1040): тема по часам посетителя — день / вечер / ночь.
   Тема ставится на <html data-t="day|eve|night"> скриптом в <head> (см. главную и /worlds/).
   Свои классы, без Tailwind: сборка app.css не нужна. */
:root, html[data-t="night"] { --t-bg:#14121a; --t-card:#1f1c27; --t-ink:#f3ece0; --t-dim:#a79f93; --t-acc:#e8a15a; --t-bubble:#2b2735; --t-line:#111; }
html[data-t="eve"] { --t-bg:#2a1d17; --t-card:#3a2a21; --t-ink:#f6e6cf; --t-dim:#c9ad8c; --t-acc:#f0a050; --t-bubble:#4a372a; --t-line:#111; }
html[data-t="day"] { --t-bg:#f4ede1; --t-card:#fffaf1; --t-ink:#2a241d; --t-dim:#6f6356; --t-acc:#c46a2b; --t-bubble:#ece2d2; --t-line:#2a241d; }
/* #3023: акцент как цвет ТЕКСТА. На тёмном фоне (ночь, вечер) это сам акцент; днём акцент на светлом даёт 3,3 —
   текстом идёт акцент, затемнённый цветом текста (≈ 5 к 1). Заливки и рамки по-прежнему берут --t-acc. */
:root { --t-link:var(--t-acc); }
html[data-t="day"] { --t-link:color-mix(in srgb, var(--t-acc) 70%, var(--t-ink)); }

body.t1040 { background:var(--t-bg) !important; color:var(--t-ink) !important; }
html[data-t="day"] body.t1040 { background-image:repeating-linear-gradient(0deg,rgba(120,90,50,.04) 0 2px,transparent 2px 4px) !important; }
.t1040 .serif { font-family:Georgia,"Times New Roman",serif; }

/* ---------- главная: сцена + сообщение ---------- */
.h-wrap { width:100%; max-width:1280px; margin:0 auto; }
.h-hero { position:relative; height:430px; height:clamp(300px,40svh,430px); overflow:hidden; margin-top:52px; } /* #2033: на телефоне кнопка «Ответить» целиком в первом экране */
.h-lead { margin-top:52px; padding:12px 16px 12px; } /* #1498: строка «что это» над сценой — первый экран без неё не говорит, что это ИИ */
.h-lead + .h-hero { margin-top:0; }
.h-lead-t { font:700 21px/1.25 Georgia,serif; color:var(--t-ink); margin:0; }
.h-lead-s { font-size:13px; color:var(--t-dim); margin:4px 0 0; }
.h-hero .h-place { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.h-hero:after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,.05) 40%,var(--t-bg) 100%); pointer-events:none; }
.h-cap { position:absolute; left:14px; top:14px; z-index:2; background:#f7efd9; color:#2a241d; padding:6px 10px; font:600 13px Georgia,serif; border:2px solid #2a241d; max-width:62%; }
.h-balloon { position:absolute; right:164px; bottom:96px; z-index:2; background:#fff; color:#1a1a1a; padding:10px 12px; border-radius:16px; font:600 15px/1.3 Georgia,serif; max-width:52%; border:2px solid #1a1a1a; }
.h-balloon:after { content:""; position:absolute; right:-18px; /* #2120: реплика стоит у лица */ bottom:12px; border:8px solid transparent; border-left-color:#1a1a1a; }
.h-face { position:absolute; right:14px; bottom:74px; width:132px; height:132px; border-radius:14px; border:3px solid var(--t-ink); object-fit:cover; z-index:2; box-shadow:0 8px 24px rgba(0,0,0,.5); transform:rotate(2deg); background:#333; }
.h-row { position:relative; z-index:3; margin:-44px 14px 0; display:grid; gap:14px; }
.h-card { background:var(--t-card); border-radius:18px; padding:14px; box-shadow:0 10px 30px rgba(0,0,0,.35); }
.h-msg { display:flex; gap:10px; align-items:flex-start; }
.h-av { width:44px; height:44px; border-radius:50%; object-fit:cover; flex:none; background:var(--t-bubble); display:flex; align-items:center; justify-content:center; font-weight:700; }
.h-who { font-weight:700; }
.h-who small { display:block; font-weight:400; color:var(--t-dim); font-size:12px; }
.h-time { font-size:11px; color:var(--t-dim); float:right; font-weight:400; }
.h-text { background:var(--t-bubble); border-radius:4px 14px 14px 14px; padding:9px 12px; margin-top:6px; line-height:1.4; }
.h-btn { display:block; width:100%; margin-top:12px; padding:14px; border:0; border-radius:12px; background:var(--t-acc); color:#1a1208; font-weight:700; font-size:17px; text-align:center; cursor:pointer; text-decoration:none; }
.h-btn:hover { filter:brightness(1.06); }
.h-free { margin:8px 0 0; text-align:center; font-size:13px; color:var(--t-dim); }
.has-bg .h-free { color:#d6cbbb; }
.h-btn.ghost { background:transparent; color:var(--t-ink); border:1px solid var(--t-dim); font-weight:500; }
.h-label { display:inline-block; background:var(--t-bg); padding:2px 8px; border-radius:6px; font-size:13px; text-transform:uppercase; letter-spacing:1px; color:var(--t-dim); margin:0 2px 8px; font-weight:600; }
.h-inv { display:flex; gap:10px; align-items:center; margin:0 0 8px; background:var(--t-bubble); padding:10px 12px; border-radius:18px 18px 18px 4px; position:relative; color:var(--t-ink); text-decoration:none; width:100%; text-align:left; border:0; font:inherit; cursor:pointer; }
.h-inv p { margin:0; font-size:14px; line-height:1.35; }
.h-inv .h-dot { margin-left:auto; width:9px; height:9px; border-radius:50%; background:var(--t-acc); flex:none; }
.h-inv:hover { filter:brightness(1.08); }
/* #1291: фон места и времени под письмом (дождь, снег, фонарь) — затемнён, текст светлый в любой теме. */
.h-card.has-bg { background:linear-gradient(rgba(14,12,18,.5), rgba(14,12,18,.8)), var(--inv-bg) center/cover no-repeat, var(--t-card); color:#f3ece0; }
.h-inv.has-bg { background:linear-gradient(90deg, rgba(14,12,18,.86) 30%, rgba(14,12,18,.5)), var(--inv-bg) center/cover no-repeat, var(--t-bubble); color:#f3ece0; }
.has-bg .h-text { background:rgba(20,18,26,.72); color:#f3ece0; }
.has-bg .h-who small, .has-bg .h-time { color:#d6cbbb; }
/* #1406: на каждом приглашении — кнопка-ответ своим текстом («Еду за тобой», «Иду»): нажатие начинает историю */
.h-inv .h-reply { display:table; margin-top:8px; padding:6px 14px; border-radius:10px; background:var(--t-acc); color:#1a1208; font-weight:700; font-size:14px; }
.h-inv:hover .h-reply { filter:brightness(1.06); }
.h-seo { margin:34px 16px 0; }
.h-seo h1 { font:700 24px/1.25 Georgia,serif; margin:0 0 10px; color:var(--t-ink); }
.h-seo h2 { font-size:16px; font-weight:400; line-height:1.5; color:var(--t-ink); opacity:.9; margin:0 0 8px; }
.h-seo p { font-size:15px; line-height:1.5; color:var(--t-dim); margin:0 0 8px; }
.h-h { font-size:14px; text-transform:uppercase; letter-spacing:1px; color:var(--t-dim); margin:26px 16px 10px; font-weight:600; }
.h-frames { display:grid; gap:14px; margin:0 14px; }
.h-fr { position:relative; overflow:hidden; border:3px solid #111; border-radius:2px; box-shadow:4px 4px 0 #111; }
.h-fr img.bg { width:100%; height:170px; object-fit:cover; display:block; }
.h-fr b { position:absolute; left:0; right:0; bottom:0; padding:26px 12px 10px; background:linear-gradient(transparent,rgba(0,0,0,.85)); color:#fff; font:600 17px/1.3 Georgia,serif; }
.h-fr .fc { position:absolute; right:8px; top:8px; width:64px; height:64px; border-radius:8px; border:2px solid #fff; object-fit:cover; }
.h-wrap { padding-bottom:34px; } /* #1404: нижние карточки не упираются в подвал, даже когда подпись .h-foot скрыта */
.h-foot { padding:26px 16px 0; color:var(--t-dim); font-size:13px; text-align:center; line-height:1.5; }
.h-foot a { color:var(--t-link); }
#home-continue:not(.hidden) > div { background:var(--t-card) !important; border-color:var(--t-acc) !important; }
#home-continue:not(.hidden) > div p { color:var(--t-ink) !important; }
@media (min-width:900px) {
  .h-hero { height:560px; }
  .h-lead { padding:40px 60px 16px; } /* #2120: строка не прилипает к меню на компьютере */
  .h-lead-t { font-size:28px; }
  .h-face { width:200px; height:200px; right:60px; bottom:150px; }
  .h-balloon { right:282px; bottom:210px; font-size:20px; max-width:40%; }
  .h-cap { left:60px; top:30px; font-size:16px; }
  /* #3428: одна колонка — «Тебя ещё зовут» под карточкой, ниже первого экрана (как на 375): одно чувство на первом экране */
  .h-row { gap:28px; margin:-130px 60px 0; max-width:640px; }
  .h-seo { margin:44px 60px 0; max-width:820px; }
  .h-seo h1 { font-size:32px; }
  .h-h { margin:36px 60px 12px; }
  .h-frames { grid-template-columns:1fr 1fr 1fr; margin:0 60px; }
  .h-fr img.bg { height:220px; }
}
/* шапка — в теме по часам, стили в _shared/header.html (#1407) */

/* ---------- выбор мира (/worlds/) ---------- */
.w1040 main h1, .w1040 #my-stories-title, .w1040 #create-world-heading { color:var(--t-ink) !important; }
.w1040 #guest-play-banner { background:var(--t-card) !important; border-color:var(--t-acc) !important; }
.w1040 #guest-play-banner p, .w1040 #guest-play-banner strong { color:var(--t-ink) !important; }
.w1040 #guest-play-banner a { color:var(--t-link) !important; }
.w1040 #cold-state-wedge, .w1040 #worlds-create-tail { color:var(--t-dim) !important; }
/* #3022: ссылки под карточками остались светло-жёлтыми от тёмного фона — днём не читались. Акцент, затемнённый до 4,5:1 на дневном фоне. */
.w1040 { --w-link:color-mix(in srgb, var(--t-acc) 70%, var(--t-ink)); }
.w1040 #worlds-create-tail :is(a, button), .w1040 #create-world-section .text-amber-200 { color:var(--w-link) !important; }
/* #3022: подписи на фоне страницы вне тёмных карточек — «На отборе» и строка под «Свой мир». */
.w1040 #trial-section > h2 { color:var(--t-ink) !important; }
.w1040 #trial-section > p, .w1040 #create-world-section > div:first-child p { color:var(--t-dim) !important; }
.w1040 #worlds-create-tail :is(a, button):hover, .w1040 #create-world-section .text-amber-200:hover { color:var(--t-ink) !important; }
.w1040 main nav[aria-label="Все миры списком"] :is(p, a) { color:var(--t-dim) !important; }
.w1040 main nav[aria-label="Все миры списком"] a:hover { color:var(--t-ink) !important; }
.w1040 #invites-strip { margin-bottom:22px; }
.w1040 .w-inv-grid { display:grid; gap:12px; }
.w1040 .w-inv-grid .h-card { border:1px solid var(--t-acc); }
.w1040 .world-card { border:3px solid #111; border-radius:2px !important; box-shadow:4px 4px 0 #111 !important; background:#000 !important; }
.w1040 .world-card:nth-child(odd) { transform:rotate(-.8deg); }
.w1040 .world-card:nth-child(even) { transform:rotate(.8deg); }
.w1040 .world-card .world-launch-button { background:var(--t-acc) !important; color:#1a1208 !important; }
.w-story-tag { position:absolute; left:6px; top:6px; background:#f7efd9; color:#2a241d; border:2px solid #2a241d; font:600 11px/1.2 Georgia,serif; padding:2px 6px; white-space:nowrap; max-width:100%; overflow:hidden; text-overflow:ellipsis; }
@media (min-width:900px) { .w1040 .w-inv-grid { grid-template-columns:1.1fr 1fr; align-items:start; } }

/* #1331: карточки «скоро» — та же карточка, приглушённая, с пометкой и кнопкой интереса */
.w1040 .world-soon { border:3px dashed #111; border-radius:2px !important; box-shadow:4px 4px 0 #111 !important; background:#000 !important; }
.w1040 .world-soon > div { filter:saturate(.75); }
.w-soon-tag { background:var(--t-acc); color:#1a1208; }
.soon-call { background:transparent; border:2px solid var(--t-acc); color:var(--t-ink); }
.world-soon .soon-call { color:#fff; }
.soon-call:disabled { opacity:.75; border-style:dashed; cursor:default; }
.soon-sheet { background:var(--t-card); color:var(--t-ink); border:3px solid #111; }
/* ---------- вход (/auth/, #1332): «Войти или начать» — Telegram главной кнопкой, Яндекс и почта кружками ---------- */
.a1040 .a-main { flex:1; display:flex; align-items:center; justify-content:center; padding:84px 16px 32px; }
.a1040 .a-card { width:100%; max-width:400px; background:var(--t-card); border-radius:18px; padding:26px 20px 18px; box-shadow:0 10px 30px rgba(0,0,0,.35); }
html[data-t="day"] .a1040 .a-card { box-shadow:0 10px 30px rgba(80,55,20,.15); border:1px solid var(--t-bubble); }
.a1040 .a-title { font:700 28px/1.2 Georgia,serif; color:var(--t-ink); text-align:center; margin:0 0 6px; }
.a1040 .a-sub { color:var(--t-dim); text-align:center; font-size:15px; margin:0 0 20px; }
.a1040 .a-why { list-style:none; margin:-8px 0 18px; padding:0; font-size:14px; color:var(--t-dim); }
.a1040 .a-why li { position:relative; padding:0 0 0 18px; margin:0 0 6px; line-height:1.35; }
.a1040 .a-why li::before { content:"✓"; position:absolute; left:0; top:0; color:var(--t-link); }
.a1040 .a-note { background:var(--t-bubble); border-radius:12px; padding:10px 12px; margin:0 0 14px; text-align:center; font-size:14px; }
.a1040 .a-note span { display:block; color:var(--t-dim); font-size:13px; margin-top:2px; }
.a1040 #auth-status { border-radius:12px; padding:10px 12px; margin:0 0 14px; font-size:14px; background:var(--t-bubble); border-left:4px solid var(--t-acc); color:var(--t-ink); }
.a1040 #auth-status.is-error { border-left-color:#d9534f; }
.a1040 #auth-status.is-success { border-left-color:#4caf7a; }
.a1040 .a-main-btn { display:flex; align-items:center; justify-content:center; gap:10px; width:100%; padding:15px; border:0; border-radius:12px; background:var(--t-acc); color:#1a1208; font-weight:700; font-size:17px; cursor:pointer; margin-top:14px; }
.a1040 .a-main-btn:hover { filter:brightness(1.06); }
.a1040 .a-main-btn:disabled { opacity:.6; cursor:wait; }
.a1040 .a-or { text-align:center; color:var(--t-dim); font-size:13px; text-transform:uppercase; letter-spacing:1px; margin:20px 0 10px; }
.a1040 .a-dots { display:flex; justify-content:center; gap:28px; }
.a1040 .a-dot { background:none; border:0; color:var(--t-ink); display:flex; flex-direction:column; align-items:center; gap:6px; cursor:pointer; font:inherit; }
.a1040 .a-dot.hidden { display:none; }
.a1040 .a-dot small { font-size:13px; color:var(--t-dim); }
.a1040 .a-dot-i { width:56px; height:56px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:var(--t-bubble); border:2px solid var(--t-dim); font:700 24px Georgia,serif; }
.a1040 .a-dot:hover .a-dot-i { border-color:var(--t-acc); }
.a1040 .a-ya { color:#fc3f1d; }
/* #2665: способы входа равными кнопками */
.a1040 .a-ways { display:flex; flex-direction:column; gap:10px; margin-top:14px; }
.a1040 .a-way { display:flex; align-items:center; gap:12px; width:100%; padding:13px 16px; border:2px solid var(--t-dim); border-radius:12px; background:var(--t-bubble); color:var(--t-ink); font:inherit; font-weight:600; font-size:16px; text-align:left; cursor:pointer; }
.a1040 .a-way:hover { border-color:var(--t-acc); }
.a1040 .a-way:disabled { opacity:.6; cursor:wait; }
.a1040 .a-way.hidden { display:none; }
.a1040 .a-way-i { width:32px; height:32px; flex:none; border-radius:50%; display:flex; align-items:center; justify-content:center; background:var(--t-bg, transparent); font:700 18px Georgia,serif; }
.a1040 .a-tg { color:#2aabee; }
.a1040 .a-form label { display:block; font-size:14px; color:var(--t-dim); margin:12px 0 4px; }
.a1040 .a-form input[type=email], .a1040 .a-form input[type=password], .a1040 .a-form input[type=date], .a1040 .a-form input[type=text] { display:block; width:100%; padding:12px; border-radius:10px; border:1px solid var(--t-dim); background:var(--t-bubble); color:var(--t-ink); font-size:16px; }
.a1040 .a-form input:focus { outline:2px solid var(--t-acc); outline-offset:1px; }
.a1040 #login-code { letter-spacing:6px; font-size:22px; text-align:center; }
html[data-t="night"] .a1040 input[type=date], html[data-t="eve"] .a1040 input[type=date] { color-scheme:dark; }
.a1040 .a-form .a-check { display:flex; gap:8px; align-items:flex-start; color:var(--t-ink); margin-top:12px; }
.a1040 .a-form .a-check input { margin-top:3px; }
.a1040 .a-hint { color:var(--t-ink); font-size:14px; margin:12px 0 0; }
/* #1639: возраст кнопками (нажатие = согласие) и «она / он / без разницы». */
.a1040 .a-lbl { font-size:14px; color:var(--t-dim); margin:14px 0 6px; }
.a1040 .a-seg { display:flex; gap:6px; }
.a1040 .a-seg-b { flex:1; padding:10px 4px; border-radius:10px; border:1px solid var(--t-dim); background:var(--t-bubble); color:var(--t-ink); font:inherit; font-size:15px; cursor:pointer; }
.a1040 .a-seg-b.is-on { border-color:var(--t-acc); outline:2px solid var(--t-acc); outline-offset:-1px; font-weight:700; }
.a1040 .a-terms { margin:0 0 8px; font-size:13px; color:var(--t-dim); }
.a1040 .a-ages { display:flex; gap:8px; }
.a1040 .a-age-b { flex:1; padding:14px 4px; border:0; border-radius:12px; background:var(--t-acc); color:#1a1208; font:inherit; font-weight:700; font-size:17px; cursor:pointer; }
.a1040 .a-age-b:disabled { opacity:.6; cursor:wait; }
.a1040 .a-link { display:block; margin:10px auto 0; background:none; border:0; color:var(--t-dim); font-size:13px; cursor:pointer; text-decoration:underline; text-underline-offset:3px; }
.a1040 .a-link:hover { color:var(--t-ink); }
.a1040 .a-link.hidden { display:none; } /* #1740: «Прислать код ещё раз» — только после первой отправки */
.a1040 .a-small { text-align:center; color:var(--t-dim); font-size:12px; margin:14px 0 0; line-height:1.5; }
.a1040 .a-small a, .a1040 .a-form a { color:var(--t-link); }
.a1040 .a-google { display:flex; justify-content:center; margin-top:16px; }

/* #1408: карточка «Мои истории» — как «Ты остановился здесь» на главной (#home-continue). */
.w1040 .w-story { background:var(--t-card) !important; border:1px solid var(--t-bubble) !important; border-radius:18px !important; box-shadow:0 10px 30px rgba(0,0,0,.35) !important; color:var(--t-ink); }
html[data-t="day"] .w1040 .w-story { box-shadow:0 10px 30px rgba(80,55,20,.15) !important; }
.w1040 .w-story.is-last { border-color:var(--t-acc) !important; }
.w1040 .w-story:hover { border-color:var(--t-acc) !important; }
.w1040 .w-story h3 { color:var(--t-ink) !important; }
.w1040 .w-story p { color:var(--t-dim) !important; }
.w1040 .w-story p.text-amber-200\/80 { color:var(--t-link) !important; }
.w1040 .w-story img { border-color:var(--t-bubble) !important; background:var(--t-bubble) !important; border-radius:50% !important; }
.w1040 .w-story .text-amber-300 { color:var(--t-link) !important; background:var(--t-bubble) !important; }
.w1040 .w-story-go { background:var(--t-acc) !important; color:#1a1208 !important; border-radius:12px !important; font-weight:700 !important; padding:12px !important; font-size:16px !important; }
.w1040 .w-story-go:hover { filter:brightness(1.06); }
.w1040 .w-story-alt { background:transparent !important; color:var(--t-ink) !important; border:1px solid var(--t-dim) !important; border-radius:12px !important; }

/* #1438: «Твои люди» — карточки спутников полароидами. */
.w-people { align-items:start; }
/* #2122: полка — одна лента и на широком экране: четыре карточки в ряд, остальные листаются, одинокой во втором ряду нет;
   карточки одной высоты. */
.w-people { display:flex !important; gap:16px !important; overflow-x:auto; scroll-snap-type:x mandatory; padding:6px 4px 14px; margin:0 -4px; align-items:stretch !important; }
.w-people > .w-polaroid { flex:0 0 calc(25% - 12px); scroll-snap-align:start; }
.w-people > .w-person.is-open { flex-basis:60%; }
.w-people .w-pol-open { flex:1 1 auto; }
.w-polaroid.is-ended .w-pol-photo img, .w-polaroid.is-ended .w-pol-letter { filter:grayscale(.55); opacity:.85; }
.w-pol-end { display:inline-block; align-self:flex-start; font-size:11px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:#fbf8f1; background:#6b5a48; border-radius:3px; padding:2px 6px; }
/* #2097: на телефоне полка — одна лента, листается вбок; каталог виден в первом экране. */
@media (max-width:639px) {
  .w-people { display:flex !important; gap:14px !important; overflow-x:auto; scroll-snap-type:x mandatory; padding:6px 4px 14px; margin:0 -4px; -webkit-overflow-scrolling:touch; }
  .w-people > .w-polaroid { flex:0 0 42%; }
  .w-people > .w-person.is-open { flex-basis:88%; }
  .w-people .w-pol-where { -webkit-line-clamp:2; }
  .w-pol-name { font-size:17px !important; }
  .w-pol-end { font-size:10px; letter-spacing:.02em; }
}
/* #2747: карточка своего человека (вид «б» проверки #2739): бумага без наклона, на телефоне во всю ширину ленты. */
.w-people > .w-own { flex:0 0 calc(50% - 8px); scroll-snap-align:start; }
.w-own { display:flex; flex-direction:column; background:#fbf7ef; color:#2a211b; border-radius:6px; box-shadow:0 6px 18px rgba(60,40,20,.18); padding:12px; text-align:left; }
.w-own-head { display:flex; gap:12px; align-items:center; margin-bottom:8px; }
.w-own-head img { width:64px; height:64px; border-radius:8px; object-fit:cover; flex:none; }
.w-own-name { font-family:Georgia,serif; font-weight:700; font-size:20px; color:#2a211b; }
.w-own-sub { font-size:13px; color:#8a7d6b; }
.w-own-list { list-style:none; margin:0; padding:0; }
.w-own-row { position:relative; display:flex; gap:8px; align-items:flex-start; padding:7px 0; border-top:1px solid #e6dcc8; font-size:14px; line-height:1.35; }
.w-own-go { display:flex; gap:8px; align-items:flex-start; flex:1 1 auto; min-width:0; background:none; border:0; padding:0; color:inherit; font:inherit; text-align:left; cursor:pointer; }
.w-own-ic { flex:none; width:20px; text-align:center; color:#b9601f; }
.w-own-row.is-done .w-own-ic { color:#5b8a3a; }
.w-own-txt { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; overflow:hidden; }
.w-own-row.is-next { background:#fff3df; margin:0 -6px; padding:8px 6px; border-radius:8px; border-top:none; }
.w-own-main { display:block; width:100%; margin-top:10px; padding:11px 10px; border-radius:10px; border:none; background:#c2692a; color:#1f140c; font-weight:700; font-size:15px; cursor:pointer; }
.w-own-sit { display:block; width:100%; margin-top:8px; padding:10px; border-radius:10px; border:1px solid #c9b796; background:#fffaf0; color:#2a211b; font-size:15px; cursor:pointer; }
.w-own-sit span { display:block; font-size:13px; color:#8a7d6b; }
.w-own .w-ser-new { margin-top:8px; background:none; color:#8a5a2b; font-weight:600; font-size:14px; padding:6px; text-decoration:underline; }
@media (max-width:639px) {
  .w-people > .w-own { flex-basis:92%; }
}
/* #2097: бумага — вся карточка. */
.w-polaroid { display:flex; flex-direction:column; align-items:stretch; background:#fbf8f1; color:#2a2118; border-radius:4px; box-shadow:0 10px 26px rgba(0,0,0,.35); padding-bottom:6px; transform:rotate(-1.2deg); transition:transform .15s; }
.w-polaroid:nth-child(2n) { transform:rotate(1.1deg); }
.w-polaroid:hover, .w-polaroid:focus-within { transform:rotate(0) translateY(-2px); }
.w-polaroid .w-pol-open { display:flex; flex-direction:column; gap:4px; width:100%; text-align:left; background:transparent; color:#2a2118; padding:10px 10px 6px; border:0; cursor:pointer; }
.w-polaroid.is-last { outline:3px solid var(--t-acc, #f0b429); outline-offset:3px; }
.w-polaroid .w-pol-link { color:#7a6a58; }
.w-pol-photo.w-pol-letter { display:flex; align-items:center; justify-content:center; color:#fbf8f1; font:700 64px/1 Georgia,"Times New Roman",serif; }
.w-pol-world .w-pol-name { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; overflow-wrap:anywhere; }
.w-polaroid.is-defeated .w-pol-photo img { filter:grayscale(.8); }
.w-pol-photo { display:block; aspect-ratio:1/1; overflow:hidden; background:#ddd; margin-bottom:6px; }
.w-pol-photo img { width:100%; height:100%; object-fit:cover; display:block; }
.w-pol-name { font:700 20px/1.2 Georgia,"Times New Roman",serif; }
.w-pol-from { display:block; font-size:12px; line-height:1.3; color:#7a5a2e; font-style:italic; margin-bottom:2px; }
.w-pol-where { font-size:14px; line-height:1.4; color:#3d3226; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; overflow:hidden; }
.w-pol-meta { font-size:12px; color:#7a6a58; }
.w-pol-link { align-self:center; background:none; border:0; margin-top:8px; font-size:13px; color:var(--t-dim, #9ca3af); text-decoration:underline; text-underline-offset:3px; cursor:pointer; }
/* #2737: удаление — под «⋯» в углу карточки: «⋯» → «Удалить историю» → окно подтверждения. Под карточкой кнопки нет. */
.w-polaroid, .w-ser, .w-story { position:relative; }
.w-pol-more { position:absolute; top:6px; right:6px; z-index:2; }
.w-polaroid > .w-pol-more { left:6px; pointer-events:none; }
.w-polaroid > .w-pol-more .w-pol-more-btn { display:block; margin-left:auto; }
.w-polaroid > .w-pol-more .w-pol-more-btn, .w-polaroid > .w-pol-more .w-pol-more-menu { pointer-events:auto; }
.w-polaroid > .w-pol-more .w-pol-more-menu { left:0; min-width:0; }
.w-pol-more.is-inline { position:relative; top:auto; right:auto; flex:0 0 auto; }
.w-pol-more-btn { width:30px; height:30px; border-radius:50%; border:0; background:rgba(251,248,241,.88); color:#2a2118; font:700 18px/1 system-ui,sans-serif; cursor:pointer; box-shadow:0 1px 4px rgba(0,0,0,.25); }
.w-pol-more-btn:hover, .w-pol-more-btn:focus-visible { background:#fff; }
.w-pol-more-menu { display:none; position:absolute; top:calc(100% + 4px); right:0; min-width:170px; background:#fbf8f1; border:1px solid #d9ccb4; border-radius:10px; box-shadow:0 8px 20px rgba(0,0,0,.3); padding:4px; }
.w-pol-more.is-open .w-pol-more-menu { display:block; }
.w-pol-more-item { display:block; width:100%; text-align:left; background:none; border:0; border-radius:8px; padding:10px 12px; font-size:14px; color:#9b2c1f; cursor:pointer; }
.w-pol-more-item:hover, .w-pol-more-item:focus-visible { background:#f1e4dc; }
/* #1886: одна карточка на человека — нажатие раскрывает его серии на всю ширину полки. */
.w-person .w-ser-box { display:none; }
.w-person.is-open { grid-column:1 / -1; }
.w-person.is-open { transform:none; }
.w-person.is-open .w-pol-open { flex-direction:row; align-items:center; gap:12px; }
.w-person.is-open .w-pol-photo { width:64px; flex:0 0 64px; margin:0; }
.w-person.is-open .w-pol-where, .w-person.is-open .w-pol-meta { display:none; }
.w-person.is-open .w-ser-box { display:block; padding:4px 12px 14px; }
.w-ser-title { font:600 13px/1.3 Georgia,serif; color:#7a6a58; margin:4px 0 8px; }
.w-ser-list { list-style:none; margin:0; padding:0; display:grid; gap:8px; }
.w-ser { display:flex; flex-direction:column; }
.w-ser-go { display:flex; flex-direction:column; gap:3px; text-align:left; width:100%; background:#fff; border:1px solid #d9ccb4; border-radius:10px; padding:10px 12px; color:#2a2118; cursor:pointer; }
.w-ser-go:hover, .w-ser-go:focus-visible { border-color:#b5832a; }
.w-ser-head { font-weight:700; font-size:15px; }
.w-ser.is-ended .w-ser-head { color:#7a6a58; }
.w-ser.is-ended .w-ser-go { background:#f1ece2; }
.w-ser-where { font-size:13px; line-height:1.4; color:#3d3226; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }
.w-ser-meta { font-size:12px; color:#7a6a58; }
.w-ser .w-pol-more { top:8px; right:8px; }
.w-ser:has(.w-pol-more) .w-ser-go { padding-right:44px; }
.w-ser-new-sub { display:block; font-weight:400; font-size:12px; margin-top:2px; }
.w-ser-new { display:block; margin-top:10px; text-align:center; background:var(--t-acc, #f0b429); color:#1a1208; font-weight:700; border-radius:12px; padding:12px; text-decoration:none; }

/* ---------- страница мира /w/… (#1412): кадр места + карточки в теме по часам ---------- */
.p1040 .p-main { flex:1; width:100%; max-width:720px; margin:0 auto; padding:76px 14px 34px; display:grid; gap:14px; }
.p1040 .p-frame img.bg { height:230px; }
.p1040 .w-story-tag { left:10px; top:10px; font-size:13px; padding:3px 8px; }
/* #3429: лицо спутника в углу картинки места, как на главной */
.p1040 .p-frame-face { position:absolute; right:10px; top:10px; width:84px; height:112px; object-fit:cover; border:3px solid #111; border-radius:6px; box-shadow:3px 3px 0 #111; background:#f7efd9; }
.p1040 .p-cap { position:absolute; left:0; right:0; bottom:0; padding:40px 14px 12px; background:linear-gradient(transparent,rgba(0,0,0,.88)); }
.p1040 .p-cap h1 { margin:0; color:#fff; font:700 24px/1.2 Georgia,serif; text-shadow:0 2px 12px rgba(0,0,0,.9); }
.p1040 .p-badges { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:6px; }
.p1040 .p-card { background:var(--t-card); border-radius:18px; padding:14px; box-shadow:0 10px 30px rgba(0,0,0,.35); color:var(--t-ink); }
html[data-t="day"] .p1040 .p-card, html[data-t="day"] .p1040 .h-card { box-shadow:0 10px 30px rgba(80,55,20,.15); }
.p1040 .p-card p, .p1040 .p-lead p { margin:0 0 6px; line-height:1.5; font-size:15px; color:var(--t-dim); }
.p1040 .p-card .p-strong { color:var(--t-ink); font-weight:700; }
.p1040 .p-open { white-space:pre-line; color:var(--t-ink) !important; font-family:Georgia,"Times New Roman",serif; }
.p1040 .p-desc { color:var(--t-ink) !important; font-size:17px !important; }
.p1040 .p-note { font-size:13px !important; margin-top:10px !important; }
.p1040 .p-note a, .p1040 .p-links a { color:var(--t-link); }
.p1040 .p-links ul { margin:0 0 4px; padding:0; list-style:none; display:grid; gap:6px; font-size:15px; }
.p1040 .h-btn + .h-btn { margin-top:10px; }
.p1040 .h-msg .h-av { width:56px; height:56px; }
.p1040 .p-who { display:flex; gap:12px; align-items:flex-start; }
.p1040 .p-face { width:84px; height:112px; object-fit:cover; border-radius:12px; flex:none; }
.p1040 .p-tags { font-size:13px !important; margin-top:6px !important; }
/* #2988: /ii-devushka/ — сетка историй с героинями (первый экран на 390: заголовок и два лица в ряд) и текст под ней. */
.p1040 .g-main { max-width:980px; padding-top:70px; }
.p1040 .g-head h1 { margin:0 0 6px; color:var(--t-ink); font:700 22px/1.2 Georgia,serif; }
.p1040 .g-head p { margin:0; color:var(--t-dim); font-size:14px; line-height:1.4; }
.p1040 .g-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.p1040 .g-card { display:flex; flex-direction:column; background:var(--t-card); border-radius:14px; overflow:hidden; box-shadow:0 10px 30px rgba(0,0,0,.35); }
html[data-t="day"] .p1040 .g-card { box-shadow:0 10px 30px rgba(80,55,20,.15); }
.p1040 .g-top { position:relative; display:block; color:#fff; text-decoration:none; }
.p1040 .g-face { display:block; width:100%; height:auto; aspect-ratio:1/1; object-fit:cover; object-position:50% 18%; }
.p1040 .g-cap { position:absolute; left:0; right:0; bottom:0; padding:26px 10px 8px; background:linear-gradient(transparent,rgba(0,0,0,.88)); }
.p1040 .g-cap b { display:block; font:700 18px/1.2 Georgia,serif; }
.p1040 .g-cap small { display:block; font-size:12px; line-height:1.3; opacity:.9; }
.p1040 .g-hook { flex:1; margin:8px 10px 0; font-size:13px; line-height:1.4; color:var(--t-dim); }
.p1040 .g-card .h-btn { width:auto; margin:8px 10px 10px; padding:10px; font-size:15px; }
.p1040 .g-text h2 { margin:14px 0 8px; color:var(--t-ink); font:700 20px/1.25 Georgia,serif; }
.p1040 .g-text h2:first-child { margin-top:0; }
.p1040 .g-text h3 { margin:12px 0 4px; color:var(--t-ink); font-size:16px; font-weight:700; line-height:1.35; }
.p1040 .g-text ol { margin:0 0 8px; padding-left:20px; list-style:decimal; color:var(--t-dim); font-size:15px; line-height:1.5; }
.p1040 .g-text a { color:var(--t-link); }
.p1040 .g-story + .g-story { margin-top:14px; padding-top:6px; border-top:1px solid rgba(128,128,128,.25); }
@media (min-width:760px) {
  .p1040 .g-main { padding-top:96px; }
  .p1040 .g-head h1 { font-size:32px; }
  .p1040 .g-head p { font-size:16px; }
  .p1040 .g-grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
  .p1040 .g-face { aspect-ratio:3/4; }
  .p1040 .g-hook { font-size:14px; }
}
@media (min-width:900px) {
  .p1040 .p-main { padding-top:96px; }
  .p1040 .p-frame img.bg { height:360px; }
  .p1040 .p-cap h1 { font-size:32px; }
}
/* ---------- текстовые страницы (#1411): новости, гайды, /story/, юридические ----------
   Разметка там на классах Tailwind тёмной темы; здесь они переводятся в цвета темы по часам.
   Включается классом x1040 на <body> (вместе с t1040). Подвал тоже на этих классах. */
.x1040 { --x-line:color-mix(in srgb, var(--t-dim) 32%, transparent); --x-soft:color-mix(in srgb, var(--t-acc) 12%, var(--t-card)); }
.x1040 .font-cinzel-decorative, .x1040 main h1, .x1040 main h2, .x1040 main h3 { font-family:Georgia,"Times New Roman",serif !important; letter-spacing:0; }
.x1040 .text-white, .x1040 .text-gray-100, .x1040 .text-gray-200 { color:var(--t-ink) !important; }
.x1040 .text-gray-300 { color:color-mix(in srgb, var(--t-ink) 82%, var(--t-dim)) !important; }
.x1040 .text-gray-400, .x1040 .text-gray-500 { color:var(--t-dim) !important; }
.x1040 .text-sky-400, .x1040 .text-amber-200, .x1040 .text-amber-300, .x1040 .text-amber-400, .x1040 .text-amber-500\/90,
.x1040 .text-amber-400\/90, .x1040 .text-amber-200\/90, .x1040 .text-amber-600\/80 { color:var(--t-link) !important; }
.x1040 .text-amber-100\/90 { color:var(--t-ink) !important; }
.x1040 .hover\:text-sky-400:hover, .x1040 .hover\:text-amber-300:hover, .x1040 .hover\:text-amber-200:hover,
.x1040 .hover\:text-gray-200:hover, .x1040 .hover\:text-gray-300:hover { color:var(--t-ink) !important; }
.x1040 .bg-gray-900, .x1040 .bg-gray-950\/80 { background:var(--t-bg) !important; }
.x1040 .bg-gray-800, .x1040 .bg-gray-800\/40, .x1040 .bg-gray-800\/50, .x1040 .bg-gray-800\/60, .x1040 .bg-gray-800\/70,
.x1040 .bg-gray-950\/60, .x1040 .bg-black\/40, .x1040 .bg-gradient-to-br { background:var(--t-card) !important; }
.x1040 .bg-amber-950\/25, .x1040 .bg-amber-950\/30 { background:var(--x-soft) !important; }
.x1040 .border-gray-600, .x1040 .border-gray-700, .x1040 .border-gray-800 { border-color:var(--x-line) !important; }
.x1040 .border-amber-500\/30, .x1040 .border-amber-700\/50, .x1040 .border-amber-800\/40 { border-color:color-mix(in srgb, var(--t-acc) 45%, transparent) !important; }
.x1040 .hover\:border-gray-500:hover, .x1040 .hover\:border-sky-600\/60:hover, .x1040 .hover\:border-amber-500\/70:hover,
.x1040 .hover\:border-amber-600\/50:hover { border-color:var(--t-acc) !important; }
/* кнопки «Играть» внутри текста — тот же акцент, что «Играть» в шапке */
.x1040 .bg-gradient-to-r.from-amber-500, .x1040 .bg-amber-600 { background:var(--t-acc) !important; color:#1a1208 !important; box-shadow:none !important; }
.x1040 .bg-gradient-to-r.from-amber-500:hover, .x1040 .bg-amber-600:hover { filter:brightness(1.06); }
.x1040 .bg-gray-800.hover\:bg-gray-700:hover { background:var(--t-bubble) !important; }
/* полоса у края широкой таблицы (tailwind.input.css) — в цвет фона темы, а не тёмный #111827 */
.x1040 .overflow-x-auto:has(> table):not([class*="bg-"]):not([class*="max-h"]) {
  background:
    linear-gradient(to right, var(--t-bg) 40%, transparent) left / 48px 100% no-repeat local,
    linear-gradient(to left, var(--t-bg) 40%, transparent) right / 48px 100% no-repeat local,
    linear-gradient(to right, color-mix(in srgb, var(--t-acc) 35%, transparent), transparent) left / 20px 100% no-repeat scroll,
    linear-gradient(to left, color-mix(in srgb, var(--t-acc) 35%, transparent), transparent) right / 20px 100% no-repeat scroll;
}
.x1040 table th, .x1040 table td { border-color:var(--x-line) !important; }
.x1040 code { color:var(--t-link); }

/* #1533: таблицы сравнения в гайдах на телефоне — стопка карточек, без прокрутки вбок.
   Класс guide-cards и подписи ячеек (data-label) ставит js/includeHtml.js → markGuideTables(). */
@media (max-width: 600px) {
  .guide-cards-wrap { overflow-x: visible !important; margin-left: 0 !important; margin-right: 0 !important; padding-left: 0 !important; padding-right: 0 !important; background: none !important; }
  table.guide-cards { min-width: 0 !important; width: 100% !important; display: block; }
  table.guide-cards caption { display: block; max-width: none !important; }
  table.guide-cards thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  table.guide-cards tbody { display: block; }
  table.guide-cards tr { display: block; border: 1px solid var(--x-line, rgba(148,163,184,.3)) !important; border-radius: .75rem; padding: .5rem .875rem; margin-bottom: .875rem; }
  table.guide-cards th, table.guide-cards td { display: block; width: auto !important; min-width: 0 !important; padding: .3rem 0 !important; border: 0 !important; white-space: normal !important; overflow-wrap: anywhere; text-align: left; }
  table.guide-cards tr > :first-child { font-weight: 700; font-size: 1.05em; padding-bottom: .4rem !important; }
  table.guide-cards [data-label]::before { content: attr(data-label); display: block; font-size: .8em; font-weight: 600; opacity: .65; }
  table.guide-cards tr > :first-child::before { content: none; }
}

/* #1839: «Подробнее» — окно в том же комиксе, что карточка и игра (было старое серое окно). */
.w1040 #world-modal > div { background:var(--t-card) !important; color:var(--t-ink); border:3px solid #111; border-radius:2px !important; box-shadow:6px 6px 0 #111 !important; }
.w1040 #modal-world-cover { border-bottom:3px solid #111; border-radius:0 !important; aspect-ratio:4/3; background-size:cover; background-position:center; }
.w1040 #modal-world-title { font:700 26px/1.2 Georgia,serif !important; background:#f7efd9; color:#2a241d !important; border:2px solid #2a241d; padding:4px 10px; max-width:70%; }
.w1040 .w-modal-face { position:absolute; right:14px; top:14px; width:110px; height:140px; object-fit:cover; object-position:center top; border:3px solid var(--t-ink); border-radius:10px; box-shadow:0 8px 24px rgba(0,0,0,.5); transform:rotate(2deg); z-index:2; background:#333; }
.w1040 .w-modal-face.hidden { display:none; }
.w1040 #modal-world-description, .w1040 #modal-world-carry { color:var(--t-ink) !important; }
.w1040 #modal-world-goal { color:var(--t-link) !important; }
.w1040 #modal-world-companion { color:var(--t-dim) !important; }
.w1040 #modal-cold-open { background:var(--t-bubble) !important; border:2px solid #111 !important; border-radius:2px !important; }
.w1040 #modal-cold-open p, .w1040 #modal-cold-open-list p { color:var(--t-ink) !important; }
.w1040 #modal-protagonist-card { background:var(--t-bubble) !important; border:2px solid #111 !important; border-radius:2px !important; transform:none !important; }
.w1040 #modal-protagonist-name { color:var(--t-ink) !important; font-family:Georgia,serif; }
.w1040 #modal-protagonist-description { color:var(--t-dim) !important; }
.w1040 #world-modal .sticky { background:var(--t-card) !important; border-top:3px solid #111 !important; }
.w1040 #modal-launch-button { background:var(--t-acc) !important; color:#1a1208 !important; font-weight:700; border-radius:12px; }
.w1040 #modal-public-link, .w1040 #modal-copy-link { background:transparent !important; color:var(--t-ink) !important; border-color:var(--t-dim) !important; }
@media (min-width:900px) { .w1040 .w-modal-face { width:150px; height:190px; } }
/* #2988: главная под «ии чат с персонажами» — ниже первого экрана: сетка историй с лицами (отдаётся в HTML,
   ставит ops/seo/home_stories_grid.py), текст и вопросы-ответы. Первый экран (#1318) этими правилами не задет. */
.h-st { margin:0 14px; }
.h-st .g-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.h-st .g-card { display:flex; flex-direction:column; background:var(--t-card); border-radius:14px; overflow:hidden; box-shadow:0 10px 30px rgba(0,0,0,.35); }
html[data-t="day"] .h-st .g-card { box-shadow:0 10px 30px rgba(80,55,20,.15); }
.h-st .g-top { position:relative; display:block; color:#fff; text-decoration:none; }
.h-st .g-face { display:block; width:100%; height:auto; aspect-ratio:1/1; object-fit:cover; object-position:50% 18%; }
.h-st .g-cap { position:absolute; left:0; right:0; bottom:0; padding:26px 10px 8px; background:linear-gradient(transparent,rgba(0,0,0,.88)); }
.h-st .g-cap b { display:block; font:700 18px/1.2 Georgia,serif; }
.h-st .g-cap small { display:block; font-size:12px; line-height:1.3; opacity:.9; }
.h-st .g-hook { flex:1; margin:8px 10px 0; font-size:13px; line-height:1.4; color:var(--t-dim); }
.h-st .g-card .h-btn { display:block; width:auto; margin:8px 10px 10px; padding:10px; font-size:15px; text-align:center; }
.h-txt { margin:0 16px; max-width:820px; }
.h-txt h2 { margin:26px 0 8px; color:var(--t-ink); font:700 20px/1.25 Georgia,serif; }
.h-txt h3 { margin:14px 0 4px; color:var(--t-ink); font-size:16px; font-weight:700; line-height:1.35; }
.h-txt p, .h-txt li { font-size:15px; line-height:1.55; color:var(--t-dim); }
.h-txt p { margin:0 0 8px; }
.h-txt ol { margin:0 0 8px; padding-left:20px; list-style:decimal; }
.h-txt a { color:var(--t-link); text-decoration:underline; text-underline-offset:2px; }
@media (min-width:760px) {
  .h-st { margin:0 60px; }
  .h-st .g-grid { grid-template-columns:repeat(5,minmax(0,1fr)); gap:14px; }
  .h-st .g-face { aspect-ratio:3/4; }
  .h-st .g-hook { font-size:14px; }
  .h-txt { margin:0 60px; }
  .h-txt h2 { font-size:24px; }
}