/* Страница «Своей игры» (/games/svoya-igra/) в мире «Биржа знаний» поверх /seo-pages.css: свой первый экран —
   слоган, карточка вопроса с перекидными цифрами и мини-табло набора «Классика»; разделы ниже — те же, в цветах
   мира (графит-олива, кремовые таблички, оранжевый). Макет: design-archive/2026-10-23/game-page-svoya/hybrid.html.
   Разметка — tools/lib/seo-pages.mjs (games.json world), скрипт — svoya.js. Автор: AlmazNurmukhametov */
.gw-svoya{--ink:#f1ead9;--accent:#ff8650;--muted:#c8cdbd;--quiet:#a9ae9f;--line:#e8ddbb26;--card:#1f271f;--cond:'Roboto Condensed','Golos Text',Arial,sans-serif;
  position:relative;background:#171d18;color:var(--ink)}
html:has(.gw-svoya){background:#171d18}
.gw-svoya a:focus-visible,.gw-svoya button:focus-visible,.gw-svoya summary:focus-visible{outline-color:var(--accent)}
/* арт мира за шапкой и первым экраном; к низу растворяется в фоне страницы */
.gw-bg{position:absolute;inset:0 0 auto;height:960px;overflow:hidden;pointer-events:none}
.gw-bg img{width:100%;height:100%;object-fit:cover;object-position:center 45%}
.gw-bg:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#141c16f7 0%,#192118f0 28%,#1a221acc 44%,#141c1655 72%),linear-gradient(0deg,#171d18 0%,transparent 26%,#171d1855 100%)}
.gw-svoya .header,.gw-svoya main,.gw-svoya .footer{position:relative}
.gw-svoya .header{background:transparent;border-bottom-color:var(--line)}
.gw-svoya .header nav,.gw-svoya .login-link{color:#d0d0c5}
.gw-svoya .code-link{border-color:#e8ddbb4d;background:#ffffff0d}
.gw-svoya .crumbs{color:var(--quiet);padding:16px 0 0}

/* первый экран */
.gw-svoya .gw-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,560px);gap:56px;align-items:start;padding:26px 0 54px}
.gw-copy{padding-top:26px}
.gw-svoya .gw-hero h1{display:flex;align-items:center;gap:12px;margin:0;font:600 15px/1.3 var(--cond);letter-spacing:2.5px;text-transform:uppercase;color:#d8dacb}
.gw-svoya .gw-hero h1:before{content:"";flex:none;height:1px;width:26px;background:var(--accent)}
.gw-slogan{font:750 clamp(58px,5.6vw,84px)/.95 var(--cond);letter-spacing:-2px;margin:18px 0}
.gw-slogan span{display:block;color:var(--accent)}
.gw-sub{font:500 23px/1.3 var(--cond);margin-bottom:12px}
.gw-svoya .gw-hero .lead{max-width:460px;color:#d3d5c9;font-size:16px;line-height:1.65}
.gw-svoya .gw-hero .actions{margin:24px 0 14px}
.gw-svoya .primary{min-width:240px;background:var(--accent);color:#192018;border:1px solid #ffbc8b;box-shadow:0 4px 0 #9f4b2b;border-radius:3px;padding:15px 26px;min-height:56px;font:700 18px var(--cond);letter-spacing:1px;text-transform:uppercase}
.gw-svoya .primary:hover{background:#ffa16f}
.gw-svoya .primary:active{transform:translateY(3px);box-shadow:0 1px 0 #9f4b2b}
.gw-svoya .gw-hero .micro{font-size:14px;color:#c9cdbf;max-width:460px;line-height:1.55}
.gw-svoya .gw-hero .micro b{color:var(--ink);font-weight:600}
.gw-svoya .status{color:var(--accent)}

/* карточка вопроса (лот) */
.gw-desk{position:relative;min-width:0;perspective:1200px}
.lot-label{display:flex;justify-content:space-between;align-items:center;gap:12px;white-space:nowrap;margin:0 6px 14px;font:600 12px var(--cond);letter-spacing:2px;color:#f1e7cb;text-transform:uppercase;text-shadow:0 2px 8px #000}
.lot-live{display:flex;align-items:center;gap:8px}
.lot-live:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 10px #ff7438aa;animation:gw-blink 1.6s infinite}
@keyframes gw-blink{50%{opacity:.35}}
.lot{position:relative;background:linear-gradient(110deg,#f7f0de,#e7dfc8);color:#243024;padding:24px 28px 22px;box-shadow:0 24px 52px #0009,0 3px 0 #aea58d,0 7px 0 #282d22;border:1px solid #e4d8b9}
.lot.swap{animation:gw-swap .5s ease-in-out}
@keyframes gw-swap{0%{transform:none}45%{transform:rotateX(88deg)}55%{transform:rotateX(88deg)}100%{transform:none}}
.lot:before,.lot:after{content:"";position:absolute;top:14px;width:7px;height:7px;border-radius:50%;background:#8a826d;box-shadow:inset 0 1px 3px #393b2d,0 1px 0 #fff}
.lot:before{left:13px}.lot:after{right:13px}
.lot-top{display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid #9a9c8766;padding-bottom:14px}
.lot-topic{font:700 22px var(--cond);text-transform:uppercase;letter-spacing:1px}
.lot-id{font:500 12px var(--cond);letter-spacing:2px;color:#5c6857;white-space:nowrap}
.lot-price{display:flex;gap:15px;align-items:center;padding:16px 0 12px}
.lot-digits{display:flex;gap:4px}
.lot-digit{display:grid;place-items:center;width:52px;height:70px;color:#f2ead8;background:linear-gradient(#3b4636 49.2%,#0c160d 49.2%,#0c160d 51%,#263321 51%);border-radius:4px;border:1px solid #172316;box-shadow:inset 0 2px 1px #67765b,0 2px 0 #11190e;font:700 60px/1 var(--cond)}
.lot-digit.flip{animation:gw-flip .4s ease-in}
@keyframes gw-flip{0%{transform:rotateX(0)}50%{transform:rotateX(90deg)}100%{transform:rotateX(0)}}
.lot-note{font:500 12px/1.4 var(--cond);color:#5c6554;letter-spacing:1px;text-transform:uppercase}
.gw-svoya .lot-q{font:650 29px/1.15 var(--cond);height:3.45em;overflow:hidden;letter-spacing:-.3px;color:#243024}
.lot-result{visibility:hidden;opacity:0;border-top:1px solid #a6aa9255;padding-top:12px;margin-top:6px;transition:opacity .3s}
.lot-result.show{visibility:visible;opacity:1}
.gw-svoya .lot-a{font:700 36px/1.1 var(--cond);color:#2f5a2d;height:1.1em;overflow:hidden}
.gw-svoya .lot-out{display:flex;gap:12px;margin-top:6px;font-size:12px;color:#243024}
.lot-out .yes{color:#3a5f30}.lot-out .no{color:#8a4228}
.gw-svoya .lot-help{font-size:12px;color:#5c6554;margin-top:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lot-reveal{width:100%;min-height:50px;background:#263322;color:#f7efd9;border:1px solid #142211;border-radius:3px;font:600 16px var(--cond);letter-spacing:.5px;margin-top:12px}
.lot-reveal:hover{background:#3b4d34}
.gw-svoya .lot-reveal:focus-visible{outline-color:#263322;outline-offset:3px}

/* мини-табло набора */
.gw-mini{margin-top:22px;padding:10px;border-radius:10px;background:linear-gradient(110deg,#b4b4a4,#f6f0dc 18%,#9b9d91 50%,#e6e1d2 90%);box-shadow:0 7px 0 #111613,0 14px 26px #0009}
.gw-market{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px;background:#0e1510;padding:7px;border-radius:4px;box-shadow:inset 0 3px 10px #000}
.gw-col{display:grid;grid-template-rows:34px repeat(5,30px);gap:4px;min-width:0}
.gw-theme{color:#252d27;background:linear-gradient(#f8f1df,#dbd6c6);display:flex;align-items:center;justify-content:center;text-align:center;padding:2px 4px;border-radius:2px;font:700 12px/1 var(--cond);box-shadow:inset 0 -2px 0 #bab7a9;overflow-wrap:anywhere}
.gw-cell{border:1px solid #080c09;border-radius:3px;color:#f2ebd7;display:flex;align-items:center;justify-content:center;background:linear-gradient(#343d33 0%,#293127 49%,#121b13 50%,#222b21 100%);box-shadow:inset 0 1px 1px #68705c66;font:700 16px/.9 var(--cond);letter-spacing:1px;text-shadow:0 1px 1px #000;transition:filter .15s}
.gw-cell:hover{filter:brightness(1.4)}
.gw-cell[aria-current=true]{background:linear-gradient(#ff9a6a,#ff8650 49%,#d96a3c 50%,#ff8650);color:#1b1b1b;text-shadow:none}
.gw-cell.done{color:#5d6a5b;text-shadow:none;background:#141b15}
.gw-mini-foot{display:flex;justify-content:space-between;gap:12px;margin:10px 4px 0;font-size:12px;color:#d2d1c1;text-shadow:0 2px 8px #000}

/* формат игры строкой вместо карточек фактов */
.gw-ticker{display:flex;align-items:center;justify-content:space-between;gap:16px;border-top:1px solid #b2b8a33b;border-bottom:1px solid #b2b8a33b;padding:19px 0;margin-bottom:65px;color:#e3dfcf;font:500 15px var(--cond)}
.gw-ticker span{display:flex;gap:10px;align-items:baseline}
.gw-ticker b{font-size:23px;font-weight:650;white-space:nowrap}
.gw-ticker i{width:3px;height:3px;background:var(--accent);border-radius:50%}

/* разделы ниже первого экрана — тот же текст в цветах «Биржи» */
.gw-svoya .eyebrow,.gw-svoya .section p.eyebrow{display:inline-block;font:700 12px var(--cond);letter-spacing:2.5px;color:#252d27;background:linear-gradient(#f8f1df,#dbd6c6);padding:5px 10px;border-radius:2px;box-shadow:inset 0 -3px 0 #bab7a9}
.gw-svoya .section h2,.gw-svoya .nexthead h2{font:650 40px/1.05 var(--cond);letter-spacing:-.6px}
.gw-svoya .section h2{margin:14px 0 20px}
.gw-svoya .section>h2:first-child{margin-top:0}
.gw-svoya .eyebrow+.bodycopy{margin-top:16px}
.gw-svoya .lead,.gw-svoya .section p,.gw-svoya .step p,.gw-svoya .needs p,.gw-svoya .faq p,.gw-svoya .tips,.gw-svoya .cardcopy p,.gw-svoya .section .rules,.gw-svoya .textlink{color:var(--muted)}
.gw-svoya .crumbs,.gw-svoya .micro,.gw-svoya .index a,.gw-svoya .footer,.gw-svoya .allgames,.gw-svoya .caption,.gw-svoya .artfoot,.gw-svoya .arthead,.gw-svoya .demo-note,.gw-svoya .rt-count,.gw-svoya .rt-note{color:var(--quiet)}
.gw-svoya .index strong,.gw-svoya .index a:first-of-type,.gw-svoya .faq summary:after,.gw-svoya .step:before{color:var(--accent)}
.gw-svoya .index,.gw-svoya .step,.gw-svoya .faq,.gw-svoya .faq details,.gw-svoya .nextgames,.gw-svoya .footer{border-color:#b2b8a333}
.gw-svoya .step:before{font:600 22px var(--cond)}
.gw-svoya .step h3{font:600 22px/1.2 var(--cond)}
.gw-svoya .faq summary{font:600 20px/1.3 var(--cond)}
.gw-svoya .needs,.gw-svoya .tip,.gw-svoya .ratings,.gw-svoya .art,.gw-svoya .gamecard,.gw-svoya .gamecard .cardpic{background:var(--card);border-color:#e8ddbb21}
.gw-svoya .tip p{font:500 23px/1.4 var(--cond);color:#efe3cd}
.gw-svoya .tip small{color:var(--quiet)}
.gw-svoya .index strong,.gw-svoya .arthead{font-size:11px}
.gw-svoya .gamecard h3{font:650 22px var(--cond)}
.gw-svoya .thumb{background:#ffffff0d;border-color:#e8ddbb33}
.gw-svoya .thumb[aria-current=true]{border-color:var(--accent);background:#ffffff1a}
.gw-svoya .rt-value strong{font-family:var(--cond);font-weight:700;color:var(--accent)}
.gw-svoya .rt-hist i{background:linear-gradient(90deg,var(--accent) var(--w),#ffffff14 var(--w))}

/* пример хода: три шага, у последнего — оранжевая черта */
.gw-seq{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.gw-step{border-top:2px solid #65715d;padding:18px 0 0}
.gw-step:last-child{border-color:var(--accent)}
.gw-step-top{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:10px}
.gw-step small{font:600 12px var(--cond);letter-spacing:2px;color:#9fa98f;text-transform:uppercase}
.gw-step em{font:600 22px var(--cond);font-style:normal;color:var(--accent)}
.gw-svoya .gw-step h3{font:600 24px/1.2 var(--cond);margin-bottom:7px}
.gw-svoya .gw-step p{font-size:15px;line-height:1.6;color:#bec5b3}

@media(max-width:1000px){.gw-svoya .gw-hero{grid-template-columns:1fr;gap:30px}.gw-copy{padding-top:6px}.gw-seq{grid-template-columns:1fr}}
@media(max-width:760px){
  .gw-bg{top:200px;height:760px}
  .gw-bg img{object-position:60% center;opacity:.7}
  .gw-bg:after{background:linear-gradient(180deg,#182019 0%,#182019ed 35%,#18201955 60%,#171d18 100%)}
  .gw-svoya .gw-hero{padding:6px 0 40px}
  .gw-slogan{font-size:54px;margin:12px 0}.gw-slogan span{display:inline}
  .gw-sub{font-size:20px}
  .gw-svoya .gw-hero .lead{font-size:15px}
  .gw-svoya .primary{width:100%}
  .lot{padding:20px}.lot.swap{animation:none}
  .lot-digit{width:42px;height:56px;font-size:46px}
  .gw-svoya .lot-q{font-size:25px;height:4.6em}
  .gw-svoya .lot-a{font-size:26px;height:2.2em}
  .lot-label>span:last-child{display:none}
  .gw-col{grid-template-rows:30px repeat(5,32px)}.gw-theme{font-size:11px;padding:2px}.gw-cell{font-size:14px}
  .gw-mini-foot{flex-direction:column;gap:2px}
  .gw-ticker{display:grid;grid-template-columns:1fr 1fr;gap:14px 12px;margin-bottom:40px}.gw-ticker span{flex-direction:column;gap:0;line-height:1.25}.gw-ticker i{display:none}
  .gw-svoya .section h2,.gw-svoya .nexthead h2{font-size:32px}
}
@media(prefers-reduced-motion:reduce){.lot-live:before,.lot.swap,.lot-digit.flip{animation:none}.lot-result,.gw-cell{transition:none}}