/*
Theme Name: ERA PW
Theme URI: https://era-pw.com
Author: ERA PW
Description: Тема сайту ERA PW, зібрана з прийнятого макета (tools/wp/build_theme.py).
Version: 1.0.0
Requires PHP: 8.2
Text Domain: era
*/

@font-face { font-family: 'PW Sans'; src: url('assets/pw-sans.woff2') format('woff2'); font-style: normal; font-weight: 400; font-display: swap; }
html.pw136-document { background: #0b0a09; scroll-padding-top: 96px; }
body.pw136-site {
  --bg: #0b0a09;
  --surface: #131110;
  --raised: #1a1714;
  --hover: #221d18;
  --text: #f4eee6;
  --body: #d8cec2;
  --muted: #b8aca0;
  --soft: #8e8276;
  --accent: #ff7a1a;
  --accent-hover: #ff9442;
  --accent-deep: #d95f0b;
  --accent-ink: #160b03;
  --accent-soft: rgb(255 122 26 / .12);
  --accent-line: rgb(255 122 26 / .42);
  --accent-glow: rgb(255 122 26 / .55);
  --line: #2a241f;
  --line-strong: #3b332b;
  --shade: 11 10 9;
  --hero-filter: saturate(1.2) sepia(.38) hue-rotate(-12deg) brightness(.84) contrast(1.08);
  --hero-tint: rgb(255 96 16 / .58);
  --hero-glow: rgb(255 160 60 / .5);
  --mark-filter: saturate(2.6) hue-rotate(-14deg) brightness(1.05);
  --gutter: clamp(20px, 3vw, 80px);
  --font: 'PW Sans', 'Segoe UI', sans-serif;
  --heading: 'Segoe UI', system-ui, sans-serif;
  margin: 0;
  background: var(--bg);
  color: var(--text);
  color-scheme: dark;
  font: 16px/1.6 var(--font);
  -webkit-font-smoothing: antialiased;
}
.pw136-site *, .pw136-site *::before, .pw136-site *::after { box-sizing: border-box; }
.pw136-site h1, .pw136-site h2, .pw136-site h3, .pw136-site h4, .pw136-site p, .pw136-site figure, .pw136-site dl, .pw136-site dd { margin: 0; }
.pw136-site h1, .pw136-site h2, .pw136-site h3, .pw136-site h4 { font-family: var(--heading); font-weight: 600; text-wrap: balance; }
.pw136-site h1 { font-size: 52px; letter-spacing: -.035em; line-height: 1.12; }
.pw136-site h2 { font-size: 30px; letter-spacing: -.025em; line-height: 1.2; }
.pw136-site h3, .pw136-site h4 { font-size: 19px; line-height: 1.35; letter-spacing: -.015em; }
.pw136-site a { color: inherit; text-decoration: none; }
.pw136-site button { font: inherit; }
.pw136-site img { display: block; max-width: 100%; }
.pw136-site a, .pw136-site button, .pw136-site summary { -webkit-tap-highlight-color: transparent; }
.pw136-site a:focus-visible, .pw136-site button:focus-visible, .pw136-site summary:focus-visible, .pw136-site [tabindex="-1"]:focus-visible { outline: 2px solid var(--accent); outline-offset: 5px; }
.pw136-site [hidden] { display: none !important; }
.pw136-site .nowrap { white-space: nowrap; }
.pw136-site .shell { width: calc(100% - var(--gutter) * 2); max-width: none; margin-inline: auto; }
.pw136-site .shell > *, .pw136-site .world-points > *, .pw136-site .race-grid > *, .pw136-site .craft-grid > *, .pw136-site .world-grid > * { min-width: 0; }
.pw136-site .skip-link { position: absolute; top: 12px; left: 20px; z-index: 100; transform: translateY(-180%); padding: 12px 20px; background: var(--raised); color: var(--text); border: 1px solid var(--accent); }
.pw136-site .skip-link:focus { transform: none; }
.pw136-site .site-header { position: sticky; top: 0; z-index: 20; background: var(--bg); border-bottom: 1px solid var(--line); }
.pw136-site .header-inner { display: flex; align-items: center; justify-content: space-between; gap: 32px; min-height: 80px; }
.pw136-site .brand { display: inline-flex; align-items: center; gap: 14px; flex-shrink: 0; }
.pw136-site .brand-mark { display: flex; align-items: center; width: 44px; height: 40px; color: var(--accent); font: 28px/1 Georgia, serif; letter-spacing: -6px; }
.pw136-site .brand-mark > span { padding-top: 12px; font-size: 24px; }
.pw136-site .brand-name { font: 600 19px/1.2 var(--heading); letter-spacing: 3px; text-transform: uppercase; }
.pw136-site .brand-name small { display: block; margin-top: 6px; color: var(--soft); font: 11px/1.2 var(--font); letter-spacing: .6px; text-transform: none; }
.pw136-site .main-nav { display: flex; align-items: center; gap: 36px; }
.pw136-site .main-nav a { position: relative; display: inline-flex; align-items: center; min-height: 80px; color: var(--muted); font-size: 14px; white-space: nowrap; transition: color 160ms ease; }
.pw136-site .main-nav a::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--accent); transform: scaleX(0); transition: transform 160ms ease; }
.pw136-site .main-nav a:hover, .pw136-site .main-nav a[aria-current="page"] { color: var(--text); }
.pw136-site .main-nav a:hover::after, .pw136-site .main-nav a[aria-current="page"]::after { transform: scaleX(1); }
.pw136-site .header-action { display: inline-flex; align-items: center; justify-content: space-between; min-height: 42px; gap: 28px; border: 1px solid var(--accent-line); border-radius: 5px; padding: 8px 18px; color: var(--accent); font-size: 14px; }
.pw136-site .header-action:hover { background: var(--hover); border-color: var(--accent); }
.pw136-site .menu-toggle { align-items: center; gap: 10px; min-height: 44px; padding: 8px 12px; color: var(--text); background: var(--surface); border: 1px solid var(--line); border-radius: 4px; cursor: pointer; }
.pw136-site .menu-lines { width: 17px; height: 12px; border-block: 1px solid currentColor; position: relative; }
.pw136-site .menu-lines::after { content: ''; position: absolute; left: 0; right: 0; top: 4px; border-top: 1px solid currentColor; }
.pw136-site .eyebrow { color: var(--accent); font-size: 11px; line-height: 1.5; font-weight: 400; letter-spacing: 1.7px; text-transform: uppercase; }
.pw136-site .small-rule { display: inline-block; width: 24px; height: 1px; margin: 0 12px 4px 0; background: currentColor; }
.pw136-site .button { display: inline-flex; justify-content: space-between; align-items: center; gap: 36px; min-height: 54px; padding: 12px 24px; border: 1px solid var(--accent); border-radius: 5px; background: var(--accent); color: var(--accent-ink); font: 600 14px/1.5 var(--heading); transition: background 160ms ease, transform 160ms ease; }
.pw136-site .button:hover { background: var(--accent-hover); transform: translateY(-2px); }
.pw136-site .button:active { transform: translateY(0); }
.pw136-site .button > span { font-size: 22px; line-height: 1; font-weight: 400; }
.pw136-site .text-link { display: inline-flex; min-height: 44px; align-items: center; gap: 24px; color: var(--text); font-size: 14px; }
.pw136-site .text-link > span { color: var(--accent); font-size: 20px; transition: transform 160ms ease; }
.pw136-site .text-link:hover { color: var(--accent); }
.pw136-site .text-link:hover > span { transform: translateX(3px); }
.pw136-site .inline-link { color: var(--accent); text-decoration: underline; text-underline-offset: 4px; }
.pw136-site .hero { position: relative; isolation: isolate; overflow: hidden; background: var(--bg); }
.pw136-site .hero-image { position: absolute; z-index: -2; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 54% 49%; }
.pw136-site .hero-shade { position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgb(var(--shade) / .95), rgb(var(--shade) / .86) 20%, rgb(var(--shade) / .58) 35%, rgb(var(--shade) / .09) 59%, rgb(var(--shade) / .08)), linear-gradient(0deg, var(--bg) 0%, rgb(var(--shade) / .15) 22%, transparent 70%); }
.pw136-site .hero-inner { min-height: 680px; display: flex; align-items: center; position: relative; padding-block: 48px; }
.pw136-site .hero-copy { max-width: 38%; width: 590px; }
.pw136-site .hero h1 { margin-top: 28px; font-size: 64px; letter-spacing: -.04em; line-height: 1.04; }
.pw136-site .hero-lead { margin-top: 28px; color: var(--body); font-size: 18px; line-height: 1.6; max-width: 42ch; }
.pw136-site .hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 32px; margin-top: 32px; }
/* Права колонка першого екрана (30.10.2026): угорі тонка смуга старту сервера з кнопками соцмереж, під нею окрема
   картка трейлера (превʼю зі знаком YouTube). Без скрипту видно дату, script.js показує відлік, після старту — «Сервер відкрито»; трейлер без
   адреси (data-youtube) збірка теми не бере */
.pw136-site .hero-side { position: relative; z-index: 1; display: grid; gap: 16px; width: min(560px, 38%); margin: 0 0 24px auto; }
.pw136-site .launch { padding: 14px 18px 16px; border: 1px solid rgb(255 122 26 / .2); border-radius: 12px; background: linear-gradient(180deg, rgb(24 18 13 / .8), rgb(13 10 8 / .88)); box-shadow: inset 0 1px 0 rgb(255 170 100 / .07), 0 18px 40px -26px rgb(0 0 0 / .9); backdrop-filter: blur(10px); }
.pw136-site .launch [hidden] { display: none; }
.pw136-site .hero .launch .launch-label { display: block; }
.pw136-site .launch-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 20px; margin-top: 10px; }
.pw136-site .launch-count { display: flex; gap: 12px; }
.pw136-site .launch-count > span { display: flex; align-items: baseline; gap: 4px; color: var(--soft); font-size: 12px; }
.pw136-site .launch-count b { color: var(--text); font: 600 26px/1 var(--heading); letter-spacing: -.01em; font-variant-numeric: tabular-nums; }
.pw136-site .launch-open { color: var(--text); font: 700 22px/1.2 var(--heading); }
.pw136-site .social-links { display: flex; gap: 8px; }
.pw136-site .social-links a { display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid rgb(255 122 26 / .45); border-radius: 8px; background: rgb(var(--shade) / .55); color: var(--text); transition: color 160ms ease, border-color 160ms ease, transform 160ms ease; }
.pw136-site .social-links a:hover { border-color: var(--accent); color: var(--accent); transform: translateY(-2px); }
.pw136-site .video-poster { position: relative; display: block; overflow: hidden; border: 1px solid rgb(255 122 26 / .22); border-radius: 12px; background: #100d0b; box-shadow: 0 24px 50px -28px rgb(0 0 0 / .95); transition: border-color 160ms ease; }
/* під написами превʼю 150 порожніх темних рядків із 1080 (написи до 930-го): картка показує кадр до 980-го */
.pw136-site .video-poster img { display: block; width: 100%; height: auto; aspect-ratio: 1920 / 980; object-fit: cover; object-position: 50% 0; transition: filter 200ms ease; }
/* кнопка відтворення як у вбудованому плеєрі YouTube: напівпрозора сіра, червоніє при наведенні. Центр на 35 % висоти
   превʼю: низ кнопки на ~44 %, а білі літери «ERA PW» починаються з 47,7 % (рядок 467 із 980) */
.pw136-site .video-play { position: absolute; left: 50%; top: 35%; width: 13%; min-width: 48px; max-width: 76px; translate: -50% -50%; filter: drop-shadow(0 6px 14px rgb(0 0 0 / .55)); transition: transform 160ms ease, filter 160ms ease; }
.pw136-site .video-play svg { display: block; width: 100%; height: auto; }
.pw136-site .video-play .yt-bg { fill: #212121; fill-opacity: .8; transition: fill 160ms ease, fill-opacity 160ms ease; }
.pw136-site .video-poster:hover .video-play .yt-bg, .pw136-site .video-poster:focus-visible .video-play .yt-bg { fill: #ff0033; fill-opacity: 1; }
.pw136-site .video-poster:hover { border-color: var(--accent-line); }
.pw136-site .video-poster:hover img { filter: brightness(1.08); }
.pw136-site .video-poster:hover .video-play { transform: scale(1.06); }
/* до 1440 точок відлік і 4 кнопки вміщаються в один рядок смуги лише з меншими кнопками */
@media (max-width: 1440px) { .pw136-site .hero-side .social-links { gap: 6px; } .pw136-site .hero-side .social-links a { width: 40px; height: 40px; } }
/* на телефоні кнопки на всю ширину смуги й 48 точок заввишки: по них влучають пальцем */
@media (max-width: 760px) { .pw136-site .hero-side .social-links { width: 100%; gap: 8px; } .pw136-site .hero-side .social-links a { flex: 1; width: auto; height: 48px; } .pw136-site .compact-footer .footer-main .social-links a { width: 44px; height: 44px; } }
/* Кнопки в підвалі — теж nav, тож перебивають правила меню підвалу (проміжок, ширина рядка, висота посилань 44) */
.pw136-site .compact-footer .footer-main .social-links { width: auto; gap: 8px; }
.pw136-site .footer-main .social-links a { width: 36px; height: 36px; min-height: 0; border-color: var(--line-strong); background: none; color: var(--muted); }
.pw136-site .footer-main .social-links a:hover { border-color: var(--accent-line); color: var(--accent); }
.pw136-site .foundation { position: relative; background: var(--bg); border-bottom: 1px solid var(--line); }
.pw136-site .foundation-grid { min-height: 108px; display: grid; grid-template-columns: 1.2fr .65fr .65fr 1.2fr 1.5fr; align-items: center; gap: 28px; padding-block: 20px; }
.pw136-site .foundation-grid > div { display: flex; align-items: center; gap: 20px; min-height: 44px; border-right: 1px solid var(--line); }
.pw136-site .foundation-grid strong { font: 500 32px/1.1 var(--heading); color: var(--text); letter-spacing: -.04em; }
.pw136-site .foundation-grid span { max-width: 100px; color: var(--muted); font-size: 13px; line-height: 1.4; }
.pw136-site .foundation-grid > p { color: var(--muted); font-size: 13px; }
.pw136-site .site-footer { border-top: 1px solid var(--line); background: var(--bg); padding-block: 26px 18px; }
.pw136-site .footer-main { display: flex; align-items: center; justify-content: space-between; gap: 32px; }
.pw136-site .footer-brand { font: 600 20px var(--heading); letter-spacing: 1px; }
.pw136-site .footer-brand > span { display: block; margin-top: 5px; color: var(--soft); font: 11px var(--font); letter-spacing: .4px; }
.pw136-site .footer-main > p { color: var(--soft); font-size: 13px; }
.pw136-site .footer-main nav { display: flex; flex-wrap: wrap; gap: 28px; color: var(--muted); font-size: 13px; }
.pw136-site .footer-main nav a { display: inline-flex; align-items: center; min-height: 44px; }
.pw136-site .footer-main a:hover { color: var(--accent); }
.pw136-site .notice { position: fixed; z-index: 100; right: var(--gutter); bottom: 24px; width: min(440px, calc(100% - var(--gutter) * 2)); padding: 20px 24px; border: 1px solid var(--accent-line); border-radius: 6px; background: var(--raised); color: var(--text); font-size: 14px; box-shadow: 0 8px 32px rgb(0 0 0 / .65); visibility: hidden; opacity: 0; pointer-events: none; transition: opacity 160ms ease; }
.pw136-site .notice.is-visible { visibility: visible; opacity: 1; }
.pw136-site .download-intro { display: flex; justify-content: space-between; align-items: flex-end; gap: 32px; padding-block: 40px 32px; }
.pw136-site .download-intro h1 { margin-top: 12px; font-size: 40px; }
.pw136-site .download-intro > p { font-size: 15px; color: var(--muted); max-width: 46ch; }
.pw136-site .download-hub { display: grid; grid-template-columns: .8fr 1.2fr; border: 1px solid var(--line-strong); border-radius: 9px; overflow: hidden; background: var(--surface); }
.pw136-site .download-cover { position: relative; isolation: isolate; min-width: 0; min-height: 424px; background: var(--surface); }
.pw136-site .download-cover > img { position: absolute; z-index: -2; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 56% 44%; }
.pw136-site .download-cover::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(0deg, var(--bg) 2%, rgb(var(--shade) / .85) 18%, transparent 60%); }
.pw136-site .cover-caption { position: absolute; left: 32px; right: 32px; bottom: 32px; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.pw136-site .edition-tag { font-size: 11px; color: var(--accent); letter-spacing: 1.2px; text-transform: uppercase; }
.pw136-site .cover-caption > strong { font: 600 32px/1.3 var(--heading); letter-spacing: -.025em; }
.pw136-site .cover-caption > span:last-child { color: var(--body); font-size: 14px; letter-spacing: 2px; }
.pw136-site .cover-caption i { margin-inline: 8px; color: var(--accent); font-style: normal; }
.pw136-site .download-console { min-width: 0; padding: 32px 40px; background: linear-gradient(120deg,var(--raised),var(--surface) 60%); }
.pw136-site .console-heading { display: flex; justify-content: space-between; align-items: center; gap: 20px; }
.pw136-site .availability { color: var(--muted); font-size: 12px; }
.pw136-site .console-heading .eyebrow { letter-spacing: 1px; }
.pw136-site .download-console h2 { margin-top: 24px; font-size: 34px; }
.pw136-site .download-console h2 span { color: var(--accent); font-weight: 400; }
.pw136-site .console-lead { margin-top: 12px; color: var(--muted); font-size: 15px; }
.pw136-site .download-main-action { display: flex; align-items: center; gap: 28px; margin-top: 28px; }
.pw136-site .download-main-action > span { font-size: 13px; color: var(--text); }
.pw136-site .download-main-action small { display: block; margin-top: 2px; font-size: 11px; color: var(--soft); }
.pw136-site .mirror-label { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 28px; padding-top: 20px; border-top: 1px solid var(--line-strong); }
.pw136-site .mirror-label h3 { font: 14px var(--font); }
.pw136-site .mirror-label > span { color: var(--soft); font-size: 11px; }
.pw136-site .download-mirrors { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; margin-top: 12px; }
.pw136-site .download-mirrors > a { display: flex; align-items: center; gap: 12px; border: 1px solid var(--line-strong); border-radius: 5px; padding: 12px; transition: border-color 160ms ease, background 160ms ease; }
.pw136-site .download-mirrors > a:hover { border-color: var(--accent-line); background: var(--hover); }
.pw136-site .mirror-icon { font: 22px var(--heading); color: var(--accent); }
.pw136-site .download-mirrors strong { display: block; font: 14px var(--font); }
.pw136-site .download-mirrors small { display: block; margin-top: 4px; color: var(--soft); font-size: 10px; }
.pw136-site .download-note { color: var(--soft); font-size: 11px; margin-top: 16px; }
.pw136-site .install-steps { display: grid; grid-template-columns: 1fr 1fr; gap: 28px 40px; list-style: none; margin: 0; padding: 0; }
.pw136-site .install-steps li { display: flex; align-items: flex-start; gap: 16px; border-top: 1px solid var(--line); padding-top: 20px; }
.pw136-site .install-steps li > span { display: grid; place-items: center; width: 36px; height: 36px; flex-shrink: 0; background: var(--surface); border: 1px solid var(--line-strong); border-radius: 50%; color: var(--accent); font-size: 12px; }
.pw136-site .install-steps h3 { font-size: 17px; }
.pw136-site .install-steps p { margin-top: 8px; max-width: 54ch; color: var(--muted); font-size: 14px; }
.pw136-site .install-steps .inline-link { display: inline-block; margin-top: 8px; font-size: 12px; }
@media (min-width: 2400px) {
.pw136-site .main-nav { gap: 48px; }
.pw136-site .main-nav a { font-size: 16px; }
.pw136-site .hero-copy { width: 680px; }
.pw136-site .hero h1 { font-size: 72px; }
.pw136-site .hero-lead { font-size: 20px; }
.pw136-site .hero-side { width: min(620px, 30%); }
.pw136-site .launch-count b { font-size: 30px; }
.pw136-site .hero-image { object-position: 54% 47%; }
.pw136-site .download-console { padding: 40px 48px; }
.pw136-site .download-mirrors small { font-size: 12px; }
.pw136-site .download-cover { min-height: 448px; }
}
@media (max-width: 1280px) {
.pw136-site .main-nav { gap: 24px; }
.pw136-site .header-inner { gap: 24px; }
.pw136-site .header-action { gap: 20px; padding-inline: 14px; }
.pw136-site .hero-copy { max-width: 43%; }
.pw136-site .hero h1 { font-size: 56px; }
.pw136-site .foundation-grid { gap: 20px; grid-template-columns: 1.15fr .6fr .6fr 1.2fr 1.4fr; }
.pw136-site .foundation-grid > div { gap: 12px; }
.pw136-site .foundation-grid strong { font-size: 28px; }
.pw136-site .download-hub { grid-template-columns: .6fr 1.4fr; }
.pw136-site .download-console { padding: 28px 32px; }
.pw136-site .download-main-action { gap: 20px; }
.pw136-site .download-mirrors { gap: 8px; }
.pw136-site .mirror-icon { display: none; }
}
@media (max-width: 1024px) {
.pw136-site .header-action { display: none; }
.pw136-site .hero-inner { min-height: 640px; }
.pw136-site .hero h1 { font-size: 48px; }
.pw136-site .hero-lead { font-size: 16px; }
.pw136-site .hero-actions { gap: 16px; }
.pw136-site .hero-actions .button { gap: 24px; }
.pw136-site .foundation-grid { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 20px; }
.pw136-site .foundation-grid > div { border: 0; }
.pw136-site .foundation-grid > p { display: none; }
.pw136-site .footer-main { flex-wrap: wrap; gap: 20px 28px; }
.pw136-site .footer-main > p { display: none; }
.pw136-site .download-intro h1 { font-size: 36px; }
.pw136-site .download-intro > p { font-size: 14px; }
.pw136-site .download-hub { grid-template-columns: .65fr 1.35fr; }
.pw136-site .download-console { padding: 24px; }
.pw136-site .console-heading { flex-wrap: wrap; gap: 6px; }
.pw136-site .download-console h2 { font-size: 28px; margin-top: 20px; }
.pw136-site .download-main-action { flex-wrap: wrap; gap: 12px 20px; }
.pw136-site .download-main-action .button { gap: 24px; padding-inline: 20px; }
.pw136-site .download-main-action > span { font-size: 12px; }
.pw136-site .download-mirrors > a { padding: 10px; gap: 8px; }
.pw136-site .download-mirrors strong { font-size: 13px; }
.pw136-site .download-mirrors small { font-size: 10px; }
.pw136-site .cover-caption { left: 24px; right: 24px; bottom: 24px; }
.pw136-site .cover-caption > strong { font-size: 28px; }
.pw136-site .install-steps { grid-template-columns: 1fr; gap: 20px; }
}
@media (max-width: 920px) {
.pw136-site .header-inner { flex-wrap: wrap; gap: 0; min-height: 72px; padding-block: 12px; }
.pw136-site .header-action { display: none; }
.pw136-site .menu-toggle:not([hidden]) { display: inline-flex; }
.pw136-site .main-nav { width: 100%; flex-direction: column; align-items: stretch; gap: 0; padding-top: 12px; }
.pw136-site .main-nav a { min-height: 48px; white-space: normal; border-bottom: 1px solid var(--line); }
.pw136-site .main-nav a::after { display: none; }
.pw136-site .main-nav a[aria-current="page"] { color: var(--accent); }
.pw136-site.js .main-nav { display: none; }
.pw136-site.js .main-nav.is-open { display: flex; }
.pw136-site .brand-name { font-size: 17px; }
.pw136-site .brand-mark { height: 36px; }
}
@media (max-width: 760px) {
.pw136-site h2 { font-size: 27px; }
.pw136-site .hero { display: flex; flex-direction: column; }
.pw136-site .hero-image { position: relative; z-index: 0; inset: auto; height: 280px; object-position: 56% 48%; }
.pw136-site .hero-shade { inset: 0 0 auto; height: 280px; z-index: 1; pointer-events: none; background: linear-gradient(0deg,var(--bg),transparent 38%); }
.pw136-site .hero-inner { min-height: 0; display: block; padding-block: 16px 32px; }
.pw136-site .hero-copy { width: 100%; max-width: none; }
.pw136-site .hero h1 { font-size: 46px; margin-top: 18px; }
.pw136-site .hero h1 br { display: none; }
.pw136-site .hero-lead { margin-top: 20px; }
.pw136-site .hero-actions { margin-top: 24px; gap: 24px; }
.pw136-site .hero-side { width: auto; margin: 28px 0 0; }
.pw136-site .launch { backdrop-filter: none; background: linear-gradient(180deg, #18120e, #0e0b09); }
.pw136-site .foundation-grid { gap: 20px; padding-block: 24px; }
.pw136-site .foundation-grid > div { display: block; min-height: 0; }
.pw136-site .foundation-grid strong { font-size: 25px; }
.pw136-site .foundation-grid span { display: block; font-size: 11px; margin-top: 8px; max-width: 100px; }
.pw136-site .footer-main { gap: 20px; }
.pw136-site .footer-main nav { order: 3; width: 100%; gap: 24px; }
.pw136-site .download-intro { display: block; padding-block: 28px; }
.pw136-site .download-intro h1 { font-size: 34px; }
.pw136-site .download-intro > p { margin-top: 16px; }
.pw136-site .download-hub { grid-template-columns: 1fr; }
.pw136-site .download-cover { min-height: 220px; }
.pw136-site .download-cover > img { object-position: 55% 42%; }
.pw136-site .cover-caption { bottom: 20px; }
.pw136-site .cover-caption > strong { font-size: 26px; }
.pw136-site .download-console { padding: 24px; }
.pw136-site .download-main-action { gap: 16px; }
.pw136-site .download-mirrors { gap: 10px; }
.pw136-site .download-mirrors strong { font-size: 14px; }
.pw136-site .download-mirrors small { font-size: 11px; }
.pw136-site .install-steps { grid-template-columns: 1fr 1fr; gap: 24px; }
}
@media (max-width: 480px) {
.pw136-site .brand { gap: 8px; }
.pw136-site .brand-name { letter-spacing: 2px; }
.pw136-site .brand-name small { font-size: 10px; }
.pw136-site .hero-image, .pw136-site .hero-shade { height: 224px; }
.pw136-site .hero h1 { font-size: 42px; }
.pw136-site .hero h1 br { display: block; }
.pw136-site .hero-actions { gap: 12px 24px; }
.pw136-site .hero-actions .button { flex: 1; }
.pw136-site .hero-actions .text-link { gap: 16px; }
.pw136-site .hero-lead { font-size: 16px; }
.pw136-site .foundation-grid { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; }
.pw136-site .foundation-grid strong { font-size: 24px; }
.pw136-site .foundation-grid span { font-size: 10px; }
.pw136-site .download-intro h1 { font-size: 30px; }
.pw136-site .download-console { padding: 24px 20px; }
.pw136-site .download-console h2 { font-size: 26px; }
.pw136-site .console-lead { font-size: 14px; }
.pw136-site .console-lead br { display: none; }
.pw136-site .download-main-action > .button { width: 100%; }
.pw136-site .download-main-action > span { display: flex; gap: 12px; align-items: baseline; }
.pw136-site .download-main-action small { margin: 0; }
.pw136-site .mirror-label { align-items: flex-start; gap: 8px; }
.pw136-site .mirror-label > span { display: none; }
.pw136-site .download-mirrors { grid-template-columns: 1fr; gap: 8px; }
.pw136-site .download-mirrors > a { padding: 12px 14px; gap: 14px; }
.pw136-site .mirror-icon { display: block; width: 24px; text-align: center; }
.pw136-site .download-mirrors small { font-size: 11px; margin-top: 2px; }
.pw136-site .install-steps { grid-template-columns: 1fr; gap: 20px; }
.pw136-site .install-steps p { max-width: none; }
.pw136-site .notice { padding: 16px 20px; }
}
@media (prefers-reduced-motion: reduce) {
.pw136-site *, .pw136-site *::before, .pw136-site *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
.pw136-site .button:hover, .pw136-site .world-window:hover > img, .pw136-site .text-link:hover > span, .pw136-site .social-links a:hover, .pw136-site .video-poster:hover .video-play { transform: none; }
}

/* Compact information layer. The accepted hero rules above remain unchanged. */
.pw136-site .main-nav .mobile-account { display: none; }
.pw136-site .home-dashboard { display: grid; grid-template-columns: 1.35fr 1fr; gap: 48px; padding-block: 48px; }
.pw136-site .world-preview { position: relative; isolation: isolate; min-width: 0; min-height: 354px; overflow: hidden; border-radius: 7px; background: var(--surface); }
.pw136-site .world-preview > img { position: absolute; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: 50% 48%; }
.pw136-site .world-preview::after { content: ''; position: absolute; z-index: -1; inset: 0; background: linear-gradient(0deg,rgb(var(--shade) / .94),rgb(var(--shade) / .2) 74%); }
.pw136-site .preview-content { position: absolute; inset: auto 32px 32px; }
.pw136-site .preview-content h2 { font-size: 30px; line-height: 1.2; }
.pw136-site .preview-links { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
.pw136-site .preview-links a { display: inline-flex; align-items: center; min-height: 44px; padding: 8px 18px; border: 1px solid var(--accent-line); border-radius: 4px; background: var(--surface); color: var(--text); font-size: 14px; }
.pw136-site .preview-links a:hover { border-color: var(--accent); background: var(--hover); }
.pw136-site .server-dashboard { min-width: 0; display: flex; flex-direction: column; justify-content: space-between; gap: 32px; }
.pw136-site .dashboard-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.pw136-site .dashboard-heading h2 { font-size: 22px; }
.pw136-site .dashboard-heading > a { min-height: 32px; display: inline-flex; align-items: center; color: var(--muted); font-size: 12px; text-decoration: underline; text-underline-offset: 4px; }
.pw136-site .status-label { padding: 4px 10px; border: 1px solid var(--accent-line); color: var(--accent); border-radius: 4px; font-size: 11px; white-space: nowrap; }
.pw136-site .live-register { display: grid; grid-template-columns: 1fr 1.2fr; gap: 24px; padding-block: 20px; border-bottom: 1px solid var(--line); }
.pw136-site .live-register dt { color: var(--soft); font-size: 12px; }
.pw136-site .live-register dd { margin-top: 4px; font-size: 16px; }
.pw136-site .ranking-links { display: flex; align-items: center; gap: 24px; min-height: 48px; font-size: 13px; }
.pw136-site .ranking-links > span { color: var(--soft); margin-right: auto; }
.pw136-site .ranking-links a { min-height: 44px; display: inline-flex; align-items: center; color: var(--accent); }
.pw136-site .ranking-links a:hover { text-decoration: underline; text-underline-offset: 4px; }
.pw136-site .brief-news article { display: flex; align-items: baseline; gap: 20px; border-bottom: 1px solid var(--line); padding-block: 14px; }
.pw136-site .brief-news article > span { font-size: 11px; color: var(--soft); min-width: 42px; }
.pw136-site .brief-news article > a { font-size: 14px; }
.pw136-site .brief-news article > a:hover { color: var(--accent); }
.pw136-site .dungeon-shortcuts { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 32px; padding-block: 16px 28px; border-top: 1px solid var(--line); }
.pw136-site .dungeon-shortcuts > span { font-size: 12px; color: var(--soft); margin-right: 8px; }
.pw136-site .dungeon-shortcuts a { display: inline-flex; align-items: center; min-height: 44px; font-size: 14px; }
.pw136-site .dungeon-shortcuts a:hover { color: var(--accent); }
.pw136-site .dungeon-shortcuts .quiet-download { margin-left: auto; color: var(--accent); }
.pw136-site .compact-footer { padding-block: 24px; }
.pw136-site .compact-footer #demo-note { display: block; font-size: 11px; color: var(--soft); max-width: 44ch; }
.pw136-site .about-overview { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 48px; padding-block: 36px; }
.pw136-site .about-overview h1 { margin-top: 16px; font-size: 42px; }
.pw136-site .about-overview p:not(.eyebrow) { color: var(--muted); font-size: 16px; margin-top: 16px; }
.pw136-site .about-overview nav { display: flex; flex-wrap: wrap; gap: 8px 24px; margin-top: 20px; }
.pw136-site .about-overview nav a { min-height: 44px; display: inline-flex; align-items: center; border-bottom: 1px solid var(--accent-line); font-size: 13px; }
.pw136-site .about-overview nav a:hover { color: var(--accent); }
.pw136-site .about-overview > img { width: 100%; height: 236px; object-fit: cover; object-position: 50% 46%; border-radius: 6px; }
.pw136-site .character-catalog { padding-block: 12px 40px; }
.pw136-site .catalog-heading { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; margin-bottom: 24px; }
.pw136-site .catalog-heading h2 { font-size: 25px; }
.pw136-site .catalog-heading > span { color: var(--soft); font-size: 12px; }
.pw136-site .race-choices { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 40px; }
.pw136-site .race-group { min-width: 0; }
.pw136-site .race-group-title { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding-bottom: 16px; }
.pw136-site .race-group-title h3 { font-size: 21px; }
.pw136-site .race-group-title > span { color: var(--soft); font-size: 12px; }
.pw136-site .class-choice { border-top: 1px solid var(--line); }
.pw136-site .class-choice:last-child { border-bottom: 1px solid var(--line); }
.pw136-site .class-choice summary { display: flex; align-items: center; gap: 16px; min-height: 88px; cursor: pointer; list-style: none; }
.pw136-site .class-choice summary::-webkit-details-marker, .pw136-site .guide-entry summary::-webkit-details-marker { display: none; }
.pw136-site .class-choice summary::after, .pw136-site .guide-entry summary::after { content: '+'; flex-shrink: 0; width: 18px; margin-left: auto; color: var(--soft); font-size: 20px; text-align: center; }
.pw136-site .class-choice[open] summary::after, .pw136-site .guide-entry[open] summary::after { content: '−'; color: var(--accent); }
.pw136-site .class-choice summary img { flex-shrink: 0; width: 44px; height: 44px; }
.pw136-site .class-choice summary strong { display: block; font: 500 18px/1.3 var(--heading); }
.pw136-site .class-choice summary small { display: block; font-size: 12px; color: var(--soft); margin-top: 4px; }
.pw136-site .class-choice summary:hover strong { color: var(--accent); }
.pw136-site .class-choice > p { color: var(--muted); font-size: 14px; padding: 0 24px 20px 60px; max-width: 64ch; }
.pw136-site .guide-band { background: var(--surface); border-block: 1px solid var(--line); padding-block: 36px; }
.pw136-site .guide-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; }
.pw136-site .guide-columns > section { min-width: 0; }
.pw136-site .guide-entry { min-width: 0; border-top: 1px solid var(--line); scroll-margin-top: 24px; }
.pw136-site .guide-entry:last-child { border-bottom: 1px solid var(--line); }
.pw136-site .guide-entry summary { display: flex; align-items: center; gap: 20px; min-height: 60px; padding-block: 12px; cursor: pointer; list-style: none; }
.pw136-site .guide-entry summary > span { font-size: 16px; }
.pw136-site .guide-entry summary small { margin-left: auto; font-size: 12px; color: var(--soft); text-align: right; }
.pw136-site .guide-entry summary::after { margin-left: 0; }
.pw136-site .guide-entry summary:hover > span { color: var(--accent); }
.pw136-site .guide-body { padding: 0 38px 24px 0; color: var(--muted); font-size: 14px; }
.pw136-site .guide-body > p { max-width: 88ch; }
.pw136-site .guide-body > p + p { margin-top: 16px; }
.pw136-site .guide-facts { display: flex; flex-wrap: wrap; gap: 8px; }
.pw136-site .guide-facts > span { min-width: 32px; padding: 3px 8px; border: 1px solid var(--line-strong); border-radius: 3px; color: var(--accent); text-align: center; }
.pw136-site .mode-table { width: 100%; border-collapse: collapse; margin-top: 16px; text-align: left; font-size: 14px; }
.pw136-site .mode-table caption { text-align: left; font-size: 12px; color: var(--soft); padding-bottom: 8px; }
.pw136-site .mode-table th, .pw136-site .mode-table td { padding: 8px 12px; border-bottom: 1px solid var(--line); }
.pw136-site .mode-table th { font-weight: 400; color: var(--soft); font-size: 11px; }
.pw136-site .mode-table td:last-child, .pw136-site .mode-table th:last-child { text-align: right; }
.pw136-site .mode-table td:last-child { color: var(--accent); }
.pw136-site .guide-list { list-style: none; padding: 0; margin: 0 0 16px; }
.pw136-site .guide-list li { display: flex; justify-content: space-between; gap: 20px; padding-block: 6px; }
.pw136-site .guide-list strong { font-weight: 400; color: var(--text); }
.pw136-site .server-conditions { display: flex; align-items: flex-start; gap: 48px; padding-block: 32px; }
.pw136-site .server-conditions > details { flex: 1; min-width: 0; border-bottom: 1px solid var(--line); }
.pw136-site .server-conditions > .button { margin-block: 4px; flex-shrink: 0; }
.pw136-site .conditions-list > div { display: grid; grid-template-columns: 150px 1fr; gap: 24px; padding-block: 10px; border-bottom: 1px solid var(--line); }
.pw136-site .conditions-list dt { color: var(--soft); }
.pw136-site .historical-note { font-size: 12px; color: var(--soft); margin-top: 16px; }
.pw136-site .install-compact { padding-block: 32px; }
.pw136-site .install-compact h2 { margin-bottom: 24px; font-size: 25px; }
.pw136-site .install-compact .install-steps { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 32px; }
.pw136-site .install-compact .install-steps li { gap: 14px; }
.pw136-site .install-compact .install-steps p { font-size: 14px; max-width: 30ch; }
.pw136-site .launch-tools { display: flex; align-items: center; gap: 40px; padding-block: 20px 32px; border-top: 1px solid var(--line); }
.pw136-site .launch-tools h2 { font: 16px var(--heading); letter-spacing: 0; }
.pw136-site .launch-tools p { color: var(--soft); font-size: 11px; margin-top: 6px; }
.pw136-site .launch-tools nav { display: flex; flex-wrap: wrap; gap: 24px; }
.pw136-site .launch-tools nav a { display: inline-flex; align-items: center; min-height: 44px; font-size: 14px; color: var(--muted); text-decoration: underline; text-underline-offset: 5px; }
.pw136-site .launch-tools .support-link { min-height: 44px; display: inline-flex; align-items: center; margin-left: auto; color: var(--accent); font-size: 14px; }
@media (min-width: 2400px) {
.pw136-site .home-dashboard { gap: 64px; }
.pw136-site .world-preview { min-height: 376px; }
.pw136-site .preview-content h2 { font-size: 36px; }
.pw136-site .dashboard-heading h2 { font-size: 25px; }
.pw136-site .live-register dd { font-size: 18px; }
.pw136-site .brief-news article > a, .pw136-site .ranking-links, .pw136-site .dungeon-shortcuts a { font-size: 16px; }
.pw136-site .class-choice summary strong { font-size: 20px; }
.pw136-site .class-choice summary small, .pw136-site .guide-entry summary small { font-size: 14px; }
.pw136-site .guide-entry summary > span { font-size: 18px; }
}
@media (min-width: 921px) and (max-width: 1280px) {
.pw136-site .header-inner { gap: 16px; }
.pw136-site .header-action { display: inline-flex; padding-inline: 12px; font-size: 13px; white-space: nowrap; }
.pw136-site .main-nav { gap: 20px; }
.pw136-site .main-nav a { font-size: 13px; }
}
@media (max-width: 1024px) {
.pw136-site .home-dashboard { gap: 32px; grid-template-columns: 1fr 1fr; padding-block: 32px; }
.pw136-site .preview-content { inset-inline: 24px; bottom: 24px; }
.pw136-site .preview-content h2 { font-size: 27px; }
.pw136-site .preview-links { gap: 8px; }
.pw136-site .preview-links a { padding-inline: 12px; font-size: 13px; }
.pw136-site .dashboard-heading h2 { font-size: 20px; }
.pw136-site .live-register { gap: 16px; }
.pw136-site .live-register dd { font-size: 14px; }
.pw136-site .brief-news article { gap: 12px; }
.pw136-site .dungeon-shortcuts { gap: 4px 24px; }
.pw136-site .dungeon-shortcuts .quiet-download { margin-left: 0; }
.pw136-site .about-overview { gap: 32px; }
.pw136-site .about-overview h1 { font-size: 36px; }
.pw136-site .race-choices { gap: 24px; }
.pw136-site .race-group-title { display: block; }
.pw136-site .race-group-title > span { display: block; margin-top: 4px; }
.pw136-site .guide-columns { gap: 32px; }
.pw136-site .guide-entry summary { gap: 12px; }
.pw136-site .guide-entry summary small { font-size: 11px; }
.pw136-site .server-conditions { gap: 32px; }
.pw136-site .install-compact .install-steps { grid-template-columns: 1fr 1fr; gap: 24px 32px; }
.pw136-site .launch-tools { flex-wrap: wrap; gap: 12px 32px; }
}
@media (max-width: 920px) {
.pw136-site .main-nav .mobile-account { display: flex; color: var(--accent); }
}
@media (max-width: 760px) {
.pw136-site .home-dashboard { grid-template-columns: 1fr; gap: 28px; }
.pw136-site .world-preview { min-height: 280px; }
.pw136-site .server-dashboard { gap: 24px; }
.pw136-site .dungeon-shortcuts { gap: 4px 24px; padding-block: 16px 24px; }
.pw136-site .dungeon-shortcuts > span { width: 100%; }
.pw136-site .compact-footer #demo-note { order: 4; width: 100%; max-width: none; }
.pw136-site .compact-footer .footer-main nav { order: 2; width: 100%; gap: 0 20px; }
.pw136-site .compact-footer .footer-main { justify-content: flex-start; }
.pw136-site .about-overview { grid-template-columns: 1fr; gap: 24px; padding-block: 28px; }
.pw136-site .about-overview > img { height: 200px; }
.pw136-site .about-overview h1 { font-size: 36px; }
.pw136-site .character-catalog { padding-bottom: 32px; }
.pw136-site .race-choices { grid-template-columns: 1fr; gap: 24px; }
.pw136-site .race-group-title { display: flex; padding-bottom: 12px; }
.pw136-site .race-group-title > span { margin: 0; }
.pw136-site .class-choice summary { min-height: 80px; }
.pw136-site .class-choice > p { padding-right: 16px; }
.pw136-site .guide-columns { grid-template-columns: 1fr; gap: 32px; }
.pw136-site .guide-band { padding-block: 28px; }
.pw136-site .catalog-heading { margin-bottom: 20px; }
.pw136-site .catalog-heading h2 { font-size: 24px; }
.pw136-site .server-conditions { flex-direction: column; gap: 20px; padding-block: 28px; }
.pw136-site .server-conditions > details { width: 100%; }
.pw136-site .server-conditions > .button { width: 100%; }
.pw136-site .conditions-list > div { grid-template-columns: 100px 1fr; gap: 16px; }
.pw136-site .launch-tools { gap: 12px 24px; padding-bottom: 24px; }
.pw136-site .launch-tools > div { width: 100%; }
.pw136-site .launch-tools .support-link { margin-left: 0; }
}
@media (max-width: 480px) {
.pw136-site .world-preview { min-height: 252px; }
.pw136-site .preview-content { inset-inline: 20px; bottom: 20px; }
.pw136-site .preview-content h2 { font-size: 26px; }
.pw136-site .preview-links { margin-top: 20px; }
.pw136-site .preview-links a { font-size: 12px; padding-inline: 12px; }
.pw136-site .live-register { grid-template-columns: 1fr 1.2fr; gap: 12px; }
.pw136-site .ranking-links { gap: 20px; }
.pw136-site .brief-news article > a { font-size: 13px; }
.pw136-site .catalog-heading > span { font-size: 11px; }
.pw136-site .guide-body { padding-right: 0; }
.pw136-site .guide-entry summary > span { font-size: 15px; }
.pw136-site .guide-entry summary { gap: 10px; }
.pw136-site .about-overview h1 { font-size: 34px; }
.pw136-site .install-compact .install-steps { grid-template-columns: 1fr; gap: 20px; }
.pw136-site .launch-tools nav { gap: 20px; }
}

/* Community content: a visible counter, populated rankings and editorial news. */
.pw136-site .home-feed { display: grid; grid-template-columns: minmax(0, 1.85fr) minmax(340px, 1fr); gap: 56px; padding-block: 56px 48px; }
.pw136-site .home-feed > *, .pw136-site .news-entry > * { min-width: 0; }
.pw136-site .feed-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 24px; }
.pw136-site .feed-heading h2 { margin-top: 8px; font-size: 32px; }
.pw136-site .sample-label { color: var(--soft); font-size: 12px; line-height: 1.5; }
.pw136-site .news-list { border-top: 1px solid var(--line); }
.pw136-site .news-entry { display: grid; grid-template-columns: minmax(180px, .8fr) minmax(0, 1.2fr); gap: 28px; padding-block: 20px; border-bottom: 1px solid var(--line); align-items: center; }
.pw136-site .news-image { display: block; overflow: hidden; height: 148px; border-radius: 4px; background: var(--surface); }
.pw136-site .news-image img { width: 100%; height: 100%; object-fit: cover; transition: transform 240ms ease; }
.pw136-site .news-image:hover img { transform: scale(1.035); }
.pw136-site .news-category { color: var(--accent); font-size: 11px; text-transform: uppercase; letter-spacing: 1.2px; }
.pw136-site .news-copy h3 { margin-top: 10px; font-size: 23px; line-height: 1.25; }
.pw136-site .news-copy h3 a:hover { color: var(--accent); }
.pw136-site .news-copy p { margin-top: 12px; max-width: 48ch; color: var(--muted); font-size: 14px; line-height: 1.65; }
.pw136-site .all-news { display: inline-flex; align-items: center; min-height: 44px; margin-top: 8px; color: var(--accent); font-size: 14px; }
.pw136-site .community-sidebar { display: flex; flex-direction: column; gap: 24px; }
.pw136-site .online-widget { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 20px; padding: 24px 28px; background: var(--raised); border-top: 2px solid var(--accent-line); }
.pw136-site .online-widget h2 { font-size: 20px; margin-bottom: 6px; }
.pw136-site .online-count { display: flex; align-items: baseline; gap: 10px; }
.pw136-site .online-count strong { font: 500 54px/1 var(--heading); color: var(--accent); letter-spacing: -.04em; font-variant-numeric: tabular-nums; }
.pw136-site .online-count > span { color: var(--muted); font-size: 12px; }
.pw136-site .snapshot-note { grid-column: 1 / -1; color: var(--soft); font-size: 11px; border-top: 1px solid var(--line); padding-top: 14px; }
.pw136-site .ranking-board { padding: 28px; background: var(--surface); min-width: 0; }
.pw136-site .rank-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 20px; margin-bottom: 24px; }
.pw136-site .rank-heading h2 { font-size: 24px; }
.pw136-site .rank-heading > span { color: var(--soft); font-size: 12px; }
.pw136-site .ranking-tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--line-strong); margin-bottom: 12px; }
.pw136-site .ranking-tabs button { flex: 1; min-height: 44px; border: 0; border-bottom: 2px solid transparent; background: transparent; color: var(--muted); font-size: 14px; cursor: pointer; }
.pw136-site .ranking-tabs button:hover { background: var(--hover); color: var(--text); }
.pw136-site .ranking-tabs button[aria-selected="true"] { color: var(--accent); border-bottom-color: var(--accent); background: var(--hover); }
.pw136-site .ranking-panel { min-width: 0; }
.pw136-site .ranking-panel > h3 { padding-block: 16px; font-size: 18px; }
.pw136-site .rank-table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 14px; }
.pw136-site .rank-table caption, .pw136-site .ranking-board.is-enhanced .ranking-panel > h3 { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.pw136-site .rank-table th, .pw136-site .rank-table td { text-align: left; vertical-align: middle; padding: 13px 6px; border-bottom: 1px solid var(--line); font-weight: 400; overflow-wrap: anywhere; }
.pw136-site .rank-table thead th { font-size: 11px; color: var(--soft); padding-block: 10px; }
.pw136-site .rank-table th:first-child, .pw136-site .rank-table td:first-child { width: 32px; color: var(--soft); padding-left: 0; font-variant-numeric: tabular-nums; }
.pw136-site .rank-table th:last-child, .pw136-site .rank-table td:last-child { text-align: right; width: 78px; padding-right: 0; font-variant-numeric: tabular-nums; }
.pw136-site .rank-table tbody tr:first-child th { color: var(--accent); }
.pw136-site .guild-table th:nth-child(3), .pw136-site .guild-table td:nth-child(3), .pw136-site .guild-table th:last-child, .pw136-site .guild-table td:last-child { width: 46px; text-align: right; }
.pw136-site .ranking-source { margin-top: 20px; font-size: 11px; color: var(--soft); }
.pw136-site .ranking-more { display: inline-flex; min-height: 44px; align-items: center; color: var(--accent); font-size: 13px; }
.pw136-site .world-strip { position: relative; isolation: isolate; overflow: hidden; display: flex; justify-content: space-between; align-items: center; gap: 32px; min-height: 240px; padding: 32px 40px; margin-bottom: 48px; background: var(--surface); border-radius: 5px; }
/* кадр гравця 18.10 (сакура й летючий дракон, вибір власника 31.10.2026): у смузі видно гору, дракона й сакуру */
.pw136-site .world-strip > img { position: absolute; inset: 0; width: 100%; height: 100%; z-index: -2; object-fit: cover; object-position: 50% 34%; }
.pw136-site .world-strip::after { position: absolute; content: ''; inset: 0; z-index: -1; background: linear-gradient(90deg,rgb(var(--shade) / .94),rgb(var(--shade) / .28) 54%,rgb(var(--shade) / .9)); }
.pw136-site .world-strip-copy h2 { margin-top: 12px; font-size: 30px; }
.pw136-site .world-strip-copy > div { margin-top: 24px; display: flex; align-items: center; flex-wrap: wrap; gap: 28px; }
.pw136-site .world-strip-links { display: grid; grid-template-columns: 1fr 1fr; gap: 0 36px; }
.pw136-site .world-strip-links a { display: flex; min-height: 44px; align-items: center; font-size: 14px; color: var(--text); }
.pw136-site .world-strip-links a:hover { color: var(--accent); text-decoration: underline; text-underline-offset: 4px; }
.pw136-site .antivirus-note { border-top: 1px solid var(--line-strong); padding-block: 28px; }
.pw136-site .antivirus-heading { display: flex; align-items: flex-start; gap: 20px; }
.pw136-site .utility-symbol { display: grid; place-items: center; flex: 0 0 36px; width: 36px; height: 36px; border: 1px solid var(--accent-line); border-radius: 50%; font-size: 20px; color: var(--accent); }
.pw136-site .antivirus-heading h2 { font-size: 19px; }
.pw136-site .antivirus-heading p { margin-top: 6px; font-size: 14px; color: var(--muted); }
.pw136-site .antivirus-details { margin-left: 56px; font-size: 14px; max-width: 90ch; }
.pw136-site .antivirus-details summary { display: list-item; width: fit-content; padding-block: 12px; cursor: pointer; color: var(--accent); }
.pw136-site .antivirus-details ol { margin: 8px 0 12px; padding-left: 20px; color: var(--muted); }
.pw136-site .antivirus-details li + li { margin-top: 8px; }
.pw136-site .antivirus-details p { margin-bottom: 12px; color: var(--soft); font-size: 13px; }
@media (min-width: 2400px) {
  .pw136-site .home-feed { grid-template-columns: minmax(0, 2.1fr) minmax(420px, 1fr); gap: 72px; padding-top: 64px; }
  .pw136-site .news-image { height: 170px; }
  .pw136-site .news-copy h3 { font-size: 26px; }
  .pw136-site .news-copy p { font-size: 16px; }
  .pw136-site .rank-table { font-size: 16px; }
}
@media (max-width: 1280px) {
  .pw136-site .home-feed { gap: 32px; grid-template-columns: minmax(0, 1.7fr) minmax(310px, 1fr); }
  .pw136-site .news-entry { grid-template-columns: 170px minmax(0,1fr); gap: 20px; }
  .pw136-site .news-copy h3 { font-size: 20px; }
  .pw136-site .online-widget, .pw136-site .ranking-board { padding: 20px; }
  .pw136-site .online-count strong { font-size: 46px; }
  .pw136-site .online-count { gap: 6px; }
}
@media (max-width: 1024px) {
  .pw136-site .home-feed { padding-top: 40px; }
  .pw136-site .feed-heading { align-items: flex-start; flex-direction: column; gap: 8px; }
  .pw136-site .news-entry { grid-template-columns: 140px minmax(0,1fr); gap: 20px; }
  .pw136-site .news-image { height: 140px; }
  .pw136-site .news-copy p { font-size: 13px; }
  .pw136-site .world-strip { padding: 28px; }
  .pw136-site .world-strip-links { grid-template-columns: 1fr; gap: 0; }
}
@media (max-width: 760px) {
  .pw136-site .home-feed { grid-template-columns: 1fr; gap: 32px; padding-block: 32px; }
  .pw136-site .feed-heading { flex-direction: row; align-items: center; }
  .pw136-site .feed-heading h2 { font-size: 26px; }
  .pw136-site .news-entry { grid-template-columns: minmax(112px,.6fr) minmax(0,1fr); gap: 20px; }
  .pw136-site .news-image { height: 142px; }
  .pw136-site .community-sidebar { display: grid; grid-template-columns: 1fr 1.35fr; align-items: start; gap: 20px; }
  .pw136-site .online-widget { grid-template-columns: 1fr; }
  .pw136-site .world-strip { min-height: 250px; margin-bottom: 32px; }
  .pw136-site .world-strip-copy h2 { font-size: 26px; }
  .pw136-site .world-strip-links { display: none; }
}
@media (max-width: 480px) {
  .pw136-site .feed-heading { flex-direction: column; align-items: flex-start; }
  .pw136-site .news-entry { grid-template-columns: 112px minmax(0,1fr); gap: 16px; padding-block: 16px; }
  .pw136-site .news-image { height: 140px; }
  .pw136-site .news-copy h3 { font-size: 18px; margin-top: 6px; }
  .pw136-site .news-copy p { font-size: 14px; line-height: 1.55; margin-top: 8px; }
  .pw136-site .news-category { font-size: 10px; letter-spacing: .6px; }
  .pw136-site .community-sidebar { display: flex; }
  .pw136-site .online-widget { grid-template-columns: 1fr auto; }
  .pw136-site .world-strip { padding: 24px; }
  .pw136-site .antivirus-details { margin-left: 0; }
}

/* Location images link to the native, independently readable guide entries. */
.pw136-site .location-gallery { padding-block: 8px 40px; }
.pw136-site .location-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 24px; }
.pw136-site .location-tile { display: block; min-width: 0; border-bottom: 1px solid var(--line); }
.pw136-site .location-shot { position: relative; aspect-ratio: 16 / 10; overflow: hidden; background: var(--raised); border-radius: 4px; }
.pw136-site .location-shot img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.pw136-site .location-shot--cube img { object-position: center top; }
.pw136-site .location-shot--twilight img { left: auto; right: 0; width: 122%; max-width: none; }
.pw136-site .location-caption { padding-block: 18px 20px; }
.pw136-site .location-caption h3 { font-size: 21px; line-height: 1.3; }
.pw136-site .location-caption span { display: block; margin-top: 6px; color: var(--soft); font-size: 13px; }
.pw136-site .location-tile:hover h3 { color: var(--accent); }
.pw136-site .location-tile:hover { border-bottom-color: var(--accent); }
@media (min-width: 2400px) {
  .pw136-site .location-grid { gap: 32px; }
  .pw136-site .location-shot { aspect-ratio: 16 / 9; }
}
@media (max-width: 1280px) {
  .pw136-site .location-grid { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 24px; }
  .pw136-site .location-shot { aspect-ratio: 16 / 9; }
}
@media (max-width: 540px) {
  .pw136-site .location-grid { grid-template-columns: 1fr; gap: 24px; }
  .pw136-site .location-caption { padding-block: 14px 16px; }
  .pw136-site .location-caption h3 { font-size: 20px; }
  .pw136-site .location-gallery { padding-bottom: 32px; }
}

/* ERA PW: shared wordmark and editorial news. The accepted hero stays unchanged. */
.pw136-site .brand-name { font-size: 23px; line-height: 1; letter-spacing: 3px; }
.pw136-site .brand-pw { color: var(--accent); }
.pw136-site .brand-name small { font-size: 10px; letter-spacing: .5px; margin-top: 8px; }
.pw136-site .main-nav a:focus-visible { color: var(--text); }
.pw136-site .main-nav a:focus-visible::after { transform: scaleX(1); }
.pw136-site .all-news { gap: 20px; }
.pw136-site .all-news:hover, .pw136-site .all-news:focus-visible { color: var(--accent-hover); }
.pw136-site .news-copy h3 a:focus-visible, .pw136-site .location-tile:focus-visible h3 { color: var(--accent); }
.pw136-site .news-image:focus-visible { outline-offset: 4px; }
.pw136-site .location-tile:focus-visible { border-bottom-color: var(--accent); }
.pw136-site .download-mirrors > a:focus-visible, .pw136-site .header-action:focus-visible { background: var(--hover); border-color: var(--accent); }
.pw136-site .news-intro { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; padding-block: 40px 32px; }
.pw136-site .news-intro h1 { margin-top: 12px; font-size: 44px; }
.pw136-site .news-intro-lead { margin-top: 16px; color: var(--muted); font-size: 16px; }
.pw136-site .news-intro > .sample-label { padding-block: 6px; }
.pw136-site .lead-story { display: grid; grid-template-columns: minmax(0,1.45fr) minmax(0,1fr); overflow: hidden; border: 1px solid var(--line-strong); border-radius: 6px; background: var(--surface); }
.pw136-site .story-cover { display: block; position: relative; overflow: hidden; background: var(--surface); }
.pw136-site .story-cover img { width: 100%; height: 100%; object-fit: cover; }
.pw136-site .story-cover:focus-visible { outline-offset: -6px; }
.pw136-site .lead-story > .story-cover { min-height: 380px; }
.pw136-site .lead-story > .story-cover img { position: absolute; inset: 0; object-position: 58% 50%; }
.pw136-site .cover-location { position: absolute; left: 24px; bottom: 24px; padding: 6px 12px; background: var(--bg); border-left: 2px solid var(--accent); color: var(--text); font-size: 12px; }
.pw136-site .lead-story-copy { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; min-width: 0; padding: clamp(28px,3vw,64px); }
.pw136-site .lead-story h2 { margin-top: 16px; max-width: 20ch; font-size: clamp(28px,2.35vw,42px); line-height: 1.16; }
.pw136-site .lead-story h2 a:hover, .pw136-site .secondary-story h2 a:hover, .pw136-site .lead-story h2 a:focus-visible, .pw136-site .secondary-story h2 a:focus-visible { color: var(--accent); }
.pw136-site .lead-story-copy > p { margin-top: 20px; color: var(--muted); max-width: 48ch; font-size: 16px; }
.pw136-site .story-read { display: inline-flex; align-items: center; gap: 24px; min-height: 44px; margin-top: 24px; color: var(--accent); font-size: 14px; }
.pw136-site .story-read > span { font-size: 21px; }
.pw136-site .story-read:hover, .pw136-site .story-read:focus-visible { color: var(--accent-hover); text-decoration: underline; text-underline-offset: 5px; }
.pw136-site .secondary-stories { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 40px; padding-top: 32px; }
.pw136-site .secondary-story { display: grid; grid-template-columns: minmax(0,.95fr) minmax(0,1.05fr); gap: 28px; border-bottom: 1px solid var(--line); padding-bottom: 32px; }
.pw136-site .secondary-story > * { min-width: 0; }
.pw136-site .secondary-story .story-cover { min-height: 220px; border-radius: 4px; }
.pw136-site .secondary-story .story-cover img { position: absolute; inset: 0; }
.pw136-site .secondary-story h2 { margin-top: 12px; font-size: 26px; line-height: 1.2; }
.pw136-site .secondary-story-copy > p { margin-top: 16px; max-width: 44ch; color: var(--muted); font-size: 14px; }
.pw136-site .secondary-story .story-read { margin-top: 16px; }
.pw136-site .editorial-cta { display: flex; align-items: center; justify-content: space-between; gap: 32px; padding-block: 36px 44px; }
.pw136-site .editorial-cta h2 { margin-top: 12px; font-size: 26px; }
.pw136-site .editorial-cta .button { flex-shrink: 0; }
.pw136-site .article-heading { padding-block: 24px 32px; max-width: 1000px; }
.pw136-site .back-link { display: inline-flex; align-items: center; min-height: 44px; gap: 16px; font-size: 13px; color: var(--muted); }
.pw136-site .back-link:hover, .pw136-site .back-link:focus-visible { color: var(--accent); }
.pw136-site .back-link > span { font-size: 20px; color: var(--accent); }
.pw136-site .article-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 12px 24px; margin-top: 20px; }
.pw136-site .article-meta .sample-label { padding-left: 24px; border-left: 1px solid var(--line); }
.pw136-site .article-heading h1 { margin-top: 16px; font-size: 44px; line-height: 1.14; max-width: 27ch; }
.pw136-site .article-deck { margin-top: 20px; max-width: 70ch; font-size: 18px; line-height: 1.6; color: var(--muted); }
.pw136-site .article-cover { position: relative; overflow: hidden; background: var(--surface); border-radius: 5px; }
.pw136-site .article-cover > img { width: 100%; height: clamp(280px,26vw,500px); object-fit: cover; object-position: 55% 50%; }
.pw136-site .article-cover > figcaption { position: absolute; bottom: 20px; left: 24px; padding: 6px 12px; background: var(--bg); color: var(--muted); font-size: 12px; border-left: 2px solid var(--accent); }
.pw136-site .article-layout { display: grid; grid-template-columns: minmax(0,1fr) minmax(280px,.4fr); grid-template-areas: "body contents" "body related"; grid-template-rows: auto 1fr; column-gap: clamp(40px,5vw,120px); row-gap: 32px; padding-block: 44px 16px; }
.pw136-site .article-body { grid-area: body; min-width: 0; max-width: 84ch; margin-inline: 0; width: 100%; }
.pw136-site .article-lead { font-size: 19px; line-height: 1.75; color: var(--text); }
.pw136-site .article-body > section { margin-top: 36px; scroll-margin-top: 24px; }
.pw136-site .article-body h2 { padding-left: 18px; border-left: 3px solid var(--accent); font-size: 26px; line-height: 1.25; }
.pw136-site .article-body h2 + p { margin-top: 20px; }
.pw136-site .article-body section > p:not(.article-caption) { color: var(--body); font-size: 16px; line-height: 1.8; }
.pw136-site .article-body section > p + p { margin-top: 16px; }
.pw136-site .article-body .inline-link { display: inline-flex; min-height: 44px; align-items: center; margin-top: 8px; font-size: 14px; }
.pw136-site .article-body .article-lead .inline-link { display: inline; min-height: 0; margin-top: 0; font-size: inherit; }
.pw136-site .article-facts { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; margin-top: 24px; padding-block: 20px; border-block: 1px solid var(--line); }
.pw136-site .article-facts dt { font-size: 12px; color: var(--soft); }
.pw136-site .article-facts dd { margin-top: 8px; color: var(--accent); font: 500 32px/1.2 var(--heading); font-variant-numeric: tabular-nums; }
.pw136-site .article-note { margin-top: 24px; padding: 20px 24px; border-left: 2px solid var(--accent); background: var(--surface); }
.pw136-site .article-note > strong { font: 600 16px/1.4 var(--heading); }
.pw136-site .article-note p { margin-top: 8px; color: var(--muted); font-size: 14px; line-height: 1.7; }
.pw136-site .article-modes { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 20px; padding: 20px 0; margin-top: 24px; border-block: 1px solid var(--line); }
.pw136-site .article-modes dt { color: var(--muted); font-size: 13px; }
.pw136-site .article-modes dd { margin-top: 8px; color: var(--accent); font: 500 24px/1.25 var(--heading); }
.pw136-site .article-caption { margin-top: 12px; color: var(--soft); font-size: 12px; }
.pw136-site .article-destinations { margin-top: 24px; }
.pw136-site .article-destinations > div { padding: 20px 0; border-top: 1px solid var(--line); }
.pw136-site .article-destinations h3 { font-size: 19px; }
.pw136-site .article-destinations p { margin-top: 8px; color: var(--muted); font-size: 15px; line-height: 1.75; }
.pw136-site .article-steps { padding-left: 24px; margin-block: 24px 0; }
.pw136-site .article-steps li { padding-left: 8px; }
.pw136-site .article-steps li + li { margin-top: 24px; }
.pw136-site .article-steps li::marker { color: var(--accent); font-variant-numeric: tabular-nums; }
.pw136-site .article-steps strong { font-family: var(--heading); font-weight: 600; }
.pw136-site .article-steps p { margin-top: 8px; color: var(--muted); font-size: 15px; line-height: 1.75; }
/* Картки посібників у статті (новина «Про сервер», 31.10.2026): ті самі клікабельні картки, що на «Про сервер»
   (a.dungeon-card.event-card, стандарт наведення приходить сам), лише кадр, мітка й назва без опису. Під ними
   плитки-посилання на інші розділи сторінки. */
.pw136-site .article-guides { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 12px; margin-top: 24px; }
/* кадр завжди зверху: на планшеті картки підземель «Про сервер» стають рядками з кадром ліворуч, у статті — ні */
.pw136-site .article-guides .dungeon-card { display: flex; flex-direction: column; }
.pw136-site .article-guides .dungeon-card > img { height: auto; border-right: 0; border-bottom: 1px solid rgb(255 122 26 / .2); }
.pw136-site .article-guides .dungeon-copy { justify-content: flex-start; gap: 8px; padding: 12px 14px 14px; }
.pw136-site .article-guides .dungeon-copy h3 { font-size: 17px; line-height: 1.3; }
.pw136-site .article-guides .event-more { margin-top: auto; padding-top: 2px; font-size: 13px; }
.pw136-site .article-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 24px; }
.pw136-site .article-links > a { display: flex; flex-direction: column; gap: 4px; padding: 14px 18px; border: 1px solid rgb(255 122 26 / .16); border-radius: 12px; background: var(--surface); color: inherit; transition: border-color 180ms cubic-bezier(.4,0,.2,1); }
.pw136-site .article-links strong { font: 600 16px/1.35 var(--heading); transition: color 180ms cubic-bezier(.4,0,.2,1); }
.pw136-site .article-links span { color: var(--muted); font-size: 13px; line-height: 1.5; }
.pw136-site .article-links > a:hover, .pw136-site .article-links > a:focus-visible { border-color: rgb(255 122 26 / .55); }
.pw136-site .article-links > a:hover strong, .pw136-site .article-links > a:focus-visible strong { color: var(--accent-hover); }
/* Новини ERA в одному вигляді з постом «Про сервер» (31.10.2026): п’єдестал нагород (перше місце в центрі й вище),
   класи значками, готові блоки «Про сервер» і «Завантаження» (рейти, параметри, кроки, компоненти, марафони) у
   колонці статті. */
.pw136-site .article-body .rate-cards, .pw136-site .article-body .param-cards,
.pw136-site .article-body .component-list, .pw136-site .article-body .marathon-cards, .pw136-site .article-body .steps { margin-top: 20px; }
.pw136-site .article-body .rate-cards + .param-cards { margin-top: 12px; }
.pw136-site .article-body .param-cards, .pw136-site .article-body .component-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; }
.pw136-site .article-podium { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: end; gap: 12px; margin: 20px 0 0; padding: 0; list-style: none; }
.pw136-site .article-podium > li { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 20px 12px; border: 1px solid rgb(255 122 26 / .16); border-radius: 12px; background: radial-gradient(120% 90% at 50% 0%, rgb(255 120 40 / .1), transparent 60%), var(--surface); text-align: center; }
.pw136-site .article-podium > li:nth-child(1) { order: 2; padding-block: 32px; border-color: rgb(255 195 90 / .45); background: radial-gradient(120% 90% at 50% 0%, rgb(255 195 90 / .16), transparent 65%), var(--surface); }
.pw136-site .article-podium > li:nth-child(2) { order: 1; }
.pw136-site .article-podium > li:nth-child(3) { order: 3; }
.pw136-site .podium-place { display: flex; align-items: baseline; gap: 6px; color: var(--accent); font: 700 32px/1 var(--heading); }
.pw136-site .podium-place small { color: var(--soft); font: 600 11px/1 var(--font); letter-spacing: 1px; text-transform: uppercase; }
.pw136-site .article-podium strong { color: var(--text); font: 700 24px/1.15 var(--heading); white-space: nowrap; }
.pw136-site .article-podium > li:nth-child(1) strong { color: #ffc35a; font-size: 30px; }
.pw136-site .article-podium > li > span:last-child { color: var(--muted); font-size: 14px; }
.pw136-site .article-classes { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; margin: 20px 0 0; padding: 0; list-style: none; }
.pw136-site .article-classes > li { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 14px 6px; border: 1px solid var(--line-strong); border-radius: 12px; background: rgb(0 0 0 / .25); text-align: center; }
.pw136-site .article-classes img { width: 44px; height: 44px; border: 1px solid rgb(255 122 26 / .22); border-radius: 8px; background: var(--bg); }
.pw136-site .article-classes strong { font: 600 14px/1.2 var(--heading); overflow-wrap: anywhere; }
.pw136-site .article-races .event-more { color: var(--muted); }
/* три раси — рівно три стовпці, без порожнього четвертого */
.pw136-site .article-guides.article-races { grid-template-columns: repeat(3, minmax(0, 1fr)); }
/* планшет: ряди без одинака в останньому рядку (компоненти списком, умови 3 або 2+2) */
@media (min-width: 601px) and (max-width: 1280px) {
  .pw136-site .article-body .component-list { grid-template-columns: minmax(0, 1fr); }
  .pw136-site .article-body .param-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pw136-site .article-body .param-cards:has(> li:nth-child(4)) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 1280px) {
  .pw136-site .article-classes { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pw136-site .article-podium strong { font-size: 20px; }
  .pw136-site .article-podium > li:nth-child(1) strong { font-size: 24px; }
}
@media (max-width: 600px) {
  .pw136-site .article-podium { grid-template-columns: minmax(0, 1fr); }
  .pw136-site .article-podium > li { order: 0 !important; padding-block: 16px; }
  .pw136-site .article-body .marathon-cards { grid-template-columns: minmax(0, 1fr); }
  .pw136-site .article-guides.article-races { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 600px) {
  .pw136-site .article-guides { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .pw136-site .article-guides .dungeon-copy { padding: 10px 12px 12px; }
  .pw136-site .article-guides .dungeon-copy h3 { font-size: 15px; }
  .pw136-site .article-links { grid-template-columns: minmax(0, 1fr); }
}
.pw136-site .article-end { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px; border-top: 1px solid var(--line); margin-top: 36px; padding-top: 16px; }
.pw136-site .article-end > span { color: var(--soft); font-size: 12px; }
.pw136-site .article-sidebar { grid-area: related; min-width: 0; align-self: start; }
.pw136-site .article-sidebar h2 { font-size: 18px; }
.pw136-site .article-contents { grid-area: contents; align-self: start; border-top: 2px solid var(--accent-line); padding: 24px; background: var(--surface); }
.pw136-site .article-contents h2 { margin-bottom: 12px; color: var(--soft); font: 600 12px/1.4 var(--heading); letter-spacing: 1px; text-transform: uppercase; }
.pw136-site .article-contents a { display: flex; align-items: center; padding-block: 10px; min-height: 44px; color: var(--muted); font-size: 14px; line-height: 1.5; border-top: 1px solid var(--line); }
.pw136-site .article-contents a:hover, .pw136-site .article-contents a:focus-visible { color: var(--accent); }
.pw136-site .related-stories { margin-top: 0; }
.pw136-site .related-stories h2 { margin-bottom: 20px; }
.pw136-site .related-story { display: grid; grid-template-columns: 112px minmax(0,1fr); gap: 16px; align-items: center; padding-block: 16px; border-top: 1px solid var(--line); }
.pw136-site .related-story > img { width: 112px; height: 84px; object-fit: cover; border-radius: 3px; }
.pw136-site .related-story small { display: block; margin-bottom: 8px; color: var(--accent); font-size: 10px; text-transform: uppercase; letter-spacing: .6px; }
.pw136-site .related-story strong { font: 500 17px/1.35 var(--heading); }
.pw136-site .related-story:hover strong, .pw136-site .related-story:focus-visible strong { color: var(--accent); }
.pw136-site.page-article, .pw136-site .news-archive { overflow-wrap: break-word; }
@media (min-width: 2400px) {
  .pw136-site .lead-story > .story-cover { min-height: 460px; }
  .pw136-site .secondary-stories { gap: 48px; padding-top: 40px; }
  .pw136-site .secondary-story { gap: 32px; }
  .pw136-site .secondary-story .story-cover { min-height: 260px; }
  .pw136-site .article-body { font-size: 18px; }
  .pw136-site .article-body section > p:not(.article-caption) { font-size: 18px; }
  .pw136-site .article-lead { font-size: 21px; }
}
@media (max-width: 1280px) {
  .pw136-site .secondary-story { grid-template-columns: 1fr; gap: 20px; }
  .pw136-site .secondary-story .story-cover { min-height: 0; aspect-ratio: 16 / 8; }
  .pw136-site .secondary-story h2 { font-size: 24px; }
  .pw136-site .secondary-story-copy > p { max-width: none; }
  .pw136-site .article-layout { grid-template-columns: minmax(0,1fr) 280px; gap: 40px; }
  .pw136-site .related-story { grid-template-columns: 84px minmax(0,1fr); gap: 12px; }
  .pw136-site .related-story > img { width: 84px; height: 76px; }
  .pw136-site .related-story strong { font-size: 15px; }
}
@media (max-width: 920px) {
  .pw136-site .news-intro h1, .pw136-site .article-heading h1 { font-size: 38px; }
  .pw136-site .lead-story { grid-template-columns: minmax(0,1.1fr) minmax(0,1fr); }
  .pw136-site .lead-story > .story-cover { min-height: 340px; }
  .pw136-site .lead-story-copy { padding: 24px; }
  .pw136-site .lead-story-copy > p { font-size: 14px; }
  .pw136-site .article-layout { grid-template-columns: 1fr; grid-template-areas: "contents" "body" "related"; grid-template-rows: auto; gap: 32px; padding-top: 32px; }
  .pw136-site .article-body { max-width: none; }
  .pw136-site .article-sidebar { display: block; }
  .pw136-site .article-contents { align-self: start; }
  .pw136-site .related-stories { margin-top: 0; }
}
@media (max-width: 600px) {
  .pw136-site .news-intro { align-items: flex-start; flex-direction: column; padding-block: 28px 24px; gap: 16px; }
  .pw136-site .news-intro h1, .pw136-site .article-heading h1 { font-size: 34px; }
  .pw136-site .news-intro-lead { margin-top: 12px; font-size: 14px; }
  .pw136-site .news-intro > .sample-label { padding-block: 0; }
  .pw136-site .lead-story { grid-template-columns: 1fr; }
  .pw136-site .lead-story > .story-cover { min-height: 0; aspect-ratio: 16 / 10; }
  .pw136-site .lead-story-copy { padding: 24px; }
  .pw136-site .lead-story h2 { font-size: 28px; }
  .pw136-site .lead-story-copy > p { margin-top: 16px; }
  .pw136-site .secondary-stories { grid-template-columns: 1fr; gap: 28px; padding-top: 28px; }
  .pw136-site .secondary-story { padding-bottom: 24px; }
  .pw136-site .secondary-story .story-cover { aspect-ratio: 16 / 9; }
  .pw136-site .secondary-story h2 { font-size: 24px; margin-top: 8px; }
  .pw136-site .secondary-story-copy > p { margin-top: 12px; }
  .pw136-site .story-read { margin-top: 16px; }
  .pw136-site .cover-location { left: 16px; bottom: 16px; font-size: 11px; }
  .pw136-site .editorial-cta { align-items: flex-start; flex-direction: column; gap: 24px; padding-block: 28px 32px; }
  .pw136-site .editorial-cta h2 { font-size: 24px; }
  .pw136-site .editorial-cta .button { width: 100%; }
  .pw136-site .article-heading { padding-block: 16px 24px; }
  .pw136-site .article-meta { margin-top: 12px; gap: 12px; }
  .pw136-site .article-meta .sample-label { padding-left: 12px; font-size: 11px; }
  .pw136-site .article-deck { font-size: 16px; margin-top: 16px; }
  .pw136-site .article-cover > img { height: 220px; }
  .pw136-site .article-cover > figcaption { left: 12px; bottom: 12px; font-size: 10px; padding: 4px 8px; }
  .pw136-site .article-lead { font-size: 17px; line-height: 1.7; }
  .pw136-site .article-body > section { margin-top: 28px; }
  .pw136-site .article-body h2 { font-size: 24px; padding-left: 14px; }
  .pw136-site .article-body section > p:not(.article-caption) { font-size: 15px; line-height: 1.75; }
  .pw136-site .article-facts { gap: 16px; }
  .pw136-site .article-facts dd { font-size: 28px; }
  .pw136-site .article-modes { grid-template-columns: 1fr 1fr; gap: 20px 24px; }
  .pw136-site .article-note { padding: 16px 20px; }
  .pw136-site .article-sidebar { display: block; }
  .pw136-site .related-stories { margin-top: 0; }
  .pw136-site .related-story { grid-template-columns: 112px minmax(0,1fr); gap: 16px; }
  .pw136-site .related-story > img { width: 112px; height: 84px; }
  .pw136-site .related-story strong { font-size: 17px; }
}
@media (prefers-reduced-motion: no-preference) {
  .pw136-site .news-intro, .pw136-site .article-heading { animation: era-page-enter 380ms ease-out both; }
  .pw136-site .story-cover img { transition: transform 280ms ease; }
  .pw136-site .story-cover:hover img, .pw136-site .story-cover:focus-visible img, .pw136-site .news-image:focus-visible img { transform: scale(1.025); }
}
@keyframes era-page-enter { from { opacity: .7; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) {
  .pw136-site .news-image:hover img, .pw136-site .news-image:focus-visible img, .pw136-site .story-cover:hover img, .pw136-site .story-cover:focus-visible img { transform: none; }
}


/* ERA 1.3.6+: identity, confirmed planning data and launch announcements. */
.pw136-site .brand { gap: 12px; }
.pw136-site .era-mark { display: block; width: 56px; height: 56px; flex: 0 0 56px; object-fit: contain; mix-blend-mode: screen; }
.pw136-site .footer-brand { display: inline-flex; align-items: center; gap: 12px; }
.pw136-site .footer-brand .era-mark { width: 48px; height: 48px; flex-basis: 48px; }
.pw136-site .footer-brand .footer-wordmark { margin: 0; font: 600 20px/1.2 var(--heading); letter-spacing: 1.5px; }
.pw136-site .footer-wordmark small { display: block; margin-top: 6px; color: var(--soft); font: 11px/1.3 var(--font); letter-spacing: .3px; }
.pw136-site .era-specs { border-block: 1px solid var(--line); margin-bottom: 32px; }
.pw136-site .era-specs dl { display: grid; grid-template-columns: .8fr .8fr .8fr 1.6fr; gap: 32px; padding-block: 24px; align-items: center; }
.pw136-site .era-specs dl > div { min-width: 0; }
.pw136-site .era-specs dt { font-size: 12px; color: var(--muted); }
.pw136-site .era-specs dd { margin-top: 8px; font: 500 34px/1.15 var(--heading); color: var(--accent); }
.pw136-site .era-specs dd > span { font-size: 15px; }
.pw136-site .era-specs .gear-limit dd { color: var(--text); font-size: 20px; line-height: 1.4; max-width: 34ch; }
.pw136-site .era-features { padding-block: 8px 36px; }
.pw136-site .era-feature-columns { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 40px; }
.pw136-site .era-feature-columns > div { min-width: 0; padding-top: 20px; border-top: 1px solid var(--accent-line); }
.pw136-site .feature-kicker { color: var(--accent); font-size: 11px; text-transform: uppercase; letter-spacing: 1px; }
.pw136-site .era-feature-columns h3 { margin-top: 10px; font-size: 22px; }
.pw136-site .era-feature-columns p { margin-top: 12px; max-width: 62ch; color: var(--muted); font-size: 14px; }
.pw136-site .era-feature-note { margin-top: 24px; color: var(--soft); font-size: 12px; }
.pw136-site .era-conditions { padding-block: 36px; }
.pw136-site .era-conditions-grid { display: grid; grid-template-columns: minmax(0,1.15fr) minmax(0,1fr); gap: 48px; }
.pw136-site .rates-table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 14px; }
.pw136-site .rates-table caption { text-align: left; color: var(--soft); font-size: 12px; padding-bottom: 12px; }
.pw136-site .rates-table th, .pw136-site .rates-table td { text-align: right; border-bottom: 1px solid var(--line); padding: 12px; font-weight: 400; }
.pw136-site .rates-table th:first-child { text-align: left; padding-left: 0; width: 34%; }
.pw136-site .rates-table td { color: var(--accent); font-variant-numeric: tabular-nums; }
.pw136-site .rates-table thead { color: var(--soft); font-size: 12px; }
.pw136-site .rates-table td:last-child, .pw136-site .rates-table th:last-child { padding-right: 0; }
.pw136-site .extra-rates { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 28px; margin-top: 20px; }
.pw136-site .extra-rates > div { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; font-size: 13px; }
.pw136-site .extra-rates dt { color: var(--muted); }
.pw136-site .extra-rates dd { color: var(--accent); white-space: nowrap; }
.pw136-site .rates-note { margin-top: 20px; color: var(--muted); font-size: 13px; }
.pw136-site .era-condition-notes { border-top: 1px solid var(--line); }
.pw136-site .era-condition-notes .guide-body p + p { margin-top: 12px; }
.pw136-site .era-marathons { padding-block: 4px 16px; }
.pw136-site .marathon-links { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; }
.pw136-site .marathon-links > a { display: flex; align-items: center; gap: 28px; min-width: 0; padding: 24px; border: 1px solid var(--line-strong); background: var(--surface); transition: border-color 160ms ease; }
.pw136-site .marathon-links > a:hover, .pw136-site .marathon-links > a:focus-visible { border-color: var(--accent); }
.pw136-site .marathon-length { color: var(--muted); font-size: 12px; min-width: 74px; text-align: center; }
.pw136-site .marathon-length strong { display: block; font: 500 38px/1.1 var(--heading); color: var(--accent); margin-bottom: 4px; }
.pw136-site .marathon-links > a > span:nth-child(2) { min-width: 0; }
.pw136-site .marathon-links > a > span:nth-child(2) > strong { display: block; font: 500 20px/1.3 var(--heading); }
.pw136-site .marathon-links small { display: block; margin-top: 8px; color: var(--muted); font-size: 13px; }
.pw136-site .marathon-arrow { color: var(--accent); font-size: 22px; margin-left: auto; }
.pw136-site .marathon-thumb::after, .pw136-site .marathon-cover::after { position: absolute; content: ''; inset: 0; background: linear-gradient(90deg,rgb(var(--shade) / .82),rgb(var(--shade) / .15) 75%); pointer-events: none; }
.pw136-site .duration-badge { position: absolute; z-index: 1; left: 24px; bottom: 24px; color: var(--text); font-size: 13px; }
.pw136-site .duration-badge strong { display: block; color: var(--accent-hover); font: 500 54px/1 var(--heading); margin-bottom: 6px; }
.pw136-site .marathon-cover-copy { position: absolute; left: clamp(24px,4vw,80px); top: 50%; transform: translateY(-50%); z-index: 1; color: var(--accent-hover); }
.pw136-site .marathon-cover-copy > span { font-size: 12px; letter-spacing: 1px; }
.pw136-site .marathon-cover-copy > strong { display: flex; align-items: baseline; gap: 20px; margin-top: 16px; font: 500 88px/1 var(--heading); }
.pw136-site .marathon-cover-copy small { color: var(--text); font: 500 24px/1.3 var(--heading); }
.pw136-site .marathon-cover > figcaption { z-index: 1; }
.pw136-site .article-facts dd > span { display: block; margin-top: 4px; color: var(--muted); font: 13px/1.3 var(--font); }
.pw136-site .article-facts dd.fact-word { font-size: 20px; line-height: 1.4; }
.pw136-site .prize-feature { margin-top: 24px; padding: 24px; border: 1px solid var(--accent-line); background: var(--raised); }
.pw136-site .prize-feature > p { display: flex; align-items: center; flex-wrap: wrap; gap: 16px 24px; margin-top: 12px; }
.pw136-site .prize-feature strong { font: 500 32px/1.2 var(--heading); color: var(--accent); white-space: nowrap; }
.pw136-site .prize-feature strong > span { font-size: 16px; }
.pw136-site .prize-plus { color: var(--soft); font-size: 24px; }
.pw136-site .prize-pending { margin-top: 20px; }
.pw136-site .prize-pending p { display: flex; align-items: baseline; gap: 24px; padding: 12px 0; border-bottom: 1px solid var(--line); color: var(--muted); font-size: 14px; }
.pw136-site .prize-pending strong { flex-shrink: 0; font-weight: 400; color: var(--text); }
.pw136-site .prize-table { width: 100%; margin-top: 24px; border-collapse: collapse; font-size: 16px; font-variant-numeric: tabular-nums; }
.pw136-site .prize-table caption { text-align: left; font-size: 12px; color: var(--soft); padding-bottom: 16px; }
.pw136-site .prize-table th, .pw136-site .prize-table td { padding: 16px; text-align: right; border-bottom: 1px solid var(--line); font-weight: 400; white-space: nowrap; }
.pw136-site .prize-table thead th { font-size: 12px; color: var(--soft); }
.pw136-site .prize-table th:first-child { text-align: left; padding-left: 0; }
.pw136-site .prize-table td:last-child, .pw136-site .prize-table th:last-child { padding-right: 0; }
.pw136-site .prize-table tbody tr:first-child { color: var(--accent); }
.pw136-site .news-guides { padding-top: 32px; }
.pw136-site .news-guide-links { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; }
.pw136-site .news-guide-links .related-story { grid-template-columns: 140px minmax(0,1fr); gap: 24px; }
.pw136-site .news-guide-links .related-story > img { width: 140px; height: 92px; }
@media (max-width: 1280px) {
  .pw136-site .era-specs dl { gap: 24px; }
  .pw136-site .era-feature-columns { gap: 24px; }
  .pw136-site .era-conditions-grid { gap: 32px; }
  .pw136-site .marathon-links { gap: 24px; }
  .pw136-site .marathon-links > a { gap: 20px; padding: 20px; }
  .pw136-site .extra-rates { grid-template-columns: 1fr; }
}
@media (max-width: 920px) {
  .pw136-site .brand .era-mark { width: 48px; height: 48px; flex-basis: 48px; }
  .pw136-site .brand-name { font-size: 21px; }
  .pw136-site .era-specs dl { grid-template-columns: 1fr 1fr; align-items: start; }
  .pw136-site .era-specs .gear-limit dd { font-size: 18px; }
  .pw136-site .era-feature-columns { grid-template-columns: 1fr; gap: 24px; }
  .pw136-site .era-feature-columns h3 { font-size: 20px; margin-top: 8px; }
  .pw136-site .era-feature-columns p { margin-top: 8px; max-width: none; }
  .pw136-site .era-conditions-grid { grid-template-columns: 1fr; gap: 24px; }
  .pw136-site .extra-rates { grid-template-columns: 1fr 1fr; }
  .pw136-site .marathon-links { grid-template-columns: 1fr; gap: 16px; }
  .pw136-site .marathon-cover-copy > strong { font-size: 68px; }
}
@media (max-width: 600px) {
  .pw136-site .era-specs { margin-bottom: 24px; }
  .pw136-site .era-specs dl { gap: 24px 20px; padding-block: 20px; }
  .pw136-site .era-specs dd { font-size: 30px; }
  .pw136-site .era-specs .gear-limit dd { font-size: 16px; }
  .pw136-site .era-specs dt { font-size: 11px; }
  .pw136-site .era-features { padding-bottom: 28px; }
  .pw136-site .era-conditions { padding-block: 28px; }
  .pw136-site .era-conditions .catalog-heading > span, .pw136-site .era-marathons .catalog-heading > span { display: block; margin-top: 8px; }
  .pw136-site .era-conditions .catalog-heading, .pw136-site .era-marathons .catalog-heading { display: block; }
  .pw136-site .extra-rates { grid-template-columns: 1fr; }
  .pw136-site .rates-table th, .pw136-site .rates-table td { padding-inline: 8px; }
  .pw136-site .rates-table th:first-child { padding-left: 0; }
  .pw136-site .rates-table td:last-child, .pw136-site .rates-table th:last-child { padding-right: 0; }
  .pw136-site .marathon-links > a { padding: 20px 16px; gap: 16px; }
  .pw136-site .marathon-length { min-width: 52px; }
  .pw136-site .marathon-length strong { font-size: 34px; }
  .pw136-site .marathon-links > a > span:nth-child(2) > strong { font-size: 18px; }
  .pw136-site .marathon-links small { font-size: 12px; }
  .pw136-site .marathon-cover-copy > strong { font-size: 56px; gap: 14px; margin-top: 12px; }
  .pw136-site .marathon-cover-copy small { font-size: 20px; }
  .pw136-site .marathon-cover-copy > span { font-size: 11px; }
  .pw136-site .marathon-cover > figcaption { left: 24px; }
  .pw136-site .prize-feature { padding: 20px; }
  .pw136-site .prize-feature strong { font-size: 28px; }
  .pw136-site .prize-feature > p { gap: 12px 16px; }
  .pw136-site .prize-pending p { gap: 16px; font-size: 13px; }
  .pw136-site .prize-table { font-size: 14px; }
  .pw136-site .prize-table th, .pw136-site .prize-table td { padding: 14px 10px; }
  .pw136-site .prize-table th:first-child { padding-left: 0; }
  .pw136-site .prize-table td:last-child, .pw136-site .prize-table th:last-child { padding-right: 0; }
  .pw136-site .news-guide-links { grid-template-columns: 1fr; gap: 8px; }
  .pw136-site .news-guide-links .related-story { grid-template-columns: 112px minmax(0,1fr); gap: 16px; }
  .pw136-site .news-guide-links .related-story > img { width: 112px; height: 84px; }
}

/* ERA community: compact catalogue, discussion and shared-chat preview. */
.pw136-site .community-intro { padding-block: 44px 28px; display: flex; align-items: center; justify-content: space-between; gap: 32px; }
.pw136-site .community-intro h1 { margin-top: 12px; font-size: 44px; }
.pw136-site .community-intro p:not(.eyebrow) { margin-top: 16px; color: var(--muted); max-width: 65ch; }
.pw136-site .community-intro--small { padding-block: 28px 24px; }
.pw136-site .community-intro--small .eyebrow { margin-top: 16px; }
.pw136-site .community-telegram { display: inline-flex; align-items: center; gap: 16px; padding: 16px 20px; border: 1px solid #3c515d; color: #b4cedb; font-size: 14px; transition: border-color 160ms ease, background 160ms ease; }
.pw136-site .community-telegram:hover { border-color: #729cb1; background: #182329; }
.pw136-site .community-telegram small { display: block; color: var(--soft); font-size: 11px; margin-top: 3px; }
.pw136-site .telegram-symbol { color: #8eb7ce; font-size: 26px; line-height: 1; }
.pw136-site .community-shell { padding-bottom: 48px; }
.pw136-site .community-nav { position: relative; z-index: 5; display: flex; align-items: center; justify-content: space-between; gap: 24px; border-block: 1px solid var(--line); }
.pw136-site .community-nav > div { display: flex; align-items: center; gap: 32px; }
.pw136-site .community-nav > div > a { display: inline-flex; align-items: center; min-height: 58px; border-bottom: 2px solid transparent; font-size: 14px; color: var(--muted); }
.pw136-site .community-nav > div > a:hover, .pw136-site .community-nav > div > a[aria-current="page"] { color: var(--accent); border-bottom-color: var(--accent); }
.pw136-site .forum-notifications { position: relative; font-size: 13px; }
.pw136-site .forum-notifications > summary { display: flex; align-items: center; gap: 10px; cursor: pointer; list-style: none; min-height: 44px; color: var(--muted); }
.pw136-site .forum-notifications > summary::-webkit-details-marker { display: none; }
.pw136-site .bell-dot { width: 8px; height: 8px; border: 1px solid var(--soft); border-radius: 50%; }
.pw136-site .forum-notifications[open] .bell-dot { border-color: var(--accent); background: var(--accent); }
.pw136-site .forum-notifications > div { position: absolute; right: 0; top: calc(100% + 8px); width: min(320px,calc(100vw - 40px)); border: 1px solid var(--line-strong); background: var(--raised); padding: 24px; box-shadow: 0 12px 28px #0006; }
.pw136-site .forum-notifications h2 { font-size: 18px; line-height: 1.35; }
.pw136-site .forum-notifications p { margin-block: 12px 16px; color: var(--muted); }
.pw136-site .community-layout { display: grid; grid-template-columns: 216px minmax(0,1fr) 280px; gap: 40px; padding-top: 32px; align-items: start; }
.pw136-site .community-layout > *, .pw136-site .forum-topic-layout > *, .pw136-site .forum-chat-layout > * { min-width: 0; }
.pw136-site .forum-sidebar h2 { color: var(--soft); font: 12px/1.4 var(--font); letter-spacing: 1px; text-transform: uppercase; margin: 0 12px 16px; }
.pw136-site .forum-categories { display: flex; flex-direction: column; gap: 4px; }
.pw136-site .forum-categories a { padding: 12px 16px; border-left: 2px solid transparent; color: var(--muted); font-size: 14px; }
.pw136-site .forum-categories a:hover { color: var(--text); background: var(--raised); }
.pw136-site .forum-categories a[aria-current="true"] { border-left-color: var(--accent); color: var(--accent); background: var(--hover); }
.pw136-site .forum-sidebar-note { margin: 32px 16px 0; }
.pw136-site .forum-sidebar-note .small-rule { display: block; margin-bottom: 16px; }
.pw136-site .forum-sidebar-note p { font-size: 12px; color: var(--soft); line-height: 1.8; }
.pw136-site .forum-search { margin-bottom: 28px; }
.pw136-site .forum-search label { display: block; margin-bottom: 10px; color: var(--muted); font-size: 13px; }
.pw136-site .forum-search > div { display: flex; gap: 12px; }
.pw136-site .forum-search input { min-width: 0; flex: 1; width: 100%; padding: 12px 16px; border: 1px solid var(--line-strong); border-radius: 0; background: var(--surface); color: var(--text); font: 15px/1.5 var(--font); }
.pw136-site .forum-search input::placeholder { color: var(--soft); }
.pw136-site .forum-search input:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.pw136-site .forum-search button { border: 1px solid var(--line); background: transparent; color: var(--muted); padding: 10px 16px; cursor: pointer; font-size: 13px; }
.pw136-site .forum-search button:hover { border-color: var(--accent); color: var(--accent); }
.pw136-site .forum-search [data-forum-status] { margin-top: 8px; color: var(--soft); font-size: 11px; }
.pw136-site .forum-section + .forum-section { margin-top: 32px; }
.pw136-site .forum-section-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; padding-bottom: 16px; border-bottom: 1px solid var(--line-strong); }
.pw136-site .forum-section-heading h2 { font-size: 22px; }
.pw136-site .forum-section-heading > span { font-size: 12px; color: var(--soft); }
.pw136-site .forum-row { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 20px 4px; border-bottom: 1px solid var(--line); }
.pw136-site .forum-row > div { min-width: 0; max-width: 90ch; }
.pw136-site .forum-row-kind { display: inline-block; font-size: 10px; color: var(--accent); letter-spacing: .6px; }
.pw136-site .forum-row h3 { margin-top: 6px; font-size: 20px; }
.pw136-site .forum-row h3 a:hover, .pw136-site .forum-row h3 a:focus-visible { color: var(--accent); }
.pw136-site .forum-row p { margin-top: 8px; font-size: 13px; color: var(--muted); }
.pw136-site .forum-faq { border-bottom: 1px solid var(--line); }
.pw136-site .forum-faq > summary { display: flex; justify-content: space-between; gap: 20px; align-items: center; min-height: 64px; padding: 16px 4px; cursor: pointer; list-style: none; font-size: 15px; }
.pw136-site .forum-faq > summary::-webkit-details-marker { display: none; }
.pw136-site .forum-faq > summary::after { content: '+'; color: var(--accent); font-size: 22px; font-weight: 400; }
.pw136-site .forum-faq[open] > summary::after { content: '−'; }
.pw136-site .forum-faq > div { padding: 0 28px 20px 4px; color: var(--muted); font-size: 14px; max-width: 88ch; }
.pw136-site .forum-faq .inline-link { display: inline-flex; margin-top: 14px; }
.pw136-site .forum-empty { padding: 40px 24px; background: var(--surface); border: 1px solid var(--line); }
.pw136-site .forum-empty h2 { font-size: 24px; }
.pw136-site .forum-empty p { margin-top: 12px; color: var(--muted); }
.pw136-site .forum-empty button { margin-top: 24px; cursor: pointer; }
.pw136-site .forum-rail { display: grid; gap: 28px; }
.pw136-site .forum-start { padding: 28px 24px; background: linear-gradient(150deg,var(--hover),var(--surface)); border-top: 2px solid var(--accent-line); }
.pw136-site .forum-start h2 { margin-top: 16px; font-size: 28px; line-height: 1.25; }
.pw136-site .forum-start > p:not(.eyebrow) { margin-top: 16px; color: var(--muted); font-size: 13px; }
.pw136-site .forum-start .button { width: 100%; justify-content: space-between; margin-top: 24px; padding-inline: 16px; }
.pw136-site .forum-start .inline-link { display: inline-block; margin-top: 16px; font-size: 12px; }
.pw136-site .forum-connection { border-top: 1px solid #3e5965; padding-top: 20px; }
.pw136-site .forum-connection h2, .pw136-site .forum-contact h2 { font-size: 17px; line-height: 1.35; }
.pw136-site .forum-connection p, .pw136-site .forum-contact p { margin-top: 12px; color: var(--muted); font-size: 13px; }
.pw136-site .forum-connection .sample-label { display: inline-block; margin-top: 16px; color: #9dbac8; font-size: 10px; }
.pw136-site .forum-contact { padding-top: 20px; border-top: 1px solid var(--line); }
.pw136-site .forum-contact .inline-link { display: inline-block; margin-top: 16px; font-size: 13px; }
.pw136-site .forum-topic-layout, .pw136-site .forum-chat-layout { display: grid; grid-template-columns: minmax(0,1fr) 300px; gap: 64px; padding-top: 32px; align-items: start; }
.pw136-site .forum-topic-heading { padding-block: 4px 28px; border-bottom: 1px solid var(--line); }
.pw136-site .forum-topic-heading h1 { font-size: 36px; line-height: 1.2; max-width: 40ch; margin-top: 20px; }
.pw136-site .forum-topic-heading > p { color: var(--soft); font-size: 12px; margin-top: 16px; }
.pw136-site .forum-topic-rail { display: grid; gap: 28px; }
.pw136-site .forum-context { padding: 24px; border: 1px solid var(--line); background: var(--surface); }
.pw136-site .forum-context h2 { font-size: 20px; line-height: 1.3; }
.pw136-site .forum-context .eyebrow + h2 { margin-top: 12px; }
.pw136-site .forum-context p { font-size: 13px; color: var(--muted); margin-top: 16px; }
.pw136-site .forum-context > a { display: block; font-size: 13px; color: var(--accent); margin-top: 16px; }
.pw136-site .forum-post { display: grid; grid-template-columns: 44px minmax(0,1fr); gap: 20px; padding: 28px 0; border-bottom: 1px solid var(--line); }
.pw136-site .forum-avatar { width: 44px; height: 44px; display: grid; place-items: center; background: #3a332b; border: 1px solid var(--accent-line); color: var(--accent); font: 500 20px/1 var(--heading); border-radius: 6px; }
.pw136-site .forum-avatar--blue { background: #23343d; border-color: #476777; color: #adc8d9; }
.pw136-site .forum-avatar--red { background: #3b2927; border-color: #715048; color: #d5aaa0; }
.pw136-site .forum-avatar--team { background: #36342b; border-color: var(--accent-line); color: var(--accent); }
.pw136-site .forum-post-content { min-width: 0; }
.pw136-site .forum-post-content > header { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; font-size: 14px; }
.pw136-site .forum-post-content > header > strong { font-weight: 500; }
.pw136-site .forum-post-content > header > a { margin-left: auto; color: var(--soft); font-size: 11px; min-height: 32px; padding: 6px; }
.pw136-site .post-origin { font-size: 10px; color: var(--soft); border: 1px solid var(--line); padding: 1px 6px; }
.pw136-site .post-origin--telegram { color: #9cbdcf; border-color: #3d5664; }
.pw136-site .forum-post-content > p { max-width: 88ch; margin-top: 12px; font-size: 15px; line-height: 1.8; color: var(--muted); overflow-wrap: anywhere; }
.pw136-site .forum-post blockquote { margin: 16px 0; max-width: 80ch; padding: 12px 16px; border-left: 2px solid var(--accent-line); background: var(--raised); font-size: 13px; }
.pw136-site .forum-post blockquote > a { color: #adc8d9; }
.pw136-site .forum-post blockquote p { color: var(--soft); margin-top: 6px; }
.pw136-site .post-actions { display: flex; gap: 24px; margin-top: 20px; }
.pw136-site .post-actions a { font-size: 12px; color: var(--soft); min-height: 32px; display: inline-flex; align-items: center; }
.pw136-site .post-actions a:hover { color: var(--accent); }
.pw136-site .forum-replies-heading { display: flex; flex-wrap: wrap; align-items: baseline; gap: 12px 24px; padding-top: 28px; }
.pw136-site .forum-replies-heading h2 { font-size: 22px; }
.pw136-site .forum-replies-heading > span { color: var(--soft); font-size: 11px; }
.pw136-site .forum-guest { display: flex; align-items: center; justify-content: space-between; gap: 24px; border: 1px solid var(--line); background: var(--raised); padding: 24px; margin-top: 28px; }
.pw136-site .forum-guest strong { font-size: 15px; font-weight: 500; }
.pw136-site .forum-guest p { margin-top: 4px; font-size: 12px; color: var(--soft); }
.pw136-site .forum-guest .button { white-space: nowrap; }
.pw136-site .chat-room { padding: 24px 28px; background: var(--surface); border: 1px solid var(--line); }
.pw136-site .chat-room-heading { display: flex; flex-wrap: wrap; gap: 12px 24px; justify-content: space-between; align-items: baseline; border-bottom: 1px solid var(--line-strong); padding-bottom: 20px; }
.pw136-site .chat-room-heading > strong { font-weight: 500; font-size: 16px; }
.pw136-site .chat-room-heading .sample-label { font-size: 10px; }
.pw136-site .chat-messages { list-style: none; padding: 0; margin: 0; }
.pw136-site .chat-messages .forum-post:last-child { border-bottom: 0; }
.pw136-site .chat-inline-links { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 16px; }
.pw136-site .chat-inline-links a { font-size: 12px; color: var(--accent); padding: 8px 12px; border: 1px solid var(--accent-line); }
.pw136-site .chat-topic-link { display: block; max-width: 62ch; margin-top: 16px; padding: 16px 20px; border-left: 2px solid var(--accent-line); background: var(--raised); }
.pw136-site .chat-topic-link small { color: var(--soft); font-size: 11px; }
.pw136-site .chat-topic-link strong { display: block; color: var(--accent); font-size: 14px; font-weight: 400; margin-top: 6px; }
.pw136-site .chat-room .forum-guest { margin-top: 0; }
@media (min-width: 2200px) {
 .pw136-site .community-layout { grid-template-columns: 248px minmax(0,1fr) 336px; gap: 56px; }
 .pw136-site .forum-topic-layout, .pw136-site .forum-chat-layout { grid-template-columns: minmax(0,1fr) 360px; }
}
@media (max-width: 1280px) {
 .pw136-site .community-layout { grid-template-columns: 180px minmax(0,1fr); gap: 28px; }
 .pw136-site .forum-rail { grid-column: 1 / -1; grid-template-columns: 1.1fr 1fr 1fr; gap: 28px; }
 .pw136-site .forum-start h2 br { display: none; }
 .pw136-site .forum-topic-layout, .pw136-site .forum-chat-layout { gap: 32px; grid-template-columns: minmax(0,1fr) 260px; }
 .pw136-site .forum-categories a { padding-inline: 12px; }
}
@media (max-width: 920px) {
 .pw136-site .community-intro { align-items: flex-start; padding-top: 32px; }
 .pw136-site .community-intro h1 { font-size: 38px; }
 .pw136-site .community-telegram { font-size: 12px; padding: 12px 16px; }
 .pw136-site .community-layout { grid-template-columns: minmax(0,1fr); gap: 24px; padding-top: 24px; }
 .pw136-site .forum-sidebar h2, .pw136-site .forum-sidebar-note { display: none; }
 .pw136-site .forum-categories { flex-direction: row; flex-wrap: wrap; gap: 8px; }
 .pw136-site .forum-categories a { border: 1px solid var(--line); padding: 9px 12px; font-size: 12px; }
 .pw136-site .forum-categories a[aria-current="true"] { border-color: var(--accent-line); }
 .pw136-site .forum-rail { grid-template-columns: 1fr 1fr; }
 .pw136-site .forum-start { grid-row: span 2; }
 .pw136-site .forum-topic-layout, .pw136-site .forum-chat-layout { grid-template-columns: minmax(0,1fr); gap: 32px; }
 .pw136-site .forum-topic-rail { grid-template-columns: 1fr 1fr; gap: 24px; }
 .pw136-site .forum-topic-rail .forum-connection { grid-column: 1 / -1; }
 .pw136-site .forum-topic-heading h1 { font-size: 32px; }
}
@media (max-width: 600px) {
 .pw136-site .community-intro { display: block; padding-block: 28px 24px; }
 .pw136-site .community-intro h1 { font-size: 34px; margin-top: 10px; }
 .pw136-site .community-intro p:not(.eyebrow) { font-size: 14px; margin-top: 12px; }
 .pw136-site .community-telegram { margin-top: 20px; }
 .pw136-site .community-intro--small .community-telegram { margin-top: 16px; }
 .pw136-site .community-nav { gap: 12px; flex-wrap: wrap; padding-bottom: 8px; }
 .pw136-site .community-nav > div { width: 100%; gap: 24px; }
 .pw136-site .community-nav > div > a { font-size: 13px; min-height: 48px; }
 .pw136-site .forum-notifications { margin-left: auto; }
 .pw136-site .forum-notifications > summary { min-height: 32px; font-size: 12px; }
 .pw136-site .forum-search > div { gap: 8px; }
 .pw136-site .forum-search input { padding: 12px; font-size: 14px; }
 .pw136-site .forum-search button { padding: 10px; font-size: 12px; }
 .pw136-site .forum-section-heading { display: block; padding-bottom: 12px; }
 .pw136-site .forum-section-heading h2 { font-size: 22px; }
 .pw136-site .forum-section-heading > span { display: block; margin-top: 6px; font-size: 11px; }
 .pw136-site .forum-row { gap: 12px; padding-block: 18px; }
 .pw136-site .forum-row h3 { font-size: 18px; }
 .pw136-site .forum-row p { font-size: 12px; }
 .pw136-site .forum-faq > summary { font-size: 14px; }
 .pw136-site .forum-rail, .pw136-site .forum-topic-rail { grid-template-columns: minmax(0,1fr); gap: 24px; }
 .pw136-site .forum-start { grid-row: auto; }
 .pw136-site .forum-topic-heading h1 { font-size: 28px; }
 .pw136-site .forum-post { grid-template-columns: 32px minmax(0,1fr); gap: 12px; padding-block: 24px; }
 .pw136-site .forum-avatar { width: 32px; height: 32px; font-size: 16px; border-radius: 4px; }
 .pw136-site .forum-post-content > header { gap: 6px 8px; font-size: 13px; }
 .pw136-site .forum-post-content > p { font-size: 14px; }
 .pw136-site .forum-post blockquote { padding: 10px 12px; font-size: 12px; }
 .pw136-site .forum-guest { display: block; padding: 20px; }
 .pw136-site .forum-guest .button { margin-top: 16px; }
 .pw136-site .chat-room { padding: 20px 16px; }
 .pw136-site .chat-topic-link { padding: 12px; }
 .pw136-site .community-shell { padding-bottom: 32px; }
}
@media (prefers-reduced-motion: no-preference) {
 .pw136-site .community-intro { animation: era-page-enter 380ms ease-out both; }
}

.pw136-site .button.button-secondary { background: transparent; border-color: var(--accent-line); color: var(--accent); }
.pw136-site .button.button-secondary:hover { background: var(--hover); border-color: var(--accent); }

/* ERA ember: оформлення за знімком замовника 14.09.2026. Кольори задані токенами на body.pw136-site. */
.pw136-site .skip-link { border-color: var(--accent); border-radius: 8px; }
.pw136-site .site-header { background: var(--bg); border-bottom: 1px solid var(--line); }
.pw136-site .era-mark { filter: var(--mark-filter); }
.pw136-site .brand-name { font-size: 22px; letter-spacing: 2px; color: var(--text); }
.pw136-site .brand-pw { color: inherit; }
.pw136-site .brand-name small { margin-top: 8px; color: var(--soft); font-size: 11px; letter-spacing: 1.5px; text-transform: uppercase; }
.pw136-site .main-nav a { color: var(--muted); }
.pw136-site .main-nav a::after { bottom: 20px; border-radius: 2px; }
.pw136-site .header-action { gap: 10px; min-height: 40px; padding: 8px 16px; border: 1px solid var(--accent-line); border-radius: 8px; background: transparent; color: var(--text); transition: border-color 150ms cubic-bezier(.4,0,.2,1), background 150ms cubic-bezier(.4,0,.2,1); }
.pw136-site .account-icon { flex-shrink: 0; color: var(--accent); }
.pw136-site .header-action:hover, .pw136-site .header-action:focus-visible { border-color: var(--accent); background: var(--accent-soft); }
.pw136-site .eyebrow { color: var(--accent); letter-spacing: 1.5px; }
.pw136-site .button { gap: 20px; min-height: 52px; padding: 12px 20px 12px 24px; border: 1px solid var(--accent); border-radius: 8px; background: var(--accent); color: var(--accent-ink); font: 600 14px/1.4 var(--heading); box-shadow: 0 12px 28px -16px var(--accent-glow); transition: background 150ms cubic-bezier(.4,0,.2,1), border-color 150ms cubic-bezier(.4,0,.2,1), transform 150ms cubic-bezier(.4,0,.2,1); }
.pw136-site .button:hover, .pw136-site .button:focus-visible { background: var(--accent-hover); border-color: var(--accent-hover); }
.pw136-site .button > span { font-size: 20px; }
.pw136-site .button.button-secondary { background: rgb(var(--shade) / .35); border-color: var(--accent); color: var(--text); box-shadow: none; }
.pw136-site .button.button-secondary > span { color: var(--accent); }
.pw136-site .button.button-secondary:hover, .pw136-site .button.button-secondary:focus-visible { background: var(--accent-soft); border-color: var(--accent-hover); }

.pw136-site .hero { border-bottom: 1px solid var(--line); }
.pw136-site .hero-image { filter: var(--hero-filter); }
.pw136-site .hero::before { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: radial-gradient(55% 75% at 64% 22%, var(--hero-glow), transparent 72%), linear-gradient(180deg, var(--hero-tint), transparent 64%); mix-blend-mode: overlay; }
.pw136-site .hero .eyebrow { display: flex; align-items: center; gap: 12px; }
.pw136-site .hero .small-rule { width: 6px; height: 6px; margin: 0; border-radius: 50%; background: var(--accent); box-shadow: 0 0 12px var(--accent-glow); }
.pw136-site .hero h1 { font-weight: 700; }
.pw136-site .accent-word { color: var(--accent); }
.pw136-site .hero-lead { color: var(--body); }
.pw136-site .hero-actions { gap: 16px; }

.pw136-site .foundation { background: var(--bg); border-bottom: 1px solid var(--line); }
.pw136-site .foundation-grid { grid-template-columns: repeat(6, minmax(0,1fr)); gap: 0; min-height: 104px; padding-block: 20px; }
.pw136-site .foundation-grid > div { display: flex; align-items: center; gap: 16px; min-height: 56px; padding-inline: 24px; border: 0; border-left: 1px solid var(--line); }
.pw136-site .foundation-grid > div:first-child { padding-left: 0; border-left: 0; }
.pw136-site .stat-icon { flex: 0 0 32px; width: 32px; height: 32px; color: var(--accent); }
.pw136-site .foundation-grid p { display: flex; flex-direction: column; min-width: 0; }
.pw136-site .foundation-grid strong { font: 600 28px/1.1 var(--heading); color: var(--text); letter-spacing: -.01em; }
.pw136-site .foundation-grid span { display: block; max-width: none; margin-top: 4px; color: var(--muted); font-size: 13px; line-height: 1.4; }

.pw136-site .section-title, .pw136-site .catalog-heading h2, .pw136-site .forum-section-heading h2 { display: flex; align-items: center; gap: 12px; }
.pw136-site .section-title::before, .pw136-site .catalog-heading h2::before, .pw136-site .forum-section-heading h2::before { content: ''; flex: 0 0 4px; height: .9em; border-radius: 2px; background: var(--accent); box-shadow: 0 0 12px var(--accent-glow); }
.pw136-site .home-feed { gap: 40px; padding-block: 48px; }
.pw136-site .feed-heading { flex-direction: row; align-items: center; gap: 16px; margin-bottom: 20px; }
.pw136-site .feed-heading h2 { margin: 0; font-size: 28px; }
.pw136-site .view-all { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; margin-left: auto; color: var(--accent); font-size: 14px; white-space: nowrap; }
.pw136-site .view-all > span { transition: transform 150ms cubic-bezier(.4,0,.2,1); }
.pw136-site .view-all:hover, .pw136-site .view-all:focus-visible { color: var(--accent-hover); }
.pw136-site .view-all:hover > span, .pw136-site .view-all:focus-visible > span { transform: translateX(3px); }
.pw136-site .news-list { display: flex; flex-direction: column; gap: 16px; border-top: 0; }
.pw136-site .news-entry { grid-template-columns: minmax(200px, .85fr) minmax(0, 1.4fr); gap: 24px; padding: 16px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); transition: border-color 150ms cubic-bezier(.4,0,.2,1); }
.pw136-site .news-entry:hover, .pw136-site .news-entry:focus-within { border-color: var(--accent-line); }
.pw136-site .news-image { height: 148px; border-radius: 8px; }
.pw136-site .news-copy h3 { margin-top: 12px; font-size: 22px; }
.pw136-site .news-copy p { margin-top: 8px; }
.pw136-site .news-copy .news-meta { display: flex; align-items: center; gap: 8px; margin-top: 12px; color: var(--soft); font-size: 12px; line-height: 1.4; }
.pw136-site .news-meta svg { flex-shrink: 0; color: var(--accent); }
.pw136-site .news-category, .pw136-site .forum-row-kind, .pw136-site .feature-kicker { display: inline-flex; align-items: center; padding: 4px 8px; border: 1px solid var(--accent-line); border-radius: 4px; background: var(--accent-soft); color: var(--accent); font: 600 11px/1.2 var(--heading); letter-spacing: 1px; text-transform: uppercase; }

.pw136-site .community-sidebar { gap: 16px; }
.pw136-site .online-widget { grid-template-columns: minmax(0,1fr) auto; grid-template-areas: "head count" "bar bar" "note note"; gap: 12px 16px; padding: 20px 24px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.pw136-site .online-head { grid-area: head; min-width: 0; }
.pw136-site .online-widget h2 { display: flex; align-items: center; gap: 12px; margin-bottom: 4px; font-size: 18px; }
.pw136-site .live-dot { flex: 0 0 8px; width: 8px; height: 8px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 4px var(--accent-soft), 0 0 12px var(--accent-glow); }
.pw136-site .online-count { grid-area: count; }
.pw136-site .online-count strong { font-size: 36px; color: var(--accent); }
.pw136-site .online-bar { grid-area: bar; height: 4px; overflow: hidden; border-radius: 4px; background: var(--line); }
.pw136-site .online-bar > span { display: block; height: 100%; background: linear-gradient(90deg, var(--accent-deep), var(--accent) 45%, transparent); }
.pw136-site .snapshot-note { grid-area: note; padding-top: 0; border-top: 0; }
.pw136-site .ranking-board { padding: 20px 24px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.pw136-site .rank-heading { align-items: center; margin-bottom: 16px; }
.pw136-site .rank-heading h2 { display: flex; align-items: center; gap: 12px; font-size: 18px; }
.pw136-site .rank-heading svg { flex-shrink: 0; color: var(--accent); }
.pw136-site .ranking-more { gap: 8px; color: var(--accent); }
.pw136-site .ranking-more:hover, .pw136-site .ranking-more:focus-visible { color: var(--accent-hover); }
.pw136-site .ranking-tabs { gap: 4px; margin-bottom: 8px; padding: 4px; border: 1px solid var(--line); border-radius: 8px; background: var(--bg); }
.pw136-site .ranking-tabs button { min-height: 40px; border: 0; border-radius: 4px; color: var(--muted); font-size: 13px; }
.pw136-site .ranking-tabs button:hover { background: var(--raised); color: var(--text); }
.pw136-site .ranking-tabs button[aria-selected="true"] { background: var(--accent); color: var(--accent-ink); font-weight: 600; }
.pw136-site .rank-table th, .pw136-site .rank-table td { padding-block: 12px; border-bottom-color: var(--line); }
.pw136-site .rank-table tbody td:first-child { color: var(--accent); font: 600 14px/1.4 var(--heading); }
.pw136-site .rank-table tbody tr:first-child th { color: var(--text); }
.pw136-site .rank-table tbody td:last-child { color: var(--muted); }
.pw136-site .rank-table thead th, .pw136-site .rates-table thead th, .pw136-site .prize-table thead th, .pw136-site .mode-table thead th { color: var(--soft); font-size: 11px; letter-spacing: 1px; text-transform: uppercase; }
.pw136-site .world-strip { border: 1px solid var(--line); border-radius: 12px; }
/* Нижній банер у родині карток рейтингу (31.10.2026, власник: «чогось не вистачає»): та сама тепла рамка, світла кромка
   й глибока тінь, а холодний кадр (блакитне небо, синій дракон, зелена трава) тонований під теплу палітру сайту,
   затемнення країв тепло-коричневе замість чорного. */
.pw136-site .world-strip { border-color: rgb(255 122 26 / .18); box-shadow: inset 0 1px 0 rgb(255 170 100 / .07), 0 16px 40px -24px rgb(0 0 0 / .8); }
.pw136-site .world-strip > img { filter: sepia(.32) saturate(1.05) brightness(.96); }
.pw136-site .world-strip::after { background: linear-gradient(90deg, rgb(19 13 9 / .94), rgb(40 24 12 / .26) 54%, rgb(19 13 9 / .9)); }

.pw136-site .lead-story, .pw136-site .download-hub { border: 1px solid var(--line-strong); border-radius: 12px; }
.pw136-site .download-console { background: linear-gradient(135deg, var(--raised), var(--surface) 65%); }
.pw136-site .download-mirrors > a { border-color: var(--line-strong); border-radius: 8px; }
.pw136-site .download-mirrors > a:hover, .pw136-site .download-mirrors > a:focus-visible { border-color: var(--accent-line); background: var(--accent-soft); }
.pw136-site .install-steps li > span { border-color: var(--accent-line); background: var(--accent-soft); }
.pw136-site .utility-symbol { border-color: var(--accent-line); background: var(--accent-soft); }
.pw136-site .article-cover, .pw136-site .about-overview > img { border-radius: 12px; }
.pw136-site .secondary-story .story-cover, .pw136-site .location-shot, .pw136-site .news-guide-links .related-story > img, .pw136-site .related-story > img { border-radius: 8px; }
.pw136-site .article-contents, .pw136-site .forum-start { border-top: 2px solid var(--accent); }
.pw136-site .marathon-links > a { border-color: var(--line); border-radius: 12px; }
.pw136-site .marathon-links > a:hover, .pw136-site .marathon-links > a:focus-visible { border-color: var(--accent-line); background: var(--raised); }
.pw136-site .prize-feature, .pw136-site .forum-context, .pw136-site .forum-empty, .pw136-site .chat-room, .pw136-site .forum-guest, .pw136-site .notice { border-radius: 12px; }
.pw136-site .prize-feature { border-color: var(--accent-line); }
.pw136-site .notice { border-color: var(--accent-line); background: var(--raised); }
.pw136-site .forum-notifications > div { border-color: var(--line-strong); border-radius: 12px; background: var(--raised); }
.pw136-site .forum-search input, .pw136-site .forum-search button { border-radius: 8px; }
.pw136-site .forum-search input { border-color: var(--line-strong); background: var(--surface); }
.pw136-site .forum-avatar { border-radius: 8px; }
.pw136-site .post-origin { border-radius: 4px; }
.pw136-site .chat-inline-links a { border-color: var(--accent-line); border-radius: 8px; }
.pw136-site .chat-inline-links a:hover, .pw136-site .chat-inline-links a:focus-visible { background: var(--accent-soft); }
.pw136-site .community-telegram { border-radius: 8px; }
.pw136-site .forum-categories a[aria-current="true"] { background: var(--accent-soft); color: var(--accent); }
.pw136-site .site-footer { background: var(--bg); border-top: 1px solid var(--line); }

@media (min-width: 921px) {
  .pw136-site .forum-categories a { border-left: 0; border-radius: 8px; }
}
@media (min-width: 921px) and (max-width: 1280px) {
  .pw136-site .header-action { padding-inline: 12px; }
}
@media (max-width: 1280px) {
  .pw136-site .foundation-grid > div { gap: 12px; padding-inline: 16px; }
  .pw136-site .stat-icon { flex-basis: 28px; width: 28px; height: 28px; }
  .pw136-site .foundation-grid strong { font-size: 22px; }
  .pw136-site .foundation-grid span { font-size: 12px; }
  .pw136-site .news-entry { grid-template-columns: 180px minmax(0,1fr); gap: 20px; }
  .pw136-site .news-image { height: 132px; }
  .pw136-site .news-copy h3 { font-size: 20px; }
  .pw136-site .online-widget, .pw136-site .ranking-board { padding: 20px; }
}
@media (max-width: 1024px) {
  .pw136-site .foundation-grid { grid-template-columns: repeat(3, minmax(0,1fr)); row-gap: 20px; }
  .pw136-site .foundation-grid > div:nth-child(3n+1) { padding-left: 0; border-left: 0; }
  .pw136-site .news-entry { grid-template-columns: 148px minmax(0,1fr); gap: 16px; padding: 12px; }
  .pw136-site .news-image { height: 124px; }
  .pw136-site .news-copy h3 { font-size: 18px; }
}
@media (max-width: 920px) {
  .pw136-site .forum-categories a { border-radius: 8px; }
  .pw136-site .forum-categories a[aria-current="true"] { border-color: var(--accent-line); }
}
@media (max-width: 760px) {
  .pw136-site .hero::before { inset: 0 0 auto; z-index: 1; height: 280px; }
  .pw136-site .online-widget { grid-template-columns: minmax(0,1fr); grid-template-areas: "head" "count" "bar" "note"; }
}
@media (max-width: 600px) {
  .pw136-site .foundation-grid { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 20px 16px; padding-block: 24px; }
  .pw136-site .foundation-grid > div, .pw136-site .foundation-grid > div:nth-child(3n+1) { padding-inline: 0; border-left: 0; }
}
@media (max-width: 480px) {
  .pw136-site .hero::before { height: 224px; }
  .pw136-site .hero-actions .button { gap: 12px; padding-inline: 16px; white-space: nowrap; }
  .pw136-site .feed-heading h2 { font-size: 22px; }
  .pw136-site .news-entry { grid-template-columns: minmax(0,1fr); }
  .pw136-site .news-image { height: 168px; }
  .pw136-site .online-widget { grid-template-columns: minmax(0,1fr) auto; grid-template-areas: "head count" "bar bar" "note note"; }
}
@media (prefers-reduced-motion: reduce) {
  .pw136-site .view-all:hover > span, .pw136-site .view-all:focus-visible > span { transform: none; }
}

/* ERA ember, деталі за знімком: свічення, теплі панелі, суцільні іконки, рівний низ стрічки й рейтингу. */
.pw136-site .site-header { box-shadow: 0 1px 0 rgb(255 122 26 / .14); }
.pw136-site .main-nav a[aria-current="page"] { color: var(--accent); }
.pw136-site .main-nav a::after { bottom: 18px; height: 3px; }
.pw136-site .header-action { position: relative; overflow: hidden; border-color: rgb(255 122 26 / .4); border-radius: 12px; background: linear-gradient(180deg, rgb(255 122 26 / .08), rgb(255 122 26 / .02)); color: var(--accent); box-shadow: none; }
.pw136-site .header-action:hover, .pw136-site .header-action:focus-visible { border-color: rgb(255 122 26 / .85); background: rgb(255 122 26 / .12); box-shadow: 0 8px 22px -18px rgb(255 110 20 / .8); }
.pw136-site .account-icon { position: relative; z-index: 1; }

.pw136-site .button { position: relative; overflow: hidden; border-color: #ff9a4a; background: linear-gradient(135deg, #ff9f4c 0%, var(--accent) 55%, #ee6a10 100%); box-shadow: 0 10px 24px -18px rgb(255 110 20 / .7), inset 0 1px 0 rgb(255 255 255 / .22); }
.pw136-site .button:hover, .pw136-site .button:focus-visible { border-color: #ffb36b; background: linear-gradient(135deg, #ffb069 0%, #ff8a30 55%, #f2740f 100%); box-shadow: 0 14px 28px -18px rgb(255 110 20 / .85), inset 0 1px 0 rgb(255 255 255 / .28); }
.pw136-site .button.button-secondary { border-color: rgb(255 122 26 / .55); background: rgb(var(--shade) / .6); box-shadow: none; }
.pw136-site .button.button-secondary:hover, .pw136-site .button.button-secondary:focus-visible { border-color: rgb(255 122 26 / .9); background: rgb(255 122 26 / .1); box-shadow: 0 10px 24px -20px rgb(255 110 20 / .6); }

.pw136-site .hero { border-bottom: 0; }
.pw136-site .hero .small-rule { width: 7px; height: 9px; border-radius: 0; clip-path: polygon(0 0, 100% 50%, 0 100%); box-shadow: none; }
.pw136-site .hero h1 .accent-word { text-shadow: 0 0 28px rgb(255 110 20 / .18); }

.pw136-site .foundation { border-top: 1px solid rgb(255 122 26 / .18); border-bottom: 1px solid rgb(255 122 26 / .14); background: linear-gradient(180deg, rgb(255 110 20 / .05), rgb(255 110 20 / .01)), var(--bg); }
.pw136-site .foundation-grid > div { border-left-color: rgb(255 255 255 / .08); }
.pw136-site .stat-icon { flex-basis: 36px; width: 36px; height: 36px; }
.pw136-site .foundation-grid strong { font-weight: 700; }

.pw136-site .section-title::before, .pw136-site .catalog-heading h2::before, .pw136-site .forum-section-heading h2::before { flex-basis: 5px; height: 1em; border-radius: 4px; }
.pw136-site .home-feed { align-items: stretch; }
.pw136-site .home-news { display: flex; flex-direction: column; min-height: 100%; }
.pw136-site .home-news .feed-heading { margin-bottom: 0; padding-bottom: 16px; border-bottom: 1px solid var(--line); }
.pw136-site .news-list { flex: 1; justify-content: space-between; gap: 0; }
.pw136-site .news-entry { padding: 20px 0; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; background: transparent; }
.pw136-site .news-entry:last-child { padding-bottom: 0; border-bottom: 0; }
.pw136-site .news-image { border: 1px solid rgb(255 122 26 / .2); transition: border-color 200ms cubic-bezier(.4,0,.2,1), box-shadow 200ms cubic-bezier(.4,0,.2,1); }
.pw136-site .news-entry:hover .news-image, .pw136-site .news-entry:focus-within .news-image { border-color: rgb(255 122 26 / .45); box-shadow: 0 10px 26px -18px rgb(255 110 20 / .5); }
.pw136-site .news-copy h3 { font-weight: 700; }
.pw136-site .news-more { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; margin-top: 4px; color: var(--accent); font-size: 13px; }
.pw136-site .news-more > span { transition: transform 150ms cubic-bezier(.4,0,.2,1); }
.pw136-site .news-more:hover, .pw136-site .news-more:focus-visible { color: var(--accent-hover); }
.pw136-site .news-more:hover > span, .pw136-site .news-more:focus-visible > span { transform: translateX(3px); }
.pw136-site .news-category, .pw136-site .forum-row-kind, .pw136-site .feature-kicker { border-color: rgb(255 122 26 / .3); background: rgb(255 122 26 / .16); color: #ff9a4d; font-weight: 700; }

.pw136-site .community-sidebar { justify-content: flex-start; }
.pw136-site .online-widget, .pw136-site .ranking-board { border: 1px solid rgb(255 122 26 / .18); background: radial-gradient(120% 90% at 0% 0%, rgb(255 120 40 / .11), transparent 55%), linear-gradient(180deg, #17120e, #100d0b); box-shadow: inset 0 1px 0 rgb(255 170 100 / .07), 0 16px 40px -24px rgb(0 0 0 / .8); }
.pw136-site .online-widget h2 { margin-bottom: 2px; }
.pw136-site .online-sub { color: var(--soft); font-size: 12px; }
.pw136-site .live-dot { flex-basis: 12px; width: 12px; height: 12px; box-shadow: 0 0 0 4px rgb(255 122 26 / .12); }
.pw136-site .online-count strong { font: 700 48px/1 var(--heading); letter-spacing: -.02em; }
.pw136-site .online-bar { height: 8px; background: rgb(255 255 255 / .06); }
.pw136-site .online-bar > span { background: linear-gradient(90deg, #ff9a4a, var(--accent) 55%, rgb(255 122 26 / 0)); }
.pw136-site .ranking-board { display: flex; flex: 1; flex-direction: column; }
.pw136-site .rank-heading svg { filter: none; }
.pw136-site .ranking-tabs { border-color: rgb(255 255 255 / .06); background: rgb(0 0 0 / .35); }
.pw136-site .ranking-tabs button[aria-selected="true"] { background: linear-gradient(135deg, #ff9a45 0%, var(--accent) 55%, #ee6a10 100%); box-shadow: inset 0 1px 0 rgb(255 255 255 / .22); }
/* Наповнення рейтингу одним шрифтом і кольором (31.10.2026, власник: «ніки, номери, вбивства… криво»): номер місця
   був шрифтом заголовків (Segoe UI 700 18) поруч із ніком PW Sans 16 і сідав на іншу лінію, числа колонок мали різні
   кольори («Гравці» світлі, «Землі» й «Вбивства» сірі). Тепер номер тим самим шрифтом і висотою рядка, що нік, усі числа
   одного кольору й рівні по правому краю; підписи колонок на широкому екрані на крок більші. Розмітка та ширини ті самі. */
.pw136-site .rank-table tbody td:first-child { font: 600 1em/1.6 var(--font); font-variant-numeric: tabular-nums; }
.pw136-site .rank-table tbody td:not(:first-child) { color: var(--text); font-variant-numeric: tabular-nums; }
@media (min-width: 2400px) {
  .pw136-site .rank-table thead th { font-size: 12px; }
}
.pw136-site .rank-table tbody tr:last-child > * { border-bottom: 0; }

@media (max-width: 1024px) {
  .pw136-site .news-entry { padding-block: 16px; }
  .pw136-site .online-count strong { font-size: 36px; }
}
@media (max-width: 760px) {
  .pw136-site .news-list { justify-content: flex-start; }
  .pw136-site .ranking-board { flex: none; }
}
@media (prefers-reduced-motion: reduce) {
  .pw136-site .news-more:hover > span, .pw136-site .news-more:focus-visible > span { transform: none; }
}

/* Іконки з assets/era-stat-icons.png, era-stat-icons-2.png та era-stat-icons-3.png (усі 2172×724). Для кожної задано картинку --sheet і рамку в її пікселях: --x, --y, --w, --h та більший бік --side. */
.pw136-site .stat-art { --s: 44px; position: relative; display: block; flex: 0 0 var(--s); width: var(--s); height: var(--s); }
.pw136-site .stat-art::before { content: ''; position: absolute; left: 50%; top: 50%; width: calc(var(--s) * var(--w) / var(--side)); height: calc(var(--s) * var(--h) / var(--side)); transform: translate(-50%, -50%); background: var(--sheet, url('assets/era-stat-icons.png')) no-repeat; background-size: calc(var(--s) * 2172 / var(--side)) calc(var(--s) * 724 / var(--side)); background-position: calc(var(--s) * var(--x) / var(--side) * -1) calc(var(--s) * var(--y) / var(--side) * -1); }
.pw136-site .stat-art--1 { --sheet: url('assets/era-stat-icons-3.png'); --x: 575; --y: 126; --w: 472; --h: 467; --side: 472; }
.pw136-site .stat-art--2 { --x: 283; --y: 225; --w: 269; --h: 269; --side: 269; }
.pw136-site .stat-art--3 { --sheet: url('assets/era-stat-icons-3.png'); --x: 1727; --y: 45; --w: 390; --h: 568; --side: 568; }
.pw136-site .stat-art--4 { --sheet: url('assets/era-stat-icons-2.png'); --x: 1122; --y: 138; --w: 444; --h: 426; --side: 444; }
.pw136-site .stat-art--5 { --x: 1117; --y: 219; --w: 217; --h: 269; --side: 269; }
.pw136-site .stat-art--6 { --sheet: url('assets/era-stat-icons-2.png'); --x: 1716; --y: 89; --w: 387; --h: 526; --side: 526; }
.pw136-site .stat-art--7 { --x: 1623; --y: 225; --w: 273; --h: 262; --side: 273; }
.pw136-site .stat-art--8 { --x: 1910; --y: 235; --w: 241; --h: 243; --side: 243; }
.pw136-site .stat-art--exp { --sheet: url('assets/era-about-icons-1.png'); --x: 8; --y: 204; --w: 305; --h: 309; --side: 309; }
.pw136-site .stat-art--spirit { --sheet: url('assets/era-about-icons-1.png'); --x: 313; --y: 195; --w: 296; --h: 308; --side: 308; }
.pw136-site .stat-art--yuan { --sheet: url('assets/era-about-icons-1.png'); --x: 609; --y: 272; --w: 320; --h: 206; --side: 320; }
.pw136-site .stat-art--gem { --sheet: url('assets/era-about-icons-1.png'); --x: 948; --y: 226; --w: 258; --h: 281; --side: 281; }
.pw136-site .stat-art--armor { --sheet: url('assets/era-about-icons-1.png'); --x: 1224; --y: 212; --w: 334; --h: 295; --side: 334; }
.pw136-site .stat-art--cult { --sheet: url('assets/era-about-icons-1.png'); --x: 1566; --y: 195; --w: 288; --h: 312; --side: 312; }
.pw136-site .stat-art--chest { --sheet: url('assets/era-about-icons-1.png'); --x: 1877; --y: 245; --w: 284; --h: 243; --side: 284; }
.pw136-site .stat-art--daily { --sheet: url('assets/era-about-icons-2.png'); --x: 22; --y: 237; --w: 323; --h: 267; --side: 323; }
.pw136-site .stat-art--craft { --sheet: url('assets/era-about-icons-2.png'); --x: 379; --y: 221; --w: 366; --h: 299; --side: 366; }
.pw136-site .stat-art--trade { --sheet: url('assets/era-about-icons-2.png'); --x: 759; --y: 215; --w: 310; --h: 315; --side: 315; }
.pw136-site .stat-art--travel { --sheet: url('assets/era-about-icons-2.png'); --x: 1090; --y: 223; --w: 399; --h: 285; --side: 399; }
.pw136-site .stat-art--sphere { --sheet: url('assets/era-about-icons-2.png'); --x: 1520; --y: 206; --w: 273; --h: 319; --side: 319; }
.pw136-site .stat-art--abacus { --sheet: url('assets/era-about-icons-2.png'); --x: 1828; --y: 246; --w: 320; --h: 253; --side: 320; }
.pw136-site .rank-heading .stat-art { --s: 28px; }
@media (max-width: 1280px) {
  .pw136-site .foundation-grid .stat-art { --s: 36px; }
}
@media (max-width: 480px) {
  .pw136-site .foundation-grid .stat-art { --s: 32px; }
}

/* ERA ember: сторінка «Про сервер». Рейти й параметри першими, далі раси, підземелля, плитки з іконками. */
.pw136-site .about-hero { position: relative; isolation: isolate; display: flex; align-items: flex-end; min-height: 360px; overflow: hidden; border-bottom: 1px solid rgb(255 122 26 / .22); }
.pw136-site .about-hero-image { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: 50% 42%; filter: saturate(1.05) brightness(.82); }
.pw136-site .about-hero::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgb(var(--shade) / .92), rgb(var(--shade) / .55) 45%, rgb(var(--shade) / .08) 78%), linear-gradient(0deg, var(--bg), transparent 55%); }
.pw136-site .about-hero-inner { padding-block: 64px 40px; }
.pw136-site .about-hero .eyebrow { display: flex; align-items: center; gap: 12px; }
.pw136-site .about-hero .small-rule { width: 7px; height: 9px; margin: 0; background: var(--accent); clip-path: polygon(0 0, 100% 50%, 0 100%); }
.pw136-site .about-hero h1 { margin-top: 16px; font-size: 48px; font-weight: 700; letter-spacing: -.02em; line-height: 1.1; }
.pw136-site .about-hero-lead { margin-top: 16px; max-width: 48ch; color: var(--body); font-size: 18px; }

.pw136-site .rates-board, .pw136-site .param-cards > li, .pw136-site .race-card, .pw136-site .dungeon-card, .pw136-site .feature-tiles > li, .pw136-site .marathon-card { border: 1px solid rgb(255 122 26 / .16); border-radius: 12px; background: radial-gradient(120% 90% at 0% 0%, rgb(255 120 40 / .09), transparent 55%), linear-gradient(180deg, #17120e, #100d0b); box-shadow: inset 0 1px 0 rgb(255 170 100 / .06); }
.pw136-site .server-passport, .pw136-site .race-showcase, .pw136-site .dungeon-showcase, .pw136-site .world-tiles, .pw136-site .era-features, .pw136-site .era-marathons { padding-block: 40px 8px; scroll-margin-top: 24px; }
.pw136-site .passport-grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 16px; }
.pw136-site .rates-board { display: flex; flex-direction: column; gap: 16px; min-width: 0; padding: 24px; }
.pw136-site .rate-cards, .pw136-site .rate-chips, .pw136-site .param-cards, .pw136-site .feature-tiles, .pw136-site .mode-steps, .pw136-site .level-chips { margin: 0; padding: 0; list-style: none; }
.pw136-site .rate-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.pw136-site .rate-card { display: flex; align-items: center; gap: 12px; min-width: 0; padding: 16px; border: 1px solid rgb(255 255 255 / .05); border-radius: 8px; background: rgb(0 0 0 / .3); }
.pw136-site .rate-card .stat-art { --s: 48px; }
.pw136-site .rate-card strong { display: block; color: var(--accent); font: 700 36px/1 var(--heading); }
.pw136-site .rate-card p > span, .pw136-site .param-cards p > span { display: block; margin-top: 4px; color: var(--muted); font-size: 13px; line-height: 1.4; }
.pw136-site .rates-scope, .pw136-site .passport-note, .pw136-site .marathon-note { color: var(--soft); font-size: 13px; }
.pw136-site .passport-note, .pw136-site .marathon-note { margin-top: 16px; }
.pw136-site .rate-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.pw136-site .rate-chips li { display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; border: 1px solid var(--line-strong); border-radius: 8px; background: rgb(0 0 0 / .25); color: var(--body); font-size: 13px; }
.pw136-site .rate-chips b { color: var(--accent); font-weight: 700; }
.pw136-site .param-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.pw136-site .param-cards > li { display: flex; align-items: center; gap: 16px; min-width: 0; padding: 20px; }
.pw136-site .param-cards strong { display: block; color: var(--text); font: 700 28px/1.1 var(--heading); }
.pw136-site .param-cards > li:last-child strong { font-size: 18px; line-height: 1.3; }

.pw136-site .race-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.pw136-site .race-card { display: flex; flex-direction: column; gap: 16px; min-width: 0; padding: 24px; }
.pw136-site .race-card header { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.pw136-site .race-card h3 { font-size: 22px; }
.pw136-site .race-card header span { color: var(--soft); font-size: 12px; }
.pw136-site .class-card { display: flex; align-items: flex-start; gap: 16px; }
.pw136-site .class-card img { flex-shrink: 0; width: 48px; height: 48px; border: 1px solid rgb(255 122 26 / .22); border-radius: 8px; background: var(--bg); }
.pw136-site .class-card strong { display: block; font: 700 18px/1.3 var(--heading); }
.pw136-site .class-role { display: inline-block; margin-top: 4px; color: var(--accent); font-size: 12px; }
.pw136-site .class-card p { margin-top: 4px; color: var(--muted); font-size: 13px; line-height: 1.5; }

.pw136-site .dungeon-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.pw136-site .dungeon-card { display: flex; flex-direction: column; min-width: 0; overflow: hidden; scroll-margin-top: 24px; }
.pw136-site .dungeon-card > img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; border-bottom: 1px solid rgb(255 122 26 / .2); }
.pw136-site .dungeon-card--cube > img { object-position: 50% 0; }
.pw136-site .dungeon-card--twilight > img { object-position: 50% 45%; }
.pw136-site .dungeon-copy { position: relative; display: flex; flex: 1; flex-direction: column; align-items: flex-start; gap: 8px; padding: 16px 20px 20px; background: inherit; }
.pw136-site .dungeon-copy h3 { font-size: 20px; }
.pw136-site .dungeon-copy p { color: var(--muted); font-size: 13px; line-height: 1.5; }
.pw136-site .dungeon-card--wide { grid-column: span 2; }
.pw136-site .dungeon-card--wide .dungeon-copy { padding: 24px; }
.pw136-site .mode-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; align-self: stretch; margin-top: 8px; }
.pw136-site .mode-steps li { padding: 12px; border: 1px solid rgb(255 255 255 / .05); border-radius: 8px; background: rgb(0 0 0 / .3); }
.pw136-site .mode-steps strong { display: block; color: var(--accent); font: 700 18px/1.2 var(--heading); font-variant-numeric: tabular-nums; }
.pw136-site .mode-steps span { display: block; margin-top: 4px; color: var(--muted); font-size: 12px; }
.pw136-site .level-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.pw136-site .level-chips li { min-width: 48px; padding: 10px 8px; border: 1px solid rgb(255 122 26 / .25); border-radius: 8px; background: rgb(0 0 0 / .3); color: var(--accent); font: 700 16px/1 var(--heading); text-align: center; }
.pw136-site .dungeon-card--media { position: relative; display: grid; grid-template-columns: 46% minmax(0, 1fr); align-items: stretch; min-height: 320px; }
.pw136-site .dungeon-card--media > .dungeon-copy { grid-column: 2; }
.pw136-site .dungeon-card--media > .dungeon-media { position: absolute; left: 0; top: 0; width: 46%; height: 100%; min-height: 0; aspect-ratio: auto; object-fit: cover; object-position: 50% 45%; border-right: 1px solid rgb(255 122 26 / .18); border-bottom: 0; }
.pw136-site .dungeon-card--guimu > img { object-position: 50% 35%; }
.pw136-site .quest-caption { color: var(--text); font-size: 14px; font-weight: 600; }
/* приписка рівня під підписом кадру (109: одна копія на день) — тим самим бурштиновим знаком, що підказка боса у вікні карт */
.pw136-site .quest-note { margin: 0; padding: 6px 10px; border-left: 2px solid #e2a23a; border-radius: 0 6px 6px 0; background: rgb(242 177 58 / .08); color: var(--body); font-size: 13px; line-height: 1.45; }
.pw136-site .level-chips--buttons li { min-width: 0; padding: 0; border: 0; background: none; }
.pw136-site .level-chips--buttons button, .pw136-site .level-chips--buttons span { display: block; min-width: 48px; min-height: 40px; padding: 10px 8px; border: 1px solid rgb(255 122 26 / .25); border-radius: 8px; background: rgb(0 0 0 / .3); color: var(--accent); font: 700 16px/1 var(--heading); text-align: center; }
.pw136-site .level-chips--buttons span { color: var(--soft); border-color: var(--line-strong); }
.pw136-site .level-chips--buttons button { cursor: pointer; transition: background 150ms cubic-bezier(.4,0,.2,1), border-color 150ms cubic-bezier(.4,0,.2,1), color 150ms cubic-bezier(.4,0,.2,1); }
.pw136-site .level-chips--buttons button:hover { border-color: rgb(255 122 26 / .6); background: rgb(255 122 26 / .12); }
.pw136-site .level-chips--buttons button[aria-pressed="true"] { border-color: #ff9a4a; background: linear-gradient(135deg, #ff9a45 0%, var(--accent) 55%, #ee6a10 100%); color: var(--accent-ink); box-shadow: inset 0 1px 0 rgb(255 255 255 / .2); }
@media (max-width: 600px) {
  .pw136-site .dungeon-card--media { grid-template-columns: minmax(0, 1fr); }
  .pw136-site .dungeon-card--media > .dungeon-copy { grid-column: auto; }
  .pw136-site .dungeon-card--media > .dungeon-media, .pw136-site .dungeon-card--guimu > .dungeon-media { position: static; width: 100%; height: auto; min-height: 0; aspect-ratio: 16 / 10; border-right: 0; border-bottom: 1px solid rgb(255 122 26 / .18); }
}

.pw136-site .feature-tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.pw136-site .feature-tiles--era { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.pw136-site .feature-tiles > li { display: flex; align-items: flex-start; gap: 16px; min-width: 0; padding: 20px; scroll-margin-top: 24px; }
.pw136-site .feature-tiles .stat-art { --s: 48px; }
.pw136-site .feature-tiles h3 { font-size: 18px; }
.pw136-site .feature-tiles .feature-kicker { margin-bottom: 8px; }
.pw136-site .feature-tiles p { margin-top: 4px; color: var(--muted); font-size: 13px; line-height: 1.5; }
.pw136-site .era-features .era-feature-note { margin-top: 16px; }

.pw136-site .marathon-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.pw136-site .marathon-card { position: relative; isolation: isolate; display: flex; align-items: center; gap: 24px; min-width: 0; min-height: 160px; overflow: hidden; padding: 24px 32px; transition: border-color 150ms cubic-bezier(.4,0,.2,1); }
.pw136-site .marathon-card > img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; filter: brightness(.6) saturate(1.05); transition: transform 280ms ease; }
.pw136-site .marathon-card::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgb(var(--shade) / .92), rgb(var(--shade) / .35)); }
.pw136-site .marathon-card:hover, .pw136-site .marathon-card:focus-visible { border-color: rgb(255 122 26 / .55); }
.pw136-site .marathon-card:hover > img, .pw136-site .marathon-card:focus-visible > img { transform: scale(1.03); }
.pw136-site .marathon-big { min-width: 72px; color: var(--body); font-size: 13px; text-align: center; }
.pw136-site .marathon-big strong { display: block; color: var(--accent); font: 700 48px/1 var(--heading); }
.pw136-site .marathon-card-copy { min-width: 0; }
.pw136-site .marathon-title { display: block; color: var(--text); font: 700 22px/1.3 var(--heading); }
.pw136-site .marathon-card small { display: block; margin-top: 4px; color: var(--body); font-size: 13px; }
.pw136-site .marathon-card .marathon-arrow { margin-left: auto; color: var(--accent); font-size: 22px; }

@media (max-width: 1024px) {
  .pw136-site .passport-grid { grid-template-columns: minmax(0, 1fr); }
  .pw136-site .dungeon-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pw136-site .feature-tiles, .pw136-site .feature-tiles--era { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pw136-site .about-hero h1 { font-size: 40px; }
}
@media (max-width: 920px) {
  .pw136-site .race-cards { grid-template-columns: minmax(0, 1fr); }
  .pw136-site .marathon-cards { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 760px) {
  .pw136-site .about-hero { min-height: 300px; }
  .pw136-site .about-hero-inner { padding-block: 48px 32px; }
  .pw136-site .about-hero h1 { font-size: 36px; }
  .pw136-site .about-hero-lead { font-size: 16px; }
  .pw136-site .server-passport, .pw136-site .race-showcase, .pw136-site .dungeon-showcase, .pw136-site .world-tiles, .pw136-site .era-features, .pw136-site .era-marathons { padding-top: 32px; }
}
@media (max-width: 600px) {
  .pw136-site .rates-board { padding: 16px; }
  .pw136-site .rate-card { flex-direction: column; align-items: center; gap: 8px; padding: 12px 8px; text-align: center; }
  .pw136-site .rate-card .stat-art { --s: 40px; }
  .pw136-site .rate-card strong { font-size: 28px; }
  .pw136-site .param-cards > li { gap: 12px; padding: 16px; }
  .pw136-site .param-cards .stat-art { --s: 36px; }
  .pw136-site .param-cards strong { font-size: 22px; }
  .pw136-site .dungeon-grid, .pw136-site .feature-tiles, .pw136-site .feature-tiles--era { grid-template-columns: minmax(0, 1fr); }
  .pw136-site .dungeon-card--wide { grid-column: auto; }
  .pw136-site .mode-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pw136-site .marathon-card { gap: 16px; padding: 20px; }
  .pw136-site .marathon-big strong { font-size: 40px; }
  .pw136-site .marathon-title { font-size: 18px; }
}
@media (prefers-reduced-motion: reduce) {
  .pw136-site .marathon-card:hover > img, .pw136-site .marathon-card:focus-visible > img { transform: none; }
}

/* Спокійне світло: блік по кнопці замість постійного сяйва. */
.pw136-site .button::after, .pw136-site .header-action::after { content: ''; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(115deg, transparent 38%, rgb(255 255 255 / .26) 50%, transparent 62%); transform: translateX(-130%); transition: transform 700ms cubic-bezier(.2, .7, .3, 1); }
.pw136-site .header-action::after { background: linear-gradient(115deg, transparent 38%, rgb(255 168 80 / .3) 50%, transparent 62%); }
.pw136-site .button:hover::after, .pw136-site .button:focus-visible::after, .pw136-site .header-action:hover::after, .pw136-site .header-action:focus-visible::after { transform: translateX(130%); }
.pw136-site .button > span, .pw136-site .header-action > span, .pw136-site .account-icon { position: relative; z-index: 1; }
.pw136-site .header-action { transition: border-color 200ms cubic-bezier(.4,0,.2,1), background 200ms cubic-bezier(.4,0,.2,1), box-shadow 200ms cubic-bezier(.4,0,.2,1), transform 150ms cubic-bezier(.4,0,.2,1); }
.pw136-site .button:hover, .pw136-site .button:focus-visible, .pw136-site .header-action:hover, .pw136-site .header-action:focus-visible { transform: translateY(-1px); }
.pw136-site .button:active, .pw136-site .header-action:active { transform: translateY(0); }
@media (prefers-reduced-motion: reduce) {
  .pw136-site .button::after, .pw136-site .header-action::after { display: none; }
  .pw136-site .button:hover, .pw136-site .button:focus-visible, .pw136-site .header-action:hover, .pw136-site .header-action:focus-visible { transform: none; }
}

/* Стартові міста рас, 16.09.2026 */
.pw136-site .race-card > .race-photo { display: block; width: calc(100% + 48px); max-width: none; height: auto; margin: -24px -24px 0; border-bottom: 1px solid rgb(255 122 26 / .2); border-radius: 12px 12px 0 0; aspect-ratio: 16 / 9; object-fit: cover; object-position: 50% 55%; }

/* Доведення деталей, 16.09.2026: рейтинг без порожнього низу, стани кнопок, список випробувань у смузі. */
.pw136-site .ranking-panel { display: flex; flex: 1; flex-direction: column; min-height: 0; }
.pw136-site .rank-table { flex: 1; }
.pw136-site .rank-table caption { position: static; width: auto; height: auto; margin: 0; padding: 14px 0 0; overflow: visible; clip-path: none; white-space: normal; caption-side: bottom; color: var(--soft); font-size: 12px; line-height: 1.5; text-align: left; border-top: 1px solid var(--line); }
.pw136-site .rank-table tbody tr:last-child > * { border-bottom: 0; }
.pw136-site .rank-table tbody th { font-weight: 500; }
/* Вільне місце топ-10 (31.10.2026): приглушений номер і тонка риска замість імені. */
.pw136-site .rank-table tr.rank-slot td:first-child { color: var(--soft); opacity: .45; }
.pw136-site .rank-table tr.rank-slot th::after { content: ''; display: block; width: 56px; height: 2px; margin-block: calc(.8em - 1px); border-radius: 2px; background: rgb(255 255 255 / .08); }
.pw136-site .button > span, .pw136-site .text-link > span, .pw136-site .story-read > span, .pw136-site .marathon-arrow { transition: transform 180ms cubic-bezier(.4,0,.2,1); }
.pw136-site .button:hover > span, .pw136-site .button:focus-visible > span, .pw136-site .story-read:hover > span, .pw136-site .story-read:focus-visible > span, .pw136-site .marathon-card:hover .marathon-arrow, .pw136-site .marathon-card:focus-visible .marathon-arrow { transform: translateX(3px); }
.pw136-site .button:active, .pw136-site .header-action:active, .pw136-site .button.button-secondary:active { transform: translateY(1px) scale(.985); transition-duration: 60ms; }
.pw136-site .ranking-tabs button { transition: background 150ms cubic-bezier(.4,0,.2,1), color 150ms cubic-bezier(.4,0,.2,1), transform 80ms ease; }
.pw136-site .ranking-tabs button:active, .pw136-site .level-chips--buttons button:active, .pw136-site .forum-search button:active, .pw136-site .menu-toggle:active { transform: scale(.97); }
.pw136-site .ranking-tabs button:focus-visible, .pw136-site .level-chips--buttons button:focus-visible { outline-offset: 2px; }
.pw136-site .main-nav a::after { transform-origin: left center; }
.pw136-site .header-action, .pw136-site .download-mirrors > a, .pw136-site .marathon-links > a, .pw136-site .community-telegram, .pw136-site .chat-inline-links a, .pw136-site .forum-categories a { transition: border-color 180ms cubic-bezier(.4,0,.2,1), background 180ms cubic-bezier(.4,0,.2,1), color 180ms cubic-bezier(.4,0,.2,1), box-shadow 180ms cubic-bezier(.4,0,.2,1), transform 150ms cubic-bezier(.4,0,.2,1); }
.pw136-site .main-nav a, .pw136-site .footer-main a, .pw136-site .view-all, .pw136-site .news-more, .pw136-site .ranking-more, .pw136-site .back-link, .pw136-site .inline-link, .pw136-site .article-contents a, .pw136-site .post-actions a, .pw136-site .community-nav > div > a { transition: color 150ms cubic-bezier(.4,0,.2,1), border-color 150ms cubic-bezier(.4,0,.2,1); }
.pw136-site .inline-link { text-decoration-color: rgb(255 122 26 / .45); transition: color 150ms cubic-bezier(.4,0,.2,1), text-decoration-color 150ms cubic-bezier(.4,0,.2,1); }
.pw136-site .inline-link:hover, .pw136-site .inline-link:focus-visible { color: var(--accent-hover); text-decoration-color: currentColor; }
.pw136-site .world-strip { gap: 48px; }
.pw136-site .world-strip-links { display: flex; flex-direction: column; gap: 0; min-width: 260px; }
.pw136-site .world-strip-links a { justify-content: space-between; gap: 24px; min-height: 42px; border-top: 1px solid rgb(255 255 255 / .1); color: var(--body); transition: color 150ms cubic-bezier(.4,0,.2,1); }
.pw136-site .world-strip-links a:first-child { border-top: 0; }
.pw136-site .world-strip-links a::after { content: '→'; color: var(--accent); opacity: 0; transform: translateX(-6px); transition: opacity 180ms cubic-bezier(.4,0,.2,1), transform 180ms cubic-bezier(.4,0,.2,1); }
.pw136-site .world-strip-links a:hover, .pw136-site .world-strip-links a:focus-visible { color: var(--text); text-decoration: none; }
.pw136-site .world-strip-links a:hover::after, .pw136-site .world-strip-links a:focus-visible::after { opacity: 1; transform: none; }
@media (max-width: 760px) {
  .pw136-site .rank-table caption { padding-top: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .pw136-site .button:hover > span, .pw136-site .button:focus-visible > span, .pw136-site .story-read:hover > span, .pw136-site .marathon-card:hover .marathon-arrow, .pw136-site .world-strip-links a::after { transform: none; }
  .pw136-site .world-strip-links a::after { opacity: 1; }
  .pw136-site .button:active, .pw136-site .header-action:active, .pw136-site .ranking-tabs button:active, .pw136-site .level-chips--buttons button:active { transform: none; }
}

/* «Про сервер» і «Завантаження»: рівний ряд плашок рівнів, щільніші плитки, круглі позначки джерел. */
.pw136-site .level-chips--buttons { display: grid; grid-template-columns: repeat(auto-fit, minmax(40px, 1fr)); gap: 6px; width: 100%; }
.pw136-site .level-chips--buttons li { min-width: 0; }
.pw136-site .level-chips--buttons button, .pw136-site .level-chips--buttons span { width: 100%; min-width: 0; padding-inline: 4px; }
.pw136-site .feature-tiles > li { align-items: center; }
.pw136-site .feature-tiles--era > li { align-items: flex-start; }
.pw136-site .mirror-icon { display: grid; place-items: center; flex: 0 0 36px; width: 36px; height: 36px; border: 1px solid var(--accent-line); border-radius: 50%; background: var(--accent-soft); color: var(--accent); font: 600 15px/1 var(--heading); }
.pw136-site .download-mirrors > a:hover .mirror-icon, .pw136-site .download-mirrors > a:focus-visible .mirror-icon { border-color: var(--accent); }
.pw136-site .install-steps li > span { transition: border-color 180ms cubic-bezier(.4,0,.2,1), background 180ms cubic-bezier(.4,0,.2,1); }
.pw136-site .dungeon-card, .pw136-site .race-card { transition: border-color 180ms cubic-bezier(.4,0,.2,1); }
/* Клікабельна картка — стандарт сайту (20.10.2026, власник: «чтобы люди понимали, что туда можно кликнуть»): рамка
   світлішає, кадр трохи наближається й світлішає, заголовок — акцентом, стрілка «Читати посібник →» зсувається.
   Картка, на яку не натиснеш (раси, Гуй Му, «Посібник готується»), на наведення не відповідає зовсім: раніше рамка
   світлішала в усіх. Нова клікабельна картка — посилання <a class="dungeon-card …"> або кадр-кнопка, стандарт приходить
   сам; той самий кадр у посібниках — .g-bcard-media і .g-shot-btn нижче (скіл era-guide). */
.pw136-site a.dungeon-card:hover, .pw136-site a.dungeon-card:focus-visible,
.pw136-site .dungeon-card:has(> .quest-map-open:hover, > .quest-map-open:focus-visible) { border-color: rgb(255 122 26 / .55); }
/* плитка боса без кадру («Щоденні завдання»: відкриває карту підземелля чи посібник Храму) — рамка й назва так само */
.pw136-site button.g-tboss:hover, .pw136-site button.g-tboss:focus-visible, .pw136-site a.g-tboss:hover,
.pw136-site a.g-tboss:focus-visible { border-color: rgb(255 122 26 / .55); }
.pw136-site button.g-tboss:hover strong, .pw136-site button.g-tboss:focus-visible strong, .pw136-site a.g-tboss:hover strong,
.pw136-site a.g-tboss:focus-visible strong { color: var(--accent-hover); }
.pw136-site a.dungeon-card > img { transition: transform 400ms cubic-bezier(.16, 1, .3, 1), filter 200ms ease; }
.pw136-site a.dungeon-card:hover > img, .pw136-site a.dungeon-card:focus-visible > img { transform: scale(1.03); filter: brightness(1.08); }
@media (prefers-reduced-motion: reduce) {
  .pw136-site a.dungeon-card:hover > img, .pw136-site a.dungeon-card:focus-visible > img { transform: none; }
}
@media (min-width: 1281px) {
  .pw136-site .feature-tiles > li { gap: 20px; padding: 24px; }
  .pw136-site .feature-tiles .stat-art { --s: 56px; }
  .pw136-site .feature-tiles h3 { font-size: 20px; }
  .pw136-site .feature-tiles p { margin-top: 6px; font-size: 14px; }
  .pw136-site .mirror-icon { display: grid; }
}
@media (max-width: 1280px) {
  .pw136-site .mirror-icon { display: none; }
}
@media (max-width: 480px) {
  .pw136-site .mirror-icon { display: grid; width: 32px; height: 32px; flex-basis: 32px; }
  .pw136-site .level-chips--buttons { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .pw136-site .world-strip { gap: 32px; }
  .pw136-site .world-strip-links { display: none; }
}

/* Рейтинг: шапка обох таблиць в один рядок, без стрибка при перемиканні вкладок. */
.pw136-site .rank-table thead th { white-space: nowrap; }
.pw136-site .guild-table th:nth-child(3), .pw136-site .guild-table td:nth-child(3), .pw136-site .guild-table th:last-child, .pw136-site .guild-table td:last-child { width: 68px; }
.pw136-site .guild-table th:nth-child(3), .pw136-site .guild-table td:nth-child(3) { padding-right: 6px; }

/* Іконки, згенеровані в ChatGPT 16.09.2026 (design/generated/era-icons-sheet-*.png), нарізані по одній у assets/era-icon-*.png, 256x256 з прозорим тлом. Спрайти era-stat-icons*.png вище лишено для відкату. */
.pw136-site .stat-art::before { left: 0; top: 0; width: 100%; height: 100%; transform: none; background: var(--icon) center / contain no-repeat; }
.pw136-site .stat-art--1 { --icon: url('assets/era-icon-1.webp'); }
.pw136-site .stat-art--2 { --icon: url('assets/era-icon-2.webp'); }
.pw136-site .stat-art--3 { --icon: url('assets/era-icon-3.webp'); }
.pw136-site .stat-art--4 { --icon: url('assets/era-icon-4.webp'); }
.pw136-site .stat-art--5 { --icon: url('assets/era-icon-5.webp'); }
.pw136-site .stat-art--6 { --icon: url('assets/era-icon-6.webp'); }
.pw136-site .stat-art--7 { --icon: url('assets/era-icon-7.webp'); }
.pw136-site .stat-art--exp { --icon: url('assets/era-icon-exp.webp'); }
.pw136-site .rank-heading .stat-art { --s: 30px; }
@media (min-width: 1281px) {
  .pw136-site .foundation-grid .stat-art { --s: 48px; }
}
.pw136-site .stat-art--spirit { --icon: url('assets/era-icon-spirit.webp'); }
.pw136-site .stat-art--yuan { --icon: url('assets/era-icon-yuan.webp'); }
.pw136-site .stat-art--gem { --icon: url('assets/era-icon-gem.webp'); }
.pw136-site .stat-art--armor { --icon: url('assets/era-icon-armor.webp'); }
.pw136-site .stat-art--cult { --icon: url('assets/era-icon-cult.webp'); }
.pw136-site .stat-art--daily { --icon: url('assets/era-icon-daily.webp'); }
.pw136-site .stat-art--craft { --icon: url('assets/era-icon-craft.webp'); }
.pw136-site .stat-art--trade { --icon: url('assets/era-icon-trade.webp'); }
.pw136-site .stat-art--travel { --icon: url('assets/era-icon-travel.webp'); }
.pw136-site .stat-art--sphere { --icon: url('assets/era-icon-sphere.webp'); }
.pw136-site .stat-art--abacus { --icon: url('assets/era-icon-abacus.webp'); }
.pw136-site .stat-art--chest { --icon: url('assets/era-icon-chest.webp'); }

/* Вітрина наробок команди в розділі «Доповнення ERA», 16.09.2026. Ролик запускається натисканням на саме відео; без JavaScript лишаються рідні кнопки браузера без завантаження. */
.pw136-site .era-showcase { padding-bottom: 8px; }
.pw136-site .showcase-lead { max-width: 80ch; color: var(--muted); font-size: 15px; line-height: 1.6; }
.pw136-site .showcase-group { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin-top: 36px; padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.pw136-site .showcase-group h3 { font-size: 22px; }
.pw136-site .showcase-group span { color: var(--soft); font-size: 12px; }
.pw136-site .show-media { position: relative; overflow: hidden; aspect-ratio: 16 / 9; border: 1px solid rgb(255 122 26 / .18); border-radius: 14px; background: #060504; box-shadow: 0 24px 60px -36px rgb(0 0 0 / .9), inset 0 1px 0 rgb(255 170 100 / .08); transition: border-color 200ms cubic-bezier(.4,0,.2,1), box-shadow 200ms cubic-bezier(.4,0,.2,1); }
.pw136-site .show-video { display: block; width: 100%; height: 100%; object-fit: cover; background: #060504; }
.pw136-site .show-media.is-boxed .show-video { position: relative; z-index: 1; object-fit: contain; background: transparent; }
.pw136-site .show-media.is-boxed::before { content: ''; position: absolute; inset: -24px; z-index: 0; background: var(--shot) center / cover no-repeat; filter: blur(26px) brightness(.42) saturate(1.1); }
.pw136-site .show-media.is-ready { cursor: pointer; }
.pw136-site .show-media.is-ready:hover, .pw136-site .show-media.is-ready:focus-visible { border-color: rgb(255 122 26 / .5); box-shadow: 0 28px 64px -34px rgb(255 110 20 / .45), inset 0 1px 0 rgb(255 170 100 / .1); }
.pw136-site .show-media.is-ready:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.pw136-site .show-media.is-ready::after { content: ''; position: absolute; inset: 0; background: rgb(0 0 0 / .18); opacity: 1; transition: opacity 300ms cubic-bezier(.4,0,.2,1); pointer-events: none; }
.pw136-site .show-media.is-playing::after { opacity: 0; }
.pw136-site .show-state { position: absolute; left: 50%; top: 50%; z-index: 2; display: none; width: 68px; height: 48px; border: 0; border-radius: 14px; background: rgb(15 15 15 / .78); box-shadow: 0 6px 20px -8px rgb(0 0 0 / .8); transform: translate(-50%, -50%); pointer-events: none; transition: background 160ms cubic-bezier(.4,0,.2,1), opacity 200ms cubic-bezier(.4,0,.2,1), transform 200ms cubic-bezier(.4,0,.2,1); }
.pw136-site .show-media.is-ready .show-state { display: grid; place-items: center; }
.pw136-site .show-state::before { content: ''; width: 20px; height: 22px; margin-left: 4px; background: #fff; clip-path: polygon(0 0, 100% 50%, 0 100%); }
.pw136-site .show-media.is-ready:hover .show-state { background: rgb(15 15 15 / .95); }
.pw136-site .show-media.is-playing .show-state { opacity: 0; transform: translate(-50%, -50%) scale(.9); }
.pw136-site .show-progress { position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; display: none; height: 3px; background: rgb(255 255 255 / .12); pointer-events: none; }
.pw136-site .show-media.is-ready .show-progress { display: block; }
.pw136-site .show-progress > i { display: block; width: 0; height: 100%; background: linear-gradient(90deg, #ff9a4a, var(--accent)); transition: width 200ms linear; }
.pw136-site .show-media--pending { display: grid; place-items: center; background: radial-gradient(120% 90% at 50% 100%, rgb(255 120 40 / .12), transparent 60%), repeating-linear-gradient(135deg, rgb(255 255 255 / .025) 0 2px, transparent 2px 14px), #0d0b09; border-style: dashed; border-color: rgb(255 122 26 / .3); box-shadow: none; }
.pw136-site .pending-mark { display: grid; justify-items: center; gap: 6px; padding: 24px; text-align: center; }
.pw136-site .pending-mark b { font: 700 18px/1.3 var(--heading); color: var(--accent); letter-spacing: .02em; }
.pw136-site .pending-mark span { color: var(--soft); font-size: 13px; }
.pw136-site .feature-rows { display: flex; flex-direction: column; gap: 20px; margin-top: 20px; }
.pw136-site .feature-row { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 32px; align-items: center; min-width: 0; padding: 20px; border: 1px solid rgb(255 122 26 / .14); border-radius: 16px; background: radial-gradient(120% 90% at 0% 0%, rgb(255 120 40 / .08), transparent 55%), linear-gradient(180deg, #15110e, #100d0b); box-shadow: inset 0 1px 0 rgb(255 170 100 / .06); }
.pw136-site .feature-row.is-flipped .show-media { order: 2; }
.pw136-site .feature-row > * { min-width: 0; }
.pw136-site .feature-row-copy { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; padding: 8px 12px 8px 4px; }
.pw136-site .feature-row.is-flipped .feature-row-copy { padding: 8px 4px 8px 12px; }
.pw136-site .feature-row-copy h3 { font-size: 24px; line-height: 1.25; letter-spacing: -.015em; }
.pw136-site .feature-row-copy p { color: var(--muted); font-size: 14px; line-height: 1.65; }
.pw136-site .show-points { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0 0; padding: 0; list-style: none; }
.pw136-site .show-points li { padding: 5px 10px; border: 1px solid var(--line-strong); border-radius: 999px; background: rgb(0 0 0 / .28); color: var(--body); font-size: 12px; }
.pw136-site .show-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; margin: 20px 0 0; padding: 0; list-style: none; }
.pw136-site .show-card { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.pw136-site .show-card .show-media { border-radius: 12px; }
.pw136-site .show-copy { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; padding: 0 4px; }
.pw136-site .show-copy h4 { font-size: 17px; line-height: 1.35; }
.pw136-site .show-copy p { color: var(--muted); font-size: 13px; line-height: 1.55; }
@media (max-width: 1280px) {
  .pw136-site .feature-row { gap: 24px; }
  .pw136-site .feature-row-copy h3 { font-size: 21px; }
}
@media (max-width: 1024px) {
  .pw136-site .feature-row { grid-template-columns: minmax(0, 1fr); gap: 16px; padding: 16px; }
  .pw136-site .feature-row.is-flipped .show-media { order: 0; }
  .pw136-site .feature-row-copy, .pw136-site .feature-row.is-flipped .feature-row-copy { padding: 4px 4px 8px; }
  .pw136-site .show-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
}
@media (max-width: 600px) {
  .pw136-site .show-grid { grid-template-columns: minmax(0, 1fr); }
  .pw136-site .showcase-group { margin-top: 28px; }
  .pw136-site .feature-row { padding: 12px; border-radius: 14px; }
  .pw136-site .show-state { width: 58px; height: 40px; border-radius: 11px; }
  .pw136-site .show-state::before { width: 16px; height: 18px; }
}
@media (prefers-reduced-motion: reduce) {
  .pw136-site .show-media.is-ready:hover .show-state, .pw136-site .show-media.is-playing .show-state { transform: translate(-50%, -50%); }
}

/* Сторінка «Завантаження», 16.09.2026: джерела з логотипами, дві панелі за зразком сторінки файлів Genesis, обов’язковий крок виділено. */
.pw136-site .source-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 12px; }
.pw136-site .source-card { display: flex; align-items: center; gap: 14px; min-width: 0; padding: 12px 14px; border: 1px solid var(--line-strong); border-radius: 12px; background: rgb(0 0 0 / .28); color: var(--text); transition: border-color 180ms cubic-bezier(.4,0,.2,1), background 180ms cubic-bezier(.4,0,.2,1), transform 150ms cubic-bezier(.4,0,.2,1); }
.pw136-site .source-card:hover, .pw136-site .source-card:focus-visible { border-color: rgb(255 122 26 / .5); background: rgb(255 122 26 / .08); transform: translateY(-1px); }
.pw136-site .source-icon, .pw136-site .component-logo { display: grid; place-items: center; flex: 0 0 48px; width: 48px; height: 48px; border: 1px solid rgb(255 255 255 / .08); border-radius: 12px; background: linear-gradient(180deg, #221c17, #15110e); color: #fff; box-shadow: inset 0 1px 0 rgb(255 255 255 / .06); }
.pw136-site .source-icon img { width: auto; height: 24px; max-width: 26px; object-fit: contain; }
.pw136-site .source-copy, .pw136-site .component-copy, .pw136-site .support-copy { min-width: 0; }
.pw136-site .source-copy strong, .pw136-site .component-copy strong, .pw136-site .support-copy strong { display: block; font: 600 15px/1.3 var(--heading); }
.pw136-site .source-copy small, .pw136-site .component-copy small, .pw136-site .support-copy small { display: block; margin-top: 3px; color: var(--soft); font-size: 12px; line-height: 1.45; }
.pw136-site .files-panels { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 20px; padding-block: 24px 40px; }
.pw136-site .panel { display: flex; flex-direction: column; min-width: 0; padding: 24px; border: 1px solid rgb(255 122 26 / .16); border-radius: 14px; background: radial-gradient(120% 90% at 0% 0%, rgb(255 120 40 / .09), transparent 55%), linear-gradient(180deg, #17120e, #100d0b); box-shadow: inset 0 1px 0 rgb(255 170 100 / .06); }
.pw136-site .panel-head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; padding-bottom: 16px; border-bottom: 1px solid var(--line); }
.pw136-site .panel-head h2 { font-size: 22px; }
.pw136-site .panel-head span { color: var(--soft); font-size: 12px; text-align: right; }
.pw136-site .steps { margin: 0; padding: 0; list-style: none; }
.pw136-site .step { display: flex; gap: 16px; padding: 18px 8px; border-bottom: 1px solid var(--line); }
.pw136-site .step:last-child { border-bottom: 0; padding-bottom: 8px; }
.pw136-site .step-index { display: grid; place-items: center; flex: 0 0 34px; width: 34px; height: 34px; border: 1px solid rgb(255 122 26 / .35); border-radius: 50%; background: rgb(255 122 26 / .1); color: var(--accent); font: 700 14px/1 var(--heading); }
.pw136-site .step-copy { min-width: 0; padding-top: 5px; }
.pw136-site .step-copy h3 { font-size: 17px; line-height: 1.35; }
.pw136-site .step-copy p { margin-top: 6px; color: var(--muted); font-size: 14px; line-height: 1.6; }
.pw136-site .step-copy .inline-link { display: inline-block; margin-top: 8px; font-size: 13px; }
.pw136-site .step.is-required { margin-inline: -8px; padding: 18px 16px 18px 20px; border-bottom: 0; border-radius: 12px; background: linear-gradient(90deg, rgb(255 122 26 / .14), rgb(255 122 26 / .04) 70%, transparent); box-shadow: inset 3px 0 0 var(--accent); }
.pw136-site .step.is-required + .step { border-top: 1px solid var(--line); }
.pw136-site .step.is-required .step-index { border-color: var(--accent); background: linear-gradient(135deg, #ff9f4c 0%, var(--accent) 55%, #ee6a10 100%); color: var(--accent-ink); box-shadow: 0 8px 20px -10px rgb(255 110 20 / .8); }
.pw136-site .step-flag { display: inline-flex; align-items: center; margin-bottom: 8px; padding: 3px 8px; border: 1px solid rgb(255 122 26 / .4); border-radius: 4px; background: rgb(255 122 26 / .16); color: #ff9a4d; font: 700 11px/1.2 var(--heading); letter-spacing: 1px; text-transform: uppercase; }
.pw136-site .step .antivirus-details { margin: 10px 0 0; max-width: none; }
.pw136-site .step .antivirus-details summary { padding-block: 8px; font-size: 14px; }
.pw136-site .step .antivirus-details ol { font-size: 14px; }
.pw136-site .component-list { display: flex; flex-direction: column; gap: 10px; margin-top: 16px; }
.pw136-site .component-card { display: flex; align-items: center; gap: 14px; padding: 12px 14px; border: 1px solid var(--line-strong); border-radius: 12px; background: rgb(0 0 0 / .25); color: var(--text); transition: border-color 180ms cubic-bezier(.4,0,.2,1), background 180ms cubic-bezier(.4,0,.2,1), transform 150ms cubic-bezier(.4,0,.2,1); }
.pw136-site a.component-card:hover, .pw136-site a.component-card:focus-visible { border-color: rgb(255 122 26 / .5); background: rgb(255 122 26 / .08); transform: translateY(-1px); }
.pw136-site .component-logo { flex-basis: 56px; width: 56px; height: 56px; background: #fff; border-color: rgb(255 255 255 / .2); }
.pw136-site .component-logo img { width: auto; height: 26px; max-width: 44px; object-fit: contain; filter: invert(1) brightness(.1); }
.pw136-site .support-card { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 20px; padding: 16px 18px; border: 1px solid rgb(255 122 26 / .35); border-radius: 12px; background: rgb(255 122 26 / .08); color: var(--text); transition: border-color 180ms cubic-bezier(.4,0,.2,1), background 180ms cubic-bezier(.4,0,.2,1); }
.pw136-site .panel--components .support-card { margin-top: auto; padding-top: 16px; }
.pw136-site .support-card:hover, .pw136-site .support-card:focus-visible { border-color: var(--accent); background: rgb(255 122 26 / .14); }
.pw136-site .support-card .support-copy strong { color: var(--accent); }
.pw136-site .support-arrow { color: var(--accent); font-size: 22px; transition: transform 180ms cubic-bezier(.4,0,.2,1); }
.pw136-site .support-card:hover .support-arrow { transform: translateX(3px); }
@media (max-width: 1280px) {
  .pw136-site .source-card { padding: 10px 12px; gap: 12px; }
  .pw136-site .source-icon { flex-basis: 40px; width: 40px; height: 40px; border-radius: 10px; }
  .pw136-site .source-icon img { height: 20px; }
  .pw136-site .source-copy strong { font-size: 14px; }
}
@media (max-width: 1024px) {
  .pw136-site .files-panels { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 760px) {
  .pw136-site .source-cards { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .pw136-site .panel { padding: 18px 16px; }
  .pw136-site .panel-head { flex-direction: column; align-items: flex-start; gap: 4px; }
  .pw136-site .panel-head span { text-align: left; }
  .pw136-site .step { gap: 12px; padding-inline: 4px; }
  .pw136-site .step.is-required { margin-inline: -4px; padding: 16px 12px 16px 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .pw136-site .source-card:hover, .pw136-site .component-card:hover, .pw136-site .support-card:hover .support-arrow { transform: none; }
}

/* «Завантаження» заповнює екран на будь-якому моніторі, 16.09.2026: базові розміри вміщаються у вікно 993 точки (Full HD з панелями браузера), а коефіцієнт --k = висота вікна / 993 (через tan(atan2), від .92 до 2.1) пропорційно збільшує шрифти, відступи, кадр і картки на 2K та 4K; без підтримки tan/atan2 браузер лишає --k = 1; підвал притиснутий до низу; до 1024 звичайна стрічка. */
.pw136-site.page-files .console-title span { color: var(--accent); font-weight: 400; }
@media (min-width: 1025px) {
  .pw136-site.page-files { --k: 1; --k: clamp(.88, tan(atan2(100vh, 1040px)), 2.1); display: flex; flex-direction: column; min-height: 100vh; }
  .pw136-site.page-files > main { display: flex; flex: 1; flex-direction: column; }
  .pw136-site.page-files .download-hub { margin-top: calc(12px * var(--k)); }
  .pw136-site.page-files .download-cover { min-height: calc(260px * var(--k)); }
  .pw136-site.page-files .download-console { display: flex; flex-direction: column; justify-content: center; padding: calc(14px * var(--k)) clamp(24px, 2vw, 44px) calc(16px * var(--k)); }
  .pw136-site.page-files .console-title { margin-top: calc(6px * var(--k)); font-size: calc(26px * var(--k)); line-height: 1.15; letter-spacing: -.02em; }
  .pw136-site.page-files .console-lead { margin-top: calc(6px * var(--k)); font-size: calc(14px * var(--k)); }
  .pw136-site.page-files .download-main-action { margin-top: calc(12px * var(--k)); }
  .pw136-site.page-files .download-main-action .button { min-height: calc(44px * var(--k)); }
  .pw136-site.page-files .mirror-label { margin-top: calc(12px * var(--k)); padding-top: calc(10px * var(--k)); }
  .pw136-site.page-files .source-cards { margin-top: calc(10px * var(--k)); gap: clamp(10px, .8vw, 16px); }
  .pw136-site.page-files .source-card { padding: calc(8px * var(--k)) clamp(12px, .9vw, 18px); gap: clamp(12px, .9vw, 16px); }
  .pw136-site.page-files .source-icon { flex-basis: calc(40px * var(--k)); width: calc(40px * var(--k)); height: calc(40px * var(--k)); border-radius: 10px; }
  .pw136-site.page-files .source-icon img { height: calc(20px * var(--k)); }
  .pw136-site.page-files .source-icon svg { width: calc(22px * var(--k)); height: calc(22px * var(--k)); }
  .pw136-site.page-files .source-copy strong { font-size: calc(14px * var(--k)); }
  .pw136-site.page-files .source-copy small { margin-top: 2px; font-size: max(12px, calc(11px * var(--k))); }
  .pw136-site.page-files .files-panels { flex: 1; gap: clamp(16px, 1.4vw, 28px); padding-block: calc(10px * var(--k)) calc(12px * var(--k)); }
  .pw136-site.page-files .panel { padding: calc(14px * var(--k)) clamp(18px, 1.5vw, 32px) calc(10px * var(--k)); }
  .pw136-site.page-files .panel-head { padding-bottom: calc(6px * var(--k)); }
  .pw136-site.page-files .panel-head h2 { font-size: calc(18px * var(--k)); }
  .pw136-site.page-files .steps { display: flex; flex: 1; flex-direction: column; justify-content: space-evenly; }
  .pw136-site.page-files .step { gap: clamp(12px, 1vw, 18px); padding: calc(6px * var(--k)) 6px; }
  .pw136-site.page-files .step:last-child { padding-bottom: calc(4px * var(--k)); }
  .pw136-site.page-files .step-index { flex-basis: calc(26px * var(--k)); width: calc(26px * var(--k)); height: calc(26px * var(--k)); font-size: calc(11px * var(--k)); }
  .pw136-site.page-files .step-copy { padding-top: 2px; }
  .pw136-site.page-files .step-copy h3 { font-size: max(14px, calc(14px * var(--k))); line-height: 1.3; }
  .pw136-site.page-files .step-copy p { margin-top: calc(2px * var(--k)); font-size: max(12.5px, calc(12.5px * var(--k))); line-height: 1.5; }
  .pw136-site.page-files .step-copy .inline-link { margin-top: calc(4px * var(--k)); font-size: calc(12px * var(--k)); }
  .pw136-site.page-files .step.is-required { margin-inline: -6px; padding: calc(6px * var(--k)) clamp(12px, 1vw, 18px) calc(8px * var(--k)) clamp(14px, 1.1vw, 20px) calc(6px * var(--k)) clamp(14px, 1.1vw, 20px); }
  .pw136-site.page-files .step-flag { margin-bottom: calc(4px * var(--k)); padding: 2px 6px; font-size: calc(10px * var(--k)); }
  .pw136-site.page-files .step .antivirus-details { margin-top: calc(4px * var(--k)); }
  .pw136-site.page-files .step .antivirus-details summary { padding-block: calc(4px * var(--k)); font-size: calc(13px * var(--k)); }
  .pw136-site.page-files .panel--components { display: flex; flex-direction: column; }
  .pw136-site.page-files .component-list { display: flex; flex: 1; flex-direction: column; gap: calc(8px * var(--k)); margin-top: calc(10px * var(--k)); }
  .pw136-site.page-files .component-card { flex: 1; padding: calc(9px * var(--k)) clamp(12px, 1vw, 20px); gap: clamp(12px, 1vw, 18px); }
  .pw136-site.page-files .component-logo { flex-basis: calc(44px * var(--k)); width: calc(44px * var(--k)); height: calc(44px * var(--k)); border-radius: 12px; }
  .pw136-site.page-files .component-logo img { height: calc(20px * var(--k)); max-width: calc(34px * var(--k)); }
  .pw136-site.page-files .component-copy strong { font-size: calc(14px * var(--k)); }
  .pw136-site.page-files .component-copy small { margin-top: 2px; font-size: max(12px, calc(11px * var(--k))); }
  .pw136-site.page-files .support-card { margin-top: calc(12px * var(--k)); padding: calc(12px * var(--k)) clamp(16px, 1.2vw, 24px); }
  .pw136-site.page-files .support-copy small { font-size: max(12px, calc(11px * var(--k))); }
  .pw136-site.page-files .compact-footer { padding-block: calc(14px * var(--k)); }
  .pw136-site.page-files .eyebrow { font-size: calc(11px * var(--k)); }
  .pw136-site.page-files .cover-caption { left: calc(32px * var(--k)); right: calc(32px * var(--k)); bottom: calc(32px * var(--k)); }
  .pw136-site.page-files .edition-tag { font-size: calc(11px * var(--k)); }
  .pw136-site.page-files .cover-caption > strong { font-size: calc(32px * var(--k)); }
  .pw136-site.page-files .cover-caption > span:last-child { font-size: calc(14px * var(--k)); }
  .pw136-site.page-files .download-main-action { gap: calc(24px * var(--k)); }
  .pw136-site.page-files .download-main-action .button { padding-inline: calc(20px * var(--k)) calc(18px * var(--k)); font-size: calc(14px * var(--k)); }
  .pw136-site.page-files .download-main-action .button > span { font-size: calc(20px * var(--k)); }
  .pw136-site.page-files .download-main-action > span { font-size: calc(13px * var(--k)); }
  .pw136-site.page-files .download-main-action small { font-size: max(12px, calc(11px * var(--k))); }
  .pw136-site.page-files .mirror-label h3 { font-size: calc(14px * var(--k)); }
  .pw136-site.page-files .mirror-label > span { font-size: calc(11px * var(--k)); }
  .pw136-site.page-files .panel-head span { font-size: max(12px, calc(12px * var(--k))); }
  .pw136-site.page-files .support-copy strong { font-size: calc(15px * var(--k)); }
  .pw136-site.page-files .support-arrow { font-size: calc(22px * var(--k)); }
  .pw136-site.page-files .step .antivirus-details ol, .pw136-site.page-files .step .antivirus-details p { font-size: calc(13px * var(--k)); }
  .pw136-site.page-files .footer-main nav, .pw136-site.page-files .footer-main > p, .pw136-site.page-files .compact-footer #demo-note { font-size: calc(12px * var(--k)); }
  .pw136-site.page-files .footer-brand .footer-wordmark { font-size: calc(20px * var(--k)); }
  .pw136-site.page-files .footer-wordmark small { font-size: calc(11px * var(--k)); }
  .pw136-site.page-files .footer-brand .era-mark { width: calc(48px * var(--k)); height: calc(48px * var(--k)); flex-basis: calc(48px * var(--k)); }
}
@media (max-width: 1024px) {
  .pw136-site.page-files .download-hub { margin-top: 16px; }
  .pw136-site.page-files .download-cover { min-height: 240px; }
  .pw136-site.page-files .console-title { margin-top: 10px; font-size: 28px; line-height: 1.15; }
  .pw136-site.page-files .console-lead { margin-top: 6px; }
}
@media (max-width: 760px) {
  .pw136-site.page-files .download-cover { min-height: 200px; }
  .pw136-site.page-files .console-title { font-size: 26px; }
}
/* «Завантаження» до старту, 01.11.2026: відлік (.launch, як на головній) і дата відкриття реєстрації замість кнопки й дзеркал. */
.pw136-site .prelaunch { display: flex; align-items: center; gap: 14px 28px; margin-top: 20px; }
.pw136-site .prelaunch-clock { flex: 0 0 auto; }
.pw136-site .prelaunch .launch-count { margin-top: 8px; }
.pw136-site .prelaunch .launch-open { margin-top: 6px; }
.pw136-site .prelaunch-note { flex: 1 1 0; min-width: 0; padding-left: 28px; border-left: 1px solid var(--line-strong); color: var(--muted); font-size: 14px; line-height: 1.55; }
.pw136-site .prelaunch-note strong { display: block; margin-bottom: 4px; color: var(--text); font: 600 15px/1.4 var(--heading); }
.pw136-site .prelaunch-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 16px; }
@media (min-width: 1025px) {
  .pw136-site.page-files .prelaunch { margin-top: calc(12px * var(--k)); padding: calc(12px * var(--k)) clamp(16px, 1.3vw, 26px); gap: calc(12px * var(--k)) clamp(20px, 1.8vw, 36px); }
  .pw136-site.page-files .prelaunch .launch-count { margin-top: calc(6px * var(--k)); gap: calc(12px * var(--k)); }
  .pw136-site.page-files .prelaunch .launch-count > span { font-size: calc(12px * var(--k)); }
  .pw136-site.page-files .prelaunch .launch-count b { font-size: calc(26px * var(--k)); }
  .pw136-site.page-files .prelaunch-note { padding-left: clamp(20px, 1.8vw, 36px); font-size: calc(13px * var(--k)); }
  .pw136-site.page-files .prelaunch-note strong { font-size: calc(15px * var(--k)); }
  .pw136-site.page-files .prelaunch-actions { margin-top: calc(12px * var(--k)); gap: calc(12px * var(--k)); }
  .pw136-site.page-files .prelaunch-actions .button { min-height: calc(44px * var(--k)); gap: calc(20px * var(--k)); padding-inline: calc(20px * var(--k)) calc(18px * var(--k)); font-size: calc(14px * var(--k)); }
}
@media (max-width: 760px) {
  .pw136-site .prelaunch { flex-direction: column; align-items: flex-start; }
  .pw136-site .prelaunch-note { padding: 12px 0 0; border-left: 0; border-top: 1px solid var(--line-strong); }
  .pw136-site .prelaunch-actions > .button { flex: 1 1 100%; }
}

/* Підвал: рядок-застереження за зразком сайту команди, права належать правовласникам. */
.pw136-site .footer-main > .footer-note { color: var(--soft); font-size: 13px; white-space: nowrap; }
.pw136-site .footer-legal { margin-top: 14px; padding-top: 12px; border-top: 1px solid rgb(255 255 255 / .05); }
.pw136-site .compact-footer .footer-legal > p, .pw136-site .compact-footer #demo-note { display: block; max-width: 128ch; color: rgb(216 206 194 / .56); font-size: 12px; line-height: 1.6; }
.pw136-site.page-files .footer-legal { margin-top: calc(10px * var(--k)); padding-top: calc(10px * var(--k)); }
.pw136-site.page-files .compact-footer .footer-legal > p { font-size: calc(12px * var(--k)); }
@media (max-width: 1024px) {
  .pw136-site .footer-main > .footer-note { display: block; }
}
@media (max-width: 760px) {
  .pw136-site .footer-main > .footer-note { order: 3; width: 100%; font-size: 12px; }
}
@media (max-width: 760px) {
  .pw136-site .compact-footer .footer-legal > p { font-size: 12px; }
}
/* Соцмережі в підвалі, 31.10.2026 (власник: значки «поїхали вбік» між меню й «©», замалі й притиснуті вліво):
   кнопки розміром зі знак сервера (48). На компʼютері один рядок: знак, меню рівно посередині, соцмережі праворуч,
   усе по центру висоти; «© 2026 ERA PW» — у правому нижньому куті, у рядку документів і застереження. На планшеті й
   телефоні кнопки окремим рядком по центру. */
/* правило меню підвалу (.footer-main nav a: inline-flex) сильніше за .social-links a і лишало значок біля лівого краю кнопки */
.pw136-site .compact-footer .footer-main .social-links a { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 10px; }
.pw136-site .compact-footer .footer-main .social-links svg { width: 24px; height: 24px; }
.pw136-site .compact-footer .footer-legal { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 32px; }
.pw136-site .compact-footer .footer-legal > :not(.footer-note) { grid-column: 1; }
.pw136-site .compact-footer .footer-legal > .footer-note { grid-column: 2; grid-row: 1 / span 2; align-self: end; color: var(--soft); font-size: 12px; white-space: nowrap; }
@media (min-width: 1025px) {
  .pw136-site .compact-footer .footer-main { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); column-gap: 32px; align-items: center; }
  .pw136-site .compact-footer .footer-main > .footer-brand { justify-self: start; }
  .pw136-site .compact-footer .footer-main > .social-links { justify-self: end; }
}
@media (max-width: 1024px) {
  .pw136-site .compact-footer .footer-main > .social-links { order: 5; width: 100%; justify-content: center; }
}
@media (max-width: 760px) {
  .pw136-site .compact-footer .footer-legal { grid-template-columns: minmax(0, 1fr); row-gap: 8px; }
  .pw136-site .compact-footer .footer-legal > .footer-note { grid-column: 1; grid-row: 3; justify-self: end; }
}

/* Обов’язковий крок без плашки: лише смуга зліва та помаранчевий номер, 16.09.2026 */
/* Відступи як у звичайного кроку, щоб номер і текст стояли на одній лінії з сусідами; смуга винесена в поле панелі. */
.pw136-site .step.is-required, .pw136-site.page-files .step.is-required { position: relative; margin-inline: 0; padding: 18px 8px; border-radius: 0; background: none; box-shadow: none; border-bottom: 1px solid var(--line); }
.pw136-site .step.is-required::before { content: ''; position: absolute; left: -10px; top: 10px; bottom: 10px; width: 3px; border-radius: 2px; background: var(--accent); }
.pw136-site .step.is-required + .step { border-top: 0; }
@media (max-width: 760px) {
  .pw136-site .step.is-required, .pw136-site.page-files .step.is-required { padding-inline: 4px; }
}
@media (min-width: 1025px) {
  .pw136-site.page-files .step.is-required { padding: calc(6px * var(--k)) 6px; }
}


/* Телефони й планшети, 27.09.2026: шапка не переноситься на 320, хрестик у відкритому меню, щільніша спільнота, розгортання ролика, раси на планшеті в один рядок із кадром. */
.pw136-site .menu-lines::before { content: ''; position: absolute; left: 0; right: 0; top: 4px; border-top: 1px solid currentColor; opacity: 0; transition: transform 150ms cubic-bezier(.4,0,.2,1), opacity 150ms cubic-bezier(.4,0,.2,1); }
.pw136-site .menu-lines { transition: border-color 150ms cubic-bezier(.4,0,.2,1); }
.pw136-site .menu-lines::after { transition: transform 150ms cubic-bezier(.4,0,.2,1); }
.pw136-site .menu-toggle[aria-expanded="true"] .menu-lines { border-color: transparent; }
.pw136-site .menu-toggle[aria-expanded="true"] .menu-lines::before { opacity: 1; transform: rotate(45deg); }
.pw136-site .menu-toggle[aria-expanded="true"] .menu-lines::after { transform: rotate(-45deg); }
.pw136-site .telegram-symbol { flex-shrink: 0; width: 20px; height: 20px; fill: currentColor; color: #8eb7ce; }
.pw136-site .community-telegram { gap: 12px; }
.pw136-site .bell-icon { flex-shrink: 0; width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.5; }
.pw136-site .forum-notifications[open] > summary { color: var(--accent); }
.pw136-site .show-expand { display: none; }
.pw136-site .dungeon-card--guimu { min-height: 0; }
.pw136-site .dungeon-copy { container-type: inline-size; }
.pw136-site .level-chips--buttons { grid-template-columns: repeat(5, minmax(0, 1fr)); }
/* 10 рівнів (19-109) одним рядом, коли кожна плашка вміщає «109»; вужче — 2 рівні ряди по 5. */
@container (min-width: 400px) {
  .pw136-site .level-chips--buttons { grid-template-columns: repeat(10, minmax(0, 1fr)); }
}
.pw136-site .mode-steps strong { white-space: nowrap; }
@container (max-width: 379px) {
  .pw136-site .mode-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.pw136-site .mode-steps--two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 601px) and (max-width: 920px) {
  .pw136-site .race-card { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); grid-template-rows: auto auto 1fr; column-gap: 24px; row-gap: 16px; }
  .pw136-site .race-card > .race-photo { grid-row: 1 / -1; width: calc(100% + 24px); height: calc(100% + 48px); margin: -24px 0 -24px -24px; aspect-ratio: auto; border-bottom: 0; border-right: 1px solid rgb(255 122 26 / .2); border-radius: 12px 0 0 12px; }
}
@media (max-width: 760px) {
  .pw136-site .show-media.is-ready .show-expand { position: absolute; top: 8px; right: 8px; z-index: 3; display: grid; place-items: center; width: 36px; height: 36px; padding: 0; border: 0; border-radius: 10px; background: rgb(15 15 15 / .78); cursor: pointer; }
  .pw136-site .show-expand::before { content: ''; width: 16px; height: 16px; background: linear-gradient(#fff, #fff) left top / 6px 2px, linear-gradient(#fff, #fff) left top / 2px 6px, linear-gradient(#fff, #fff) right top / 6px 2px, linear-gradient(#fff, #fff) right top / 2px 6px, linear-gradient(#fff, #fff) left bottom / 6px 2px, linear-gradient(#fff, #fff) left bottom / 2px 6px, linear-gradient(#fff, #fff) right bottom / 6px 2px, linear-gradient(#fff, #fff) right bottom / 2px 6px; background-repeat: no-repeat; }
}
@media (max-width: 600px) {
  .pw136-site .community-intro { padding-block: 24px 20px; }
  .pw136-site .community-telegram { margin-top: 16px; padding: 10px 14px; }
  .pw136-site .community-nav { flex-wrap: nowrap; gap: 8px; padding-bottom: 0; }
  .pw136-site .community-nav > div { width: auto; min-width: 0; gap: 16px; }
  .pw136-site .forum-notifications { margin-left: auto; }
  .pw136-site .forum-notifications > summary { justify-content: center; min-width: 44px; min-height: 44px; }
  .pw136-site .bell-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .pw136-site .article-contents { display: none; }
}
@media (max-width: 480px) {
  .pw136-site .community-sidebar { align-items: stretch; }
  .pw136-site .param-cards { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 400px) {
  body.pw136-site { --gutter: 16px; }
  .pw136-site .brand { gap: 8px; }
  .pw136-site .brand .era-mark { width: 40px; height: 40px; flex-basis: 40px; }
  .pw136-site .brand-name { font-size: 19px; letter-spacing: 1.5px; }
  .pw136-site .brand-name small { font-size: 10px; letter-spacing: .6px; }
  .pw136-site .menu-toggle { gap: 8px; padding-inline: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .pw136-site .menu-lines::before, .pw136-site .menu-lines::after { transition: none; }
}

/* «Доповнення ERA» на «Про сервер», 27.09.2026 (з 13.10.2026 усі записи прямо в розділі). Остання одинока картка в сітці займає весь рядок.
   Зручності клієнта з 13.10.2026 по 2 в ряд і на широких екранах: по 3 дрібний текст і налаштування в записах не читалися (зауваження власника на 2K). */
.pw136-site .show-copy h3 { font-size: 17px; line-height: 1.35; }
.pw136-site .show-copy h3 a:hover, .pw136-site .show-copy h3 a:focus-visible { color: var(--accent); }
.pw136-site a.online-sub { display: inline-flex; align-items: center; gap: 6px; transition: color 150ms cubic-bezier(.4,0,.2,1); }
.pw136-site a.online-sub:hover, .pw136-site a.online-sub:focus-visible { color: var(--accent); }
@media (min-width: 601px) {
  .pw136-site .show-grid:not(.show-grid--teaser) > .show-card:last-child:nth-child(2n+1) { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 16px; }
}
@media (min-width: 1025px) {
  .pw136-site .show-grid { gap: 24px; }
  .pw136-site .show-grid:not(.show-grid--teaser) > .show-card:last-child:nth-child(2n+1) { gap: 24px; }
  .pw136-site .show-copy h3 { font-size: 20px; }
  .pw136-site .show-copy p { font-size: 14px; }
}

/* Стрічка новин із перемикачами рубрик, 27.09.2026. Посібники стоять у спільній стрічці. */
.pw136-site .news-filter { display: flex; flex-wrap: wrap; gap: 8px; }
.pw136-site .news-filter button { min-height: 40px; padding: 8px 16px; border: 1px solid var(--line-strong); border-radius: 8px; background: rgb(0 0 0 / .25); color: var(--muted); font-size: 13px; cursor: pointer; transition: border-color 150ms cubic-bezier(.4,0,.2,1), background 150ms cubic-bezier(.4,0,.2,1), color 150ms cubic-bezier(.4,0,.2,1); }
.pw136-site .news-filter button:hover { border-color: rgb(255 122 26 / .5); color: var(--text); }
.pw136-site .news-filter button[aria-pressed="true"] { border-color: var(--accent-line); background: var(--accent-soft); color: var(--accent); }
.pw136-site .news-filter button:active { transform: scale(.97); }
.pw136-site .news-empty { padding: 24px 0; color: var(--muted); }
.pw136-site .news-archive .lead-story[hidden] + .secondary-stories { padding-top: 0; }
@media (prefers-reduced-motion: reduce) {
  .pw136-site .news-filter button:active { transform: none; }
}

/* Правила сервера та сторінка «не знайдено», 27.09.2026. */
.pw136-site .rules-article .article-heading { padding-top: 32px; }
.pw136-site .rules-article .article-heading h1 { margin-top: 12px; }
.pw136-site .rules-article .article-layout { padding-top: 12px; }
.pw136-site .rules-section-num { margin-right: 12px; color: var(--accent); font-variant-numeric: tabular-nums; }
.pw136-site .rules-list { margin: 20px 0 0; padding: 0; list-style: none; }
.pw136-site .rules-list > li { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 12px; padding: 16px 0; border-top: 1px solid var(--line); scroll-margin-top: 24px; }
.pw136-site .rule-num { color: var(--accent); font: 700 15px/1.7 var(--heading); font-variant-numeric: tabular-nums; }
.pw136-site .rules-list p { color: var(--body); font-size: 15px; line-height: 1.7; }
.pw136-site .rule-penalty { display: inline-block; margin-top: 8px; padding: 4px 10px; border: 1px solid var(--line-strong); border-radius: 6px; background: rgb(0 0 0 / .25); color: var(--muted); font-size: 12px; line-height: 1.5; }
.pw136-site .rules-note { margin-block: 12px 4px; }
.pw136-site .rules-note p { margin-top: 0; }
.pw136-site .related-link { display: flex; align-items: center; min-height: 48px; border-top: 1px solid var(--line); color: var(--muted); font-size: 14px; transition: color 150ms cubic-bezier(.4,0,.2,1); }
.pw136-site .related-link:hover, .pw136-site .related-link:focus-visible { color: var(--accent); }
.pw136-site .not-found { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; padding-block: clamp(48px, 12vh, 140px); }
.pw136-site .not-found-code { color: var(--accent); font: 700 clamp(64px, 10vw, 120px)/1 var(--heading); letter-spacing: -.03em; }
.pw136-site .not-found p:not(.eyebrow):not(.not-found-code) { max-width: 52ch; color: var(--muted); font-size: 16px; }
.pw136-site .not-found-links { display: flex; flex-wrap: wrap; gap: 12px 24px; margin-top: 8px; }
@media (max-width: 600px) {
  .pw136-site .rules-list > li { grid-template-columns: 36px minmax(0, 1fr); gap: 8px; }
  .pw136-site .rules-list p { font-size: 14px; }
}

/* Підземелля в порядку проходження, 27.09.2026: на компьютері 3 однакові картки в ряд, кадр 16:9 зверху. На планшеті картки стоять рядками, кадр ліворуч, як картки рас: у двох колонках короткий опис стояв поруч із високою карткою й лишав порожнє місце. */
@media (min-width: 601px) and (max-width: 1024px) {
  .pw136-site .dungeon-grid { grid-template-columns: minmax(0, 1fr); }
  .pw136-site .dungeon-card { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); }
  .pw136-site .dungeon-card > img { height: 100%; border-bottom: 0; border-right: 1px solid rgb(255 122 26 / .2); }
  .pw136-site .dungeon-copy { justify-content: center; padding: 20px 24px; }
}

/* Документи проєкту в підвалі (tools/wp/build_legal.py): рядок над застереженням, тихіше за навігацію. */
.pw136-site .footer-docs { display: flex; flex-wrap: wrap; gap: 0 20px; margin-bottom: 6px; font-size: 12px; }
.pw136-site .footer-docs a { display: inline-flex; align-items: center; min-height: 32px; color: rgb(216 206 194 / .72); transition: color 150ms cubic-bezier(.4,0,.2,1); }
.pw136-site .footer-docs a:hover { color: var(--accent); }

/* Посібник «Перегони» (guide-perehony.html), 16.10.2026: сторінка сайту з його шапкою й підвалом, на всю ширину.
   Розміри посібника в rem, а корінь цієї сторінки росте з вікном (15 px на телефоні, 24 px на 4K); решта сайту
   задана в px, тож шапка й підвал лишаються такими, як на інших сторінках. Зміст посібника липне під шапкою сайту. */
/* Розмір шрифту посібника рахується від ширини вікна (vw), а Chrome при звичайній прокрутці бере її зі смугою
   прокрутки, а при закритій (вікно здобичі ставить overflow: hidden) — без неї: шапка (карта, фон, кнопки в rem)
   після кліку зменшувалась на око (Храм Сутінків, 20.10.2026: 16,80 -> 16,74 px). Смуга прокрутки є завжди
   (overflow-y: scroll) і місце під неї тримається (scrollbar-gutter) з першого ж розрахунку сторінки — правилом без
   :has(): з :has(.g-page) вона вмикалась пізніше за перший розрахунок шрифту, і той лишався зі смугою */
html.pw136-document { overflow-y: scroll; scrollbar-gutter: stable; }
html.pw136-document:has(.g-page) { font-size: clamp(15px, calc(9.5px + .38vw), 24px); scroll-padding-top: calc(81px + 3.4rem); }
.pw136-site .g-page { color: var(--body); font-size: 1rem; line-height: 1.62; }
/* Скидання слабше за класи посібника (:where), інакше воно перебиває їхні відступи списків. */
.pw136-site :where(.g-page ol, .g-page ul) { margin: 0; }
.pw136-site :where(.g-page img) { height: auto; }
.pw136-site .g-page h1, .pw136-site .g-page h2, .pw136-site .g-page h3 { font-family: var(--heading); font-weight: 600; color: var(--text); text-wrap: balance; }
.pw136-site .g-eyebrow a { transition: color 150ms ease; }
.pw136-site .g-eyebrow a:hover, .pw136-site .g-eyebrow a:focus-visible { color: var(--accent-hover); text-decoration: underline; text-underline-offset: 4px; }
/* Перший екран */
.pw136-site .g-hero { padding: clamp(2.5rem, 5vw, 4.5rem) 0 clamp(2rem, 4vw, 3.5rem); }
.pw136-site .g-hero-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.12fr); gap: clamp(2rem, 4vw, 4.5rem); align-items: center; }
.pw136-site .g-eyebrow { color: var(--accent); font-size: .75rem; letter-spacing: .16em; text-transform: uppercase; }
.pw136-site .g-page h1 { margin-top: .9rem; font-size: clamp(2.6rem, 1.6rem + 2.6vw, 4.6rem); line-height: 1.04; letter-spacing: -.035em; }
.pw136-site .g-lead { margin-top: 1.25rem; max-width: 36rem; font-size: clamp(1.05rem, .98rem + .25vw, 1.2rem); line-height: 1.6; }
.pw136-site .g-facts { list-style: none; padding: 0; margin-top: 2rem; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--line); }
.pw136-site .g-facts li { padding: 1rem 1rem 0 0; }
.pw136-site .g-facts li + li { padding-left: 1rem; border-left: 1px solid var(--line); }
.pw136-site .g-facts strong { display: block; font: 600 1.05rem/1.3 var(--heading); color: var(--text); }
.pw136-site .g-facts span { display: block; margin-top: .25rem; color: var(--soft); font-size: .84rem; line-height: 1.4; }
/* Кадри гри */
.pw136-site .g-shot figcaption { margin-top: .6rem; color: var(--soft); font-size: .86rem; }
/* Усі кадри одного формату 16:10, щоб пари стояли врівень; кадрування задає object-position. */
.pw136-site .g-shot-img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; border: 1px solid var(--line-strong); border-radius: 12px; background: var(--surface); }
.pw136-site .g-shot-img--top { object-position: 50% 30%; }
.pw136-site .g-shot-img--mid { object-position: 50% 45%; }
/* Опис предмета з гри в натуральну величину поверх розмитого кадру тієї ж події: текст не мутніє, рамка не порожня */
.pw136-site .g-shot-img--ui { object-fit: scale-down; background: var(--surface) center / cover no-repeat; }
.pw136-site .g-shot-img--griva { background-image: url('assets/guides/perehony/shots/griva-backdrop.webp'); }
.pw136-site .g-shot-img--wings { background-image: url('assets/guides/perehony/shots/wings-backdrop.webp'); }
/* Драбина з трьох перегонів */
.pw136-site .g-ladder { padding-bottom: clamp(2.5rem, 5vw, 4rem); }
.pw136-site .g-ladder-title { margin-bottom: 1rem; color: var(--soft); font-size: .8rem; letter-spacing: .14em; text-transform: uppercase; }
.pw136-site .g-ladder-list { list-style: none; padding: 0; display: grid; grid-template-columns: minmax(0, 1fr) 11.5rem minmax(0, 1fr) 11.5rem minmax(0, 1fr); align-items: stretch; }
.pw136-site .g-rung a { display: flex; flex-direction: column; height: 100%; padding: 1.3rem 1.4rem 1.4rem; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); transition: border-color 150ms ease, background-color 150ms ease, transform 150ms ease; }
.pw136-site .g-rung a:hover { border-color: var(--accent-line); background: var(--raised); }
.pw136-site .g-rung a:active { transform: scale(.99); }
.pw136-site .g-rung--main a { border-color: var(--accent-line); background: linear-gradient(180deg, rgb(255 122 26 / .1), transparent 72%), var(--surface); }
.pw136-site .g-rung-num { color: var(--accent); font: 600 .78rem/1 var(--heading); letter-spacing: .14em; }
.pw136-site .g-rung-name { margin-top: .55rem; font: 600 1.55rem/1.15 var(--heading); color: var(--text); letter-spacing: -.02em; }
.pw136-site .g-rung-when { margin-top: .5rem; color: var(--text); font-size: 1.02rem; }
.pw136-site .g-rung-where { margin-top: .2rem; color: var(--soft); font-size: .88rem; line-height: 1.45; }
.pw136-site .g-rung-more { display: inline-flex; gap: .45rem; margin-top: auto; padding-top: 1rem; color: var(--muted); font-size: .86rem; }
.pw136-site .g-rung-more::after { content: '↓'; color: var(--accent); transition: transform 150ms ease; }
.pw136-site .g-rung a:hover .g-rung-more::after { transform: translateY(2px); }
.pw136-site .g-pass { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .55rem; padding: 0 .9rem; text-align: center; color: var(--muted); font-size: .84rem; line-height: 1.4; }
.pw136-site .g-pass::before { content: ''; position: absolute; left: 0; right: 0; top: calc(50% - 1.6rem); border-top: 1px dashed var(--line-strong); }
.pw136-site .g-pass img { position: relative; width: 2.6rem; height: 2.6rem; border-radius: 8px; box-shadow: 0 0 0 .4rem var(--bg); }
.pw136-site .g-pass b { color: var(--text); font-weight: 400; }
/* Зміст */
.pw136-site .g-toc { position: sticky; top: 81px; z-index: 10; background: rgb(11 10 9 / .94); backdrop-filter: blur(10px); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.pw136-site .g-toc-in { display: flex; gap: 1.75rem; overflow-x: auto; scrollbar-width: none; }
.pw136-site .g-toc-in::-webkit-scrollbar { display: none; }
/* Посилання не стискаються: на телефоні довгий зміст прокручується вбік, а не налазить сам на себе */
.pw136-site .g-toc a { flex: none; padding: .85rem 0 .75rem; border-bottom: 2px solid transparent; color: var(--muted); font-size: .95rem; white-space: nowrap; transition: color 150ms ease, border-color 150ms ease; }
.pw136-site .g-toc a:hover { color: var(--text); border-bottom-color: var(--accent); }
.pw136-site .g-toc a span { margin-right: .4rem; color: var(--soft); font-size: .8rem; }
/* Розділи */
.pw136-site .g-sec { padding: clamp(3rem, 6vw, 5.5rem) 0; border-bottom: 1px solid var(--line); }
.pw136-site .g-sec-head { max-width: 50rem; }
.pw136-site .g-page h2 { display: flex; align-items: center; gap: .8rem; margin-top: .75rem; font-size: clamp(1.8rem, 1.4rem + 1.1vw, 2.5rem); line-height: 1.15; letter-spacing: -.025em; }
.pw136-site .g-page h2::before { content: ''; flex: 0 0 4px; height: .9em; border-radius: 2px; background: var(--accent); }
.pw136-site .g-intro { margin-top: 1rem; color: var(--muted); font-size: 1.06rem; }
.pw136-site .g-chips { list-style: none; padding: 0; margin-top: 1.4rem; display: flex; flex-wrap: wrap; gap: .5rem; }
.pw136-site .g-chips li { padding: .3rem .8rem; border: 1px solid var(--line-strong); border-radius: 999px; color: var(--body); font-size: .88rem; }
.pw136-site .g-chips li:first-child { border-color: var(--accent-line); background: var(--accent-soft); color: var(--text); }
.pw136-site .g-gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.6rem; margin-top: clamp(2rem, 4vw, 3rem); }
/* Кроки сіткою на всю ширину: без бічної колонки кадрів, яка лишала порожнечу поруч */
.pw136-site .g-steps { list-style: none; padding: 0; margin-top: clamp(2rem, 4vw, 3rem); counter-reset: step; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2rem clamp(1.75rem, 3vw, 3.25rem); }
.pw136-site .g-steps > li { position: relative; padding-left: 3.5rem; counter-increment: step; }
.pw136-site .g-steps > li::before { content: counter(step); position: absolute; left: 0; top: -.1rem; display: grid; place-items: center; width: 2.25rem; height: 2.25rem; border: 1px solid var(--accent-line); border-radius: 50%; background: var(--accent-soft); color: var(--accent); font: 600 .95rem/1 var(--heading); }
.pw136-site .g-steps h3 { font-size: 1.12rem; line-height: 1.35; letter-spacing: -.01em; }
.pw136-site .g-steps p { margin-top: .35rem; color: var(--muted); }
.pw136-site .g-steps b, .pw136-site .g-intro b { color: var(--text); font-weight: 400; }
.pw136-site .g-note { max-width: 56rem; margin-top: 2.25rem; padding: 1rem 1.2rem 1rem 1.35rem; border-left: 3px solid var(--accent); border-radius: 0 10px 10px 0; background: var(--accent-soft); }
.pw136-site .g-note strong { color: var(--text); font-family: var(--heading); font-weight: 600; }
/* Нагороди */
.pw136-site .g-rewards { margin-top: 2.5rem; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); overflow: hidden; }
.pw136-site .g-rewards-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .4rem 1.5rem; padding: 1.1rem 1.4rem; }
.pw136-site .g-rewards-head h3 { font-size: 1.15rem; }
.pw136-site .g-rewards-head p { color: var(--soft); font-size: .88rem; }
.pw136-site .g-rw { display: grid; grid-template-columns: 3.1rem minmax(11rem, 17rem) minmax(0, 1fr); gap: .9rem 1.4rem; align-items: center; padding: 1rem 1.4rem; border-top: 1px solid var(--line); }
.pw136-site .g-place { display: grid; place-items: center; width: 2.6rem; height: 2.6rem; border: 1px solid var(--line-strong); border-radius: 50%; color: var(--text); font: 600 .95rem/1 var(--heading); letter-spacing: -.02em; white-space: nowrap; }
.pw136-site .g-place--top { border-color: var(--accent); background: var(--accent-soft); color: var(--accent); }
.pw136-site .g-place--all { color: var(--muted); font-size: .7rem; letter-spacing: .02em; }
.pw136-site .g-place--wide { font-size: .75rem; }
.pw136-site .g-rw-name strong { display: block; color: var(--text); font: 600 1rem/1.35 var(--heading); }
.pw136-site .g-rw-name span { display: block; margin-top: .15rem; color: var(--soft); font-size: .86rem; line-height: 1.4; }
.pw136-site .g-loot { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem; }
.pw136-site .g-loot li { display: inline-flex; align-items: center; gap: .4rem; min-height: 2.6rem; padding: .3rem .85rem .3rem .3rem; border: 1px solid var(--line); border-radius: 10px; background: var(--raised); font-size: .92rem; line-height: 1.3; }
.pw136-site .g-loot li.g-val { padding-left: .85rem; }
.pw136-site .g-loot img { flex: 0 0 auto; width: 2rem; height: 2rem; margin-right: .15rem; border-radius: 6px; }
.pw136-site .g-loot b { color: var(--text); font: 600 1em/1 var(--heading); }
.pw136-site .g-rewards-foot { padding: .9rem 1.4rem; border-top: 1px solid var(--line); color: var(--soft); font-size: .88rem; }
/* Траси міст */
.pw136-site .g-routes { list-style: none; padding: 0; margin-top: clamp(2rem, 4vw, 3rem); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 2.8rem; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.pw136-site .g-routes li { position: relative; padding: 1.2rem 0 1.3rem; }
.pw136-site .g-routes li + li::before { content: ''; position: absolute; top: 0; bottom: 0; left: -1.4rem; border-left: 1px solid var(--line); }
.pw136-site .g-routes .g-shot-img { margin-bottom: 1.2rem; }
.pw136-site .g-routes b { display: block; color: var(--text); font: 600 2.6rem/1 var(--heading); letter-spacing: -.04em; }
.pw136-site .g-routes b small { margin-left: .4rem; color: var(--soft); font: 400 .9rem/1 var(--font); letter-spacing: 0; }
.pw136-site .g-routes strong { display: block; margin-top: .7rem; color: var(--text); font: 600 1.05rem/1.3 var(--heading); }
.pw136-site .g-routes span { display: block; margin-top: .2rem; color: var(--soft); font-size: .86rem; }
/* Вечір Великих перегонів */
.pw136-site .g-timeline { list-style: none; padding: 0; margin-top: clamp(2rem, 4vw, 3rem); display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); border-top: 1px solid var(--line-strong); }
.pw136-site .g-timeline li { position: relative; padding: 1.1rem 1.2rem 0 0; }
.pw136-site .g-timeline li::before { content: ''; position: absolute; top: -6px; left: 0; width: 11px; height: 11px; border: 2px solid var(--line-strong); border-radius: 50%; background: var(--bg); }
.pw136-site .g-timeline li.g-is-key::before { border-color: var(--accent); background: var(--accent); }
.pw136-site .g-timeline time { display: block; color: var(--text); font: 600 1.35rem/1 var(--heading); letter-spacing: -.02em; }
.pw136-site .g-timeline span { display: block; margin-top: .45rem; color: var(--muted); font-size: .9rem; line-height: 1.45; }
/* Що робити з нагородами */
.pw136-site .g-items { list-style: none; padding: 0; margin-top: clamp(2rem, 4vw, 3rem); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2.2rem clamp(2rem, 3.5vw, 3.5rem); }
.pw136-site .g-items li { display: grid; grid-template-columns: 3.25rem minmax(0, 1fr); grid-template-rows: auto 1fr; gap: 0 1rem; align-items: start; }
.pw136-site .g-items img { grid-row: span 2; width: 3.25rem; height: 3.25rem; border-radius: 8px; }
.pw136-site .g-items strong { color: var(--text); font: 600 1.05rem/1.35 var(--heading); }
.pw136-site .g-items p { margin-top: .3rem; color: var(--muted); font-size: .94rem; }
/* Питання */
.pw136-site .g-faq { max-width: 56rem; margin-top: clamp(1.5rem, 3vw, 2.5rem); border-top: 1px solid var(--line); }
.pw136-site .g-faq details { border-bottom: 1px solid var(--line); }
.pw136-site .g-faq summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.1rem 0; color: var(--text); font: 600 1.06rem/1.4 var(--heading); cursor: pointer; list-style: none; transition: color 150ms ease; }
.pw136-site .g-faq summary::-webkit-details-marker { display: none; }
/* Плюс малюнком на всю площу кола: дробові пікселі градієнтів зсували вертикальну риску вліво */
.pw136-site .g-faq summary::after { content: ''; flex: 0 0 auto; width: 1.8rem; height: 1.8rem; border: 1px solid var(--line-strong); border-radius: 50%; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath d='M15 9.5v11M9.5 15h11' fill='none' stroke='%23ff7a1a' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E") center / 100% 100% no-repeat; transition: transform 150ms ease, border-color 150ms ease; }
.pw136-site .g-faq summary:hover { color: var(--accent-hover); }
.pw136-site .g-faq summary:hover::after { border-color: var(--accent-line); }
.pw136-site .g-faq details[open] summary::after { transform: rotate(45deg); }
.pw136-site .g-faq details p { padding: 0 3rem 1.2rem 0; color: var(--muted); }
.pw136-site .g-more { margin-top: 1.5rem; color: var(--muted); }
.pw136-site .g-more a { color: var(--accent); text-decoration: underline; text-underline-offset: 4px; transition: color 150ms ease; }
.pw136-site .g-more a:hover, .pw136-site .g-more a:focus-visible { color: var(--accent-hover); }
@media (max-width: 1100px) {
  .pw136-site .g-hero-grid, .pw136-site .g-ladder-list { grid-template-columns: minmax(0, 1fr); }
  .pw136-site .g-pass { flex-direction: row; justify-content: flex-start; padding: 1rem 0 1rem 1.4rem; text-align: left; }
  .pw136-site .g-pass::before { top: 0; bottom: 0; left: 2.7rem; right: auto; border-top: 0; border-left: 1px dashed var(--line-strong); }
  .pw136-site .g-steps, .pw136-site .g-items { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 920px) {
  html.pw136-document:has(.g-page) { scroll-padding-top: calc(73px + 3.4rem); }
  .pw136-site .g-toc { top: 73px; }
}
@media (max-width: 760px) {
  .pw136-site .g-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pw136-site .g-facts li:nth-child(3) { padding-left: 0; border-left: 0; }
  .pw136-site .g-steps, .pw136-site .g-gallery, .pw136-site .g-routes, .pw136-site .g-timeline, .pw136-site .g-items { grid-template-columns: minmax(0, 1fr); }
  .pw136-site .g-steps { gap: 1.5rem; }
  .pw136-site .g-rw { grid-template-columns: 2.6rem minmax(0, 1fr); padding: 1rem; }
  .pw136-site .g-rw .g-loot { grid-column: 1 / -1; }
  .pw136-site .g-rewards-head, .pw136-site .g-rewards-foot { padding-inline: 1rem; }
  .pw136-site .g-routes li + li { border-top: 1px solid var(--line); }
  .pw136-site .g-routes li + li::before { display: none; }
  .pw136-site .g-timeline { border-top: 0; border-left: 1px solid var(--line-strong); }
  .pw136-site .g-timeline li { padding: 0 0 1.3rem 1.3rem; }
  .pw136-site .g-timeline li::before { top: .15rem; left: -6px; }
  .pw136-site .g-faq details p { padding-right: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .pw136-site .g-page *, .pw136-site .g-page *::before, .pw136-site .g-page *::after { transition: none !important; }
}

/* Посібник «Куб долі», 16.10.2026. Перший екран показує карту Куба: 50 кімнат маршруту й 10 лотерейних
   клітинками, особливі кімнати позначені рамкою; сітка в rem, тож на 4K вона росте разом зі сторінкою. */
.pw136-site .g-cube { margin: 0; padding: clamp(1.1rem, 2vw, 1.6rem); border: 1px solid var(--line); border-radius: 14px; background: radial-gradient(120% 90% at 100% 0%, rgb(255 120 40 / .08), transparent 60%), var(--surface); }
.pw136-site .g-cube-grid { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(10, minmax(0, 1fr)); gap: clamp(.25rem, .5vw, .45rem); }
.pw136-site .g-cube-grid li { display: grid; place-items: center; aspect-ratio: 1; border: 1px solid var(--line-strong); border-radius: 7px; background: var(--raised); color: var(--muted); font: 600 clamp(.7rem, .5rem + .45vw, 1.2rem)/1 var(--heading); font-variant-numeric: tabular-nums; }
.pw136-site .g-cube-grid li.g-c--pay { border-color: rgb(255 122 26 / .72); color: var(--text); }
.pw136-site .g-cube-grid li.g-c--luck { border-style: dashed; border-color: var(--soft); color: var(--text); }
.pw136-site .g-cube-grid li.g-c--hunt { position: relative; color: var(--text); }
.pw136-site .g-cube-grid li.g-c--hunt::after { content: ''; position: absolute; right: 14%; bottom: 14%; width: 16%; aspect-ratio: 1; border-radius: 50%; background: var(--accent); }
.pw136-site .g-cube-grid li.g-c--key { border-color: var(--accent); background: var(--accent); color: var(--accent-ink); }
.pw136-site .g-cube-grid--lot li { background: var(--surface); border-color: var(--accent-line); color: var(--body); }
/* Клітинка карти веде до опису своєї кімнати: посилання займає всю клітинку */
.pw136-site .g-cube-grid li > a { align-self: stretch; justify-self: stretch; display: grid; place-items: center; border-radius: 6px; color: inherit; text-decoration: none; transition: background-color 150ms ease, color 150ms ease; }
.pw136-site .g-cube-grid li > a:hover { background: rgb(255 122 26 / .16); color: var(--text); }
.pw136-site .g-cube-grid li.g-c--key > a:hover { background: rgb(255 255 255 / .16); color: var(--accent-ink); }
.pw136-site .g-cube-grid li > a:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.pw136-site .g-cube-grid li.g-c--hunt::after { pointer-events: none; }
.pw136-site .g-cube-sep { display: flex; align-items: center; gap: .8rem; margin: clamp(.8rem, 1.4vw, 1.1rem) 0 clamp(.6rem, 1vw, .8rem); color: var(--soft); font-size: .76rem; letter-spacing: .14em; text-transform: uppercase; }
.pw136-site .g-cube-sep::after { content: ''; flex: 1; border-top: 1px dashed var(--line-strong); }
.pw136-site .g-cube-legend { list-style: none; padding: 0; margin-top: 1rem; display: flex; flex-wrap: wrap; gap: .5rem 1.4rem; color: var(--soft); font-size: .84rem; }
.pw136-site .g-cube-legend li { display: inline-flex; align-items: center; gap: .5rem; }
.pw136-site .g-cube-legend i { position: relative; width: .95rem; height: .95rem; border: 1px solid var(--line-strong); border-radius: 4px; background: var(--raised); }
.pw136-site .g-cube-legend i.g-c--key { border-color: var(--accent); background: var(--accent); }
.pw136-site .g-cube-legend i.g-c--pay { border-color: rgb(255 122 26 / .72); }
.pw136-site .g-cube-legend i.g-c--luck { border-style: dashed; border-color: var(--soft); }
.pw136-site .g-cube-legend i.g-c--hunt::after { content: ''; position: absolute; right: 2px; bottom: 2px; width: 4px; height: 4px; border-radius: 50%; background: var(--accent); }
/* Правила руху: чотири короткі тези в ряд, без рамок навколо кожної */
.pw136-site .g-rules { list-style: none; padding: 0; margin-top: clamp(2.2rem, 4vw, 3.2rem); display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); column-gap: 2.4rem; border-top: 1px solid var(--line); }
.pw136-site .g-rules li { position: relative; padding-top: 1.2rem; }
.pw136-site .g-rules li + li::before { content: ''; position: absolute; top: 1.2rem; bottom: 0; left: -1.2rem; border-left: 1px solid var(--line); }
.pw136-site .g-rules strong { display: block; color: var(--text); font: 600 1.02rem/1.35 var(--heading); }
.pw136-site .g-rules p { margin-top: .35rem; color: var(--muted); font-size: .94rem; }
/* Таблиці кімнат */
.pw136-site .g-table { margin-top: clamp(2rem, 4vw, 3rem); border: 1px solid var(--line); border-radius: 12px; background: var(--surface); overflow: hidden; }
.pw136-site .g-rooms { width: 100%; border-collapse: collapse; font-size: .95rem; }
.pw136-site .g-rooms th, .pw136-site .g-rooms td { padding: .8rem 1.1rem; text-align: left; vertical-align: top; border-top: 1px solid var(--line); }
.pw136-site .g-rooms thead th { border-top: 0; padding-block: .9rem; color: var(--soft); font-size: .76rem; font-weight: 400; letter-spacing: .12em; text-transform: uppercase; }
.pw136-site .g-rooms td { color: var(--muted); }
.pw136-site .g-rooms .g-t-group th { padding-block: .7rem; background: var(--raised); color: var(--text); font: 600 .95rem/1.3 var(--heading); }
.pw136-site .g-rooms .g-t-num { width: 3.6rem; color: var(--accent); font: 600 1.05rem/1.4 var(--heading); font-variant-numeric: tabular-nums; }
.pw136-site .g-rooms .g-t-name { width: 15rem; color: var(--text); }
.pw136-site .g-rooms .g-t-cost { width: 15rem; color: var(--body); }
.pw136-site .g-rooms tr.is-pay .g-t-cost { color: var(--accent-hover); }
.pw136-site .g-rooms tr.is-key td { background: var(--accent-soft); }
.pw136-site .g-rooms tr.is-key .g-t-cost { color: var(--text); }
.pw136-site .g-rooms--lot .g-t-cost { width: 13rem; }
.pw136-site .g-rooms--lot td:nth-child(4), .pw136-site .g-rooms--lot td:nth-child(5) { color: var(--body); }
/* Розбір кімнат лотереї */
.pw136-site .g-sub { margin-top: clamp(3rem, 5vw, 4.2rem); font-size: clamp(1.35rem, 1.15rem + .5vw, 1.7rem); line-height: 1.25; letter-spacing: -.015em; }
.pw136-site .g-walk { margin-top: 1.4rem; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.4rem; }
.pw136-site .g-walk-room { min-width: 0; padding: clamp(1.1rem, 2vw, 1.5rem); border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.pw136-site .g-walk-room--wide { grid-column: 1 / -1; }
.pw136-site .g-walk-head { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .6rem; }
.pw136-site .g-walk-head h4 { margin-right: .4rem; color: var(--text); font: 600 1.15rem/1.3 var(--heading); letter-spacing: -.01em; }
.pw136-site .g-tag { padding: .15rem .65rem; border: 1px solid var(--line-strong); border-radius: 999px; color: var(--body); font-size: .8rem; white-space: nowrap; }
.pw136-site .g-walk-room ol { margin-top: 1rem; padding-left: 1.3rem; color: var(--muted); }
.pw136-site .g-walk-room ol li + li { margin-top: .45rem; }
.pw136-site .g-walk-room ol li::marker { color: var(--accent); font-weight: 600; }
.pw136-site .g-walk-note { margin-top: 1rem; padding-left: .9rem; border-left: 2px solid var(--accent-line); color: var(--soft); font-size: .92rem; }
/* Текст поруч зі схемою стоїть по її середині: схема вища за список, і порожнеча під текстом читалася б дірою */
.pw136-site .g-walk-body--scheme { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: clamp(1.4rem, 3vw, 2.6rem); align-items: center; }
.pw136-site .g-walk-text { max-width: 62rem; }
.pw136-site .g-scheme { margin: 1rem 0 0; }
.pw136-site .g-scheme svg { display: block; width: 100%; height: auto; border: 1px solid var(--line); border-radius: 10px; background: #0d0b09; }
/* Поле кімнати 51: на широкому екрані 4 варіанти в ряд під текстом, на телефоні 2 на 2 */
.pw136-site .g-scheme--board { margin-top: 1.4rem; }
.pw136-site .g-scheme--board .g-scheme-narrow { display: none; }
.pw136-site .g-scheme figcaption { margin-top: .6rem; color: var(--soft); font-size: .84rem; line-height: 1.5; }
/* Рядок нагороди з картинкою скриньки замість кола місця */
.pw136-site .g-rw-icon { width: 2.6rem; height: 2.6rem; border-radius: 8px; }
/* Перехід із карти: кімната, до якої прийшли, обведена */
.pw136-site .g-rm:target, .pw136-site .g-walk-room:target, .pw136-site .g-lane:target svg { border-color: var(--accent); }
.pw136-site .g-orb { display: inline-block; width: .8rem; height: .8rem; margin-right: .35rem; border-radius: 50%; vertical-align: -.06em; box-shadow: inset 0 0 0 1px rgb(0 0 0 / .45); }
.pw136-site .g-orb--red { background: #e5654f; }
.pw136-site .g-orb--white { background: #ece5dc; }
.pw136-site .g-orb--blue { background: #5b83dc; }
/* Кадр першої кімнати стоїть праворуч від тексту розділу: широкий кадр не з'їдає пів екрана */
.pw136-site .g-head-media { display: grid; grid-template-columns: minmax(0, 50rem) minmax(0, 1fr); gap: clamp(2rem, 4vw, 4rem); align-items: center; }
.pw136-site .g-head-media .g-shot { margin: 0; }
.pw136-site .g-shot-img--wide { aspect-ratio: 1588 / 764; }
.pw136-site .g-walk-body .g-shot { margin: 0; }
.pw136-site .g-walk-body > div > .g-shot { margin-top: 1.2rem; }
/* Кімнати 1–60 картками (17.10.2026): кожна картка самодостатня. Кадр стоїть поруч із текстом і займає ліву
   частину ширини, а не прижатий до краю; схеми й кадри кількох штук ідуть одним рядом на всю ширину картки. */
.pw136-site .g-rmlist { margin-top: clamp(2rem, 4vw, 3rem); display: grid; gap: .8rem; }
.pw136-site .g-rm-group { margin-top: 1.8rem; padding-bottom: .5rem; border-bottom: 1px solid var(--line); color: var(--text); font: 600 1.1rem/1.3 var(--heading); }
.pw136-site .g-rm-group:first-child { margin-top: 0; }
.pw136-site .g-rm { display: grid; grid-template-columns: 3rem minmax(0, 1fr); column-gap: 1.2rem; min-width: 0; padding: 1.1rem 1.3rem; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.pw136-site .g-rm.is-key { border-color: var(--accent-line); background: linear-gradient(90deg, var(--accent-soft), transparent 70%), var(--surface); }
.pw136-site .g-rm-num { color: var(--accent); font: 600 1.55rem/1.1 var(--heading); font-variant-numeric: tabular-nums; }
.pw136-site .g-rm-body { min-width: 0; }
.pw136-site .g-rm-head { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem .9rem; }
.pw136-site .g-rm-head h4 { color: var(--text); font: 600 1.12rem/1.3 var(--heading); letter-spacing: -.01em; }
.pw136-site .g-rm-cost { padding: .12rem .65rem; border: 1px solid var(--line-strong); border-radius: 999px; color: var(--body); font-size: .8rem; }
.pw136-site .g-rm-cost.is-pay { border-color: var(--accent-line); color: var(--accent-hover); }
.pw136-site .g-rm-text { min-width: 0; }
.pw136-site .g-rm-text > p { margin-top: .5rem; color: var(--muted); }
.pw136-site .g-rm-text > p + p { margin-top: .4rem; }
.pw136-site .g-rm-steps { margin-top: .7rem; padding-left: 1.3rem; color: var(--muted); }
.pw136-site .g-rm-steps li + li { margin-top: .4rem; }
.pw136-site .g-rm-steps li::marker { color: var(--accent); font-weight: 600; }
.pw136-site .g-rm-text .g-walk-note { margin-top: .8rem; }
.pw136-site .g-rm a { color: var(--accent); text-decoration: underline; text-decoration-color: var(--accent-line); text-underline-offset: 3px; transition: color 150ms ease; }
.pw136-site .g-rm a:hover, .pw136-site .g-rm a:focus-visible { color: var(--accent-hover); }
/* Текст і кадр поруч: кадр займає майже половину картки, а не вузьку смугу біля краю */
.pw136-site .g-rm-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 30rem); gap: clamp(1.2rem, 2.4vw, 2rem); align-items: start; }
.pw136-site .g-rm-side { min-width: 0; margin-top: .55rem; }
.pw136-site .g-rm-side .g-shot, .pw136-site .g-rm-side .g-scheme { margin: 0; }
/* Ряд кадрів і схем на всю ширину: стовпці ділять ширину порівну, схема не росте вище кадру */
.pw136-site .g-rm-strip { margin-top: 1.1rem; display: grid; grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); gap: 1rem; align-items: start; }
.pw136-site .g-rm-strip > * { margin: 0; min-width: 0; }
.pw136-site .g-rm-strip .g-lane svg { max-height: 24rem; width: auto; max-width: 100%; margin-inline: auto; }
.pw136-site .g-rm-strip .g-lane figcaption { text-align: center; }
.pw136-site .g-rm--board .g-rm-strip { grid-template-columns: minmax(0, 1fr); }
.pw136-site .g-rm--pair .g-rm-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
/* Ряд однієї висоти: ширина кожної картинки пропорційна її сторонам (--ar), тож між ними немає дір */
.pw136-site .g-rm-strip.g-rm-strip--fit { display: flex; align-items: flex-start; gap: 1rem; }
.pw136-site .g-rm-strip--fit > * { flex: var(--ar, 1) 1 0; }
.pw136-site .g-rm-strip--fit .g-lane svg { max-height: none; width: 100%; }
/* У ряду однієї висоти кадр зберігає свої сторони: --ar рахується саме від них */
.pw136-site .g-rm-strip--fit .g-shot-img { aspect-ratio: auto; height: auto; }
/* Значки вартових 27-ї колонкою поруч із текстом */
.pw136-site .g-rm-split--plates { grid-template-columns: minmax(0, 1fr) minmax(0, 20rem); }
/* Картка зі знімком: знімок на всю висоту правої частини, номер і текст по центру лівої. Знімок обрізано
   під висоту картки, повний кадр відкривається натисканням. */
.pw136-site .g-rm.g-rm--media { grid-template-columns: minmax(0, 1fr) minmax(0, clamp(20rem, 38%, 36rem)); column-gap: 0; padding: 0; overflow: hidden; }
.pw136-site .g-rm-main { display: grid; grid-template-columns: 3rem minmax(0, 1fr); column-gap: 1.2rem; align-self: center; min-width: 0; padding: 1.1rem 1.3rem; }
.pw136-site .g-rm-media { position: relative; margin: 0; background: #0d0b09; }
/* Висота рамки не менша за кадр у його сторонах (--ar), тож верх кадру з назвою зали не обрізається;
   довший текст лише розтягує рамку, і тоді кадр підрізається з боків */
.pw136-site .g-rm-media::before { content: ''; display: block; padding-top: calc(100% / var(--ar, 1.6)); }
.pw136-site .g-rm-media a, .pw136-site .g-rm-media img { position: absolute; inset: 0; width: 100%; height: 100%; }
.pw136-site .g-rm-media img { object-fit: cover; transition: transform 400ms cubic-bezier(.16, 1, .3, 1), filter 200ms ease; }
/* Кадр відкривається повністю — стандарт клікабельної картки сайту (див. a.dungeon-card); наближення — в межах кадру */
.pw136-site .g-rm-media:has(> a) { overflow: hidden; }
.pw136-site .g-rm-media a:hover img, .pw136-site .g-rm-media a:focus-visible img { transform: scale(1.03); filter: brightness(1.08); }
@media (prefers-reduced-motion: reduce) {
  .pw136-site .g-rm-media a:hover img, .pw136-site .g-rm-media a:focus-visible img { transform: none; }
}
.pw136-site .g-rm-media a:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.pw136-site .g-rm-media figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 2.2rem 1rem .7rem; background: linear-gradient(transparent, rgb(8 7 6 / .88)); color: var(--body); font-size: .82rem; line-height: 1.4; pointer-events: none; }
/* Схема замість знімка: не обрізається, підпис під нею */
.pw136-site .g-rm-media.g-rm-media--scheme { display: flex; flex-direction: column; justify-content: center; gap: .6rem; min-height: 0; padding: 1.1rem 1.3rem 1.1rem 0; background: none; }
.pw136-site .g-rm-media--scheme svg { display: block; width: 100%; height: auto; border: 1px solid var(--line); border-radius: 10px; background: #0d0b09; }
.pw136-site .g-rm-media--scheme figcaption { position: static; padding: 0; background: none; color: var(--soft); font-size: .84rem; line-height: 1.5; }
.pw136-site .g-rm-facts { list-style: none; padding: 0; margin-top: .7rem; display: flex; flex-wrap: wrap; gap: .4rem; }
.pw136-site .g-rm-facts li { padding: .15rem .65rem; border: 1px solid var(--line); border-radius: 999px; background: rgb(0 0 0 / .22); color: var(--body); font-size: .82rem; }
/* Предмети кімнати: значок гри, число в куті, назва під ним */
.pw136-site .g-rm-items { list-style: none; padding: 0; margin-top: .9rem; display: flex; flex-wrap: wrap; align-items: flex-start; gap: .9rem; }
.pw136-site .g-rm-items li { position: relative; display: grid; justify-items: center; gap: .35rem; width: 7.5rem; color: var(--soft); font-size: .8rem; line-height: 1.3; text-align: center; }
.pw136-site .g-rm-items img { width: 3.4rem; height: 3.4rem; border: 1px solid var(--line-strong); border-radius: 8px; background: #0d0b09; }
.pw136-site .g-rm-items b { position: absolute; top: 2.35rem; left: calc(50% + .9rem); padding: 0 .3rem; border-radius: 5px; background: #0d0b09; color: var(--text); font: 600 .85rem/1.35 var(--heading); white-space: nowrap; }
.pw136-site .g-rm-items .g-rm-arrow { width: auto; align-self: center; margin-top: -1.6rem; color: var(--accent); font-size: 1.3rem; }
/* Два можливі виходи коробочки: «або» між ними, ціна в торговця під назвою */
.pw136-site .g-rm-items .g-rm-or { width: auto; align-self: center; margin-top: -1.6rem; color: var(--soft); font-size: .8rem; }
.pw136-site .g-rm-items small { display: block; margin-top: .15rem; color: var(--body); font-size: .74rem; }
/* У рядку нагороди стрілка веде від скриньки до її вмісту */
.pw136-site .g-loot li.g-loot-arrow { min-height: 0; padding: 0 .1rem; border: 0; background: none; color: var(--accent); font-size: 1.2rem; }
/* Сила монстрів і нагорода за рівнем гравця */
.pw136-site .g-rm-tiers { margin-top: .8rem; }
.pw136-site .g-rm-tiers p { color: var(--soft); font-size: .8rem; }
.pw136-site .g-rm-tiers ul { list-style: none; padding: 0; margin-top: .35rem; display: grid; grid-template-columns: repeat(6, minmax(0, 8rem)); gap: .4rem; }
.pw136-site .g-rm-tiers li { display: grid; gap: .1rem; padding: .4rem .6rem; border: 1px solid var(--line); border-radius: 8px; background: rgb(0 0 0 / .22); }
.pw136-site .g-rm-tiers span { color: var(--soft); font-size: .76rem; }
.pw136-site .g-rm-tiers b { color: var(--text); font: 600 .98rem/1.2 var(--heading); font-variant-numeric: tabular-nums; }
.pw136-site .g-rm-tiers em { color: var(--body); font-size: .8rem; font-style: normal; }
/* Кімнати 5 і 28: правильна відповідь крупно, запасні розстановки дрібніше */
.pw136-site .g-ans-main { margin-top: .9rem; padding: .9rem 1.1rem; border: 1px solid var(--accent-line); border-radius: 10px; background: var(--accent-soft); }
.pw136-site .g-ans-cap { color: var(--accent); font-size: .76rem; letter-spacing: .14em; text-transform: uppercase; }
.pw136-site .g-ans-big { list-style: none; padding: 0; margin-top: .45rem; display: flex; flex-wrap: wrap; gap: .4rem 1.8rem; }
.pw136-site .g-ans-big li { display: inline-flex; align-items: baseline; gap: .5rem; color: var(--body); }
.pw136-site .g-ans-big b { color: var(--text); font: 700 2rem/1 var(--heading); font-variant-numeric: tabular-nums; }
.pw136-site .g-ans-sub { margin-top: .65rem; color: var(--soft); font-size: .86rem; }
.pw136-site .g-ans-sub b { color: var(--body); font-weight: 600; }
/* Значки вартових: у тексті 27-ї парою в ряд, у ряду 7-ї стовпчиком */
.pw136-site .g-plates { display: grid; gap: .8rem; }
.pw136-site .g-rm-text > .g-plates { margin-top: .9rem; grid-template-columns: repeat(2, minmax(0, 22rem)); }
.pw136-site .g-shot-img--plate { aspect-ratio: 660 / 172; object-fit: fill; background: #0d0b09; }
.pw136-site .g-plates .g-shot { margin: 0; }
.pw136-site .g-plates figcaption b { color: var(--text); font-weight: 600; }
/* Кімнати 7 і 27: план вартових */
.pw136-site .g-lane-legend { list-style: none; padding: 0; margin-top: .9rem; display: flex; flex-wrap: wrap; gap: .5rem 1.4rem; color: var(--soft); font-size: .86rem; }
.pw136-site .g-lane-legend li { display: inline-flex; align-items: center; gap: .55rem; }
.pw136-site .g-lane-key { flex: none; width: .85rem; height: .85rem; border-radius: 50%; }
.pw136-site .g-lane-key--loud { background: #e5654f; box-shadow: 0 0 0 4px rgb(229 101 79 / .2); }
.pw136-site .g-lane-key--quiet { background: #1a1714; border: 2px solid #a89a8b; }
.pw136-site .g-lane-key--path { width: 1.4rem; height: 4px; border-radius: 2px; background: var(--accent); }
.pw136-site .g-lane { margin: 0; min-width: 0; }
.pw136-site .g-lane svg { display: block; width: 100%; height: auto; border: 1px solid var(--line); border-radius: 10px; background: #0d0b09; }
.pw136-site .g-lane figcaption { margin-top: .55rem; color: var(--soft); font-size: .84rem; line-height: 1.45; }
.pw136-site .g-lane figcaption b { display: block; color: var(--text); font: 600 .95rem/1.3 var(--heading); }
/* Шапка: Майстер із кубиками зі сторінки «Про сервер» фоном між текстом і картою */
.pw136-site .g-hero--art { position: relative; isolation: isolate; overflow: hidden; }
.pw136-site .g-hero--art::before { content: ''; position: absolute; z-index: -1; top: 0; bottom: 0; left: 18%; width: min(46%, 60rem); background: url('assets/cube-guide-top.webp') no-repeat 60% 0 / cover; opacity: .5; -webkit-mask-image: radial-gradient(closest-side, #000 45%, transparent); mask-image: radial-gradient(closest-side, #000 45%, transparent); }
.pw136-site .g-hero--art::after { content: ''; position: absolute; z-index: -1; inset: 0; background: linear-gradient(90deg, var(--bg) 0%, rgb(11 10 9 / .55) 32%, transparent 55%), linear-gradient(0deg, var(--bg), transparent 30%); }
@media (max-width: 1100px) {
  .pw136-site .g-rules { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 1.4rem; }
  .pw136-site .g-rules li:nth-child(3)::before { display: none; }
  .pw136-site .g-walk, .pw136-site .g-walk-body--scheme { grid-template-columns: minmax(0, 1fr); }
  .pw136-site .g-head-media { grid-template-columns: minmax(0, 1fr); }
  .pw136-site .g-head-media .g-shot { margin-top: 1.6rem; }
  .pw136-site .g-rm-tiers ul { grid-template-columns: repeat(3, minmax(0, 8rem)); }
  .pw136-site .g-hero--art::before { left: auto; right: 0; width: 70%; opacity: .32; }
  /* Вужчий екран: ряд однієї висоти робив би схеми дрібними, тож картинки переносяться по дві */
  .pw136-site .g-rm-strip.g-rm-strip--fit { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pw136-site .g-rm-strip--fit .g-lane svg { max-height: 24rem; width: auto; max-width: 100%; }
  .pw136-site .g-rm-strip--fit > .g-plates { grid-column: 1 / -1; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pw136-site .g-rm--board .g-rm-strip.g-rm-strip--fit { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 760px) {
  .pw136-site .g-rm { grid-template-columns: 2.2rem minmax(0, 1fr); column-gap: .8rem; padding: 1rem; }
  .pw136-site .g-rm-split, .pw136-site .g-rm--pair .g-rm-strip, .pw136-site .g-rm-text > .g-plates { grid-template-columns: minmax(0, 1fr); }
  .pw136-site .g-rm-side { margin-top: .9rem; }
  .pw136-site .g-rm-num { font-size: 1.3rem; }
  .pw136-site .g-hero--art::before { top: 0; bottom: auto; height: 60%; width: 100%; opacity: .28; }
  .pw136-site .g-rm-strip.g-rm-strip--fit, .pw136-site .g-rm-split--plates, .pw136-site .g-rm-strip--fit > .g-plates { grid-template-columns: minmax(0, 1fr); }
  /* На телефоні знімок стоїть над текстом у повний кадр */
  .pw136-site .g-rm.g-rm--media { grid-template-columns: minmax(0, 1fr); padding: 0; }
  .pw136-site .g-rm-media { grid-row: 1; }
  .pw136-site .g-rm-media.g-rm-media--scheme { grid-row: 2; aspect-ratio: auto; padding: 0 1rem 1rem; }
  .pw136-site .g-rm-main { grid-template-columns: 2.2rem minmax(0, 1fr); column-gap: .8rem; padding: 1rem; }
}
@media (max-width: 760px) {
  .pw136-site .g-rules { grid-template-columns: minmax(0, 1fr); }
  .pw136-site .g-rules li + li::before { display: none; }
  .pw136-site .g-rules li + li { border-top: 1px solid var(--line); }
  .pw136-site .g-scheme--board .g-scheme-wide { display: none; }
  .pw136-site .g-scheme--board .g-scheme-narrow { display: block; }
  /* На телефоні рядок таблиці стає карткою: номер ліворуч, назва, опис і плата одне під одним */
  .pw136-site .g-rooms, .pw136-site .g-rooms tbody, .pw136-site .g-rooms tr, .pw136-site .g-rooms td, .pw136-site .g-rooms th { display: block; }
  .pw136-site .g-rooms thead { display: none; }
  .pw136-site .g-rooms tr { display: grid; grid-template-columns: 2.6rem minmax(0, 1fr); column-gap: .6rem; padding: .85rem 1rem; border-top: 1px solid var(--line); }
  .pw136-site .g-rooms td, .pw136-site .g-rooms th { width: auto !important; padding: 0; border-top: 0; }
  .pw136-site .g-rooms td:not(.g-t-num) { grid-column: 2; }
  .pw136-site .g-rooms .g-t-num { grid-row: 1 / span 4; }
  .pw136-site .g-rooms td + td:not(.g-t-name) { margin-top: .3rem; }
  .pw136-site .g-rooms .g-t-group { display: block; padding: .7rem 1rem; background: var(--raised); }
  .pw136-site .g-rooms .g-t-group th { padding: 0; background: none; }
  .pw136-site .g-rooms tr.is-key { background: var(--accent-soft); }
  .pw136-site .g-rooms tr.is-key td { background: none; }
  .pw136-site .g-rooms--lot td:nth-child(4)::before { content: '96+: '; color: var(--soft); }
  .pw136-site .g-rooms--lot td:nth-child(5)::before { content: '80–95: '; color: var(--soft); }
  .pw136-site .g-rooms--lot td[colspan]::before { content: none; }
}

/* Події в розділі «Підземелля» на «Про сервер», 16.10.2026: усі події однаковими картками, як підземелля; картка з
   готовим посібником веде на нього, решта до посібника показує рамку замість кадру. Дірок у рядах немає. */
.pw136-site .event-grid { margin-top: 16px; }
.pw136-site .event-card { color: inherit; }
.pw136-site .event-card .dungeon-copy { gap: 10px; }
.pw136-site .mode-steps--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.pw136-site .event-more { display: inline-flex; align-items: center; gap: 12px; margin-top: 6px; color: var(--accent); font-size: 14px; }
.pw136-site .event-more > span { transition: transform 150ms cubic-bezier(.4,0,.2,1); }
.pw136-site .event-card:hover .event-more > span, .pw136-site .event-card:focus-visible .event-more > span { transform: translateX(3px); }
.pw136-site a.event-card:hover h3, .pw136-site a.event-card:focus-visible h3 { color: var(--accent-hover); }
/* Подія без готового посібника: замість кадру рамка того ж розміру в мові заглушок сайту («Запис готується»);
   кадр і посилання з’являються разом із посібником, формат картки той самий. */
.pw136-site .event-pending { display: grid; place-items: center; width: 100%; aspect-ratio: 16 / 9; border-bottom: 1px dashed rgb(255 122 26 / .3); background: radial-gradient(120% 90% at 50% 100%, rgb(255 120 40 / .12), transparent 60%), repeating-linear-gradient(135deg, rgb(255 255 255 / .025) 0 2px, transparent 2px 14px), #0d0b09; }
.pw136-site .event-card.is-pending:hover { border-color: rgb(255 122 26 / .16); }
@media (min-width: 601px) and (max-width: 1024px) {
  .pw136-site .event-pending { height: 100%; border-bottom: 0; border-right: 1px dashed rgb(255 122 26 / .3); }
}
@media (min-width: 1025px) {
  /* 6 вузьких колонок: звичайна картка займає 2 (ширина картки підземелля). Неповний останній ряд закривають
     розтягнуті картки з кадром ліворуч (2 картки по 3 колонки, одинока на весь ряд), як одинока картка «Доповнень». */
  .pw136-site .event-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .pw136-site .event-grid > .event-card { grid-column: span 2; }
  .pw136-site .event-grid > .event-card:nth-last-child(2):nth-child(3n+1), .pw136-site .event-grid > .event-card:last-child:nth-child(3n+2) { grid-column: span 3; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .pw136-site .event-grid > .event-card:nth-last-child(2):nth-child(3n+1) > :first-child, .pw136-site .event-grid > .event-card:last-child:nth-child(3n+2) > :first-child { height: 100%; aspect-ratio: auto; border-bottom: 0; border-right: 1px dashed rgb(255 122 26 / .3); }
  .pw136-site .event-grid > .event-card:nth-last-child(2):nth-child(3n+1) .dungeon-copy, .pw136-site .event-grid > .event-card:last-child:nth-child(3n+2) .dungeon-copy { justify-content: center; padding: 24px 28px; }
  .pw136-site .event-grid > .event-card:last-child:nth-child(3n+1) { grid-column: 1 / -1; display: grid; grid-template-columns: calc((100% - 32px) / 3) minmax(0, 1fr); }
  .pw136-site .event-grid > .event-card:last-child:nth-child(3n+1) > img, .pw136-site .event-grid > .event-card:last-child:nth-child(3n+1) > .event-pending { height: 100%; aspect-ratio: auto; border-bottom: 0; border-right: 1px solid rgb(255 122 26 / .2); }
  .pw136-site .event-grid > .event-card:last-child:nth-child(3n+1) .dungeon-copy { justify-content: center; padding: 24px 32px; }
}
@media (max-width: 600px) {
  .pw136-site .mode-steps--three { grid-template-columns: minmax(0, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
  .pw136-site .event-card:hover .event-more > span, .pw136-site .event-card:focus-visible .event-more > span { transform: none; }
}

/* Посібник «Конкурс ремісників», 17.10.2026. Перший екран показує сітку однієї категорії: 8 груп сходяться у фінал,
   квадрат це скриня з перепусткою. Схема вбудована (кольори зі змінних сайту), на телефоні — вертикальний варіант. */
.pw136-site .g-bracket svg { border-radius: 12px; }
.pw136-site .g-bracket .g-scheme-narrow { display: none; }
.pw136-site .g-bracket text { font-family: var(--heading); font-size: 15px; font-weight: 600; fill: var(--text); text-anchor: middle; }
.pw136-site .g-bracket .g-br-row text { text-anchor: start; }
.pw136-site .g-bracket .g-br-time { fill: var(--accent); font-size: 14px; }
.pw136-site .g-bracket .g-br-sub { fill: var(--soft); font-family: var(--font); font-size: 13px; font-weight: 400; }
.pw136-site .g-bracket .g-br-line { fill: none; stroke: var(--line-strong); stroke-width: 1.5; }
.pw136-site .g-bracket .g-br-node rect, .pw136-site .g-bracket .g-br-groups rect { fill: var(--raised); stroke: var(--line-strong); }
.pw136-site .g-bracket .g-br-num text { font-size: 14px; fill: var(--muted); }
.pw136-site .g-bracket .g-br-chest rect, .pw136-site .g-bracket .g-br-chest use { fill: rgb(255 122 26 / .55); }
.pw136-site .g-bracket .g-br-final { fill: rgb(255 122 26 / .1); stroke: var(--accent); stroke-width: 1.5; }
/* Фінал пʼєдесталом (18.10.2026): сходинки 2 · 1 · 3, над кожною її скрині; коробка ширша, ніж вища */
.pw136-site .g-bracket .g-br-gold { fill: var(--accent); }
.pw136-site .g-bracket .g-br-pod rect { fill: var(--raised); stroke: var(--line-strong); }
.pw136-site .g-bracket .g-br-pod .g-br-pod-1 { fill: rgb(255 122 26 / .16); stroke: var(--accent); }
.pw136-site .g-bracket .g-br-pod text { font-size: 13px; fill: var(--text); }
.pw136-site .g-bracket .g-br-dot circle, .pw136-site .g-bracket circle.g-br-dot { fill: var(--bg); stroke: var(--line-strong); stroke-width: 2; }
.pw136-site .g-bracket circle.g-br-dot--key { fill: var(--accent); stroke: var(--accent); }
/* Вагові категорії: шість рівнів одним рядком, без рамок навколо кожної */
.pw136-site .g-cats { list-style: none; padding: 0; margin-top: clamp(2rem, 4vw, 3rem); display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.pw136-site .g-cats li { position: relative; padding: 1.1rem 1rem 1.2rem 0; }
.pw136-site .g-cats li + li { padding-left: 1.2rem; border-left: 1px solid var(--line); }
.pw136-site .g-cats b { display: block; color: var(--text); font: 600 1.7rem/1 var(--heading); letter-spacing: -.03em; }
.pw136-site .g-cats span { display: block; margin-top: .45rem; color: var(--soft); font-size: .88rem; line-height: 1.35; }
/* Нагороди за місця: картка на категорію, місця рядками, предмет значком з кількістю */
.pw136-site .g-prize-legend { list-style: none; padding: 0; margin-top: clamp(1.8rem, 3.5vw, 2.6rem); display: flex; flex-wrap: wrap; gap: .7rem 1.8rem; color: var(--muted); font-size: .92rem; }
.pw136-site .g-prize-legend li { display: inline-flex; align-items: center; gap: .55rem; }
.pw136-site .g-prize-legend img { width: 2rem; height: 2rem; border-radius: 6px; }
.pw136-site .g-prizes { margin-top: 1.4rem; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.4rem; }
.pw136-site .g-prize { display: flex; flex-direction: column; padding: 1.1rem 1.3rem 1.1rem; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); scroll-margin-top: calc(81px + 4rem); }
.pw136-site .g-prize-head { display: flex; align-items: baseline; justify-content: space-between; gap: .4rem 1rem; flex-wrap: wrap; padding-bottom: .85rem; border-bottom: 1px solid var(--line); }
.pw136-site .g-prize-head b { color: var(--text); font: 600 1.75rem/1 var(--heading); letter-spacing: -.035em; }
.pw136-site .g-prize-head span { color: var(--soft); font-size: .9rem; }
.pw136-site .g-prize-places { list-style: none; padding: 0; }
.pw136-site .g-prize-places li { display: grid; grid-template-columns: 2.6rem minmax(0, 1fr) auto; align-items: center; gap: .9rem; padding: .8rem 0; border-bottom: 1px solid var(--line); }
.pw136-site .g-prize-xp { color: var(--muted); font-size: .88rem; line-height: 1.45; }
.pw136-site .g-prize-xp b { color: var(--text); font: 600 1.02rem/1.3 var(--heading); }
.pw136-site .g-prize-item { display: inline-flex; align-items: center; gap: .4rem; }
.pw136-site .g-prize-item img { width: 2.6rem; height: 2.6rem; border-radius: 7px; }
.pw136-site .g-prize-item b { min-width: 1.6em; color: var(--text); font: 600 1.15rem/1 var(--heading); }
/* Бонус за тури: таблиця «тур 1 · 2 · 3», рядки досвід, дух, таблетки; цифри одна під одною */
.pw136-site .g-tours { align-self: flex-start; width: auto; margin-top: .9rem; border-collapse: collapse; font-size: .84rem; font-variant-numeric: tabular-nums; }
.pw136-site .g-tours th, .pw136-site .g-tours td { min-width: 4.6rem; padding: .3rem 0 .3rem 1rem; text-align: right; font-weight: 400; }
.pw136-site .g-tours thead th { padding-bottom: .4rem; border-bottom: 1px solid var(--line); color: var(--soft); font-size: .78rem; }
.pw136-site .g-tours thead th:first-child, .pw136-site .g-tours tbody th { padding-left: 0; text-align: left; color: var(--soft); }
.pw136-site .g-tours td { color: var(--text); }
.pw136-site .g-tours tbody th img { display: inline-block; width: 1.5rem; height: 1.5rem; border-radius: 4px; vertical-align: middle; }
/* Шапка посібника: портрет Розпорядника з кадру владельця тим самим прийомом, що й Майстер у Кубі
   (владелець 18.10.2026 обрав саме цей, збільшений варіант) */
.pw136-site .g-hero--konkurs::before { background-image: url('assets/guides/konkurs-remisnykiv/hero-1018b.webp'); background-position: 50% 10%; }
/* Етапи вечора — картки кімнат Куба (g-rm--media, кадри 16:10). Обмін — плитки: значок, назва й ціна
   поруч, щоб не водити поглядом через увесь екран */
.pw136-site .g-swap-grid { margin-top: clamp(1.8rem, 3.5vw, 2.6rem); }
.pw136-site .g-swap-group { display: flex; align-items: center; gap: .6rem; margin-top: clamp(1.6rem, 3vw, 2.2rem); color: var(--text); font: 600 1.1rem/1.3 var(--heading); }
.pw136-site .g-swap-group:first-child { margin-top: 0; }
.pw136-site .g-swap-group img { width: 2rem; height: 2rem; border-radius: 6px; }
.pw136-site .g-swap-tiles { list-style: none; padding: 0; margin-top: .9rem; display: grid; grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); gap: .8rem; }
.pw136-site .g-swap-tile { display: grid; grid-template-columns: 3.2rem minmax(0, 1fr); gap: .9rem; align-items: start; padding: 1rem 1.1rem; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.pw136-site .g-swap-tile > img { width: 3.2rem; height: 3.2rem; border-radius: 8px; }
.pw136-site .g-swap-name { display: block; color: var(--text); font: 600 .98rem/1.3 var(--heading); }
.pw136-site .g-swap-body small { display: block; margin-top: .1rem; color: var(--soft); font-size: .8rem; }
.pw136-site .g-swap-price { list-style: none; padding: 0; margin-top: .6rem; display: grid; gap: .35rem; }
.pw136-site .g-swap-price li { display: flex; align-items: center; gap: .45rem; color: var(--muted); font-size: .86rem; }
.pw136-site .g-swap-price span { min-width: 3.4rem; }
.pw136-site .g-swap-price b { color: var(--text); font: 600 1.02rem/1 var(--heading); font-variant-numeric: tabular-nums; }
.pw136-site .g-swap-price img { width: 1.6rem; height: 1.6rem; border-radius: 4px; }
@media (max-width: 1100px) {
  .pw136-site .g-cats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pw136-site .g-cats li:nth-child(4) { padding-left: 0; border-left: 0; }
  .pw136-site .g-cats li:nth-child(n+4) { border-top: 1px solid var(--line); }
  .pw136-site .g-prizes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .pw136-site .g-prizes { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 600px) {
  .pw136-site .g-bracket .g-scheme-wide { display: none; }
  .pw136-site .g-bracket .g-scheme-narrow { display: block; }
  .pw136-site .g-cats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pw136-site .g-cats li:nth-child(n) { padding-left: 1.2rem; border-left: 1px solid var(--line); border-top: 0; }
  .pw136-site .g-cats li:nth-child(odd) { padding-left: 0; border-left: 0; }
  .pw136-site .g-cats li:nth-child(n+3) { border-top: 1px solid var(--line); }
}
/* «Світові боси» (переробка 18.10.2026 за зауваженнями власника). Шапка — Дух вдови фоном, як портрети в Кубі
   й Конкурсі. Карта світу з печатками босів і вікно здобичі — ті самі печатки й рамка вікна, що на карті Міста
   темних звірів (src/locationmap): клік по печатці або кадру боса відкриває вікно, як у грі. Координат і номерів немає. */
.pw136-site .g-hero--bosy::before { background-image: url('assets/guides/svitovi-bosy/hero-widow.webp'); background-position: 50% 15%; }
.pw136-site .g-wmap { width: min(100%, 36rem); margin: 0; justify-self: center; }
.pw136-site .g-wmap-box { position: relative; border: 1px solid var(--line-strong); border-radius: 12px; background: var(--surface); }
/* Скругляється сама карта, а не рамка: печатки біля краю (Кіготь землі, Реальність) не обрізаються */
.pw136-site .g-wmap-img { display: block; width: 100%; height: auto; border-radius: 11px; }
.pw136-site .g-wmap-pts { position: absolute; inset: 0; margin: 0; padding: 0; list-style: none; }
/* Сила боса — оправою печатки, як там: одиночний — проста, вечірній — з подвійною рамкою, Дух вдови — з жаром.
   Вид — кольором заливки (build_guide_svitovi_bosy.py): вечірні червоні, одиночні сині, вдова фіолетова */
.pw136-site .g-mk { position: absolute; width: clamp(1.6rem, 2.4vw, 2.3rem); aspect-ratio: 1; padding: 0; border: 0; background: url('assets/guides/svitovi-bosy/marks/boss_e.svg') center / contain no-repeat; transform: translate(-50%, -50%); cursor: pointer; transition: transform 150ms cubic-bezier(.4, 0, .2, 1); }
.pw136-site .g-mk--s { width: clamp(1.35rem, 2vw, 1.95rem); background-image: url('assets/guides/svitovi-bosy/marks/boss_s.svg'); }
.pw136-site .g-mk--w { z-index: 2; width: clamp(2rem, 3vw, 2.8rem); background-image: url('assets/guides/svitovi-bosy/marks/boss_w.svg'); }
.pw136-site .g-mk:hover, .pw136-site .g-mk:focus-visible { z-index: 4; transform: translate(-50%, -50%) scale(1.22); outline: none; }
.pw136-site .g-mk:active { transform: translate(-50%, -50%) scale(.92); }
.pw136-site .g-mk:focus-visible::before { content: ''; position: absolute; inset: -10%; border-radius: 50%; box-shadow: 0 0 0 2px #ffcb4a, 0 0 10px 2px rgb(255 203 74 / .5); }
/* Алмаз і Дух вдови стоять за 13 одиниць один від одного: печатки розсунуті, щоб не накривали одна одну */
.pw136-site .g-mk--nudge-l { transform: translate(-85%, -50%); }
.pw136-site .g-mk--nudge-r { transform: translate(-15%, -50%); }
.pw136-site .g-mk--nudge-l:hover, .pw136-site .g-mk--nudge-l:focus-visible { transform: translate(-85%, -50%) scale(1.22); }
.pw136-site .g-mk--nudge-r:hover, .pw136-site .g-mk--nudge-r:focus-visible { transform: translate(-15%, -50%) scale(1.22); }
/* Ім’я при наведенні — м’якою хмаркою, як підпис мітки на тій карті. Вимкнене до наведення повністю:
   невидиме, але викладене, воно давало прокрутку вбік на телефоні */
.pw136-site .g-mk-tip { position: absolute; left: 50%; bottom: calc(100% + .2rem); transform: translateX(-50%); padding: .2rem .8rem; background: radial-gradient(closest-side, rgb(12 9 6 / .9) 60%, rgb(12 9 6 / 0)); color: #fff1cf; font: 400 .78rem/1.2 var(--font); letter-spacing: 0; white-space: nowrap; text-shadow: 0 0 2px #000, 0 1px 1px #000; pointer-events: none; display: none; }
.pw136-site .g-mk:hover .g-mk-tip, .pw136-site .g-mk:focus-visible .g-mk-tip { display: block; }
.pw136-site .g-wmap-key { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1.4rem; margin-top: .75rem; color: var(--soft); font-size: .86rem; }
.pw136-site .g-wmap-key span { display: inline-flex; align-items: center; gap: .45rem; }
.pw136-site .g-wmap-key .g-wmap-hint { flex-basis: 100%; color: var(--muted); font-size: .8rem; }
.pw136-site .g-mk-ico { display: inline-block; flex: none; width: 1.3rem; height: 1.3rem; background: url('assets/guides/svitovi-bosy/marks/boss_e.svg') center / contain no-repeat; }
.pw136-site .g-mk-ico--s { background-image: url('assets/guides/svitovi-bosy/marks/boss_s.svg'); }
.pw136-site .g-mk-ico--w { background-image: url('assets/guides/svitovi-bosy/marks/boss_w.svg'); }
.pw136-site .g-rw-name span b { color: var(--text); font-weight: 600; }
/* Картки босів: кадр гри однією міркою на весь ряд; клік відкриває вікно здобичі. Під кадром печатка й ім’я */
.pw136-site .g-bcards { list-style: none; padding: 0; margin: clamp(1.6rem, 3vw, 2.2rem) 0 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(1.2rem, 2vw, 1.7rem) clamp(1rem, 1.6vw, 1.4rem); }
.pw136-site .g-bcard { min-width: 0; }
.pw136-site .g-bcard-media, .pw136-site .g-shot-btn { display: block; width: 100%; padding: 0; overflow: hidden; border: 1px solid var(--line-strong); border-radius: 10px; background: #0d0b09; cursor: pointer; }
.pw136-site .g-shot-btn { border: 0; border-radius: 12px; }
.pw136-site .g-bcard-media img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; transition: transform 400ms cubic-bezier(.16, 1, .3, 1), filter 200ms ease; }
.pw136-site .g-shot-btn .g-shot-img { display: block; transition: transform 400ms cubic-bezier(.16, 1, .3, 1), filter 200ms ease; }
/* Кадр-кнопка відкриває вікно — стандарт клікабельної картки сайту (наближення й світліше, див. a.dungeon-card) */
.pw136-site .g-bcard-media:hover img, .pw136-site .g-bcard-media:focus-visible img,
.pw136-site .g-shot-btn:hover .g-shot-img, .pw136-site .g-shot-btn:focus-visible .g-shot-img { transform: scale(1.03); filter: brightness(1.08); }
@media (prefers-reduced-motion: reduce) {
  .pw136-site .g-bcard-media:hover img, .pw136-site .g-bcard-media:focus-visible img,
  .pw136-site .g-shot-btn:hover .g-shot-img, .pw136-site .g-shot-btn:focus-visible .g-shot-img { transform: none; }
}
.pw136-site .g-bcard-media:focus-visible, .pw136-site .g-shot-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.pw136-site .g-bcard-cap { display: flex; align-items: center; gap: .55rem; margin: .7rem 0 0; }
.pw136-site .g-bcard-cap strong { color: var(--text); font: 600 .95rem/1.3 var(--heading); }
/* Приписка Духа вдови стоїть у колонці опису поруч із кадром, а не окремим рядком під ним */
.pw136-site .g-head-media .g-sec-head .g-note { margin-top: 1.2rem; }
/* Скриня й Молоток в одному рядку здобичі: ключ біля скрині, ціна під назвою */
.pw136-site .g-loot li.g-key span { display: flex; flex-direction: column; gap: .15rem; }
.pw136-site .g-loot li.g-key small { color: var(--soft); font-size: .78rem; line-height: 1.2; }
/* Вікно здобичі — у стилі самого сайту (владелець 18.10.2026: рамки ігрового інтерфейсу на сайті чужі). Плашка —
   як таблиця здобичі (surface, line-strong, скруглення); кадр боса шапкою, низ тоне в тлі, на ньому печатка виду
   й ім’я, як шапка гайда; хрестик — кружок, як кнопка в «Частих питаннях»; свойства — як факти шапки;
   рядки здобичі — як у таблиці, лише стисліше */
html.g-bpop-open { overflow: hidden; }
/* Смуга прокрутки сторінки зникала під вікном, і сторінка зсувалася вбік: місце під неї тримається завжди */
html:has(#g-bpop) { scrollbar-gutter: stable; }
.pw136-site .g-bpop { position: fixed; inset: 0; z-index: 200; display: grid; place-items: center; padding: 16px; background: rgb(var(--shade) / .78); backdrop-filter: blur(6px); }
.pw136-site .g-bpop[hidden] { display: none; }
.pw136-site .g-bpop-win { position: relative; display: flex; flex-direction: column; width: min(100%, 30rem); max-height: min(88vh, 54rem); overflow: hidden; border: 1px solid var(--line-strong); border-radius: 14px; background: var(--surface); box-shadow: 0 24px 64px rgb(0 0 0 / .6); }
/* Фокус ставиться на саме вікно (щоб Tab ішов усередину); загальна помаранчева рамка фокусу сайту тут зайва */
.pw136-site .g-bpop-win:focus-visible { outline: none; }
.pw136-site .g-bpop-head { position: relative; flex: none; }
.pw136-site .g-bpop-shot { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; object-position: 50% 30%; }
.pw136-site .g-bpop-head::after { content: ''; position: absolute; inset: 30% 0 0; background: linear-gradient(0deg, var(--surface) 3%, rgb(19 17 16 / .72) 48%, transparent); pointer-events: none; }
.pw136-site .g-bpop-title { position: absolute; z-index: 1; left: 1.3rem; right: 1.3rem; bottom: .65rem; display: grid; justify-items: start; gap: .3rem; }
.pw136-site .g-bpop-kind { display: inline-flex; align-items: center; gap: .45rem; color: var(--accent); font-size: .72rem; letter-spacing: .16em; text-transform: uppercase; }
.pw136-site .g-bpop-kind .g-mk-ico { width: 1.2rem; height: 1.2rem; }
.pw136-site .g-bpop-name { color: var(--text); font: 600 1.35rem/1.2 var(--heading); text-shadow: 0 1px 12px rgb(0 0 0 / .65); }
.pw136-site .g-bpop-close { position: absolute; z-index: 2; top: .8rem; right: .8rem; width: 2.1rem; height: 2.1rem; padding: 0; border: 1px solid var(--line-strong); border-radius: 50%; background: rgb(var(--shade) / .72) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath d='M11 11l8 8M19 11l-8 8' fill='none' stroke='%23ff7a1a' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E") center / 100% 100% no-repeat; cursor: pointer; transition: border-color 150ms ease, background-color 150ms ease; }
.pw136-site .g-bpop-close:hover { border-color: var(--accent-line); background-color: rgb(var(--shade) / .92); }
.pw136-site .g-bpop-close:focus-visible { outline-offset: 2px; }
.pw136-site .g-bpop-body { display: flex; flex-direction: column; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: .35rem 1.3rem 1.2rem; scrollbar-width: thin; scrollbar-color: var(--line-strong) transparent; }
.pw136-site .g-bpop-facts { flex: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.pw136-site .g-bpop-facts div { padding: .65rem .9rem .65rem 0; }
.pw136-site .g-bpop-facts div:nth-child(even) { padding-left: .9rem; border-left: 1px solid var(--line); }
.pw136-site .g-bpop-facts div:nth-child(n+3) { border-top: 1px solid var(--line); }
/* Непарне останнє свойство (у вечірніх і одиночних їх три) — на всю ширину, без порожньої клітинки поруч */
.pw136-site .g-bpop-facts div:last-child:nth-child(odd) { grid-column: 1 / -1; }
.pw136-site .g-bpop-facts dt { color: var(--soft); font-size: .78rem; line-height: 1.3; }
.pw136-site .g-bpop-facts dd { margin: .2rem 0 0; color: var(--text); font: 600 .92rem/1.35 var(--heading); }
.pw136-site .g-bpop-drophead { margin: 1.05rem 0 .15rem; color: var(--soft); font-size: .8rem; }
.pw136-site .g-bpop-drops { list-style: none; margin: 0; padding: 0; }
.pw136-site .g-bpop-drops li { display: grid; grid-template-columns: 2.4rem minmax(0, 1fr); align-items: center; gap: .8rem; padding: .6rem 0; border-top: 1px solid var(--line); }
.pw136-site .g-bpop-drops li:first-child { border-top: 0; }
.pw136-site .g-bpop-drops img { display: block; width: 2.4rem; height: 2.4rem; border-radius: 8px; }
.pw136-site .g-bpop-drops strong { display: block; color: var(--text); font: 600 .95rem/1.3 var(--heading); }
.pw136-site .g-bpop-drops small { display: block; margin-top: .1rem; color: var(--soft); font-size: .84rem; line-height: 1.4; }
.pw136-site .g-bpop-drops small b { color: var(--accent-hover); font-weight: 600; }
.pw136-site .g-bpop-foot { margin: .15rem 0 0; padding-top: .8rem; border-top: 1px solid var(--line); color: var(--soft); font-size: .84rem; line-height: 1.45; }
.pw136-site .g-bpop-more { align-self: flex-start; margin-top: .75rem; color: var(--accent); font-size: .9rem; font-weight: 600; text-decoration: none; transition: color 150ms ease; }
.pw136-site .g-bpop-more:hover { color: var(--accent-hover); text-decoration: underline; text-underline-offset: 4px; }
.pw136-site .g-loot--gems li { font-size: .86rem; }
@media (max-width: 1100px) {
  .pw136-site .g-bcards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .pw136-site .g-bcards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 520px) {
  .pw136-site .g-bcards { grid-template-columns: minmax(0, 1fr); }
}
/* «Напади на міста» (19.10.2026, за зразком «Світових босів»). Шапка — Комендант облоги фоном; печатки — з карти Міста
   темних звірів (build_guide_napady.py): селище — проста синя, облога — печатка володаря, генерали — подвійна оправа,
   скрині — кристал ресурсу, Лі Юань — печатка НІПа. Клік по печатці відкриває те саме вікно здобичі */
.pw136-site .g-hero--napady::before { background-image: url('assets/guides/napady-na-mista/hero-kom.webp'); background-position: 50% 15%; }
.pw136-site .g-mk--nv { width: clamp(1.25rem, 1.8vw, 1.75rem); background-image: url('assets/guides/napady-na-mista/marks/nv.svg'); }
.pw136-site .g-mk--nc { z-index: 2; width: clamp(2rem, 3vw, 2.8rem); background-image: url('assets/guides/napady-na-mista/marks/nc.svg'); }
.pw136-site .g-mk--ng { background-image: url('assets/guides/napady-na-mista/marks/ng.svg'); }
.pw136-site .g-mk--nr, .pw136-site .g-mk--nn { width: clamp(1.4rem, 2vw, 1.9rem); background-image: url('assets/guides/napady-na-mista/marks/nr.svg'); }
.pw136-site .g-mk--nn { background-image: url('assets/guides/napady-na-mista/marks/nn.svg'); }
.pw136-site .g-mk-ico--nv { background-image: url('assets/guides/napady-na-mista/marks/nv.svg'); }
.pw136-site .g-mk-ico--nc { background-image: url('assets/guides/napady-na-mista/marks/nc.svg'); }
.pw136-site .g-mk-ico--ng { background-image: url('assets/guides/napady-na-mista/marks/ng.svg'); }
.pw136-site .g-mk-ico--nr { background-image: url('assets/guides/napady-na-mista/marks/nr.svg'); }
.pw136-site .g-mk-ico--nn { background-image: url('assets/guides/napady-na-mista/marks/nn.svg'); }
/* Вкладки днів (селища Нашестя) — як чипи розділу; обраний день — акцентом, як перший чип. Печатки інших днів
   на карті приглушені, а не сховані: видно, що селищ 35 */
.pw136-site .g-days { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: 1.4rem; }
.pw136-site .g-days button { min-width: 2.9rem; padding: .4rem .85rem; border: 1px solid var(--line-strong); border-radius: 999px; background: transparent; color: var(--body); font: 600 .9rem/1 var(--heading); cursor: pointer; transition: border-color 150ms ease, color 150ms ease, background-color 150ms ease; }
.pw136-site .g-days button:hover { border-color: var(--accent-line); color: var(--text); }
.pw136-site .g-days button[aria-selected="true"] { border-color: var(--accent-line); background: var(--accent-soft); color: var(--text); }
/* Одна карта в шапці: перемикач «Нашестя / Облога» над нею — ті самі пігулки, що й дні, але більші й зі знаком
   печатки; дні стоять під картою світу, у рядку легенди */
.pw136-site .g-maptabs { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: .75rem; }
.pw136-site .g-maptabs button { display: inline-flex; align-items: center; gap: .5rem; padding: .55rem 1.05rem; border: 1px solid var(--line-strong); border-radius: 999px; background: transparent; color: var(--body); font: 600 .95rem/1.1 var(--heading); cursor: pointer; transition: border-color 150ms ease, color 150ms ease, background-color 150ms ease; }
.pw136-site .g-maptabs button:hover { border-color: var(--accent-line); color: var(--text); }
.pw136-site .g-maptabs button[aria-selected="true"] { border-color: var(--accent-line); background: var(--accent-soft); color: var(--text); }
/* Карта прижата до правого краю й заповнює колонку, скільки дозволяє висота екрана (уся видна без прокрутки на 2К);
   обидві картинки однієї міри 1536×1792, а обидва види стоять в одній клітинці (прихований лише невидимий, клас
   is-off-view, бо [hidden] сайту — display: none !important) — висоту задає більший на будь-якій мові, перемикач не
   змінює висоту шапки */
@media (min-width: 1101px) {
  .pw136-site .g-hero--napady .g-hero-grid { grid-template-columns: minmax(0, 1fr) auto; }
  .pw136-site .g-mapsw { width: clamp(32rem, calc((100svh - 18rem) * 1536 / 1792), 52rem); justify-self: end; }
}
.pw136-site .g-mapsw { display: grid; grid-template-columns: minmax(0, 1fr); align-content: start; }
.pw136-site .g-mapsw > .g-mapview { grid-row: 2; grid-column: 1; }
.pw136-site .g-mapsw > .g-mapview.is-off-view { visibility: hidden; }
.pw136-site .g-mapsw .g-wmap-key { align-content: flex-start; margin-bottom: 0; }
.pw136-site .g-mapsw .g-days { margin: 0; }
/* Печатки вдвічі більші, ніж були, і ростуть разом із картою (частка її ширини); крок печаток генералів —
   у build_guide_napady.py, перевірка — check_guide_napady.py (SEAL) */
.pw136-site .g-mapsw .g-wmap-box { container-type: inline-size; }
.pw136-site .g-mapsw .g-mk--nv { width: clamp(1.5rem, 7.5cqi, 4rem); }
.pw136-site .g-mapsw .g-mk--ng { width: clamp(1.6rem, 8cqi, 4.4rem); }
.pw136-site .g-mapsw .g-mk--nc { width: clamp(1.9rem, 9.7cqi, 5.2rem); }
.pw136-site .g-mapsw .g-mk--nr, .pw136-site .g-mapsw .g-mk--nn { width: clamp(1.4rem, 7cqi, 3.8rem); }
.pw136-site .g-mapsw .g-mk--nv:not(.is-off) { z-index: 1; }
/* Одна міра кадрів на всю сторінку: кадр розділу завширшки з картку сусіднього ряду (5, 3, 2 або 1 у ряд) */
@media (min-width: 1101px) {
  .pw136-site .g-page--napady .g-head-media { grid-template-columns: repeat(5, minmax(0, 1fr)); column-gap: clamp(1rem, 1.6vw, 1.4rem); }
  .pw136-site .g-page--napady .g-head-media > .g-sec-head { grid-column: 1 / 5; }
}
@media (min-width: 761px) and (max-width: 1100px) {
  .pw136-site .g-page--napady .g-head-media { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: clamp(1rem, 1.6vw, 1.4rem); }
  .pw136-site .g-page--napady .g-head-media > .g-sec-head { grid-column: 1 / 3; }
  .pw136-site .g-page--napady .g-head-media .g-shot { margin-top: 0; }
}
@media (min-width: 521px) and (max-width: 760px) {
  .pw136-site .g-page--napady .g-head-media .g-shot { width: calc(50% - clamp(.5rem, .8vw, .7rem)); }
}
/* Телефон: перемикач — дві рівні клітинки, 7 днів — один рядок рівних кнопок */
@media (max-width: 560px) {
  .pw136-site .g-maptabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pw136-site .g-maptabs button { justify-content: center; padding: .5rem .6rem; border-radius: 12px; font-size: .85rem; text-align: left; }
  .pw136-site .g-days { flex-wrap: nowrap; gap: .3rem; }
  .pw136-site .g-days button { flex: 1 1 0; min-width: 0; padding: .45rem 0; }
}
/* «пн», «вт», «чт» — самі малі літери: рядок, обрізаний по висоті малої літери й лінії шрифту, стоїть посередині
   кнопки (без обрізання вони здаються нижчими за центр); де браузер не вміє обрізати — як було */
@supports (text-box: trim-both ex alphabetic) {
  .pw136-site .g-days button { text-box: trim-both ex alphabetic; padding-block: .82em; }
}
/* Картка селища показує його на карті світлом: тепле сяйво довкола печатки дихає, ним кружляє світло, золотою
   рамкою біжить відблиск (малює script.js на полотні .g-mk-need); печатка не рухається, назва лишається, доки не
   оберуть інше селище, день чи карту */
@keyframes g-mk-pick { from { opacity: 0; } to { opacity: 1; } }
.pw136-site .g-mapsw .g-mk.is-picked { z-index: 3; }
.pw136-site .g-mk-need { position: absolute; left: 50%; top: 50%; translate: -50% -50%; pointer-events: none; animation: g-mk-pick 420ms ease-out both; }
.pw136-site .g-mapsw .g-mk.is-picked .g-mk-tip { display: block; animation: g-mk-pick 420ms ease-out both; }
@media (prefers-reduced-motion: reduce) {
  .pw136-site .g-mk-need, .pw136-site .g-mapsw .g-mk.is-picked .g-mk-tip { animation: none; }
}
.pw136-site .g-mk.is-off { opacity: .3; filter: grayscale(1); }
.pw136-site .g-mk.is-off:hover, .pw136-site .g-mk.is-off:focus-visible { opacity: 1; filter: none; }
/* Картки по 5 у ряд (5 селищ дня, 10 генералів у два ряди); підпис — ім’я й під ним рівень чи хвиля */
@media (min-width: 1101px) {
  .pw136-site .g-bcards--5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}
.pw136-site .g-bcard-cap > span { display: grid; gap: .1rem; min-width: 0; }
.pw136-site .g-bcard-cap small { color: var(--soft); font-size: .8rem; line-height: 1.3; }
/* «Палац царя драконів» (20.10.2026, за зразком «Нападів на міста»). Шапка — Чивень фоном; печатки — з карти Міста
   темних звірів (build_guide_palats.py): Чивень — печатка володаря, Воїнства — синя печатка НІПа, Цзяо — печатка
   НІПа, Іржава скриня — кристал ресурсу, кучка складів — срібний кристал, кучка з рідкісним — золотий; клік по
   кучці наближає район (data-zoom, вид z-N), де кожен склад своїм кольором і знак повернення pz (22-23.10.2026).
   Карта Палацу з уступом угорі праворуч (1536×1597), тож своя ширина; НІПи й Воїнства менші, щоб склади було видно */
.pw136-site .g-hero--palats::before { background-image: url('assets/guides/palats-tsaria-drakoniv/hero-chiven-1023c.webp'); background-position: 50% 30%; }
.pw136-site .g-mk--pc { z-index: 2; background-image: url('assets/guides/palats-tsaria-drakoniv/marks/pc.svg'); }
.pw136-site .g-mk--pf { background-image: url('assets/guides/palats-tsaria-drakoniv/marks/pf.svg'); }
.pw136-site .g-mk--pn { background-image: url('assets/guides/palats-tsaria-drakoniv/marks/pn.svg'); }
.pw136-site .g-mk--pr { background-image: url('assets/guides/palats-tsaria-drakoniv/marks/pr.svg'); }
.pw136-site .g-mk--ps { background-image: url('assets/guides/palats-tsaria-drakoniv/marks/ps.svg'); }
.pw136-site .g-mk--pg { z-index: 1; background-image: url('assets/guides/palats-tsaria-drakoniv/marks/pg.svg'); }
.pw136-site .g-mk--s1 { background-image: url('assets/guides/palats-tsaria-drakoniv/marks/s1.svg'); }
.pw136-site .g-mk--s2 { background-image: url('assets/guides/palats-tsaria-drakoniv/marks/s2.svg'); }
.pw136-site .g-mk--s3 { background-image: url('assets/guides/palats-tsaria-drakoniv/marks/s3.svg'); }
.pw136-site .g-mk--s4 { background-image: url('assets/guides/palats-tsaria-drakoniv/marks/s4.svg'); }
.pw136-site .g-mk--pz { z-index: 2; background-image: url('assets/guides/palats-tsaria-drakoniv/marks/pz.svg'); }
.pw136-site .g-mk--pz.g-mk--zoom { cursor: zoom-out; }
.pw136-site .g-mk-ico--pc { background-image: url('assets/guides/palats-tsaria-drakoniv/marks/pc.svg'); }
.pw136-site .g-mk-ico--pf { background-image: url('assets/guides/palats-tsaria-drakoniv/marks/pf.svg'); }
.pw136-site .g-mk-ico--pn { background-image: url('assets/guides/palats-tsaria-drakoniv/marks/pn.svg'); }
.pw136-site .g-mk-ico--pr { background-image: url('assets/guides/palats-tsaria-drakoniv/marks/pr.svg'); }
.pw136-site .g-mk-ico--ps { background-image: url('assets/guides/palats-tsaria-drakoniv/marks/ps.svg'); }
.pw136-site .g-mk-ico--pg { background-image: url('assets/guides/palats-tsaria-drakoniv/marks/pg.svg'); }
.pw136-site .g-mk-ico--s1 { background-image: url('assets/guides/palats-tsaria-drakoniv/marks/s1.svg'); }
.pw136-site .g-mk-ico--s2 { background-image: url('assets/guides/palats-tsaria-drakoniv/marks/s2.svg'); }
.pw136-site .g-mk-ico--s3 { background-image: url('assets/guides/palats-tsaria-drakoniv/marks/s3.svg'); }
.pw136-site .g-mk-ico--s4 { background-image: url('assets/guides/palats-tsaria-drakoniv/marks/s4.svg'); }
.pw136-site .g-mapsw .g-mk--pc { width: clamp(1.9rem, 9.7cqi, 5.2rem); }
.pw136-site .g-mapsw .g-mk--pf, .pw136-site .g-mapsw .g-mk--pn { width: clamp(.9rem, 4.5cqi, 2.45rem); }
.pw136-site .g-mapsw .g-mk--pr { width: clamp(1.1rem, 5.5cqi, 3rem); }
.pw136-site .g-mapsw .g-mk--pg { width: clamp(1rem, 5cqi, 2.7rem); }
.pw136-site .g-mapsw .g-mk--ps { width: clamp(.8rem, 4cqi, 2.2rem); }
/* наближений район: склади 3,6 % ширини, рідкісний 4,2, орієнтири як на всій карті, Печатка 8, повернення 5 */
.pw136-site .g-mapsw--palats .g-mapview[data-map^="z-"] .g-mk { width: clamp(.7rem, 3.6cqi, 2rem); }
.pw136-site .g-mapsw--palats .g-mapview[data-map^="z-"] .g-mk--pg { width: clamp(.8rem, 4.2cqi, 2.3rem); }
.pw136-site .g-mapsw--palats .g-mapview[data-map^="z-"] .g-mk--pf, .pw136-site .g-mapsw--palats .g-mapview[data-map^="z-"] .g-mk--pn { width: clamp(.9rem, 4.5cqi, 2.45rem); }
.pw136-site .g-mapsw--palats .g-mapview[data-map^="z-"] .g-mk--pr, .pw136-site .g-mapsw--palats .g-mapview[data-map^="z-"] .g-mk--pz { width: clamp(1rem, 5cqi, 2.7rem); }
.pw136-site .g-mapsw--palats .g-mapview[data-map^="z-"] .g-mk--pc { width: clamp(1.6rem, 8cqi, 4.4rem); }
@media (min-width: 1101px) {
  .pw136-site .g-hero--palats .g-hero-grid { grid-template-columns: minmax(0, 1fr) auto; }
  .pw136-site .g-mapsw--palats { width: clamp(30rem, calc((100svh - 18rem) * 1536 / 1597), 48rem); justify-self: end; }
  /* морда Чивеня — у просвіті між текстом і картою, яскраво (власник 23.10: «в центре… без затенения») */
  .pw136-site .g-hero--palats::before { left: 30%; opacity: .85; }
}
/* Одна міра кадрів, як у «Нападах»: кадр розділу завширшки з картку ряду (5, 3, 2 або 1 у ряд); у розділі з двома
   кадрами (Вхід, Склади) текст займає на колонку менше */
@media (min-width: 1101px) {
  .pw136-site .g-page--palats .g-head-media { grid-template-columns: repeat(5, minmax(0, 1fr)); column-gap: clamp(1rem, 1.6vw, 1.4rem); }
  .pw136-site .g-page--palats .g-head-media > .g-sec-head { grid-column: 1 / 5; }
  .pw136-site .g-page--palats .g-head-media--2 > .g-sec-head { grid-column: 1 / 4; }
}
@media (min-width: 761px) and (max-width: 1100px) {
  .pw136-site .g-page--palats .g-head-media { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: clamp(1rem, 1.6vw, 1.4rem); }
  .pw136-site .g-page--palats .g-head-media > .g-sec-head { grid-column: 1 / 3; }
  .pw136-site .g-page--palats .g-head-media--2 > .g-sec-head { grid-column: 1 / -1; }
  .pw136-site .g-page--palats .g-head-media .g-shot { margin-top: 0; }
  .pw136-site .g-page--palats .g-head-media--2 .g-shot { margin-top: 1.4rem; }
}
/* Три шляхи після Ключа (21.10.2026): підзаголовок у розділі Печатки й три колонки «що отримаєте» крупно */
.pw136-site .g-page--palats .g-sec-head--sub { margin-top: clamp(2.2rem, 4vw, 3rem); }
.pw136-site .g-page--palats .g-sec-head--sub h3 { font-size: 1.35rem; }
.pw136-site .g-page--palats .g-sec-head--sub .g-intro { margin-top: .5rem; }
.pw136-site .g-page--palats .g-routes { margin-top: 1.4rem; }
.pw136-site .g-page--palats .g-routes p { margin-top: .7rem; color: var(--muted); }
/* Справи вечора: значок предмета над заголовком кроку, у колонці тексту поруч із номером */
.pw136-site .g-steps--ico .g-step-ico { display: block; width: 2.75rem; height: 2.75rem; margin-bottom: .6rem; border-radius: 8px; }
/* Ім'я НІПа в тексті показує його печатку на карті (script.js, data-locate): слово тексту з пунктиром, а не кнопка */
.pw136-site .g-locate { padding: 0; border: 0; background: none; font: inherit; color: var(--text); text-decoration: underline dotted var(--accent-line); text-decoration-thickness: 1px; text-underline-offset: .22em; cursor: pointer; }
.pw136-site .g-locate:hover { color: var(--accent-hover); text-decoration-color: currentColor; }
@media (min-width: 521px) and (max-width: 760px) {
  .pw136-site .g-page--palats .g-head-media .g-shot { width: calc(50% - clamp(.5rem, .8vw, .7rem)); }
  .pw136-site .g-page--palats .g-head-media--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(1rem, 1.6vw, 1.4rem); }
  .pw136-site .g-page--palats .g-head-media--2 > .g-sec-head { grid-column: 1 / -1; }
  .pw136-site .g-page--palats .g-head-media--2 .g-shot { width: auto; }
}

/* «Руїни в хащах» (20.10.2026, за зразком «Нападів на міста» й «Палацу»). Шапка — портал виходу з Руїн фоном. Печатки
   21.10.2026 — свої знаки в стилі печатки НІПа карти Міста темних звірів (build_guide_ruiny.py): зал входу — стрілка
   в двері, вихід — стрілка з дверей, коло переходу — спіраль, вівтар повернення — стрілка назад, пастка — череп, Скарб
   Руїн — скриня в золоті; НІПи й вартові — готові знаки карти. Карта Руїн ширша, ніж висока (1600×1225). Печатки —
   7 % ширини карти, вихід і Шукач 4,5 %, вівтарі, пастки, Скарб і Мисливець по 3,5 % (пара в одному стовпчику біля
   правої стіни останнього залу), мітки переносу 2,6 %; не накривають одна одну на півсуму розмірів (check_guide_ruiny.py) */
.pw136-site .g-hero--ruiny::before { background-image: url('assets/guides/ruiny-v-khashchakh/hero-portal.webp'); background-position: 50% 45%; }
.pw136-site .g-mk--rin { background-image: url('assets/guides/ruiny-v-khashchakh/marks/rin.svg'); }
.pw136-site .g-mk--rout { background-image: url('assets/guides/ruiny-v-khashchakh/marks/rout.svg'); }
.pw136-site .g-mk--rn { background-image: url('assets/guides/ruiny-v-khashchakh/marks/rn.svg'); }
.pw136-site .g-mk--rch { z-index: 2; background-image: url('assets/guides/ruiny-v-khashchakh/marks/rch.svg'); }
.pw136-site .g-mk--rc { background-image: url('assets/guides/ruiny-v-khashchakh/marks/rc.svg'); }
.pw136-site .g-mk--ra { background-image: url('assets/guides/ruiny-v-khashchakh/marks/ra.svg'); }
.pw136-site .g-mk--rsk { background-image: url('assets/guides/ruiny-v-khashchakh/marks/rsk.svg'); }
.pw136-site .g-mk-ico--rin { background-image: url('assets/guides/ruiny-v-khashchakh/marks/rin.svg'); }
.pw136-site .g-mk-ico--rout { background-image: url('assets/guides/ruiny-v-khashchakh/marks/rout.svg'); }
.pw136-site .g-mk-ico--rn { background-image: url('assets/guides/ruiny-v-khashchakh/marks/rn.svg'); }
.pw136-site .g-mk-ico--rch { background-image: url('assets/guides/ruiny-v-khashchakh/marks/rch.svg'); }
.pw136-site .g-mk-ico--rc { background-image: url('assets/guides/ruiny-v-khashchakh/marks/rc.svg'); }
.pw136-site .g-mk-ico--ra { background-image: url('assets/guides/ruiny-v-khashchakh/marks/ra.svg'); }
.pw136-site .g-mk-ico--rsk { background-image: url('assets/guides/ruiny-v-khashchakh/marks/rsk.svg'); }
.pw136-site .g-mk-ico--rm { background-image: url('assets/guides/ruiny-v-khashchakh/marks/rm.svg'); }
.pw136-site .g-mk--rcd { background-image: url('assets/guides/ruiny-v-khashchakh/marks/rcd.svg'); }
.pw136-site .g-mk-ico--rcd { background-image: url('assets/guides/ruiny-v-khashchakh/marks/rcd.svg'); }
.pw136-site .g-mk--rad { background-image: url('assets/guides/ruiny-v-khashchakh/marks/rad.svg'); }
.pw136-site .g-mk-ico--rad { background-image: url('assets/guides/ruiny-v-khashchakh/marks/rad.svg'); }
/* Східне коло й його мітки — помаранчеві, західне — рожеві, спільна мітка навпіл (власник 21.10 ніч: «какой алтарь
   куда телепортирует, не наводясь») */
.pw136-site .g-mk--rce { background-image: url('assets/guides/ruiny-v-khashchakh/marks/rce.svg'); }
.pw136-site .g-mk-ico--rce { background-image: url('assets/guides/ruiny-v-khashchakh/marks/rce.svg'); }
.pw136-site .g-mk--rced { background-image: url('assets/guides/ruiny-v-khashchakh/marks/rced.svg'); }
.pw136-site .g-mk-ico--rced { background-image: url('assets/guides/ruiny-v-khashchakh/marks/rced.svg'); }
.pw136-site .g-mk--rcdb { background-image: url('assets/guides/ruiny-v-khashchakh/marks/rcdb.svg'); }
.pw136-site .g-mk-ico--rcdb { background-image: url('assets/guides/ruiny-v-khashchakh/marks/rcdb.svg'); }
/* у легенді пара знаків «перехід + куди переносить» стоїть впритул */
.pw136-site .g-wmap-key .g-mk-ico + .g-mk-ico { margin-left: -.15rem; }
.pw136-site .g-wmap--ruiny .g-wmap-box { container-type: inline-size; }
.pw136-site .g-wmap--ruiny .g-mk { width: clamp(1.4rem, 7cqi, 3.8rem); }
/* Вівтарі вдвічі менші за головні печатки; Скарб і Мисливець — як вівтарі, парою на підлозі останнього залу біля
   своїх точок (власник 21.10.2026: «сундук смещён куда-то в жопу мира», ніч: «размером как алтари»); вихід — у своїй
   малій кімнаті */
.pw136-site .g-wmap--ruiny .g-mk--ra { width: clamp(.7rem, 3.5cqi, 1.9rem); }
.pw136-site .g-wmap--ruiny .g-mk--near { width: clamp(.7rem, 3.5cqi, 1.9rem); }
.pw136-site .g-wmap--ruiny .g-mk--rout { width: clamp(.9rem, 4.5cqi, 2.45rem); }
/* Пастки вдвічі менші за головні, Шукач — як вихід (власник 21.10 вечір: «ловушки слишком большими… раза в два
   меньше», «шукач тоже слишком гигантский») */
.pw136-site .g-wmap--ruiny .g-mk--rsk { width: clamp(.7rem, 3.5cqi, 1.9rem); }
.pw136-site .g-wmap--ruiny .g-mk--mid { width: clamp(.9rem, 4.5cqi, 2.45rem); }
/* Куди переносять кола переходу й вівтарі — дрібні мітки (власник 21.10: «на карте указать точки, куда нас телепортируют») */
.pw136-site .g-wmap--ruiny .g-mk--rcd { width: clamp(.55rem, 2.6cqi, 1.45rem); }
.pw136-site .g-wmap--ruiny .g-mk--rad { width: clamp(.55rem, 2.6cqi, 1.45rem); }
.pw136-site .g-wmap--ruiny .g-mk--rced { width: clamp(.55rem, 2.6cqi, 1.45rem); }
.pw136-site .g-wmap--ruiny .g-mk--rcdb { width: clamp(.55rem, 2.6cqi, 1.45rem); }
/* Переходи й куди вони переносять — без вікна: підказка при наведенні каже, що це й куди переносить (власник 21.10
   вечір: «при нажатии ничего не должно открываться»); довга підказка переноситься, щоб не виходити за карту */
.pw136-site .g-mk--hint { cursor: default; }
.pw136-site .g-mk--hint:active { transform: translate(-50%, -50%) scale(1.22); }
.pw136-site .g-mk--hint .g-mk-tip { width: max-content; max-width: 13rem; white-space: normal; text-align: center; }
@media (min-width: 1101px) {
  .pw136-site .g-hero--ruiny .g-hero-grid { grid-template-columns: minmax(0, 1fr) auto; }
  .pw136-site .g-wmap--ruiny { width: clamp(30rem, calc((100svh - 18rem) * 1600 / 1225), 50rem); justify-self: end; }
}
/* Одна міра кадрів, як у «Нападах»: кадр розділу завширшки з картку ряду (5, 3, 2 або 1 у ряд); у розділі з двома
   кадрами (Термінове доручення) текст займає на колонку менше, як у «Палаці», з трьома (Переходи) — на дві */
@media (min-width: 1101px) {
  .pw136-site .g-page--ruiny .g-head-media { grid-template-columns: repeat(5, minmax(0, 1fr)); column-gap: clamp(1rem, 1.6vw, 1.4rem); }
  .pw136-site .g-page--ruiny .g-head-media > .g-sec-head { grid-column: 1 / 5; }
  .pw136-site .g-page--ruiny .g-head-media--2 > .g-sec-head { grid-column: 1 / 4; }
  .pw136-site .g-page--ruiny .g-head-media--3 > .g-sec-head { grid-column: 1 / 3; }
}
@media (min-width: 761px) and (max-width: 1100px) {
  .pw136-site .g-page--ruiny .g-head-media { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: clamp(1rem, 1.6vw, 1.4rem); }
  .pw136-site .g-page--ruiny .g-head-media > .g-sec-head { grid-column: 1 / 3; }
  .pw136-site .g-page--ruiny .g-head-media--2 > .g-sec-head, .pw136-site .g-page--ruiny .g-head-media--3 > .g-sec-head { grid-column: 1 / -1; }
  .pw136-site .g-page--ruiny .g-head-media .g-shot { margin-top: 0; }
  .pw136-site .g-page--ruiny .g-head-media--2 .g-shot, .pw136-site .g-page--ruiny .g-head-media--3 > .g-shot,
  .pw136-site .g-page--ruiny .g-head-media--ways .g-way { margin-top: 1.4rem; }
}
@media (min-width: 521px) and (max-width: 760px) {
  .pw136-site .g-page--ruiny .g-head-media .g-shot { width: calc(50% - clamp(.5rem, .8vw, .7rem)); }
  .pw136-site .g-page--ruiny .g-head-media--2, .pw136-site .g-page--ruiny .g-head-media--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(1rem, 1.6vw, 1.4rem); }
  .pw136-site .g-page--ruiny .g-head-media--2 > .g-sec-head, .pw136-site .g-page--ruiny .g-head-media--3 > .g-sec-head { grid-column: 1 / -1; }
  .pw136-site .g-page--ruiny .g-head-media--2 .g-shot, .pw136-site .g-page--ruiny .g-head-media--3 .g-shot { width: auto; }
  .pw136-site .g-page--ruiny .g-head-media--3 > .g-shot, .pw136-site .g-page--ruiny .g-head-media--ways .g-way { margin-top: 1.2rem; }
  .pw136-site .g-page--ruiny .g-head-media--ways { grid-template-columns: minmax(0, 1fr); }
}
/* Скрині на всю ширину (власник 21.10.2026: «разделить экран на три секции», а не притиснути таблиці ліворуч). У
   скрині з емблемою один рядок, тож вона йде широкою смугою зверху (назва, рядок, примітка поруч), під нею два довгі
   списки в дві колонки — без порожньої колонки (21.10 ніч: «огромное количество пустого пространства») */
.pw136-site .g-chests { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(1rem, 1.6vw, 1.4rem); align-items: start; margin-top: clamp(1.6rem, 3vw, 2.2rem); }
.pw136-site .g-chest--emblem { grid-column: 1 / -1; }
.pw136-site .g-chest--emblem .g-rewards { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr) minmax(0, 1fr); align-items: center; }
.pw136-site .g-chest--emblem .g-rewards-head { border-bottom: 0; }
.pw136-site .g-chest--emblem .g-rw { border-top: 0; }
.pw136-site .g-chest--emblem .g-rewards-foot { margin: 0; padding: .8rem 1.1rem; }
/* довгі списки скринь — рядки у дві колонки: короткі назви не лишають пустоти праворуч і блок удвічі нижчий */
.pw136-site .g-chest:not(.g-chest--emblem) .g-rewards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pw136-site .g-chest:not(.g-chest--emblem) .g-rewards-head { grid-column: 1 / -1; }
@media (max-width: 600px) {
  .pw136-site .g-chest:not(.g-chest--emblem) .g-rewards { grid-template-columns: minmax(0, 1fr); }
}
.pw136-site .g-chest { min-width: 0; }
.pw136-site .g-chest .g-shot { margin: 0 0 1rem; }
.pw136-site .g-chest .g-rewards { margin-top: 0; }
.pw136-site .g-chest .g-rewards-head { display: block; }
.pw136-site .g-chest .g-rewards-head p { margin-top: .25rem; }
.pw136-site .g-chest .g-rw { grid-template-columns: 2.6rem minmax(0, 1fr); gap: .9rem; padding: .8rem 1.1rem; }
@media (max-width: 1100px) {
  .pw136-site .g-chests { grid-template-columns: minmax(0, 1fr); }
  .pw136-site .g-chest--emblem .g-rewards { display: block; }
}
/* Вміст Скарбу — під текстом розділу, поруч із кадром, а не окремою смугою на всю ширину з порожнечею праворуч */
.pw136-site .g-rewards--prize { margin-top: 1.6rem; }
/* Переходи й пастки — три картки в ряд із текстом розділу, кадр однієї мірки з рештою сторінки: кадр (без вікна —
   переходи вікон не мають, пастки відкриваються печатками на карті), під ним знак, назва, скільки, що робить */
.pw136-site .g-head-media--ways { align-items: start; }
.pw136-site .g-way { min-width: 0; }
.pw136-site .g-way .g-shot { width: auto; margin: 0; }
.pw136-site .g-way-body { display: grid; grid-template-columns: 2.2rem minmax(0, 1fr); gap: .8rem; margin-top: .9rem; }
.pw136-site .g-way .g-mk-ico { width: 2.2rem; height: 2.2rem; }
.pw136-site .g-way h3 { font-size: 1.05rem; }
.pw136-site .g-way .g-way-n { margin-top: .15rem; color: var(--accent); font: 600 .86rem/1.3 var(--heading); }
.pw136-site .g-way p:not(.g-way-n) { margin-top: .45rem; color: var(--muted); font-size: .9rem; line-height: 1.5; }
/* Досвід доручення: рівень × час. До 760 px таблиця складається в стовпчик (загальне правило .g-rooms):
   рівень ліворуч, праворуч п'ять рядків «до 4 хв … 164 000» з підписом .g-t-lbl замість шапки */
.pw136-site .g-table--ruiny { overflow-x: auto; }
.pw136-site .g-rooms--ruiny th, .pw136-site .g-rooms--ruiny td { white-space: nowrap; font-variant-numeric: tabular-nums; }
.pw136-site .g-rooms--ruiny tbody th { color: var(--text); font: 600 .95rem/1.4 var(--heading); }
.pw136-site .g-rooms--ruiny tbody td:nth-child(2) { color: var(--text); }
.pw136-site .g-rooms--ruiny .g-t-lbl { display: none; }
@media (max-width: 760px) {
  .pw136-site .g-rooms--ruiny tr { grid-template-columns: 3.6rem minmax(0, 1fr); }
  .pw136-site .g-rooms--ruiny tbody th { grid-row: 1 / span 5; }
  .pw136-site .g-rooms--ruiny td { display: flex; justify-content: space-between; gap: 1rem; }
  .pw136-site .g-rooms--ruiny .g-t-lbl { display: inline; color: var(--soft); }
}

/* «Про сервер», квестові підземелля, 20.10.2026: клік по кадру картки відкриває вікно з картою підземелля рівня
   (script.js, дані tools/wp/build_dungeon_maps.py). Печатки — ті самі знаки, що на великій карті гри (вид за рангом
   боса: синя, червона, фіолетова, бурштинова прихованого), сторона 4,2 % ширини карти, при показі розгоряються з 0,4
   за 400 мс (nodeIgnite гри), під курсором ростуть до 1,22 за 150 мс; підпис — як рідні підписи карт гри (Times
   New Roman Bold, коричневий з кремовим ореолом). Сторінка задана в px, а вікно — в em свого кореня, що росте з
   екраном, як посібники: 15 px на телефоні, 24 px на 4K. */
.pw136-site .quest-map-open { position: relative; display: block; width: 100%; padding: 0; border: 0; border-bottom: 1px solid rgb(255 122 26 / .2); background: #0b0a09; overflow: hidden; cursor: pointer; }
.pw136-site .quest-map-open img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; transition: transform 400ms cubic-bezier(.16, 1, .3, 1), filter 200ms ease; }
.pw136-site .quest-map-open:hover img, .pw136-site .quest-map-open:focus-visible img { transform: scale(1.03); filter: brightness(1.08); }
.pw136-site .quest-map-open:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.pw136-site .quest-map-cta { position: absolute; left: 12px; bottom: 12px; display: inline-flex; align-items: center; gap: 8px; padding: 6px 14px 6px 8px; border: 1px solid rgb(255 122 26 / .45); border-radius: 999px; background: rgb(12 9 6 / .8); color: #fff1cf; font: 600 13px/1.2 var(--heading); backdrop-filter: blur(4px); transition: border-color 150ms cubic-bezier(.4, 0, .2, 1), background 150ms cubic-bezier(.4, 0, .2, 1); }
.pw136-site .quest-map-cta .g-mk-ico { width: 22px; height: 22px; }
.pw136-site .quest-map-open:hover .quest-map-cta, .pw136-site .quest-map-open:focus-visible .quest-map-cta { border-color: var(--accent); background: rgb(38 20 8 / .92); }
@media (min-width: 601px) and (max-width: 1024px) {
  .pw136-site .quest-map-open { height: 100%; border-bottom: 0; border-right: 1px solid rgb(255 122 26 / .2); }
  .pw136-site .quest-map-open img { height: 100%; }
}
.pw136-site .g-mk-ico--h { background-image: url('assets/guides/svitovi-bosy/marks/boss_h.svg'); }

html.dmap-open { overflow: hidden; }
html:has(.dmap) { scrollbar-gutter: stable; }
.pw136-site .dmap { position: fixed; inset: 0; z-index: 200; display: grid; place-items: center; padding: 16px; background: rgb(var(--shade) / .8); backdrop-filter: blur(6px); font-size: clamp(15px, calc(9.5px + .38vw), 24px); }
.pw136-site .dmap-win { display: grid; grid-template-rows: auto minmax(0, 1fr); width: min(100%, 100em); height: min(100%, 62em); overflow: hidden; border: 1px solid var(--line-strong); border-radius: 14px; background: var(--surface); box-shadow: 0 24px 64px rgb(0 0 0 / .6); }
.pw136-site .dmap-win:focus-visible { outline: none; }
.pw136-site .dmap-head { display: flex; align-items: center; gap: 1.2em; padding: .75em .9em .75em 1.4em; border-bottom: 1px solid var(--line); }
.pw136-site .dmap-title { margin: 0; font-size: 1.15em; white-space: nowrap; }
.pw136-site .dmap-levels { display: flex; flex-wrap: wrap; gap: .4em; margin-left: auto; }
.pw136-site .dmap-levels button { min-width: 3em; min-height: 2.4em; padding: .5em; border: 1px solid rgb(255 122 26 / .25); border-radius: 8px; background: rgb(0 0 0 / .3); color: var(--accent); font: 700 .95em/1 var(--heading); cursor: pointer; transition: background 150ms cubic-bezier(.4, 0, .2, 1), border-color 150ms cubic-bezier(.4, 0, .2, 1), color 150ms cubic-bezier(.4, 0, .2, 1); }
.pw136-site .dmap-levels button:hover { border-color: rgb(255 122 26 / .6); background: rgb(255 122 26 / .12); }
.pw136-site .dmap-levels button[aria-pressed="true"] { border-color: #ff9a4a; background: linear-gradient(135deg, #ff9a45 0%, var(--accent) 55%, #ee6a10 100%); color: var(--accent-ink); box-shadow: inset 0 1px 0 rgb(255 255 255 / .2); }
.pw136-site .dmap-close { position: static; flex: none; width: 2.3em; height: 2.3em; }
.pw136-site .dmap-body { display: grid; grid-template-columns: minmax(0, 1fr) clamp(19em, 24vw, 25em); min-height: 0; }
.pw136-site .dmap-stage { display: flex; flex-direction: column; gap: .8em; min-width: 0; min-height: 0; padding: 1em 1.2em 1.2em; background: radial-gradient(90% 70% at 50% 45%, rgb(255 140 60 / .05), transparent 70%); }
.pw136-site .dmap-tabs { display: flex; flex-wrap: wrap; justify-content: center; gap: .45em; }
.pw136-site .dmap-tabs button { padding: .5em 1em; border: 1px solid var(--line-strong); border-radius: 999px; background: rgb(0 0 0 / .25); color: var(--muted); font: 600 .9em/1.2 var(--heading); cursor: pointer; transition: border-color 150ms cubic-bezier(.4, 0, .2, 1), color 150ms cubic-bezier(.4, 0, .2, 1), background 150ms cubic-bezier(.4, 0, .2, 1); }
.pw136-site .dmap-tabs button:hover { border-color: rgb(255 122 26 / .5); color: var(--text); }
.pw136-site .dmap-tabs button[aria-pressed="true"] { border-color: var(--accent-line); background: var(--accent-soft); color: var(--text); }
.pw136-site .dmap-box { flex: 1; display: grid; place-items: center; min-height: 0; container-type: size; }
.pw136-site .dmap-map { position: relative; width: min(100cqw, 133.33cqh); aspect-ratio: 4 / 3; container-type: inline-size; }
.pw136-site .dmap-img { display: block; width: 100%; height: 100%; border-radius: 10px; background: #17120e; box-shadow: 0 0 0 1px rgb(255 170 100 / .14), 0 18px 44px rgb(0 0 0 / .55); }
.pw136-site .dmap-layer { position: absolute; inset: 0; }
.pw136-site .dmap-map.is-wait .dmap-layer { visibility: hidden; }
.pw136-site .dmap-mk, .pw136-site .dmap-lbl { --side: max(calc(var(--s) * 100cqi), 22px); position: absolute; left: calc(var(--u) * 100%); top: calc(var(--v) * 100%); }
.pw136-site .dmap-mk { width: var(--side); aspect-ratio: 1; padding: 0; border: 0; background: url('assets/guides/svitovi-bosy/marks/boss_e.svg') center / contain no-repeat; translate: -50% -50%; cursor: pointer; transition: scale 150ms cubic-bezier(.4, 0, .2, 1); }
.pw136-site .dmap-mk--s { background-image: url('assets/guides/svitovi-bosy/marks/boss_s.svg'); }
.pw136-site .dmap-mk--w { background-image: url('assets/guides/svitovi-bosy/marks/boss_w.svg'); }
.pw136-site .dmap-mk--h { background-image: url('assets/guides/svitovi-bosy/marks/boss_h.svg'); }
.pw136-site .dmap-mk:hover, .pw136-site .dmap-mk:focus-visible, .pw136-site .dmap-mk.is-hot { z-index: 4; scale: 1.22; outline: none; }
.pw136-site .dmap-mk.is-picked { z-index: 2; }
.pw136-site .dmap-lbl { z-index: 3; width: max-content; max-width: 7.22em; color: rgb(100 64 6); font: 700 max(1.76cqi, 9px)/1.06 'Times New Roman', Times, serif; text-align: center; text-shadow: 0 0 .05em rgb(238 226 186), 0 0 .1em rgb(238 226 186), 0 0 .14em rgb(238 226 186), 0 0 .2em rgb(238 226 186 / .85); pointer-events: none; }
.pw136-site .dmap-lbl--b { translate: -50% calc(var(--side) * .47); }
.pw136-site .dmap-lbl--t { translate: -50% calc(-100% - var(--side) * .47); }
.pw136-site .dmap-lbl--r { translate: calc(var(--side) * .47) -50%; }
.pw136-site .dmap-lbl--l { translate: calc(-100% - var(--side) * .47) -50%; }
@keyframes dmap-ignite { from { scale: .4; } }
@keyframes dmap-fade { from { opacity: 0; } }
.pw136-site .dmap-map.is-in .dmap-mk { animation: dmap-ignite 400ms cubic-bezier(.16, 1, .3, 1) backwards; }
.pw136-site .dmap-map.is-in .dmap-lbl { animation: dmap-fade 400ms ease-out backwards; }
.pw136-site .dmap-tip { position: absolute; left: 50%; bottom: calc(100% + .35em); display: none; padding: .4em .7em; border: 1px solid var(--line-strong); border-radius: 8px; background: rgb(12 9 6 / .95); color: var(--text); font: 600 .82em/1.25 var(--heading); text-align: center; white-space: nowrap; translate: -50% 0; scale: .82; transform-origin: 50% 100%; box-shadow: 0 6px 18px rgb(0 0 0 / .45); pointer-events: none; }
.pw136-site .dmap-tip small { display: block; color: var(--soft); font-size: .88em; font-weight: 400; }
.pw136-site .dmap-mk:hover .dmap-tip, .pw136-site .dmap-mk:focus-visible .dmap-tip, .pw136-site .dmap-mk.is-hot .dmap-tip { display: block; }
.pw136-site .dmap-side { min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 1.2em 1.3em 1.4em; border-left: 1px solid var(--line); background: linear-gradient(180deg, #17120e, #110e0c); scrollbar-width: thin; scrollbar-color: var(--line-strong) transparent; }
.pw136-site .dmap-name { margin: 0 0 .7em; font-size: 1.2em; }
.pw136-site .dmap-bosses { margin: 0; padding: 0; list-style: none; }
.pw136-site .dmap-bosses li + li { border-top: 1px solid var(--line); }
.pw136-site .dmap-bosses button { display: grid; grid-template-columns: 2.1em minmax(0, 1fr) auto; align-items: center; gap: .75em; width: 100%; padding: .6em .5em; border: 0; border-radius: 8px; background: none; color: var(--text); text-align: left; cursor: pointer; transition: background 150ms cubic-bezier(.4, 0, .2, 1); }
.pw136-site .dmap-bosses button::after { content: '›'; color: var(--soft); font-size: 1.3em; line-height: 1; transition: color 150ms cubic-bezier(.4, 0, .2, 1); }
.pw136-site .dmap-bosses button:hover, .pw136-site .dmap-bosses button.is-hot { background: rgb(255 122 26 / .08); }
.pw136-site .dmap-bosses button:hover::after, .pw136-site .dmap-bosses button.is-hot::after { color: var(--accent); }
.pw136-site .dmap-bosses .g-mk-ico { width: 2.1em; height: 2.1em; }
.pw136-site .dmap-bosses strong { display: block; font: 600 .95em/1.3 var(--heading); }
.pw136-site .dmap-bosses small { display: block; color: var(--soft); font-size: .8em; line-height: 1.35; }
.pw136-site .dmap-hint { margin: 1em 0 0; color: var(--soft); font-size: .84em; line-height: 1.45; }
.pw136-site .dmap-fail { margin: 1em 0 0; color: #ffb38a; font-size: .9em; }
.pw136-site .dmap-back { display: inline-flex; align-items: center; gap: .45em; margin: 0 0 1em; padding: 0; border: 0; background: none; color: var(--accent); font: 600 .88em/1.2 var(--heading); cursor: pointer; transition: color 150ms cubic-bezier(.4, 0, .2, 1); }
.pw136-site .dmap-back::before { content: '←'; }
.pw136-site .dmap-back:hover { color: var(--accent-hover); }
.pw136-site .dmap-bhead { display: flex; align-items: center; gap: .75em; }
.pw136-site .dmap-bhead .g-mk-ico { width: 2.6em; height: 2.6em; }
.pw136-site .dmap-bname { margin: 0; font-size: 1.3em; line-height: 1.2; }
.pw136-site .dmap-bnote { margin: .8em 0 0; padding: .55em .8em; border-left: 2px solid #e2a23a; border-radius: 0 6px 6px 0; background: rgb(242 177 58 / .08); color: var(--body); font-size: .86em; line-height: 1.45; }
/* Підземелля 109 (05.11.2026): одна копія на день — над списком босів правилом, у картці боса одним рядком; той самий
   бурштиновий знак, що підказка боса */
.pw136-site .dmap-daily { margin: 0 0 1em; padding: .7em .9em .75em; border-left: 2px solid #e2a23a; border-radius: 0 8px 8px 0; background: rgb(242 177 58 / .08); color: var(--body); font-size: .86em; line-height: 1.45; }
.pw136-site .dmap-daily h4 { margin: 0 0 .35em; color: #f2c46a; font: 700 1.02em/1.3 var(--heading); }
.pw136-site .dmap-daily p { margin: 0; }
.pw136-site .dmap-daily ul { display: grid; gap: .35em; margin: .55em 0 0; padding: 0; list-style: none; }
.pw136-site .dmap-daily li { position: relative; padding-left: 1em; }
.pw136-site .dmap-daily li::before { content: ''; position: absolute; left: .1em; top: .62em; width: .36em; height: .36em; rotate: 45deg; background: #e2a23a; }
.pw136-site .dmap-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 1em 0 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.pw136-site .dmap-facts div { padding: .6em .9em .6em 0; }
.pw136-site .dmap-facts div + div { padding-left: .9em; border-left: 1px solid var(--line); }
.pw136-site .dmap-facts dt { color: var(--soft); font-size: .78em; line-height: 1.3; }
.pw136-site .dmap-facts dd { margin: .2em 0 0; color: var(--text); font: 600 .92em/1.35 var(--heading); font-variant-numeric: tabular-nums; }
.pw136-site .dmap-dtabs { display: flex; gap: .4em; margin-top: 1.1em; }
.pw136-site .dmap-dtabs button { display: inline-flex; align-items: center; gap: .45em; padding: .45em .9em; border: 1px solid var(--line-strong); border-radius: 999px; background: none; color: var(--muted); font: 600 .86em/1.2 var(--heading); cursor: pointer; transition: border-color 150ms cubic-bezier(.4, 0, .2, 1), color 150ms cubic-bezier(.4, 0, .2, 1), background 150ms cubic-bezier(.4, 0, .2, 1); }
.pw136-site .dmap-dtabs button:hover { border-color: rgb(255 122 26 / .5); color: var(--text); }
.pw136-site .dmap-dtabs button[aria-pressed="true"] { border-color: var(--accent-line); background: var(--accent-soft); color: var(--text); }
.pw136-site .dmap-dtabs b { color: var(--soft); font-weight: 600; }
.pw136-site .dmap-note { margin: .9em 0 .15em; color: var(--soft); font-size: .8em; line-height: 1.4; }
.pw136-site .dmap-drops { margin: 0; padding: 0; list-style: none; }
.pw136-site .dmap-drops li { display: grid; grid-template-columns: 2.4em minmax(0, 1fr) auto; align-items: center; gap: .75em; padding: .5em 0; border-top: 1px solid var(--line); }
.pw136-site .dmap-drops li:first-child { border-top: 0; }
.pw136-site .dmap-drops img { display: block; width: 2.4em; height: 2.4em; border-radius: 8px; }
.pw136-site .dmap-drops span { color: var(--text); font: 600 .9em/1.3 var(--heading); }
.pw136-site .dmap-drops b { color: var(--accent-hover); font: 700 .9em/1 var(--heading); font-variant-numeric: tabular-nums; }
.pw136-site .dmap-drops .is-rare b { color: var(--soft); font-weight: 600; }
.pw136-site .dmap-drops li { margin: 0 -.5em; padding-inline: .5em; border-radius: 8px; cursor: help; transition: background 150ms cubic-bezier(.4, 0, .2, 1); }
.pw136-site .dmap-drops li:hover, .pw136-site .dmap-drops li:focus-visible { background: rgb(255 122 26 / .07); outline: none; }
/* Підказка предмета — текст вікна предмета гри з його кольорами, у класичній темній рамці сайту (як підказка
   торгового майданчика кабінету Genesis): шрифт росте з екраном, як вікно карт; лежить над вікном карт. */
.pw136-site .dmap-itip { position: fixed; z-index: 260; left: 0; top: 0; width: max-content; max-width: min(23em, calc(100vw - 16px)); padding: .7em .9em .75em; border: 1px solid rgb(212 164 86 / .5); border-radius: 8px; background: rgb(10 8 6 / .97); box-shadow: 0 12px 32px rgb(0 0 0 / .65), inset 0 1px 0 rgb(255 220 160 / .06); color: #fff; font: 400 clamp(13px, calc(8.7px + .27vw), 19px)/1.45 var(--font); overflow-wrap: anywhere; pointer-events: none; }
.pw136-site .dmap-itip-name { margin-bottom: .15em; font-size: 1.08em; font-weight: 700; }
.pw136-site .dmap-itip-gap { height: .55em; }
@media (max-width: 860px) {
  .pw136-site .dmap { padding: 0; }
  .pw136-site .dmap-win { display: block; width: 100%; height: 100%; overflow-y: auto; overscroll-behavior: contain; border: 0; border-radius: 0; }
  .pw136-site .dmap-head { position: sticky; top: 0; z-index: 6; flex-wrap: wrap; gap: .7em; padding: .7em 16px; background: var(--surface); }
  .pw136-site .dmap-title { flex: 1; font-size: 1.05em; }
  .pw136-site .dmap-levels { order: 3; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); width: 100%; margin: 0; }
  .pw136-site .dmap-levels button { min-width: 0; }
  /* вікно Храму Сутінків: у шапці лише «Соло» й «Група» — навпіл */
  .pw136-site .dmap--tt .dmap-levels { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pw136-site .dmap-body { display: block; }
  .pw136-site .dmap-stage { padding: .9em 16px; }
  .pw136-site .dmap-box { display: block; container-type: normal; }
  .pw136-site .dmap-map { width: 100%; }
  .pw136-site .dmap-side { overflow: visible; padding: 1em 16px 1.6em; border-top: 1px solid var(--line); border-left: 0; scroll-margin-top: 8.5em; }
}
@media (prefers-reduced-motion: reduce) {
  .pw136-site .dmap-map.is-in .dmap-mk, .pw136-site .dmap-map.is-in .dmap-lbl { animation: none; }
  .pw136-site .quest-map-open:hover img, .pw136-site .quest-map-open:focus-visible img { transform: none; }
}

/* «Храм Сутінків», 20.10.2026 (tools/wp/build_guide_khram.py, за зразком «Нападів на міста»). Шапка — брама обителі
   мук фоном (кадрів босів не знімаємо), праворуч карта Храму 4:3 з печатками того вибору «режим + стовп», що обрано
   ліворуч під фактами, як на великій карті гри. Печатки — ті самі фіолетові знаки босів, 7 % ширини карти (розкладка тісних — у збирачі, ширина — у style).
   Перемикач — пігулки «Соло / Група» і сітка 3 x 3 стовпів з рівнями; одна мірка кадрів, як у «Нападах» */
.pw136-site .g-hero--khram::before { background-image: url('assets/guides/khram-sutinkiv/hero-gate.webp'); background-position: 50% 40%; }
@media (min-width: 1101px) {
  .pw136-site .g-hero--khram .g-hero-grid { grid-template-columns: minmax(0, 1fr) auto; }
  /* брама — між текстом і картою, а не під текстом (21.10: «фон на текст залазит»); перемикач стовпів ліворуч під
     фактами, тож карта займає всю висоту шапки й ліворуч знизу не пусто */
  .pw136-site .g-hero--khram::before { left: 26%; width: min(31%, 44rem); opacity: .62; }
  .pw136-site .g-hero--khram .g-facts { max-width: 40rem; }
  .pw136-site .g-mapsw--tt { width: clamp(32rem, calc((100svh - 15rem) * 4 / 3), 58rem); justify-self: end; }
}
/* до 2200 px просвіту між текстом і картою немає: сяйво брами лягало під факти, «21 сімейство» не читалося (аудит
   26.10: контраст 1,6 uk і 1,2 en на 1920) — брама закінчується над рядом фактів, на 2560 шапка як була */
@media (min-width: 1101px) and (max-width: 2199px) {
  .pw136-site .g-hero--khram::before { bottom: 35%; }
}
.pw136-site .g-mk--tt { z-index: 1; background-image: url('assets/guides/svitovi-bosy/marks/boss_w.svg'); }
.pw136-site .g-tt-key { display: grid; gap: .55rem; max-width: 34rem; margin-top: 1.8rem; }
.pw136-site .g-tt-modes { display: flex; gap: .45rem; }
.pw136-site .g-tt-grid { display: grid; gap: .35rem; }
.pw136-site .g-tt-row { display: grid; grid-template-columns: 4.6rem repeat(3, minmax(0, 1fr)); gap: .35rem; align-items: center; }
.pw136-site .g-tt-key .g-tt-zone { color: var(--soft); font: 600 .82rem/1.2 var(--heading); }
.pw136-site .g-tt-modes button, .pw136-site .g-tt-grid button { display: inline-flex; align-items: baseline; justify-content: center; gap: .45rem; padding: .42rem .9rem; border: 1px solid var(--line-strong); border-radius: 999px; background: transparent; color: var(--body); font: 600 .9rem/1.1 var(--heading); cursor: pointer; transition: border-color 150ms ease, color 150ms ease, background-color 150ms ease; }
.pw136-site .g-tt-modes button { min-width: 6.5rem; }
.pw136-site .g-tt-grid button { border-radius: 10px; padding-inline: .5rem; }
.pw136-site .g-tt-grid button small { color: var(--soft); font: 400 .78rem/1 var(--font); }
.pw136-site .g-tt-modes button:hover, .pw136-site .g-tt-grid button:hover { border-color: var(--accent-line); color: var(--text); }
.pw136-site .g-tt-modes button[aria-selected="true"], .pw136-site .g-tt-grid button[aria-selected="true"] { border-color: var(--accent-line); background: var(--accent-soft); color: var(--text); }
.pw136-site .g-tt-grid button[aria-selected="true"] small { color: var(--body); }
.pw136-site .g-tt-modes button:focus-visible, .pw136-site .g-tt-grid button:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
/* Одна мірка кадрів: кадр розділу завширшки з картку ряду (5 у ряд), два кадри — дві клітинки */
@media (min-width: 1101px) {
  .pw136-site .g-page--khram .g-head-media { grid-template-columns: repeat(5, minmax(0, 1fr)); column-gap: clamp(1rem, 1.6vw, 1.4rem); }
  .pw136-site .g-page--khram .g-head-media > .g-sec-head { grid-column: 1 / 5; }
  .pw136-site .g-page--khram .g-head-media--2 > .g-sec-head { grid-column: 1 / 4; }
}
@media (min-width: 761px) and (max-width: 1100px) {
  .pw136-site .g-page--khram .g-head-media { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: clamp(1rem, 1.6vw, 1.4rem); }
  .pw136-site .g-page--khram .g-head-media > .g-sec-head { grid-column: 1 / 3; }
  .pw136-site .g-page--khram .g-head-media--2 > .g-sec-head { grid-column: 1 / -1; }
  .pw136-site .g-page--khram .g-head-media .g-shot { margin-top: 0; }
  .pw136-site .g-page--khram .g-head-media--2 .g-shot { margin-top: 1.4rem; }
}
@media (min-width: 521px) and (max-width: 760px) {
  .pw136-site .g-page--khram .g-head-media .g-shot { width: calc(50% - clamp(.5rem, .8vw, .7rem)); }
  .pw136-site .g-page--khram .g-head-media--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(1rem, 1.6vw, 1.4rem); }
  .pw136-site .g-page--khram .g-head-media--2 > .g-sec-head { grid-column: 1 / -1; }
  .pw136-site .g-page--khram .g-head-media--2 .g-shot { width: auto; }
}
.pw136-site .g-timeline--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
/* Кадр кроку запуску — не кнопка: та сама рамка, що в картки, але на наведення не відповідає (стандарт наведення) */
.pw136-site .g-bcard-pic { margin: 0; overflow: hidden; border: 1px solid var(--line-strong); border-radius: 10px; background: #0d0b09; }
.pw136-site .g-bcard-pic img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; }
.pw136-site .g-tt-n { display: grid; flex: none; place-items: center; width: 1.6rem; height: 1.6rem; border: 1px solid var(--accent-line); border-radius: 50%; background: var(--accent-soft); color: var(--accent); font: 600 .82rem/1 var(--heading); }

/* «Місто Інею», 26.10.2026 (tools/wp/build_guide_inei.py, за зразком «Храму Сутінків»). Шапка — коридор міста фоном,
   праворуч карта міста 4:3 без підписів залів. Печатки: боси шляху червоні, фінальний Дух снігу й льоду фіолетовий
   (7 % ширини), побічна Крижана принцеса синя (4,2 %), НІПи круглі (4,5 %), Стражі дверей — дрібні бурштинові (3 %), місця
   переносу — дрібні мітки (2,6 %) без вікна; розміри — у style печатки */
.pw136-site .g-hero--inei::before { background-image: url('assets/guides/misto-ineyu/hero-hall.webp'); background-position: 50% 45%; }
@media (min-width: 1101px) {
  .pw136-site .g-hero--inei .g-hero-grid { grid-template-columns: minmax(0, 1fr) auto; }
  .pw136-site .g-hero--inei::before { left: 26%; width: min(31%, 44rem); opacity: .62; }
  .pw136-site .g-hero--inei .g-facts { max-width: 40rem; }
  .pw136-site .g-mapsw--inei { width: clamp(32rem, calc((100svh - 15rem) * 4 / 3), 58rem); justify-self: end; }
}
.pw136-site .g-mk--ig { background-image: url('assets/guides/svitovi-bosy/marks/boss_h.svg'); }
.pw136-site .g-mk-ico--ig { background-image: url('assets/guides/svitovi-bosy/marks/boss_h.svg'); }
/* Приближення залів (поправки власника 26.10.2026: окремі лупи, морозна рамка довкола й срібна кромка — «синяя
   обводка на синем фоне теряется»; як у «Щоденних» — звичайна печатка, курсор-лупа й клік наближає): печатка боса
   зали — той самий ромб у тонкій янтарній обводці по його краю (zza_e/s/w), тепла лінія видна й на голубій підлозі,
   й на пергаменті. Змінена картинка — під новим ім'ям: сайт дозволяє браузеру тримати її 30 днів, і срібні zz_*
   під тим самим ім'ям власник бачив і після заміни; там у печатки кружок
   з номером черги (g-mk-n), а рядок порядку (g-zcap) на нижньому краї картинки: хто з'являється після бою й куди
   переносить. Місце переносу кожного НІПа — свій колір (rcd, rced, rcdg) */
.pw136-site .g-mk--zz { background-image: url('assets/guides/misto-ineyu/marks/zza_e.svg'); }
.pw136-site .g-mk--s.g-mk--zz { background-image: url('assets/guides/misto-ineyu/marks/zza_s.svg'); }
.pw136-site .g-mk--w.g-mk--zz { background-image: url('assets/guides/misto-ineyu/marks/zza_w.svg'); }
/* підказки місць (перенос, вихід, Страж) — одним рядком; на телефоні переносяться, щоб не вийти за екран */
@media (min-width: 521px) {
  .pw136-site .g-mapsw--inei .g-mk--hint .g-mk-tip { max-width: none; white-space: nowrap; }
}
.pw136-site .g-mk--rcdg { background-image: url('assets/guides/misto-ineyu/marks/rcdg.svg'); }
.pw136-site .g-mk-n { position: absolute; left: -8%; top: -8%; display: grid; place-items: center; width: 42%; min-width: 1.05rem; aspect-ratio: 1; border: 2px solid #d9a441; border-radius: 50%; background: #1c1410; color: #f3d27a; font: 700 clamp(.6rem, 1.6cqi, .8rem)/1 var(--font); box-shadow: 0 1px 3px rgb(0 0 0 / .6); pointer-events: none; }
.pw136-site .g-zcap { position: absolute; left: 1.5%; right: 1.5%; bottom: 2%; z-index: 5; display: flex; flex-wrap: wrap; gap: .25rem 1.1rem; margin: 0; padding: .45rem .75rem; list-style: none; border: 1px solid rgb(217 164 65 / .35); border-radius: 10px; background: rgb(14 10 7 / .86); color: #f2e6cc; font: 400 clamp(.68rem, 1.7cqi, .88rem)/1.3 var(--font); pointer-events: none; }
.pw136-site .g-zcap li { display: flex; align-items: baseline; gap: .4rem; }
.pw136-site .g-zcap b { flex: none; display: inline-grid; place-items: center; width: 1.4em; height: 1.4em; border: 1.5px solid #d9a441; border-radius: 50%; color: #f3d27a; font-size: .88em; font-weight: 700; }
.pw136-site .g-craft-tag--f { border-color: rgb(196 223 255 / .45); background: rgb(196 223 255 / .08); color: #d6e7fb; }
@media (min-width: 1101px) {
  .pw136-site .g-page--inei .g-head-media { grid-template-columns: repeat(5, minmax(0, 1fr)); column-gap: clamp(1rem, 1.6vw, 1.4rem); }
  .pw136-site .g-page--inei .g-head-media > .g-sec-head { grid-column: 1 / 5; }
  .pw136-site .g-page--inei .g-head-media--2 > .g-sec-head { grid-column: 1 / 4; }
}
@media (min-width: 761px) and (max-width: 1100px) {
  .pw136-site .g-page--inei .g-head-media { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: clamp(1rem, 1.6vw, 1.4rem); }
  .pw136-site .g-page--inei .g-head-media > .g-sec-head { grid-column: 1 / 3; }
  .pw136-site .g-page--inei .g-head-media--2 > .g-sec-head { grid-column: 1 / -1; }
  .pw136-site .g-page--inei .g-head-media .g-shot { margin-top: 0; }
  .pw136-site .g-page--inei .g-head-media--2 .g-shot { margin-top: 1.4rem; }
}
@media (min-width: 521px) and (max-width: 760px) {
  .pw136-site .g-page--inei .g-head-media .g-shot { width: calc(50% - clamp(.5rem, .8vw, .7rem)); }
  .pw136-site .g-page--inei .g-head-media--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(1rem, 1.6vw, 1.4rem); }
  .pw136-site .g-page--inei .g-head-media--2 > .g-sec-head { grid-column: 1 / -1; }
  .pw136-site .g-page--inei .g-head-media--2 .g-shot { width: auto; }
}
.pw136-site .g-inei-cards { margin-top: clamp(2rem, 4vw, 3rem); }
/* Список коротких рядків (Серце льоду з 9 босів, уся здобич Духу снігу й льоду) — щільною сіткою в 3 колонки, число
   одразу за ім'ям (власник 26.10: «пододвинуть всё поближе… без больших пустых пробелов»); на планшеті 2.
   Пояснення рядка (звідки знак) — у третій колонці, а не вузьким стовпчиком під назвою */
.pw136-site .g-rw-note { margin: 0; color: var(--muted); }
.pw136-site .g-rewards--fin { margin-top: clamp(1rem, 2vw, 1.4rem); }
.pw136-site .g-rewards--fin .g-rewards-head h3 { display: flex; align-items: center; gap: .7rem; }
.pw136-site .g-rewards-head h3 .g-head-icon { flex: none; width: 2.1rem; height: 2.1rem; }
@media (min-width: 761px) {
  .pw136-site .g-rewards--three { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pw136-site .g-rewards--three > .g-rewards-head { grid-column: 1 / -1; }
  .pw136-site .g-rewards--three > .g-rw { grid-template-columns: 3.1rem minmax(0, max-content) max-content; justify-content: start; }
  .pw136-site .g-rewards--three > .g-rw:nth-of-type(odd) { border-left: 1px solid var(--line); }
}
@media (min-width: 1101px) {
  .pw136-site .g-rewards--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pw136-site .g-rewards--three > .g-rw:nth-of-type(odd) { border-left: 0; }
  .pw136-site .g-rewards--three > .g-rw:not(:nth-of-type(3n+2)) { border-left: 1px solid var(--line); }
}
/* Рецепт печі й ціна стовпів */
.pw136-site .g-tt-recipe .g-loot small { display: block; color: var(--soft); font-size: .76rem; }
.pw136-site .g-tt-recipe .g-loot li:not(.g-loot-arrow) { line-height: 1.25; }
.pw136-site .g-tt-cost { margin-top: 2rem; }
.pw136-site .g-tt-cost h3 { font-size: 1.15rem; }
/* карта ресурсів — частина розділу «Поліматеріал», одразу після ціни стовпа */
.pw136-site .g-tt-res { margin-top: clamp(2.2rem, 4vw, 3rem); }
.pw136-site .g-tt-res h3 { font-size: 1.15rem; }
.pw136-site .g-tt-res .g-intro { margin-top: .5rem; }
.pw136-site .g-tt-table { width: 100%; margin-top: 1rem; border-collapse: collapse; border: 1px solid var(--line); background: var(--surface); }
.pw136-site .g-tt-table th, .pw136-site .g-tt-table td { padding: .85rem 1.1rem; border-top: 1px solid var(--line); text-align: left; vertical-align: middle; }
.pw136-site .g-tt-table thead th { border-top: 0; color: var(--soft); font: 600 .82rem/1.2 var(--heading); }
.pw136-site .g-tt-table tbody th { color: var(--text); font: 600 .95rem/1.3 var(--heading); }
.pw136-site .g-tt-table th small, .pw136-site .g-tt-table td small { display: block; margin-top: .2rem; color: var(--soft); font: 400 .8rem/1.3 var(--font); }
.pw136-site .g-tt-poly { display: inline-flex; align-items: center; gap: .45rem; color: var(--text); font: 600 1.15rem/1 var(--heading); }
.pw136-site .g-tt-poly-ico { width: 1.8rem; height: 1.8rem; border-radius: 6px; }
/* Соло й група — дві колонки фактів */
.pw136-site .g-tt-compare { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(1rem, 2vw, 1.6rem); margin-top: 2rem; }
.pw136-site .g-tt-col { padding: 1.2rem 1.4rem; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.pw136-site .g-tt-col h3 { display: flex; align-items: center; gap: .55rem; font-size: 1.15rem; }
.pw136-site .g-tt-col ul { list-style: none; margin: .8rem 0 0; padding: 0; }
.pw136-site .g-tt-col li { padding: .5rem 0; border-top: 1px solid var(--line); color: var(--muted); font-size: .92rem; line-height: 1.45; }
.pw136-site .g-tt-col li:first-child { border-top: 0; }
.pw136-site .g-tt-col b { color: var(--text); font-weight: 600; }
/* Котли Храму (script.js, craft.json): вкладки котлів, сторінки котла й ячейки 8 x 4, як у вікні виготовлення гри;
   праворуч рецепт обраної ячейки. Ячейка — кнопка: рамка й значок світлішають при наведенні (стандарт наведення),
   обрана — акцентною рамкою; посилання джерел матеріалу — акцентним текстом */
.pw136-site .g-craft { margin-top: clamp(1.6rem, 3vw, 2.2rem); }
.pw136-site .g-craft-npcs, .pw136-site .g-craft-pages { display: flex; flex-wrap: wrap; gap: .45rem; }
.pw136-site .g-craft-pages { margin-bottom: .75rem; }
.pw136-site .g-craft-npcs { margin-bottom: 1rem; }
.pw136-site .g-craft-npcs button, .pw136-site .g-craft-pages button { padding: .45rem 1rem; border: 1px solid var(--line-strong); border-radius: 999px; background: transparent; color: var(--body); font: 600 .9rem/1.1 var(--heading); cursor: pointer; transition: border-color 150ms ease, color 150ms ease, background-color 150ms ease; }
.pw136-site .g-craft-pages button { min-width: 2.8rem; padding: .35rem .8rem; font-size: .84rem; }
.pw136-site .g-craft-npcs button:hover, .pw136-site .g-craft-pages button:hover { border-color: var(--accent-line); color: var(--text); }
.pw136-site .g-craft-npcs button[aria-selected="true"], .pw136-site .g-craft-pages button[aria-selected="true"] { border-color: var(--accent-line); background: var(--accent-soft); color: var(--text); }
.pw136-site .g-craft-body { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: clamp(1rem, 2vw, 1.6rem); align-items: start; }
.pw136-site .g-craft-grid { list-style: none; margin: 0; padding: .8rem; display: grid; grid-template-columns: repeat(8, clamp(2.6rem, 3.4vw, 3.6rem)); gap: .3rem; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.pw136-site .g-craft-cell { aspect-ratio: 1; border: 1px solid var(--line); border-radius: 8px; background: #0d0b09; transition: border-color 150ms ease; }
.pw136-site .g-craft-cell.is-empty { opacity: .45; }
.pw136-site .g-craft-cell button { position: relative; display: block; width: 100%; height: 100%; padding: 3px; border: 0; border-radius: 7px; background: none; cursor: pointer; }
.pw136-site .g-craft-cell img { display: block; width: 100%; height: 100%; transition: filter 150ms ease; }
.pw136-site .g-craft-cell b { position: absolute; right: 3px; bottom: 1px; color: #fff; font: 600 .7rem/1 var(--heading); text-shadow: 0 0 2px #000, 0 1px 1px #000; }
.pw136-site .g-craft-cell:has(button:hover), .pw136-site .g-craft-cell:has(button:focus-visible) { border-color: rgb(255 122 26 / .55); }
.pw136-site .g-craft-cell button:hover img, .pw136-site .g-craft-cell button:focus-visible img { filter: brightness(1.15); }
.pw136-site .g-craft-cell button:focus-visible { outline: none; }
.pw136-site .g-craft-cell:has(button[aria-pressed="true"]) { border-color: var(--accent); background: var(--accent-soft); }
.pw136-site .g-craft-card { min-height: 100%; padding: 1.1rem 1.3rem; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.pw136-site .g-craft-hint { color: var(--soft); }
.pw136-site .g-craft-out { display: flex; align-items: center; gap: .9rem; }
.pw136-site .g-craft-out img { flex: none; width: 3.2rem; height: 3.2rem; border-radius: 8px; }
.pw136-site .g-craft-out strong { display: block; color: var(--text); font: 600 1.15rem/1.3 var(--heading); }
.pw136-site .g-craft-out small { display: block; margin-top: .15rem; color: var(--soft); font-size: .84rem; }
.pw136-site .g-craft-facts { display: flex; flex-wrap: wrap; gap: .3rem 2rem; margin: 1rem 0 0; padding: .7rem 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.pw136-site .g-craft-facts dt { color: var(--soft); font-size: .78rem; }
.pw136-site .g-craft-facts dd { margin: .1rem 0 0; color: var(--text); font: 600 .95rem/1.3 var(--heading); }
.pw136-site .g-craft-mh { margin-top: 1rem; color: var(--soft); font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; }
.pw136-site .g-craft-mats { list-style: none; margin: .4rem 0 0; padding: 0; }
.pw136-site .g-craft-mats li { display: grid; grid-template-columns: 2.6rem minmax(0, 1fr); gap: .8rem; align-items: start; padding: .6rem 0; border-top: 1px solid var(--line); }
.pw136-site .g-craft-mats li:first-child { border-top: 0; }
.pw136-site .g-craft-mats img { width: 2.6rem; height: 2.6rem; border-radius: 7px; }
.pw136-site .g-craft-mats .g-craft-mname { display: block; color: var(--text); font: 600 .93rem/1.3 var(--heading); }
/* Джерело матеріалу: усі місця плитками в кілька колонок, плитка — режим і стовп (головне: де брати), шанс за бій,
   під ними дрібно боси стовпа (власник 21.10: місце є — «и проценты, и режимы») */
.pw136-site .g-craft-from { margin-top: .4rem; }
.pw136-site .g-craft-bosses { display: grid; grid-template-columns: repeat(auto-fill, minmax(15.5rem, 1fr)); gap: .4rem; list-style: none; margin: 0; padding: 0; }
.pw136-site .g-craft-bosses li { display: block; padding: 0; border: 0; }
.pw136-site .g-craft-boss { display: grid; grid-template-columns: 1.3rem auto minmax(0, 1fr); gap: .3rem .6rem; align-items: center; align-content: start; width: 100%; height: 100%; padding: .42rem .65rem .48rem; border: 1px solid var(--line); border-radius: 9px; background: rgb(255 255 255 / .02); color: inherit; font: inherit; text-align: left; cursor: pointer; transition: border-color 150ms ease, background-color 150ms ease; }
.pw136-site .g-craft-boss:hover, .pw136-site .g-craft-boss:focus-visible { border-color: var(--accent-line); background: var(--accent-soft); outline: none; }
/* рядок, чия карта відкрита кліком */
.pw136-site .g-craft-boss.is-open { border-color: var(--accent); background: var(--accent-soft); }
.pw136-site .g-craft-link.is-open { color: var(--accent-hover); text-decoration-style: solid; }
.pw136-site .g-craft-boss .g-mk-ico { width: 1.3rem; height: 1.3rem; }
.pw136-site .g-craft-bname { grid-column: 2 / -1; align-self: start; min-width: 0; color: var(--soft); font-size: .8rem; line-height: 1.3; }
.pw136-site .g-craft-tag { display: inline-flex; align-items: baseline; gap: .4rem; padding: .26rem .7rem .28rem; border: 1px solid; border-radius: 999px; white-space: nowrap; }
.pw136-site .g-craft-tag small { font: 600 .68rem/1 var(--heading); letter-spacing: .1em; text-transform: uppercase; }
.pw136-site .g-craft-tag b { font: 700 1.1rem/1 var(--heading); letter-spacing: .02em; }
.pw136-site .g-craft-tag--s { border-color: rgb(143 195 255 / .5); background: rgb(143 195 255 / .1); color: #c3defc; }
.pw136-site .g-craft-tag--g { border-color: var(--accent-line); background: var(--accent-soft); color: #ffb47c; }
.pw136-site .g-craft-pct { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: baseline; gap: 0 .3rem; line-height: 1.1; text-align: right; }
.pw136-site .g-craft-pct b { color: #ffcb4a; font: 700 .98rem/1.1 var(--heading); }
.pw136-site .g-craft-pct small { color: var(--soft); font-size: .68rem; }
.pw136-site .g-craft-other { display: flex; flex-wrap: wrap; gap: .15rem .9rem; margin-top: .4rem; color: var(--soft); font-size: .82rem; line-height: 1.4; }
.pw136-site .g-craft-bosses + .g-craft-other { margin-top: .35rem; }
@media (max-width: 560px) {
  .pw136-site .g-craft-bosses { grid-template-columns: minmax(0, 1fr); }
  .pw136-site .g-craft-boss { grid-template-columns: 1.2rem auto minmax(0, 1fr); }
}
.pw136-site .g-craft-link { padding: 0; border: 0; background: none; color: var(--accent); font: inherit; text-align: left; text-decoration: underline; text-decoration-style: dotted; text-underline-offset: 3px; cursor: pointer; transition: color 150ms ease; }
.pw136-site .g-craft-link:hover, .pw136-site .g-craft-link:focus-visible { color: var(--accent-hover); text-decoration-style: solid; }
/* Карта джерела матеріалу: Храм із печаткою боса або світ із місцями ресурсу, рамка як у підказки предмета;
   карта світу вища за ширину, тож її ширина рахується й від висоти екрана */
.pw136-site .g-mini { position: fixed; z-index: 260; left: 0; top: 0; width: min(42rem, calc(100vw - 16px)); padding: .7rem; border: 1px solid rgb(212 164 86 / .5); border-radius: 10px; background: rgb(10 8 6 / .97); box-shadow: 0 12px 32px rgb(0 0 0 / .65), inset 0 1px 0 rgb(255 220 160 / .06); }
.pw136-site .g-mini.is-world { width: min(42rem, calc((100vh - 7rem) * 1536 / 1792), calc(100vw - 16px)); }
.pw136-site .g-mini-cap { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .3rem .9rem; margin: 0 .2rem .6rem; line-height: 1.3; }
.pw136-site .g-mini-cap strong { color: #fff1cf; font: 700 1.08rem/1.25 var(--heading); }
.pw136-site .g-mini-cap small { color: var(--soft); font-size: .86rem; }
.pw136-site .g-mini-cap .g-craft-tag small { color: inherit; font-size: .68rem; }
.pw136-site .g-mini-map { position: relative; overflow: hidden; border-radius: 6px; background: var(--surface); }
.pw136-site .g-mini-map img { display: block; width: 100%; height: auto; }
.pw136-site .g-mini-mk { position: absolute; width: 6%; aspect-ratio: 1; background: url('assets/guides/svitovi-bosy/marks/boss_w.svg') center / contain no-repeat; transform: translate(-50%, -50%); opacity: .4; filter: grayscale(.7); }
.pw136-site .g-mini-mk.is-on { z-index: 1; width: 10%; opacity: 1; filter: drop-shadow(0 0 5px rgb(255 214 140 / .95)); }
.pw136-site .g-mini-pt { position: absolute; width: 9px; height: 9px; border-radius: 50%; background: #4fd1c5; box-shadow: 0 0 0 1px rgb(0 0 0 / .75), 0 0 6px rgb(79 209 197 / .8); transform: translate(-50%, -50%); }
.pw136-site .g-craft-out:focus-visible, .pw136-site .g-craft-mats li:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 6px; }
@media (max-width: 1100px) {
  .pw136-site .g-craft-body { grid-template-columns: minmax(0, 1fr); }
  .pw136-site .g-craft-grid { grid-template-columns: repeat(8, minmax(0, 1fr)); max-width: 30rem; }
}
/* Карта ресурсів (script.js, resources.json): ліворуч ресурси групами за видом (кнопка — значок, назва, рівень, точки
   й колір кристала, коли обраний), посередині карта світу, яку наближають колесом і кнопками й зсувають
   перетягуванням (кристали лишаються свого розміру: --z), праворуч коло: точки, довжина, швидкість, час, відновлення */
.pw136-site .g-res { display: grid; grid-template-columns: minmax(14rem, 19rem) minmax(0, 1fr); gap: clamp(1rem, 2vw, 1.6rem); align-items: start; margin-top: clamp(1.6rem, 3vw, 2.2rem); }
.pw136-site .g-res-side { max-height: calc(100svh - 10rem); overflow: auto; padding: .8rem; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); scrollbar-width: thin; }
.pw136-site .g-res-group + .g-res-group { margin-top: .8rem; }
.pw136-site .g-res-group h3 { margin: 0 0 .35rem .3rem; color: var(--soft); font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; }
.pw136-site .g-res-group ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .2rem; }
.pw136-site .g-res-pick { display: grid; grid-template-columns: 1.9rem minmax(0, 1fr) .7rem; gap: .6rem; align-items: center; width: 100%; padding: .35rem .5rem; border: 1px solid transparent; border-radius: 9px; background: none; color: inherit; text-align: left; cursor: pointer; transition: border-color 150ms ease, background-color 150ms ease; }
.pw136-site .g-res-pick img { width: 1.9rem; height: 1.9rem; border-radius: 6px; }
.pw136-site .g-res-pick span { display: grid; min-width: 0; }
.pw136-site .g-res-pick strong { color: var(--text); font: 600 .86rem/1.25 var(--heading); }
.pw136-site .g-res-pick small { color: var(--soft); font-size: .72rem; line-height: 1.3; }
.pw136-site .g-res-dot { width: .7rem; height: .7rem; border: 1px solid var(--line-strong); border-radius: 50%; background: var(--c, transparent); }
.pw136-site .g-res-pick:hover, .pw136-site .g-res-pick:focus-visible { border-color: rgb(255 122 26 / .55); outline: none; }
.pw136-site .g-res-pick[aria-pressed="true"] { border-color: var(--accent-line); background: var(--accent-soft); }
.pw136-site .g-res-clear { margin-top: .8rem; padding: .4rem .9rem; border: 1px solid var(--line-strong); border-radius: 999px; background: none; color: var(--body); font: 600 .82rem/1.1 var(--heading); cursor: pointer; }
.pw136-site .g-res-clear:hover { border-color: var(--accent-line); color: var(--text); }
.pw136-site .g-res-main { display: flex; gap: clamp(1rem, 2vw, 1.6rem); align-items: flex-start; }
.pw136-site .g-res-route { flex: 1 1 13rem; min-width: 13rem; max-width: 19rem; }
.pw136-site .g-res-map { position: relative; flex: none; overflow: hidden; width: calc((100svh - 10rem) * 1536 / 1792); max-width: calc(100% - 14.6rem); border: 1px solid var(--line-strong); border-radius: 12px; background: #0d0b09; touch-action: none; cursor: grab; user-select: none; }
.pw136-site .g-res-map.is-drag { cursor: grabbing; }
.pw136-site .g-res-stage { position: absolute; inset: 0; transform-origin: 0 0; }
.pw136-site .g-res-img { display: block; width: 100%; height: 100%; pointer-events: none; }
/* куски карти зблизька лягають поверх загальної карти, поки вантажаться, під ними видно її */
.pw136-site .g-res-tiles { position: absolute; inset: 0; pointer-events: none; }
.pw136-site .g-res-tiles img { position: absolute; display: block; max-width: none; }
.pw136-site .g-res-line { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.pw136-site .g-res-line polyline { fill: none; stroke: #ffcb4a; stroke-width: 2.5; stroke-linejoin: round; stroke-linecap: round; filter: drop-shadow(0 0 2px rgb(0 0 0 / .9)); }
.pw136-site .g-res-pts { position: absolute; inset: 0; }
.pw136-site .g-res-pt { position: absolute; width: 14px; height: 16px; padding: 0; border: 0; background: center / contain no-repeat; transform: translate(-50%, -50%) scale(calc(1 / var(--z, 1))); cursor: pointer; }
.pw136-site .g-res-pt:hover, .pw136-site .g-res-pt:focus-visible { z-index: 2; filter: brightness(1.35) drop-shadow(0 0 3px rgb(255 203 74 / .9)); outline: none; }
.pw136-site .g-res-pt.is-route { z-index: 1; filter: drop-shadow(0 0 3px #ffcb4a); }
.pw136-site .g-res-pt.is-route::after { content: attr(data-n); position: absolute; left: 50%; bottom: 100%; translate: -50% 0; color: #fff1cf; font: 600 11px/1 var(--heading); text-shadow: 0 0 2px #000, 0 1px 1px #000; pointer-events: none; }
.pw136-site .g-res-zoom { position: absolute; z-index: 3; top: .6rem; right: .6rem; display: grid; gap: .3rem; }
.pw136-site .g-res-zoom button { width: 2.1rem; height: 2.1rem; padding: 0; border: 1px solid var(--line-strong); border-radius: 9px; background: rgb(12 9 6 / .82); color: var(--text); font: 600 1.05rem/1 var(--heading); cursor: pointer; }
.pw136-site .g-res-zoom button:hover, .pw136-site .g-res-zoom button:focus-visible { border-color: var(--accent-line); color: var(--accent-hover); outline: none; }
.pw136-site .g-res-zoom svg { display: block; width: 1.1rem; height: 1.1rem; margin: auto; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
/* На весь екран — увесь блок: список ліворуч, карта на всю висоту, коло праворуч */
.pw136-site .g-res.is-full { position: fixed; inset: 0; z-index: 300; grid-template-columns: minmax(14rem, 19rem) auto; justify-content: center; margin: 0; padding: 1.2rem; background: var(--bg); align-items: stretch; overflow: hidden; }
.pw136-site .g-res.is-full .g-res-side { height: 100%; max-height: none; min-height: 0; }
.pw136-site .g-res.is-full .g-res-main { flex-direction: row; min-height: 0; }
.pw136-site .g-res.is-full .g-res-map { width: calc((100vh - 2.4rem) * 1536 / 1792); max-width: none; }
.pw136-site .g-res.is-full .g-res-route { flex: none; width: 17rem; }
@media (max-width: 1100px) {
  .pw136-site .g-res.is-full { grid-template-columns: minmax(0, 1fr); justify-content: stretch; overflow: auto; }
  .pw136-site .g-res.is-full .g-res-side { height: auto; max-height: 30vh; }
  .pw136-site .g-res.is-full .g-res-main { flex-direction: column; }
  .pw136-site .g-res.is-full .g-res-map { width: min(100%, calc((100vh - 2.4rem) * 1536 / 1792)); }
  .pw136-site .g-res.is-full .g-res-route { width: 100%; }
}
.pw136-site .g-res-route { padding: 1rem 1.1rem; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.pw136-site .g-res-route h3 { font-size: 1.1rem; }
.pw136-site .g-res-stats { margin: .6rem 0 0; }
.pw136-site .g-res-stats div { display: flex; justify-content: space-between; gap: 1rem; padding: .45rem 0; border-top: 1px solid var(--line); }
.pw136-site .g-res-stats dt { color: var(--soft); font-size: .84rem; }
.pw136-site .g-res-stats dd { margin: 0; color: var(--text); font: 600 .92rem/1.3 var(--heading); text-align: right; }
.pw136-site .g-res-speed { padding: .6rem 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.pw136-site .g-res-speed label { display: flex; align-items: center; justify-content: space-between; gap: .8rem; color: var(--soft); font-size: .84rem; }
.pw136-site .g-res-speed input { width: 4.8rem; padding: .3rem .5rem; border: 1px solid var(--line-strong); border-radius: 8px; background: #0d0b09; color: var(--text); font: 600 .92rem/1.2 var(--heading); }
.pw136-site .g-res-speed input:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.pw136-site .g-res-speed small { display: block; margin-top: .35rem; color: var(--soft); font-size: .74rem; line-height: 1.35; }
.pw136-site .g-res-note { margin-top: .7rem; color: var(--soft); font-size: .84rem; line-height: 1.45; }
.pw136-site .g-res-note.is-short { color: var(--accent-hover); }
.pw136-site .g-res-note.is-ok { color: var(--text); }
.pw136-site .g-res-acts { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .8rem; }
.pw136-site .g-res-acts button { padding: .4rem .85rem; border: 1px solid var(--line-strong); border-radius: 999px; background: none; color: var(--body); font: 600 .8rem/1.1 var(--heading); cursor: pointer; }
.pw136-site .g-res-acts button:hover:not(:disabled) { border-color: var(--accent-line); color: var(--text); }
.pw136-site .g-res-acts button:disabled { opacity: .45; cursor: default; }
@media (max-width: 1300px) {
  .pw136-site .g-res-main { flex-direction: column; }
  .pw136-site .g-res-map { width: min(100%, calc((100svh - 6rem) * 1536 / 1792)); max-width: 100%; }
  .pw136-site .g-res-route { width: 100%; max-width: none; }
}
@media (max-width: 860px) {
  .pw136-site .g-res { grid-template-columns: minmax(0, 1fr); }
  .pw136-site .g-res-side { max-height: 22rem; }
  .pw136-site .g-res-map { width: 100%; }
}
/* Вікно без кадру (печатка боса Храму): шапка — лише знак, вид і ім'я, хрестик праворуч */
.pw136-site .g-bpop.is-plain .g-bpop-head::after { display: none; }
.pw136-site .g-bpop.is-plain .g-bpop-title { position: static; padding: 1.3rem 3.6rem .4rem 1.3rem; }
.pw136-site .g-bpop.is-plain .g-bpop-name { text-shadow: none; }
/* Рядок вікна без значка (script.js: row) — текст на всю ширину */
.pw136-site .g-bpop-drops li.is-text { grid-template-columns: minmax(0, 1fr); }
@media (max-width: 760px) {
  .pw136-site .g-tt-compare, .pw136-site .g-timeline--3 { grid-template-columns: minmax(0, 1fr); }
  .pw136-site .g-tt-table th, .pw136-site .g-tt-table td { padding: .7rem .6rem; }
}
@media (max-width: 560px) {
  .pw136-site .g-tt-row { grid-template-columns: 3.6rem repeat(3, minmax(0, 1fr)); gap: .25rem; }
  .pw136-site .g-tt-grid button { flex-direction: column; align-items: center; gap: .15rem; padding: .35rem .2rem; }
  .pw136-site .g-tt-modes button { flex: 1 1 0; }
}

/* «Захоплення скарбу» (22.10.2026, за зразком «Руїн» і «Нападів», build_guide_skarb.py). Шапка — площадка зі
   скринями фоном, праворуч одна карта: уся арена й наближений центр (картинки однієї міри 1280×727 в одній клітинці).
   Печатки в стилі печатки НІПа: поле скринь 7 %, зал входу й вихід в одному залі — однакові 4 %, місця, де теж можна
   з’явитися, 3,5 %, скрині в центрі — 3,2 % ширини карти, п'ять барв за вмістом; не накривають одна одну
   (check_guide_skarb.py) */
.pw136-site .g-hero--skarb::before { background-image: url('assets/guides/zakhoplennia-skarbu/hero-chests.webp'); background-position: 50% 50%; }
.pw136-site .g-mk--zin, .pw136-site .g-mk-ico--zin { background-image: url('assets/guides/zakhoplennia-skarbu/marks/zin.svg'); }
.pw136-site .g-mk--zout, .pw136-site .g-mk-ico--zout { background-image: url('assets/guides/zakhoplennia-skarbu/marks/zout.svg'); }
.pw136-site .g-mk--zld, .pw136-site .g-mk-ico--zld { background-image: url('assets/guides/zakhoplennia-skarbu/marks/zld.svg'); }
.pw136-site .g-mk--zfield, .pw136-site .g-mk-ico--zfield { background-image: url('assets/guides/zakhoplennia-skarbu/marks/zfield.svg'); }
.pw136-site .g-mk--zcg, .pw136-site .g-mk-ico--zcg { background-image: url('assets/guides/zakhoplennia-skarbu/marks/zcg.svg'); }
.pw136-site .g-mk--zcp, .pw136-site .g-mk-ico--zcp { background-image: url('assets/guides/zakhoplennia-skarbu/marks/zcp.svg'); }
.pw136-site .g-mk--zcr, .pw136-site .g-mk-ico--zcr { background-image: url('assets/guides/zakhoplennia-skarbu/marks/zcr.svg'); }
.pw136-site .g-mk--zcb, .pw136-site .g-mk-ico--zcb { background-image: url('assets/guides/zakhoplennia-skarbu/marks/zcb.svg'); }
.pw136-site .g-mk--zcm, .pw136-site .g-mk-ico--zcm { background-image: url('assets/guides/zakhoplennia-skarbu/marks/zcm.svg'); }
.pw136-site .g-mk--zn, .pw136-site .g-mk-ico--zn { background-image: url('assets/guides/zakhoplennia-skarbu/marks/zn.svg'); }
.pw136-site .g-mk--zm, .pw136-site .g-mk-ico--zm { background-image: url('assets/guides/zakhoplennia-skarbu/marks/zm.svg'); }
.pw136-site .g-wmap--skarb .g-wmap-box { container-type: inline-size; }
.pw136-site .g-wmap--skarb .g-mk { width: clamp(1.4rem, 7cqi, 3.8rem); }
.pw136-site .g-wmap--skarb .g-mk--zin, .pw136-site .g-wmap--skarb .g-mk--zout { width: clamp(.7rem, 4cqi, 2.2rem); }
.pw136-site .g-wmap--skarb .g-mk--zld { width: clamp(.6rem, 3.5cqi, 1.95rem); }
.pw136-site .g-wmap--skarb .g-mapview[data-map="centre"] .g-mk { width: clamp(.7rem, 3.2cqi, 1.75rem); }
.pw136-site .g-wmap--skarb .g-mapview[data-map="centre"] .g-mk--zst { width: clamp(.9rem, 4.5cqi, 2.45rem); }
/* підказка синьої мітки називає НІПів («Сюди кидає Вовченя чи Зу Лонг») — одним рядком; на телефоні переноситься,
   щоб не вийти за екран */
@media (min-width: 521px) {
  .pw136-site .g-wmap--skarb .g-mk--zld .g-mk-tip { max-width: none; white-space: nowrap; }
}
/* Без вкладок над картою (власник 22.10.2026): скриня на всій арені наближає центр, сходи до залу входу на центрі
   повертають усю арену (script.js, data-zoom); підказка каже, що станеться */
.pw136-site .g-mk--zoom { cursor: zoom-in; }
.pw136-site .g-mk--zst.g-mk--zoom { cursor: zoom-out; }
.pw136-site .g-mk--zst, .pw136-site .g-mk-ico--zst { background-image: url('assets/guides/zakhoplennia-skarbu/marks/zst.svg'); }
@media (min-width: 1101px) {
  .pw136-site .g-hero--skarb .g-hero-grid { grid-template-columns: minmax(0, 1fr) auto; }
  .pw136-site .g-wmap--skarb { width: clamp(32rem, calc((100svh - 21rem) * 1280 / 727), 56rem); justify-self: end; }
}
/* Одна міра кадрів, як у «Руїнах»: кадр розділу завширшки з картку ряду (5, 3, 2 або 1 у ряд); у розділі з двома
   кадрами (Як потрапити, Вартові) текст займає на колонку менше */
@media (min-width: 1101px) {
  .pw136-site .g-page--skarb .g-head-media { grid-template-columns: repeat(5, minmax(0, 1fr)); column-gap: clamp(1rem, 1.6vw, 1.4rem); }
  .pw136-site .g-page--skarb .g-head-media > .g-sec-head { grid-column: 1 / 5; }
  .pw136-site .g-page--skarb .g-head-media--2 > .g-sec-head { grid-column: 1 / 4; }
}
@media (min-width: 761px) and (max-width: 1100px) {
  .pw136-site .g-page--skarb .g-head-media { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: clamp(1rem, 1.6vw, 1.4rem); }
  .pw136-site .g-page--skarb .g-head-media > .g-sec-head { grid-column: 1 / 3; }
  .pw136-site .g-page--skarb .g-head-media--2 > .g-sec-head { grid-column: 1 / -1; }
  .pw136-site .g-page--skarb .g-head-media .g-shot { margin-top: 0; }
  .pw136-site .g-page--skarb .g-head-media--2 .g-shot { margin-top: 1.4rem; }
}
@media (min-width: 521px) and (max-width: 760px) {
  .pw136-site .g-page--skarb .g-head-media .g-shot { width: calc(50% - clamp(.5rem, .8vw, .7rem)); }
  .pw136-site .g-page--skarb .g-head-media--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(1rem, 1.6vw, 1.4rem); }
  .pw136-site .g-page--skarb .g-head-media--2 > .g-sec-head { grid-column: 1 / -1; }
  .pw136-site .g-page--skarb .g-head-media--2 .g-shot { width: auto; }
}
/* Скрині: дві короткі (по 6 рядків) поруч, під ними три довгі списки по третині ширини; до 1100 px — усе одна під
   одною, довгі списки рядками у дві колонки (загальне правило .g-chest) */
.pw136-site .g-chests--skarb { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.pw136-site .g-chests--skarb .g-chest--ghost, .pw136-site .g-chests--skarb .g-chest--spirit { grid-column: span 3; }
.pw136-site .g-chests--skarb .g-chest--centre, .pw136-site .g-chests--skarb .g-chest--stones,
.pw136-site .g-chests--skarb .g-chest--mats { grid-column: span 2; }
.pw136-site .g-chests--skarb .g-chest--centre .g-rewards, .pw136-site .g-chests--skarb .g-chest--stones .g-rewards,
.pw136-site .g-chests--skarb .g-chest--mats .g-rewards { grid-template-columns: minmax(0, 1fr); }
.pw136-site .g-chests--skarb .g-rewards-head h3 { display: flex; align-items: center; gap: .55rem; }
.pw136-site .g-chests--skarb .g-rewards-head .g-mk-ico { width: 1.6rem; height: 1.6rem; }
.pw136-site .g-chests--skarb .g-rewards-foot { grid-column: 1 / -1; margin: 0; padding: .8rem 1.1rem; }
@media (max-width: 1100px) {
  .pw136-site .g-chests--skarb { grid-template-columns: minmax(0, 1fr); }
  .pw136-site .g-chests--skarb .g-chest { grid-column: auto; }
  .pw136-site .g-chests--skarb .g-chest .g-rewards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .pw136-site .g-chests--skarb .g-chest .g-rewards { grid-template-columns: minmax(0, 1fr); }
}
/* Котел обміну Посланців: два ряди ячейок і сім коротких матеріалів без джерел — матеріали плитками в кілька колонок,
   ячейки на широкому екрані більші: картка не тягнеться вниз під сіткою, праворуч не порожньо (власник 23.10.2026 на
   2K: «с правой стороны тонна пустого места… вниз оно всё спустилось») */
.pw136-site .g-page--skarb .g-craft-card { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 2rem; align-items: center; align-content: start; }
.pw136-site .g-page--skarb .g-craft-facts { margin: 0; padding: 0; border: 0; }
.pw136-site .g-page--skarb .g-craft-mh, .pw136-site .g-page--skarb .g-craft-mats { grid-column: 1 / -1; }
.pw136-site .g-page--skarb .g-craft-mh { margin-top: .9rem; padding-top: .8rem; border-top: 1px solid var(--line); }
.pw136-site .g-page--skarb .g-craft-mats { display: grid; grid-template-columns: repeat(auto-fill, minmax(14.5rem, 1fr)); gap: .45rem; }
.pw136-site .g-page--skarb .g-craft-mats li, .pw136-site .g-page--skarb .g-craft-mats li:first-child { align-items: center; padding: .5rem .65rem; border: 1px solid var(--line); border-radius: 9px; background: rgb(255 255 255 / .02); }
/* сім плиток рівно 4 + 3, а не 5 + 2 з дірою праворуч чи 3 + 3 + 1 під невисокою сіткою; до 1300 px картка під
   сіткою на всю ширину (поруч із сіткою вона вузька й утричі вища за неї), ширше — поруч, ячейки більші */
@media (min-width: 761px) {
  .pw136-site .g-page--skarb .g-craft-mats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 1299px) {
  .pw136-site .g-page--skarb .g-craft-body { grid-template-columns: minmax(0, 1fr); }
  .pw136-site .g-page--skarb .g-craft-grid { grid-template-columns: repeat(8, minmax(0, 1fr)); max-width: 30rem; }
}
@media (min-width: 1300px) {
  .pw136-site .g-page--skarb .g-craft-grid { grid-template-columns: repeat(8, clamp(2.6rem, 4vw, 4.8rem)); }
}
/* «Щоденні завдання» (24.10.2026, build_guide_shchodenni.py). Шапка — «тарілка» в центрі Міста Драконів (кадр
   власника 25.10); карта світу з Охоронцями, печатка Охоронця Міста Драконів наближує місто з його НІПами, а
   золота печатка майстерень у місті — їхній двір (як склади Палацу). Печатки — кругла печатка НІПа карти Міста
   темних звірів: Охоронець зелений (7 % ширини карти),
   НІПи інших щоденних сині (4,5 %; тісний двір майстерень — окремим наближенням), золота — двір майстерень у місті
   (5,5 %, клік наближує двір); Місто Драконів на карті світу — та сама зелена печатка Охоронця, що наближує місто */
.pw136-site .g-hero--shchodenni::before { background-image: url('assets/guides/shchodenni-zavdannia/hero-1025a.webp'); background-position: 50% 45%; }
.pw136-site .g-mk--dk { background-image: url('assets/guides/shchodenni-zavdannia/marks/dk.svg'); }
.pw136-site .g-mk--do { background-image: url('assets/guides/shchodenni-zavdannia/marks/do.svg'); }
.pw136-site .g-mk--dz { z-index: 1; background-image: url('assets/guides/shchodenni-zavdannia/marks/dz.svg'); }
.pw136-site .g-mk--dzb { z-index: 2; background-image: url('assets/guides/shchodenni-zavdannia/marks/dzb.svg'); }
.pw136-site .g-mk--dzb.g-mk--zoom { cursor: zoom-out; }
.pw136-site .g-mk-ico--dk { background-image: url('assets/guides/shchodenni-zavdannia/marks/dk.svg'); }
.pw136-site .g-mk-ico--do { background-image: url('assets/guides/shchodenni-zavdannia/marks/do.svg'); }
.pw136-site .g-mk-ico--dz { background-image: url('assets/guides/shchodenni-zavdannia/marks/dz.svg'); }
/* Розпорядник завдань (05.11.2026) — бузкова печатка НІПа; у Місті Мечів, Перевертнів і Пір’я поруч з Охоронцем, тож
   зелена печатка цих міст на карті світу наближує місто, як у Міста Драконів */
.pw136-site .g-mk--dr { background-image: url('assets/guides/shchodenni-zavdannia/marks/dr.svg'); }
.pw136-site .g-mk-ico--dr { background-image: url('assets/guides/shchodenni-zavdannia/marks/dr.svg'); }
.pw136-site .g-mapsw--shchodenni .g-mk--dk { width: clamp(1.4rem, 7cqi, 3.8rem); }
.pw136-site .g-mapsw--shchodenni .g-mk--do,
.pw136-site .g-mapsw--shchodenni .g-mk--dr,
/* у наближеному місті Охоронець — звичайний НІП поруч із Посланцем часу чи Розпорядником, тієї ж міри (власник 25.10:
   «этот гигантский стоит поменьше сделать»); праворуч від тарілки, Посланець вище — як на карті гри (SEATS у збирачі) */
.pw136-site .g-mapsw--shchodenni .g-mapview:not([data-map="world"]) .g-mk--dk { width: clamp(.9rem, 4.5cqi, 2.45rem); }
.pw136-site .g-mapsw--shchodenni .g-mk--dz { width: clamp(1.1rem, 5.5cqi, 3rem); }
.pw136-site .g-mapsw--shchodenni .g-mk--dzb { width: clamp(1rem, 5cqi, 2.7rem); }
@media (min-width: 1101px) {
  .pw136-site .g-hero--shchodenni .g-hero-grid { grid-template-columns: minmax(0, 1fr) auto; }
  .pw136-site .g-mapsw--shchodenni { width: clamp(32rem, calc((100svh - 18rem) * 1536 / 1792), 52rem); justify-self: end; }
  /* кадр шапки — у просвіті між текстом і картою, а не під текстом; факти — завширшки з текст, а не до карти
     (власник 25.10: «00:00 нове завдання» залазило на тарілку й зливалося з фоном) */
  .pw136-site .g-hero--shchodenni::before { left: 34%; width: min(40%, 52rem); opacity: .6; }
  .pw136-site .g-hero--shchodenni .g-facts { max-width: 36rem; }
  /* 4 кроки Мисливця — один ряд, а не 3 + 1 */
  .pw136-site .g-page--shchodenni .g-steps { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
/* Ступені Мисливця: рядок на ступінь — рівень, нагорода плитками, боси плитками. Плитка боса з картою — кнопка ще до
   наведення (власник 25.10.2026: «я даже не знал, что это кликабельные кнопки»): тепла рамка, піднятий фон і праворуч
   значок карти в квадраті акценту; відкриває печатку на карті підземелля (вікно «Боси квестових підземель», що на
   «Про сервер») або в посібнику Храму в режимі боса. Бос без карти — рядок без фону й без значка */
.pw136-site .g-tiers { list-style: none; padding: 0; margin: clamp(1.6rem, 3vw, 2.2rem) 0 0; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); overflow: hidden; }
.pw136-site .g-tier { display: grid; grid-template-columns: 6.5rem minmax(0, 1fr) minmax(0, 1.3fr); gap: 1rem 1.6rem; align-items: start; padding: 1.15rem 1.4rem; }
.pw136-site .g-tier + .g-tier { border-top: 1px solid var(--line); }
.pw136-site .g-tier-lv strong { display: block; color: var(--text); font: 600 1.45rem/1.1 var(--heading); }
.pw136-site .g-tier-lv span { color: var(--soft); font-size: .85rem; }
.pw136-site .g-tier-aw > p, .pw136-site .g-tier-bosses > p { margin-bottom: .55rem; color: var(--soft); font-size: .84rem; }
.pw136-site .g-tier-bosses ul { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(13.5rem, 1fr)); gap: .45rem; }
.pw136-site .g-tboss { display: flex; align-items: center; gap: .7rem; width: 100%; height: 100%; min-height: 3.1rem; padding: .45rem .8rem; border: 1px solid var(--line); border-radius: 10px; background: transparent; color: var(--body); font: inherit; text-align: left; text-decoration: none; }
.pw136-site .g-tboss > span { display: flex; flex: 1 1 auto; flex-direction: column; gap: .15rem; min-width: 0; }
.pw136-site .g-tboss--go { padding-right: .55rem; border-color: var(--accent-line); background: var(--raised); box-shadow: inset 0 1px 0 rgb(255 255 255 / .04); }
.pw136-site button.g-tboss, .pw136-site a.g-tboss { cursor: pointer; transition: border-color 150ms ease, background-color 150ms ease; }
.pw136-site .g-tboss strong { color: var(--text); font-size: .95rem; font-weight: 600; line-height: 1.25; transition: color 150ms ease; }
.pw136-site .g-tboss small { color: var(--soft); font-size: .8rem; line-height: 1.25; text-wrap: pretty; }
.pw136-site .g-tboss-mode { color: var(--accent); font-weight: 600; }
.pw136-site .g-tboss-go { position: relative; flex: none; width: 2rem; height: 2rem; border: 1px solid var(--accent-line); border-radius: 8px; background: var(--accent-soft); transition: background-color 150ms ease, border-color 150ms ease; }
.pw136-site .g-tboss-go::before { content: ''; position: absolute; inset: .42rem; background: var(--accent); -webkit-mask: url('assets/guides/shchodenni-zavdannia/marks/go-map.svg') center / contain no-repeat; mask: url('assets/guides/shchodenni-zavdannia/marks/go-map.svg') center / contain no-repeat; transition: background-color 150ms ease; }
.pw136-site .g-tboss--go:hover .g-tboss-go, .pw136-site .g-tboss--go:focus-visible .g-tboss-go { border-color: var(--accent); background: var(--accent); }
.pw136-site .g-tboss--go:hover .g-tboss-go::before, .pw136-site .g-tboss--go:focus-visible .g-tboss-go::before { background: var(--accent-ink); }
.pw136-site .g-others .g-rewards { margin-top: 1.4rem; }
/* Інші щоденні: кадр НІПа праворуч від своєї нагороди, а не рядком над усіма (власник 25.10: «картинки должны стоять
   напротив награды», справа від наград пусто). Сітка тієї ж міри, що ряд карток Охоронців (4, 3, 2, 1 колонки), тож
   кадр завширшки з картку Охоронця; на телефоні кадр над своєю нагородою */
.pw136-site .g-other { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); column-gap: clamp(1rem, 1.6vw, 1.4rem); align-items: start; }
.pw136-site .g-other > .g-rewards { grid-column: 1 / 4; min-width: 0; }
.pw136-site .g-other > .g-other-card { grid-column: 4; margin: 1.4rem 0 0; }
@media (max-width: 1100px) {
  .pw136-site .g-other { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pw136-site .g-other > .g-rewards { grid-column: 1 / 3; }
  .pw136-site .g-other > .g-other-card { grid-column: 3; }
}
@media (max-width: 760px) {
  .pw136-site .g-other { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pw136-site .g-other > .g-rewards { grid-column: 1 / -1; grid-row: 2; }
  .pw136-site .g-other > .g-other-card { grid-column: 1; grid-row: 1; }
}
@media (max-width: 520px) {
  .pw136-site .g-other { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 1100px) {
  .pw136-site .g-tier { grid-template-columns: 5.5rem minmax(0, 1fr); }
  .pw136-site .g-tier-bosses { grid-column: 1 / -1; }
}
@media (max-width: 600px) {
  .pw136-site .g-tier { grid-template-columns: minmax(0, 1fr); padding: 1rem; }
}
/* Нагорода Розпорядника завдань (05.11.2026): ступінь рядком — «100 завдань» і скільки вільних клітинок, нагорода
   плитками (під назвою — прив’язано чи ні, як у грі), праворуч що всередині коробок цієї ступені. Кадр вікна
   персонажа в ряду карток — не кнопка й на наведення не відповідає */
.pw136-site .g-tier--count { grid-template-columns: 6.5rem minmax(0, 2fr) minmax(0, 1fr); }
.pw136-site .g-tier-lv small { display: block; margin-top: .35rem; color: var(--soft); font-size: .8rem; line-height: 1.3; }
.pw136-site .g-tier-box > p { margin-bottom: .55rem; color: var(--soft); font-size: .84rem; }
.pw136-site .g-loot small.g-bind { color: var(--soft); }
.pw136-site .g-tbox { list-style: none; padding: 0; display: grid; gap: .8rem; }
.pw136-site .g-tbox > li { display: grid; grid-template-columns: 2.6rem minmax(0, 1fr); gap: .45rem .7rem; align-items: center; }
.pw136-site .g-tbox > li > .g-loot { grid-column: 2; }
.pw136-site .g-tbox-name strong { display: block; color: var(--text); font: 600 .95rem/1.3 var(--heading); }
.pw136-site .g-tbox-name small { display: block; color: var(--soft); font-size: .8rem; line-height: 1.3; }
.pw136-site div.g-bcard-media { cursor: default; }
.pw136-site div.g-bcard-media:hover img { transform: none; filter: none; }
/* вікно з картою міста: карта цього посібника вертикальна (1536×1792), а не 4:3, як у Луни; печатки тієї ж міри, що
   в наближеному місті шапки; знак «уся карта світу» у вікні не працює — його немає */
.pw136-site .g-page--shchodenni .g-bpop-map { width: min(calc((var(--mh) - 2rem) * 1536 / 1792), calc(100vw - 34px - 19rem - 2rem)); }
.pw136-site .g-page--shchodenni .g-bpop-map .g-mk--dk,
.pw136-site .g-page--shchodenni .g-bpop-map .g-mk--dr,
.pw136-site .g-page--shchodenni .g-bpop-map .g-mk--do { width: clamp(.9rem, 4.5cqi, 2.45rem); }
.pw136-site .g-page--shchodenni .g-bpop-map .g-mk--dz { width: clamp(1.1rem, 5.5cqi, 3rem); }
.pw136-site .g-page--shchodenni .g-bpop-map .g-mk--dzb { display: none; }
@media (max-width: 1100px) {
  .pw136-site .g-tier--count { grid-template-columns: 5.5rem minmax(0, 1fr); }
  .pw136-site .g-tier-box { grid-column: 1 / -1; }
}
@media (max-width: 860px) {
  .pw136-site .g-page--shchodenni .g-bpop-map { width: 100%; }
}
@media (max-width: 600px) {
  .pw136-site .g-tier--count { grid-template-columns: minmax(0, 1fr); }
  .pw136-site .g-tbox > li > .g-loot { grid-column: 1 / -1; }
}

/* «Долина Священного Місяця», 26.10.2026 (tools/wp/build_guide_luna.py, за зразком «Міста Інею»). Шапка — брама зі
   статуєю над водою (кадр картки «Про сервер») фоном, праворуч карта долини 4:3 без підписів гри; режим обирають на
   самій карті (.g-lmode нижче). Печатки — одна на місце, розміри — у style печатки */
.pw136-site .g-hero--luna::before { background-image: url('assets/era-lunar-gate.webp'); background-position: 50% 40%; }
@media (min-width: 1101px) {
  .pw136-site .g-hero--luna .g-hero-grid { grid-template-columns: minmax(0, 1fr) auto; }
  .pw136-site .g-hero--luna::before { left: 26%; width: min(31%, 44rem); opacity: .62; }
  .pw136-site .g-hero--luna .g-facts { max-width: 40rem; }
  .pw136-site .g-mapsw--luna { width: clamp(32rem, calc((100svh - 15rem) * 4 / 3), 58rem); justify-self: end; }
}
/* Печатка боса, що наближає його місце, — той самий ромб, лише кромка й заклепки лунні срібно-бузкові замість золотих
   (lz_e/s/w, зібрані з boss_*.svg); у наближенні в печатки кружок з номером черги (g-mk-n), рядок порядку — g-zcap */
.pw136-site .g-mk--lz { background-image: url('assets/guides/dolyna-sviashchennoho-misiatsia/marks/lz_e.svg'); }
.pw136-site .g-mk--s.g-mk--lz { background-image: url('assets/guides/dolyna-sviashchennoho-misiatsia/marks/lz_s.svg'); }
.pw136-site .g-mk--w.g-mk--lz { background-image: url('assets/guides/dolyna-sviashchennoho-misiatsia/marks/lz_w.svg'); }
/* Шлях групи й маршрут соло — долини стовпчиком на лінії: назва долини й бос (монумент) під нею */
.pw136-site .g-path { list-style: none; margin: .75rem 0 0; padding: 0 0 0 .3rem; }
.pw136-site .g-path > li { position: relative; padding: 0 0 .6rem 1.2rem; border-left: 1px solid var(--accent-line); }
.pw136-site .g-path > li:last-child { padding-bottom: 0; border-left-color: transparent; }
.pw136-site .g-path > li::before { content: ''; position: absolute; left: -.33rem; top: .42rem; width: .6rem; height: .6rem; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.pw136-site .g-steps .g-path b { display: block; color: var(--text); font-weight: 600; line-height: 1.3; }
.pw136-site .g-path small { display: block; color: var(--muted); font-size: .86rem; line-height: 1.35; }
.pw136-site .g-luna-cards { margin-top: clamp(2rem, 4vw, 3rem); }
@media (min-width: 1101px) {
  .pw136-site .g-paths { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .pw136-site .g-page--luna .g-head-media { grid-template-columns: repeat(5, minmax(0, 1fr)); column-gap: clamp(1rem, 1.6vw, 1.4rem); }
  .pw136-site .g-page--luna .g-head-media > .g-sec-head { grid-column: 1 / 5; }
  .pw136-site .g-page--luna .g-head-media--2 > .g-sec-head { grid-column: 1 / 4; }
}
@media (min-width: 761px) and (max-width: 1100px) {
  .pw136-site .g-paths { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pw136-site .g-page--luna .g-head-media { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: clamp(1rem, 1.6vw, 1.4rem); }
  .pw136-site .g-page--luna .g-head-media > .g-sec-head { grid-column: 1 / 3; }
  .pw136-site .g-page--luna .g-head-media--2 > .g-sec-head { grid-column: 1 / -1; }
  .pw136-site .g-page--luna .g-head-media .g-shot { margin-top: 0; }
  .pw136-site .g-page--luna .g-head-media--2 .g-shot { margin-top: 1.4rem; }
}
@media (min-width: 521px) and (max-width: 760px) {
  .pw136-site .g-paths { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pw136-site .g-page--luna .g-head-media .g-shot { width: calc(50% - clamp(.5rem, .8vw, .7rem)); }
  .pw136-site .g-page--luna .g-head-media--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(1rem, 1.6vw, 1.4rem); }
  .pw136-site .g-page--luna .g-head-media--2 > .g-sec-head { grid-column: 1 / -1; }
  .pw136-site .g-page--luna .g-head-media--2 .g-shot { width: auto; }
}
/* до 1100 px брама лягає за факти шапки, а її світлий камінь з'їдав підписи (аудит: контраст 1,9) — тьмяніше */
@media (max-width: 1100px) {
  .pw136-site .g-hero--luna::before { opacity: .2; }
}
/* Режим — на самій карті, як на карті гри (J-1539, варіант «печатки-кнопки»; власник 28.10: перемикач під фактами
   «залазит на другие блоки… поставить, как в игре, просто на карту кнопочки»): «Режим», черта з печаткою й дві
   кнопки-печатки на порожньому пергаменті лівого верхнього кута (там само, де legend_art.inc гри: середина 13,5 %
   ширини, верх 432 / 1856 квадрата карти мінус смуга CROP), написи — похилим рубленим зі світлою обвідкою, як
   підписи карт гри; обрана — червона печатка й золотий напис. Більші, ніж у грі: карта на сторінці вужча за 2K.
   Видно лише на всій карті — у наближенні режим уже обрано */
.pw136-site .g-mapsw--luna { position: relative; container-type: inline-size; }
.pw136-site .g-mapsw .g-lmode { position: absolute; z-index: 6; left: 13.5%; top: 14.4%; translate: -50% 0; display: grid; grid-template-columns: auto; justify-items: start; gap: .3em; margin: 0; font-size: clamp(.8rem, 2.2cqi, 1.2rem); }
.pw136-site .g-mapsw--luna:has(> .g-mapview:not([data-map="group"]):not([data-map="solo"]):not(.is-off-view)) .g-lmode { display: none; }
.pw136-site .g-lmode-hdr { justify-self: center; margin: 0; color: #d6c092; font: italic 400 .74em/1.1 Arial, sans-serif; text-shadow: 0 0 2px rgb(8 6 4 / .9), 0 0 5px rgb(8 6 4 / .7); }
.pw136-site .g-lmode-rule { justify-self: center; display: block; width: 6.4em; height: .62em; margin-bottom: .12em; background: url('assets/guides/dolyna-sviashchennoho-misiatsia/marks/lg_bronze.svg') center / auto 100% no-repeat, linear-gradient(90deg, rgb(222 196 140 / 0), rgb(222 196 140 / .82) 50%, rgb(222 196 140 / 0)) center / 100% 1px no-repeat; }
.pw136-site .g-mapsw .g-lmode button { display: inline-flex; align-items: center; gap: .5em; padding: .08em .2em; border: 0; border-radius: 4px; background: none; color: #f6f0e2; font: italic 700 1em/1.15 Arial, sans-serif; text-shadow: 0 0 2px rgb(8 6 4 / .95), 0 0 5px rgb(8 6 4 / .85), 0 1px 1px #000; cursor: pointer; transition: color 150ms ease; }
.pw136-site .g-mapsw .g-lmode button i { flex: none; width: 1.25em; aspect-ratio: 1; background: url('assets/guides/dolyna-sviashchennoho-misiatsia/marks/lg_bronze.svg') center / contain no-repeat; }
.pw136-site .g-mapsw .g-lmode button:hover { color: #fffcf0; background: none; }
.pw136-site .g-mapsw .g-lmode button:hover i { background-image: url('assets/guides/dolyna-sviashchennoho-misiatsia/marks/lg_hover.svg'); }
.pw136-site .g-mapsw .g-lmode button[aria-selected="true"] { color: #f2c46a; background: none; }
.pw136-site .g-mapsw .g-lmode button[aria-selected="true"] i { background-image: url('assets/guides/dolyna-sviashchennoho-misiatsia/marks/lg_red.svg'); }
.pw136-site .g-mapsw .g-lmode button:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
/* на телефоні черта коротша: ширша за кнопки, вона заходила на край долини Чарівного Місяця */
@media (max-width: 520px) {
  .pw136-site .g-lmode-rule { width: 4.8em; }
}
/* Що падає в долині шляху чи маршруту — значки під назвою долини, назва речі при наведенні (data-label; display: none,
   а не прозорість — інакше підказка крайньої картки розширює сторінку вбік) */
.pw136-site .g-res { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem; margin: .35rem 0 0; }
.pw136-site .g-res-el { min-width: 3.4rem; margin-right: .2rem; color: var(--accent-hover); font: 600 .82rem/1.2 var(--heading); font-style: normal; }
.pw136-site .g-res-i { position: relative; display: block; width: 1.75rem; aspect-ratio: 1; }
.pw136-site .g-res-i img { display: block; width: 100%; height: 100%; border-radius: 6px; }
.pw136-site .g-res-i::after { content: attr(data-label); position: absolute; left: 50%; bottom: calc(100% + .35rem); z-index: 5; translate: -50% 0; display: none; padding: .3rem .65rem; border: 1px solid var(--line-strong); border-radius: 8px; background: rgb(14 10 7 / .95); color: var(--text); font: 400 .8rem/1.25 var(--font); white-space: nowrap; pointer-events: none; }
.pw136-site .g-res-i:hover::after { display: block; }
/* Вікно з картою (script.js, слот .g-bpop-map): ліворуч копія наближення з печаткою, що світиться, праворуч — хто це й
   що дає. Висота вікна задана, карта 4:3 вписується в неї; до 860 px — карта зверху, опис під нею */
.pw136-site .g-bpop.is-map .g-bpop-win { --mh: min(86vh, 46rem); display: grid; grid-template-columns: auto minmax(17rem, 24rem); grid-template-rows: auto minmax(0, 1fr); width: auto; max-width: 100%; height: var(--mh); max-height: none; }
.pw136-site .g-bpop-map { box-sizing: content-box; grid-row: 1 / 3; grid-column: 1; align-self: center; width: min(calc((var(--mh) - 2rem) * 4 / 3), calc(100vw - 34px - 19rem - 2rem)); padding: 1rem; }
.pw136-site .g-bpop-map[hidden] { display: none; }
.pw136-site .g-bpop-map .g-wmap-box { container-type: inline-size; }
.pw136-site .g-bpop.is-map .g-bpop-head, .pw136-site .g-bpop.is-map .g-bpop-body { grid-column: 2; }
.pw136-site .g-bpop-map .g-mk:not([data-kind]) { cursor: default; }
.pw136-site .g-bpop-map .g-mk.is-picked { z-index: 3; }
.pw136-site .g-bpop-map .g-mk.is-picked .g-mk-tip { display: block; animation: g-mk-pick 420ms ease-out both; }
@media (max-width: 860px) {
  .pw136-site .g-bpop.is-map .g-bpop-win { display: flex; height: auto; max-height: 92vh; overflow-y: auto; }
  .pw136-site .g-bpop-map { box-sizing: border-box; width: 100%; padding: .75rem .75rem 0; }
  .pw136-site .g-bpop.is-map .g-bpop-body { overflow: visible; }
}

/* ===== Сторінка тестувальника (tester.html, прихована адреса; з 03.11.2026). Основа — класи посібників g-. ===== */
.pw136-site .t-hero-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 31rem); align-items: center; }
.pw136-site .t-hero-grid .g-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 1rem; }
.pw136-site .t-hero-grid .g-facts li:nth-child(3) { padding-left: 0; border-left: 0; }
.pw136-site .g-page kbd { display: inline-block; min-width: 1.9em; padding: .12em .5em .16em; border: 1px solid var(--line-strong); border-bottom-width: 2px; border-radius: 5px; background: var(--raised); color: var(--text); font: 600 .86em/1.3 var(--heading); text-align: center; }
/* Форма реєстрації */
.pw136-site .t-reg { position: relative; padding: clamp(1.4rem, 2.2vw, 2rem); border: 1px solid rgb(255 122 26 / .2); border-radius: 14px; background: radial-gradient(120% 90% at 0% 0%, rgb(255 120 40 / .1), transparent 55%), linear-gradient(180deg, #17120e, #100d0b); box-shadow: inset 0 1px 0 rgb(255 170 100 / .06), 0 18px 48px rgb(0 0 0 / .35); }
.pw136-site .g-page .t-reg-title { margin: 0; font-size: 1.45rem; letter-spacing: -.015em; }
.pw136-site .g-page .t-reg-title::before { display: none; }
.pw136-site .t-reg-lead { margin-top: .45rem; color: var(--muted); font-size: .95rem; line-height: 1.5; }
.pw136-site .t-form { display: grid; gap: 1rem; margin-top: 1.4rem; }
.pw136-site .t-field { display: grid; gap: .4rem; min-width: 0; }
.pw136-site .t-field label { color: var(--body); font-size: .9rem; }
.pw136-site .t-optional { margin-left: .35rem; color: var(--soft); font-size: .8rem; }
.pw136-site .t-field input { box-sizing: border-box; width: 100%; min-height: 46px; padding: .6rem .85rem; border: 1px solid var(--line-strong); border-radius: 6px; background: #0d0b09; color: var(--text); font: 1rem/1.4 var(--font); transition: border-color 150ms ease, box-shadow 150ms ease; }
.pw136-site .t-field input::placeholder { color: #6f655b; }
.pw136-site .t-field input:hover { border-color: #4a4037; }
.pw136-site .t-field input:focus-visible { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px rgb(255 122 26 / .16); }
.pw136-site .t-field input[aria-invalid="true"] { border-color: #e0663a; }
.pw136-site .t-field small { color: var(--soft); font-size: .8rem; line-height: 1.4; }
.pw136-site .t-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.pw136-site .t-submit { width: 100%; margin-top: .3rem; cursor: pointer; }
.pw136-site .t-submit:disabled { cursor: progress; opacity: .7; transform: none; }
.pw136-site .t-form-error { color: #ffb08a; font-size: .9rem; }
.pw136-site .t-result { padding: .85rem 1rem; border: 1px solid rgb(224 102 58 / .45); border-radius: 8px; background: rgb(224 102 58 / .08); color: var(--text); font-size: .92rem; line-height: 1.5; }
.pw136-site .t-result.is-ok { border-color: var(--accent-line); background: var(--accent-soft); }
.pw136-site .t-reg-perks { list-style: none; padding: 1.1rem 0 0; margin-top: 1.4rem; display: grid; gap: .55rem; border-top: 1px solid var(--line); color: var(--muted); font-size: .88rem; }
.pw136-site .t-reg-perks li { position: relative; padding-left: 1.1rem; }
.pw136-site .t-reg-perks li::before { content: ''; position: absolute; left: 0; top: .6em; width: 6px; height: 6px; border-radius: 1px; background: var(--accent); transform: rotate(45deg); }
.pw136-site .t-reg-perks b { color: var(--text); font-weight: 400; }
/* Вікно адміністратора */
.pw136-site .t-abilities { list-style: none; padding: 0; margin-top: clamp(1.8rem, 3.5vw, 2.6rem); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-flow: dense; gap: 1rem; }
.pw136-site .t-ability { padding: 1.1rem 1.2rem; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.pw136-site .t-ability h3 { font-size: 1.05rem; }
.pw136-site .t-ability p { margin-top: .35rem; color: var(--muted); font-size: .94rem; }
.pw136-site .t-ability .t-hint { color: var(--soft); font-size: .86rem; }
.pw136-site .t-ability--wide { grid-column: span 2; }
.pw136-site .t-ability--full { grid-column: 1 / -1; }
/* Команди */
.pw136-site .t-tools { display: flex; flex-wrap: wrap; align-items: center; gap: .8rem 1.2rem; margin-top: clamp(1.8rem, 3.5vw, 2.6rem); }
.pw136-site .t-tools[hidden] { display: none; }
.pw136-site .t-search { position: relative; flex: 1 1 22rem; max-width: 34rem; }
.pw136-site .t-search svg { position: absolute; left: .85rem; top: 50%; width: 18px; height: 18px; transform: translateY(-50%); fill: none; stroke: var(--soft); stroke-width: 1.8; stroke-linecap: round; pointer-events: none; }
.pw136-site .t-search input { box-sizing: border-box; width: 100%; min-height: 46px; padding: .6rem .9rem .6rem 2.6rem; border: 1px solid var(--line-strong); border-radius: 999px; background: #0d0b09; color: var(--text); font: 1rem/1.4 var(--font); }
.pw136-site .t-search input:focus-visible { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px rgb(255 122 26 / .16); }
.pw136-site .t-count { color: var(--soft); font-size: .9rem; }
.pw136-site .t-sr { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.pw136-site .t-filters { display: flex; flex-wrap: wrap; gap: .5rem; width: 100%; }
.pw136-site .t-filter { display: inline-flex; align-items: center; gap: .45rem; min-height: 38px; padding: .3rem .9rem; border: 1px solid var(--line-strong); border-radius: 999px; background: transparent; color: var(--body); font: .9rem/1.3 var(--font); cursor: pointer; transition: border-color 150ms ease, color 150ms ease, background 150ms ease; }
.pw136-site .t-filter span { color: var(--soft); font-size: .8rem; }
.pw136-site .t-filter:hover { border-color: var(--accent-line); color: var(--text); }
.pw136-site .t-filter[aria-pressed="true"] { border-color: var(--accent-line); background: var(--accent-soft); color: var(--text); }
.pw136-site .t-filter:focus-visible, .pw136-site .t-copy:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.pw136-site .t-group { margin-top: clamp(2.2rem, 4vw, 3.2rem); }
.pw136-site .t-group[hidden] { display: none; }
.pw136-site .t-group-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .3rem 1rem; padding-bottom: .8rem; border-bottom: 1px solid var(--line); }
.pw136-site .t-group-head h3 { font-size: 1.3rem; letter-spacing: -.01em; }
.pw136-site .t-group-head p { color: var(--soft); font-size: .9rem; }
.pw136-site .t-cmds { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 19rem), 1fr)); gap: 1rem; margin-top: 1.1rem; }
.pw136-site .t-cmd { display: flex; flex-direction: column; gap: .55rem; min-width: 0; padding: 1.05rem 1.15rem 1.1rem; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.pw136-site .t-cmd[hidden] { display: none; }
.pw136-site .t-cmd-head { display: flex; align-items: baseline; justify-content: space-between; gap: .8rem; }
.pw136-site .t-cmd-head h4 { margin: 0; color: var(--text); font: 600 1.02rem/1.35 var(--heading); }
.pw136-site .t-cmd-id { flex: none; color: var(--soft); font-size: .8rem; font-variant-numeric: tabular-nums; }
.pw136-site .t-cmd-effect { color: var(--body); font-size: .95rem; line-height: 1.5; }
.pw136-site .t-code { display: flex; align-items: stretch; gap: .5rem; }
.pw136-site .t-code code { flex: 1 1 auto; min-width: 0; padding: .5rem .75rem; border: 1px solid var(--line-strong); border-radius: 6px; background: #0d0b09; color: #ffd9b8; font: .95rem/1.4 Consolas, 'Cascadia Mono', monospace; overflow-wrap: anywhere; }
.pw136-site .t-copy { flex: none; min-width: 6.6rem; padding: .3rem .8rem; border: 1px solid var(--accent-line); border-radius: 6px; background: transparent; color: var(--accent); font: .86rem/1.2 var(--font); cursor: pointer; transition: background 150ms ease, color 150ms ease; }
.pw136-site .t-copy[hidden] { display: none; }
.pw136-site .t-copy:hover { background: var(--accent-soft); color: var(--accent-hover); }
.pw136-site .t-copy.is-copied { color: var(--text); }
.pw136-site .t-cmd-hint { color: var(--soft); font-size: .86rem; line-height: 1.45; }
.pw136-site .t-cmd--caution { border-color: rgb(224 102 58 / .38); }
.pw136-site .t-caution { align-self: flex-start; padding: .1rem .55rem; border: 1px solid rgb(224 102 58 / .45); border-radius: 999px; color: #ffb08a; font-size: .76rem; letter-spacing: .04em; }
.pw136-site .t-empty { margin-top: 2rem; padding: 1.4rem; border: 1px dashed var(--line-strong); border-radius: 12px; color: var(--muted); text-align: center; }
.pw136-site .t-empty[hidden] { display: none; }
.pw136-site .t-empty button { margin-top: .8rem; padding: .45rem 1rem; border: 1px solid var(--accent-line); border-radius: 6px; background: transparent; color: var(--accent); font: .9rem/1.3 var(--font); cursor: pointer; }
/* Предмети ГМа */
/* 11 предметів + набір на 2 клітинки = 12: сітка 6, 4, 3 або 2 колонки закривається без дірки. */
.pw136-site .t-items { list-style: none; padding: 0; margin-top: clamp(1.8rem, 3.5vw, 2.6rem); display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; }
.pw136-site .t-item { display: grid; grid-template-columns: 52px minmax(0, 1fr); gap: .35rem 1rem; align-content: start; padding: 1rem 1.15rem; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.pw136-site .t-item > img { grid-row: span 3; width: 52px; height: 52px; border: 1px solid var(--line-strong); border-radius: 6px; background: #0d0b09; }
.pw136-site .t-item h3 { display: flex; align-items: baseline; justify-content: space-between; gap: .8rem; font-size: 1rem; line-height: 1.35; }
.pw136-site .t-item h3 span { flex: none; color: var(--soft); font: 400 .8rem/1.3 var(--font); font-variant-numeric: tabular-nums; }
.pw136-site .t-item p { color: var(--muted); font-size: .9rem; line-height: 1.5; }
.pw136-site .t-item .t-code { margin-top: .25rem; }
.pw136-site .t-item--main { grid-column: span 2; border-color: var(--accent-line); background: linear-gradient(180deg, rgb(255 122 26 / .07), transparent 70%), var(--surface); }
/* Властивості для d 10804: прикраси й зброя стовпчиком зліва, довше спорядження справа на два ряди. */
.pw136-site .t-addons { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-flow: dense; gap: 1rem; margin-top: clamp(1.8rem, 3.5vw, 2.6rem); }
.pw136-site .t-addon-set--tall { grid-column: 2; grid-row: span 2; }
.pw136-site .t-addon-set { padding: 1.1rem 1.2rem; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.pw136-site .t-addon-set h3 { font-size: 1.05rem; }
.pw136-site .t-addon-set h3 span { display: block; margin-top: .15rem; color: var(--soft); font: 400 .82rem/1.3 var(--font); }
.pw136-site .t-addon-row { margin-top: .9rem; }
.pw136-site .t-addon-row p { color: var(--muted); font-size: .88rem; }
.pw136-site .t-addon-row ul { list-style: none; padding: 0; margin-top: .4rem; display: flex; flex-wrap: wrap; gap: .4rem; }
.pw136-site .t-addon-row li { display: inline-flex; align-items: baseline; gap: .4rem; padding: .2rem .6rem; border: 1px solid var(--line-strong); border-radius: 6px; color: var(--body); font-size: .86rem; }
.pw136-site .t-addon-row code { color: #ffd9b8; font: .86rem/1.3 Consolas, 'Cascadia Mono', monospace; }
/* Повідомлення про копіювання */
.pw136-site .t-toast { position: fixed; z-index: 100; left: 50%; bottom: 24px; max-width: min(30rem, calc(100% - 32px)); padding: .8rem 1.1rem; border: 1px solid var(--accent-line); border-radius: 8px; background: var(--raised); color: var(--text); font-size: .92rem; box-shadow: 0 8px 32px rgb(0 0 0 / .6); transform: translate(-50%, 12px); opacity: 0; visibility: hidden; transition: opacity 160ms ease, transform 160ms ease, visibility 0s linear 160ms; }
.pw136-site .t-toast.is-visible { opacity: 1; visibility: visible; transform: translate(-50%, 0); transition-delay: 0s; }
@media (min-width: 2200px) {
  .pw136-site .t-items { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}
@media (max-width: 1400px) {
  .pw136-site .t-items { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 1100px) {
  .pw136-site .t-abilities { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pw136-site .t-items { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .pw136-site .t-hero-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 760px) {
  .pw136-site .t-addons { grid-template-columns: minmax(0, 1fr); }
  .pw136-site .t-addon-set--tall { grid-column: auto; grid-row: auto; }
}
@media (max-width: 640px) {
  .pw136-site .t-pair, .pw136-site .t-abilities, .pw136-site .t-items { grid-template-columns: minmax(0, 1fr); }
  .pw136-site .t-ability--wide, .pw136-site .t-item--main { grid-column: auto; }
  .pw136-site .t-code { flex-direction: column; }
  .pw136-site .t-copy { min-height: 40px; }
}
@media (prefers-reduced-motion: reduce) {
  .pw136-site .t-toast, .pw136-site .t-field input, .pw136-site .t-filter, .pw136-site .t-copy { transition: none; }
}

/* Частини теми WordPress, яких немає в макеті. Збирач дописує цей файл у кінець style.css. */

/* Новина: текст і бічна колонка утворюють один центрований блок. */
.pw136-site .news-article, .pw136-site .news-article + .editorial-cta { max-width: 1400px; }
.pw136-site .news-article .article-layout { grid-template-columns: minmax(0,1fr) 320px; column-gap: clamp(32px,3vw,48px); }
.pw136-site .news-article .article-body { max-width: none; }
@media (max-width: 1280px) {
  .pw136-site .news-article .article-layout { grid-template-columns: minmax(0,1fr) 280px; column-gap: 32px; }
}
@media (max-width: 920px) {
  .pw136-site .news-article .article-layout { grid-template-columns: minmax(0,1fr); }
}

/* Кнопка кабінету й перемикач мови займають одне місце в рядку шапки. */
.pw136-site .header-tools { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }

/* Перемикач мови: поточна мова акцентом, друга приглушена; риска між ними. */
.pw136-site .lang-switch { display: inline-flex; align-items: center; font: 600 13px/1 var(--heading); letter-spacing: 1px; }
.pw136-site .lang-switch > a, .pw136-site .lang-switch > span { position: relative; display: inline-flex; align-items: center; justify-content: center; min-width: 40px; min-height: 40px; color: var(--muted); transition: color 150ms cubic-bezier(.4,0,.2,1); }
.pw136-site .lang-switch > * + *::before { content: ''; position: absolute; left: 0; top: 50%; width: 1px; height: 14px; margin-top: -7px; background: var(--line); }
.pw136-site .lang-switch > [aria-current] { color: var(--accent); }
.pw136-site .lang-switch > a:hover, .pw136-site .lang-switch > a:focus-visible { color: var(--text); }

/* До 1280 точок рядок шапки тісний: лишається одне посилання на другу мову (EN на українській, UA на англійській). */
@media (max-width: 1280px) {
  .pw136-site .lang-switch > [aria-current], .pw136-site .lang-switch > * + *::before { display: none; }
}
/* 921-1100: меню, перемикач і кабінет уміщаються в один рядок лише з трохи тіснішими відступами (замір 2026-09-28). */
@media (min-width: 921px) and (max-width: 1100px) {
  .pw136-site .header-inner { gap: 12px; }
  .pw136-site .main-nav { gap: 16px; }
  .pw136-site .header-tools { gap: 8px; }
}

/* Онлайн на головній (inc/era-stats.php): смуга — частка від повного навантаження, сервер недоступний —
   червона точка й 0, як у віджеті Genesis. Порожній рейтинг — без шапки колонок, напис посередині вільного
   місця панелі (рядок розтягується на висоту колонки новин). */
.pw136-site .online-bar > span { width: 0; transition: width .4s cubic-bezier(.4, 0, .2, 1); }
.pw136-site .online-widget[data-state="offline"] .live-dot { background: #ef4444; box-shadow: 0 0 0 4px rgb(239 68 68 / .14), 0 0 12px rgb(239 68 68 / .45); }
.pw136-site .online-widget[data-state="offline"] .online-count strong { color: #ef4444; }
.pw136-site .rank-table:has(tr.rank-empty) thead { display: none; }
.pw136-site .rank-table tbody tr.rank-empty td { width: auto; padding: 32px 0; text-align: center; vertical-align: middle; border-bottom: 0; color: var(--muted); font: inherit; font-size: 14px; }

/* Телефон і планшет: кнопка кабінету ховається в меню, перемикач лишається в рядку поруч із кнопкою «Меню». */
@media (max-width: 920px) {
  .pw136-site .header-tools { order: 1; margin-left: auto; margin-right: 8px; }
  .pw136-site .menu-toggle { order: 2; }
  .pw136-site .main-nav { order: 3; }
}