:root {
    --offline-green-950: #0b1d13;
    --offline-green-900: #10291a;
    --offline-green-800: #174427;
    --offline-green-700: #205b31;
    --offline-green-600: #397144;
    --offline-paper: #edeedc;
    --offline-paper-deep: #d9dcc7;
    --offline-ink: #1e4226;
    --offline-muted: #667362;
    --offline-red: #8a2222;
}

/* ======================================================================
   Interforest v14.10.48 — наследование окраса и широкая игровая сцена
   ====================================================================== */

.offline-appearance-mode {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin: 0;
    padding: 14px;
    border: 1px solid rgba(30, 66, 38, .2);
    border-radius: 16px;
    background: rgba(28, 76, 40, .045);
}

.offline-appearance-mode legend {
    padding: 0 9px;
    color: var(--offline-green-800);
    font: 800 1.1rem Georgia, serif;
}

.offline-appearance-mode-card {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 11px !important;
    min-height: 72px;
    padding: 12px 14px;
    border: 1px solid rgba(30, 66, 38, .18);
    border-radius: 12px;
    background: rgba(255, 255, 244, .76);
    cursor: pointer;
}

.offline-appearance-mode-card:has(input:checked) {
    border-color: var(--offline-green-600);
    background: rgba(57, 113, 68, .12);
    box-shadow: inset 0 0 0 1px rgba(57, 113, 68, .18);
}

.offline-appearance-mode-card input {
    width: 20px;
    height: 20px;
    accent-color: var(--offline-green-700);
}

.offline-appearance-mode-card span {
    display: grid;
    gap: 4px;
}

.offline-appearance-mode-card small {
    color: var(--offline-muted);
    font-size: .76rem;
    font-weight: 600;
    line-height: 1.35;
}

.offline-appearance-editor[hidden] {
    display: none;
}

.offline-appearance-editor legend {
    display: flex;
    align-items: center;
    gap: 12px;
}

.offline-randomize-appearance {
    padding: 7px 11px;
    border: 1px solid rgba(30, 66, 38, .2);
    border-radius: 999px;
    color: white;
    background: var(--offline-green-700);
    cursor: pointer;
    font: 800 .78rem/1.1 system-ui, sans-serif;
}

.offline-randomize-appearance:hover {
    background: var(--offline-green-800);
}

/* style.css задаёт всем моделькам 100×100 с !important. В офлайне
   используются компактные карточки, поэтому размеры задаются явно здесь. */
.offline-save-sprite,
.offline-relation-sprite,
.offline-profile-sprite {
    overflow: visible;
}

.offline-save-sprite canvas.clangen-cat-sprite {
    width: 70px !important;
    height: 70px !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-width: 70px !important;
    max-height: 70px !important;
}

.offline-relation-sprite canvas.clangen-cat-sprite {
    width: 54px !important;
    height: 54px !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-width: 54px !important;
    max-height: 54px !important;
}

.offline-profile-sprite canvas.clangen-cat-sprite {
    width: 98px !important;
    height: 98px !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-width: 98px !important;
    max-height: 98px !important;
}

.offline-appearance-preview canvas.clangen-cat-sprite {
    width: 170px !important;
    height: 170px !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-width: 170px !important;
    max-height: 170px !important;
}

.offline-camp-cat canvas.clangen-cat-sprite {
    width: 40px !important;
    height: 40px !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-width: 40px !important;
    max-height: 40px !important;
}

.offline-profile-kinship {
    color: #76675d;
    font: 700 .82em/1.25 system-ui, sans-serif;
}

@media (max-width: 780px) {
    .offline-appearance-mode {
        grid-template-columns: 1fr;
    }

    .offline-appearance-editor legend {
        align-items: flex-start;
        flex-direction: column;
        gap: 7px;
    }

    .offline-camp-cat canvas.clangen-cat-sprite {
        width: 34px !important;
        height: 34px !important;
        max-width: 34px !important;
        max-height: 34px !important;
    }

}

body.offline-page {
    min-width: 320px;
    color: var(--offline-ink);
    background:
        linear-gradient(rgba(5, 20, 12, .55), rgba(4, 13, 9, .82)),
        radial-gradient(circle at 50% -20%, #718c63, transparent 52%),
        #0a1d12;
}

body.offline-page.modal-open {
    overflow: hidden;
}

.offline-shell {
    width: min(1480px, calc(100% - 28px));
    min-height: calc(100vh - 28px);
    margin: 14px auto;
    overflow: hidden;
    border: 1px solid rgba(237, 238, 220, .13);
    border-radius: 22px;
    background: rgba(11, 29, 19, .96);
    box-shadow: 0 28px 80px rgba(0, 0, 0, .42);
}

.offline-header {
    display: flex;
    min-height: 64px;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 13px 28px;
    color: rgba(255, 255, 255, .78);
    background: rgba(8, 17, 15, .96);
    border-bottom: 1px solid rgba(255, 255, 255, .08);
}

.offline-brand {
    color: rgba(255, 255, 255, .88);
    font-size: clamp(1.15rem, 2.7vw, 1.7rem);
    font-weight: 900;
    letter-spacing: .04em;
    text-decoration: none;
}

.offline-header-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}

.offline-header-button,
.offline-text-button {
    padding: 8px 11px;
    color: inherit;
    background: transparent;
    cursor: pointer;
    font-weight: 700;
    text-decoration: none;
}

.offline-header-button:hover,
.offline-text-button:hover {
    color: white;
    text-decoration: underline;
}

.offline-start-view {
    min-height: 680px;
    padding: clamp(28px, 6vw, 76px);
    background:
        linear-gradient(135deg, rgba(244, 241, 214, .97), rgba(220, 224, 199, .96)),
        var(--offline-paper);
}

.offline-start-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 28px;
    max-width: 1050px;
    margin: 0 auto 34px;
}

.offline-start-heading h1,
.offline-create-card h1 {
    margin: 5px 0 10px;
    color: var(--offline-green-800);
    font: 800 clamp(2.2rem, 6vw, 4.4rem)/1.03 Georgia, serif;
}

.offline-start-heading p:not(.offline-eyebrow) {
    max-width: 650px;
    margin: 0;
    color: var(--offline-muted);
    font-size: 1.03rem;
    line-height: 1.65;
}

.offline-eyebrow {
    margin: 0;
    color: var(--offline-green-600);
    font-size: .75rem;
    font-weight: 900;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.offline-primary-button {
    min-height: 50px;
    padding: 13px 22px;
    border-radius: 10px;
    color: white;
    background: var(--offline-green-700);
    box-shadow: 0 8px 18px rgba(20, 68, 37, .18);
    cursor: pointer;
    font-weight: 900;
}

.offline-primary-button:hover {
    background: var(--offline-green-800);
    transform: translateY(-1px);
}

.offline-primary-button:disabled {
    opacity: .46;
    cursor: not-allowed;
    transform: none;
}

.offline-save-list {
    display: grid;
    max-width: 1050px;
    margin: auto;
    gap: 14px;
}

.offline-empty-saves,
.offline-save-card,
.offline-create-card {
    border: 1px solid rgba(30, 66, 38, .16);
    border-radius: 18px;
    background: rgba(255, 255, 244, .66);
    box-shadow: 0 12px 34px rgba(31, 54, 34, .09);
}

.offline-empty-saves {
    padding: 48px 24px;
    color: var(--offline-muted);
    text-align: center;
}

.offline-empty-saves strong {
    display: block;
    margin-bottom: 8px;
    color: var(--offline-green-800);
    font-size: 1.25rem;
}

.offline-save-card {
    display: grid;
    grid-template-columns: 84px minmax(0, 1fr) auto;
    align-items: center;
    gap: 18px;
    padding: 18px 20px;
}

.offline-save-sprite,
.offline-profile-sprite,
.offline-relation-sprite {
    display: grid;
    place-items: center;
    overflow: visible;
    border-radius: 16px;
    background: radial-gradient(circle, rgba(255,255,255,.85), rgba(184, 195, 165, .42));
}

.offline-save-sprite {
    width: 78px;
    height: 78px;
}

.offline-save-card h2 {
    margin: 0 0 5px;
    color: var(--offline-green-800);
    font-size: 1.35rem;
}

.offline-save-card p,
.offline-save-card small {
    display: block;
    margin: 3px 0 0;
    color: var(--offline-muted);
}

.offline-save-actions {
    display: flex;
    gap: 8px;
}

.offline-save-actions button {
    min-height: 42px;
    padding: 9px 14px;
    border-radius: 9px;
    cursor: pointer;
    font-weight: 800;
}

.offline-continue-save {
    color: white;
    background: var(--offline-green-700);
}

.offline-delete-save {
    color: var(--offline-red);
    background: rgba(138, 34, 34, .09);
}

.offline-create-card {
    max-width: 740px;
    margin: 24px auto 0;
    padding: clamp(24px, 5vw, 54px);
}

.offline-create-view > .offline-text-button,
#offline-create-back {
    color: var(--offline-green-700);
}

.offline-random-name-card {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 3px 16px;
    margin: 26px 0;
    padding: 18px 20px;
    border-radius: 14px;
    background: rgba(28, 76, 40, .08);
}

.offline-random-name-card > span,
.offline-random-name-card > small {
    color: var(--offline-muted);
}

.offline-random-name-card > strong {
    grid-row: 2;
    color: var(--offline-green-800);
    font-size: 1.8rem;
}

.offline-random-name-card > button {
    grid-column: 2;
    grid-row: 1 / span 2;
    color: var(--offline-green-700);
}

.offline-create-form {
    display: grid;
    gap: 18px;
}

.offline-create-form label {
    display: grid;
    gap: 8px;
    color: var(--offline-green-800);
    font-weight: 800;
}

.offline-create-form select {
    width: 100%;
    min-height: 49px;
    padding: 11px 12px;
    border: 1px solid rgba(30, 66, 38, .25);
    border-radius: 10px;
    color: var(--offline-green-900);
    background: rgba(255, 255, 244, .9);
}

.offline-create-note {
    margin: 18px 0 0;
    color: var(--offline-muted);
    font-size: .86rem;
    line-height: 1.5;
}

.offline-game {
    padding: 0 20px 22px;
}

.offline-story-board {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(330px, 390px);
    overflow: visible;
    background: var(--offline-paper);
    border-radius: 0 0 20px 20px;
    box-shadow: 0 12px 32px rgba(0, 0, 0, .19);
}

.offline-events-panel {
    position: relative;
    min-height: 500px;
    padding: 24px 28px 64px;
    border-right: 1px solid rgba(30, 66, 38, .12);
}

.offline-events-heading {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 38px;
    margin-bottom: 16px;
}

