/* Раздел «Игры дома» кабинета родителя. Разметку строит cabinet-games.js. */
.games-promo{min-height:0;flex-direction:row;align-items:center;gap:18px;margin-bottom:16px}
.games-promo img{width:150px;aspect-ratio:4/3;object-fit:cover;border-radius:14px;flex:none}
.games-promo h2{font-size:1.25rem;letter-spacing:-.02em;margin:0 0 4px}
.games-promo p{margin:0;color:var(--muted)}
.games-promo .cabinet-button{margin:0 0 0 auto;align-self:center}
.nav-item .g-new{margin-left:auto;font-size:.68rem;font-weight:800;background:var(--lime);color:var(--ink);padding:2px 7px;border-radius:999px}
.g-hero{padding:26px 30px;margin-bottom:18px;border-radius:30px;background:linear-gradient(120deg,#e8f4bc,#dff4ed)}
.g-hero h1{font-size:clamp(1.7rem,3vw,2.4rem);line-height:1.08;letter-spacing:-.04em;margin:0 0 8px}
.g-hero h1:focus{outline:none}
.g-hero p{margin:0;color:var(--muted);max-width:62ch}
.g-hero .g-note{margin-top:10px;font-size:.88rem;color:var(--green-dark);font-weight:700}
.g-lang-note{margin:0 0 14px;padding:10px 14px;border-radius:14px;background:var(--blue);font-size:.92rem}
.g-tabs{display:flex;gap:8px;margin:0 0 18px;flex-wrap:wrap}
.g-tab{min-height:44px;padding:0 18px;border-radius:999px;border:1px solid var(--line);background:#fff;color:var(--ink);font:inherit;font-weight:800;cursor:pointer}
.g-tab[aria-selected=true]{background:var(--green);border-color:var(--green);color:#fff}
.g-tab small{font-weight:700;opacity:.7;margin-left:4px}
.g-pane{display:none}.g-pane.active{display:block}
.g-card{background:#fff;border:1px solid var(--line);border-radius:22px;box-shadow:0 8px 26px rgba(23,60,51,.055);padding:22px}
.g-card+.g-card{margin-top:18px}
.g-card h2{font-size:1.25rem;letter-spacing:-.02em;margin:0}
.g-head{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-bottom:16px}
.g-head p{margin:2px 0 0;color:var(--muted);font-size:.95rem}
.g-head .cabinet-button{margin:0;align-self:center}
.g-plan{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;gap:10px;align-items:stretch}
.g-arrow{align-self:center;color:var(--lime-strong);font-size:1.6rem;font-weight:800}
.g-tile{display:flex;flex-direction:column;text-align:left;padding:0;border:1px solid var(--line);border-radius:18px;background:#fff;overflow:hidden;cursor:pointer;font:inherit;color:inherit;transition:box-shadow .2s,border-color .2s}
.g-tile:hover,.g-tile:focus-visible{border-color:var(--green);box-shadow:0 10px 24px rgba(23,107,87,.14)}
.g-tile img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;background:var(--mint)}
.g-tile-body{padding:12px 14px 14px;display:flex;flex-direction:column;gap:6px;flex:1}
.g-step{font-size:.76rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.g-tile strong{font-size:1.05rem;line-height:1.25}
.g-tile-need{color:var(--muted);font-size:.88rem;line-height:1.35}
.g-badges{display:flex;gap:6px;flex-wrap:wrap;margin-top:auto;padding-top:4px}
.g-badge{font-size:.76rem;font-weight:800;padding:3px 9px;border-radius:999px;background:var(--paper);border:1px solid var(--line);color:var(--ink);white-space:nowrap}
.g-badge.p-calm{background:var(--mint);border-color:#c4e2d3}
.g-badge.p-mid{background:var(--lime);border-color:#cfe0a8}
.g-badge.p-act{background:#f8e6c8;border-color:#ecd3a5;color:#5d3d0c}
.g-badge.liked{background:#fff;border-color:var(--green);color:var(--green-dark)}
.g-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(218px,1fr));gap:14px}
.g-filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.g-chip{min-height:38px;padding:0 13px;border-radius:999px;border:1px solid var(--line);background:#fff;color:var(--ink);font:inherit;font-size:.9rem;font-weight:700;cursor:pointer}
.g-chip[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:#fff}
.g-group-lead{color:var(--muted);margin:0 0 16px;min-height:1.6em}
.g-stop{display:flex;gap:16px;align-items:center;background:#fdf4e2;border:1px solid #f0dcb4;border-radius:22px;padding:16px 20px;margin:18px 0}
.g-stop img{width:132px;aspect-ratio:4/3;object-fit:cover;border-radius:14px;flex:none}
.g-stop strong{display:block;margin-bottom:2px}
.g-stop p{margin:0;color:#5d4a22;font-size:.95rem}
.g-link{border:0;background:none;padding:0;color:var(--green-dark);font:inherit;font-weight:800;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.g-empty{color:var(--muted);margin:0}
.g-notes{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.g-notes li{display:grid;grid-template-columns:64px 1fr auto;gap:14px;align-items:center;padding:10px;border:1px solid var(--line);border-radius:16px}
.g-notes img{width:64px;height:48px;object-fit:cover;border-radius:10px}
.g-notes small{display:block;color:var(--muted);overflow-wrap:anywhere}
.g-notes-foot{display:flex;gap:14px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-top:16px;color:var(--muted);font-size:.9rem}
.g-rules{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px}
.g-rule{border:1px solid var(--line);border-radius:18px;overflow:hidden;background:#fff}
.g-rule img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}
.g-rule div{padding:12px 14px 14px}
.g-rule strong{display:block;margin-bottom:2px}
.g-rule p{margin:0;color:var(--muted);font-size:.93rem}
.g-list{margin:0;padding-left:20px;color:var(--ink)}
.g-list li{margin:4px 0}
.g-ol{margin:0;padding-left:22px;columns:2;column-gap:34px}
.g-ol li{margin:0 0 8px;break-inside:avoid}
dialog.g-dialog{border:0;padding:0;border-radius:26px;width:min(1040px,calc(100vw - 28px));max-height:calc(100vh - 28px);color:var(--ink);box-shadow:0 30px 90px rgba(21,62,52,.3);overflow:hidden}
dialog.g-dialog::backdrop{background:rgba(21,62,52,.45)}
dialog.g-dialog.gate{width:min(640px,calc(100vw - 28px))}
.g-detail{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);max-height:calc(100vh - 28px);overflow:auto}
.g-left{padding:22px 0 22px 22px}
.g-right{padding:22px 26px 22px 24px}
.g-pic{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;border-radius:18px;background:var(--mint)}
.g-detail-body h2{font-size:1.7rem;letter-spacing:-.03em;line-height:1.1;margin:0 0 10px;padding-right:48px}
.g-close{position:absolute;top:14px;right:14px;width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:#fff;font-size:1.3rem;line-height:1;cursor:pointer;color:var(--ink);z-index:2}
.g-sec{margin-top:16px}
.g-sec h3,.g-two h3{font-size:.78rem;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);margin:0 0 3px}
.g-sec p{margin:0}
.g-two{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}
.g-two div{background:var(--paper);border-radius:14px;padding:12px 14px}
.g-two p{margin:0;font-size:.95rem}
.g-stopbox{margin-top:16px;background:#fdf4e2;border:1px solid #f0dcb4;border-radius:14px;padding:12px 14px}
.g-stopbox h3{font-size:.78rem;letter-spacing:.05em;text-transform:uppercase;color:#7a5a17;margin:0 0 3px}
.g-stopbox p{margin:0;color:#4d3c17}
.g-after{margin-top:20px;border-top:1px solid var(--line);padding-top:16px}
.g-after h3{font-size:1.02rem;margin:0 0 10px}
.g-marks{display:flex;gap:8px;flex-wrap:wrap}
.g-mark{min-height:44px;padding:0 15px;border-radius:13px;border:1px solid #9db3aa;background:#fff;font:inherit;font-weight:800;color:var(--green-dark);cursor:pointer}
.g-mark[aria-pressed=true]{background:var(--green);border-color:var(--green);color:#fff}
.g-note-row{display:flex;gap:8px;margin-top:10px}
.g-note-row input{flex:1;min-width:0;min-height:48px;border:1px solid #9db3aa;border-radius:13px;padding:0 14px;font:inherit;color:var(--ink);background:#fff}
.g-note-row .cabinet-button{margin:0;align-self:auto}
.g-saved{margin:8px 0 0;color:var(--green-dark);font-weight:700;font-size:.92rem;min-height:1.4em}
.g-gate{padding:28px 30px;position:relative}
.g-gate h2{font-size:1.6rem;letter-spacing:-.03em;line-height:1.15;margin:0 0 8px;padding-right:48px}
.g-gate p{margin:0 0 12px}
.g-gate label{display:flex;gap:10px;align-items:flex-start;margin:16px 0;font-weight:700;cursor:pointer}
.g-gate input{width:22px;height:22px;margin-top:2px;accent-color:var(--green);flex:none}
.g-gate .cabinet-button{margin:0}
@media(max-width:760px){
  .games-promo{flex-direction:column;align-items:stretch}
  .games-promo img{width:100%}
  .games-promo .cabinet-button{margin:0}
  .g-hero{padding:18px;border-radius:22px}
  .g-plan{grid-template-columns:1fr}
  .g-arrow{justify-self:center;transform:rotate(90deg);line-height:.6}
  .g-plan .g-tile{flex-direction:row}
  .g-plan .g-tile img{width:38%;aspect-ratio:1/1}
  .g-grid{grid-template-columns:1fr 1fr;gap:10px}
  .g-tile-need{display:none}
  .g-filters{flex-wrap:nowrap;overflow-x:auto;margin-inline:-14px;padding-inline:14px;scrollbar-width:none}
  .g-chip{white-space:nowrap}
  .g-stop{flex-direction:column;align-items:flex-start}
  .g-stop img{width:100%}
  .g-ol{columns:1}
  dialog.g-dialog{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;border-radius:0;margin:0}
  .g-detail{display:flex;flex-direction:column;max-height:none;height:100dvh;overflow:auto;padding-bottom:24px}
  .g-left,.g-right{display:contents}
  .g-pic{order:0;border-radius:0;flex:none}
  .g-detail-body{order:1;padding:18px 16px 0}
  .g-side{order:2;padding:0 16px}
  .g-after{order:3;margin:20px 16px 0}
  .g-two{grid-template-columns:1fr}
  .g-note-row{flex-direction:column}
  .g-notes li{grid-template-columns:56px 1fr}
  .g-notes li .g-badge{grid-column:2;justify-self:start}
  dialog.g-dialog.gate{width:100vw;height:auto;margin:auto 0 0;border-radius:22px 22px 0 0}
  .g-gate{padding:22px 18px}
}