/*
 * «Игры для компании»: mobile-first интерфейс каталога, комнат и админских
 * превью. Работает поверх общей палитры сайта, но не меняет старые страницы.
 */
:root {
    --party-bg: #08090b;
    --party-panel: #111318;
    --party-panel-2: #171a20;
    --party-panel-3: #1d2129;
    --party-ink: #f8f4ed;
    --party-muted: #aaa49b;
    --party-faint: #7d7a75;
    --party-line: rgba(255,255,255,.10);
    --party-line-strong: rgba(255,255,255,.17);
    --party-accent: #f47735;
    --party-accent-2: #ffb05d;
    --party-gold: #ffd99a;
    --party-good: #71d994;
    --party-danger: #f17369;
    --party-info: #70b7ff;
    --party-violet: #b29aff;
    --party-radius: 22px;
    --party-radius-sm: 14px;
    --party-shadow: 0 24px 80px rgba(0,0,0,.42);
    --safe-top: env(safe-area-inset-top, 0px);
    --safe-right: env(safe-area-inset-right, 0px);
    --safe-bottom: env(safe-area-inset-bottom, 0px);
    --safe-left: env(safe-area-inset-left, 0px);
}

html { scroll-behavior: smooth; }
body.party-page {
    min-width: 320px;
    color: var(--party-ink);
    background:
        radial-gradient(900px 520px at 48% -220px, rgba(244,119,53,.22), transparent 65%),
        radial-gradient(700px 480px at 100% 42%, rgba(99,71,158,.10), transparent 68%),
        linear-gradient(180deg, #090a0d 0, #08090b 55%, #070809 100%);
    background-attachment: fixed;
    overflow-x: hidden;
}
body.party-page::before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    opacity: .22;
    background-image: linear-gradient(rgba(255,255,255,.016) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.013) 1px, transparent 1px);
    background-size: 56px 56px;
    mask-image: linear-gradient(to bottom, #000, transparent 85%);
}
body.party-page button, body.party-page input, body.party-page select, body.party-page textarea { font: inherit; }
body.party-page button, body.party-page a { -webkit-tap-highlight-color: transparent; }
body.party-page a:hover { text-decoration: none; }
body.party-page [hidden] { display: none !important; }
.sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0,0,0,0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

/* Header */
.party-topbar {
    position: sticky;
    z-index: 50;
    top: 0;
    min-height: calc(70px + var(--safe-top));
    padding: calc(10px + var(--safe-top)) max(16px, var(--safe-right)) 10px max(16px, var(--safe-left));
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 18px;
    background: rgba(8,9,11,.78);
    border-bottom: 1px solid rgba(255,255,255,.07);
    backdrop-filter: blur(22px) saturate(130%);
}
.party-topbar--compact { min-height: calc(58px + var(--safe-top)); }
.party-logo {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--party-ink);
    min-height: 48px;
}
.party-logo__mark {
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    border-radius: 13px;
    color: #231008;
    font-size: 20px;
    background: linear-gradient(145deg, var(--party-accent-2), var(--party-accent));
    box-shadow: 0 10px 30px rgba(244,119,53,.24);
}
.party-logo > span:last-child { display: flex; flex-direction: column; line-height: 1.15; }
.party-logo strong { font-size: 15px; letter-spacing: -.01em; }
.party-logo small { margin-top: 3px; color: var(--party-muted); font-size: 10px; text-transform: uppercase; letter-spacing: .12em; }
.party-nav { display: flex; justify-content: center; gap: 4px; }
.party-nav a {
    min-height: 44px;
    padding: 0 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--party-muted);
    border-radius: 12px;
    font-size: 14px;
    font-weight: 650;
}
.party-nav a:hover, .party-nav a[aria-current="page"] { color: var(--party-ink); background: rgba(255,255,255,.07); }
.party-account { display: flex; align-items: center; gap: 9px; min-width: 0; }
.party-account__name { max-width: 120px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 13px; color: var(--party-muted); }