.offline-events-heading h1 {
    margin: 0;
    color: #2c721d;
    font: 800 clamp(2.3rem, 5vw, 4.8rem)/1 Georgia, serif;
}

.offline-world-meta {
    display: grid;
    grid-template-columns: minmax(160px, .7fr) minmax(240px, 1.3fr);
    gap: 20px;
    color: var(--offline-green-800);
    text-align: center;
}

.offline-world-meta span {
    display: grid;
    gap: 3px;
    font-size: .8rem;
    text-transform: uppercase;
}

.offline-world-meta strong {
    font-size: .96rem;
}

.offline-event-log {
    display: grid;
    max-height: 330px;
    overflow: auto;
    gap: 12px;
    padding: 2px 8px 2px 0;
    scrollbar-color: #7d9277 transparent;
}

.offline-event-card {
    padding: 15px 18px;
    border: 1px solid rgba(45, 72, 48, .12);
    border-radius: 14px;
    color: #365a35;
    background: rgba(255, 255, 255, .26);
}

.offline-event-card h2 {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 10px;
    margin: 0 0 8px;
    color: #3d5a3b;
    font-size: 1rem;
}

.offline-event-card h2 span {
    color: #4b7d35;
    font-size: .78rem;
    font-weight: 700;
    text-transform: uppercase;
}

.offline-event-card p {
    margin: 5px 0;
    font-size: .88rem;
    font-weight: 650;
    line-height: 1.45;
    text-transform: uppercase;
}

.offline-next-moon {
    position: absolute;
    z-index: 4;
    left: 50%;
    bottom: -34px;
    min-width: min(330px, 75%);
    min-height: 72px;
    padding: 14px 24px;
    transform: translateX(-50%);
    clip-path: polygon(8% 0, 92% 0, 100% 24%, 100% 76%, 92% 100%, 8% 100%, 0 76%, 0 24%);
    color: white;
    background: #215c2e;
    box-shadow: 0 10px 24px rgba(0, 0, 0, .3);
    cursor: pointer;
    font-size: clamp(1.55rem, 4vw, 2.5rem);
    font-weight: 500;
}

.offline-next-moon:hover {
    background: #2a7038;
}

.offline-player-panel {
    position: relative;
    padding: 24px 28px;
}

.offline-player-identity {
    display: grid;
    width: calc(100% - 58px);
    gap: 5px;
    margin-bottom: 24px;
    color: var(--offline-green-800);
    background: rgba(255, 255, 255, .22);
    cursor: pointer;
    text-align: center;
}

.offline-player-identity span {
    overflow: hidden;
    border-bottom: 3px solid #478238;
    font-size: 1.5rem;
    font-weight: 900;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.offline-player-identity:hover span {
    color: #2b751f;
}

.offline-player-identity small {
    color: #5c7157;
    font-weight: 800;
}

.offline-sex-mark {
    position: absolute;
    top: 28px;
    right: 28px;
    color: #639ee0;
    font-size: 3.2rem;
    font-weight: 400;
    line-height: .8;
}

.offline-stat-list {
    display: grid;
    gap: 12px;
}

.offline-stat-row {
    display: grid;
    grid-template-columns: minmax(118px, .9fr) minmax(105px, 1.2fr) 32px;
    align-items: center;
    gap: 8px;
    font-size: .83rem;
    font-weight: 850;
    text-transform: uppercase;
}

.offline-stat-track,
.offline-relation-track {
    height: 8px;
    overflow: hidden;
    background: #f4f0bc;
    border-radius: 999px;
}

.offline-stat-fill,
.offline-relation-fill {
    display: block;
    height: 100%;
    width: var(--value, 0%);
    background: var(--bar, #397144);
}

.offline-stat-value {
    color: var(--offline-muted);
    font-size: .74rem;
    text-align: right;
}

.offline-camp {
    position: relative;
    min-height: 640px;
    margin: 56px auto 0;
    overflow: hidden;
    border: 3px solid rgba(226, 232, 202, .13);
    border-radius: 36px 36px 12px 12px;
    background:
        radial-gradient(circle at 18% 84%, rgba(149, 184, 77, .14) 0 3px, transparent 4px),
        radial-gradient(circle at 73% 66%, rgba(214, 215, 112, .13) 0 2px, transparent 3px),
        linear-gradient(180deg, rgba(69, 96, 74, .2), rgba(5, 15, 10, .7)),
        radial-gradient(ellipse at 50% 110%, #304b32 0 32%, transparent 62%),
        linear-gradient(135deg, #566a5e, #1b3127 52%, #09160e);
    box-shadow: inset 0 -120px 150px rgba(0, 0, 0, .42), 0 18px 48px rgba(0, 0, 0, .27);
    image-rendering: pixelated;
}

.offline-camp::before,
.offline-camp::after {
    position: absolute;
    inset: 0;
    content: "";
    pointer-events: none;
}

.offline-camp::before {
    opacity: .74;
    background:
        linear-gradient(90deg, transparent 0 8%, rgba(5, 19, 10, .72) 8.5% 10%, transparent 10.5% 26%, rgba(6, 22, 12, .58) 26.5% 28%, transparent 28.5% 68%, rgba(7, 25, 13, .7) 68.5% 70%, transparent 70.5% 89%, rgba(5, 19, 10, .7) 89.5% 91%, transparent 91.5%),
        radial-gradient(ellipse at 14% 36%, rgba(13, 42, 20, .8) 0 7%, transparent 8%),
        radial-gradient(ellipse at 75% 24%, rgba(13, 42, 20, .75) 0 10%, transparent 11%);
}

.offline-camp[data-season="leafbare"] {
    filter: saturate(.72) brightness(.83);
}

.offline-camp[data-season="newleaf"] {
    filter: saturate(1.08) brightness(1.04);
}

.offline-camp[data-season="leaffall"] {
    filter: sepia(.16) saturate(.9);
}

.offline-camp-cats {
    position: absolute;
    inset: 0;
}

.offline-camp-cat {
    position: absolute;
    z-index: 2;
    display: grid;
    width: 92px;
    min-height: 82px;
    place-items: end center;
    padding: 0;
    transform: translate(-50%, -50%);
    color: white;
    background: transparent;
    cursor: pointer;
    filter: drop-shadow(0 4px 3px rgba(0, 0, 0, .72));
}

.offline-camp-cat:hover {
    z-index: 8;
    transform: translate(-50%, -50%) scale(1.08);
}

.offline-camp-cat canvas {
    width: 68px;
    height: 68px;
}

.offline-camp-cat span {
    max-width: 120px;
    padding: 3px 6px;
    overflow: hidden;
    border-radius: 5px;
    background: rgba(7, 17, 10, .72);
    font-size: .68rem;
    font-weight: 850;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.offline-camp-cat.is-player span {
    color: #fff0a8;
    outline: 1px solid rgba(255, 229, 123, .52);
}

.offline-bottom-actions {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 26px;
    margin-top: -5px;
    padding: 0 22px;
}

.offline-bottom-actions button {
    min-height: 84px;
    padding: 15px;
    color: rgba(255, 255, 255, .88);
    background: #1d5b2d;
    box-shadow: 0 8px 17px rgba(0, 0, 0, .24);
    cursor: pointer;
    font-size: clamp(1rem, 3vw, 2rem);
    font-weight: 500;
}

.offline-bottom-actions button:hover {
    background: #2a7138;
}

.offline-modal {
    position: fixed;
    z-index: 1000;
    inset: 0;
    display: grid;
    place-items: center;
    padding: 20px;
}

.offline-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(3, 10, 13, .78);
    cursor: pointer;
}

.offline-modal-card {
    position: relative;
    z-index: 1;
    width: min(1000px, 100%);
    max-height: min(820px, calc(100vh - 40px));
    overflow: auto;
    padding: clamp(22px, 4vw, 42px);
    border: 10px solid #2c5944;
    border-radius: 12px;
    color: #3d241d;
    background: #eeeddd;
    box-shadow: 0 28px 80px rgba(0, 0, 0, .52);
}

.offline-modal-close {
    position: sticky;
    z-index: 4;
    top: 0;
    float: right;
    width: 44px;
    height: 44px;
    border-radius: 7px;
    color: #162110;
    background: #70a91c;
    cursor: pointer;
    font-size: 2rem;
    font-weight: 900;
    line-height: 1;
}

.offline-modal-title {
    margin: 2px 58px 24px;
    color: #215c35;
    font: 800 clamp(2rem, 5vw, 3.5rem)/1.1 Georgia, serif;
    text-align: center;
}

.offline-menu-list {
    display: grid;
    overflow: hidden;
    border: 1px solid rgba(56, 63, 46, .16);
    border-radius: 12px;
}

.offline-menu-item {
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr) 38px;
    align-items: center;
    gap: 15px;
    min-height: 92px;
    padding: 13px 18px;
    border-bottom: 1px solid rgba(56, 63, 46, .15);
    color: #214c35;
    background: rgba(255, 255, 255, .16);
    cursor: pointer;
    text-align: left;
}

.offline-menu-item:last-child {
    border-bottom: 0;
}

.offline-menu-item:hover {
    background: rgba(42, 98, 58, .08);
}

.offline-menu-item:disabled {
    opacity: .48;
    cursor: not-allowed;
}

.offline-menu-icon {
    font-size: 2rem;
    text-align: center;
}

.offline-menu-copy {
    display: grid;
    gap: 4px;
}

.offline-menu-copy strong {
    font-size: 1.08rem;
    text-transform: uppercase;
}

.offline-menu-copy small {
    color: #687568;
}

.offline-menu-arrow {
    font-size: 2.4rem;
}

.offline-profile-top {
    display: grid;
    grid-template-columns: 130px minmax(0, 1fr);
    gap: 24px;
    align-items: center;
    margin: 0 0 22px;
    padding: 16px;
    border-radius: 14px;
    background: rgba(111, 117, 85, .13);
}

.offline-profile-sprite {
    width: 126px;
    height: 126px;
}

.offline-profile-top h2 {
    margin: 0 0 9px;
    color: #5e1f1b;
    font-size: 1.65rem;
}

.offline-profile-facts {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px 24px;
    color: #5e3530;
}

.offline-profile-facts p {
    margin: 0;
}

.offline-profile-appearance {
    grid-column: 1 / -1;
    color: #6a6257;
    font-size: .9rem;
    line-height: 1.5;
}

.offline-profile-stats {
    display: grid;
    gap: 9px;
    margin: 22px 0;
}

.offline-profile-actions {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-top: 26px;
}

.offline-profile-actions button {
    min-height: 60px;
    padding: 10px;
    color: #5d211d;
    background: rgba(118, 112, 80, .13);
    cursor: pointer;
    font-weight: 800;
    text-transform: uppercase;
}

.offline-profile-actions button:hover {
    background: rgba(118, 112, 80, .24);
}

.offline-profile-actions button.is-danger {
    color: white;
    background: var(--offline-red);
}

.offline-relations-groups {
    display: grid;
    gap: 18px;
}

.offline-relation-group {
    overflow: hidden;
    border: 1px solid rgba(87, 76, 56, .15);
    border-radius: 12px;
}

.offline-relation-group h3 {
    margin: 0;
    padding: 9px 15px;
    color: #2c603b;
    background: rgba(93, 116, 76, .1);
    text-align: center;
    text-transform: uppercase;
}

.offline-relation-empty {
    margin: 0;
    padding: 14px 18px;
    color: #857d72;
    font-size: .85rem;
    text-align: center;
}

.offline-relation-row {
    display: grid;
    grid-template-columns: 62px minmax(150px, .8fr) minmax(150px, 1.6fr) 44px;
    align-items: center;
    gap: 12px;
    padding: 10px 14px;
    border-top: 1px solid rgba(87, 76, 56, .12);
}

.offline-relation-sprite {
    width: 58px;
    height: 58px;
}

.offline-relation-copy {
    display: grid;
    gap: 3px;
}

.offline-relation-copy strong {
    color: #5d211d;
}

.offline-relation-copy small {
    color: #776a60;
}

.offline-relation-meter {
    display: grid;
    grid-template-columns: minmax(80px, 1fr) 34px;
    align-items: center;
    gap: 8px;
    color: #a13232;
    font-size: .8rem;
    font-weight: 850;
}

.offline-open-profile {
    width: 40px;
    height: 40px;
    border-radius: 8px;
    color: #2f4f34;
    background: rgba(59, 92, 61, .12);
    cursor: pointer;
    font-size: 1.6rem;
}

.offline-toast {
    position: fixed;
    z-index: 1200;
    top: 18px;
    left: 50%;
    min-width: min(360px, calc(100% - 30px));
    padding: 13px 18px;
    transform: translateX(-50%);
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 10px;
    color: white;
    background: rgba(22, 72, 39, .96);
    box-shadow: 0 12px 32px rgba(0, 0, 0, .35);
    text-align: center;
    font-weight: 800;
}

@media (max-width: 1040px) {
    .offline-story-board {
        grid-template-columns: minmax(0, 1fr) 320px;
    }

    .offline-events-heading {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .offline-world-meta {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        text-align: left;
    }

    .offline-events-heading h1 {
        font-size: 2.8rem;
    }
}

@media (max-width: 780px) {
    .offline-shell {
        width: 100%;
        min-height: 100vh;
        margin: 0;
        border: 0;
        border-radius: 0;
    }

    .offline-header {
        padding: 12px 15px;
    }

    #offline-cabinet-link {
        display: none;
    }

    .offline-start-view {
        min-height: calc(100vh - 60px);
        padding: 30px 18px;
    }

    .offline-start-heading {
        display: grid;
        align-items: start;
    }

    .offline-start-heading .offline-primary-button {
        width: 100%;
    }

    .offline-save-card {
        grid-template-columns: 68px minmax(0, 1fr);
        gap: 12px;
    }

    .offline-save-sprite {
        width: 64px;
        height: 64px;
    }

    .offline-save-actions {
        grid-column: 1 / -1;
    }

    .offline-save-actions button {
        flex: 1;
    }

    .offline-game {
        padding: 0 10px 16px;
    }

    .offline-story-board {
        grid-template-columns: 1fr;
    }

    .offline-events-panel {
        min-height: 430px;
        padding: 20px 16px 60px;
        border-right: 0;
        border-bottom: 1px solid rgba(30, 66, 38, .12);
    }

    .offline-event-log {
        max-height: 270px;
    }

    .offline-next-moon {
        bottom: -30px;
        min-height: 64px;
        font-size: 1.6rem;
    }

    .offline-player-panel {
        padding: 55px 18px 24px;
    }

    .offline-sex-mark {
        top: 58px;
        right: 18px;
    }

    .offline-camp {
        min-height: 500px;
        margin-top: 24px;
        border-radius: 24px 24px 8px 8px;
    }

    .offline-camp-cat {
        width: 74px;
    }

    .offline-camp-cat canvas {
        width: 57px;
        height: 57px;
    }

    .offline-camp-cat span {
        max-width: 88px;
        font-size: .59rem;
    }

    .offline-bottom-actions {
        gap: 7px;
        padding: 0;
    }

    .offline-bottom-actions button {
        min-height: 64px;
        padding: 8px 5px;
        font-size: .78rem;
    }

    .offline-modal {
        padding: 8px;
    }

    .offline-modal-card {
        max-height: calc(100vh - 16px);
        padding: 18px 12px 28px;
        border-width: 6px;
    }

    .offline-modal-title {
        margin-left: 46px;
        margin-right: 46px;
        font-size: 2rem;
    }

    .offline-menu-item {
        grid-template-columns: 42px minmax(0, 1fr) 26px;
        min-height: 78px;
        gap: 9px;
        padding: 10px;
    }

    .offline-profile-top {
        grid-template-columns: 86px minmax(0, 1fr);
        gap: 12px;
        padding: 10px;
    }

    .offline-profile-sprite {
        width: 82px;
        height: 82px;
    }

    .offline-profile-facts {
        grid-template-columns: 1fr;
        gap: 4px;
        font-size: .85rem;
    }

    .offline-profile-actions {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    .offline-profile-actions button {
        min-height: 56px;
        font-size: .75rem;
    }

    .offline-relation-row {
        grid-template-columns: 50px minmax(0, 1fr) 38px;
        gap: 8px;
        padding: 9px 8px;
    }

    .offline-relation-sprite {
        width: 48px;
        height: 48px;
    }

    .offline-relation-meter {
        grid-column: 2;
        grid-row: 2;
    }

    .offline-open-profile {
        grid-column: 3;
        grid-row: 1 / span 2;
    }
}

@media (max-width: 430px) {
    .offline-header-button {
        padding: 7px 5px;
        font-size: .76rem;
    }

    .offline-random-name-card {
        grid-template-columns: 1fr;
    }

    .offline-random-name-card > button {
        grid-column: 1;
        grid-row: auto;
        justify-self: start;
        padding-left: 0;
    }

    .offline-world-meta {
        grid-template-columns: 1fr;
        gap: 7px;
    }

    .offline-events-heading h1 {
        font-size: 2.2rem;
    }

    .offline-stat-row {
        grid-template-columns: 105px minmax(80px, 1fr) 28px;
        font-size: .72rem;
    }
}

/* ======================================================================
   Interforest v14.10.47 — компактная офлайн-игра и редактор внешности
   ====================================================================== */

body.offline-page.is-playing {
    height: 100dvh;
    overflow: hidden;
}

body.offline-page.is-playing .offline-shell {
    height: calc(100dvh - 28px);
    min-height: 0;
}

.offline-create-card {
    max-width: 1040px;
}

.offline-create-fields {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.offline-appearance-editor {
    display: grid;
    grid-template-columns: minmax(230px, .72fr) minmax(0, 1.6fr);
    gap: 20px;
    margin: 2px 0;
    padding: 18px;
    border: 1px solid rgba(30, 66, 38, .2);
    border-radius: 16px;
    background: rgba(28, 76, 40, .055);
}

.offline-appearance-editor legend {
    padding: 0 9px;
    color: var(--offline-green-800);
    font: 800 1.1rem Georgia, serif;
}

.offline-appearance-preview {
    display: grid;
    place-items: center;
    align-content: center;
    min-height: 250px;
    padding: 14px;
    border-radius: 14px;
    background: radial-gradient(circle, rgba(255,255,255,.9), rgba(184,195,165,.38));
}

.offline-appearance-preview > span {
    color: var(--offline-muted);
    font-size: .75rem;
    font-weight: 800;
    text-align: center;
    text-transform: uppercase;
}

.offline-appearance-preview canvas {
    width: 180px;
    height: 180px;
    image-rendering: pixelated;
}

.offline-appearance-preview .offline-text-button {
    color: var(--offline-green-700);
}

.offline-appearance-controls {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-content: center;
    gap: 11px 14px;
}

.offline-appearance-check {
    display: flex !important;
    grid-column: 1 / -1;
    align-items: center;
    gap: 9px !important;
    min-height: 42px;
    padding: 8px 11px;
    border: 1px solid rgba(30, 66, 38, .2);
    border-radius: 10px;
    background: rgba(255,255,244,.72);
}

.offline-appearance-check input {
    width: 18px;
    height: 18px;
    accent-color: var(--offline-green-700);
}

.offline-save-sprite,
.offline-relation-sprite,
.offline-profile-sprite {
    overflow: hidden;
}

.offline-save-sprite canvas {
    width: 68px;
    height: 68px;
}

.offline-relation-sprite canvas {
    width: 48px;
    height: 48px;
}

.offline-profile-sprite canvas {
    width: 104px;
    height: 104px;
}

.offline-game {
    display: grid;
    grid-template-rows: minmax(250px, 42%) minmax(190px, 1fr) 60px;
    gap: 8px;
    height: calc(100dvh - 94px);
    min-height: 0;
    padding: 0 14px 8px;
}

.offline-story-board {
    height: 100%;
    min-height: 0;
}

.offline-events-panel {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    min-height: 0;
    padding: 15px 22px 48px;
}

.offline-events-heading {
    gap: 20px;
    margin-bottom: 8px;
}

.offline-events-heading h1 {
    font-size: clamp(2rem, 4vw, 3.3rem);
}

.offline-event-log {
    max-height: none;
    min-height: 0;
}

.offline-event-card {
    padding: 10px 14px;
}

.offline-next-moon {
    bottom: -22px;
    min-width: min(280px, 70%);
    min-height: 52px;
    font-size: clamp(1.25rem, 3vw, 1.8rem);
}

.offline-player-panel {
    min-height: 0;
    overflow: hidden;
    padding: 16px 22px;
}

.offline-player-identity {
    gap: 3px;
    margin-bottom: 12px;
}

.offline-player-identity span {
    font-size: 1.25rem;
}

.offline-sex-mark {
    top: 18px;
    right: 21px;
    font-size: 2.5rem;
}

.offline-stat-list {
    gap: 7px;
}

.offline-camp {
    height: 100%;
    min-height: 0;
    margin: 0;
    border-radius: 22px 22px 8px 8px;
}

.offline-camp-cat {
    width: 64px;
    min-height: 62px;
}

.offline-camp-cat canvas {
    width: 50px;
    height: 50px;
}

.offline-camp-cat span {
    max-width: 82px;
    padding: 2px 4px;
    font-size: .56rem;
}

.offline-bottom-actions {
    gap: 12px;
    height: 60px;
    margin: 0;
    padding: 0;
}

.offline-bottom-actions button {
    min-height: 0;
    height: 60px;
    padding: 8px;
    font-size: clamp(.85rem, 2vw, 1.25rem);
}

.offline-modal-card {
    max-height: calc(100dvh - 24px);
    overflow: auto;
    padding: 20px 28px 24px;
    border-width: 7px;
    scrollbar-width: none;
}

.offline-modal-card::-webkit-scrollbar {
    display: none;
}

.offline-modal-card.is-profile {
    width: min(1080px, 100%);
}

.offline-modal-close {
    position: absolute;
    top: 14px;
    right: 14px;
}

.offline-modal-title {
    margin: 0 54px 12px;
    font-size: clamp(1.75rem, 4vw, 2.7rem);
}

.offline-profile-top {
    grid-template-columns: 108px minmax(0, 1fr);
    gap: 16px;
    margin-bottom: 10px;
    padding: 10px 14px;
}

.offline-profile-sprite {
    width: 104px;
    height: 104px;
}

.offline-profile-top h2 {
    margin-bottom: 6px;
    font-size: 1.4rem;
}

.offline-profile-facts {
    gap: 5px 18px;
    font-size: .88rem;
}

.offline-profile-appearance {
    line-height: 1.3;
}

.offline-profile-relation {
    display: grid;
    grid-template-columns: minmax(130px, auto) minmax(150px, 1fr) 58px;
    align-items: center;
    gap: 12px;
    margin: 8px 0;
    padding: 9px 12px;
    border-radius: 10px;
    color: #5d211d;
    background: rgba(181, 74, 77, .08);
    font-weight: 850;
    text-transform: uppercase;
}

.offline-profile-stats {
    gap: 5px;
    margin: 10px 0;
}

.offline-profile-stats .offline-stat-row {
    min-height: 18px;
}

.offline-profile-actions {
    gap: 8px;
    margin-top: 12px;
}

.offline-profile-actions button {
    min-height: 44px;
    padding: 7px;
    font-size: .78rem;
}

.offline-relations-groups {
    gap: 10px;
}

.offline-relation-group summary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto 24px;
    align-items: center;
    gap: 10px;
    padding: 11px 15px;
    color: #2c603b;
    background: rgba(93, 116, 76, .1);
    cursor: pointer;
    font-weight: 850;
    text-align: center;
    text-transform: uppercase;
    list-style: none;
}

.offline-relation-group summary::-webkit-details-marker {
    display: none;
}

.offline-relation-group summary b {
    min-width: 28px;
    padding: 2px 7px;
    border-radius: 999px;
    background: rgba(44, 96, 59, .12);
    font-size: .75rem;
}

.offline-relation-group summary i {
    font-size: 1.3rem;
    font-style: normal;
    transition: transform .16s ease;
}

.offline-relation-group[open] summary i {
    transform: rotate(180deg);
}

.offline-relation-rows {
    display: grid;
}

@media (max-width: 780px) {
    body.offline-page.is-playing .offline-shell {
        height: 100dvh;
    }

    .offline-create-fields,
    .offline-appearance-editor,
    .offline-appearance-controls {
        grid-template-columns: 1fr;
    }

    .offline-appearance-check {
        grid-column: auto;
    }

    .offline-game {
        grid-template-rows: minmax(205px, 44%) minmax(155px, 1fr) 50px;
        gap: 5px;
        height: calc(100dvh - 60px);
        padding: 0 5px 5px;
    }

    .offline-story-board {
        grid-template-columns: minmax(0, 1fr) minmax(132px, 40%);
    }

    .offline-events-panel {
        min-height: 0;
        padding: 9px 8px 38px;
        border-right: 1px solid rgba(30, 66, 38, .12);
        border-bottom: 0;
    }

    .offline-events-heading {
        gap: 4px;
        margin-bottom: 4px;
    }

    .offline-events-heading h1 {
        font-size: 1.45rem;
    }

    .offline-world-meta {
        grid-template-columns: 1fr;
        gap: 2px;
        font-size: .58rem;
        text-align: left;
    }

    .offline-world-meta span,
    .offline-world-meta strong {
        font-size: .58rem;
    }

    .offline-event-card {
        padding: 6px 8px;
    }

    .offline-event-card h2 {
        margin-bottom: 4px;
        font-size: .72rem;
    }

    .offline-event-card p {
        margin: 2px 0;
        font-size: .63rem;
        line-height: 1.25;
    }

    .offline-next-moon {
        bottom: -18px;
        min-width: 72%;
        min-height: 42px;
        font-size: 1rem;
    }

    .offline-player-panel {
        padding: 10px 8px;
    }

    .offline-player-identity {
        width: calc(100% - 26px);
        gap: 1px;
        margin-bottom: 7px;
    }

    .offline-player-identity span {
        border-bottom-width: 2px;
        font-size: .88rem;
    }

    .offline-player-identity small {
        font-size: .58rem;
    }

    .offline-sex-mark {
        top: 11px;
        right: 7px;
        font-size: 1.7rem;
    }

    .offline-stat-list {
        gap: 3px;
    }

    .offline-stat-row {
        grid-template-columns: 64px minmax(32px, 1fr) 26px;
        gap: 3px;
        font-size: .54rem;
    }

    .offline-stat-track {
        height: 5px;
    }

    .offline-stat-value {
        font-size: .5rem;
    }

    .offline-camp {
        min-height: 0;
        margin: 0;
        border-radius: 14px 14px 6px 6px;
    }

    .offline-camp-cat {
        width: 56px;
        min-height: 54px;
    }

    .offline-camp-cat canvas {
        width: 42px;
        height: 42px;
    }

    .offline-camp-cat span {
        max-width: 66px;
        font-size: .48rem;
    }

    .offline-bottom-actions {
        height: 50px;
        gap: 4px;
    }

    .offline-bottom-actions button {
        height: 50px;
        min-height: 0;
        font-size: .64rem;
    }

    .offline-modal-card {
        max-height: calc(100dvh - 10px);
        padding: 14px 10px 18px;
    }

    .offline-modal-title {
        margin-bottom: 8px;
        font-size: 1.65rem;
    }

    .offline-profile-relation {
        grid-template-columns: 92px minmax(70px, 1fr) 48px;
        gap: 6px;
        font-size: .68rem;
    }
}

/* v14.10.48: финальные размеры офлайн-сцены после адаптивов прошлых версий. */
body.offline-page.is-playing .offline-shell {
    width: min(1640px, calc(100% - 16px));
    height: calc(100dvh - 16px);
    margin: 8px auto;
}

.offline-game {
    grid-template-rows: minmax(218px, 31%) minmax(0, 1fr) 58px;
    gap: 7px;
    height: calc(100dvh - 80px);
    padding: 0 10px 8px;
}

.offline-story-board {
    grid-template-columns: minmax(0, 1fr) minmax(300px, 370px);
}

.offline-events-panel {
    padding: 13px 20px 42px;
}

.offline-events-heading h1 {
    font-size: clamp(1.9rem, 3.6vw, 3rem);
}

.offline-next-moon {
    bottom: -20px;
    min-width: min(250px, 62%);
    min-height: 48px;
    font-size: clamp(1.05rem, 2.3vw, 1.55rem);
}

.offline-player-panel {
    padding: 13px 18px;
}

.offline-player-identity {
    margin-bottom: 9px;
}

.offline-stat-list {
    gap: 5px;
}

.offline-camp {
    min-height: 0;
    border-radius: 18px 18px 7px 7px;
    background:
        radial-gradient(circle at 9% 24%, rgba(225, 231, 107, .42) 0 2px, transparent 3px),
        radial-gradient(circle at 20% 76%, rgba(225, 231, 107, .4) 0 2px, transparent 3px),
        radial-gradient(circle at 36% 45%, rgba(225, 231, 107, .38) 0 2px, transparent 3px),
        radial-gradient(circle at 56% 82%, rgba(225, 231, 107, .42) 0 2px, transparent 3px),
        radial-gradient(circle at 72% 31%, rgba(225, 231, 107, .36) 0 2px, transparent 3px),
        radial-gradient(circle at 91% 67%, rgba(225, 231, 107, .4) 0 2px, transparent 3px),
        linear-gradient(180deg, rgba(76, 102, 78, .18), rgba(4, 14, 9, .7)),
        radial-gradient(ellipse at 50% 112%, #345037 0 34%, transparent 65%),
        linear-gradient(135deg, #5a6d61, #1b3227 52%, #08150e);
    box-shadow: inset 0 0 55px rgba(0, 0, 0, .42);
}

.offline-camp-cat {
    width: 52px;
    min-height: 50px;
}

.offline-camp-cat span {
    max-width: 72px;
    padding: 1px 4px;
    font-size: .5rem;
}

.offline-bottom-actions,
.offline-bottom-actions button {
    height: 58px;
}

@media (max-width: 780px) {
    body.offline-page.is-playing .offline-shell {
        width: 100%;
        height: 100dvh;
        margin: 0;
    }

    .offline-game {
        grid-template-rows: minmax(190px, 34%) minmax(0, 1fr) 48px;
        height: calc(100dvh - 60px);
    }

    .offline-story-board {
        grid-template-columns: minmax(0, 1fr) minmax(126px, 38%);
    }

    .offline-bottom-actions,
    .offline-bottom-actions button {
        height: 48px;
    }
}

/* ======================================================================
   Interforest v14.10.49 — события и параметры слева, квадратная Обитель справа
   ====================================================================== */

.offline-game {
    --offline-camp-size: min(56vw, calc(100dvh - 145px));
    grid-template-columns: minmax(330px, 1fr) var(--offline-camp-size);
    grid-template-rows: minmax(0, 1fr) 58px;
    grid-template-areas:
        "information camp"
        "actions actions";
    align-items: stretch;
    gap: 7px 10px;
}

.offline-story-board {
    grid-area: information;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: minmax(0, 56%) minmax(0, 44%);
    overflow: hidden;
    border-radius: 0 0 18px 18px;
}

.offline-events-panel {
    min-height: 0;
    padding: 14px 18px 40px;
    overflow: visible;
    border-right: 0;
    border-bottom: 1px solid rgba(30, 66, 38, .15);
}

.offline-events-heading {
    grid-template-columns: auto minmax(0, 1fr);
    gap: 20px;
}

.offline-events-heading h1 {
    font-size: clamp(1.75rem, 3vw, 2.8rem);
}

.offline-world-meta {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    font-size: .78rem;
}

.offline-event-log {
    min-height: 0;
}

.offline-next-moon {
    bottom: -19px;
    min-width: min(230px, 58%);
    min-height: 46px;
}

.offline-player-panel {
    display: grid;
    grid-template-rows: auto auto minmax(0, 1fr);
    min-height: 0;
    padding: 26px 18px 12px;
    overflow: hidden;
}

.offline-parameters-title {
    margin: 0 42px 4px 0;
    color: var(--offline-green-700);
    font: 900 .72rem/1.2 system-ui, sans-serif;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.offline-player-identity {
    width: calc(100% - 50px);
    margin-bottom: 8px;
    text-align: left;
}

.offline-player-identity span {
    font-size: 1.12rem;
    text-align: left;
}

.offline-sex-mark {
    top: 29px;
    right: 18px;
    font-size: 2.15rem;
}

.offline-stat-list {
    align-content: center;
    gap: 5px;
}

.offline-stat-row {
    grid-template-columns: minmax(98px, .75fr) minmax(80px, 1.5fr) 32px;
    min-height: 18px;
    font-size: .7rem;
}

.offline-camp {
    grid-area: camp;
    width: 100%;
    height: auto;
    aspect-ratio: 1;
    align-self: center;
    justify-self: end;
    margin: 0;
    border-radius: 20px 20px 8px 8px;
}

.offline-bottom-actions {
    grid-area: actions;
    margin: 0;
}

@media (max-width: 900px) {
    .offline-game {
        --offline-camp-size: min(56vw, calc(100dvh - 145px));
        grid-template-columns: minmax(275px, 1fr) var(--offline-camp-size);
    }

    .offline-events-heading {
        gap: 9px;
    }

    .offline-world-meta {
        grid-template-columns: 1fr;
        gap: 2px;
        text-align: left;
    }
}

@media (max-width: 780px) {
    .offline-game {
        grid-template-columns: minmax(145px, 42%) minmax(0, 58%);
        grid-template-rows: minmax(0, 1fr) 48px;
        gap: 5px;
    }

    .offline-story-board {
        grid-template-columns: 1fr;
        grid-template-rows: minmax(0, 52%) minmax(0, 48%);
    }

    .offline-events-panel {
        padding: 7px 6px 31px;
        border-right: 0;
    }

    .offline-events-heading {
        grid-template-columns: 1fr;
        gap: 2px;
    }

    .offline-events-heading h1 {
        font-size: 1.05rem;
    }

    .offline-world-meta,
    .offline-world-meta span,
    .offline-world-meta strong {
        font-size: .48rem;
    }

    .offline-next-moon {
        bottom: -15px;
        min-width: 82%;
        min-height: 36px;
        font-size: .78rem;
    }

    .offline-player-panel {
        padding: 20px 6px 5px;
    }

    .offline-parameters-title {
        margin-right: 24px;
        font-size: .46rem;
    }

    .offline-player-identity {
        width: calc(100% - 23px);
        margin-bottom: 3px;
    }

    .offline-player-identity span {
        font-size: .68rem;
    }

    .offline-sex-mark {
        top: 22px;
        right: 5px;
        font-size: 1.35rem;
    }

    .offline-stat-list {
        gap: 2px;
    }

    .offline-stat-row {
        grid-template-columns: 55px minmax(26px, 1fr) 21px;
        gap: 2px;
        min-height: 12px;
        font-size: .45rem;
    }

    .offline-camp {
        width: 100%;
        height: auto;
        align-self: start;
        border-radius: 12px 12px 5px 5px;
    }
}

/* ======================================================================
   Interforest v14.10.51 — компактная Обитель слева и лента жизни справа
   ====================================================================== */

body.offline-page.is-playing {
    overflow: hidden;
}

body.offline-page.is-playing .offline-shell {
    width: min(1640px, calc(100% - 16px));
    height: calc(100dvh - 16px);
    min-height: 0;
    margin: 8px auto;
}

.offline-game {
    display: grid;
    grid-template-columns: minmax(330px, 39%) minmax(0, 61%);
    grid-template-rows: minmax(0, 1fr);
    grid-template-areas: "left story";
    align-items: stretch;
    gap: 10px;
    height: calc(100dvh - 80px);
    min-height: 0;
    padding: 0 10px 8px;
}

.offline-left-column {
    grid-area: left;
    display: grid;
    grid-template-rows: auto minmax(230px, 48%) minmax(0, 1fr);
    min-width: 0;
    min-height: 0;
    gap: 8px;
}

.offline-world-meta {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
    align-items: center;
    min-height: 58px;
    gap: 12px;
    padding: 9px 16px;
    border-radius: 0 0 14px 14px;
    color: var(--offline-green-800);
    background: var(--offline-paper);
    box-shadow: 0 8px 22px rgba(0, 0, 0, .18);
    text-align: center;
}

.offline-world-meta span {
    display: grid;
    min-width: 0;
    gap: 2px;
    font-size: .72rem;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.offline-world-meta strong {
    overflow: hidden;
    color: var(--offline-green-800);
    font-size: clamp(.76rem, 1vw, .98rem);
    font-weight: 900;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.offline-world-meta small {
    color: #64725f;
    font-size: .68rem;
    font-weight: 750;
}

.offline-camp {
    grid-area: auto;
    width: 100%;
    height: 100%;
    min-height: 0;
    aspect-ratio: auto;
    align-self: stretch;
    justify-self: stretch;
    margin: 0;
    border-width: 2px;
    border-radius: 16px;
}

.offline-camp-cat {
    width: 50px;
    min-height: 48px;
}

.offline-camp-cat canvas.clangen-cat-sprite {
    width: 38px !important;
    height: 38px !important;
    max-width: 38px !important;
    max-height: 38px !important;
}

.offline-camp-cat span {
    max-width: 66px;
    padding: 1px 4px;
    font-size: .48rem;
}

.offline-player-panel {
    position: relative;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    min-width: 0;
    min-height: 0;
    padding: 14px 18px 12px;
    overflow: hidden;
    border-radius: 14px;
    color: var(--offline-green-800);
    background: var(--offline-paper);
    box-shadow: 0 8px 22px rgba(0, 0, 0, .18);
}

.offline-parameters-title {
    margin: 0 0 10px;
    padding-bottom: 8px;
    border-bottom: 2px solid rgba(47, 106, 50, .28);
    color: var(--offline-green-700);
    font: 900 .75rem/1.2 system-ui, sans-serif;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.offline-stat-list {
    display: grid;
    align-content: center;
    gap: clamp(5px, .8vh, 9px);
    min-height: 0;
}

.offline-stat-row {
    grid-template-columns: minmax(100px, .8fr) minmax(78px, 1.55fr) 40px;
    min-height: 18px;
    gap: 8px;
    font-size: clamp(.64rem, .77vw, .78rem);
}

.offline-story-board {
    grid-area: story;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto minmax(0, 1fr) 72px;
    height: 100%;
    min-width: 0;
    min-height: 0;
    overflow: visible;
    border-radius: 0 0 18px 18px;
    background: var(--offline-paper);
    box-shadow: 0 12px 32px rgba(0, 0, 0, .19);
}

.offline-character-header {
    position: relative;
    display: grid;
    min-height: 78px;
    place-items: center;
    padding: 10px 74px 8px 22px;
    border-bottom: 1px solid rgba(30, 66, 38, .14);
}

.offline-player-identity {
    display: grid;
    width: min(470px, 100%);
    gap: 4px;
    margin: 0;
    color: var(--offline-green-800);
    background: transparent;
    cursor: pointer;
    text-align: center;
}

.offline-player-identity span {
    overflow: hidden;
    padding: 0 16px 4px;
    border-bottom: 3px solid #478238;
    color: var(--offline-green-800);
    font: 900 clamp(1.2rem, 2.2vw, 1.85rem)/1.1 Georgia, serif;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.offline-player-identity small {
    color: #64725f;
    font-size: .76rem;
    font-weight: 800;
}

.offline-sex-mark {
    position: absolute;
    top: 50%;
    right: 25px;
    transform: translateY(-50%);
    font-size: 2.45rem;
    line-height: 1;
}

.offline-events-panel {
    display: grid;
    grid-template-rows: minmax(0, 1fr);
    min-width: 0;
    min-height: 0;
    padding: 12px 18px 20px;
    overflow: hidden;
    border: 0;
}

.offline-event-log {
    display: grid;
    align-content: start;
    max-height: none;
    min-height: 0;
    gap: 0;
    padding: 0 9px 0 0;
    overflow-y: auto;
    scrollbar-color: #7d9277 transparent;
}

.offline-event-card {
    padding: 18px 10px 16px;
    border: 0;
    border-bottom: 1px solid rgba(45, 72, 48, .16);
    border-radius: 0;
    color: #475747;
    background: transparent;
}

.offline-event-card:first-child {
    padding-top: 10px;
}

.offline-event-card h2 {
    display: block;
    width: fit-content;
    margin: 0 0 10px;
    color: #205b6d;
    font-size: clamp(1rem, 1.35vw, 1.2rem);
    font-weight: 950;
    line-height: 1.25;
    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 4px;
}

.offline-event-card p {
    margin: 5px 0;
    color: #4e5b4e;
    font-size: clamp(.78rem, .95vw, .94rem);
    font-weight: 600;
    line-height: 1.42;
    text-transform: none;
}

.offline-bottom-actions {
    position: relative;
    z-index: 5;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 116px minmax(0, 1fr);
    align-items: end;
    gap: 12px;
    height: 72px;
    margin: 0;
    padding: 8px 14px 0;
    border-top: 1px solid rgba(30, 66, 38, .16);
    background: rgba(218, 221, 201, .96);
}

.offline-bottom-actions > button:not(.offline-next-moon) {
    height: 58px;
    min-height: 58px;
    padding: 10px;
    border-radius: 11px 11px 0 0;
    color: white;
    background: #165c2a;
    box-shadow: none;
    cursor: pointer;
    font-size: clamp(.72rem, 1.15vw, 1rem);
    font-weight: 900;
}

.offline-bottom-actions > button:not(.offline-next-moon):hover {
    background: #1d7436;
}

.offline-story-board .offline-next-moon {
    position: relative;
    z-index: 7;
    left: auto;
    bottom: auto;
    width: 112px;
    min-width: 112px;
    height: 112px;
    min-height: 112px;
    margin: 0 auto;
    padding: 13px 10px;
    transform: none;
    border: 5px solid #f4e7d0;
    border-radius: 50%;
    clip-path: none;
    color: white;
    background: #bd1f24;
    box-shadow: 0 7px 18px rgba(80, 5, 7, .38);
    cursor: pointer;
    font-size: .86rem;
    font-weight: 950;
    line-height: 1.12;
}

.offline-story-board .offline-next-moon:hover {
    background: #982026;
    transform: scale(1.035);
}

.offline-story-board .offline-next-moon:disabled {
    cursor: wait;
    opacity: .66;
}

@media (max-width: 900px) {
    .offline-game {
        grid-template-columns: minmax(250px, 41%) minmax(0, 59%);
        gap: 7px;
    }

    .offline-left-column {
        grid-template-rows: auto minmax(200px, 45%) minmax(0, 1fr);
        gap: 6px;
    }

    .offline-world-meta {
        min-height: 50px;
        gap: 6px;
        padding: 7px 8px;
    }

    .offline-player-panel {
        padding: 10px 9px 8px;
    }

    .offline-stat-row {
        grid-template-columns: 78px minmax(52px, 1fr) 31px;
        gap: 4px;
        font-size: .58rem;
    }

    .offline-story-board {
        grid-template-rows: auto minmax(0, 1fr) 62px;
    }

    .offline-character-header {
        min-height: 66px;
        padding: 8px 47px 7px 12px;
    }

    .offline-sex-mark {
        right: 13px;
        font-size: 1.9rem;
    }

    .offline-events-panel {
        padding: 8px 10px 16px;
    }

    .offline-bottom-actions {
        grid-template-columns: minmax(0, 1fr) 92px minmax(0, 1fr);
        height: 62px;
        gap: 7px;
        padding: 7px 7px 0;
    }

    .offline-bottom-actions > button:not(.offline-next-moon) {
        height: 50px;
        min-height: 50px;
        font-size: .65rem;
    }

    .offline-story-board .offline-next-moon {
        width: 90px;
        min-width: 90px;
        height: 90px;
        min-height: 90px;
        border-width: 4px;
        font-size: .68rem;
    }
}

@media (max-width: 620px) {
    body.offline-page.is-playing .offline-shell {
        width: 100%;
        height: 100dvh;
        margin: 0;
        border-radius: 0;
    }

    .offline-game {
        grid-template-columns: minmax(132px, 40%) minmax(0, 60%);
        height: calc(100dvh - 60px);
        gap: 4px;
        padding: 0 3px 3px;
    }

    .offline-left-column {
        grid-template-rows: auto minmax(148px, 42%) minmax(0, 1fr);
        gap: 4px;
    }

    .offline-world-meta {
        grid-template-columns: 1fr;
        min-height: 54px;
        gap: 2px;
        padding: 4px;
        border-radius: 0 0 8px 8px;
    }

    .offline-world-meta span,
    .offline-world-meta strong,
    .offline-world-meta small {
        font-size: .43rem;
    }

    .offline-camp {
        border-radius: 8px;
    }

    .offline-camp-cat {
        width: 36px;
        min-height: 36px;
    }

    .offline-camp-cat canvas.clangen-cat-sprite {
        width: 28px !important;
        height: 28px !important;
        max-width: 28px !important;
        max-height: 28px !important;
    }

    .offline-camp-cat span {
        max-width: 42px;
        padding: 1px 2px;
        font-size: .34rem;
    }

    .offline-player-panel {
        padding: 7px 4px 5px;
        border-radius: 8px;
    }

    .offline-parameters-title {
        margin-bottom: 4px;
        padding-bottom: 4px;
        font-size: .42rem;
    }

    .offline-stat-list {
        gap: 2px;
    }

    .offline-stat-row {
        grid-template-columns: 50px minmax(20px, 1fr) 22px;
        min-height: 10px;
        gap: 2px;
        font-size: .39rem;
    }

    .offline-stat-track {
        height: 4px;
    }

    .offline-stat-value {
        font-size: .38rem;
    }

    .offline-story-board {
        grid-template-rows: auto minmax(0, 1fr) 48px;
        border-radius: 0 0 8px 8px;
    }

    .offline-character-header {
        min-height: 54px;
        padding: 5px 30px 5px 5px;
    }

    .offline-player-identity span {
        padding: 0 3px 3px;
        border-bottom-width: 2px;
        font-size: .82rem;
    }

    .offline-player-identity small {
        font-size: .44rem;
    }

    .offline-sex-mark {
        right: 7px;
        font-size: 1.2rem;
    }

    .offline-events-panel {
        padding: 4px 4px 10px;
    }

    .offline-event-log {
        padding-right: 3px;
    }

    .offline-event-card {
        padding: 9px 4px 8px;
    }

    .offline-event-card h2 {
        margin-bottom: 6px;
        font-size: .65rem;
        text-underline-offset: 2px;
    }

    .offline-event-card p {
        margin: 3px 0;
        font-size: .5rem;
        line-height: 1.35;
    }

    .offline-bottom-actions {
        grid-template-columns: minmax(0, 1fr) 62px minmax(0, 1fr);
        height: 48px;
        gap: 3px;
        padding: 4px 3px 0;
    }

    .offline-bottom-actions > button:not(.offline-next-moon) {
        height: 40px;
        min-height: 40px;
        padding: 4px 2px;
        border-radius: 6px 6px 0 0;
        font-size: .46rem;
    }

    .offline-story-board .offline-next-moon {
        width: 60px;
        min-width: 60px;
        height: 60px;
        min-height: 60px;
        padding: 6px 3px;
        border-width: 3px;
        font-size: .45rem;
    }
}

/* ======================================================================
   Interforest v14.10.61 — настройки мира, родословная и полный экран лагеря
   ====================================================================== */

.offline-world-settings {
    display: grid;
    gap: 16px;
    margin: 0;
    padding: 18px;
    border: 1px solid rgba(44, 91, 53, .22);
    border-radius: 14px;
    background: rgba(239, 242, 217, .58);
}

.offline-world-settings[hidden] {
    display: none;
}

.offline-world-settings legend,
.offline-world-mods > strong {
    color: var(--offline-green-800);
    font-weight: 900;
}

.offline-world-settings > p {
    margin: 0;
    color: var(--offline-muted);
}

.offline-world-settings input[type="number"],
.offline-create-form input[type="text"],
.offline-create-form input:not([type]) {
    width: 100%;
    min-height: 49px;
    padding: 11px 12px;
    border: 1px solid rgba(30, 66, 38, .25);
    border-radius: 10px;
    color: var(--offline-green-900);
    background: rgba(255, 255, 244, .9);
}

.offline-world-mods,
.offline-world-mod-list {
    display: grid;
    gap: 8px;
}

.offline-world-mods[hidden] {
    display: none;
}

.offline-world-mod-list label {
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    padding: 9px 11px;
    border: 1px solid rgba(44, 91, 53, .16);
    border-radius: 9px;
    background: rgba(255, 255, 255, .6);
}

.offline-world-settings-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 9px;
}

.offline-world-meta {
    grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr) minmax(0, 1.35fr);
}

.offline-world-meta .offline-leader-resources {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 2px 6px;
    margin: 0;
    font-size: .68rem;
    line-height: 1.2;
}

.offline-world-meta .offline-leader-resources[hidden] {
    display: none;
}

.offline-genealogy-tree,
.offline-profile-family,
.offline-profile-family-list {
    display: grid;
    gap: 9px;
}

.offline-genealogy-subject {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 11px 13px;
    border: 2px solid rgba(44, 91, 53, .32);
    border-radius: 11px;
    color: #244d30;
    background: #f7f3df;
}

.offline-genealogy-generation h4,
.offline-profile-family-list h4 {
    margin: 8px 0 5px;
    color: #566352;
    font-size: .72rem;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.offline-relation-placement-links {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: 4px;
}

.offline-relation-jump {
    padding: 2px 6px;
    border: 1px solid rgba(44, 91, 53, .2);
    border-radius: 999px;
    color: #31583a;
    background: rgba(255, 255, 255, .68);
    cursor: pointer;
    font-size: .62rem;
    font-weight: 750;
}

.offline-relation-row.is-jump-target {
    animation: offline-relation-jump-highlight 1.35s ease;
}

@keyframes offline-relation-jump-highlight {
    0%, 100% { box-shadow: none; }
    25%, 70% { box-shadow: 0 0 0 4px rgba(181, 116, 56, .3); }
}

.offline-profile-family {
    margin: 11px 0;
}

.offline-profile-family > details {
    overflow: hidden;
    border: 1px solid rgba(44, 91, 53, .2);
    border-radius: 11px;
    background: rgba(247, 243, 223, .72);
}

.offline-profile-family > details > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 11px 13px;
    cursor: pointer;
    font-weight: 850;
}

.offline-profile-family-list {
    max-height: 310px;
    padding: 0 10px 10px;
    overflow: auto;
}

.offline-profile-family-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto 20px;
    align-items: center;
    width: 100%;
    gap: 8px;
    padding: 8px 10px;
    border: 0;
    border-top: 1px solid rgba(44, 91, 53, .12);
    color: inherit;
    text-align: left;
    background: rgba(255, 255, 255, .54);
    cursor: pointer;
}

.offline-profile-family-row span {
    display: grid;
    min-width: 0;
}

.offline-profile-family-row small,
.offline-inbreeding-inline {
    color: #687363;
    font-size: .7rem;
}

@media (max-width: 620px) {
    .offline-world-meta {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        min-height: 54px;
    }

    .offline-world-meta .offline-leader-resources {
        font-size: .4rem;
    }

    .offline-world-settings-actions > button {
        width: 100%;
    }
}

/* ======================================================================
   Interforest v14.10.58 — подписи отношений и карточки поиска
   ====================================================================== */

.offline-relation-meter {
    grid-template-columns: minmax(80px, 1fr) 34px;
}

.offline-relation-meter .offline-relation-status {
    grid-column: 1 / -1;
    color: #6b3436;
    font-size: .72rem;
    font-weight: 900;
    text-align: left;
    text-transform: uppercase;
}

.offline-network-row {
    grid-template-columns: minmax(130px, 1fr) minmax(100px, auto) minmax(120px, 2fr) 40px;
}

.offline-network-row > .offline-relation-status {
    color: #6b3436;
    font-size: .72rem;
    font-weight: 900;
    text-align: center;
    text-transform: uppercase;
}

.offline-search-profile {
    display: grid;
    gap: 6px;
    padding: 12px;
    border: 1px solid rgba(44, 96, 59, .18);
    border-radius: 12px;
    background: rgba(255, 255, 255, .72);
}

.offline-search-profile small {
    color: #6d6259;
}

.offline-search-profile button {
    min-height: 38px;
    border-radius: 9px;
    color: #28543a;
    background: rgba(93, 116, 76, .12);
    cursor: pointer;
    font-weight: 850;
}

@media (max-width: 620px) {
    .offline-network-row {
        grid-template-columns: minmax(85px, 1fr) minmax(75px, auto) minmax(70px, 1fr) 32px;
    }

    .offline-relation-row {
        grid-template-columns: 52px minmax(110px, 1fr) minmax(110px, 1.2fr) 36px;
        gap: 7px;
    }
}

.offline-modal[data-locked="true"] .offline-modal-close {
    display: none;
}

.offline-training-progress {
    display: grid;
    gap: .55rem;
    margin: .85rem 0 1rem;
    padding: .9rem 1rem;
    border: 1px solid rgba(91, 119, 72, .24);
    border-radius: 1rem;
    background: rgba(239, 245, 224, .82);
}

.offline-training-progress > span:first-child {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
}

.offline-training-progress small,
.offline-herb-list small,
.offline-herb-grid small,
.offline-stale-info {
    color: #6e735f;
}

.offline-profile-actions .is-heal {
    border-color: #7da35a;
    background: #e3f0d4;
    color: #34532d;
}

.offline-inline-help {
    display: inline-block;
    margin-left: .45rem;
    padding: .25rem .5rem;
    border: 1px solid rgba(77, 119, 68, .3);
    border-radius: .55rem;
    background: #edf5df;
    color: #46643d;
    font: inherit;
    font-size: .78rem;
    cursor: pointer;
}

.offline-herb-list,
.offline-herb-grid {
    display: grid;
    gap: .65rem;
    margin: 1rem 0;
}

.offline-herb-list label,
.offline-herb-grid button {
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    padding: .8rem;
    border: 1px solid rgba(91, 119, 72, .22);
    border-radius: .85rem;
    background: #f8faef;
    color: inherit;
    text-align: left;
}

.offline-herb-list label > span,
.offline-herb-grid button {
    flex: 1;
}

.offline-herb-list strong,
.offline-herb-list small,
.offline-herb-grid strong,
.offline-herb-grid small {
    display: block;
}

.offline-herb-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-height: min(58vh, 34rem);
    overflow: auto;
}

.offline-herb-grid button {
    cursor: pointer;
}

.offline-herb-grid button:hover {
    border-color: #7da35a;
    background: #edf5df;
}

.offline-subtitle {
    margin: 1.4rem 0 .6rem;
    color: #536640;
}

@media (max-width: 620px) {
    .offline-herb-grid {
        grid-template-columns: 1fr;
    }
}

/* v14.10.55 — большие офлайн-системы */
.offline-stat-row.is-critical,
.offline-profile-facts .is-critical {
    color: #b51f2e;
    font-weight: 800;
}

.offline-profile-sprite.is-unknown {
    display: grid;
    place-items: center;
    background: linear-gradient(145deg, #28312d, #101714);
}

.offline-unknown-cat {
    display: grid;
    place-items: center;
    width: 76%;
    aspect-ratio: 1;
    border: 2px dashed rgba(255, 255, 255, .35);
    border-radius: 50%;
    color: rgba(255, 255, 255, .82);
    font: 800 clamp(2.5rem, 9vw, 5rem)/1 Georgia, serif;
}

.offline-clan-form input,
.offline-litter-names input {
    box-sizing: border-box;
    width: 100%;
    min-height: 44px;
    padding: 9px 12px;
    border: 1px solid rgba(67, 91, 72, .3);
    border-radius: 10px;
    background: rgba(255, 255, 255, .84);
    color: #213128;
    font: inherit;
}

.offline-input-prefix {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 8px;
}

.offline-input-prefix b {
    color: #395c43;
}

.offline-litter-names {
    display: grid;
    gap: 10px;
    width: 100%;
}

.offline-litter-names label {
    display: grid;
    gap: 5px;
    text-align: left;
    font-weight: 700;
}

/* v14.10.57 — большое обновление офлайн-жизни */
.offline-choice-card > select {
    width: 100%;
    min-height: 46px;
    padding: 8px 10px;
    border: 1px solid rgba(49, 93, 61, .25);
    border-radius: 8px;
    background: #fff;
    color: #2f2a25;
    font: inherit;
}

.offline-mentor-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 9px;
    width: 100%;
}

.offline-mentor-list button {
    display: grid;
    gap: 5px;
    min-height: 62px;
    padding: 10px 12px;
    border: 1px solid rgba(53, 87, 60, .25);
    border-radius: 9px;
    background: rgba(255, 255, 255, .82);
    color: #315d3d;
    text-align: left;
    font: inherit;
    cursor: pointer;
}

.offline-mentor-list small {
    color: #6c776e;
}

/* ======================================================================
   Interforest v14.10.54 — живая офлайн-история
   ====================================================================== */

button.offline-profile-relation {
    width: 100%;
    border: 1px solid rgba(181, 74, 77, .2);
    font: inherit;
    cursor: pointer;
    transition: background .16s ease, transform .16s ease, box-shadow .16s ease;
}

button.offline-profile-relation:hover,
button.offline-profile-relation:focus-visible {
    background: rgba(181, 74, 77, .16);
    box-shadow: 0 8px 22px rgba(90, 36, 32, .11);
    transform: translateY(-1px);
}

.offline-relation-row.is-dead,
.offline-network-row.is-dead {
    filter: grayscale(.86);
    opacity: .68;
}

.offline-network-list {
    display: grid;
    gap: 7px;
    margin-top: 14px;
}

.offline-network-row {
    display: grid;
    grid-template-columns: minmax(130px, 1fr) minmax(120px, 2fr) 40px;
    align-items: center;
    gap: 12px;
    width: 100%;
    padding: 10px 12px;
    border: 1px solid rgba(44, 96, 59, .14);
    border-radius: 10px;
    color: #342a23;
    background: rgba(255, 255, 255, .62);
    text-align: left;
    cursor: pointer;
}

.offline-network-row:hover {
    background: rgba(93, 116, 76, .1);
}

.offline-network-row > span:first-child {
    display: grid;
    gap: 2px;
}

.offline-network-row small {
    color: #6d6259;
}

.offline-run-form,
.offline-choice-card,
.offline-death-card,
.offline-result-card {
    display: grid;
    gap: 16px;
    margin: 14px auto 0;
    padding: 20px;
    border: 1px solid rgba(70, 94, 64, .18);
    border-radius: 16px;
    background: rgba(255, 255, 255, .7);
    text-align: center;
}

.offline-run-form {
    max-width: 620px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    text-align: left;
}

.offline-run-form label {
    display: grid;
    gap: 7px;
    color: #315d3d;
    font-weight: 850;
    text-transform: uppercase;
}

.offline-run-form select {
    min-height: 46px;
    padding: 8px 10px;
    border: 1px solid rgba(49, 93, 61, .25);
    border-radius: 8px;
    color: #2f2a25;
    background: #fff;
    font: inherit;
}

.offline-run-form > button {
    grid-column: 1 / -1;
}

.offline-choice-card,
.offline-death-card,
.offline-result-card {
    max-width: 720px;
}

.offline-choice-icon {
    font-size: 3.4rem;
    line-height: 1;
}

.offline-choice-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.offline-secondary-button,
.offline-death-children button {
    min-height: 44px;
    padding: 9px 14px;
    border: 1px solid rgba(53, 87, 60, .3);
    border-radius: 8px;
    color: #315d3d;
    background: rgba(255, 255, 255, .8);
    font: inherit;
    font-weight: 850;
    cursor: pointer;
}

.offline-apprentice-stats,
.offline-death-children {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.offline-apprentice-stats span,
.offline-death-children button {
    display: grid;
    gap: 4px;
    padding: 10px;
    border-radius: 8px;
    background: rgba(93, 116, 76, .09);
}

.offline-death-children {
    grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
}

.offline-reaction-track {
    width: 100%;
    height: 18px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(91, 73, 61, .12);
}

.offline-reaction-track i {
    display: block;
    width: var(--value);
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #be544c, #e5a129, #6aa54f);
}

.offline-result-card > strong {
    color: #315d3d;
    font-size: 1.5rem;
}

@media (max-width: 620px) {
    .offline-network-row {
        grid-template-columns: minmax(90px, 1fr) minmax(80px, 1fr) 34px;
        gap: 7px;
        padding: 8px;
    }

    .offline-run-form,
    .offline-choice-actions,
    .offline-apprentice-stats {
        grid-template-columns: 1fr;
    }

    .offline-run-form > button {
        grid-column: auto;
    }
}

/* ======================================================================
   Interforest v14.10.52 — фикс правой колонки и хронологии
   ====================================================================== */

.offline-story-board {
    display: flex !important;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
}

.offline-character-header {
    z-index: 3;
    display: flex !important;
    flex: 0 0 82px;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 82px;
    padding: 10px 74px 9px 22px;
    overflow: hidden;
    background: var(--offline-paper);
}

.offline-character-header .offline-player-identity {
    position: static;
    display: grid !important;
    visibility: visible;
    width: min(470px, 100%);
    min-width: 0;
    margin: 0;
    opacity: 1;
}

.offline-character-header .offline-player-identity span,
.offline-character-header .offline-player-identity small {
    display: block;
    visibility: visible;
    opacity: 1;
    text-align: center;
}

.offline-events-panel {
    position: relative;
    display: flex !important;
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
    padding-bottom: 18px;
}

.offline-event-log {
    flex: 1 1 auto;
    width: 100%;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
}

.offline-bottom-actions {
    grid-area: auto;
    flex: 0 0 80px;
    width: 100%;
    height: 80px;
    min-height: 80px;
    overflow: visible;
}

.offline-bottom-actions > button:not(.offline-next-moon) {
    display: flex;
    align-items: center;
    justify-content: center;
    align-self: end;
    width: 100%;
    min-width: 0;
    text-align: center;
}

.offline-story-board .offline-next-moon {
    display: flex !important;
    align-items: center;
    justify-content: center;
    align-self: end;
    box-sizing: border-box;
    text-align: center;
    white-space: normal;
}

@media (max-width: 900px) {
    .offline-character-header {
        flex-basis: 70px;
        min-height: 70px;
        padding: 8px 50px 7px 12px;
    }

    .offline-bottom-actions {
        flex-basis: 68px;
        height: 68px;
        min-height: 68px;
    }
}

@media (max-width: 620px) {
    .offline-character-header {
        flex-basis: 56px;
        min-height: 56px;
        padding: 5px 31px 5px 5px;
    }

    .offline-bottom-actions {
        flex-basis: 52px;
        height: 52px;
        min-height: 52px;
    }
}

/* ======================================================================
   Interforest v14.10.53 — нижние кнопки полностью над краем окна
   ====================================================================== */

.offline-bottom-actions {
    position: relative;
    flex: 0 0 118px;
    grid-template-columns: minmax(0, 1fr) 116px minmax(0, 1fr);
    grid-template-rows: 58px;
    align-items: stretch;
    width: 100%;
    height: 118px;
    min-height: 118px;
    padding: 12px 14px 48px;
    overflow: visible;
}

.offline-bottom-actions > button[data-open-panel="actions"] {
    grid-column: 1;
    grid-row: 1;
}

.offline-bottom-actions > button[data-open-panel="relations"] {
    grid-column: 3;
    grid-row: 1;
}

.offline-bottom-actions > button:not(.offline-next-moon) {
    align-self: stretch;
    height: 58px;
    min-height: 58px;
}

.offline-story-board .offline-next-moon {
    position: absolute !important;
    top: 0;
    right: auto;
    bottom: auto;
    left: 50%;
    align-self: auto;
    margin: 0;
    transform: translateX(-50%);
}

.offline-story-board .offline-next-moon:hover {
    transform: translateX(-50%) scale(1.035);
}

@media (max-width: 900px) {
    .offline-bottom-actions {
        flex-basis: 102px;
        grid-template-columns: minmax(0, 1fr) 94px minmax(0, 1fr);
        grid-template-rows: 50px;
        height: 102px;
        min-height: 102px;
        padding: 10px 7px 42px;
    }

    .offline-bottom-actions > button:not(.offline-next-moon) {
        height: 50px;
        min-height: 50px;
    }

    .offline-story-board .offline-next-moon {
        top: 2px;
    }
}

@media (max-width: 620px) {
    .offline-bottom-actions {
        flex-basis: 78px;
        grid-template-columns: minmax(0, 1fr) 64px minmax(0, 1fr);
        grid-template-rows: 40px;
        height: 78px;
        min-height: 78px;
        padding: 8px 3px 30px;
    }

    .offline-bottom-actions > button:not(.offline-next-moon) {
        height: 40px;
        min-height: 40px;
    }

    .offline-story-board .offline-next-moon {
        top: 3px;
    }
}

/* v14.10.58 — финальный приоритет новой сетки отношений */
.offline-network-row {
    grid-template-columns: minmax(130px, 1fr) minmax(100px, auto) minmax(120px, 2fr) 40px;
}

@media (max-width: 620px) {
    .offline-network-row {
        grid-template-columns: minmax(85px, 1fr) minmax(75px, auto) minmax(70px, 1fr) 32px;
    }
}

/* v14.10.60 — компактные ролевые ресурсы и уменьшенная карта патруля */
.offline-leader-resources {
    display: block;
    margin: 3px 0 6px;
    color: #344b36;
    font-size: .78rem;
    line-height: 1.35;
}

.offline-leader-resources[hidden] {
    display: none;
}

.offline-leader-resources button {
    display: inline;
    padding: 0;
    border: 0;
    color: #203522;
    font: inherit;
    font-weight: 800;
    text-decoration: underline dotted;
    text-underline-offset: 3px;
    background: transparent;
    cursor: pointer;
}

.offline-leader-resources small,
.offline-patrol-cats small {
    opacity: .72;
}

.offline-profile-disclosure {
    padding: 0;
    border: 0;
    color: inherit;
    font: inherit;
    text-align: inherit;
    text-decoration: underline dotted;
    text-underline-offset: 4px;
    background: none;
    cursor: pointer;
}

.offline-profile-navigation {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr) 48px;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
}

.offline-profile-navigation button {
    min-height: 38px;
    border: 1px solid rgba(61, 88, 58, .3);
    border-radius: 9px;
    background: #f7f3df;
    cursor: pointer;
}

.offline-profile-navigation span {
    text-align: center;
    color: #596558;
    font-size: .78rem;
}

.offline-cat-history,
.offline-resource-list,
.offline-patrol-results {
    display: grid;
    gap: 8px;
    max-height: min(55vh, 560px);
    overflow: auto;
}

.offline-cat-history p,
.offline-resource-list article,
.offline-resource-list button,
.offline-patrol-results article {
    margin: 0;
    padding: 10px 12px;
    border: 1px solid rgba(64, 91, 58, .22);
    border-radius: 9px;
    background: rgba(247, 243, 224, .78);
}

.offline-resource-list button {
    display: grid;
    width: 100%;
    gap: 3px;
    color: inherit;
    text-align: left;
    cursor: pointer;
}

.offline-patrol-type {
    display: grid;
    gap: 6px;
    margin: 12px 0;
    font-weight: 700;
}

.offline-patrol-type select {
    min-height: 42px;
    padding: 7px 10px;
    border: 1px solid rgba(60, 88, 56, .35);
    border-radius: 8px;
    background: #fffdf1;
}

.offline-patrol-cats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
    max-height: 210px;
    overflow: auto;
}

.offline-patrol-cats label {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    padding: 8px;
    border: 1px solid rgba(64, 91, 58, .2);
    border-radius: 8px;
    background: rgba(250, 247, 229, .8);
}

.offline-patrol-cats span {
    display: grid;
    min-width: 0;
}

.offline-patrol-summary {
    margin: 12px 0 7px;
    color: #42553e;
    font-weight: 800;
}

.offline-patrol-grid {
    display: grid;
    grid-template-columns: repeat(10, 22px);
    justify-content: center;
    gap: 2px;
    margin-bottom: 12px;
}

.offline-patrol-grid button {
    display: grid;
    place-items: center;
    aspect-ratio: 1;
    padding: 1px;
    border: 1px solid rgba(42, 79, 47, .25);
    width: 22px;
    height: 22px;
    border-radius: 3px;
    background: #e8edcf;
    cursor: pointer;
}

.offline-patrol-grid button.is-selected {
    border-color: #24522e;
    color: #fff;
    background: #3e7448;
    box-shadow: 0 0 0 2px rgba(62, 116, 72, .2);
}

.offline-patrol-grid small {
    display: none;
    opacity: .75;
}

.offline-patrol-results article p {
    margin: 5px 0 0;
    color: #4f5a4d;
}

@media (max-width: 620px) {
    .offline-leader-resources {
        font-size: .72rem;
    }

    .offline-patrol-grid {
        grid-template-columns: repeat(10, 18px);
    }

    .offline-patrol-grid button {
        width: 18px;
        height: 18px;
        font-size: .65rem;
    }

    .offline-patrol-cats {
        grid-template-columns: 1fr;
    }

    .offline-patrol-grid {
        gap: 2px;
    }

    .offline-patrol-grid button {
        font-size: .72rem;
    }
}

/* ====================================================================== */
/* Interforest v14.10.62 — общая тема сайта в офлайн-игре                */
/* ====================================================================== */

:root {
    --offline-green-950: color-mix(in srgb, var(--site-header) 74%, #000);
    --offline-green-900: var(--site-header);
    --offline-green-800: var(--site-accent-strong);
    --offline-green-700: var(--site-accent-strong);
    --offline-green-600: var(--site-accent);
    --offline-paper: var(--site-surface);
    --offline-paper-deep: var(--site-surface-2);
    --offline-ink: var(--site-text);
    --offline-muted: var(--site-muted);
}

body.offline-page {
    color: var(--site-text);
    background-color: var(--site-page);
    background-image:
        linear-gradient(180deg, color-mix(in srgb, var(--site-header) 30%, transparent), color-mix(in srgb, var(--site-header) 76%, transparent)),
        var(--site-season-background),
        linear-gradient(135deg, var(--site-page), var(--site-header));
    background-position: center;
    background-size: cover;
    background-attachment: fixed;
}

html[data-site-theme="dark"] body.offline-page {
    background-image:
        linear-gradient(180deg, color-mix(in srgb, #040706 36%, transparent), color-mix(in srgb, #040706 78%, transparent)),
        var(--site-season-background),
        linear-gradient(135deg, var(--site-page), var(--site-header));
}

.offline-shell {
    border-color: color-mix(in srgb, var(--site-header-text) 14%, transparent);
    background: color-mix(in srgb, var(--site-page) 94%, transparent);
}

.offline-header {
    color: color-mix(in srgb, var(--site-header-text) 82%, transparent);
    background: color-mix(in srgb, var(--site-header) 97%, transparent);
    border-color: color-mix(in srgb, var(--site-header-text) 12%, transparent);
}

.offline-brand,.offline-header-button:hover,.offline-text-button:hover { color: var(--site-header-text); }

.offline-page :is(
    .offline-start-view,
    .offline-story-board,
    .offline-modal-card,
    .offline-create-card,
    .offline-save-card,
    .offline-empty-saves,
    .offline-event-card,
    .offline-action-card,
    .offline-profile-card,
    .offline-resource-list > *,
    .offline-relation-card,
    .offline-patrol-results article
) {
    color: var(--site-text);
    background-color: color-mix(in srgb, var(--site-surface) 94%, transparent);
    border-color: var(--site-line);
}

.offline-page :is(
    .offline-start-heading p,
    .offline-save-card p,
    .offline-save-card small,
    .offline-event-card p,
    .offline-stat-value,
    .offline-relation-empty,
    .offline-patrol-results article p
) { color: var(--site-muted); }

.offline-page :is(
    .offline-start-heading h1,
    .offline-create-card h1,
    .offline-modal-title,
    .offline-player-identity,
    .offline-save-card h2,
    .offline-event-card h2
) { color: var(--site-accent-strong); }

.offline-page :is(input, select, textarea) {
    color: var(--site-text);
    background: var(--site-surface);
    border-color: var(--site-line);
}

.offline-page :is(
    .offline-primary-button,
    .offline-continue-save,
    .offline-next-moon,
    .offline-bottom-actions button:not(.offline-danger-button),
    .offline-randomize-appearance
) {
    color: var(--site-button-text);
    background: var(--site-accent-strong);
    border-color: color-mix(in srgb, var(--site-accent-strong) 82%, #000);
}

.offline-page :is(
    .offline-primary-button,
    .offline-continue-save,
    .offline-next-moon,
    .offline-bottom-actions button:not(.offline-danger-button),
    .offline-randomize-appearance
):hover:not(:disabled) { background: color-mix(in srgb, var(--site-accent-strong) 80%, var(--site-text)); }

.offline-page :is(.offline-stat-track,.offline-relation-track) {
    background: color-mix(in srgb, var(--site-surface-2) 72%, var(--site-text));
    border-color: var(--site-line);
}
.offline-page .offline-relation-fill { background: linear-gradient(90deg, var(--site-accent-strong), var(--site-accent)); }
.offline-page .offline-patrol-grid button { color: var(--site-text); background: var(--site-surface-2); border-color: var(--site-line); }
.offline-page .offline-patrol-grid button.is-selected { color: var(--site-button-text); background: var(--site-accent-strong); border-color: var(--site-accent); }
.offline-page .offline-patrol-summary { color: var(--site-accent-strong); }

@media (max-width: 620px) {
    .offline-shell { width: calc(100% - 12px); margin: 6px auto; border-radius: 15px; }
    .offline-header { padding: 10px 12px; }
    .offline-header-actions { gap: 2px; }
    .offline-header-button { padding: 7px 6px; font-size: .72rem; }
}