/* Base controls */
.party-main { position: relative; z-index: 1; width: min(1240px, 100%); margin: 0 auto; padding: 28px max(16px, var(--safe-right)) calc(80px + var(--safe-bottom)) max(16px, var(--safe-left)); }
.party-kicker { display: block; margin-bottom: 8px; color: var(--party-accent-2); font-size: 11px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.party-button, .party-link-button {
    min-height: 48px;
    padding: 0 19px;
    border: 0;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    color: #211007;
    background: linear-gradient(145deg, var(--party-accent-2), var(--party-accent));
    box-shadow: 0 12px 28px rgba(244,119,53,.20);
    cursor: pointer;
    font-weight: 800;
    font-size: 15px;
    line-height: 1.15;
    transition: transform .15s ease, filter .15s ease, box-shadow .15s ease;
}
.party-button:hover { filter: brightness(1.07); box-shadow: 0 15px 34px rgba(244,119,53,.28); }
.party-button:active { transform: translateY(1px) scale(.99); }
.party-button:disabled { cursor: wait; opacity: .58; filter: grayscale(.25); box-shadow: none; }
.party-button--ghost, .party-link-button {
    color: var(--party-ink);
    background: rgba(255,255,255,.055);
    border: 1px solid var(--party-line);
    box-shadow: none;
}
.party-button--ghost:hover, .party-link-button:hover { color: var(--party-ink); background: rgba(255,255,255,.10); border-color: var(--party-line-strong); }
.party-button--wide { width: 100%; }
.party-button--small { min-height: 42px; padding: 0 14px; font-size: 13px; border-radius: 12px; }
.party-button--card { width: 100%; min-height: 44px; margin-top: auto; }
.party-button--filter { color: var(--party-ink); background: rgba(255,255,255,.07); border: 1px solid var(--party-line); box-shadow: none; }
.party-button--filter span:not(:empty) { min-width: 20px; height: 20px; padding: 0 5px; display: inline-grid; place-items: center; background: var(--party-accent); color: #fff; border-radius: 999px; font-size: 11px; }
.party-field { display: grid; gap: 7px; margin-bottom: 15px; }
.party-field > span, .party-avatar-picker legend { color: var(--party-muted); font-size: 13px; font-weight: 650; }
.party-field input, .party-field select, .party-search input, .party-join-code input, .party-chat-form textarea {
    width: 100%;
    min-height: 50px;
    padding: 12px 14px;
    color: var(--party-ink);
    background: rgba(0,0,0,.30);
    border: 1px solid var(--party-line);
    border-radius: 13px;
    outline: none;
    font-size: 16px;
    transition: border-color .15s, box-shadow .15s, background .15s;
}
.party-field input:focus, .party-field select:focus, .party-search input:focus, .party-join-code input:focus, .party-chat-form textarea:focus {
    border-color: rgba(255,176,93,.60);
    box-shadow: 0 0 0 3px rgba(244,119,53,.14);
    background: rgba(0,0,0,.43);
}
.party-field select { appearance: none; background-image: linear-gradient(45deg,transparent 50%,var(--party-muted) 50%),linear-gradient(135deg,var(--party-muted) 50%,transparent 50%); background-position: calc(100% - 18px) 22px,calc(100% - 13px) 22px; background-size:5px 5px; background-repeat:no-repeat; }
.party-field select option { color: var(--party-ink); background: var(--party-panel); }
.party-form-status { min-height: 21px; margin-top: 10px; color: var(--party-muted); font-size: 13px; text-align: center; }
.party-form-status.is-error { color: #ffaaa3; }
.party-form-status.is-good { color: var(--party-good); }

/* Avatar */
.party-avatar {
    width: 38px;
    height: 38px;
    flex: 0 0 auto;
    display: inline-grid;
    place-items: center;
    color: white;
    border-radius: 13px;
    background: linear-gradient(145deg,#b34f2d,#662717);
    border: 1px solid rgba(255,255,255,.18);
    font-weight: 850;
    text-transform: uppercase;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.15);
}
.party-avatar--violet { background: linear-gradient(145deg,#9c73dc,#513780); }
.party-avatar--cyan { background: linear-gradient(145deg,#40a8bd,#245c78); }
.party-avatar--forest { background: linear-gradient(145deg,#5a9c72,#294e38); }
.party-avatar--sun { background: linear-gradient(145deg,#e6ad3c,#a45d1f); }
.party-avatar--moon { background: linear-gradient(145deg,#7789ba,#3f496f); }
.party-avatar--fox { background: linear-gradient(145deg,#db7e38,#7f3820); }
.party-avatar--owl { background: linear-gradient(145deg,#8a8070,#474039); }
.party-avatar-picker { margin: 0 0 16px; padding: 0; border: 0; }
.party-avatar-picker legend { margin-bottom: 8px; }
.party-avatar-picker { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.party-avatar-picker legend { grid-column: 1/-1; }
.party-avatar-picker label { position: relative; min-width: 0; padding: 9px 3px; display: grid; justify-items: center; gap: 4px; cursor: pointer; border: 1px solid var(--party-line); border-radius: 13px; background: rgba(255,255,255,.025); }
.party-avatar-picker label:has(input:checked) { border-color: rgba(255,176,93,.70); background: rgba(244,119,53,.10); box-shadow: 0 0 0 2px rgba(244,119,53,.10); }
.party-avatar-picker input { position: absolute; opacity: 0; pointer-events: none; }
.party-avatar-picker small { width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--party-faint); font-size: 9px; text-align: center; }

/* Catalog hero */
.party-hero {
    min-height: 420px;
    display: grid;
    grid-template-columns: minmax(0,1.35fr) minmax(290px,.65fr);
    align-items: center;
    gap: clamp(28px,6vw,90px);
    padding: clamp(32px,6vw,78px) clamp(0px,3vw,40px);
}
.party-hero__copy { max-width: 760px; }
.party-hero h1 { max-width: 760px; margin: 0 0 20px; font-size: clamp(40px,6.3vw,82px); line-height: .98; letter-spacing: -.055em; text-wrap: balance; }
.party-hero__copy > p { max-width: 680px; margin: 0; color: var(--party-muted); font-size: clamp(17px,2vw,21px); line-height: 1.55; }
.party-hero__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 28px; }
.party-join-code {
    padding: 24px;
    border: 1px solid var(--party-line);
    border-radius: var(--party-radius);
    background: linear-gradient(160deg,rgba(255,255,255,.07),rgba(255,255,255,.025));
    box-shadow: var(--party-shadow);
    backdrop-filter: blur(16px);
}
.party-join-code label { display: block; margin-bottom: 10px; color: var(--party-ink); font-size: 15px; font-weight: 750; }
.party-join-code > div { display: grid; grid-template-columns: 1fr auto; gap: 8px; }
.party-join-code input { text-transform: uppercase; letter-spacing: .15em; font-weight: 800; }
.party-join-code small { display: block; margin-top: 8px; color: var(--party-faint); font-size: 12px; }

/* Picker */
.party-picker, .party-catalog, .party-adult-panel {
    margin-top: 28px;
    border: 1px solid var(--party-line);
    border-radius: 28px;
    background: rgba(16,18,22,.82);
    box-shadow: var(--party-shadow);
    backdrop-filter: blur(12px);
}
.party-picker { padding: clamp(22px,4vw,42px); }
.party-section-heading { margin-bottom: 24px; display: flex; align-items: end; justify-content: space-between; gap: 16px; }
.party-section-heading h2, .party-catalog__toolbar h2 { margin: 0; font-size: clamp(27px,3.2vw,42px); line-height: 1.1; letter-spacing: -.035em; }
.party-section-heading .party-link-button { min-height: 40px; }
.party-picker__steps { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; }
.party-picker fieldset, .party-sheet fieldset { min-width: 0; margin: 0; padding: 17px; border: 1px solid var(--party-line); border-radius: 18px; background: rgba(0,0,0,.18); }
.party-picker legend, .party-sheet legend { padding: 0 6px; color: var(--party-ink); font-size: 14px; font-weight: 750; }
.party-picker legend span { width: 23px; height: 23px; margin-right: 6px; display: inline-grid; place-items: center; color: #211007; background: var(--party-accent-2); border-radius: 8px; font-size: 11px; }
.party-choice-row { display: flex; flex-wrap: wrap; gap: 7px; }
.party-choice-row button, .party-choice-row a, .party-category-strip button {
    min-height: 42px;
    padding: 0 13px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--party-muted);
    background: rgba(255,255,255,.045);
    border: 1px solid var(--party-line);
    border-radius: 12px;
    cursor: pointer;
    font-size: 12px;
    font-weight: 700;
    transition: color .15s, background .15s, border-color .15s, transform .15s;
}
.party-choice-row button:hover, .party-choice-row a:hover, .party-category-strip button:hover { color: var(--party-ink); background: rgba(255,255,255,.085); }
.party-choice-row button.is-active, .party-category-strip button.is-active { color: #241108; background: linear-gradient(145deg,var(--party-accent-2),var(--party-accent)); border-color: transparent; }

/* Catalog */
.party-catalog { padding: clamp(22px,4vw,42px); }
.party-catalog__toolbar { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 18px; }
.party-catalog__actions { display: flex; gap: 8px; }
.party-search { position: relative; display: block; }
.party-search input { min-width: 240px; padding-left: 42px; }
.party-search::before { content: "⌕"; position: absolute; z-index: 1; left: 14px; top: 11px; color: var(--party-muted); font-size: 20px; }
.party-chip-strip { min-height: 0; display: flex; gap: 7px; overflow-x: auto; scrollbar-width: none; }
.party-chip-strip:not(:empty) { margin-bottom: 14px; }
.party-chip-strip::-webkit-scrollbar, .party-category-strip::-webkit-scrollbar { display:none; }
.party-chip-strip button { min-width: max-content; min-height: 38px; padding: 0 11px; color: var(--party-ink); background: rgba(244,119,53,.13); border: 1px solid rgba(244,119,53,.30); border-radius: 999px; cursor: pointer; font-size: 12px; }
.party-chip-strip button::after { content: " ×"; color: var(--party-accent-2); }
.party-category-strip { display: flex; gap: 8px; padding-bottom: 16px; overflow-x: auto; scrollbar-width: none; }
.party-category-strip button { min-width: max-content; min-height: 44px; }
.party-category-strip button span { margin-right: 7px; }
/*
 * На широком экране категории переносим на вторую строку вместо горизонтальной
 * прокрутки. Полоса прокручивалась только пальцем: полосу прокрутки мы прячем,
 * колесо мыши крутит страницу, и крайние категории на десктопе оказывались
 * недостижимы. Перенос надёжнее стрелок — прятать нечего в принципе.
 */
@media (min-width: 760px) {
    .party-category-strip, .party-chip-strip { flex-wrap: wrap; overflow-x: visible; }
}
.party-game-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; }
.party-game-card { min-width: 0; overflow: hidden; display: flex; flex-direction: column; border: 1px solid var(--party-line); border-radius: 20px; background: linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.022)); transition: transform .18s ease,border-color .18s ease,box-shadow .18s ease; }
.party-game-card:hover { transform: translateY(-3px); border-color: rgba(255,176,93,.30); box-shadow: 0 20px 52px rgba(0,0,0,.30); }
.party-game-card.is-filtered { display:none; }
.party-game-card__cover { position: relative; min-height: 154px; padding: 13px; overflow: hidden; display: flex; align-items: center; justify-content: center; color: var(--party-ink); background:
    radial-gradient(circle at 70% 30%,rgba(255,180,90,.20),transparent 30%),
    radial-gradient(circle at 25% 80%,rgba(117,75,180,.25),transparent 36%),
    linear-gradient(145deg,#17131a,#0d1117);
}
.party-game-card:nth-child(4n+2) .party-game-card__cover { background: radial-gradient(circle at 70% 30%,rgba(73,165,180,.23),transparent 32%),radial-gradient(circle at 25% 80%,rgba(244,119,53,.20),transparent 38%),linear-gradient(145deg,#111b1e,#0d1015); }
.party-game-card:nth-child(4n+3) .party-game-card__cover { background: radial-gradient(circle at 70% 30%,rgba(113,217,148,.17),transparent 32%),radial-gradient(circle at 25% 80%,rgba(178,154,255,.22),transparent 38%),linear-gradient(145deg,#121a17,#0e1015); }
.party-game-card:nth-child(4n+4) .party-game-card__cover { background: radial-gradient(circle at 70% 30%,rgba(241,115,105,.17),transparent 32%),radial-gradient(circle at 25% 80%,rgba(112,183,255,.17),transparent 38%),linear-gradient(145deg,#1a1215,#0f1116); }
.party-game-card__cover::after { content:""; position:absolute; inset:0; background: linear-gradient(110deg,transparent 30%,rgba(255,255,255,.07),transparent 58%); transform: translateX(-110%); transition: transform .6s ease; }
.party-game-card:hover .party-game-card__cover::after { transform: translateX(110%); }
.party-game-card__glow { position:absolute; width:110px; height:110px; border-radius:50%; background:var(--party-accent); filter:blur(65px); opacity:.14; }
.party-game-card__icon { position:relative; z-index:1; min-width:68px; height:68px; padding:0 10px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.16); border-radius:23px; background:rgba(0,0,0,.25); box-shadow: inset 0 1px 0 rgba(255,255,255,.10),0 12px 36px rgba(0,0,0,.25); font-size:30px; font-weight:800; }
.party-badge { position:absolute; z-index:2; top:12px; left:12px; min-height:28px; padding:0 9px; display:inline-flex; align-items:center; border:1px solid rgba(255,255,255,.13); border-radius:999px; color:var(--party-ink); background:rgba(7,8,10,.70); backdrop-filter:blur(9px); font-size:10px; font-weight:800; text-transform:uppercase; letter-spacing:.06em; }
.party-badge--adult { left:auto; right:12px; color:#ffe2df; background:rgba(130,37,37,.72); }
.party-game-card__body { flex:1; padding:17px; display:flex; flex-direction:column; }
.party-game-card__eyebrow { margin-bottom:5px; color:var(--party-accent-2); font-size:10px; text-transform:uppercase; letter-spacing:.10em; font-weight:800; }
.party-game-card h3 { margin:0 0 7px; font-size:20px; line-height:1.18; letter-spacing:-.025em; }
.party-game-card h3 a { color:var(--party-ink); }
.party-game-card p { min-height:42px; margin:0 0 13px; color:var(--party-muted); font-size:13px; line-height:1.5; }
.party-meta-row { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:10px; }
.party-meta-row span { min-height:27px; padding:0 7px; display:inline-flex; align-items:center; border:1px solid var(--party-line); border-radius:8px; color:var(--party-muted); background:rgba(0,0,0,.16); font-size:10px; }
.party-tags { display:flex; flex-wrap:wrap; gap:5px; margin-bottom:14px; }
.party-tags span { padding:4px 7px; border-radius:7px; color:#c9c1b6; background:rgba(255,255,255,.05); font-size:9px; font-weight:650; }
.party-tags--large span { padding:7px 10px; border:1px solid var(--party-line); border-radius:10px; font-size:12px; }
.party-adult-panel { padding:22px clamp(22px,4vw,38px); display:flex; align-items:center; justify-content:space-between; gap:24px; background:linear-gradient(120deg,rgba(96,26,36,.34),rgba(27,20,27,.80)); }
.party-adult-panel > div { display:flex; align-items:center; gap:18px; }
.party-adult-panel__mark { width:60px; height:60px; flex:0 0 auto; display:grid; place-items:center; border:1px solid rgba(255,160,160,.23); border-radius:20px; color:#ffd6d1; background:rgba(143,36,45,.38); font-size:18px; font-weight:850; }
.party-adult-panel h2 { margin:0 0 4px; font-size:24px; }
.party-adult-panel p { margin:0; color:var(--party-muted); font-size:14px; }

/* Sheet and modal */
.party-filter-sheet, .party-modal { position:fixed; z-index:100; inset:0; display:grid; align-items:end; }
.party-sheet__scrim, .party-modal__scrim { position:absolute; inset:0; width:100%; height:100%; border:0; background:rgba(0,0,0,.72); backdrop-filter:blur(4px); cursor:pointer; }
.party-sheet { position:relative; z-index:1; width:min(620px,100%); max-height:min(88dvh,760px); margin:0 auto; overflow:auto; border:1px solid var(--party-line-strong); border-radius:26px 26px 0 0; background:#111318; box-shadow:0 -24px 80px rgba(0,0,0,.5); }
.party-sheet__handle { width:42px; height:4px; margin:9px auto 2px; border-radius:99px; background:rgba(255,255,255,.25); }
.party-sheet__head { position:sticky; z-index:2; top:0; padding:15px 20px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--party-line); background:rgba(17,19,24,.94); backdrop-filter:blur(16px); }
.party-sheet__head h2 { margin:0; font-size:22px; }
.party-sheet__head button,.party-modal__close { width:44px; height:44px; display:grid; place-items:center; color:var(--party-muted); background:rgba(255,255,255,.06); border:1px solid var(--party-line); border-radius:13px; cursor:pointer; font-size:25px; }
.party-sheet__body { padding:18px 20px; display:grid; gap:13px; }
.party-sheet__foot { position:sticky; bottom:0; padding:12px max(16px,var(--safe-right)) calc(12px + var(--safe-bottom)) max(16px,var(--safe-left)); display:grid; grid-template-columns:1fr 1.6fr; gap:8px; border-top:1px solid var(--party-line); background:rgba(17,19,24,.95); backdrop-filter:blur(18px); }
.party-toggle-list { display:grid; gap:8px; }
.party-toggle-list label { min-height:52px; padding:10px 12px; display:flex; align-items:center; gap:11px; border:1px solid var(--party-line); border-radius:13px; background:rgba(255,255,255,.025); cursor:pointer; }
.party-toggle-list input { width:21px; height:21px; flex:0 0 auto; accent-color:var(--party-accent); }
.party-toggle-list label > span { display:grid; gap:1px; }
.party-toggle-list b { color:var(--party-ink); font-size:13px; }
.party-toggle-list small { color:var(--party-faint); font-size:10px; }
.party-modal { align-items:center; padding:max(16px,var(--safe-top)) max(16px,var(--safe-right)) max(16px,var(--safe-bottom)) max(16px,var(--safe-left)); }
.party-modal__card { position:relative; z-index:1; width:min(440px,100%); max-height:calc(100dvh - 32px); overflow:auto; padding:27px; border:1px solid var(--party-line-strong); border-radius:26px; background:linear-gradient(165deg,#191c22,#101216); box-shadow:0 30px 100px rgba(0,0,0,.65); }
.party-modal__close { position:absolute; right:14px; top:14px; }
.party-modal__card h2 { margin:0 50px 8px 0; font-size:28px; letter-spacing:-.03em; }
.party-modal__card > p { margin:0 0 18px; color:var(--party-muted); font-size:14px; }

/* Empty/auth */
.party-empty { position:relative; z-index:1; min-height:70dvh; padding:70px 18px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; }
.party-empty--inline { min-height:300px; }
.party-empty--room { min-height:calc(100dvh - 72px); }
.party-empty__icon { width:76px; height:76px; margin-bottom:18px; display:grid; place-items:center; color:var(--party-accent-2); border:1px solid var(--party-line); border-radius:25px; background:rgba(255,255,255,.04); font-size:36px; }
.party-empty h1,.party-empty h2 { margin:0 0 10px; font-size:clamp(30px,6vw,48px); letter-spacing:-.04em; }
.party-empty h3 { margin:0 0 8px; font-size:26px; }
.party-empty p { max-width:560px; margin:0 0 22px; color:var(--party-muted); }
.party-auth-gate { max-width:620px; min-height:420px; margin:40px auto; padding:40px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; border:1px solid var(--party-line); border-radius:28px; background:rgba(16,18,22,.82); box-shadow:var(--party-shadow); }
.party-auth-gate > span { width:72px; height:72px; display:grid; place-items:center; color:var(--party-accent-2); border:1px solid var(--party-line); border-radius:24px; background:rgba(255,255,255,.04); font-size:34px; }
.party-auth-gate h2 { margin:18px 0 8px; font-size:30px; }
.party-auth-gate p { max-width:500px; margin:0 0 20px; color:var(--party-muted); }
.party-auth-gate > a:last-child { margin-top:16px; color:var(--party-muted); font-size:13px; }

/* Detail page */
.party-breadcrumb { display:flex; align-items:center; gap:8px; margin:4px 0 22px; color:var(--party-faint); font-size:13px; }
.party-breadcrumb a { color:var(--party-muted); }
.party-detail-hero { min-height:360px; padding:clamp(22px,4vw,44px); display:grid; grid-template-columns:minmax(220px,.58fr) minmax(0,1.42fr); align-items:center; gap:clamp(28px,5vw,70px); border:1px solid var(--party-line); border-radius:30px; background:linear-gradient(135deg,rgba(35,25,31,.94),rgba(15,18,24,.92)); overflow:hidden; box-shadow:var(--party-shadow); }
.party-detail-hero__cover { position:relative; aspect-ratio:1/1; max-width:320px; width:100%; justify-self:center; display:grid; place-items:center; border:1px solid rgba(255,255,255,.12); border-radius:30%; background:radial-gradient(circle at 70% 25%,rgba(255,176,93,.28),transparent 32%),radial-gradient(circle at 30% 80%,rgba(178,154,255,.23),transparent 35%),#11131a; box-shadow:0 30px 80px rgba(0,0,0,.40); }
.party-detail-hero__cover > span { font-size:clamp(70px,12vw,130px); }
.party-detail-hero__cover b { position:absolute; right:14px; top:14px; padding:7px 9px; border-radius:10px; color:#ffe2df; background:rgba(132,34,43,.78); font-size:13px; }
.party-detail-hero h1 { margin:0 0 8px; font-size:clamp(42px,6vw,72px); line-height:1; letter-spacing:-.055em; }
.party-detail-hero__lead { margin:0 0 15px !important; color:var(--party-ink) !important; font-size:clamp(18px,2.2vw,23px) !important; }
.party-detail-hero__copy > p { max-width:680px; margin:0; color:var(--party-muted); line-height:1.65; }
.party-detail-stats { display:flex; flex-wrap:wrap; gap:8px; margin:24px 0 16px; }
.party-detail-stats span { min-width:110px; padding:10px 12px; display:grid; border:1px solid var(--party-line); border-radius:13px; color:var(--party-faint); background:rgba(0,0,0,.18); font-size:10px; }
.party-detail-stats b { color:var(--party-ink); font-size:17px; }
.party-detail-layout { margin-top:20px; display:grid; grid-template-columns:minmax(0,1.3fr) minmax(300px,.7fr); align-items:start; gap:20px; }
.party-detail-main,.party-create-card { padding:clamp(20px,3vw,34px); border:1px solid var(--party-line); border-radius:26px; background:rgba(16,18,22,.82); box-shadow:var(--party-shadow); }
.party-create-card { position:sticky; top:92px; }
.party-create-card h2 { margin:0 0 5px; font-size:27px; }
.party-create-card form > p { margin:0 0 20px; color:var(--party-muted); font-size:13px; }
.party-create-card__or { position:relative; margin:17px 0; text-align:center; color:var(--party-faint); font-size:11px; }
.party-create-card__or::before { content:""; position:absolute; left:0; right:0; top:50%; height:1px; background:var(--party-line); }
.party-create-card__or span { position:relative; padding:0 10px; background:var(--party-panel); }
.party-mode-list { display:grid; gap:9px; }
.party-mode-card { position:relative; min-height:90px; padding:15px 46px 15px 16px; display:flex; align-items:center; border:1px solid var(--party-line); border-radius:17px; background:rgba(255,255,255,.025); cursor:pointer; transition:border-color .15s,background .15s; }
.party-mode-card:hover,.party-mode-card.is-selected,.party-mode-card:has(input:checked) { border-color:rgba(255,176,93,.48); background:rgba(244,119,53,.08); }
.party-mode-card input { position:absolute; opacity:0; }
.party-mode-card > span:nth-of-type(2) { display:grid; gap:3px; }
.party-mode-card strong { font-size:15px; }
.party-mode-card small { color:var(--party-muted); font-size:12px; }
.party-mode-card em { color:var(--party-accent-2); font-size:10px; font-style:normal; text-transform:uppercase; letter-spacing:.05em; }
.party-mode-card__check { position:absolute; right:14px; width:26px; height:26px; display:grid; place-items:center; border:1px solid var(--party-line); border-radius:9px; color:transparent; }
.party-mode-card:has(input:checked) .party-mode-card__check { color:#211007; border-color:transparent; background:var(--party-accent-2); }
.party-rules-card { margin-top:24px; padding:clamp(20px,3vw,30px); border:1px solid var(--party-line); border-radius:20px; background:rgba(0,0,0,.18); }
.party-rules-card h2 { margin:0 0 8px; }
.party-rules-card > p { color:var(--party-muted); }
.party-rules-content { color:var(--party-muted); }
.party-rules-content h2 { color:var(--party-ink); font-size:20px; }
.party-rules-content p,.party-rules-content li { font-size:14px; line-height:1.65; }
.party-rules-content ul { padding-left:20px; }

/* Footer */
.party-footer { position:relative; z-index:1; width:min(1240px,100%); margin:0 auto; padding:25px max(16px,var(--safe-right)) calc(28px + var(--safe-bottom)) max(16px,var(--safe-left)); display:flex; align-items:center; justify-content:space-between; gap:20px; border-top:1px solid var(--party-line); }
.party-footer > div { display:grid; }
.party-footer strong { font-size:14px; }
.party-footer span { color:var(--party-faint); font-size:11px; }
.party-footer nav { display:flex; flex-wrap:wrap; gap:16px; }
.party-footer a { color:var(--party-muted); font-size:12px; }

/* Room top and join */
.party-room-page { height:100%; min-height:100dvh; background:#08090b !important; }
.party-room-page::before { opacity:.12; }
.party-room-shell { position:relative; z-index:1; min-height:100dvh; display:flex; flex-direction:column; }
.party-room-topbar { position:sticky; z-index:60; top:0; min-height:calc(62px + var(--safe-top)); padding:calc(7px + var(--safe-top)) max(11px,var(--safe-right)) 7px max(11px,var(--safe-left)); display:grid; grid-template-columns:48px minmax(0,1fr) auto; align-items:center; gap:8px; border-bottom:1px solid var(--party-line); background:rgba(8,9,11,.90); backdrop-filter:blur(20px); }
.party-room-topbar__back { width:44px; height:44px; display:grid; place-items:center; color:var(--party-ink); border:1px solid var(--party-line); border-radius:13px; background:rgba(255,255,255,.04); font-size:31px; }
.party-room-topbar__title { min-width:0; display:grid; justify-items:center; line-height:1.1; }
.party-room-topbar__title strong { max-width:100%; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:14px; }
.party-room-topbar__title button { min-height:25px; padding:0; color:var(--party-faint); background:none; border:0; cursor:pointer; font-size:10px; text-transform:uppercase; letter-spacing:.08em; }
.party-connection { min-width:44px; min-height:38px; padding:0 8px; display:flex; align-items:center; justify-content:center; gap:6px; border:1px solid var(--party-line); border-radius:12px; background:rgba(255,255,255,.035); }
.party-connection span { width:8px; height:8px; border-radius:50%; background:var(--party-faint); box-shadow:0 0 0 4px rgba(125,122,117,.10); }
.party-connection b { color:var(--party-faint); font-size:9px; text-transform:uppercase; letter-spacing:.05em; }
.party-connection[data-state="online"] span { background:var(--party-good); box-shadow:0 0 0 4px rgba(113,217,148,.10); }
.party-connection[data-state="online"] b { color:var(--party-good); }
.party-connection[data-state="offline"] span { background:var(--party-danger); }
.party-connection[data-state="offline"] b { color:var(--party-danger); }
.party-room-join { flex:1; min-height:calc(100dvh - 68px); padding:26px max(16px,var(--safe-right)) calc(40px + var(--safe-bottom)) max(16px,var(--safe-left)); display:grid; place-items:center; }
.party-room-join__card { width:min(520px,100%); padding:clamp(23px,5vw,38px); border:1px solid var(--party-line-strong); border-radius:28px; background:linear-gradient(160deg,rgba(27,30,37,.96),rgba(14,16,20,.96)); box-shadow:0 28px 100px rgba(0,0,0,.55); }
.party-room-join__icon { width:72px; height:72px; margin-bottom:19px; display:grid; place-items:center; border:1px solid var(--party-line); border-radius:24px; background:radial-gradient(circle at 70% 25%,rgba(255,176,93,.25),transparent 45%),rgba(255,255,255,.04); font-size:34px; }
.party-room-join h1 { margin:0 0 9px; font-size:clamp(31px,7vw,45px); line-height:1.04; letter-spacing:-.045em; }
.party-room-join__card > p { margin:0 0 18px; color:var(--party-muted); }
.party-room-summary { margin-bottom:20px; display:grid; grid-template-columns:repeat(3,1fr); gap:7px; }
.party-room-summary span { min-height:57px; padding:9px; display:grid; align-content:center; border:1px solid var(--party-line); border-radius:12px; color:var(--party-faint); background:rgba(0,0,0,.16); font-size:9px; text-align:center; }
.party-room-summary b { color:var(--party-ink); font-size:16px; }
.party-join-as { margin-bottom:16px; padding:13px; display:flex; align-items:center; gap:11px; border:1px solid var(--party-line); border-radius:14px; background:rgba(255,255,255,.03); color:var(--party-muted); }
.party-join-as strong { color:var(--party-ink); }
.party-consent-check { min-height:48px; margin:10px 0 14px; display:flex; align-items:flex-start; gap:10px; color:var(--party-muted); cursor:pointer; font-size:12px; line-height:1.45; }
.party-consent-check input { width:20px; height:20px; flex:0 0 auto; margin-top:1px; accent-color:var(--party-accent); }
.party-notice { padding:16px; border:1px solid var(--party-line); border-radius:16px; background:rgba(255,255,255,.03); }
.party-notice--adult { border-color:rgba(241,115,105,.24); background:rgba(123,34,43,.13); }
.party-notice p { margin:4px 0 14px; color:var(--party-muted); font-size:13px; }

/* Room app */
.party-room-app { position:relative; flex:1; width:min(920px,100%); margin:0 auto; padding:14px max(12px,var(--safe-right)) calc(84px + var(--safe-bottom)) max(12px,var(--safe-left)); }
.party-room-panel { min-height:calc(100dvh - 166px); }
.party-room-game { min-height:calc(100dvh - 178px); display:flex; flex-direction:column; }
.party-room-loading { flex:1; min-height:320px; display:flex; flex-direction:column; align-items:center; justify-content:center; color:var(--party-muted); }
.party-spinner { width:42px; height:42px; border:3px solid rgba(255,255,255,.10); border-top-color:var(--party-accent); border-radius:50%; animation:party-spin .8s linear infinite; }
@keyframes party-spin { to{transform:rotate(360deg)} }
.party-room-tabs { position:fixed; z-index:55; left:50%; bottom:0; width:min(920px,100%); min-height:calc(66px + var(--safe-bottom)); padding:7px max(8px,var(--safe-right)) calc(7px + var(--safe-bottom)) max(8px,var(--safe-left)); display:grid; grid-template-columns:repeat(4,1fr); gap:4px; transform:translateX(-50%); border-top:1px solid var(--party-line); background:rgba(10,11,14,.94); backdrop-filter:blur(22px); }
.party-room-tabs button { position:relative; min-height:50px; padding:4px; display:grid; place-items:center; align-content:center; gap:1px; color:var(--party-faint); background:none; border:0; border-radius:12px; cursor:pointer; }
.party-room-tabs button > span { font-size:19px; line-height:1; }
.party-room-tabs button b { font-size:9px; font-weight:700; }
.party-room-tabs button.is-active { color:var(--party-accent-2); background:rgba(244,119,53,.10); }
.party-room-tabs em { position:absolute; top:4px; right:18%; min-width:18px; height:18px; padding:0 4px; display:grid; place-items:center; color:#fff; background:var(--party-accent); border-radius:999px; font-size:8px; font-style:normal; }
.party-room-section-head { margin:5px 0 15px; display:flex; align-items:end; justify-content:space-between; gap:12px; }
.party-room-section-head h2 { margin:0; font-size:27px; }
.party-player-list { display:grid; gap:8px; }
.party-player { min-height:67px; padding:10px 12px; display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:11px; border:1px solid var(--party-line); border-radius:16px; background:rgba(255,255,255,.03); }
.party-player.is-me { border-color:rgba(255,176,93,.32); background:rgba(244,119,53,.06); }
.party-player.is-offline { opacity:.58; }
.party-player__main { min-width:0; display:grid; }
.party-player__main strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:14px; }
.party-player__main small { color:var(--party-faint); font-size:10px; }
.party-player__state { display:flex; align-items:center; gap:6px; }
.party-ready-chip,.party-role-chip,.party-status-chip { min-height:26px; padding:0 8px; display:inline-flex; align-items:center; border:1px solid var(--party-line); border-radius:999px; color:var(--party-muted); background:rgba(255,255,255,.04); font-size:9px; font-weight:750; }
.party-ready-chip.is-ready { color:var(--party-good); border-color:rgba(113,217,148,.25); background:rgba(113,217,148,.08); }
.party-player-menu { width:38px; height:38px; display:grid; place-items:center; color:var(--party-muted); background:rgba(255,255,255,.04); border:1px solid var(--party-line); border-radius:11px; cursor:pointer; }
.party-team-list { margin-top:16px; display:grid; grid-template-columns:repeat(2,1fr); gap:9px; }
.party-team { padding:14px; border:1px solid var(--party-line); border-radius:16px; background:rgba(0,0,0,.15); }
.party-team__head { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.party-team__head strong { font-size:13px; }
.party-team__head b { color:var(--party-gold); font-size:20px; }
.party-team__members { margin-top:7px; color:var(--party-muted); font-size:11px; }
.party-join-request { margin-bottom:8px; padding:12px; display:flex; align-items:center; gap:10px; border:1px solid rgba(112,183,255,.25); border-radius:15px; background:rgba(112,183,255,.07); }
.party-join-request > span:nth-child(2) { flex:1; display:grid; }
.party-join-request small { color:var(--party-muted); }
.party-join-request button { min-width:42px; min-height:42px; border:1px solid var(--party-line); border-radius:12px; color:var(--party-ink); background:rgba(255,255,255,.06); cursor:pointer; }
.party-join-request button[data-approve="1"] { color:#142519; background:var(--party-good); border-color:transparent; }

/* Generic game renderer */
.party-game-stage { flex:1; display:flex; flex-direction:column; gap:12px; }
.party-game-statusbar { padding:10px 12px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:8px; border:1px solid var(--party-line); border-radius:15px; background:rgba(255,255,255,.03); }
.party-game-statusbar > span { color:var(--party-muted); font-size:10px; text-transform:uppercase; letter-spacing:.05em; }
.party-game-statusbar > span:last-child { text-align:right; }
.party-game-statusbar strong { color:var(--party-ink); font-size:12px; }
.party-timer { position:relative; min-width:62px; height:37px; padding:0 10px; display:grid; place-items:center; border:1px solid var(--party-line); border-radius:12px; background:rgba(0,0,0,.24); color:var(--party-gold); font-size:17px; font-variant-numeric:tabular-nums; }
.party-timer.is-urgent { color:#fff; border-color:rgba(241,115,105,.55); background:rgba(165,49,49,.45); animation:party-pulse .8s ease infinite alternate; }
@keyframes party-pulse { to{transform:scale(1.035)} }
.party-game-card-main { flex:1; min-height:310px; padding:clamp(22px,5vw,45px); display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; border:1px solid var(--party-line-strong); border-radius:26px; background:radial-gradient(circle at 50% 15%,rgba(244,119,53,.12),transparent 38%),linear-gradient(160deg,rgba(27,30,37,.96),rgba(14,16,20,.98)); box-shadow:0 24px 70px rgba(0,0,0,.32); }
.party-game-card-main__icon { width:64px; height:64px; margin-bottom:18px; display:grid; place-items:center; border:1px solid var(--party-line); border-radius:21px; background:rgba(255,255,255,.04); color:var(--party-accent-2); font-size:30px; }
.party-game-card-main .party-kicker { margin-bottom:9px; }
.party-game-card-main h1,.party-game-card-main h2 { max-width:720px; margin:0 0 11px; font-size:clamp(30px,7vw,52px); line-height:1.07; letter-spacing:-.045em; text-wrap:balance; }
.party-game-card-main p { max-width:650px; margin:0; color:var(--party-muted); font-size:14px; line-height:1.65; }
.party-game-card-main .party-secret { width:100%; margin-top:17px; padding:18px; border:1px solid rgba(178,154,255,.28); border-radius:17px; color:#e7deff; background:rgba(91,68,143,.16); }
.party-secret.is-hidden { filter:blur(12px); user-select:none; }
.party-game-actions { display:grid; gap:8px; }
.party-game-actions.is-two { grid-template-columns:1fr 1fr; }
.party-game-actions.is-three { grid-template-columns:repeat(3,1fr); }
.party-game-action { min-height:54px; padding:10px 14px; border:1px solid var(--party-line); border-radius:15px; color:var(--party-ink); background:rgba(255,255,255,.055); cursor:pointer; font-weight:750; }
.party-game-action:hover { background:rgba(255,255,255,.10); }
.party-game-action--primary { color:#211007; border-color:transparent; background:linear-gradient(145deg,var(--party-accent-2),var(--party-accent)); }
.party-game-action--danger { color:#ffd7d3; border-color:rgba(241,115,105,.25); background:rgba(143,39,45,.16); }
.party-game-input { display:grid; grid-template-columns:1fr auto; gap:8px; }
.party-game-input input,.party-game-input textarea { min-width:0; min-height:54px; padding:12px 14px; color:var(--party-ink); background:rgba(0,0,0,.35); border:1px solid var(--party-line); border-radius:15px; outline:0; font-size:16px; }
.party-game-input button { min-width:54px; }
.party-option-grid { width:100%; margin-top:19px; display:grid; grid-template-columns:repeat(2,1fr); gap:8px; }
.party-option-grid button { min-height:56px; padding:11px; border:1px solid var(--party-line); border-radius:15px; color:var(--party-ink); background:rgba(255,255,255,.055); cursor:pointer; font-weight:700; }
.party-option-grid button:hover { border-color:rgba(255,176,93,.40); background:rgba(244,119,53,.09); }
.party-scoreboard { width:100%; max-width:660px; display:grid; gap:8px; }
.party-score-row { padding:11px 13px; display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:10px; border:1px solid var(--party-line); border-radius:13px; background:rgba(255,255,255,.03); }
.party-score-row b { color:var(--party-gold); font-size:20px; }
.party-lobby-card { min-height:calc(100dvh - 190px); padding:clamp(20px,5vw,36px); display:flex; flex-direction:column; border:1px solid var(--party-line); border-radius:25px; background:linear-gradient(160deg,rgba(27,30,37,.94),rgba(14,16,20,.95)); }
.party-lobby-card__hero { padding:12px 0 22px; text-align:center; }
.party-lobby-card__hero span:first-child { width:70px; height:70px; margin:0 auto 14px; display:grid; place-items:center; border:1px solid var(--party-line); border-radius:23px; background:rgba(255,255,255,.04); font-size:32px; }
.party-lobby-card__hero h1 { margin:0 0 7px; font-size:clamp(30px,7vw,47px); line-height:1.05; letter-spacing:-.045em; }
.party-lobby-card__hero p { margin:0; color:var(--party-muted); }
.party-lobby-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.party-lobby-summary div { min-height:62px; padding:10px; display:grid; align-content:center; border:1px solid var(--party-line); border-radius:13px; background:rgba(0,0,0,.17); text-align:center; }
.party-lobby-summary b { font-size:18px; }
.party-lobby-summary span { color:var(--party-faint); font-size:9px; }
.party-lobby-actions { margin-top:auto; padding-top:18px; display:grid; gap:8px; }
.party-lobby-host-tools { display:grid; grid-template-columns:repeat(3,1fr); gap:7px; }
.party-lobby-host-tools button { min-height:48px; padding:7px; color:var(--party-muted); background:rgba(255,255,255,.045); border:1px solid var(--party-line); border-radius:13px; cursor:pointer; font-size:10px; font-weight:700; }
.party-lobby-host-tools button:hover { color:var(--party-ink); background:rgba(255,255,255,.08); }
.party-waiting-banner { padding:13px; border:1px solid var(--party-line); border-radius:14px; color:var(--party-muted); background:rgba(255,255,255,.03); text-align:center; font-size:13px; }
.party-boundary-card { margin-top:12px; padding:14px; border:1px solid rgba(241,115,105,.24); border-radius:16px; background:rgba(127,35,43,.11); }
.party-boundary-card h3 { margin:0 0 5px; }
.party-boundary-card p { margin:0 0 11px; color:var(--party-muted); font-size:12px; }

/* Chat */
.party-room-panel--chat { position:relative; height:calc(100dvh - 151px - var(--safe-bottom)); display:flex; flex-direction:column; }
.party-chat-list { flex:1; min-height:0; padding:8px 2px 12px; overflow-y:auto; overscroll-behavior:contain; }
.party-chat-message { max-width:85%; margin-bottom:8px; display:grid; grid-template-columns:auto minmax(0,1fr); align-items:end; gap:7px; }
.party-chat-message.is-me { margin-left:auto; grid-template-columns:minmax(0,1fr); }
.party-chat-message.is-me .party-avatar { display:none; }
.party-chat-message__bubble { min-width:0; padding:9px 11px; border:1px solid var(--party-line); border-radius:15px 15px 15px 5px; background:rgba(255,255,255,.055); }
.party-chat-message.is-me .party-chat-message__bubble { border-radius:15px 15px 5px 15px; border-color:rgba(244,119,53,.22); background:rgba(244,119,53,.12); }
.party-chat-message__bubble header { margin-bottom:3px; display:flex; align-items:center; justify-content:space-between; gap:12px; }
.party-chat-message__bubble strong { color:var(--party-accent-2); font-size:10px; }
.party-chat-message__bubble time { color:var(--party-faint); font-size:8px; }
.party-chat-message__bubble p { margin:0; overflow-wrap:anywhere; white-space:pre-wrap; font-size:13px; line-height:1.45; }
.party-chat-message__reactions { display:flex; flex-wrap:wrap; gap:4px; margin-top:4px; }
.party-chat-message__reactions button { min-height:24px; padding:0 6px; border:1px solid var(--party-line); border-radius:999px; color:var(--party-muted); background:rgba(0,0,0,.16); cursor:pointer; font-size:10px; }
.party-chat-form { padding:8px 0 2px; display:grid; grid-template-columns:1fr 48px; align-items:end; gap:7px; border-top:1px solid var(--party-line); background:var(--party-bg); }
.party-chat-form textarea { max-height:120px; resize:none; line-height:1.35; }
.party-chat-form button { width:48px; height:48px; display:grid; place-items:center; color:#211007; border:0; border-radius:14px; background:linear-gradient(145deg,var(--party-accent-2),var(--party-accent)); cursor:pointer; font-size:22px; font-weight:900; }

/* Invite */
.party-qr { width:216px; height:216px; margin:17px auto; padding:10px; display:grid; place-items:center; border-radius:18px; background:#fff; }
.party-qr canvas,.party-qr img { width:196px !important; height:196px !important; display:block; }
.party-invite-code { margin:0 auto 14px; padding:11px; display:grid; justify-items:center; border:1px solid var(--party-line); border-radius:14px; background:rgba(0,0,0,.18); }
.party-invite-code span { color:var(--party-faint); font-size:9px; text-transform:uppercase; letter-spacing:.10em; }
.party-invite-code strong { font-size:28px; letter-spacing:.17em; }
.party-invite-actions { display:grid; gap:8px; }

/* Matchmaking */
.party-match-hero,.party-history-hero { padding:clamp(35px,6vw,75px) 0 28px; }
.party-match-hero h1,.party-history-hero h1 { max-width:720px; margin:0 0 12px; font-size:clamp(42px,7vw,76px); line-height:.98; letter-spacing:-.055em; }
.party-match-hero p,.party-history-hero p { max-width:650px; margin:0; color:var(--party-muted); font-size:17px; }
.party-match-layout { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr); align-items:start; gap:18px; }
.party-match-games,.party-match-status { padding:clamp(20px,3vw,30px); border:1px solid var(--party-line); border-radius:25px; background:rgba(16,18,22,.84); box-shadow:var(--party-shadow); }
.party-match-game-list { display:grid; gap:8px; max-height:650px; overflow:auto; }
.party-match-game { position:relative; min-height:74px; padding:10px 12px; display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:11px; border:1px solid var(--party-line); border-radius:16px; background:rgba(255,255,255,.025); cursor:pointer; }
.party-match-game input { position:absolute; opacity:0; }
.party-match-game .party-game-card__icon { min-width:48px; width:48px; height:48px; border-radius:15px; font-size:20px; }
.party-match-game > span:nth-of-type(2) { min-width:0; display:grid; }
.party-match-game strong { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:14px; }
.party-match-game small { color:var(--party-muted); font-size:10px; }
.party-match-game em { color:var(--party-faint); font-size:23px; font-style:normal; }
.party-match-game.is-selected,.party-match-game:has(input:checked) { border-color:rgba(255,176,93,.52); background:rgba(244,119,53,.09); }
.party-match-status { position:sticky; top:92px; text-align:center; }
.party-match-status h2 { margin:0 0 7px; font-size:30px; }
.party-match-status > p { margin:0; color:var(--party-muted); font-size:13px; }
.party-match-radar { position:relative; width:210px; height:210px; margin:18px auto 22px; display:grid; place-items:center; border:1px solid rgba(112,183,255,.12); border-radius:50%; overflow:hidden; }
.party-match-radar i { position:absolute; border:1px solid rgba(112,183,255,.16); border-radius:50%; }
.party-match-radar i:nth-child(1){width:65px;height:65px}.party-match-radar i:nth-child(2){width:125px;height:125px}.party-match-radar i:nth-child(3){width:190px;height:190px}
.party-match-radar b { width:50px;height:50px;display:grid;place-items:center;border-radius:50%;color:#102138;background:var(--party-info);font-size:25px;box-shadow:0 0 35px rgba(112,183,255,.35); }
.party-match-status.is-searching .party-match-radar::after { content:""; position:absolute; width:50%; height:50%; left:50%; top:0; transform-origin:left bottom; background:linear-gradient(120deg,rgba(112,183,255,.30),transparent); animation:party-radar 1.7s linear infinite; }
@keyframes party-radar { to{transform:rotate(360deg)} }
.party-match-status.is-found .party-match-radar b { background:var(--party-good); }

/* History */
.party-history-list { display:grid; gap:9px; }
.party-history-list article { min-height:86px; padding:13px 15px; display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:13px; border:1px solid var(--party-line); border-radius:18px; background:rgba(16,18,22,.82); }
.party-history-list__icon { width:52px;height:52px;display:grid;place-items:center;border:1px solid var(--party-line);border-radius:16px;background:rgba(255,255,255,.04);font-size:23px; }
.party-history-list h2 { margin:0 0 3px; font-size:16px; }
.party-history-list p { margin:0; color:var(--party-muted); font-size:10px; }
.party-history-list article > div:nth-child(2) > div { display:flex; flex-wrap:wrap; gap:6px; margin-top:7px; }
.party-history-list article > div:nth-child(2) > div span { color:var(--party-faint); font-size:9px; }

/* Shared screen */
.party-screen-page { min-height:100dvh; overflow:hidden; }
.party-shared-screen { position:relative; z-index:1; min-height:100dvh; padding:clamp(20px,3vw,42px); display:grid; grid-template-rows:auto 1fr auto; gap:18px; }
.party-shared-screen > header { display:grid; grid-template-columns:1fr auto auto; align-items:center; gap:24px; }
.party-shared-screen h1 { margin:0; font-size:clamp(30px,4vw,54px); line-height:1; }
.party-screen-code { padding:10px 20px; display:grid; justify-items:center; border:1px solid var(--party-line); border-radius:16px; background:rgba(255,255,255,.04); }
.party-screen-code span { color:var(--party-faint); font-size:10px; text-transform:uppercase; }
.party-screen-code strong { font-size:27px; letter-spacing:.16em; }
.party-shared-screen > section { min-height:0; display:grid; }
.party-shared-screen .party-game-card-main { min-height:0; height:100%; }
.party-shared-screen > footer { display:flex; align-items:center; justify-content:space-between; gap:20px; color:var(--party-muted); }
.party-shared-screen > footer a { color:var(--party-muted); font-size:12px; }

/* Responsive */
@media (max-width: 980px) {
    .party-game-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .party-picker__steps { grid-template-columns:1fr; }
    .party-detail-layout,.party-match-layout { grid-template-columns:1fr; }
    .party-create-card,.party-match-status { position:static; }
    .party-match-games { order:2; }
    .party-match-status { order:1; }
}
@media (max-width: 760px) {
    .party-topbar { grid-template-columns:1fr auto; gap:8px; }
    .party-nav { position:fixed; z-index:55; left:0; right:0; bottom:0; min-height:calc(62px + var(--safe-bottom)); padding:6px max(8px,var(--safe-right)) calc(6px + var(--safe-bottom)) max(8px,var(--safe-left)); display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--party-line); background:rgba(9,10,12,.96); backdrop-filter:blur(20px); }
    .party-nav a { min-height:48px; padding:0 5px; font-size:10px; text-align:center; }
    .party-account__name { display:none; }
    .party-topbar .party-account .party-avatar { width:40px; height:40px; }
    .party-main { padding-top:16px; padding-bottom:calc(95px + var(--safe-bottom)); }
    .party-hero { min-height:0; grid-template-columns:1fr; gap:26px; padding:34px 0 18px; }
    .party-hero h1 { font-size:clamp(43px,13vw,65px); }
    .party-hero__actions { display:grid; grid-template-columns:1fr; }
    .party-join-code { padding:18px; }
    .party-picker,.party-catalog { margin-left:-4px; margin-right:-4px; border-radius:22px; }
    .party-catalog__toolbar { align-items:start; flex-direction:column; }
    .party-catalog__actions { width:100%; }
    .party-search { flex:1; }
    .party-search input { min-width:0; }
    .party-game-grid { grid-template-columns:1fr; }
    .party-game-card { display:grid; grid-template-columns:122px minmax(0,1fr); }
    .party-game-card__cover { min-height:100%; }
    .party-game-card__icon { min-width:52px; height:52px; border-radius:17px; font-size:23px; }
    .party-game-card__body { padding:14px; }
    .party-game-card h3 { font-size:18px; }
    .party-game-card p { min-height:0; font-size:12px; }
    .party-game-card .party-meta-row span:nth-child(n+3), .party-game-card .party-tags { display:none; }
    .party-game-card .party-button--card { min-height:40px; margin-top:4px; font-size:12px; }
    .party-adult-panel { align-items:flex-start; flex-direction:column; }
    .party-footer { padding-bottom:calc(90px + var(--safe-bottom)); align-items:flex-start; flex-direction:column; }
    .party-detail-hero { grid-template-columns:1fr; text-align:center; }
    .party-detail-hero__cover { max-width:210px; }
    .party-detail-hero__copy > p { margin-left:auto; margin-right:auto; }
    .party-detail-stats,.party-tags--large { justify-content:center; }
    .party-detail-layout { gap:12px; }
    .party-create-card { padding-bottom:calc(20px + var(--safe-bottom)); }
    .party-room-topbar { grid-template-columns:44px minmax(0,1fr) 45px; }
    .party-connection { padding:0; }
    .party-connection b { display:none; }
    .party-shared-screen > header { grid-template-columns:1fr auto; }
    .party-shared-screen .party-connection { display:none; }
}
@media (max-width: 470px) {
    .party-logo small { display:none; }
    .party-logo strong { font-size:13px; }
    .party-topbar { min-height:calc(60px + var(--safe-top)); }
    .party-main { padding-left:max(12px,var(--safe-left)); padding-right:max(12px,var(--safe-right)); }
    .party-hero h1 { letter-spacing:-.06em; }
    .party-hero__copy > p { font-size:16px; }
    .party-join-code > div { grid-template-columns:1fr; }
    .party-picker,.party-catalog { padding:17px 13px; }
    .party-section-heading { align-items:flex-start; }
    .party-section-heading h2,.party-catalog__toolbar h2 { font-size:28px; }
    .party-category-strip { margin-right:-13px; }
    .party-game-card { grid-template-columns:105px minmax(0,1fr); }
    .party-game-card__cover { padding:8px; }
    .party-game-card__body { padding:12px; }
    .party-game-card p { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
    .party-badge--featured { display:none; }
    .party-avatar-picker { grid-template-columns:repeat(4,1fr); gap:5px; }
    .party-avatar-picker label { padding:7px 2px; }
    .party-detail-hero,.party-detail-main,.party-create-card { padding:18px 15px; border-radius:21px; }
    .party-detail-hero h1 { font-size:41px; }
    .party-detail-stats { display:grid; grid-template-columns:repeat(3,1fr); }
    .party-detail-stats span { min-width:0; padding:8px 5px; }
    .party-room-summary { grid-template-columns:1fr 1fr; }
    .party-room-summary span:last-child { grid-column:1/-1; }
    .party-team-list { grid-template-columns:1fr; }
    .party-lobby-summary { grid-template-columns:1fr 1fr 1fr; }
    .party-game-actions.is-three { grid-template-columns:1fr; }
    .party-option-grid { grid-template-columns:1fr; }
    .party-game-card-main { min-height:290px; padding:22px 16px; }
    .party-game-card-main h1,.party-game-card-main h2 { font-size:31px; }
    .party-history-list article { grid-template-columns:auto minmax(0,1fr); }
    .party-history-list article > a { grid-column:1/-1; }
    .party-match-games,.party-match-status { padding:16px 12px; }
    .party-match-radar { width:170px;height:170px; }
    .party-match-radar i:nth-child(3){width:155px;height:155px}
    .party-modal__card { padding:23px 18px; border-radius:22px; }
}
@media (orientation: landscape) and (max-height: 560px) {
    .party-room-topbar { min-height:52px; padding-top:4px; padding-bottom:4px; }
    .party-room-app { padding-top:8px; }
    .party-room-tabs { width:70px; top:52px; right:0; bottom:0; left:auto; grid-template-columns:1fr; grid-template-rows:repeat(4,1fr); transform:none; border-top:0; border-left:1px solid var(--party-line); }
    .party-room-panel { margin-right:70px; min-height:calc(100dvh - 66px); }
    .party-game-card-main { min-height:210px; padding:18px; }
    .party-game-card-main h1,.party-game-card-main h2 { font-size:30px; }
    .party-room-panel--chat { height:calc(100dvh - 70px); }
}
@media (prefers-reduced-motion: reduce) {
    *,*::before,*::after { scroll-behavior:auto !important; animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
}

/* Runtime room components */
.party-connection[data-state="online"] span{background:var(--party-good);box-shadow:0 0 12px rgba(113,217,148,.55)}
.party-connection[data-state="offline"] span{background:var(--party-danger);box-shadow:0 0 12px rgba(241,115,105,.45)}
.party-connection[data-state="connecting"] span{animation:party-pulse .8s ease infinite alternate}
.party-player{position:relative;overflow:hidden}
.party-player-controls{grid-column:1/-1;display:flex;flex-wrap:wrap;justify-content:flex-end;gap:5px;padding-top:7px;border-top:1px solid var(--party-line)}
.party-player-controls button,.party-team .party-link-button,.party-join-requests button{min-height:30px;padding:0 9px;border:1px solid var(--party-line);border-radius:9px;color:var(--party-muted);background:rgba(255,255,255,.045);cursor:pointer;font-size:9px;font-weight:700}
.party-player-controls button:last-child{color:#ffd8d2;border-color:rgba(241,115,105,.26);background:rgba(241,115,105,.08)}
.party-score{min-width:28px;text-align:right;color:var(--party-gold);font-size:16px}
.party-ready-dot{width:23px;height:23px;display:grid;place-items:center;border-radius:50%;color:#0d2518;background:var(--party-good);font-size:11px;font-weight:900}
.party-join-requests{margin:0 0 13px;padding:13px;border:1px solid rgba(112,183,255,.24);border-radius:16px;background:rgba(112,183,255,.06)}
.party-join-requests>strong{display:block;margin-bottom:8px;font-size:12px}
.party-join-requests>div{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:7px}
.party-lobby-host-tools a{min-height:48px;padding:7px;display:grid;place-items:center;color:var(--party-muted);background:rgba(255,255,255,.045);border:1px solid var(--party-line);border-radius:13px;font-size:10px;font-weight:700;text-align:center}
.party-lobby-hint{margin:4px 0 0!important;color:var(--party-faint)!important;font-size:10px!important;text-align:center}
.party-boundaries{margin:-4px 0 20px;padding:18px;border:1px solid rgba(241,115,105,.28);border-radius:20px;background:rgba(241,115,105,.065)}
.party-boundaries h2{margin:4px 0 5px;font-size:22px}
.party-boundaries>p{margin:0 0 15px;color:var(--party-muted);font-size:11px;line-height:1.55}
.party-boundary-grid{margin:10px 0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.party-boundary-grid label{min-height:43px;padding:8px;display:flex;align-items:center;gap:7px;border:1px solid var(--party-line);border-radius:11px;background:rgba(0,0,0,.15);font-size:10px}
.party-game-statusbar{min-height:50px;margin-bottom:9px;padding:6px 7px 6px 10px;display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid var(--party-line);border-radius:15px;background:rgba(255,255,255,.03)}
.party-game-statusbar>div:first-child{min-width:0;display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;column-gap:8px}
.party-game-statusbar>div:first-child>span{grid-row:1/3;width:34px;height:34px;display:grid;place-items:center;border-radius:10px;background:rgba(255,255,255,.05)}
.party-game-statusbar b{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:11px}
.party-game-statusbar small{color:var(--party-faint);font-size:8px}
.party-game-control-zone{padding-top:10px;display:grid;gap:8px}
.party-game-input{width:100%;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:7px}
.party-game-input label{min-width:0;display:grid;gap:5px;color:var(--party-muted);font-size:9px;text-align:left}
.party-game-input textarea{min-height:52px;max-height:130px;resize:vertical}
.party-game-input .party-button{min-width:104px;min-height:52px}
.party-reveal-card{width:100%;margin-top:16px;padding:15px;display:flex;flex-wrap:wrap;justify-content:center;gap:10px;border:1px solid rgba(255,176,93,.27);border-radius:16px;background:rgba(244,119,53,.09)}
.party-reveal-card>span,.party-reveal-card>div{display:grid}
.party-reveal-card small{display:block;color:var(--party-faint);font-size:8px;text-transform:uppercase;letter-spacing:.08em}
.party-reveal-card strong{display:block;font-size:18px}
.party-private-role{width:100%;margin-top:16px;padding:16px;border:1px solid rgba(178,154,255,.28);border-radius:17px;background:rgba(91,68,143,.16)}
.party-private-role small{display:block;color:#c7baf1;font-size:9px;text-transform:uppercase}
.party-private-role strong{display:block;margin-top:3px;color:#f0eaff;font-size:24px}
.party-private-role p{margin-top:7px!important;color:#d4c9f4!important}
.party-hints{width:100%;margin-top:13px;display:flex;flex-wrap:wrap;justify-content:center;gap:6px}
.party-hints span{padding:6px 9px;border:1px solid var(--party-line);border-radius:999px;color:var(--party-muted);background:rgba(255,255,255,.035);font-size:10px}
.party-resource-row{width:100%;margin-top:14px;display:flex;flex-wrap:wrap;justify-content:center;gap:7px}
.party-resource-row span{min-width:80px;padding:8px;display:grid;border:1px solid var(--party-line);border-radius:12px;background:rgba(0,0,0,.16)}
.party-resource-row b{font-size:17px}.party-resource-row small{color:var(--party-faint);font-size:8px}
.party-identity-grid{width:100%;margin-top:14px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
.party-identity-grid span{padding:10px;display:grid;border:1px solid var(--party-line);border-radius:12px;background:rgba(0,0,0,.14)}
.party-identity-grid b{font-size:10px}.party-identity-grid em{margin-top:2px;color:var(--party-accent-2);font-size:13px;font-style:normal}
.party-progress-note,.party-waiting-note{margin-top:13px;color:var(--party-faint);font-size:10px;text-align:center}
.party-live-list{width:100%;max-height:185px;margin-top:13px;padding:9px;overflow:auto;display:grid;gap:5px;border:1px solid var(--party-line);border-radius:13px;background:rgba(0,0,0,.14);text-align:left}
.party-live-list span{padding:5px 7px;border-radius:8px;background:rgba(255,255,255,.035);color:var(--party-muted);font-size:10px;overflow-wrap:anywhere}
.party-live-list b{color:var(--party-ink)}
.party-vote-list{display:grid;gap:7px}
.party-vote-list>strong{margin-bottom:2px;color:var(--party-muted);font-size:10px;text-align:center}
.party-vote-list button{min-height:50px;padding:9px 12px;display:flex;align-items:center;gap:9px;border:1px solid var(--party-line);border-radius:14px;color:var(--party-ink);background:rgba(255,255,255,.045);cursor:pointer;text-align:left}
.party-vote-list button:hover{border-color:rgba(255,176,93,.38);background:rgba(244,119,53,.08)}
.party-host-action{padding:9px;border:1px dashed var(--party-line);border-radius:13px;color:var(--party-muted);font-size:10px}
.party-host-action summary{cursor:pointer;font-weight:700;text-align:center}
.party-host-action>div{margin-top:8px;display:flex;flex-wrap:wrap;justify-content:center;gap:5px}
.party-host-action button{min-height:34px;padding:0 10px;border:1px solid var(--party-line);border-radius:9px;color:var(--party-ink);background:rgba(255,255,255,.05);cursor:pointer}
.party-secret{display:grid!important;gap:4px;cursor:pointer}
.party-secret small{color:#c7baf1;font-size:8px;text-transform:uppercase}.party-secret strong{font-size:22px}
.party-pause-overlay{position:absolute;inset:0;display:grid;place-content:center;border-radius:26px;background:rgba(8,9,11,.88);backdrop-filter:blur(5px)}
.party-game-card-main{position:relative;overflow:hidden}
.party-pause-overlay strong{font-size:39px}.party-pause-overlay p{margin-top:6px!important}
.party-drawing{width:100%;margin-top:16px;overflow:hidden;border:1px solid var(--party-line);border-radius:17px;background:#121418;box-shadow:inset 0 0 30px rgba(0,0,0,.3)}
.party-drawing canvas{width:100%;height:min(43vh,390px);display:block;touch-action:none;cursor:crosshair}
.party-game-finished{min-height:calc(100dvh - 190px);padding:clamp(24px,6vw,46px);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;border:1px solid var(--party-line);border-radius:26px;background:radial-gradient(circle at 50% 10%,rgba(255,176,93,.15),transparent 40%),rgba(17,19,24,.94)}
.party-game-finished__icon{width:78px;height:78px;margin-bottom:16px;display:grid;place-items:center;border:1px solid rgba(255,176,93,.25);border-radius:26px;color:var(--party-gold);background:rgba(255,176,93,.08);font-size:37px}
.party-game-finished h1{max-width:680px;margin:5px 0 18px;font-size:clamp(32px,7vw,54px);line-height:1.06}
.party-scoreboard{width:min(580px,100%);margin-bottom:20px;display:grid;gap:7px}
.party-scoreboard>div{min-height:54px;padding:7px 11px;display:grid;grid-template-columns:27px auto minmax(0,1fr) auto;align-items:center;gap:8px;border:1px solid var(--party-line);border-radius:14px;background:rgba(255,255,255,.03);text-align:left}
.party-scoreboard>div.is-winner{border-color:rgba(255,176,93,.38);background:rgba(255,176,93,.08)}
.party-scoreboard em{color:var(--party-faint);font-style:normal}.party-scoreboard strong{overflow:hidden;text-overflow:ellipsis}.party-scoreboard b{color:var(--party-gold);font-size:19px}
.party-screen-players{display:flex;flex-wrap:wrap;gap:7px}
.party-screen-players>span{padding:5px 8px 5px 5px;display:flex;align-items:center;gap:6px;border:1px solid var(--party-line);border-radius:999px;background:rgba(255,255,255,.035)}
.party-screen-players .party-avatar{width:29px;height:29px;font-size:9px}.party-screen-players b{font-size:10px}.party-screen-players em{color:var(--party-gold);font-size:11px;font-style:normal}
.party-toasts{position:fixed;z-index:999;top:calc(74px + var(--safe-top));left:50%;width:min(420px,calc(100% - 24px));display:grid;gap:6px;pointer-events:none;transform:translateX(-50%)}
.party-toast{padding:11px 13px;border:1px solid var(--party-line);border-radius:13px;color:var(--party-ink);background:rgba(22,24,29,.96);box-shadow:0 15px 45px rgba(0,0,0,.4);font-size:11px;text-align:center;opacity:0;transform:translateY(-8px);transition:.2s ease}
.party-toast.is-visible{opacity:1;transform:none}.party-toast.is-good{border-color:rgba(113,217,148,.35)}.party-toast.is-error{border-color:rgba(241,115,105,.4)}
.party-button--danger{color:#ffe5e1!important;border-color:rgba(241,115,105,.35)!important;background:rgba(241,115,105,.14)!important}
.party-button:disabled{opacity:.45;cursor:not-allowed;filter:saturate(.4)}

@media(max-width:560px){
 .party-game-input{grid-template-columns:1fr}.party-game-input .party-button{width:100%}
 .party-boundary-grid,.party-identity-grid{grid-template-columns:1fr}
 .party-join-requests>div{grid-template-columns:auto 1fr}.party-join-requests button{grid-row:2}
 .party-lobby-host-tools{grid-template-columns:repeat(2,1fr)}
 .party-player-controls{justify-content:stretch}.party-player-controls button{flex:1}
 .party-game-statusbar{margin-left:-2px;margin-right:-2px}
 .party-drawing canvas{height:310px}
}

/* 1.1.13: mobile-safe game result layout */
.party-room-shell,.party-room-app,.party-room-panel,.party-room-game,.party-game-card-main{max-width:100%;min-width:0;overflow-x:hidden}
.party-reveal-card{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));align-items:start;text-align:center}
.party-reveal-card>div{min-width:0;padding:2px 4px}
.party-reveal-card strong{max-width:100%;font-size:clamp(16px,5vw,22px);line-height:1.2;overflow-wrap:anywhere;word-break:break-word}
.party-game-actions,.party-game-actions>*{min-width:0;max-width:100%}
.party-game-actions .party-button{white-space:normal;overflow-wrap:anywhere}
@media(max-width:560px){.party-reveal-card{grid-template-columns:1fr}.party-reveal-card>div+div{padding-top:8px;border-top:1px solid var(--party-line)}}

/* 1.1.14: явное завершение быстрого подбора */
.party-picker__cta{display:grid;gap:10px;margin-top:18px}.party-picker__cta .party-button--picker{width:100%;min-height:58px;font-weight:800}.party-picker__cta small{display:block;text-align:center;color:var(--party-muted,#9a9691);line-height:1.45}@media(max-width:560px){.party-picker__cta{position:relative;margin-top:16px}.party-picker__cta .party-button--picker{font-size:17px}}

/* Party mobile interaction: no accidental page zoom, taps stay responsive. */
html:has(body.party-page), body.party-page { touch-action: pan-x pan-y; overscroll-behavior-x: none; }
body.party-page button, body.party-page a, body.party-page input, body.party-page textarea, body.party-page select { touch-action: manipulation; }
body.party-page input, body.party-page textarea { font-size:16px !important; }
.party-game-input input[data-party-answer-input] { min-height:58px; font-size:17px !important; }
.party-game-input:focus-within { scroll-margin-bottom:180px; }

/*
 * ── Общая шапка сайта ───────────────────────────────────────────────────
 * Разделы (истории, ИИ-чаты, игры, магазин) переключаются одной шапкой; она
 * живёт здесь, а не в ai.css, потому что нужна и на страницах раздела игр,
 * где ai.css не подключается.
 */
.site-topbar .party-nav a { white-space: nowrap; }
.site-wallet { display: inline-flex; gap: 10px; align-items: center; padding: 6px 12px; border: 1px solid var(--party-line); border-radius: 999px; background: rgba(255,255,255,.04); text-decoration: none; }
.site-wallet:hover { border-color: var(--party-line-strong); background: rgba(255,255,255,.07); }
.site-wallet__part { display: flex; flex-direction: column; line-height: 1.1; }
.site-wallet__part b { color: var(--party-ink); font-size: 14px; }
.site-wallet__part small { color: var(--party-faint); font-size: 10px; text-transform: uppercase; letter-spacing: .05em; }
.site-wallet__part--gold b { color: var(--party-gold); }
.site-account-link { display: inline-flex; align-items: center; gap: 8px; color: inherit; text-decoration: none; }
.site-account-link:hover .party-account__name { color: var(--party-ink); }

.site-subnav { display: flex; flex-wrap: wrap; gap: 6px; padding: 10px clamp(12px,3vw,26px); border-bottom: 1px solid var(--party-line); }
.site-subnav a { padding: 7px 13px; border-radius: 10px; color: var(--party-muted); font-size: 13px; font-weight: 600; text-decoration: none; }
.site-subnav a:hover { color: var(--party-ink); background: rgba(255,255,255,.06); }
.site-subnav a[aria-current="page"] { color: #241108; background: linear-gradient(145deg,var(--party-accent-2),var(--party-accent)); }

@media (max-width: 700px) {
    .site-wallet__part small { display: none; }
    .site-account-link .party-account__name { display: none; }
}

/*
 * ── Профиль ─────────────────────────────────────────────────────────────
 * Одна страница вместо разбросанных по разделам цифр: кошелёк, что куплено,
 * во что играли, с кем переписывались, чем подтверждён аккаунт.
 */
.profile-grid { display: grid; gap: 14px; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.profile-card { padding: 18px; border: 1px solid var(--party-line); border-radius: var(--party-radius); background: var(--party-panel); }
.profile-card h2 { margin: 0 0 4px; font-size: 17px; }
.profile-card > p { margin: 0 0 14px; color: var(--party-muted); font-size: 13px; }
.profile-figures { display: flex; flex-wrap: wrap; gap: 18px; }
.profile-figure b { display: block; font-size: 26px; font-weight: 800; line-height: 1.1; color: var(--party-ink); }
.profile-figure b.is-gold { color: var(--party-gold); }
.profile-figure small { color: var(--party-faint); font-size: 11px; text-transform: uppercase; letter-spacing: .06em; }
.profile-rows { display: grid; gap: 8px; }
.profile-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--party-line); font-size: 14px; }
.profile-row:last-child { border-bottom: 0; }
.profile-row span:first-child { color: var(--party-muted); }
.profile-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.profile-danger summary { cursor: pointer; color: var(--party-danger); font-weight: 700; }
.profile-field { display: grid; gap: 6px; margin-bottom: 12px; font-size: 13px; color: var(--party-muted); }
.profile-field input { padding: 11px 13px; border: 1px solid var(--party-line); border-radius: 12px; background: var(--party-panel-2); color: var(--party-ink); font: inherit; }
.profile-field input:focus { outline: none; border-color: var(--party-accent); }

/*
 * Обложки игр.
 *
 * Часть карточек получила рисованные баннеры. Значок остаётся для остальных:
 * заменять его заглушкой-картинкой было бы хуже, чем честный символ.
 */
.party-game-card__cover.has-image {
    padding: 0;
    /* Пропорции баннера, а не фиксированная высота: блок карточки шире 16:9,
       и при кадрировании срезался нарисованный на обложке заголовок. */
    min-height: 0;
    aspect-ratio: 16 / 9;
    background: #0b0c0f;
}
.party-game-card__image {
    position: absolute; inset: 0;
    width: 100%; height: 100%;
    /* contain, а не cover: обложки рисуются разных пропорций, и обрезать их
       нельзя — на каждой есть свой текст. Поля совпадают с фоном карточки и
       на тёмных баннерах не видны. */
    object-fit: contain;
    display: block;
}
/* Затемнение только сверху — под бейджи «18+» и «Выбор компании».
   Нижнюю кромку не трогаем: там на баннерах стоят свои подписи. */
.party-game-card__cover.has-image::after {
    content: ""; position: absolute; inset: 0; transform: none;
    background: linear-gradient(180deg, rgba(8,9,11,.55) 0, transparent 30%);
}
.party-game-card:hover .party-game-card__cover.has-image::after { transform: none; }
.party-game-card__cover.has-image .party-badge { z-index: 2; }

.party-hero-cover {
    display: block; width: 100%; margin-bottom: 18px;
    border: 1px solid var(--party-line); border-radius: var(--party-radius);
    object-fit: cover; aspect-ratio: 16 / 9;
}
.party-detail-hero__cover.has-image {
    position: relative; overflow: hidden; padding: 0;
    aspect-ratio: 16 / 9; min-height: 0; background: #0b0c0f;
}
.party-detail-hero__cover.has-image .party-game-card__image { object-fit: contain; }
.party-detail-hero__cover.has-image b { position: absolute; top: 12px; right: 12px; z-index: 2; }
