/* ========================================
   经营之道 - 标签页和折叠面板样式
   ======================================== */

/* 标签页导航 */
.business-tabs {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    display: flex;
    gap: 8px;
    border-bottom: 2px solid #e0e0e0;
    margin-bottom: 20px;
    position: sticky;
    top: 0;
    z-index: 12;
    background: rgba(13, 19, 27, 0.96);
    padding: 10px 15px 0;
    border-radius: 8px 8px 0 0;
    backdrop-filter: blur(10px);
}

#tab-business,
#business-panel,
.business-tab-panels,
.business-tab-panel {
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

#tab-business.business-entry-loading-active {
    opacity: 1 !important;
    animation: none !important;
}

.business-tab {
    padding: 12px 20px;
    border: none;
    background: transparent;
    cursor: pointer;
    font-size: 15px;
    color: #cfd6df;
    border-bottom: 3px solid transparent;
    transition: all 0.3s ease;
    border-radius: 6px 6px 0 0;
    position: relative;
    font-weight: 500;
}

.business-tab:hover {
    color: #f3b45a;
    background: rgba(243, 180, 90, 0.08);
}

.business-tab.active {
    color: #f3b45a;
    border-bottom-color: #f3b45a;
    font-weight: 600;
    background: rgba(243, 180, 90, 0.1);
}

.business-tab-badge {
    display: inline-block;
    background: #e74c3c;
    color: white;
    font-size: 11px;
    padding: 2px 6px;
    border-radius: 10px;
    margin-left: 6px;
    font-weight: bold;
}

/* 标签页内容面板 */
.business-tab-content {
    position: relative;
    min-height: 400px;
}

.business-tab-panel {
    display: none;
    animation: fadeInUp 0.3s ease-out;
}

.business-tab-panel.active {
    display: grid;
    gap: 14px;
}

.business-tab-summary {
    display: grid;
    grid-template-columns: minmax(170px, 0.55fr) minmax(0, 1.45fr);
    gap: 12px;
    align-items: stretch;
    margin-bottom: 14px;
    padding: 12px;
    border: 1px solid rgba(243, 180, 90, 0.22);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.055);
}

.business-tab-summary-title {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 4px;
    min-width: 0;
}

.business-tab-summary-title span {
    color: #f3b45a;
    font-weight: 700;
    font-size: 1.02em;
}

.business-tab-summary-title strong {
    color: #cfd6df;
    font-size: 0.88em;
    font-weight: 500;
}

.business-tab-summary-chips {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(118px, 1fr));
    gap: 8px;
}

.business-tab-summary-chip {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    min-width: 0;
    padding: 9px 10px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    background: rgba(11, 17, 24, 0.42);
}

.business-tab-summary-chip span {
    min-width: 0;
    color: #9fa9b5;
    font-size: 0.84em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.business-tab-summary-chip strong {
    color: #f2d6a2;
    font-size: 0.96em;
    white-space: nowrap;
}

.business-tab-summary-chip.ready strong {
    color: #83d7a2;
}

.business-debug-fold {
    margin-top: 14px;
    border: 1px dashed rgba(255, 255, 255, 0.18);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.035);
}

.business-debug-fold summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 14px;
    cursor: pointer;
    color: #cfd6df;
    list-style: none;
}

.business-debug-fold summary::-webkit-details-marker {
    display: none;
}

.business-debug-fold summary span {
    color: #cfd6df;
    font-weight: 700;
}

.business-debug-fold summary strong {
    color: #f3b45a;
    font-size: 0.9em;
}

.business-debug-fold[open] {
    padding-bottom: 12px;
}

.business-debug-fold > .business-section {
    margin: 0 12px 12px;
}

.business-content-fold {
    margin-bottom: 14px;
    border: 1px solid rgba(243, 180, 90, 0.18);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.035);
    overflow: hidden;
}

.business-action-deck {
    display: grid;
    grid-template-columns: minmax(160px, 0.5fr) repeat(auto-fit, minmax(190px, 1fr));
    gap: 10px;
    margin-bottom: 14px;
    padding: 12px;
    border: 1px solid rgba(131, 215, 162, 0.22);
    border-radius: 8px;
    background:
        linear-gradient(135deg, rgba(131, 215, 162, 0.08), rgba(243, 180, 90, 0.06)),
        rgba(7, 12, 18, 0.72);
}

.business-action-deck.is-empty {
    grid-template-columns: minmax(0, 1fr);
    border-color: rgba(255, 255, 255, 0.1);
}

.business-action-deck-head,
.business-action-card {
    min-width: 0;
    border-radius: 8px;
}

.business-action-deck-head {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    padding: 10px 12px;
    background: rgba(7, 12, 18, 0.52);
    border: 1px solid rgba(255, 255, 255, 0.08);
}

.business-action-deck-head span {
    color: #83d7a2;
    font-size: 0.82em;
    font-weight: 800;
}

.business-action-deck-head strong {
    color: #f2d6a2;
    font-size: 1.02em;
    line-height: 1.3;
}

.business-action-deck p {
    margin: 0;
    color: #9fa9b5;
    font-size: 0.9em;
    line-height: 1.5;
}

.business-action-card {
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto;
    gap: 9px;
    padding: 10px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: rgba(12, 18, 24, 0.78);
}

.business-action-card div {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.business-action-card span {
    width: max-content;
    max-width: 100%;
    padding: 2px 7px;
    border-radius: 999px;
    color: #f3b45a;
    background: rgba(243, 180, 90, 0.1);
    font-size: 0.72em;
    font-weight: 800;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.business-action-card strong {
    color: #f5f7fb;
    font-size: 0.95em;
    line-height: 1.32;
}

.business-action-card em {
    color: #9fa9b5;
    font-size: 0.8em;
    font-style: normal;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.business-action-card .business-action-btn {
    width: 100%;
    min-height: 34px;
}

.business-dashboard-fold {
    margin-bottom: 0;
}

.business-subpage > .business-section,
.business-subpage > .business-content-fold,
.business-subpage > .business-action-deck {
    min-width: 0;
}

.business-art-ribbon {
    display: grid;
    grid-template-columns: 150px minmax(0, 1fr);
    gap: 10px;
    align-items: stretch;
    margin-bottom: 14px;
    padding: 10px;
    border: 1px solid rgba(123, 194, 209, 0.18);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.035);
}

.business-art-ribbon-head {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    min-width: 0;
    padding: 10px;
    border-radius: 8px;
    background: rgba(8, 13, 18, 0.48);
}

.business-art-ribbon-head span {
    color: #7bc2d1;
    font-size: 0.82em;
    font-weight: 800;
}

.business-art-ribbon-head strong {
    color: #f2d6a2;
    font-size: 0.94em;
}

.business-art-ribbon-head button {
    width: max-content;
    max-width: 100%;
    min-height: 30px;
    padding: 6px 10px;
    border: 1px solid rgba(123, 194, 209, 0.3);
    border-radius: 7px;
    color: #cfe8f1;
    background: rgba(123, 194, 209, 0.1);
    cursor: pointer;
    font-size: 0.78em;
    font-weight: 700;
}

.business-art-ribbon-track {
    display: flex;
    gap: 10px;
    min-width: 0;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: thin;
}

.business-art-ribbon-card {
    position: relative;
    flex: 0 0 132px;
    height: 78px;
    padding: 0;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 8px;
    background: rgba(8, 13, 18, 0.72);
    cursor: pointer;
}

.business-art-ribbon-card img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.business-art-ribbon-card span {
    position: absolute;
    left: 7px;
    right: 7px;
    bottom: 6px;
    z-index: 1;
    color: #f5f7fb;
    font-size: 0.72em;
    font-weight: 700;
    text-align: left;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.85);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.business-art-ribbon-card::after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    height: 55%;
    background: linear-gradient(180deg, transparent, rgba(0, 0, 0, 0.78));
}

.business-art-lightbox {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: grid;
    place-items: center;
    padding: 24px;
    background: rgba(3, 7, 11, 0.88);
    backdrop-filter: blur(8px);
}

.business-art-lightbox-panel {
    position: relative;
    width: min(1180px, 96vw);
    max-height: 94vh;
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr) 52px;
    grid-template-rows: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    padding: 18px;
    border: 1px solid rgba(243, 180, 90, 0.24);
    border-radius: 8px;
    background: rgba(9, 14, 20, 0.96);
    box-shadow: 0 28px 80px rgba(0, 0, 0, 0.55);
}

.business-art-lightbox-figure {
    grid-column: 2;
    grid-row: 1;
    min-width: 0;
    min-height: 0;
    margin: 0;
    display: grid;
    gap: 10px;
}

.business-art-lightbox-figure img {
    width: 100%;
    max-height: min(72vh, 760px);
    display: block;
    object-fit: contain;
    border-radius: 8px;
    background: rgba(0, 0, 0, 0.34);
}

.business-art-lightbox-figure figcaption {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-width: 0;
}

.business-art-lightbox-figure figcaption span {
    color: #7bc2d1;
    font-size: 0.9em;
    white-space: nowrap;
}

.business-art-lightbox-figure figcaption strong {
    min-width: 0;
    color: #f5f7fb;
    font-size: 1.02em;
    text-align: right;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.business-art-lightbox-close,
.business-art-lightbox-nav {
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 8px;
    color: #f5f7fb;
    background: rgba(255, 255, 255, 0.08);
    cursor: pointer;
    font-weight: 800;
}

.business-art-lightbox-close {
    position: absolute;
    top: 14px;
    right: 14px;
    min-height: 34px;
    padding: 7px 11px;
    z-index: 2;
}

.business-art-lightbox-nav {
    min-height: 92px;
    writing-mode: vertical-rl;
    letter-spacing: 0;
}

.business-art-lightbox-nav.prev {
    grid-column: 1;
    grid-row: 1;
}

.business-art-lightbox-nav.next {
    grid-column: 3;
    grid-row: 1;
}

.business-art-lightbox-strip {
    grid-column: 1 / -1;
    grid-row: 2;
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding-top: 2px;
    scrollbar-width: thin;
}

.business-art-lightbox-strip button {
    flex: 0 0 86px;
    height: 58px;
    padding: 0;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 7px;
    background: rgba(255, 255, 255, 0.06);
    cursor: pointer;
    opacity: 0.68;
}

.business-art-lightbox-strip button.active {
    border-color: rgba(243, 180, 90, 0.64);
    opacity: var(--decor-opacity, 1);
}

.business-art-lightbox-strip img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.business-command-scene-dialog {
    position: fixed;
    inset: 0;
    z-index: 10000;
    display: grid;
    place-items: center;
    padding: 24px;
    background: rgba(3, 7, 11, 0.86);
    backdrop-filter: blur(8px);
}

.business-command-scene-dialog-panel {
    position: relative;
    width: min(1120px, 96vw);
    max-height: 94vh;
    display: grid;
    grid-template-columns: minmax(0, 1.42fr) minmax(300px, 0.72fr);
    gap: 14px;
    padding: 16px;
    overflow: hidden;
    border: 1px solid rgba(243, 180, 90, 0.24);
    border-radius: 8px;
    background: rgba(9, 14, 20, 0.97);
    box-shadow: 0 28px 80px rgba(0, 0, 0, 0.58);
}

.business-command-scene-close {
    position: absolute;
    top: 14px;
    right: 14px;
    z-index: 4;
    min-height: 34px;
    padding: 7px 11px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 8px;
    color: #f5f7fb;
    background: rgba(8, 13, 18, 0.76);
    cursor: pointer;
    font-weight: 800;
}

.business-command-scene-figure {
    position: relative;
    min-width: 0;
    min-height: 0;
    margin: 0;
    overflow: hidden;
    border-radius: 8px;
    background: rgba(0, 0, 0, 0.34);
}

.business-command-scene-figure img {
    width: 100%;
    height: 100%;
    max-height: 78vh;
    min-height: 360px;
    display: block;
    object-fit: cover;
}

.business-command-scene-figure::after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    height: 46%;
    background: linear-gradient(180deg, transparent, rgba(3, 7, 11, 0.86));
}

.business-command-scene-figure figcaption {
    position: absolute;
    left: 18px;
    right: 18px;
    bottom: 16px;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 5px;
    min-width: 0;
    color: #f5f7fb;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.76);
}

.business-command-scene-figure figcaption span {
    color: #ffd28c;
    font-size: 0.86em;
    font-weight: 800;
}

.business-command-scene-figure figcaption strong {
    color: #fff;
    font-size: 1.28em;
    line-height: 1.25;
}

.business-command-scene-body {
    min-width: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    gap: 12px;
    padding: 44px 2px 2px;
}

.business-command-scene-body p {
    margin: 0;
    color: #d7e1ea;
    font-size: 0.94em;
    line-height: 1.65;
}

.business-command-scene-metrics {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    align-content: start;
    min-width: 0;
}

.business-command-scene-metrics div {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 10px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.045);
}

.business-command-scene-metrics span {
    color: #93a4b7;
    font-size: 0.78em;
}

.business-command-scene-metrics strong {
    min-width: 0;
    color: #f3b45a;
    font-size: 1em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.business-command-scene-actions {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(112px, 1fr));
    gap: 8px;
}

.business-command-scene-actions button {
    min-height: 36px;
    padding: 8px 10px;
    border: 1px solid rgba(243, 180, 90, 0.28);
    border-radius: 8px;
    color: #ffe1ad;
    background: rgba(243, 180, 90, 0.12);
    cursor: pointer;
    font-weight: 800;
}

.business-command-scene-actions button:hover {
    border-color: rgba(243, 180, 90, 0.52);
    background: rgba(243, 180, 90, 0.18);
}

body.business-main-map-open {
    overflow: hidden;
}

.business-main-map-entry {
    min-height: 32px;
    padding: 8px 15px;
    border: 1px solid rgba(243, 180, 90, 0.28);
    border-radius: 8px;
    color: #fff3d5;
    background-color: rgba(78, 49, 26, 0.38);
    background-image: linear-gradient(180deg, rgba(255, 238, 191, 0.24), rgba(71, 41, 21, 0.16));
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14), 0 8px 18px rgba(0, 0, 0, 0.2);
    cursor: pointer;
    font-weight: 800;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.62);
    white-space: nowrap;
}

body.business-heavy-art-ready .business-main-map-entry {
    background-image:
        linear-gradient(180deg, rgba(255, 238, 191, 0.24), rgba(71, 41, 21, 0.16)),
        url("../images/business/ui/business-main-map-entry-rc2-v1.png");
    background-size: cover, 100% 100%;
}

.business-main-map-entry:hover {
    border-color: rgba(243, 180, 90, 0.56);
    background-color: rgba(101, 65, 34, 0.48);
    filter: saturate(1.08) brightness(1.04);
}

.business-main-map-entry.primary {
    border-color: rgba(255, 215, 139, 0.42);
    color: #fff7df;
    background-color: rgba(90, 64, 32, 0.52);
}

.business-main-map-overview-entry {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 12px 0 14px;
    padding: 12px 14px;
    border: 1px solid rgba(123, 194, 209, 0.18);
    border-radius: 8px;
    background:
        linear-gradient(135deg, rgba(123, 194, 209, 0.1), rgba(243, 180, 90, 0.08)),
        rgba(8, 13, 18, 0.62);
}

.business-main-map-overview-entry div {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.business-main-map-overview-entry span {
    color: #7bc2d1;
    font-size: 0.78rem;
    font-weight: 800;
}

.business-main-map-overview-entry strong {
    min-width: 0;
    color: #f5f7fb;
    font-size: 0.95rem;
    line-height: 1.3;
    overflow-wrap: anywhere;
}

.business-main-map-overview-entry--outskirts {
    border-color: rgba(137, 197, 122, 0.26);
    background:
        linear-gradient(135deg, rgba(137, 197, 122, 0.13), rgba(243, 180, 90, 0.09)),
        rgba(8, 13, 18, 0.64);
}

.business-main-map-overlay {
    position: fixed;
    inset: 0;
    z-index: 10020;
    display: grid;
    place-items: center;
    padding: 6px;
    background:
        linear-gradient(180deg, rgba(2, 6, 9, 0.4), rgba(2, 6, 9, 0.78)),
        url("../images/business/city/business-main-map-backdrop-rc2-v1.png") center / cover no-repeat,
        rgba(3, 7, 11, 0.92);
    backdrop-filter: blur(10px);
}

.business-main-map-shell {
    width: calc(100vw - 12px);
    height: calc(100vh - 12px);
    height: calc(100dvh - 12px);
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    gap: 12px;
    padding: 14px;
    overflow: hidden;
    border: 1px solid rgba(243, 180, 90, 0.25);
    border-radius: 8px;
    background:
        linear-gradient(180deg, rgba(18, 25, 30, 0.9), rgba(8, 13, 18, 0.94)),
        rgba(8, 13, 18, 0.92);
    box-shadow: 0 28px 80px rgba(0, 0, 0, 0.58), inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

.business-main-map-board-loading {
    position: relative;
    width: 100%;
    height: 100%;
    flex: 1 0 100%;
    min-width: 0;
    min-height: 100%;
    overflow: hidden;
    border-radius: 8px;
    border: 1px solid rgba(243, 180, 90, 0.18);
    background:
        radial-gradient(circle at 34% 28%, rgba(255, 232, 170, 0.1), transparent 58%),
        radial-gradient(ellipse at 67% 72%, rgba(145, 114, 62, 0.12), transparent 56%),
        linear-gradient(180deg, rgba(255, 239, 190, 0.08), rgba(78, 62, 35, 0.18)),
        url("../images/business/city/business-ground-loess-tile-v1.png");
    background-size: cover, cover, cover, 120px 120px;
    opacity: 0.92;
}

.business-main-map-board-loading > span {
    position: absolute;
    left: 10%;
    right: 10%;
    top: 48%;
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, transparent, rgba(255, 220, 140, 0.56), transparent);
    box-shadow: 0 0 18px rgba(255, 210, 128, 0.18);
}

.business-main-map-loader {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 18px;
    padding: clamp(26px, 5vw, 72px);
    color: #edf7f1;
    text-align: center;
    background:
        linear-gradient(180deg, rgba(6, 14, 16, 0.48), rgba(4, 10, 12, 0.72)),
        linear-gradient(90deg, rgba(72, 183, 164, 0.08), rgba(240, 190, 101, 0.12));
}

.business-main-map-loader::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.04), transparent),
        repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.03) 0 1px, transparent 1px 22px);
    opacity: 0.42;
}

.business-main-map-loader > * {
    position: relative;
    z-index: 1;
}

.business-main-map-loader-art {
    width: min(360px, 62vw);
}

.business-main-map-loader-copy h3 {
    font-size: clamp(1.45rem, 2.2vw, 2.6rem);
}

.business-main-map-loader-progress {
    width: min(520px, 70vw);
}

.business-main-map-loader-steps {
    max-width: 560px;
}

.business-main-map-panel--opening {
    align-self: stretch;
}

.business-main-map-opening-progress {
    height: 12px;
    padding: 2px;
    border-radius: 999px;
    background: rgba(2, 8, 10, 0.86);
    border: 1px solid rgba(242, 209, 139, 0.28);
    overflow: hidden;
    box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.4);
}

.business-main-map-opening-progress i {
    position: relative;
    display: block;
    width: var(--business-opening-progress, 12%);
    min-width: 42px;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #3db79f, #f0be65, #f6e2aa);
    background-size: 190% 100%;
    box-shadow: 0 0 14px rgba(240, 190, 101, 0.3);
    overflow: hidden;
    transition: width 260ms cubic-bezier(0.22, 0.7, 0.22, 1);
    animation: businessMainMapProgressFlow 1250ms ease-in-out infinite;
}

.business-main-map-loader-progress.business-entry-loader-progress i {
    position: relative;
    width: var(--business-opening-progress, 12%);
    min-width: 48px;
    background-size: 190% 100%;
    overflow: hidden;
    transition: width 260ms cubic-bezier(0.22, 0.7, 0.22, 1);
    animation: businessMainMapProgressFlow 1250ms ease-in-out infinite;
}

.business-main-map-opening-progress i::after,
.business-main-map-loader-progress.business-entry-loader-progress i::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.52), transparent);
    transform: translateX(-115%);
    animation: businessMainMapProgressShine 1050ms linear infinite;
}

.business-main-map-opening-steps {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.business-main-map-opening-steps span {
    min-width: 0;
    padding: 7px 9px;
    border-radius: 999px;
    color: rgba(238, 242, 234, 0.82);
    background: rgba(255, 255, 255, 0.07);
    border: 1px solid rgba(255, 255, 255, 0.11);
    font-size: 0.74rem;
    font-weight: 800;
    text-align: center;
    animation: businessLoaderStep 1200ms ease-in-out infinite;
}

.business-main-map-opening-steps span:nth-child(2) {
    animation-delay: 150ms;
}

.business-main-map-opening-steps span:nth-child(3) {
    animation-delay: 300ms;
}

.business-main-map-opening-steps span:nth-child(4) {
    animation-delay: 450ms;
}

.business-main-map-loader-steps[data-opening-stage="ground"] span:nth-child(1),
.business-main-map-loader-steps[data-opening-stage="building"] span:nth-child(-n+2),
.business-main-map-loader-steps[data-opening-stage="street"] span:nth-child(-n+3),
.business-main-map-loader-steps[data-opening-stage="wake"] span:nth-child(-n+4),
.business-main-map-opening-steps[data-opening-stage="ground"] span:nth-child(1),
.business-main-map-opening-steps[data-opening-stage="building"] span:nth-child(-n+2),
.business-main-map-opening-steps[data-opening-stage="street"] span:nth-child(-n+3),
.business-main-map-opening-steps[data-opening-stage="wake"] span:nth-child(-n+4) {
    border-color: rgba(240, 190, 101, 0.48);
    color: #fff2d3;
    background: rgba(240, 190, 101, 0.16);
}

.business-main-map-topbar {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(150px, 0.62fr) minmax(0, 1.65fr) auto;
    gap: 12px;
    align-items: center;
}

.business-main-map-title {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.business-main-map-title span {
    color: #7bc2d1;
    font-size: 0.78rem;
    font-weight: 800;
    line-height: 1.2;
}

.business-main-map-title strong {
    min-width: 0;
    color: #fff;
    font-size: 1.08rem;
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.business-main-map-hud {
    min-width: 0;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 8px;
}

.business-main-map-hud-item,
.business-main-map-panel,
.business-main-map-status span {
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: rgba(255, 255, 255, 0.045);
}

.business-main-map-hud-item {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 7px 9px;
    border-radius: 8px;
}

.business-main-map-hud-item span {
    color: #93a4b7;
    font-size: 0.7rem;
    line-height: 1.2;
}

.business-main-map-hud-item strong {
    min-width: 0;
    color: #f3b45a;
    font-size: 0.88rem;
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.business-main-map-close {
    min-height: 36px;
    padding: 8px 12px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 8px;
    color: #f5f7fb;
    background: rgba(255, 255, 255, 0.08);
    cursor: pointer;
    font-weight: 800;
}

.business-main-map-layout {
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 340px);
    gap: 12px;
}

.business-main-map-board-wrap {
    min-width: 0;
    min-height: 0;
}

.business-main-map-board {
    width: 100%;
    height: 100%;
    min-height: 0;
    aspect-ratio: auto;
    border-color: rgba(214, 183, 126, 0.28);
    background:
        radial-gradient(circle at 42% 38%, rgba(135, 128, 79, 0.2), transparent 58%),
        linear-gradient(135deg, rgba(48, 68, 55, 0.82), rgba(25, 44, 45, 0.9) 48%, rgba(55, 45, 33, 0.86)),
        rgba(8, 15, 20, 0.86);
    box-shadow: inset 0 0 0 1px rgba(255, 238, 190, 0.06), 0 18px 45px rgba(0, 0, 0, 0.24);
}

.business-main-map-board::before {
    z-index: 0;
    background-image:
        radial-gradient(circle at 40% 34%, rgba(255, 228, 166, 0.14), transparent 54%),
        linear-gradient(180deg, rgba(245, 223, 174, 0.08), rgba(12, 24, 25, 0.18)),
        url("../images/business/city/business-main-map-backdrop-rc2-v1.png");
    background-size: cover, cover, cover;
    background-position: center, center, center;
    opacity: 0.58;
    filter: sepia(0.06) saturate(0.94) contrast(0.98) brightness(1.04);
}

.business-main-map-board::after {
    z-index: 0;
    inset: 0;
    border-radius: 8px;
    background-image:
        radial-gradient(circle at 45% 35%, rgba(255, 224, 155, 0.14), transparent 48%),
        linear-gradient(180deg, rgba(255, 244, 213, 0.12), rgba(4, 11, 13, 0.16)),
        url("../images/business/city/business-main-map-atmosphere-rc2-v1.png"),
        linear-gradient(rgba(245, 225, 176, 0.01) 1px, transparent 1px),
        linear-gradient(90deg, rgba(245, 225, 176, 0.01) 1px, transparent 1px);
    background-position: center, center, center, center, center;
    background-repeat: no-repeat, no-repeat, no-repeat, repeat, repeat;
    background-size: cover, cover, cover, calc(100% / var(--cols)) calc(100% / var(--rows)), calc(100% / var(--cols)) calc(100% / var(--rows));
    pointer-events: none;
    opacity: 0.24;
}

.business-outskirts-map-overlay {
    background:
        linear-gradient(180deg, rgba(9, 18, 18, 0.44), rgba(2, 7, 10, 0.8)),
        radial-gradient(circle at 24% 22%, rgba(175, 207, 112, 0.26), transparent 32%),
        radial-gradient(circle at 78% 18%, rgba(89, 159, 173, 0.2), transparent 34%),
        url("../images/business/city/business-ground-loess-tile-v1.png") center / 420px repeat,
        rgba(4, 10, 12, 0.94);
}

.business-outskirts-map-shell {
    width: calc(100vw - 12px);
    height: calc(100dvh - 12px);
    max-width: none;
    max-height: none;
    border-color: rgba(154, 202, 117, 0.32);
    background:
        linear-gradient(180deg, rgba(18, 28, 25, 0.92), rgba(8, 15, 16, 0.95)),
        rgba(8, 13, 18, 0.94);
}

.business-outskirts-map-tabs {
    display: inline-flex;
    gap: 6px;
    margin-top: 4px;
}

.business-outskirts-map-tabs button {
    min-height: 26px;
    padding: 4px 9px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 8px;
    color: #d7e7db;
    background: rgba(255, 255, 255, 0.06);
    cursor: pointer;
    font-size: 0.72rem;
    font-weight: 900;
}

.business-outskirts-map-tabs button.active {
    color: #fff8df;
    border-color: rgba(243, 180, 90, 0.38);
    background: rgba(127, 158, 78, 0.26);
}

.business-outskirts-map-layout {
    --business-outskirts-canvas-width: 1540px;
    --business-outskirts-canvas-height: 980px;
    min-width: 0;
    min-height: 0;
    height: 100%;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(320px, 380px);
    gap: 12px;
    align-items: stretch;
}

.business-outskirts-map-board-wrap {
    min-width: 0;
    min-height: 0;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    overflow: auto;
    border: 1px solid rgba(203, 192, 128, 0.18);
    border-radius: 8px;
    background:
        linear-gradient(180deg, rgba(255, 248, 218, 0.06), rgba(6, 16, 16, 0.24)),
        rgba(6, 13, 14, 0.72);
    scrollbar-gutter: stable both-edges;
}

.business-outskirts-map-board {
    --cols: 24;
    --rows: 16;
    position: relative;
    flex: 0 0 var(--business-outskirts-canvas-width);
    width: var(--business-outskirts-canvas-width);
    height: var(--business-outskirts-canvas-height);
    min-width: var(--business-outskirts-canvas-width);
    min-height: var(--business-outskirts-canvas-height);
    overflow: hidden;
    border: 1px solid rgba(203, 192, 128, 0.26);
    border-radius: 8px;
    background:
        linear-gradient(180deg, rgba(255, 248, 218, 0.06), rgba(6, 16, 16, 0.18)),
        url("../images/business/outskirts/business-outskirts-grand-map-v1.png?v=20260616-outskirts-grand-map-v1") center / cover no-repeat,
        rgba(12, 22, 18, 0.96);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.12),
        inset 0 -28px 60px rgba(3, 11, 12, 0.22),
        0 18px 34px rgba(0, 0, 0, 0.28);
    isolation: isolate;
}

.business-outskirts-map-art {
    position: absolute;
    inset: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    pointer-events: none;
    user-select: none;
    filter: saturate(1.02) contrast(1.02) brightness(0.98);
}

.business-outskirts-map-board::before,
.business-outskirts-map-board::after {
    content: "";
    position: absolute;
    pointer-events: none;
}

.business-outskirts-map-board::before {
    inset: 0;
    z-index: 1;
    background:
        linear-gradient(180deg, rgba(255, 248, 220, 0.14), transparent 26%, rgba(4, 12, 13, 0.18)),
        radial-gradient(circle at 50% 54%, transparent 52%, rgba(3, 9, 10, 0.23));
    opacity: 0.86;
}

.business-outskirts-map-board::after {
    inset: 0;
    z-index: 2;
    border-radius: 6px;
    background:
        linear-gradient(90deg, rgba(255, 245, 206, 0.08), transparent 18%, transparent 82%, rgba(4, 10, 11, 0.16)),
        linear-gradient(180deg, rgba(255, 255, 255, 0.08), transparent 24%, rgba(2, 8, 10, 0.16));
    opacity: 1;
    filter: none;
}

.business-outskirts-river {
    position: absolute;
    left: 63%;
    top: -8%;
    z-index: 2;
    width: 18%;
    height: 116%;
    border-radius: 999px;
    background:
        linear-gradient(180deg, rgba(224, 247, 238, 0.34), transparent 18%, rgba(117, 179, 181, 0.42) 58%, rgba(51, 116, 133, 0.54)),
        linear-gradient(90deg, rgba(255, 255, 255, 0.18), rgba(58, 126, 142, 0.2), rgba(4, 40, 52, 0.34));
    opacity: 0.78;
    filter: blur(0.2px);
    transform: rotate(8deg);
}

.business-outskirts-path {
    position: absolute;
    left: 4%;
    top: 37%;
    z-index: 3;
    width: 72%;
    height: 13%;
    border-radius: 999px;
    background:
        linear-gradient(90deg, transparent, rgba(242, 210, 139, 0.34) 12%, rgba(120, 84, 44, 0.28) 50%, rgba(242, 210, 139, 0.28) 86%, transparent),
        repeating-linear-gradient(90deg, transparent 0 30px, rgba(82, 51, 24, 0.12) 32px 40px, transparent 42px 68px);
    opacity: 0.78;
    transform: rotate(2deg);
}

.business-outskirts-river,
.business-outskirts-path {
    display: none;
}

.business-outskirts-zone-card {
    position: absolute;
    left: var(--x);
    top: var(--y);
    z-index: 5;
    width: var(--w);
    height: var(--h);
    min-width: 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    gap: 4px;
    padding: clamp(7px, 0.95vw, 10px);
    border: 1px solid rgba(255, 245, 198, 0.2);
    border-radius: 8px;
    color: #f8f3df;
    background:
        linear-gradient(180deg, rgba(32, 58, 45, 0.68), rgba(10, 22, 24, 0.84)),
        rgba(12, 22, 18, 0.48);
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.12);
    font: inherit;
    text-align: left;
    overflow: hidden;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.42);
    backdrop-filter: blur(2px) saturate(1.08);
}

button.business-outskirts-zone-card {
    cursor: pointer;
}

button.business-outskirts-zone-card.ready:hover {
    border-color: rgba(243, 180, 90, 0.54);
    filter: saturate(1.08) brightness(1.05);
    transform: translateY(-1px);
}

.business-outskirts-zone-card.disabled,
.business-outskirts-zone-card:disabled {
    color: rgba(232, 225, 199, 0.76);
    border-color: rgba(255, 255, 255, 0.11);
    background:
        linear-gradient(180deg, rgba(41, 48, 39, 0.58), rgba(17, 23, 24, 0.76)),
        rgba(12, 18, 18, 0.48);
    cursor: not-allowed;
    filter: grayscale(0.32);
    opacity: 0.84;
    gap: 4px;
    padding: 8px;
}

.business-outskirts-zone-card.disabled em,
.business-outskirts-zone-card:disabled em {
    font-size: 0.66rem;
    -webkit-line-clamp: 1;
}

.business-outskirts-zone-card.disabled .business-outskirts-zone-meta b,
.business-outskirts-zone-card:disabled .business-outskirts-zone-meta b {
    font-size: 0.64rem;
}

.business-outskirts-zone-card.low-energy.ready {
    border-color: rgba(224, 133, 92, 0.36);
}

.business-outskirts-zone-card span {
    align-self: flex-start;
    padding: 3px 7px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 999px;
    color: #dcefd3;
    background: rgba(3, 10, 10, 0.28);
    font-size: 0.66rem;
    font-weight: 900;
    line-height: 1;
}

.business-outskirts-zone-card strong {
    display: -webkit-box;
    min-width: 0;
    color: #fff9df;
    font-size: clamp(0.82rem, 1.05vw, 1rem);
    line-height: 1.16;
    overflow: hidden;
    overflow-wrap: anywhere;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}

.business-outskirts-zone-card em {
    display: -webkit-box;
    min-width: 0;
    color: #dce3d5;
    font-size: clamp(0.64rem, 0.82vw, 0.76rem);
    line-height: 1.3;
    font-style: normal;
    overflow: hidden;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}

.business-outskirts-zone-card i {
    display: block;
    min-width: 0;
    margin-top: auto;
    color: #f4c66f;
    font-size: 0.72rem;
    line-height: 1.16;
    font-style: normal;
    font-weight: 900;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.business-outskirts-zone-meta {
    display: grid;
    gap: 3px;
    min-width: 0;
    margin-top: auto;
}

.business-outskirts-zone-meta b {
    min-width: 0;
    color: #f5ead0;
    font-size: 0.68rem;
    font-weight: 800;
    line-height: 1.15;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.business-outskirts-chip-list {
    min-width: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    max-height: 42px;
    overflow: hidden;
}

.business-outskirts-chip-list span {
    max-width: 100%;
    color: #f4ead0;
    background: rgba(8, 15, 16, 0.42);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.business-outskirts-chip-list.routes span {
    color: #cde9f0;
}

.business-outskirts-zone-card--warehouse .business-outskirts-chip-list.routes {
    max-height: 22px;
}

.business-outskirts-zone-actions {
    min-width: 0;
}

.business-outskirts-zone-actions .business-mini-btn {
    width: 100%;
}

.business-outskirts-zone-card--fields {
    background:
        linear-gradient(180deg, rgba(76, 107, 46, 0.66), rgba(34, 58, 35, 0.82)),
        rgba(12, 22, 18, 0.46);
}

.business-outskirts-zone-card--silkworm {
    background:
        linear-gradient(180deg, rgba(69, 92, 66, 0.66), rgba(35, 50, 42, 0.82)),
        radial-gradient(circle at 82% 18%, rgba(211, 233, 175, 0.16), transparent 34%);
}

.business-outskirts-zone-card--fishpond {
    background:
        linear-gradient(180deg, rgba(36, 101, 112, 0.64), rgba(18, 51, 61, 0.84)),
        rgba(10, 35, 42, 0.46);
}

.business-outskirts-zone-card--orchard {
    background:
        linear-gradient(180deg, rgba(87, 113, 52, 0.64), rgba(44, 62, 36, 0.84)),
        radial-gradient(circle at 78% 18%, rgba(244, 195, 159, 0.18), transparent 36%);
}

.business-outskirts-zone-card--apiary {
    background:
        linear-gradient(180deg, rgba(111, 94, 43, 0.66), rgba(58, 48, 28, 0.84)),
        radial-gradient(circle at 80% 18%, rgba(255, 217, 98, 0.18), transparent 34%);
}

.business-outskirts-zone-card--herb {
    background:
        linear-gradient(180deg, rgba(49, 90, 64, 0.66), rgba(25, 45, 42, 0.84)),
        radial-gradient(circle at 82% 18%, rgba(130, 209, 154, 0.16), transparent 34%);
}

.business-outskirts-zone-card--woodlot {
    background:
        linear-gradient(180deg, rgba(47, 86, 57, 0.66), rgba(25, 43, 34, 0.86)),
        rgba(11, 27, 20, 0.48);
}

.business-outskirts-zone-card--warehouse {
    background:
        linear-gradient(180deg, rgba(103, 76, 40, 0.66), rgba(51, 41, 29, 0.84)),
        rgba(35, 24, 16, 0.48);
    gap: 3px;
    padding: 7px;
}

.business-outskirts-zone-card--warehouse em {
    display: none;
}

.business-outskirts-zone-card--warehouse strong {
    font-size: clamp(0.78rem, 0.92vw, 0.92rem);
    line-height: 1.1;
}

.business-outskirts-zone-card--warehouse .business-outskirts-chip-list {
    flex-wrap: nowrap;
    gap: 3px;
    max-height: 20px;
}

.business-outskirts-zone-card--warehouse .business-outskirts-chip-list span {
    padding: 2px 5px;
    font-size: 0.58rem;
    line-height: 1.1;
}

.business-outskirts-zone-card--waterworks {
    background:
        linear-gradient(180deg, rgba(43, 92, 96, 0.66), rgba(27, 54, 59, 0.84)),
        rgba(16, 35, 40, 0.48);
    gap: 3px;
    padding: 7px;
}

.business-outskirts-zone-card--waterworks em {
    font-size: 0.64rem;
    line-height: 1.2;
    -webkit-line-clamp: 1;
}

.business-outskirts-zone-card--waterworks .business-outskirts-zone-meta {
    gap: 2px;
}

.business-outskirts-zone-card--waterworks .business-outskirts-zone-meta b {
    font-size: 0.64rem;
}

.business-outskirts-zone-card--waterworks .business-mini-btn {
    min-height: 0;
    padding: 4px 7px;
    font-size: 0.68rem;
    line-height: 1.15;
}

.business-outskirts-zone-card--pasture {
    background:
        linear-gradient(180deg, rgba(81, 82, 49, 0.6), rgba(47, 52, 34, 0.82)),
        rgba(17, 22, 20, 0.46);
}

.business-main-map-panel.business-outskirts-map-panel {
    grid-template-rows: auto auto auto minmax(0, 1fr) auto auto auto;
    gap: 8px;
    background:
        linear-gradient(180deg, rgba(24, 34, 31, 0.88), rgba(9, 15, 17, 0.92)),
        rgba(8, 13, 18, 0.82);
}

.business-outskirts-next-card {
    min-width: 0;
    display: grid;
    gap: 6px;
    padding: 8px 10px;
    border: 1px solid rgba(241, 190, 92, 0.3);
    border-radius: 8px;
    background:
        linear-gradient(135deg, rgba(112, 86, 39, 0.3), rgba(15, 23, 20, 0.72)),
        rgba(9, 14, 13, 0.82);
}

.business-outskirts-next-card--claim {
    border-color: rgba(94, 214, 189, 0.36);
    background:
        linear-gradient(135deg, rgba(22, 101, 85, 0.28), rgba(12, 22, 21, 0.74)),
        rgba(7, 14, 13, 0.82);
}

.business-outskirts-next-card--event-risk {
    border-color: rgba(224, 133, 92, 0.36);
    background:
        linear-gradient(135deg, rgba(125, 74, 46, 0.24), rgba(14, 19, 18, 0.76)),
        rgba(13, 13, 12, 0.82);
}

.business-outskirts-next-card--gather,
.business-outskirts-next-card--support {
    border-color: rgba(154, 202, 117, 0.28);
}

.business-outskirts-next-card > div {
    min-width: 0;
    display: grid;
    gap: 3px;
}

.business-outskirts-next-card span {
    color: #9fe0b1;
    font-size: 0.72rem;
    font-weight: 900;
}

.business-outskirts-next-card strong {
    min-width: 0;
    color: #fff7df;
    font-size: 0.96rem;
    line-height: 1.22;
    overflow-wrap: anywhere;
}

.business-outskirts-next-card em,
.business-outskirts-next-card small {
    min-width: 0;
    color: #d9e5d5;
    font-size: 0.74rem;
    line-height: 1.34;
    font-style: normal;
    overflow-wrap: anywhere;
}

.business-outskirts-next-action {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    align-items: center;
}

.business-outskirts-next-action .business-action-btn {
    min-height: 30px;
    padding: 5px 9px;
    white-space: normal;
}

.business-outskirts-event-card {
    min-width: 0;
    display: grid;
    gap: 4px;
    margin: 0;
    padding: 8px 10px;
    border: 1px solid rgba(154, 202, 117, 0.28);
    border-radius: 8px;
    background:
        linear-gradient(135deg, rgba(76, 111, 64, 0.22), rgba(8, 18, 17, 0.72)),
        rgba(8, 14, 13, 0.78);
}

.business-outskirts-event-card--risk {
    border-color: rgba(224, 133, 92, 0.36);
    background:
        linear-gradient(135deg, rgba(125, 74, 46, 0.24), rgba(13, 17, 16, 0.74)),
        rgba(13, 13, 12, 0.78);
}

.business-outskirts-event-card--boon {
    border-color: rgba(241, 190, 92, 0.32);
    background:
        linear-gradient(135deg, rgba(111, 128, 68, 0.26), rgba(15, 24, 15, 0.72)),
        rgba(9, 14, 13, 0.78);
}

.business-outskirts-event-card span {
    color: #9fe0b1;
    font-size: 0.72rem;
    font-weight: 900;
}

.business-outskirts-event-card strong {
    min-width: 0;
    color: #fff7df;
    font-size: 0.98rem;
    line-height: 1.22;
    overflow-wrap: anywhere;
}

.business-outskirts-event-card em,
.business-outskirts-event-card small {
    min-width: 0;
    color: #d9e5d5;
    font-size: 0.74rem;
    line-height: 1.36;
    font-style: normal;
    overflow-wrap: anywhere;
}

.business-outskirts-event-action {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    align-items: center;
    padding-top: 4px;
}

.business-outskirts-event-action .business-mini-btn {
    min-height: 28px;
    padding: 5px 9px;
    white-space: nowrap;
}

.business-harvest-map-overlay {
    background:
        linear-gradient(180deg, rgba(7, 17, 18, 0.5), rgba(2, 7, 8, 0.84)),
        url("../images/business/city/business-ground-loess-tile-v1.png") center / 420px repeat,
        rgba(4, 10, 12, 0.94);
}

.business-harvest-map-shell {
    width: calc(100vw - 12px);
    height: calc(100dvh - 12px);
    max-width: none;
    max-height: none;
    border-color: rgba(173, 204, 122, 0.34);
    background:
        linear-gradient(180deg, rgba(18, 31, 28, 0.94), rgba(8, 15, 16, 0.96)),
        rgba(7, 13, 15, 0.94);
}

.business-harvest-map-layout {
    min-width: 0;
    min-height: 0;
    height: 100%;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(320px, 380px);
    gap: 12px;
    align-items: stretch;
}

.business-harvest-board-wrap {
    min-width: 0;
    min-height: 0;
    align-self: start;
    overflow: auto;
    border: 1px solid rgba(219, 198, 132, 0.2);
    border-radius: 8px;
    background:
        linear-gradient(180deg, rgba(255, 248, 218, 0.06), rgba(5, 14, 15, 0.26)),
        rgba(6, 13, 14, 0.72);
}

.business-harvest-board {
    position: relative;
    min-width: 980px;
    min-height: 680px;
    height: 100%;
    overflow: hidden;
    border: 1px solid rgba(218, 201, 139, 0.24);
    border-radius: 8px;
    isolation: isolate;
    background:
        linear-gradient(145deg, rgba(185, 182, 117, 0.18), transparent 36%),
        linear-gradient(25deg, rgba(42, 113, 118, 0.2), transparent 38%),
        linear-gradient(180deg, #6e8c55, #315849 58%, #24423d);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.14),
        inset 0 -34px 70px rgba(2, 9, 10, 0.22),
        0 18px 34px rgba(0, 0, 0, 0.28);
}

.business-harvest-board::before,
.business-harvest-board::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.business-harvest-board::before {
    z-index: 1;
    background:
        repeating-linear-gradient(9deg, rgba(255, 247, 202, 0.11) 0 2px, transparent 2px 54px),
        repeating-linear-gradient(99deg, rgba(23, 53, 38, 0.15) 0 3px, transparent 3px 62px);
    opacity: 0.76;
}

.business-harvest-board::after {
    z-index: 2;
    background:
        linear-gradient(180deg, rgba(255, 252, 228, 0.14), transparent 22%, rgba(2, 8, 9, 0.2)),
        linear-gradient(90deg, rgba(2, 8, 9, 0.18), transparent 18%, transparent 82%, rgba(2, 8, 9, 0.18));
}

.business-harvest-board--paddy,
.business-harvest-board--field,
.business-harvest-board--pond,
.business-harvest-board--mulberry,
.business-harvest-board--orchard,
.business-harvest-board--apiary,
.business-harvest-board--pasture,
.business-harvest-board--herb,
.business-harvest-board--wood {
    width: 100%;
    min-width: 980px;
    min-height: 0;
    height: auto;
    aspect-ratio: 1672 / 941;
    background:
        linear-gradient(180deg, rgba(255, 248, 215, 0.04), rgba(3, 11, 10, 0.12)),
        url("../images/business/harvest/jiangnan-harvest-empty-field-v2.png") center / 100% 100% no-repeat,
        linear-gradient(180deg, #86a564, #5f8a56 48%, #35605c);
}

.business-harvest-board--paddy {
    background:
        linear-gradient(180deg, rgba(228, 255, 238, 0.06), rgba(3, 11, 10, 0.12)),
        url("../images/business/harvest/jiangnan-harvest-paddy-empty-v1.png") center / 100% 100% no-repeat,
        linear-gradient(180deg, #6fb2a6, #417b71 58%, #2c5758);
}

.business-harvest-board--pond {
    background:
        linear-gradient(180deg, rgba(228, 255, 238, 0.04), rgba(3, 11, 10, 0.12)),
        url("../images/business/harvest/jiangnan-harvest-fishpond-empty-v1.png") center / 100% 100% no-repeat,
        linear-gradient(180deg, #4f9ba5, #28727f 58%, #24515d);
}

.business-harvest-board--mulberry {
    background:
        linear-gradient(180deg, rgba(255, 248, 215, 0.04), rgba(3, 11, 10, 0.12)),
        url("../images/business/harvest/jiangnan-harvest-silkworm-empty-v1.png") center / 100% 100% no-repeat,
        linear-gradient(180deg, #789651, #456d47 58%, #2b4e3d);
}

.business-harvest-board--orchard {
    background:
        linear-gradient(180deg, rgba(255, 248, 215, 0.04), rgba(3, 11, 10, 0.12)),
        url("../images/business/harvest/jiangnan-harvest-orchard-empty-v1.png") center / 100% 100% no-repeat,
        linear-gradient(180deg, #789651, #456d47 58%, #2b4e3d);
}

.business-harvest-board--apiary {
    background:
        linear-gradient(180deg, rgba(255, 248, 215, 0.04), rgba(3, 11, 10, 0.12)),
        url("../images/business/harvest/jiangnan-harvest-apiary-empty-v1.png") center / 100% 100% no-repeat,
        linear-gradient(180deg, #789651, #456d47 58%, #2b4e3d);
}

.business-harvest-board--pasture {
    background:
        linear-gradient(180deg, rgba(255, 248, 215, 0.04), rgba(3, 11, 10, 0.12)),
        url("../images/business/harvest/jiangnan-harvest-pasture-empty-v1.png") center / 100% 100% no-repeat,
        linear-gradient(180deg, #8b9359, #59673b 58%, #364733);
}

.business-harvest-board--herb {
    background:
        linear-gradient(180deg, rgba(208, 239, 229, 0.07), rgba(3, 11, 10, 0.14)),
        url("../images/business/harvest/jiangnan-harvest-herb-empty-v2.png") center / 100% 100% no-repeat,
        linear-gradient(180deg, #5b8065, #3a5c4f 54%, #213b36);
}

.business-harvest-board--wood {
    background:
        linear-gradient(180deg, rgba(222, 250, 191, 0.05), rgba(3, 11, 10, 0.16)),
        url("../images/business/harvest/jiangnan-harvest-woodlot-empty-v2.png") center / 100% 100% no-repeat,
        linear-gradient(180deg, #4f7148, #2e4a34 54%, #192f26);
}

.business-harvest-board--paddy::before,
.business-harvest-board--field::before,
.business-harvest-board--pond::before,
.business-harvest-board--mulberry::before,
.business-harvest-board--orchard::before,
.business-harvest-board--apiary::before,
.business-harvest-board--pasture::before,
.business-harvest-board--herb::before,
.business-harvest-board--wood::before {
    opacity: 0.22;
}

.business-harvest-board--paddy .business-harvest-terrain,
.business-harvest-board--field .business-harvest-terrain,
.business-harvest-board--pond .business-harvest-terrain,
.business-harvest-board--mulberry .business-harvest-terrain,
.business-harvest-board--orchard .business-harvest-terrain,
.business-harvest-board--apiary .business-harvest-terrain,
.business-harvest-board--pasture .business-harvest-terrain,
.business-harvest-board--herb .business-harvest-terrain,
.business-harvest-board--wood .business-harvest-terrain {
    display: none;
}

.business-harvest-terrain {
    position: absolute;
    z-index: 3;
    pointer-events: none;
}

.business-harvest-terrain--river {
    left: -6%;
    bottom: -9%;
    width: 62%;
    height: 26%;
    border-radius: 50%;
    transform: rotate(-6deg);
    background:
        linear-gradient(180deg, rgba(203, 238, 222, 0.38), rgba(61, 139, 150, 0.52)),
        rgba(40, 112, 126, 0.42);
    opacity: 0.76;
}

.business-harvest-terrain--ridge {
    right: -10%;
    top: -8%;
    width: 42%;
    height: 34%;
    border-radius: 42% 0 0 56%;
    background:
        repeating-linear-gradient(138deg, rgba(56, 74, 37, 0.24) 0 12px, rgba(178, 167, 92, 0.12) 12px 20px),
        rgba(54, 82, 42, 0.42);
    opacity: 0.68;
}

.business-harvest-terrain--village {
    right: 7%;
    bottom: 8%;
    width: 18%;
    height: 16%;
    border-radius: 8px;
    background:
        linear-gradient(90deg, rgba(94, 63, 35, 0.42) 0 18%, transparent 18% 24%, rgba(94, 63, 35, 0.42) 24% 42%, transparent 42% 50%, rgba(94, 63, 35, 0.42) 50% 70%, transparent 70%),
        linear-gradient(180deg, rgba(223, 194, 125, 0.18), rgba(67, 44, 25, 0.3));
    opacity: 0.66;
}

.business-harvest-scene-head {
    position: relative;
    z-index: 6;
    width: min(500px, calc(100% - 48px));
    margin: 22px 24px 12px;
    display: grid;
    gap: 5px;
    padding: 12px 14px;
    border: 1px solid rgba(255, 245, 198, 0.22);
    border-radius: 8px;
    color: #fff9df;
    background: rgba(8, 18, 18, 0.42);
    backdrop-filter: blur(2px) saturate(1.05);
}

.business-harvest-scene-head span {
    width: max-content;
    padding: 3px 8px;
    border-radius: 999px;
    color: #e2f0d6;
    background: rgba(255, 255, 255, 0.08);
    font-size: 0.72rem;
    font-weight: 900;
}

.business-harvest-scene-head strong {
    font-size: 1.16rem;
    line-height: 1.15;
}

.business-harvest-scene-head em {
    color: #e7dec2;
    font-size: 0.82rem;
    font-style: normal;
}

.business-harvest-scene-grid {
    position: relative;
    z-index: 6;
    display: grid;
    grid-template-columns: repeat(4, minmax(118px, 1fr));
    grid-auto-rows: minmax(92px, 1fr);
    gap: 12px;
    width: min(760px, calc(100% - 72px));
    min-height: 360px;
    margin: 16px 36px 0;
}

.business-harvest-board--paddy .business-harvest-scene-grid,
.business-harvest-board--field .business-harvest-scene-grid,
.business-harvest-board--pond .business-harvest-scene-grid,
.business-harvest-board--mulberry .business-harvest-scene-grid,
.business-harvest-board--orchard .business-harvest-scene-grid,
.business-harvest-board--apiary .business-harvest-scene-grid,
.business-harvest-board--pasture .business-harvest-scene-grid,
.business-harvest-board--herb .business-harvest-scene-grid,
.business-harvest-board--wood .business-harvest-scene-grid {
    position: absolute;
    inset: 0;
    width: auto;
    height: auto;
    min-height: 0;
    margin: 0;
    display: block;
    pointer-events: none;
}

.business-harvest-board--paddy .business-harvest-scene-tile,
.business-harvest-board--field .business-harvest-scene-tile,
.business-harvest-board--pond .business-harvest-scene-tile,
.business-harvest-board--mulberry .business-harvest-scene-tile,
.business-harvest-board--orchard .business-harvest-scene-tile,
.business-harvest-board--apiary .business-harvest-scene-tile,
.business-harvest-board--pasture .business-harvest-scene-tile,
.business-harvest-board--herb .business-harvest-scene-tile,
.business-harvest-board--wood .business-harvest-scene-tile {
    position: absolute;
    left: var(--plot-left);
    top: var(--plot-top);
    width: var(--plot-width);
    height: var(--plot-height);
    clip-path: var(--plot-clip);
    pointer-events: auto;
}

.business-harvest-scene-tile {
    min-width: 0;
    position: relative;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 4px;
    padding: 8px;
    border: 1px solid rgba(255, 245, 198, 0.2);
    border-radius: 8px;
    color: #fff6d6;
    font: inherit;
    background:
        linear-gradient(180deg, rgba(255, 246, 196, 0.08), rgba(18, 54, 39, 0.12)),
        rgba(8, 16, 13, 0.16);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 10px 18px rgba(0, 0, 0, 0.12);
    cursor: pointer;
    transition: border-color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

.business-harvest-scene-tile:hover,
.business-harvest-scene-tile:focus-visible,
.business-harvest-scene-tile.selected {
    border-color: rgba(255, 230, 122, 0.76);
    background:
        linear-gradient(180deg, rgba(255, 235, 138, 0.16), rgba(32, 73, 43, 0.18)),
        rgba(16, 26, 15, 0.22);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.18), 0 0 0 2px rgba(255, 214, 94, 0.14), 0 12px 22px rgba(0, 0, 0, 0.18);
    transform: translateY(-1px);
}

.business-harvest-board--pond .business-harvest-scene-tile {
    background:
        linear-gradient(180deg, rgba(229, 248, 226, 0.16), rgba(26, 83, 94, 0.16)),
        repeating-linear-gradient(135deg, rgba(56, 143, 158, 0.56) 0 20px, rgba(46, 118, 137, 0.56) 20px 40px);
}

.business-harvest-board--orchard .business-harvest-scene-tile,
.business-harvest-board--mulberry .business-harvest-scene-tile,
.business-harvest-board--apiary .business-harvest-scene-tile {
    background:
        linear-gradient(180deg, rgba(255, 233, 170, 0.1), rgba(24, 61, 35, 0.18)),
        radial-gradient(circle at 35% 35%, rgba(238, 205, 135, 0.38) 0 12px, transparent 13px),
        radial-gradient(circle at 70% 62%, rgba(64, 121, 55, 0.62) 0 18px, transparent 19px),
        rgba(58, 101, 48, 0.56);
}

.business-harvest-board--mulberry .business-harvest-scene-tile {
    clip-path: none;
    overflow: visible;
    border-color: transparent;
    background: none;
    box-shadow: none;
}

.business-harvest-board--mulberry .business-harvest-scene-tile:hover,
.business-harvest-board--mulberry .business-harvest-scene-tile:focus-visible,
.business-harvest-board--mulberry .business-harvest-scene-tile.selected {
    background: none;
    box-shadow: none;
}

.business-harvest-board--pasture .business-harvest-scene-tile {
    clip-path: none;
    overflow: visible;
    border-color: transparent;
    background: none;
    box-shadow: none;
}

.business-harvest-board--pasture .business-harvest-scene-tile:hover,
.business-harvest-board--pasture .business-harvest-scene-tile:focus-visible,
.business-harvest-board--pasture .business-harvest-scene-tile.selected {
    background: none;
    box-shadow: none;
}

.business-harvest-board--pasture .business-harvest-scene-tile::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    display: none;
    border: 1px solid rgba(255, 245, 198, 0.2);
    border-radius: 8px;
    clip-path: var(--plot-clip);
    background:
        linear-gradient(180deg, rgba(238, 214, 147, 0.12), rgba(60, 61, 34, 0.18)),
        repeating-linear-gradient(45deg, rgba(124, 115, 57, 0.5) 0 22px, rgba(86, 101, 48, 0.5) 22px 44px);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 10px 18px rgba(0, 0, 0, 0.12);
    pointer-events: none;
}

.business-harvest-board--pasture .business-harvest-scene-tile:hover::before,
.business-harvest-board--pasture .business-harvest-scene-tile:focus-visible::before,
.business-harvest-board--pasture .business-harvest-scene-tile.selected::before {
    border-color: rgba(255, 230, 122, 0.76);
    background:
        linear-gradient(180deg, rgba(255, 235, 138, 0.16), rgba(32, 73, 43, 0.18)),
        repeating-linear-gradient(45deg, rgba(124, 115, 57, 0.56) 0 22px, rgba(86, 101, 48, 0.56) 22px 44px);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.18), 0 0 0 2px rgba(255, 214, 94, 0.14), 0 12px 22px rgba(0, 0, 0, 0.18);
}

.business-harvest-board--pasture .business-harvest-crop-sprite {
    z-index: 1;
}

.business-harvest-board--pasture .business-harvest-scene-tile:nth-child(1),
.business-harvest-board--pasture .business-harvest-scene-tile:nth-child(3) {
    --crop-translate-y: -60%;
}

.business-harvest-board--pasture .business-harvest-scene-tile:nth-child(2),
.business-harvest-board--pasture .business-harvest-scene-tile:nth-child(4) {
    --crop-translate-y: -59%;
}

.business-harvest-board--herb .business-harvest-scene-tile,
.business-harvest-board--wood .business-harvest-scene-tile {
    background:
        linear-gradient(180deg, rgba(182, 228, 157, 0.12), rgba(18, 50, 36, 0.18)),
        repeating-linear-gradient(135deg, rgba(52, 102, 55, 0.52) 0 18px, rgba(35, 77, 50, 0.52) 18px 38px);
}

.business-harvest-board--herb .business-harvest-scene-tile {
    clip-path: none;
    overflow: visible;
    border-color: transparent;
    background: none;
    box-shadow: none;
}

.business-harvest-board--herb .business-harvest-scene-tile:hover,
.business-harvest-board--herb .business-harvest-scene-tile:focus-visible,
.business-harvest-board--herb .business-harvest-scene-tile.selected {
    background: none;
    box-shadow: none;
}

.business-harvest-board--wood .business-harvest-scene-tile {
    clip-path: none;
    overflow: visible;
    border-color: transparent;
    background: none;
    box-shadow: none;
}

.business-harvest-board--wood .business-harvest-scene-tile:hover,
.business-harvest-board--wood .business-harvest-scene-tile:focus-visible,
.business-harvest-board--wood .business-harvest-scene-tile.selected {
    background: none;
    box-shadow: none;
}

.business-harvest-scene-tile b {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 3;
    display: grid;
    place-items: center;
    width: 26px;
    height: 26px;
    border-radius: 999px;
    color: #1f2f23;
    background: rgba(255, 237, 142, 0.86);
    font-size: 0.78rem;
    font-weight: 1000;
    box-shadow: 0 4px 10px rgba(16, 18, 8, 0.18);
    pointer-events: none;
}

.business-harvest-scene-tile > span:not(.business-harvest-crop-cluster) {
    position: relative;
    z-index: 2;
    max-width: 100%;
    overflow: hidden;
    color: #fff8dc;
    font-size: 0.78rem;
    font-weight: 900;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.business-harvest-scene-tile small {
    position: relative;
    z-index: 2;
    max-width: 100%;
    overflow: hidden;
    color: rgba(255, 247, 218, 0.82);
    font-size: 0.68rem;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.business-harvest-crop-sprite {
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: 1;
    width: min(var(--crop-size, 56%), 140px);
    aspect-ratio: 1 / 1;
    background-image: var(--crop-image, var(--terrain-crop-image, url("../images/business/harvest/jiangnan-crop-growth-stages-centered-v1.png")));
    background-repeat: no-repeat;
    background-size: 400% 100%;
    background-position: calc(var(--crop-stage, 0) * 33.333333%) 50%;
    filter: drop-shadow(0 8px 6px rgba(9, 18, 8, 0.28));
    transform: translate(var(--crop-translate-x, -50%), var(--crop-translate-y, -50%)) rotate(var(--crop-rotation, 0deg)) scale(var(--crop-scale-x, 1), var(--crop-scale-y, 1));
    transform-origin: 50% 56%;
    pointer-events: none;
}

.business-harvest-scene-tile.has-crop-units .business-harvest-crop-sprite {
    display: none;
}

.business-harvest-scene-tile > .business-harvest-crop-cluster {
    position: absolute;
    inset: 0 1% 2%;
    z-index: 1;
    display: block;
    max-width: none;
    overflow: visible;
    -webkit-clip-path: none;
    clip-path: none;
    pointer-events: none;
}

.business-harvest-crop-unit {
    position: absolute;
    left: var(--unit-left, 50%);
    top: var(--unit-top, 50%);
    z-index: var(--unit-z, 1);
    width: var(--unit-size, var(--crop-unit-size, 36px));
    aspect-ratio: 1 / 1;
    background-image: var(--crop-image, var(--terrain-crop-image, url("../images/business/harvest/jiangnan-crop-growth-stages-centered-v1.png")));
    background-repeat: no-repeat;
    background-size: 400% 100%;
    background-position: var(--unit-bg-position, calc(var(--crop-stage, 0) * 33.333333%)) 50%;
    border-radius: 48% 56% 45% 52%;
    clip-path: ellipse(var(--unit-clip-x, 74%) var(--unit-clip-y, 68%) at 50% 58%);
    overflow: hidden;
    opacity: var(--unit-opacity, 0.92);
    filter: drop-shadow(0 4px 4px rgba(9, 20, 8, 0.16)) saturate(0.9) brightness(0.96);
    transform: translate(-50%, -58%) rotate(var(--unit-rotation, 0deg)) scale(var(--unit-scale-x, 1), var(--unit-scale-y, 1));
    transform-origin: 50% 72%;
    pointer-events: none;
}

.business-harvest-crop-unit--image {
    background-image: none;
    border-radius: 0;
    clip-path: none;
    overflow: visible;
}

.business-harvest-crop-unit--image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    pointer-events: none;
    user-select: none;
}

.business-harvest-board--paddy .business-harvest-crop-cluster {
    inset: -9% -7% -9%;
    overflow: visible;
}

.business-harvest-board--paddy .business-harvest-scene-head {
    width: min(300px, calc(100% - 48px));
    margin: 16px 20px 8px;
    gap: 2px;
    padding: 8px 10px;
    border-color: rgba(255, 245, 198, 0.1);
    background: linear-gradient(90deg, rgba(8, 18, 18, 0.5), rgba(8, 18, 18, 0.22) 78%, rgba(8, 18, 18, 0));
    backdrop-filter: none;
    text-shadow: 0 2px 5px rgba(0, 0, 0, 0.46);
}

.business-harvest-board--paddy .business-harvest-scene-head span {
    padding: 2px 7px;
    font-size: 0.68rem;
}

.business-harvest-board--paddy .business-harvest-scene-head strong {
    font-size: 1.06rem;
}

.business-harvest-board--paddy .business-harvest-scene-head em {
    font-size: 0.76rem;
}

.business-harvest-board--paddy .business-harvest-scene-tile.has-grain-units > .business-harvest-crop-cluster--grain {
    z-index: 2;
}

.business-harvest-scene-tile > .business-harvest-crop-cluster--grain {
    inset: -12% -8% -10%;
    overflow: visible;
    -webkit-clip-path: none;
    clip-path: none;
    -webkit-mask-image: none;
    mask-image: none;
}

.business-harvest-scene-tile > .business-harvest-crop-cluster--aquatic {
    inset: -12% -8% -10%;
    overflow: visible;
    -webkit-clip-path: none;
    clip-path: none;
    -webkit-mask-image: none;
    mask-image: none;
}

.business-harvest-board--paddy .business-harvest-crop-unit {
    opacity: var(--unit-opacity, 0.9);
    filter: drop-shadow(0 4px 4px rgba(9, 20, 8, 0.12)) saturate(0.88) brightness(0.95);
}

.business-harvest-board--field .business-harvest-crop-unit {
    border-radius: 0;
    -webkit-clip-path: none;
    clip-path: none;
    overflow: visible;
    filter: saturate(0.9) brightness(0.96) contrast(1.04);
}

.business-harvest-crop-cluster--grain .business-harvest-crop-unit {
    border-radius: 0;
    clip-path: none;
    overflow: visible;
    filter: drop-shadow(0 4px 4px rgba(80, 55, 17, 0.16)) saturate(1.12) brightness(1.08);
}

.business-harvest-board--paddy .business-harvest-crop-cluster--grain .business-harvest-crop-unit {
    height: calc(var(--unit-size, var(--crop-unit-size, 36px)) * 1.5);
    aspect-ratio: auto;
    filter: drop-shadow(0 2px 2px rgba(48, 48, 22, 0.08)) saturate(1.04) brightness(1.08);
    transform: translate(-50%, -70%) rotate(var(--unit-rotation, 0deg)) scale(var(--unit-scale-x, 1), var(--unit-scale-y, 1));
    transform-origin: 50% 88%;
}

.business-harvest-crop-cluster--aquatic .business-harvest-crop-unit {
    border-radius: 48% 58% 45% 54%;
    clip-path: ellipse(var(--unit-clip-x, 58%) var(--unit-clip-y, 52%) at 50% 58%);
    filter: drop-shadow(0 3px 3px rgba(8, 30, 22, 0.12)) saturate(0.82) brightness(0.93);
    mix-blend-mode: normal;
}

.business-harvest-crop-cluster--aquatic .business-harvest-crop-unit--harvest-image {
    aspect-ratio: 1 / 1;
    background-image: none;
    border-radius: 0;
    clip-path: none;
    overflow: visible;
    opacity: var(--unit-opacity, 0.88);
    filter: drop-shadow(0 5px 5px rgba(42, 30, 14, 0.2)) saturate(1.08) brightness(1.03);
    transform: translate(-50%, -54%) rotate(var(--unit-rotation, 0deg)) scale(var(--unit-scale-x, 1), var(--unit-scale-y, 1));
    transform-origin: 50% 66%;
    mix-blend-mode: normal;
}

.business-harvest-crop-unit--harvest-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    pointer-events: none;
    user-select: none;
}

.business-harvest-crop-cluster--aquatic .business-harvest-crop-unit--harvest-water_chestnut {
    filter: drop-shadow(0 5px 5px rgba(46, 20, 10, 0.22)) saturate(1.03) brightness(1.02);
}

.business-harvest-board--mulberry .business-harvest-crop-cluster {
    inset: 1% 2% 3%;
    overflow: visible;
    -webkit-clip-path: none;
    clip-path: none;
}

.business-harvest-board--mulberry .business-harvest-crop-unit {
    border-radius: 0;
    clip-path: none;
    overflow: visible;
    opacity: var(--unit-opacity, 0.9);
    filter: drop-shadow(0 3px 3px rgba(38, 28, 12, 0.16)) saturate(0.88) brightness(0.96);
}

.business-harvest-board--paddy .business-harvest-crop-sprite {
    --terrain-crop-image: url("../images/business/harvest/products/jiangnan-paddy-grain-tile-stages-v2.png");
}

.business-harvest-board--field .business-harvest-scene-tile:not(.empty) {
    overflow: hidden;
}

.business-harvest-board--field .business-harvest-scene-tile.has-crop-units {
    -webkit-clip-path: none;
    clip-path: none;
    overflow: visible;
}

.business-harvest-board--field .business-harvest-scene-tile.has-crop-units > .business-harvest-crop-cluster {
    inset: -12% -9% -10%;
}

.business-harvest-board--field .business-harvest-scene-tile:not(.empty)::after {
    content: "";
    position: absolute;
    inset: 3% 4% 6%;
    z-index: 2;
    border-radius: 38% 44% 40% 46%;
    background:
        radial-gradient(ellipse at 50% 48%, transparent 48%, rgba(71, 58, 32, 0.16) 72%, rgba(39, 35, 21, 0.32) 100%),
        linear-gradient(180deg, rgba(255, 239, 176, 0.06), rgba(30, 36, 17, 0.16));
    opacity: 0.42;
    mix-blend-mode: multiply;
    pointer-events: none;
}

.business-harvest-board--field .business-harvest-scene-tile.has-crop-units::after {
    content: none;
}

.business-harvest-board--field .business-harvest-scene-tile.has-grain-units::after {
    background:
        radial-gradient(ellipse at 50% 50%, transparent 52%, rgba(62, 48, 27, 0.12) 82%, rgba(31, 28, 18, 0.2) 100%),
        repeating-linear-gradient(96deg, transparent 0 24px, rgba(39, 33, 19, 0.07) 24px 26px, transparent 26px 48px);
    opacity: 0.12;
}

.business-harvest-board--field .business-harvest-scene-tile:not(.empty) .business-harvest-crop-sprite {
    top: 53%;
    z-index: 1;
    width: min(var(--crop-size, 110%), 270px);
    -webkit-clip-path: none;
    clip-path: none;
    overflow: visible;
    -webkit-mask-image:
        radial-gradient(ellipse at 50% 55%, #000 0 30%, rgba(0, 0, 0, 0.78) 42%, rgba(0, 0, 0, 0.22) 54%, transparent 66%);
    mask-image:
        radial-gradient(ellipse at 50% 55%, #000 0 30%, rgba(0, 0, 0, 0.78) 42%, rgba(0, 0, 0, 0.22) 54%, transparent 66%);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    opacity: 0.92;
    filter: drop-shadow(0 8px 7px rgba(9, 20, 8, 0.16)) saturate(0.88) brightness(0.94);
}

.business-harvest-board--field .business-harvest-scene-tile:not(.empty).business-harvest-stage--0 .business-harvest-crop-sprite,
.business-harvest-board--field .business-harvest-scene-tile:not(.empty).business-harvest-stage--1 .business-harvest-crop-sprite {
    top: 54%;
    width: min(var(--crop-size, 102%), 250px);
    opacity: 0.9;
}

.business-harvest-board--field .business-harvest-scene-tile:not(.empty).business-harvest-stage--2 .business-harvest-crop-sprite {
    width: min(var(--crop-size, 114%), 280px);
    opacity: 0.94;
}

.business-harvest-board--field .business-harvest-scene-tile:not(.empty).ready .business-harvest-crop-sprite {
    width: min(var(--crop-size, 118%), 295px);
    opacity: 0.96;
}

.business-harvest-board--paddy .business-harvest-scene-tile.has-grain-units .business-harvest-crop-sprite,
.business-harvest-board--field .business-harvest-scene-tile.has-grain-units .business-harvest-crop-sprite {
    top: 53%;
    z-index: 1;
    width: min(var(--crop-size, 124%), 320px);
    opacity: 0.98;
    clip-path: polygon(2% 7%, 12% 2%, 34% 4%, 51% 1%, 71% 5%, 91% 3%, 99% 13%, 96% 34%, 100% 54%, 95% 73%, 98% 93%, 79% 99%, 57% 96%, 38% 100%, 16% 95%, 1% 98%, 4% 76%, 0 58%, 3% 39%);
    overflow: visible;
    -webkit-mask-image: radial-gradient(ellipse at 50% 54%, #000 0 34%, rgba(0, 0, 0, 0.78) 47%, transparent 70%);
    mask-image: radial-gradient(ellipse at 50% 54%, #000 0 34%, rgba(0, 0, 0, 0.78) 47%, transparent 70%);
    filter: drop-shadow(0 7px 6px rgba(72, 50, 18, 0.14)) saturate(1.16) brightness(1.12) contrast(1.04);
}

.business-harvest-board--pond .business-harvest-crop-sprite {
    --terrain-crop-image: url("../images/business/harvest/jiangnan-fishpond-art-school-stages-v1.png");
    width: var(--crop-size, 90%);
    max-width: none;
    opacity: 0.9;
    filter: drop-shadow(0 3px 3px rgba(6, 22, 20, 0.18)) saturate(0.92);
}

.business-harvest-board--mulberry .business-harvest-crop-sprite {
    --terrain-crop-image: url("../images/business/harvest/jiangnan-silkworm-stages-centered-v1.png");
    top: 51%;
    width: min(var(--crop-size, 112%), 156px);
    max-width: none;
    opacity: 0.94;
    filter:
        drop-shadow(0 10px 8px rgba(33, 25, 12, 0.2))
        drop-shadow(0 2px 1px rgba(249, 238, 184, 0.08))
        saturate(0.98)
        contrast(1.02);
    transform: translate(var(--crop-translate-x, -50%), var(--crop-translate-y, -50%)) rotate(var(--crop-rotation, 0deg)) scale(calc(var(--mulberry-stage-scale, 1) * var(--mulberry-product-scale, 1)));
}

.business-harvest-board--mulberry .business-harvest-scene-tile:not(.empty) {
    isolation: isolate;
    --mulberry-stage-scale: 0.98;
    --mulberry-product-scale: 1;
    --mulberry-shadow-opacity: 0.4;
    --mulberry-sheen-opacity: 0.12;
}

.business-harvest-board--mulberry .business-harvest-scene-tile:not(.empty)::before {
    content: "";
    position: absolute;
    left: 13%;
    right: 12%;
    top: 38%;
    bottom: 10%;
    z-index: 0;
    border-radius: 50%;
    background:
        radial-gradient(ellipse at 50% 56%, rgba(44, 32, 14, 0.34) 0 34%, rgba(41, 33, 18, 0.18) 52%, transparent 74%),
        radial-gradient(ellipse at 50% 42%, rgba(242, 225, 160, 0.11) 0 24%, transparent 62%);
    opacity: var(--mulberry-shadow-opacity);
    filter: blur(0.3px);
    pointer-events: none;
}

.business-harvest-board--mulberry .business-harvest-scene-tile:not(.empty)::after {
    content: "";
    position: absolute;
    left: 15%;
    right: 14%;
    top: 24%;
    bottom: 14%;
    z-index: 2;
    border-radius: 46% 54% 50% 48%;
    background:
        linear-gradient(104deg, transparent 0 28%, rgba(255, 245, 198, 0.18) 29%, transparent 31% 58%, rgba(255, 245, 198, 0.13) 60%, transparent 62%),
        repeating-linear-gradient(86deg, transparent 0 17px, rgba(245, 232, 176, 0.06) 18px 19px, transparent 20px 38px);
    opacity: var(--mulberry-sheen-opacity);
    mix-blend-mode: screen;
    pointer-events: none;
}

.business-harvest-board--mulberry .business-harvest-scene-tile.growing {
    --mulberry-shadow-opacity: 0.34;
    --mulberry-sheen-opacity: 0.09;
}

.business-harvest-board--mulberry .business-harvest-scene-tile.ready {
    --mulberry-shadow-opacity: 0.48;
    --mulberry-sheen-opacity: 0.16;
}

.business-harvest-board--mulberry .business-harvest-stage--0 .business-harvest-crop-sprite {
    top: 52%;
    opacity: 0.82;
    --mulberry-stage-scale: 0.72;
    filter:
        drop-shadow(0 6px 5px rgba(33, 25, 12, 0.14))
        saturate(0.9)
        brightness(0.96);
}

.business-harvest-board--mulberry .business-harvest-stage--1 .business-harvest-crop-sprite {
    top: 52%;
    opacity: 0.88;
    --mulberry-stage-scale: 0.86;
}

.business-harvest-board--mulberry .business-harvest-stage--2 .business-harvest-crop-sprite {
    top: 51%;
    opacity: 0.94;
    --mulberry-stage-scale: 0.98;
}

.business-harvest-board--mulberry .business-harvest-scene-tile.ready .business-harvest-crop-sprite {
    top: 50%;
    opacity: 0.98;
    --mulberry-stage-scale: 1.06;
    filter:
        drop-shadow(0 11px 8px rgba(33, 25, 12, 0.22))
        drop-shadow(0 2px 1px rgba(255, 244, 190, 0.12))
        saturate(1.04)
        brightness(1.03)
        contrast(1.04);
}

.business-harvest-board--mulberry .business-harvest-product--mulberry_leaf .business-harvest-crop-sprite,
.business-harvest-board--mulberry .business-harvest-product--silk_worm .business-harvest-crop-sprite {
    --mulberry-product-scale: 0.94;
}

.business-harvest-board--mulberry .business-harvest-product--brocade .business-harvest-crop-sprite,
.business-harvest-board--mulberry .business-harvest-product--satin .business-harvest-crop-sprite,
.business-harvest-board--mulberry .business-harvest-product--dragon_silk .business-harvest-crop-sprite,
.business-harvest-board--mulberry .business-harvest-product--phoenix_silk .business-harvest-crop-sprite {
    --mulberry-product-scale: 1.04;
}

.business-harvest-board--mulberry .business-harvest-scene-tile > span:not(.business-harvest-crop-cluster) {
    position: absolute;
    left: 8%;
    right: 8%;
    bottom: 26%;
    z-index: 3;
    text-align: center;
    text-shadow: 0 2px 5px rgba(18, 22, 10, 0.78), 0 0 9px rgba(6, 13, 10, 0.52);
}

.business-harvest-board--mulberry .business-harvest-scene-tile small {
    position: absolute;
    left: 8%;
    right: 8%;
    bottom: 14%;
    z-index: 3;
    text-align: center;
    text-shadow: 0 2px 5px rgba(18, 22, 10, 0.78), 0 0 9px rgba(6, 13, 10, 0.52);
}

.business-harvest-board--orchard .business-harvest-crop-sprite {
    --terrain-crop-image: url("../images/business/harvest/jiangnan-orchard-stages-centered-v1.png");
}

.business-harvest-board--apiary .business-harvest-crop-sprite {
    --terrain-crop-image: url("../images/business/harvest/jiangnan-apiary-stages-centered-v2.png");
}

.business-harvest-board--apiary .business-harvest-product--queen_bee .business-harvest-crop-sprite,
.business-harvest-board--apiary .business-harvest-product--golden_honey .business-harvest-crop-sprite,
.business-harvest-board--apiary .business-harvest-product--jade_bee_pollen .business-harvest-crop-sprite,
.business-harvest-board--apiary .business-harvest-product--dragon_honey .business-harvest-crop-sprite,
.business-harvest-board--apiary .business-harvest-product--phoenix_royal_jelly .business-harvest-crop-sprite,
.business-harvest-board--apiary .business-harvest-product--spirit_bee_queen .business-harvest-crop-sprite {
    overflow: visible;
}

.business-harvest-board--apiary .business-harvest-product--queen_bee .business-harvest-crop-sprite,
.business-harvest-board--apiary .business-harvest-product--golden_honey .business-harvest-crop-sprite,
.business-harvest-board--apiary .business-harvest-product--dragon_honey .business-harvest-crop-sprite {
    --apiary-aura-image: url("../images/business/harvest/effects/jiangnan-apiary-aura-gold-v1.svg");
    --apiary-aura-opacity: 0.48;
    --apiary-mote-color: rgba(255, 229, 132, 0.78);
    --apiary-mote-soft: rgba(246, 186, 66, 0.28);
}

.business-harvest-board--apiary .business-harvest-product--phoenix_royal_jelly .business-harvest-crop-sprite {
    --apiary-aura-image: url("../images/business/harvest/effects/jiangnan-apiary-aura-phoenix-v1.svg");
    --apiary-aura-opacity: 0.54;
    --apiary-mote-color: rgba(255, 187, 104, 0.78);
    --apiary-mote-soft: rgba(232, 95, 61, 0.25);
}

.business-harvest-board--apiary .business-harvest-product--jade_bee_pollen .business-harvest-crop-sprite,
.business-harvest-board--apiary .business-harvest-product--spirit_bee_queen .business-harvest-crop-sprite {
    --apiary-aura-image: url("../images/business/harvest/effects/jiangnan-apiary-aura-jade-v1.svg");
    --apiary-aura-opacity: 0.5;
    --apiary-mote-color: rgba(126, 240, 219, 0.78);
    --apiary-mote-soft: rgba(88, 214, 189, 0.25);
}

.business-harvest-board--apiary .business-harvest-product--dragon_honey .business-harvest-crop-sprite,
.business-harvest-board--apiary .business-harvest-product--phoenix_royal_jelly .business-harvest-crop-sprite,
.business-harvest-board--apiary .business-harvest-product--spirit_bee_queen .business-harvest-crop-sprite {
    --apiary-aura-opacity: 0.68;
}

.business-harvest-board--apiary .business-harvest-product--queen_bee .business-harvest-crop-sprite::before,
.business-harvest-board--apiary .business-harvest-product--golden_honey .business-harvest-crop-sprite::before,
.business-harvest-board--apiary .business-harvest-product--jade_bee_pollen .business-harvest-crop-sprite::before,
.business-harvest-board--apiary .business-harvest-product--dragon_honey .business-harvest-crop-sprite::before,
.business-harvest-board--apiary .business-harvest-product--phoenix_royal_jelly .business-harvest-crop-sprite::before,
.business-harvest-board--apiary .business-harvest-product--spirit_bee_queen .business-harvest-crop-sprite::before,
.business-harvest-board--apiary .business-harvest-product--queen_bee .business-harvest-crop-sprite::after,
.business-harvest-board--apiary .business-harvest-product--golden_honey .business-harvest-crop-sprite::after,
.business-harvest-board--apiary .business-harvest-product--jade_bee_pollen .business-harvest-crop-sprite::after,
.business-harvest-board--apiary .business-harvest-product--dragon_honey .business-harvest-crop-sprite::after,
.business-harvest-board--apiary .business-harvest-product--phoenix_royal_jelly .business-harvest-crop-sprite::after,
.business-harvest-board--apiary .business-harvest-product--spirit_bee_queen .business-harvest-crop-sprite::after {
    content: "";
    position: absolute;
    inset: -20%;
    pointer-events: none;
}

.business-harvest-board--apiary .business-harvest-product--queen_bee .business-harvest-crop-sprite::before,
.business-harvest-board--apiary .business-harvest-product--golden_honey .business-harvest-crop-sprite::before,
.business-harvest-board--apiary .business-harvest-product--jade_bee_pollen .business-harvest-crop-sprite::before,
.business-harvest-board--apiary .business-harvest-product--dragon_honey .business-harvest-crop-sprite::before,
.business-harvest-board--apiary .business-harvest-product--phoenix_royal_jelly .business-harvest-crop-sprite::before,
.business-harvest-board--apiary .business-harvest-product--spirit_bee_queen .business-harvest-crop-sprite::before {
    background: var(--apiary-aura-image) center / contain no-repeat;
    opacity: var(--apiary-aura-opacity, 0.48);
    transform: translate3d(-1%, 1%, 0) rotate(-2deg);
    animation: businessApiaryAuraDrift 6200ms ease-in-out infinite;
}

.business-harvest-board--apiary .business-harvest-product--queen_bee .business-harvest-crop-sprite::after,
.business-harvest-board--apiary .business-harvest-product--golden_honey .business-harvest-crop-sprite::after,
.business-harvest-board--apiary .business-harvest-product--jade_bee_pollen .business-harvest-crop-sprite::after,
.business-harvest-board--apiary .business-harvest-product--dragon_honey .business-harvest-crop-sprite::after,
.business-harvest-board--apiary .business-harvest-product--phoenix_royal_jelly .business-harvest-crop-sprite::after,
.business-harvest-board--apiary .business-harvest-product--spirit_bee_queen .business-harvest-crop-sprite::after {
    background:
        radial-gradient(circle at 22% 34%, var(--apiary-mote-color, rgba(255, 229, 132, 0.78)) 0 2px, transparent 3px),
        radial-gradient(circle at 72% 28%, var(--apiary-mote-color, rgba(255, 229, 132, 0.78)) 0 1.5px, transparent 3px),
        radial-gradient(circle at 82% 62%, var(--apiary-mote-color, rgba(255, 229, 132, 0.78)) 0 2px, transparent 3px),
        radial-gradient(circle at 38% 78%, var(--apiary-mote-color, rgba(255, 229, 132, 0.78)) 0 1.5px, transparent 3px),
        radial-gradient(ellipse at 50% 55%, var(--apiary-mote-soft, rgba(246, 186, 66, 0.28)), transparent 58%);
    opacity: 0.58;
    transform: translate3d(1%, -1%, 0);
    animation: businessApiaryMoteFloat 4800ms ease-in-out infinite;
}

.business-harvest-board--apiary .business-harvest-product--phoenix_royal_jelly .business-harvest-crop-sprite::after,
.business-harvest-board--apiary .business-harvest-product--spirit_bee_queen .business-harvest-crop-sprite::after {
    animation-duration: 5400ms;
}

@keyframes businessApiaryAuraDrift {
    0%, 100% {
        opacity: calc(var(--apiary-aura-opacity, 0.48) * 0.72);
        transform: translate3d(-1%, 1%, 0) rotate(-2deg) scale(0.98);
    }

    48% {
        opacity: var(--apiary-aura-opacity, 0.48);
        transform: translate3d(2%, -2%, 0) rotate(2deg) scale(1.04);
    }
}

@keyframes businessApiaryMoteFloat {
    0%, 100% {
        opacity: 0.42;
        transform: translate3d(1%, -1%, 0) scale(0.96);
    }

    50% {
        opacity: 0.72;
        transform: translate3d(-2%, -5%, 0) scale(1.06);
    }
}

@media (prefers-reduced-motion: reduce) {
    .business-harvest-board--apiary .business-harvest-crop-sprite::before,
    .business-harvest-board--apiary .business-harvest-crop-sprite::after {
        animation: none;
    }
}

.business-harvest-board--pasture .business-harvest-crop-sprite {
    --terrain-crop-image: url("../images/business/harvest/jiangnan-pasture-stages-centered-v1.png");
}

.business-harvest-board--pasture .business-harvest-product--golden_feather,
.business-harvest-board--pasture .business-harvest-product--peacock_feather,
.business-harvest-board--pasture .business-harvest-product--swan_down,
.business-harvest-board--pasture .business-harvest-product--phoenix_egg {
    --pasture-aura-opacity: 0.22;
    --pasture-mote-opacity: 0.34;
    --pasture-mote-color: rgba(255, 229, 141, 0.74);
    --pasture-mote-soft: rgba(255, 206, 92, 0.2);
}

.business-harvest-board--pasture .business-harvest-stage--0.business-harvest-product--golden_feather,
.business-harvest-board--pasture .business-harvest-stage--0.business-harvest-product--peacock_feather,
.business-harvest-board--pasture .business-harvest-stage--0.business-harvest-product--swan_down,
.business-harvest-board--pasture .business-harvest-stage--0.business-harvest-product--phoenix_egg {
    --pasture-aura-opacity: 0.12;
    --pasture-mote-opacity: 0.2;
}

.business-harvest-board--pasture .business-harvest-stage--1.business-harvest-product--golden_feather,
.business-harvest-board--pasture .business-harvest-stage--1.business-harvest-product--peacock_feather,
.business-harvest-board--pasture .business-harvest-stage--1.business-harvest-product--swan_down,
.business-harvest-board--pasture .business-harvest-stage--1.business-harvest-product--phoenix_egg {
    --pasture-aura-opacity: 0.18;
    --pasture-mote-opacity: 0.28;
}

.business-harvest-board--pasture .business-harvest-scene-tile.ready.business-harvest-product--golden_feather,
.business-harvest-board--pasture .business-harvest-scene-tile.ready.business-harvest-product--peacock_feather,
.business-harvest-board--pasture .business-harvest-scene-tile.ready.business-harvest-product--swan_down,
.business-harvest-board--pasture .business-harvest-scene-tile.ready.business-harvest-product--phoenix_egg {
    --pasture-aura-opacity: 0.4;
    --pasture-mote-opacity: 0.52;
}

.business-harvest-board--pasture .business-harvest-product--golden_feather {
    --pasture-aura-image: url("../images/business/harvest/effects/jiangnan-pasture-aura-gold-v1.svg");
}

.business-harvest-board--pasture .business-harvest-product--peacock_feather {
    --pasture-aura-image: url("../images/business/harvest/effects/jiangnan-pasture-aura-peacock-v1.svg");
    --pasture-mote-color: rgba(111, 240, 215, 0.78);
    --pasture-mote-soft: rgba(83, 160, 235, 0.2);
}

.business-harvest-board--pasture .business-harvest-product--swan_down {
    --pasture-aura-image: url("../images/business/harvest/effects/jiangnan-pasture-aura-swan-v1.svg");
    --pasture-mote-color: rgba(235, 253, 255, 0.82);
    --pasture-mote-soft: rgba(160, 225, 242, 0.2);
}

.business-harvest-board--pasture .business-harvest-product--phoenix_egg {
    --pasture-aura-image: url("../images/business/harvest/effects/jiangnan-pasture-aura-phoenix-v1.svg");
    --pasture-aura-opacity: 0.28;
    --pasture-mote-color: rgba(255, 198, 112, 0.84);
    --pasture-mote-soft: rgba(255, 102, 72, 0.22);
}

.business-harvest-board--pasture .business-harvest-scene-tile.ready.business-harvest-product--phoenix_egg {
    --pasture-aura-opacity: 0.52;
}

.business-harvest-board--pasture .business-harvest-product--golden_feather::before,
.business-harvest-board--pasture .business-harvest-product--peacock_feather::before,
.business-harvest-board--pasture .business-harvest-product--swan_down::before,
.business-harvest-board--pasture .business-harvest-product--phoenix_egg::before,
.business-harvest-board--pasture .business-harvest-product--golden_feather::after,
.business-harvest-board--pasture .business-harvest-product--peacock_feather::after,
.business-harvest-board--pasture .business-harvest-product--swan_down::after,
.business-harvest-board--pasture .business-harvest-product--phoenix_egg::after {
    content: "";
    position: absolute;
    inset: auto;
    left: 50%;
    top: 46%;
    z-index: 0;
    width: min(138%, 136px);
    aspect-ratio: 1 / 1;
    border: 0;
    border-radius: 50%;
    clip-path: none;
    box-shadow: none;
    pointer-events: none;
}

.business-harvest-board--pasture .business-harvest-product--golden_feather::before,
.business-harvest-board--pasture .business-harvest-product--peacock_feather::before,
.business-harvest-board--pasture .business-harvest-product--swan_down::before,
.business-harvest-board--pasture .business-harvest-product--phoenix_egg::before {
    display: block;
    background:
        radial-gradient(circle at 24% 36%, var(--pasture-mote-color) 0 1.6px, transparent 3px),
        radial-gradient(circle at 74% 30%, var(--pasture-mote-color) 0 1.4px, transparent 3px),
        radial-gradient(circle at 82% 64%, var(--pasture-mote-color) 0 1.8px, transparent 3.4px),
        radial-gradient(circle at 36% 78%, var(--pasture-mote-color) 0 1.4px, transparent 3px),
        radial-gradient(ellipse at 50% 56%, var(--pasture-mote-soft), transparent 58%);
    opacity: var(--pasture-mote-opacity, 0.38);
    transform: translate3d(-50%, -50%, 0) scale(0.96);
    animation: businessPastureMoteFloat 5200ms ease-in-out infinite;
}

.business-harvest-board--pasture .business-harvest-product--golden_feather::after,
.business-harvest-board--pasture .business-harvest-product--peacock_feather::after,
.business-harvest-board--pasture .business-harvest-product--swan_down::after,
.business-harvest-board--pasture .business-harvest-product--phoenix_egg::after {
    background: var(--pasture-aura-image) center / contain no-repeat;
    opacity: var(--pasture-aura-opacity, 0.26);
    filter: drop-shadow(0 0 8px rgba(255, 232, 148, 0.12));
    transform: translate3d(-50%, -50%, 0) rotate(-2deg) scale(0.98);
    animation: businessPastureAuraPulse 6400ms ease-in-out infinite;
    mix-blend-mode: screen;
}

.business-harvest-board--pasture .business-harvest-product--peacock_feather::after,
.business-harvest-board--pasture .business-harvest-product--swan_down::after {
    filter: drop-shadow(0 0 8px rgba(170, 244, 255, 0.14));
}

.business-harvest-board--pasture .business-harvest-product--phoenix_egg::after {
    filter: drop-shadow(0 0 10px rgba(255, 156, 91, 0.18));
    animation-duration: 5800ms;
}

@keyframes businessPastureAuraPulse {
    0%, 100% {
        opacity: calc(var(--pasture-aura-opacity, 0.26) * 0.74);
        transform: translate3d(-50%, -50%, 0) rotate(-3deg) scale(0.96);
    }

    48% {
        opacity: var(--pasture-aura-opacity, 0.26);
        transform: translate3d(-50%, -53%, 0) rotate(3deg) scale(1.04);
    }
}

@keyframes businessPastureMoteFloat {
    0%, 100% {
        opacity: calc(var(--pasture-mote-opacity, 0.38) * 0.7);
        transform: translate3d(-50%, -50%, 0) scale(0.94);
    }

    50% {
        opacity: var(--pasture-mote-opacity, 0.38);
        transform: translate3d(-52%, -56%, 0) scale(1.06);
    }
}

@media (prefers-reduced-motion: reduce) {
    .business-harvest-board--pasture .business-harvest-product--golden_feather::before,
    .business-harvest-board--pasture .business-harvest-product--peacock_feather::before,
    .business-harvest-board--pasture .business-harvest-product--swan_down::before,
    .business-harvest-board--pasture .business-harvest-product--phoenix_egg::before,
    .business-harvest-board--pasture .business-harvest-product--golden_feather::after,
    .business-harvest-board--pasture .business-harvest-product--peacock_feather::after,
    .business-harvest-board--pasture .business-harvest-product--swan_down::after,
    .business-harvest-board--pasture .business-harvest-product--phoenix_egg::after {
        animation: none;
    }
}

.business-harvest-board--herb .business-harvest-crop-sprite {
    --terrain-crop-image: url("../images/business/harvest/jiangnan-herb-stages-centered-v1.png");
}

.business-harvest-board--wood .business-harvest-crop-sprite {
    --terrain-crop-image: url("../images/business/harvest/jiangnan-woodlot-stages-centered-v1.png");
}

.business-harvest-board--paddy .business-harvest-product--jade_rice,
.business-harvest-board--field .business-harvest-product--snow_wheat,
.business-harvest-board--field .business-harvest-product--dragon_bean,
.business-harvest-board--field .business-harvest-product--phoenix_grain,
.business-harvest-board--pond .business-harvest-product--dragon_scale_fish,
.business-harvest-board--pond .business-harvest-product--koi_dragon,
.business-harvest-board--pond .business-harvest-product--leviathan,
.business-harvest-board--mulberry .business-harvest-product--silver_silk,
.business-harvest-board--mulberry .business-harvest-product--ice_silk,
.business-harvest-board--mulberry .business-harvest-product--dragon_silk,
.business-harvest-board--mulberry .business-harvest-product--sky_silk,
.business-harvest-board--mulberry .business-harvest-product--phoenix_silk,
.business-harvest-board--orchard .business-harvest-product--ginseng_fruit,
.business-harvest-board--orchard .business-harvest-product--flat_peach,
.business-harvest-board--orchard .business-harvest-product--ice_lotus,
.business-harvest-board--herb .business-harvest-product--cordyceps,
.business-harvest-board--herb .business-harvest-product--dendrobium,
.business-harvest-board--herb .business-harvest-product--blood_orchid,
.business-harvest-board--herb .business-harvest-product--immortal_grass,
.business-harvest-board--wood .business-harvest-product--dragon_wood,
.business-harvest-board--wood .business-harvest-product--ancient_divine_wood,
.business-harvest-board--wood .business-harvest-product--world_tree_wood {
    --harvest-rare-aura-image: url("../images/business/harvest/effects/jiangnan-harvest-aura-gold-v1.svg");
    --harvest-rare-aura-opacity: 0.24;
    --harvest-rare-mote-opacity: 0.34;
    --harvest-rare-mote-color: rgba(255, 229, 141, 0.74);
    --harvest-rare-mote-soft: rgba(255, 206, 92, 0.2);
    --harvest-rare-aura-size: min(142%, 158px);
    --harvest-rare-aura-y: 50%;
}

.business-harvest-stage--0.business-harvest-product--jade_rice,
.business-harvest-stage--0.business-harvest-product--snow_wheat,
.business-harvest-stage--0.business-harvest-product--dragon_bean,
.business-harvest-stage--0.business-harvest-product--phoenix_grain,
.business-harvest-stage--0.business-harvest-product--dragon_scale_fish,
.business-harvest-stage--0.business-harvest-product--koi_dragon,
.business-harvest-stage--0.business-harvest-product--leviathan,
.business-harvest-stage--0.business-harvest-product--silver_silk,
.business-harvest-stage--0.business-harvest-product--ice_silk,
.business-harvest-stage--0.business-harvest-product--dragon_silk,
.business-harvest-stage--0.business-harvest-product--sky_silk,
.business-harvest-stage--0.business-harvest-product--phoenix_silk,
.business-harvest-stage--0.business-harvest-product--ginseng_fruit,
.business-harvest-stage--0.business-harvest-product--flat_peach,
.business-harvest-stage--0.business-harvest-product--ice_lotus,
.business-harvest-stage--0.business-harvest-product--cordyceps,
.business-harvest-stage--0.business-harvest-product--dendrobium,
.business-harvest-stage--0.business-harvest-product--blood_orchid,
.business-harvest-stage--0.business-harvest-product--immortal_grass,
.business-harvest-stage--0.business-harvest-product--dragon_wood,
.business-harvest-stage--0.business-harvest-product--ancient_divine_wood,
.business-harvest-stage--0.business-harvest-product--world_tree_wood {
    --harvest-rare-aura-opacity: 0.1;
    --harvest-rare-mote-opacity: 0.16;
}

.business-harvest-stage--1.business-harvest-product--jade_rice,
.business-harvest-stage--1.business-harvest-product--snow_wheat,
.business-harvest-stage--1.business-harvest-product--dragon_bean,
.business-harvest-stage--1.business-harvest-product--phoenix_grain,
.business-harvest-stage--1.business-harvest-product--dragon_scale_fish,
.business-harvest-stage--1.business-harvest-product--koi_dragon,
.business-harvest-stage--1.business-harvest-product--leviathan,
.business-harvest-stage--1.business-harvest-product--silver_silk,
.business-harvest-stage--1.business-harvest-product--ice_silk,
.business-harvest-stage--1.business-harvest-product--dragon_silk,
.business-harvest-stage--1.business-harvest-product--sky_silk,
.business-harvest-stage--1.business-harvest-product--phoenix_silk,
.business-harvest-stage--1.business-harvest-product--ginseng_fruit,
.business-harvest-stage--1.business-harvest-product--flat_peach,
.business-harvest-stage--1.business-harvest-product--ice_lotus,
.business-harvest-stage--1.business-harvest-product--cordyceps,
.business-harvest-stage--1.business-harvest-product--dendrobium,
.business-harvest-stage--1.business-harvest-product--blood_orchid,
.business-harvest-stage--1.business-harvest-product--immortal_grass,
.business-harvest-stage--1.business-harvest-product--dragon_wood,
.business-harvest-stage--1.business-harvest-product--ancient_divine_wood,
.business-harvest-stage--1.business-harvest-product--world_tree_wood {
    --harvest-rare-aura-opacity: 0.16;
    --harvest-rare-mote-opacity: 0.24;
}

.business-harvest-scene-tile.ready.business-harvest-product--jade_rice,
.business-harvest-scene-tile.ready.business-harvest-product--snow_wheat,
.business-harvest-scene-tile.ready.business-harvest-product--dragon_bean,
.business-harvest-scene-tile.ready.business-harvest-product--phoenix_grain,
.business-harvest-scene-tile.ready.business-harvest-product--dragon_scale_fish,
.business-harvest-scene-tile.ready.business-harvest-product--koi_dragon,
.business-harvest-scene-tile.ready.business-harvest-product--leviathan,
.business-harvest-scene-tile.ready.business-harvest-product--silver_silk,
.business-harvest-scene-tile.ready.business-harvest-product--ice_silk,
.business-harvest-scene-tile.ready.business-harvest-product--dragon_silk,
.business-harvest-scene-tile.ready.business-harvest-product--sky_silk,
.business-harvest-scene-tile.ready.business-harvest-product--phoenix_silk,
.business-harvest-scene-tile.ready.business-harvest-product--ginseng_fruit,
.business-harvest-scene-tile.ready.business-harvest-product--flat_peach,
.business-harvest-scene-tile.ready.business-harvest-product--ice_lotus,
.business-harvest-scene-tile.ready.business-harvest-product--cordyceps,
.business-harvest-scene-tile.ready.business-harvest-product--dendrobium,
.business-harvest-scene-tile.ready.business-harvest-product--blood_orchid,
.business-harvest-scene-tile.ready.business-harvest-product--immortal_grass,
.business-harvest-scene-tile.ready.business-harvest-product--dragon_wood,
.business-harvest-scene-tile.ready.business-harvest-product--ancient_divine_wood,
.business-harvest-scene-tile.ready.business-harvest-product--world_tree_wood {
    --harvest-rare-aura-opacity: 0.42;
    --harvest-rare-mote-opacity: 0.52;
}

.business-harvest-board--paddy .business-harvest-product--jade_rice,
.business-harvest-board--field .business-harvest-product--snow_wheat,
.business-harvest-board--field .business-harvest-product--dragon_bean,
.business-harvest-board--mulberry .business-harvest-product--silver_silk,
.business-harvest-board--mulberry .business-harvest-product--ice_silk,
.business-harvest-board--mulberry .business-harvest-product--sky_silk,
.business-harvest-board--herb .business-harvest-product--dendrobium,
.business-harvest-board--herb .business-harvest-product--immortal_grass,
.business-harvest-board--wood .business-harvest-product--world_tree_wood {
    --harvest-rare-aura-image: url("../images/business/harvest/effects/jiangnan-harvest-aura-jade-v1.svg");
    --harvest-rare-mote-color: rgba(150, 255, 224, 0.78);
    --harvest-rare-mote-soft: rgba(80, 214, 173, 0.22);
}

.business-harvest-board--field .business-harvest-product--phoenix_grain,
.business-harvest-board--mulberry .business-harvest-product--phoenix_silk,
.business-harvest-board--orchard .business-harvest-product--flat_peach,
.business-harvest-board--herb .business-harvest-product--blood_orchid {
    --harvest-rare-aura-image: url("../images/business/harvest/effects/jiangnan-harvest-aura-crimson-v1.svg");
    --harvest-rare-mote-color: rgba(255, 197, 112, 0.82);
    --harvest-rare-mote-soft: rgba(235, 90, 72, 0.23);
}

.business-harvest-board--pond .business-harvest-product--dragon_scale_fish,
.business-harvest-board--pond .business-harvest-product--leviathan,
.business-harvest-board--mulberry .business-harvest-product--dragon_silk,
.business-harvest-board--orchard .business-harvest-product--ice_lotus,
.business-harvest-board--wood .business-harvest-product--dragon_wood,
.business-harvest-board--wood .business-harvest-product--ancient_divine_wood {
    --harvest-rare-aura-image: url("../images/business/harvest/effects/jiangnan-harvest-aura-celestial-v1.svg");
    --harvest-rare-mote-color: rgba(220, 249, 255, 0.82);
    --harvest-rare-mote-soft: rgba(108, 192, 242, 0.22);
}

.business-harvest-board--pond .business-harvest-product--koi_dragon,
.business-harvest-board--orchard .business-harvest-product--ginseng_fruit,
.business-harvest-board--herb .business-harvest-product--cordyceps {
    --harvest-rare-aura-image: url("../images/business/harvest/effects/jiangnan-harvest-aura-gold-v1.svg");
}

.business-harvest-board--pond .business-harvest-product--leviathan,
.business-harvest-board--orchard .business-harvest-product--ice_lotus,
.business-harvest-board--herb .business-harvest-product--immortal_grass,
.business-harvest-board--wood .business-harvest-product--world_tree_wood {
    --harvest-rare-aura-opacity: 0.32;
    --harvest-rare-aura-size: min(158%, 182px);
}

.business-harvest-scene-tile.ready.business-harvest-product--leviathan,
.business-harvest-scene-tile.ready.business-harvest-product--ice_lotus,
.business-harvest-scene-tile.ready.business-harvest-product--immortal_grass,
.business-harvest-scene-tile.ready.business-harvest-product--world_tree_wood {
    --harvest-rare-aura-opacity: 0.5;
}

.business-harvest-board--paddy .business-harvest-product--jade_rice > .business-harvest-crop-cluster,
.business-harvest-board--field .business-harvest-product--snow_wheat > .business-harvest-crop-cluster,
.business-harvest-board--field .business-harvest-product--dragon_bean > .business-harvest-crop-cluster,
.business-harvest-board--field .business-harvest-product--phoenix_grain > .business-harvest-crop-cluster {
    isolation: isolate;
}

.business-harvest-board--paddy .business-harvest-product--jade_rice > .business-harvest-crop-cluster::before,
.business-harvest-board--field .business-harvest-product--snow_wheat > .business-harvest-crop-cluster::before,
.business-harvest-board--field .business-harvest-product--dragon_bean > .business-harvest-crop-cluster::before,
.business-harvest-board--field .business-harvest-product--phoenix_grain > .business-harvest-crop-cluster::before,
.business-harvest-board--paddy .business-harvest-product--jade_rice > .business-harvest-crop-cluster::after,
.business-harvest-board--field .business-harvest-product--snow_wheat > .business-harvest-crop-cluster::after,
.business-harvest-board--field .business-harvest-product--dragon_bean > .business-harvest-crop-cluster::after,
.business-harvest-board--field .business-harvest-product--phoenix_grain > .business-harvest-crop-cluster::after {
    content: "";
    position: absolute;
    left: 50%;
    top: var(--harvest-rare-aura-y, 50%);
    width: var(--harvest-rare-aura-size);
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    pointer-events: none;
}

.business-harvest-board--paddy .business-harvest-product--jade_rice > .business-harvest-crop-cluster::before,
.business-harvest-board--field .business-harvest-product--snow_wheat > .business-harvest-crop-cluster::before,
.business-harvest-board--field .business-harvest-product--dragon_bean > .business-harvest-crop-cluster::before,
.business-harvest-board--field .business-harvest-product--phoenix_grain > .business-harvest-crop-cluster::before {
    z-index: 0;
    background: var(--harvest-rare-aura-image) center / contain no-repeat;
    opacity: var(--harvest-rare-aura-opacity, 0.24);
    filter: drop-shadow(0 0 8px rgba(255, 236, 160, 0.12));
    transform: translate3d(-50%, -50%, 0) rotate(-2deg) scale(0.98);
    animation: businessHarvestRareAuraPulse 6400ms ease-in-out infinite;
    mix-blend-mode: screen;
}

.business-harvest-board--paddy .business-harvest-product--jade_rice > .business-harvest-crop-cluster::after,
.business-harvest-board--field .business-harvest-product--snow_wheat > .business-harvest-crop-cluster::after,
.business-harvest-board--field .business-harvest-product--dragon_bean > .business-harvest-crop-cluster::after,
.business-harvest-board--field .business-harvest-product--phoenix_grain > .business-harvest-crop-cluster::after {
    z-index: 160;
    background:
        radial-gradient(circle at 22% 34%, var(--harvest-rare-mote-color) 0 1.6px, transparent 3px),
        radial-gradient(circle at 73% 28%, var(--harvest-rare-mote-color) 0 1.4px, transparent 3px),
        radial-gradient(circle at 82% 64%, var(--harvest-rare-mote-color) 0 1.7px, transparent 3.4px),
        radial-gradient(circle at 37% 78%, var(--harvest-rare-mote-color) 0 1.4px, transparent 3px),
        radial-gradient(ellipse at 50% 56%, var(--harvest-rare-mote-soft), transparent 58%);
    opacity: var(--harvest-rare-mote-opacity, 0.34);
    transform: translate3d(-50%, -50%, 0) scale(0.95);
    animation: businessHarvestRareMoteFloat 5200ms ease-in-out infinite;
    mix-blend-mode: screen;
}

.business-harvest-board--pond .business-harvest-product--dragon_scale_fish .business-harvest-crop-sprite,
.business-harvest-board--pond .business-harvest-product--koi_dragon .business-harvest-crop-sprite,
.business-harvest-board--pond .business-harvest-product--leviathan .business-harvest-crop-sprite,
.business-harvest-board--mulberry .business-harvest-product--silver_silk .business-harvest-crop-sprite,
.business-harvest-board--mulberry .business-harvest-product--ice_silk .business-harvest-crop-sprite,
.business-harvest-board--mulberry .business-harvest-product--dragon_silk .business-harvest-crop-sprite,
.business-harvest-board--mulberry .business-harvest-product--sky_silk .business-harvest-crop-sprite,
.business-harvest-board--mulberry .business-harvest-product--phoenix_silk .business-harvest-crop-sprite,
.business-harvest-board--orchard .business-harvest-product--ginseng_fruit .business-harvest-crop-sprite,
.business-harvest-board--orchard .business-harvest-product--flat_peach .business-harvest-crop-sprite,
.business-harvest-board--orchard .business-harvest-product--ice_lotus .business-harvest-crop-sprite,
.business-harvest-board--herb .business-harvest-product--cordyceps .business-harvest-crop-sprite,
.business-harvest-board--herb .business-harvest-product--dendrobium .business-harvest-crop-sprite,
.business-harvest-board--herb .business-harvest-product--blood_orchid .business-harvest-crop-sprite,
.business-harvest-board--herb .business-harvest-product--immortal_grass .business-harvest-crop-sprite,
.business-harvest-board--wood .business-harvest-product--dragon_wood .business-harvest-crop-sprite,
.business-harvest-board--wood .business-harvest-product--ancient_divine_wood .business-harvest-crop-sprite,
.business-harvest-board--wood .business-harvest-product--world_tree_wood .business-harvest-crop-sprite {
    isolation: isolate;
    overflow: visible;
}

.business-harvest-board--pond .business-harvest-product--dragon_scale_fish .business-harvest-crop-sprite::before,
.business-harvest-board--pond .business-harvest-product--koi_dragon .business-harvest-crop-sprite::before,
.business-harvest-board--pond .business-harvest-product--leviathan .business-harvest-crop-sprite::before,
.business-harvest-board--mulberry .business-harvest-product--silver_silk .business-harvest-crop-sprite::before,
.business-harvest-board--mulberry .business-harvest-product--ice_silk .business-harvest-crop-sprite::before,
.business-harvest-board--mulberry .business-harvest-product--dragon_silk .business-harvest-crop-sprite::before,
.business-harvest-board--mulberry .business-harvest-product--sky_silk .business-harvest-crop-sprite::before,
.business-harvest-board--mulberry .business-harvest-product--phoenix_silk .business-harvest-crop-sprite::before,
.business-harvest-board--orchard .business-harvest-product--ginseng_fruit .business-harvest-crop-sprite::before,
.business-harvest-board--orchard .business-harvest-product--flat_peach .business-harvest-crop-sprite::before,
.business-harvest-board--orchard .business-harvest-product--ice_lotus .business-harvest-crop-sprite::before,
.business-harvest-board--herb .business-harvest-product--cordyceps .business-harvest-crop-sprite::before,
.business-harvest-board--herb .business-harvest-product--dendrobium .business-harvest-crop-sprite::before,
.business-harvest-board--herb .business-harvest-product--blood_orchid .business-harvest-crop-sprite::before,
.business-harvest-board--herb .business-harvest-product--immortal_grass .business-harvest-crop-sprite::before,
.business-harvest-board--wood .business-harvest-product--dragon_wood .business-harvest-crop-sprite::before,
.business-harvest-board--wood .business-harvest-product--ancient_divine_wood .business-harvest-crop-sprite::before,
.business-harvest-board--wood .business-harvest-product--world_tree_wood .business-harvest-crop-sprite::before,
.business-harvest-board--pond .business-harvest-product--dragon_scale_fish .business-harvest-crop-sprite::after,
.business-harvest-board--pond .business-harvest-product--koi_dragon .business-harvest-crop-sprite::after,
.business-harvest-board--pond .business-harvest-product--leviathan .business-harvest-crop-sprite::after,
.business-harvest-board--mulberry .business-harvest-product--silver_silk .business-harvest-crop-sprite::after,
.business-harvest-board--mulberry .business-harvest-product--ice_silk .business-harvest-crop-sprite::after,
.business-harvest-board--mulberry .business-harvest-product--dragon_silk .business-harvest-crop-sprite::after,
.business-harvest-board--mulberry .business-harvest-product--sky_silk .business-harvest-crop-sprite::after,
.business-harvest-board--mulberry .business-harvest-product--phoenix_silk .business-harvest-crop-sprite::after,
.business-harvest-board--orchard .business-harvest-product--ginseng_fruit .business-harvest-crop-sprite::after,
.business-harvest-board--orchard .business-harvest-product--flat_peach .business-harvest-crop-sprite::after,
.business-harvest-board--orchard .business-harvest-product--ice_lotus .business-harvest-crop-sprite::after,
.business-harvest-board--herb .business-harvest-product--cordyceps .business-harvest-crop-sprite::after,
.business-harvest-board--herb .business-harvest-product--dendrobium .business-harvest-crop-sprite::after,
.business-harvest-board--herb .business-harvest-product--blood_orchid .business-harvest-crop-sprite::after,
.business-harvest-board--herb .business-harvest-product--immortal_grass .business-harvest-crop-sprite::after,
.business-harvest-board--wood .business-harvest-product--dragon_wood .business-harvest-crop-sprite::after,
.business-harvest-board--wood .business-harvest-product--ancient_divine_wood .business-harvest-crop-sprite::after,
.business-harvest-board--wood .business-harvest-product--world_tree_wood .business-harvest-crop-sprite::after {
    content: "";
    position: absolute;
    inset: -22%;
    border-radius: 50%;
    pointer-events: none;
}

.business-harvest-board--pond .business-harvest-product--dragon_scale_fish .business-harvest-crop-sprite::before,
.business-harvest-board--pond .business-harvest-product--koi_dragon .business-harvest-crop-sprite::before,
.business-harvest-board--pond .business-harvest-product--leviathan .business-harvest-crop-sprite::before,
.business-harvest-board--mulberry .business-harvest-product--silver_silk .business-harvest-crop-sprite::before,
.business-harvest-board--mulberry .business-harvest-product--ice_silk .business-harvest-crop-sprite::before,
.business-harvest-board--mulberry .business-harvest-product--dragon_silk .business-harvest-crop-sprite::before,
.business-harvest-board--mulberry .business-harvest-product--sky_silk .business-harvest-crop-sprite::before,
.business-harvest-board--mulberry .business-harvest-product--phoenix_silk .business-harvest-crop-sprite::before,
.business-harvest-board--orchard .business-harvest-product--ginseng_fruit .business-harvest-crop-sprite::before,
.business-harvest-board--orchard .business-harvest-product--flat_peach .business-harvest-crop-sprite::before,
.business-harvest-board--orchard .business-harvest-product--ice_lotus .business-harvest-crop-sprite::before,
.business-harvest-board--herb .business-harvest-product--cordyceps .business-harvest-crop-sprite::before,
.business-harvest-board--herb .business-harvest-product--dendrobium .business-harvest-crop-sprite::before,
.business-harvest-board--herb .business-harvest-product--blood_orchid .business-harvest-crop-sprite::before,
.business-harvest-board--herb .business-harvest-product--immortal_grass .business-harvest-crop-sprite::before,
.business-harvest-board--wood .business-harvest-product--dragon_wood .business-harvest-crop-sprite::before,
.business-harvest-board--wood .business-harvest-product--ancient_divine_wood .business-harvest-crop-sprite::before,
.business-harvest-board--wood .business-harvest-product--world_tree_wood .business-harvest-crop-sprite::before {
    z-index: -1;
    background: var(--harvest-rare-aura-image) center / contain no-repeat;
    opacity: var(--harvest-rare-aura-opacity, 0.24);
    filter: drop-shadow(0 0 8px rgba(255, 236, 160, 0.12));
    transform: translate3d(-1%, 1%, 0) rotate(-2deg) scale(0.98);
    animation: businessHarvestRareSpriteAuraPulse 6400ms ease-in-out infinite;
    mix-blend-mode: screen;
}

.business-harvest-board--pond .business-harvest-product--dragon_scale_fish .business-harvest-crop-sprite::after,
.business-harvest-board--pond .business-harvest-product--koi_dragon .business-harvest-crop-sprite::after,
.business-harvest-board--pond .business-harvest-product--leviathan .business-harvest-crop-sprite::after,
.business-harvest-board--mulberry .business-harvest-product--silver_silk .business-harvest-crop-sprite::after,
.business-harvest-board--mulberry .business-harvest-product--ice_silk .business-harvest-crop-sprite::after,
.business-harvest-board--mulberry .business-harvest-product--dragon_silk .business-harvest-crop-sprite::after,
.business-harvest-board--mulberry .business-harvest-product--sky_silk .business-harvest-crop-sprite::after,
.business-harvest-board--mulberry .business-harvest-product--phoenix_silk .business-harvest-crop-sprite::after,
.business-harvest-board--orchard .business-harvest-product--ginseng_fruit .business-harvest-crop-sprite::after,
.business-harvest-board--orchard .business-harvest-product--flat_peach .business-harvest-crop-sprite::after,
.business-harvest-board--orchard .business-harvest-product--ice_lotus .business-harvest-crop-sprite::after,
.business-harvest-board--herb .business-harvest-product--cordyceps .business-harvest-crop-sprite::after,
.business-harvest-board--herb .business-harvest-product--dendrobium .business-harvest-crop-sprite::after,
.business-harvest-board--herb .business-harvest-product--blood_orchid .business-harvest-crop-sprite::after,
.business-harvest-board--herb .business-harvest-product--immortal_grass .business-harvest-crop-sprite::after,
.business-harvest-board--wood .business-harvest-product--dragon_wood .business-harvest-crop-sprite::after,
.business-harvest-board--wood .business-harvest-product--ancient_divine_wood .business-harvest-crop-sprite::after,
.business-harvest-board--wood .business-harvest-product--world_tree_wood .business-harvest-crop-sprite::after {
    z-index: 1;
    background:
        radial-gradient(circle at 20% 34%, var(--harvest-rare-mote-color) 0 1.6px, transparent 3px),
        radial-gradient(circle at 72% 27%, var(--harvest-rare-mote-color) 0 1.4px, transparent 3px),
        radial-gradient(circle at 84% 64%, var(--harvest-rare-mote-color) 0 1.8px, transparent 3.4px),
        radial-gradient(circle at 37% 80%, var(--harvest-rare-mote-color) 0 1.4px, transparent 3px),
        radial-gradient(ellipse at 50% 56%, var(--harvest-rare-mote-soft), transparent 58%);
    opacity: var(--harvest-rare-mote-opacity, 0.34);
    transform: translate3d(1%, -1%, 0) scale(0.96);
    animation: businessHarvestRareSpriteMoteFloat 5200ms ease-in-out infinite;
    mix-blend-mode: screen;
}

@keyframes businessHarvestRareAuraPulse {
    0%, 100% {
        opacity: calc(var(--harvest-rare-aura-opacity, 0.24) * 0.74);
        transform: translate3d(-50%, -50%, 0) rotate(-3deg) scale(0.96);
    }

    48% {
        opacity: var(--harvest-rare-aura-opacity, 0.24);
        transform: translate3d(-50%, -53%, 0) rotate(3deg) scale(1.04);
    }
}

@keyframes businessHarvestRareMoteFloat {
    0%, 100% {
        opacity: calc(var(--harvest-rare-mote-opacity, 0.34) * 0.7);
        transform: translate3d(-50%, -50%, 0) scale(0.94);
    }

    50% {
        opacity: var(--harvest-rare-mote-opacity, 0.34);
        transform: translate3d(-52%, -56%, 0) scale(1.06);
    }
}

@keyframes businessHarvestRareSpriteAuraPulse {
    0%, 100% {
        opacity: calc(var(--harvest-rare-aura-opacity, 0.24) * 0.74);
        transform: translate3d(-1%, 1%, 0) rotate(-3deg) scale(0.96);
    }

    48% {
        opacity: var(--harvest-rare-aura-opacity, 0.24);
        transform: translate3d(2%, -2%, 0) rotate(3deg) scale(1.04);
    }
}

@keyframes businessHarvestRareSpriteMoteFloat {
    0%, 100% {
        opacity: calc(var(--harvest-rare-mote-opacity, 0.34) * 0.7);
        transform: translate3d(1%, -1%, 0) scale(0.96);
    }

    50% {
        opacity: var(--harvest-rare-mote-opacity, 0.34);
        transform: translate3d(-2%, -5%, 0) scale(1.06);
    }
}

@media (prefers-reduced-motion: reduce) {
    .business-harvest-crop-cluster::before,
    .business-harvest-crop-cluster::after,
    .business-harvest-crop-sprite::before,
    .business-harvest-crop-sprite::after {
        animation: none;
    }
}

.business-harvest-board--paddy .business-harvest-scene-tile:not(.empty) {
    overflow: hidden;
    --paddy-growth-stalk: rgba(116, 167, 67, 0.42);
    --paddy-growth-highlight: rgba(202, 228, 113, 0.38);
    --paddy-growth-shadow: rgba(22, 72, 42, 0.26);
}

.business-harvest-board--paddy .business-harvest-scene-tile.has-grain-units,
.business-harvest-board--paddy .business-harvest-scene-tile.has-grain-units:hover,
.business-harvest-board--paddy .business-harvest-scene-tile.has-grain-units:focus-visible,
.business-harvest-board--paddy .business-harvest-scene-tile.has-grain-units.selected,
.business-harvest-board--paddy .business-harvest-scene-tile.has-aquatic-units,
.business-harvest-board--paddy .business-harvest-scene-tile.has-aquatic-units:hover,
.business-harvest-board--paddy .business-harvest-scene-tile.has-aquatic-units:focus-visible,
.business-harvest-board--paddy .business-harvest-scene-tile.has-aquatic-units.selected {
    border-color: transparent;
    clip-path: none;
    overflow: visible;
    background: transparent;
    box-shadow: none;
    transform: none;
}

.business-harvest-board--paddy .business-harvest-scene-tile:not(.empty).business-harvest-stage--2,
.business-harvest-board--paddy .business-harvest-scene-tile:not(.empty).ready {
    --paddy-growth-stalk: rgba(180, 158, 62, 0.5);
    --paddy-growth-highlight: rgba(235, 209, 101, 0.48);
    --paddy-growth-shadow: rgba(93, 86, 33, 0.28);
}

.business-harvest-board--paddy .business-harvest-scene-tile:not(.empty)::before,
.business-harvest-board--paddy .business-harvest-scene-tile:not(.empty)::after {
    content: "";
    position: absolute;
    pointer-events: none;
}

.business-harvest-board--paddy .business-harvest-scene-tile:not(.empty)::before {
    inset: 1% 2% 2%;
    z-index: 0;
    border-radius: 30% 38% 32% 40%;
    clip-path: polygon(1% 12%, 9% 4%, 22% 8%, 35% 2%, 50% 7%, 63% 3%, 80% 9%, 98% 5%, 94% 23%, 100% 36%, 95% 52%, 99% 67%, 92% 87%, 97% 97%, 77% 93%, 62% 100%, 48% 94%, 31% 99%, 16% 92%, 2% 96%, 8% 78%, 0 63%, 6% 47%, 1% 28%);
    background:
        radial-gradient(ellipse at 50% 72%, var(--paddy-growth-shadow), transparent 76%),
        repeating-linear-gradient(102deg, transparent 0 9px, var(--paddy-growth-highlight) 9px 11px, transparent 11px 23px),
        repeating-linear-gradient(77deg, transparent 0 11px, var(--paddy-growth-stalk) 11px 13px, transparent 13px 25px),
        linear-gradient(180deg, rgba(117, 174, 100, 0.13), rgba(25, 92, 66, 0.08));
    opacity: 0.34;
    transform: rotate(-0.8deg);
    mix-blend-mode: soft-light;
}

.business-harvest-board--paddy .business-harvest-scene-tile:not(.empty)::after {
    inset: 3% 4% 6%;
    z-index: 2;
    border-radius: 42% 46% 40% 48%;
    clip-path: polygon(2% 8%, 16% 2%, 29% 6%, 45% 1%, 59% 5%, 77% 3%, 98% 10%, 94% 29%, 100% 45%, 96% 62%, 99% 85%, 88% 98%, 69% 93%, 53% 100%, 35% 94%, 17% 98%, 3% 89%, 8% 69%, 0 51%, 5% 32%);
    background:
        radial-gradient(ellipse at 50% 42%, rgba(196, 238, 229, 0.12), transparent 56%, rgba(14, 55, 48, 0.26) 100%),
        linear-gradient(180deg, rgba(189, 238, 231, 0.2), transparent 34%, rgba(16, 64, 58, 0.16)),
        repeating-linear-gradient(173deg, transparent 0 30px, rgba(237, 255, 233, 0.12) 30px 32px, transparent 32px 58px),
        radial-gradient(ellipse at 46% 32%, rgba(255, 255, 255, 0.12), transparent 58%);
    opacity: 0.54;
    mix-blend-mode: screen;
}

.business-harvest-board--paddy .business-harvest-scene-tile.has-crop-units::after {
    inset: -1% 0 0;
    background:
        radial-gradient(ellipse at 50% 42%, rgba(196, 238, 229, 0.16), transparent 54%, rgba(14, 55, 48, 0.24) 100%),
        repeating-linear-gradient(172deg, transparent 0 19px, rgba(237, 255, 233, 0.16) 19px 21px, transparent 21px 43px),
        repeating-linear-gradient(88deg, transparent 0 27px, rgba(18, 69, 61, 0.1) 27px 29px, transparent 29px 58px),
        radial-gradient(ellipse at 46% 32%, rgba(255, 255, 255, 0.14), transparent 58%);
    opacity: 0.62;
}

.business-harvest-board--paddy .business-harvest-scene-tile.has-grain-units::after {
    content: none;
}

.business-harvest-board--paddy .business-harvest-scene-tile.has-grain-units::before {
    content: none;
}

.business-harvest-board--paddy .business-harvest-scene-tile:not(.empty).business-harvest-stage--0::before {
    opacity: 0.18;
}

.business-harvest-board--paddy .business-harvest-scene-tile:not(.empty).business-harvest-stage--2::before,
.business-harvest-board--paddy .business-harvest-scene-tile:not(.empty).ready::before {
    opacity: 0.42;
    background:
        radial-gradient(ellipse at 50% 72%, var(--paddy-growth-shadow), transparent 76%),
        repeating-linear-gradient(104deg, transparent 0 7px, var(--paddy-growth-highlight) 7px 10px, transparent 10px 20px),
        repeating-linear-gradient(76deg, transparent 0 9px, var(--paddy-growth-stalk) 9px 12px, transparent 12px 22px),
        linear-gradient(180deg, rgba(190, 167, 71, 0.16), rgba(84, 110, 46, 0.09));
}

.business-harvest-board--paddy .business-harvest-scene-tile.has-grain-units.ready::before {
    opacity: 0.4;
    background:
        radial-gradient(ellipse at 50% 72%, rgba(86, 91, 36, 0.18), transparent 76%),
        repeating-linear-gradient(92deg, transparent 0 12px, rgba(224, 198, 83, 0.4) 12px 14px, transparent 14px 29px),
        repeating-linear-gradient(88deg, transparent 0 23px, rgba(112, 150, 70, 0.28) 23px 24px, transparent 24px 42px),
        linear-gradient(180deg, rgba(190, 167, 71, 0.1), rgba(84, 110, 46, 0.06));
    mix-blend-mode: normal;
}

.business-harvest-board--paddy .business-harvest-scene-tile.has-aquatic-units {
    --paddy-growth-stalk: rgba(72, 135, 82, 0.22);
    --paddy-growth-highlight: rgba(161, 207, 128, 0.22);
    --paddy-growth-shadow: rgba(18, 78, 58, 0.18);
}

.business-harvest-board--paddy .business-harvest-scene-tile.has-aquatic-units::before {
    opacity: 0.1;
    background:
        radial-gradient(ellipse at 30% 36%, rgba(126, 184, 117, 0.18), transparent 34%),
        radial-gradient(ellipse at 67% 60%, rgba(98, 161, 106, 0.16), transparent 38%),
        radial-gradient(ellipse at 50% 78%, rgba(18, 78, 58, 0.18), transparent 72%);
    mix-blend-mode: soft-light;
}

.business-harvest-board--paddy .business-harvest-scene-tile.has-aquatic-units::after {
    opacity: 0.42;
    background:
        radial-gradient(ellipse at 46% 36%, rgba(207, 246, 231, 0.16), transparent 46%, rgba(13, 67, 59, 0.2) 100%),
        repeating-linear-gradient(171deg, transparent 0 25px, rgba(237, 255, 233, 0.1) 25px 27px, transparent 27px 54px),
        radial-gradient(ellipse at 42% 28%, rgba(255, 255, 255, 0.12), transparent 54%);
    mix-blend-mode: screen;
}

.business-harvest-board--paddy .business-harvest-scene-tile:not(.empty) .business-harvest-crop-sprite {
    top: 53%;
    z-index: 1;
    width: min(var(--crop-size, 108%), 260px);
    clip-path: polygon(6% 8%, 96% 4%, 98% 91%, 4% 97%);
    opacity: 0.88;
    filter: drop-shadow(0 8px 7px rgba(9, 20, 8, 0.16)) saturate(0.88) brightness(0.94);
}

.business-harvest-board--paddy .business-harvest-scene-tile:not(.empty).business-harvest-stage--0 .business-harvest-crop-sprite,
.business-harvest-board--paddy .business-harvest-scene-tile:not(.empty).business-harvest-stage--1 .business-harvest-crop-sprite {
    top: 54%;
    width: min(var(--crop-size, 102%), 240px);
    opacity: 0.88;
}

.business-harvest-board--paddy .business-harvest-scene-tile:not(.empty).business-harvest-stage--2 .business-harvest-crop-sprite {
    top: 53%;
    width: min(var(--crop-size, 112%), 270px);
    opacity: 0.9;
}

.business-harvest-board--paddy .business-harvest-scene-tile:not(.empty).ready .business-harvest-crop-sprite {
    top: 53%;
    width: min(var(--crop-size, 118%), 290px);
    opacity: 0.94;
}

.business-harvest-board--paddy .business-harvest-scene-tile.has-grain-units:not(.empty) .business-harvest-crop-sprite {
    top: 54%;
    width: min(var(--crop-size, 142%), 320px);
    clip-path: polygon(2% 7%, 12% 2%, 34% 4%, 51% 1%, 71% 5%, 91% 3%, 99% 13%, 96% 34%, 100% 54%, 95% 73%, 98% 93%, 79% 99%, 57% 96%, 38% 100%, 16% 95%, 1% 98%, 4% 76%, 0 58%, 3% 39%);
    overflow: visible;
    -webkit-mask-image: radial-gradient(ellipse at 50% 55%, #000 0 34%, rgba(0, 0, 0, 0.76) 47%, transparent 70%);
    mask-image: radial-gradient(ellipse at 50% 55%, #000 0 34%, rgba(0, 0, 0, 0.76) 47%, transparent 70%);
    opacity: 0.9;
    filter: drop-shadow(0 6px 5px rgba(72, 50, 18, 0.09)) saturate(1.08) brightness(1.06) contrast(1.02);
}

.business-harvest-board--paddy .business-harvest-scene-tile:not(.empty) .business-harvest-crop-sprite::before,
.business-harvest-board--paddy .business-harvest-scene-tile:not(.empty) .business-harvest-crop-sprite::after {
    content: none;
    position: absolute;
    inset: 0;
    background-image: inherit;
    background-repeat: no-repeat;
    background-size: inherit;
    background-position: inherit;
    transform-origin: 50% 80%;
    pointer-events: none;
}

.business-harvest-board--paddy .business-harvest-scene-tile:not(.empty) .business-harvest-crop-sprite::before {
    opacity: 0.5;
    transform: translate(-54%, 15%) scale(0.72) rotate(-4deg);
}

.business-harvest-board--paddy .business-harvest-scene-tile:not(.empty) .business-harvest-crop-sprite::after {
    opacity: 0.46;
    transform: translate(56%, 17%) scale(0.68) rotate(4deg);
}

.business-harvest-scene-tile.has-grain-units .business-harvest-crop-sprite::before,
.business-harvest-scene-tile.has-grain-units .business-harvest-crop-sprite::after {
    content: "";
    position: absolute;
    top: 2%;
    bottom: 1%;
    width: 74%;
    background-image: var(--crop-image);
    background-repeat: no-repeat;
    background-size: 400% 100%;
    background-position: calc(var(--crop-stage, 0) * 33.333333%) 50%;
    pointer-events: none;
}

.business-harvest-scene-tile.has-grain-units .business-harvest-crop-sprite::before {
    left: 1%;
    opacity: 0.68;
    transform: translate(-24%, 6%) rotate(-4deg) scale(0.92, 0.98);
    -webkit-mask-image: radial-gradient(ellipse at 62% 55%, #000 0 36%, rgba(0, 0, 0, 0.72) 48%, transparent 72%);
    mask-image: radial-gradient(ellipse at 62% 55%, #000 0 36%, rgba(0, 0, 0, 0.72) 48%, transparent 72%);
}

.business-harvest-scene-tile.has-grain-units .business-harvest-crop-sprite::after {
    right: 0;
    opacity: 0.62;
    transform: translate(23%, -1%) rotate(4deg) scale(0.86, 0.94);
    -webkit-mask-image: radial-gradient(ellipse at 38% 53%, #000 0 35%, rgba(0, 0, 0, 0.7) 47%, transparent 71%);
    mask-image: radial-gradient(ellipse at 38% 53%, #000 0 35%, rgba(0, 0, 0, 0.7) 47%, transparent 71%);
}

.business-harvest-scene-tile.has-grain-units .business-harvest-crop-sprite::before,
.business-harvest-scene-tile.has-grain-units .business-harvest-crop-sprite::after {
    content: none;
}

.business-harvest-scene-tile.has-grain-units .business-harvest-crop-sprite--grain-main,
.business-harvest-scene-tile.has-grain-units .business-harvest-crop-sprite--grain-left,
.business-harvest-scene-tile.has-grain-units .business-harvest-crop-sprite--grain-right {
    background-image: var(--crop-image);
    background-repeat: no-repeat;
    background-size: 400% 100%;
    background-position: calc(var(--crop-stage, 0) * 33.333333%) 50%;
    overflow: visible;
    clip-path: none;
}

.business-harvest-scene-tile.has-grain-units .business-harvest-crop-sprite--grain-main {
    width: min(var(--crop-size, 112%), 270px);
    opacity: 0.82;
    -webkit-mask-image: radial-gradient(ellipse at 50% 55%, #000 0 34%, rgba(0, 0, 0, 0.68) 48%, transparent 70%);
    mask-image: radial-gradient(ellipse at 50% 55%, #000 0 34%, rgba(0, 0, 0, 0.68) 48%, transparent 70%);
}

.business-harvest-scene-tile.has-grain-units .business-harvest-crop-sprite--grain-left {
    top: 55%;
    width: min(var(--crop-size, 106%), 255px);
    opacity: 0.54;
    transform: translate(-68%, -46%) rotate(-5deg) scale(0.92, 0.98);
    -webkit-mask-image: radial-gradient(ellipse at 62% 54%, #000 0 34%, rgba(0, 0, 0, 0.62) 48%, transparent 69%);
    mask-image: radial-gradient(ellipse at 62% 54%, #000 0 34%, rgba(0, 0, 0, 0.62) 48%, transparent 69%);
}

.business-harvest-scene-tile.has-grain-units .business-harvest-crop-sprite--grain-right {
    top: 53%;
    width: min(var(--crop-size, 102%), 245px);
    opacity: 0.5;
    transform: translate(-32%, -52%) rotate(4deg) scale(0.88, 0.94);
    -webkit-mask-image: radial-gradient(ellipse at 38% 54%, #000 0 33%, rgba(0, 0, 0, 0.6) 47%, transparent 68%);
    mask-image: radial-gradient(ellipse at 38% 54%, #000 0 33%, rgba(0, 0, 0, 0.6) 47%, transparent 68%);
}

.business-harvest-board--paddy .business-harvest-scene-tile:not(.empty) > span:not(.business-harvest-crop-cluster),
.business-harvest-board--paddy .business-harvest-scene-tile:not(.empty) small,
.business-harvest-board--field .business-harvest-scene-tile:not(.empty) > span:not(.business-harvest-crop-cluster),
.business-harvest-board--field .business-harvest-scene-tile:not(.empty) small {
    z-index: 3;
    text-shadow: 0 2px 6px rgba(10, 22, 11, 0.82), 0 0 10px rgba(6, 20, 13, 0.54);
}

.business-harvest-scene-tile.empty .business-harvest-crop-sprite {
    display: none;
}

.business-harvest-scene-tile.empty {
    color: rgba(232, 225, 199, 0.76);
    background:
        linear-gradient(180deg, rgba(93, 77, 45, 0.08), rgba(37, 31, 23, 0.08)),
        rgba(8, 10, 8, 0.05);
}

.business-harvest-scene-tile.growing {
    border-color: rgba(168, 222, 121, 0.38);
    background:
        linear-gradient(180deg, rgba(149, 214, 111, 0.06), rgba(25, 67, 36, 0.08)),
        rgba(15, 34, 18, 0.06);
}

.business-harvest-scene-tile.ready {
    border-color: rgba(255, 226, 105, 0.56);
    background:
        linear-gradient(180deg, rgba(255, 227, 115, 0.09), rgba(56, 102, 40, 0.08)),
        rgba(15, 18, 8, 0.05);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16), 0 0 0 2px rgba(255, 214, 94, 0.16), 0 16px 26px rgba(44, 31, 6, 0.2);
}

.business-harvest-board--field .business-harvest-scene-tile.has-crop-units,
.business-harvest-board--field .business-harvest-scene-tile.has-crop-units.growing,
.business-harvest-board--field .business-harvest-scene-tile.has-crop-units.ready,
.business-harvest-board--field .business-harvest-scene-tile.has-crop-units:hover,
.business-harvest-board--field .business-harvest-scene-tile.has-crop-units:focus-visible,
.business-harvest-board--field .business-harvest-scene-tile.has-crop-units.selected,
.business-harvest-board--paddy .business-harvest-scene-tile.has-crop-units,
.business-harvest-board--paddy .business-harvest-scene-tile.has-crop-units.growing,
.business-harvest-board--paddy .business-harvest-scene-tile.has-crop-units.ready,
.business-harvest-board--paddy .business-harvest-scene-tile.has-crop-units:hover,
.business-harvest-board--paddy .business-harvest-scene-tile.has-crop-units:focus-visible,
.business-harvest-board--paddy .business-harvest-scene-tile.has-crop-units.selected {
    border-color: transparent;
    outline: none;
    box-shadow: none;
}

.business-harvest-board--pasture .business-harvest-scene-tile,
.business-harvest-board--pasture .business-harvest-scene-tile.growing,
.business-harvest-board--pasture .business-harvest-scene-tile.ready,
.business-harvest-board--pasture .business-harvest-scene-tile:hover,
.business-harvest-board--pasture .business-harvest-scene-tile:focus-visible,
.business-harvest-board--pasture .business-harvest-scene-tile.selected {
    border-color: transparent;
    outline: none;
    background: none;
    box-shadow: none;
}

.business-harvest-board--herb .business-harvest-scene-tile,
.business-harvest-board--herb .business-harvest-scene-tile.growing,
.business-harvest-board--herb .business-harvest-scene-tile.ready,
.business-harvest-board--herb .business-harvest-scene-tile:hover,
.business-harvest-board--herb .business-harvest-scene-tile:focus-visible,
.business-harvest-board--herb .business-harvest-scene-tile.selected {
    border-color: transparent;
    outline: none;
    background: none;
    box-shadow: none;
}

.business-harvest-board--mulberry .business-harvest-scene-tile,
.business-harvest-board--mulberry .business-harvest-scene-tile.growing,
.business-harvest-board--mulberry .business-harvest-scene-tile.ready,
.business-harvest-board--mulberry .business-harvest-scene-tile:hover,
.business-harvest-board--mulberry .business-harvest-scene-tile:focus-visible,
.business-harvest-board--mulberry .business-harvest-scene-tile.selected {
    border-color: transparent;
    outline: none;
    background: none;
    box-shadow: none;
}

.business-harvest-board--wood .business-harvest-scene-tile,
.business-harvest-board--wood .business-harvest-scene-tile.growing,
.business-harvest-board--wood .business-harvest-scene-tile.ready,
.business-harvest-board--wood .business-harvest-scene-tile:hover,
.business-harvest-board--wood .business-harvest-scene-tile:focus-visible,
.business-harvest-board--wood .business-harvest-scene-tile.selected {
    border-color: transparent;
    outline: none;
    background: none;
    box-shadow: none;
}

.business-harvest-board--orchard .business-harvest-scene-tile {
    isolation: isolate;
    overflow: visible;
    clip-path: none;
    background: transparent;
    border-color: transparent;
    box-shadow: none;
    --orchard-tile-bg:
        linear-gradient(180deg, rgba(255, 233, 170, 0.1), rgba(24, 61, 35, 0.18)),
        radial-gradient(circle at 35% 35%, rgba(238, 205, 135, 0.38) 0 12px, transparent 13px),
        radial-gradient(circle at 70% 62%, rgba(64, 121, 55, 0.62) 0 18px, transparent 19px),
        rgba(58, 101, 48, 0.56);
    --orchard-tile-border: rgba(255, 255, 255, 0.18);
    --orchard-tile-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 10px 18px rgba(0, 0, 0, 0.12);
}

.business-harvest-board--orchard .business-harvest-scene-tile::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    clip-path: var(--plot-clip);
    background: var(--orchard-tile-bg);
    border: 1px solid var(--orchard-tile-border);
    box-shadow: var(--orchard-tile-shadow);
    pointer-events: none;
    transition: border-color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease;
}

.business-harvest-board--orchard .business-harvest-scene-tile.empty {
    --orchard-tile-bg:
        linear-gradient(180deg, rgba(93, 77, 45, 0.08), rgba(37, 31, 23, 0.08)),
        rgba(8, 10, 8, 0.05);
}

.business-harvest-board--orchard .business-harvest-scene-tile.growing {
    --orchard-tile-bg:
        linear-gradient(180deg, rgba(149, 214, 111, 0.06), rgba(25, 67, 36, 0.08)),
        rgba(15, 34, 18, 0.06);
    --orchard-tile-border: rgba(168, 222, 121, 0.38);
}

.business-harvest-board--orchard .business-harvest-scene-tile.ready {
    --orchard-tile-bg:
        linear-gradient(180deg, rgba(255, 227, 115, 0.09), rgba(56, 102, 40, 0.08)),
        rgba(15, 18, 8, 0.05);
    --orchard-tile-border: rgba(255, 226, 105, 0.56);
    --orchard-tile-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16), 0 0 0 2px rgba(255, 214, 94, 0.16), 0 16px 26px rgba(44, 31, 6, 0.2);
}

.business-harvest-board--orchard .business-harvest-scene-tile:hover,
.business-harvest-board--orchard .business-harvest-scene-tile:focus-visible,
.business-harvest-board--orchard .business-harvest-scene-tile.selected {
    background: transparent;
    border-color: transparent;
    box-shadow: none;
    --orchard-tile-bg:
        linear-gradient(180deg, rgba(255, 235, 138, 0.16), rgba(32, 73, 43, 0.18)),
        rgba(16, 26, 15, 0.22);
    --orchard-tile-border: rgba(255, 230, 122, 0.76);
    --orchard-tile-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.18), 0 0 0 2px rgba(255, 214, 94, 0.14), 0 12px 22px rgba(0, 0, 0, 0.18);
}

.business-harvest-board--orchard .business-harvest-crop-sprite {
    top: 50%;
    width: min(152%, 190px);
    max-width: none;
    overflow: visible;
    --crop-translate-x: -50%;
    --crop-translate-y: -66%;
}

.business-harvest-board--orchard .business-harvest-stage--0 .business-harvest-crop-sprite {
    width: min(112%, 145px);
    --crop-translate-y: -58%;
}

.business-harvest-board--orchard .business-harvest-stage--1 .business-harvest-crop-sprite {
    width: min(134%, 168px);
    --crop-translate-y: -63%;
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, 0.62) 5%, #000 12%, #000 88%, rgba(0, 0, 0, 0.62) 95%, transparent 100%);
    mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, 0.62) 5%, #000 12%, #000 88%, rgba(0, 0, 0, 0.62) 95%, transparent 100%);
}

.business-harvest-board--orchard .business-harvest-stage--2 .business-harvest-crop-sprite {
    width: min(156%, 196px);
    --crop-translate-y: -67%;
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, 0.62) 5%, #000 12%, #000 88%, rgba(0, 0, 0, 0.62) 95%, transparent 100%);
    mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, 0.62) 5%, #000 12%, #000 88%, rgba(0, 0, 0, 0.62) 95%, transparent 100%);
}

.business-harvest-board--orchard .business-harvest-scene-tile.ready .business-harvest-crop-sprite {
    width: min(172%, 214px);
    --crop-translate-y: -68%;
    -webkit-mask-image: none;
    mask-image: none;
}

.business-harvest-board--orchard .business-harvest-product--pear .business-harvest-crop-sprite,
.business-harvest-board--orchard .business-harvest-product--peach .business-harvest-crop-sprite,
.business-harvest-board--orchard .business-harvest-product--plum .business-harvest-crop-sprite,
.business-harvest-board--orchard .business-harvest-product--apricot .business-harvest-crop-sprite,
.business-harvest-board--orchard .business-harvest-product--orange .business-harvest-crop-sprite,
.business-harvest-board--orchard .business-harvest-product--grape .business-harvest-crop-sprite,
.business-harvest-board--orchard .business-harvest-product--pomegranate .business-harvest-crop-sprite {
    width: min(118%, 150px);
    --crop-translate-y: -61%;
    -webkit-mask-image: none;
    mask-image: none;
}

.business-harvest-board--orchard .business-harvest-stage--0.business-harvest-product--pear .business-harvest-crop-sprite,
.business-harvest-board--orchard .business-harvest-stage--0.business-harvest-product--peach .business-harvest-crop-sprite,
.business-harvest-board--orchard .business-harvest-stage--0.business-harvest-product--plum .business-harvest-crop-sprite,
.business-harvest-board--orchard .business-harvest-stage--0.business-harvest-product--apricot .business-harvest-crop-sprite,
.business-harvest-board--orchard .business-harvest-stage--0.business-harvest-product--orange .business-harvest-crop-sprite,
.business-harvest-board--orchard .business-harvest-stage--0.business-harvest-product--grape .business-harvest-crop-sprite,
.business-harvest-board--orchard .business-harvest-stage--0.business-harvest-product--pomegranate .business-harvest-crop-sprite {
    width: min(94%, 124px);
    --crop-translate-y: -55%;
}

.business-harvest-board--orchard .business-harvest-stage--1.business-harvest-product--pear .business-harvest-crop-sprite,
.business-harvest-board--orchard .business-harvest-stage--1.business-harvest-product--peach .business-harvest-crop-sprite,
.business-harvest-board--orchard .business-harvest-stage--1.business-harvest-product--plum .business-harvest-crop-sprite,
.business-harvest-board--orchard .business-harvest-stage--1.business-harvest-product--apricot .business-harvest-crop-sprite,
.business-harvest-board--orchard .business-harvest-stage--1.business-harvest-product--orange .business-harvest-crop-sprite,
.business-harvest-board--orchard .business-harvest-stage--1.business-harvest-product--grape .business-harvest-crop-sprite,
.business-harvest-board--orchard .business-harvest-stage--1.business-harvest-product--pomegranate .business-harvest-crop-sprite {
    width: min(106%, 138px);
    --crop-translate-y: -58%;
}

.business-harvest-board--orchard .business-harvest-stage--2.business-harvest-product--pear .business-harvest-crop-sprite,
.business-harvest-board--orchard .business-harvest-stage--2.business-harvest-product--peach .business-harvest-crop-sprite,
.business-harvest-board--orchard .business-harvest-stage--2.business-harvest-product--plum .business-harvest-crop-sprite,
.business-harvest-board--orchard .business-harvest-stage--2.business-harvest-product--apricot .business-harvest-crop-sprite,
.business-harvest-board--orchard .business-harvest-stage--2.business-harvest-product--orange .business-harvest-crop-sprite,
.business-harvest-board--orchard .business-harvest-stage--2.business-harvest-product--grape .business-harvest-crop-sprite,
.business-harvest-board--orchard .business-harvest-stage--2.business-harvest-product--pomegranate .business-harvest-crop-sprite {
    width: min(120%, 154px);
    --crop-translate-y: -61%;
}

.business-harvest-board--orchard .business-harvest-scene-tile.ready.business-harvest-product--pear .business-harvest-crop-sprite,
.business-harvest-board--orchard .business-harvest-scene-tile.ready.business-harvest-product--peach .business-harvest-crop-sprite,
.business-harvest-board--orchard .business-harvest-scene-tile.ready.business-harvest-product--plum .business-harvest-crop-sprite,
.business-harvest-board--orchard .business-harvest-scene-tile.ready.business-harvest-product--apricot .business-harvest-crop-sprite,
.business-harvest-board--orchard .business-harvest-scene-tile.ready.business-harvest-product--orange .business-harvest-crop-sprite,
.business-harvest-board--orchard .business-harvest-scene-tile.ready.business-harvest-product--grape .business-harvest-crop-sprite,
.business-harvest-board--orchard .business-harvest-scene-tile.ready.business-harvest-product--pomegranate .business-harvest-crop-sprite {
    width: min(132%, 168px);
    --crop-translate-y: -63%;
}

.business-harvest-region-strip {
    position: absolute;
    left: 18px;
    right: 18px;
    bottom: 14px;
    z-index: 7;
    display: grid;
    grid-template-columns: repeat(9, minmax(0, 1fr));
    gap: 6px;
}

.business-harvest-region-pill {
    min-width: 0;
    min-height: 42px;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    grid-template-rows: auto auto;
    gap: 2px 6px;
    padding: 6px 7px;
    border: 1px solid rgba(255, 245, 198, 0.18);
    border-radius: 8px;
    color: #f8f3df;
    background: rgba(8, 18, 18, 0.56);
    cursor: pointer;
    text-align: left;
    backdrop-filter: blur(2px) saturate(1.08);
}

.business-harvest-region-pill.selected,
.business-harvest-region-pill:hover,
.business-harvest-region-pill:focus-visible {
    border-color: rgba(243, 180, 90, 0.58);
    background: rgba(83, 95, 45, 0.62);
}

.business-harvest-region-pill.ready {
    border-color: rgba(255, 226, 105, 0.52);
}

.business-harvest-region-pill span {
    grid-row: 1 / 3;
    align-self: center;
    padding: 2px 5px;
    border-radius: 999px;
    color: #1f2f23;
    background: rgba(255, 237, 142, 0.9);
    font-size: 0.64rem;
    font-weight: 1000;
}

.business-harvest-region-pill strong,
.business-harvest-region-pill small {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.business-harvest-region-pill strong {
    font-size: 0.7rem;
    line-height: 1.12;
}

.business-harvest-region-pill small {
    color: #d7dfcf;
    font-size: 0.62rem;
}

.business-main-map-panel.business-harvest-map-panel {
    grid-template-rows: auto auto auto minmax(0, 1fr) auto auto;
    gap: 8px;
    background:
        linear-gradient(180deg, rgba(24, 34, 31, 0.88), rgba(9, 15, 17, 0.92)),
        rgba(8, 13, 18, 0.82);
}

.business-main-map-panel.business-harvest-map-panel .business-harvest-seed-grid {
    min-height: 0;
    align-content: start;
    overflow: auto;
    padding-right: 2px;
}

.business-harvest-command-card {
    display: grid;
    gap: 5px;
    padding: 9px 10px;
    border: 1px solid rgba(241, 190, 92, 0.28);
    border-radius: 8px;
    color: #f6ead0;
    background:
        linear-gradient(135deg, rgba(89, 96, 47, 0.32), rgba(15, 23, 20, 0.72)),
        rgba(11, 19, 18, 0.48);
}

.business-harvest-command-card span {
    color: #d9efcd;
    font-size: 0.72rem;
    font-weight: 900;
}

.business-harvest-command-card strong {
    color: #fff4c8;
    font-size: 0.9rem;
    line-height: 1.18;
}

.business-harvest-command-card em {
    color: #d9ddcf;
    font-size: 0.74rem;
    font-style: normal;
    line-height: 1.35;
}

.business-harvest-seed-grid {
    min-width: 0;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 7px;
}

.business-harvest-seed-grid.compact {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.business-harvest-seed {
    min-width: 0;
    min-height: 52px;
    display: grid;
    gap: 3px;
    align-content: center;
    padding: 8px;
    border: 1px solid rgba(255, 245, 198, 0.16);
    border-radius: 8px;
    color: #f8f3df;
    background: rgba(255, 255, 255, 0.06);
    cursor: pointer;
    text-align: left;
}

.business-harvest-seed.available:hover,
.business-harvest-seed.available:focus-visible {
    border-color: rgba(243, 180, 90, 0.56);
    background: rgba(127, 158, 78, 0.24);
}

.business-harvest-seed.selected {
    border-color: rgba(255, 226, 121, 0.72);
    background:
        linear-gradient(135deg, rgba(127, 158, 78, 0.32), rgba(243, 180, 90, 0.18)),
        rgba(255, 255, 255, 0.08);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16), 0 0 0 2px rgba(255, 226, 121, 0.1);
}

.business-harvest-seed:disabled {
    cursor: not-allowed;
    opacity: 0.6;
}

.business-harvest-seed span,
.business-harvest-seed small {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.business-harvest-seed span {
    color: #fff7d6;
    font-size: 0.78rem;
    font-weight: 900;
}

.business-harvest-seed small {
    color: #d4dccf;
    font-size: 0.66rem;
}

.business-main-map-board-degrid::before {
    background-image:
        radial-gradient(circle at 34% 28%, rgba(255, 232, 170, 0.1), transparent 58%),
        radial-gradient(ellipse at 67% 72%, rgba(145, 114, 62, 0.12), transparent 56%),
        linear-gradient(180deg, rgba(255, 239, 190, 0.07), rgba(78, 62, 35, 0.16)),
        url("../images/business/city/business-ground-loess-tile-v1.png");
    background-size:
        cover,
        cover,
        cover,
        calc(100% / var(--cols)) calc(100% / var(--rows));
    background-position: center, center, center, left top;
    background-repeat: no-repeat, no-repeat, no-repeat, repeat;
    opacity: 0.96;
    filter: saturate(0.9) contrast(0.94) brightness(0.99);
}

.business-main-map-board-degrid::after {
    background-image:
        radial-gradient(circle at 44% 34%, rgba(255, 244, 206, 0.08), transparent 52%),
        radial-gradient(ellipse at 28% 80%, rgba(66, 49, 25, 0.14), transparent 48%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.02), rgba(2, 8, 10, 0.17));
    background-size: cover, cover, cover;
    background-position: center, center, center;
    background-repeat: no-repeat, no-repeat, no-repeat;
    opacity: 0.22;
}

.business-main-map-board-degrid .business-grid-cells::before {
    content: "";
    position: absolute;
    inset: 8px;
    z-index: 0;
    border-radius: 6px;
    background-image:
        radial-gradient(ellipse at 24% 24%, rgba(96, 74, 39, 0.12), transparent 20%),
        radial-gradient(ellipse at 55% 54%, rgba(116, 86, 43, 0.11), transparent 22%),
        radial-gradient(ellipse at 78% 72%, rgba(91, 68, 37, 0.1), transparent 18%),
        linear-gradient(18deg, transparent 0 42%, rgba(112, 82, 42, 0.08) 47%, transparent 55%),
        linear-gradient(162deg, transparent 0 36%, rgba(244, 219, 157, 0.06) 41%, transparent 48%);
    background-size: cover, cover;
    background-repeat: no-repeat;
    opacity: 0.58;
    pointer-events: none;
    mix-blend-mode: multiply;
}

.business-main-map-board-degrid .business-main-map-ground-overlays {
    position: absolute;
    inset: 10px;
    z-index: 1;
    overflow: hidden;
    border-radius: 6px;
    pointer-events: none;
    mix-blend-mode: normal;
}

.business-main-map-board-degrid .business-main-map-street-layer {
    position: absolute;
    inset: 0;
    z-index: 3;
    pointer-events: none;
    mix-blend-mode: normal;
}

.business-main-map-board-degrid .business-main-map-street-corridor {
    position: absolute;
    left: var(--street-left, 0);
    top: var(--street-top, 0);
    width: var(--street-width, 42%);
    height: var(--street-height, 11%);
    display: block;
    border-radius: 999px;
    background-image:
        linear-gradient(90deg, transparent 0%, rgba(255, 235, 173, 0.22) 20%, rgba(206, 157, 76, 0.3) 50%, rgba(255, 240, 187, 0.18) 78%, transparent 100%),
        radial-gradient(ellipse at 48% 52%, rgba(214, 169, 83, 0.34), rgba(121, 78, 34, 0.22) 56%, transparent 82%),
        url("../images/business/city/overlays/business-map-overlay-dirt-road-straight-v1.png");
    background-position: center;
    background-repeat: no-repeat, no-repeat, repeat;
    background-size: cover, cover, 180px 100%;
    opacity: calc(var(--street-opacity, 0.28) * var(--street-alpha, 1));
    filter: saturate(0.78) contrast(0.9) brightness(1.04) blur(0.08px);
    transform: rotate(var(--street-rotate, 0deg));
    transform-origin: center;
    box-shadow:
        inset 0 4px 12px rgba(255, 237, 181, 0.08),
        inset 0 -8px 16px rgba(74, 48, 22, 0.16);
    -webkit-mask-image: radial-gradient(ellipse at center, #000 28%, rgba(0, 0, 0, 0.82) 56%, transparent 78%);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-image: radial-gradient(ellipse at center, #000 28%, rgba(0, 0, 0, 0.82) 56%, transparent 78%);
    mask-repeat: no-repeat;
    mask-size: 100% 100%;
}

.business-main-map-board-degrid .business-main-map-street-corridor::before,
.business-main-map-board-degrid .business-main-map-street-corridor::after {
    content: "";
    position: absolute;
    inset: 20% 7%;
    border-radius: inherit;
    pointer-events: none;
}

.business-main-map-board-degrid .business-main-map-street-corridor::before {
    background: linear-gradient(90deg, transparent, rgba(255, 238, 181, 0.18), transparent);
    opacity: 0.62;
}

.business-main-map-board-degrid .business-main-map-street-corridor::after {
    inset: 12% 5%;
    background: repeating-linear-gradient(90deg, transparent 0 28px, rgba(65, 45, 22, 0.1) 30px 36px, transparent 38px 66px);
    opacity: 0.42;
}

.business-main-map-board-degrid .business-main-map-street-corridor--market-spine {
    --street-left: 16%;
    --street-top: 29%;
    --street-width: 56%;
    --street-height: 11%;
    --street-opacity: 0.32;
    --street-rotate: -1.5deg;
}

.business-main-map-board-degrid .business-main-map-street-corridor--central-spine {
    --street-left: 7%;
    --street-top: 46%;
    --street-width: 80%;
    --street-height: 15%;
    --street-opacity: 0.38;
    --street-rotate: 1deg;
}

.business-main-map-board-degrid .business-main-map-street-corridor--south-spine {
    --street-left: 20%;
    --street-top: 72%;
    --street-width: 60%;
    --street-height: 11%;
    --street-opacity: 0.31;
    --street-rotate: -1deg;
}

.business-main-map-board-degrid .business-main-map-street-corridor--horse-lane {
    --street-left: 72%;
    --street-top: 22%;
    --street-width: 12%;
    --street-height: 51%;
    --street-opacity: 0.26;
    --street-rotate: 2deg;
    background-size: cover, cover, 100% 150px;
}

.business-main-map-board-degrid .business-main-map-street-corridor--horse-lane::before {
    background: linear-gradient(180deg, transparent, rgba(255, 238, 181, 0.16), transparent);
}

.business-main-map-board-degrid .business-main-map-street-corridor--horse-lane::after {
    background: repeating-linear-gradient(180deg, transparent 0 24px, rgba(65, 45, 22, 0.1) 27px 33px, transparent 35px 58px);
}

.business-main-map-board-degrid .business-main-map-street-details {
    position: absolute;
    inset: 0;
    z-index: 3;
    pointer-events: none;
    mix-blend-mode: multiply;
}

.business-main-map-board-degrid .business-main-map-street-detail {
    --detail-image: none;
    --detail-fallback: none;
    position: absolute;
    left: var(--detail-left, 0);
    top: var(--detail-top, 0);
    width: var(--detail-width, 16%);
    height: var(--detail-height, 8%);
    display: block;
    border-radius: 999px;
    background-image: var(--detail-image), var(--detail-fallback);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain, 100% 100%;
    opacity: calc(var(--detail-opacity, 0.18) * var(--detail-alpha, 1));
    transform: rotate(var(--detail-rotate, 0deg)) scale(var(--detail-scale, 1));
    transform-origin: center;
    filter: saturate(0.74) contrast(0.86) brightness(0.98) blur(0.12px);
    pointer-events: none;
}

.business-main-map-board-degrid .business-main-map-street-detail--door-scuff {
    --detail-fallback:
        radial-gradient(ellipse at 50% 52%, rgba(72, 47, 23, 0.4), rgba(123, 79, 35, 0.18) 48%, transparent 74%),
        radial-gradient(ellipse at 28% 45%, rgba(234, 193, 111, 0.22), transparent 54%);
    box-shadow: inset 0 -4px 10px rgba(65, 42, 19, 0.08);
}

.business-main-map-board-degrid .business-main-map-street-detail--cart-ruts {
    border-radius: 30px;
    --detail-fallback:
        linear-gradient(180deg, transparent 0 18%, rgba(63, 42, 20, 0.22) 27% 34%, transparent 42% 57%, rgba(70, 45, 22, 0.2) 66% 73%, transparent 82% 100%),
        repeating-linear-gradient(90deg, transparent 0 34px, rgba(112, 75, 36, 0.13) 36px 42px, transparent 45px 72px);
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 16%, #000 84%, transparent);
    mask-image: linear-gradient(90deg, transparent, #000 16%, #000 84%, transparent);
}

.business-main-map-board-degrid .business-main-map-street-detail--footprints {
    --detail-fallback:
        radial-gradient(ellipse at 9% 38%, rgba(61, 42, 22, 0.32) 0 7%, transparent 9%),
        radial-gradient(ellipse at 17% 61%, rgba(61, 42, 22, 0.24) 0 6%, transparent 8%),
        radial-gradient(ellipse at 29% 40%, rgba(61, 42, 22, 0.3) 0 7%, transparent 9%),
        radial-gradient(ellipse at 39% 63%, rgba(61, 42, 22, 0.23) 0 6%, transparent 8%),
        radial-gradient(ellipse at 53% 39%, rgba(61, 42, 22, 0.28) 0 7%, transparent 9%),
        radial-gradient(ellipse at 64% 61%, rgba(61, 42, 22, 0.22) 0 6%, transparent 8%),
        radial-gradient(ellipse at 78% 41%, rgba(61, 42, 22, 0.26) 0 7%, transparent 9%),
        radial-gradient(ellipse at 90% 59%, rgba(61, 42, 22, 0.2) 0 6%, transparent 8%);
}

.business-main-map-board-degrid .business-main-map-street-detail--gravel-edge {
    border-radius: 34px;
    --detail-fallback:
        radial-gradient(circle at 10% 55%, rgba(75, 54, 29, 0.28) 0 4%, transparent 6%),
        radial-gradient(circle at 21% 35%, rgba(129, 91, 48, 0.24) 0 3%, transparent 5%),
        radial-gradient(circle at 35% 68%, rgba(87, 59, 30, 0.24) 0 4%, transparent 6%),
        radial-gradient(circle at 48% 42%, rgba(158, 112, 58, 0.22) 0 3%, transparent 5%),
        radial-gradient(circle at 62% 62%, rgba(77, 53, 29, 0.25) 0 4%, transparent 6%),
        radial-gradient(circle at 77% 38%, rgba(128, 89, 47, 0.22) 0 3%, transparent 5%),
        radial-gradient(circle at 90% 58%, rgba(82, 56, 29, 0.24) 0 4%, transparent 6%);
}

.business-main-map-board-degrid .business-main-map-street-detail--door-scuff-a {
    --detail-image: url("../images/business/city/street-details/business-street-door-scuff-a-v1.png");
    --detail-left: 13%;
    --detail-top: 28%;
    --detail-width: 19%;
    --detail-height: 8%;
    --detail-opacity: 0.22;
    --detail-rotate: -3deg;
}

.business-main-map-board-degrid .business-main-map-street-detail--door-scuff-b {
    --detail-image: url("../images/business/city/street-details/business-street-door-scuff-b-v1.png");
    --detail-left: 47%;
    --detail-top: 40%;
    --detail-width: 23%;
    --detail-height: 9%;
    --detail-opacity: 0.2;
    --detail-rotate: 3deg;
}

.business-main-map-board-degrid .business-main-map-street-detail--door-scuff-c {
    --detail-image: url("../images/business/city/street-details/business-building-ground-shadow-irregular-a-v1.png");
    --detail-left: 30%;
    --detail-top: 64%;
    --detail-width: 22%;
    --detail-height: 8%;
    --detail-opacity: 0.18;
    --detail-rotate: -1deg;
}

.business-main-map-board-degrid .business-main-map-street-detail--cart-ruts-a {
    --detail-image: url("../images/business/city/street-details/business-street-cart-ruts-a-v1.png");
    --detail-left: 17%;
    --detail-top: 50%;
    --detail-width: 48%;
    --detail-height: 9%;
    --detail-opacity: 0.21;
    --detail-rotate: 1deg;
}

.business-main-map-board-degrid .business-main-map-street-detail--cart-ruts-b {
    --detail-image: url("../images/business/city/street-details/business-street-cart-ruts-b-v1.png");
    --detail-left: 43%;
    --detail-top: 73%;
    --detail-width: 34%;
    --detail-height: 8%;
    --detail-opacity: 0.18;
    --detail-rotate: -2deg;
}

.business-main-map-board-degrid .business-main-map-street-detail--footprints-a {
    --detail-image: url("../images/business/city/street-details/business-street-footprints-a-v1.png");
    --detail-left: 28%;
    --detail-top: 31%;
    --detail-width: 29%;
    --detail-height: 7%;
    --detail-opacity: 0.24;
    --detail-rotate: -4deg;
}

.business-main-map-board-degrid .business-main-map-street-detail--footprints-b {
    --detail-image: url("../images/business/city/street-details/business-street-footprints-b-v1.png");
    --detail-left: 58%;
    --detail-top: 53%;
    --detail-width: 25%;
    --detail-height: 7%;
    --detail-opacity: 0.2;
    --detail-rotate: 8deg;
}

.business-main-map-board-degrid .business-main-map-street-detail--gravel-edge-a {
    --detail-image: url("../images/business/city/street-details/business-street-gravel-edge-a-v1.png");
    --detail-left: 7%;
    --detail-top: 42%;
    --detail-width: 23%;
    --detail-height: 11%;
    --detail-opacity: 0.2;
    --detail-rotate: -5deg;
}

.business-main-map-board-degrid .business-main-map-street-detail--gravel-edge-b {
    --detail-image: url("../images/business/city/street-details/business-street-gravel-edge-b-v1.png");
    --detail-left: 67%;
    --detail-top: 69%;
    --detail-width: 19%;
    --detail-height: 10%;
    --detail-opacity: 0.18;
    --detail-rotate: 4deg;
}

.business-main-map-board-degrid .business-main-map-city-decorations {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    mix-blend-mode: normal;
}

.business-main-map-board-degrid .business-main-map-region-labels {
    position: absolute;
    inset: 0;
    z-index: 4;
    pointer-events: none;
}

.business-main-map-board-degrid .business-main-map-region-label {
    position: absolute;
    left: var(--label-left, 50%);
    top: var(--label-top, 50%);
    transform: translate(-50%, -50%) rotate(var(--label-tilt, -2deg));
    display: inline-flex;
    align-items: center;
    justify-content: center;
    max-width: 9em;
    padding: 2px 6px;
    border: 1px solid rgba(98, 76, 38, 0.18);
    border-radius: 4px;
    color: rgba(78, 56, 28, 0.54);
    background: rgba(255, 237, 185, 0.18);
    box-shadow: 0 1px 0 rgba(255, 250, 221, 0.18);
    font-size: 0.68rem;
    font-weight: 900;
    line-height: 1.1;
    letter-spacing: 0;
    white-space: nowrap;
    text-shadow: 0 1px 0 rgba(255, 249, 221, 0.38);
    mix-blend-mode: multiply;
    opacity: 0.78;
}

.business-main-map-board-degrid.business-city-decor-editor-active .business-main-map-region-labels,
.business-main-map-board-degrid.business-map-layout-editor-active .business-main-map-region-labels {
    display: block;
}

.business-main-map-board-degrid .business-town-life-layer {
    position: absolute;
    inset: 10px;
    z-index: 4;
    overflow: hidden;
    border-radius: 6px;
    pointer-events: none;
    contain: paint;
}

.business-main-map-board-degrid.business-map-layout-editor-active .business-town-life-layer {
    opacity: 1;
    visibility: visible;
}

.business-main-map-board-degrid .business-town-life-actor {
    --life-cloth: #8b5f34;
    --life-cloth-dark: #5b3b21;
    --life-accent: #d8a85f;
    --life-face: #d69a64;
    position: absolute;
    left: var(--life-anchor-left, var(--life-p0-left, 0));
    top: var(--life-anchor-top, var(--life-p0-top, 0));
    z-index: var(--life-z, 16);
    width: var(--life-width, clamp(28px, 2.35vw, 42px));
    height: var(--life-height, clamp(34px, 3.1vw, 56px));
    opacity: 0;
    transform: translate(-50%, -100%);
    filter: drop-shadow(0 4px 4px rgba(40, 24, 12, 0.28));
    animation: business-town-life-walk var(--life-duration, 34s) linear infinite;
    animation-delay: var(--life-delay, 0s);
    will-change: left, top, transform, opacity;
}

.business-main-map-board-degrid .business-town-life-actor--fixture {
    opacity: 0.94;
    animation: none;
    will-change: auto;
}

.business-main-map-board-degrid .business-town-life-actor--route {
    --life-route-scale: 0.86;
    --life-step-duration: 1.35s;
    filter: drop-shadow(0 2px 2px rgba(40, 24, 12, 0.16));
}

.business-main-map-board-degrid .business-town-life-actor--fixture .business-town-life-person {
    animation: none;
}

.business-main-map-board-degrid .business-town-life-actor::before {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -1px;
    width: 72%;
    height: 4px;
    border-radius: 999px;
    background: rgba(51, 35, 19, 0.2);
    transform: translateX(-50%);
    filter: blur(1px);
}

.business-main-map-board-degrid .business-town-life-actor--route::before {
    bottom: -2px;
    height: 3px;
    background: rgba(51, 35, 19, 0.14);
    filter: blur(1.4px);
    animation: business-town-life-shadow-frame var(--life-step-duration, 1.35s) steps(6, end) infinite;
}

.business-main-map-board-degrid .business-town-life-person {
    position: absolute;
    inset: 0;
    display: block;
    transform-origin: 50% 100%;
    animation: none;
}

.business-main-map-board-degrid .business-town-life-actor--route .business-town-life-person {
    animation: none;
    transform: translateY(1px) scale(var(--life-route-scale, 0.86));
    filter: saturate(0.82) sepia(0.1) contrast(0.9) brightness(0.96);
}

.business-main-map-board-degrid .business-town-life-person:not(.business-town-life-person--image)::before,
.business-main-map-board-degrid .business-town-life-person:not(.business-town-life-person--image)::after {
    content: "";
    position: absolute;
    bottom: 0;
    width: 3px;
    height: 7px;
    border-radius: 999px;
    background: #3c2a1c;
}

.business-main-map-board-degrid .business-town-life-person:not(.business-town-life-person--image)::before {
    left: 5px;
    transform: rotate(9deg);
}

.business-main-map-board-degrid .business-town-life-person:not(.business-town-life-person--image)::after {
    right: 5px;
    transform: rotate(-10deg);
}

.business-main-map-board-degrid .business-town-life-person--image {
    transform-origin: 50% 100%;
}

.business-main-map-board-degrid .business-town-life-sprite {
    position: absolute;
    inset: -9% -18% 0;
    display: block;
    background-image: var(--life-sprite);
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size: contain;
    transform-origin: 50% 96%;
}

.business-main-map-board-degrid .business-town-life-actor--route .business-town-life-sprite {
    inset: 3% 6% 1%;
    overflow: hidden;
    background-image: none;
    animation: none;
}

.business-main-map-board-degrid .business-town-life-actor--route .business-town-life-sprite::before {
    content: "";
    position: absolute;
    inset: 0;
    width: 800%;
    background-image: var(--life-walk-sheet, var(--life-sprite));
    background-position: 0 100%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    animation: business-town-life-sprite-frame var(--life-step-duration, 1.35s) linear infinite;
    will-change: transform;
}

.business-main-map-board-degrid .business-town-life-actor--axis-vertical .business-town-life-sprite::before {
    animation:
        business-town-life-sprite-frame var(--life-step-duration, 1.35s) linear infinite,
        business-town-life-vertical-front-phase var(--life-duration, 34s) linear infinite;
    animation-delay: 0s, var(--life-delay, 0s);
}

.business-main-map-board-degrid .business-town-life-actor--axis-vertical .business-town-life-sprite::after {
    content: "";
    position: absolute;
    inset: 0;
    width: 800%;
    background-image: var(--life-walk-sheet-return, var(--life-walk-sheet, var(--life-sprite)));
    background-position: 0 100%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    opacity: 0;
    animation:
        business-town-life-sprite-frame var(--life-step-duration, 1.35s) linear infinite,
        business-town-life-vertical-return-phase var(--life-duration, 34s) linear infinite;
    animation-delay: 0s, var(--life-delay, 0s);
    will-change: transform, opacity;
}

.business-main-map-board-degrid .business-town-life-head,
.business-main-map-board-degrid .business-town-life-body,
.business-main-map-board-degrid .business-town-life-prop {
    position: absolute;
    display: block;
}

.business-main-map-board-degrid .business-town-life-head {
    left: 50%;
    top: 1px;
    width: 8px;
    height: 8px;
    border: 1px solid rgba(73, 43, 24, 0.26);
    border-radius: 50%;
    background:
        radial-gradient(circle at 58% 42%, rgba(255, 226, 176, 0.72) 0 12%, transparent 14%),
        linear-gradient(180deg, #e1aa72, var(--life-face));
    transform: translateX(-50%);
}

.business-main-map-board-degrid .business-town-life-head::before {
    content: "";
    position: absolute;
    left: 1px;
    right: 1px;
    top: -2px;
    height: 4px;
    border-radius: 999px 999px 4px 4px;
    background: #3b2a20;
}

.business-main-map-board-degrid .business-town-life-body {
    left: 50%;
    top: 9px;
    width: 11px;
    height: 12px;
    border: 1px solid rgba(55, 34, 20, 0.26);
    border-radius: 6px 6px 4px 4px;
    background:
        linear-gradient(90deg, rgba(255, 244, 203, 0.22), transparent 42%),
        linear-gradient(180deg, var(--life-cloth), var(--life-cloth-dark));
    transform: translateX(-50%);
}

.business-main-map-board-degrid .business-town-life-prop {
    right: -1px;
    top: 11px;
    width: 7px;
    height: 7px;
    border: 1px solid rgba(61, 38, 20, 0.22);
    border-radius: 2px;
    background: var(--life-accent);
    transform: rotate(-8deg);
}

.business-main-map-board-degrid .business-town-life-actor--merchant {
    --life-cloth: #b66e3a;
    --life-cloth-dark: #6f3d23;
    --life-accent: #d7b56a;
}

.business-main-map-board-degrid .business-town-life-actor--merchant .business-town-life-prop {
    right: -3px;
    top: 12px;
    width: 8px;
    height: 6px;
    border-radius: 3px;
    background:
        linear-gradient(90deg, rgba(79, 50, 25, 0.22), transparent 48%),
        #d6a04f;
}

.business-main-map-board-degrid .business-town-life-actor--porter {
    --life-cloth: #6f7b45;
    --life-cloth-dark: #3c4f2e;
    --life-accent: #8d623a;
}

.business-main-map-board-degrid .business-town-life-actor--porter .business-town-life-prop {
    left: -3px;
    right: auto;
    top: 7px;
    width: 15px;
    height: 6px;
    border-radius: 2px;
    background:
        linear-gradient(90deg, #674326 0 20%, transparent 20% 80%, #674326 80%),
        #a47643;
    transform: rotate(-11deg);
}

.business-main-map-board-degrid .business-town-life-actor--villager {
    --life-cloth: #6d8a62;
    --life-cloth-dark: #3d6042;
    --life-accent: #c1a05e;
}

.business-main-map-board-degrid .business-town-life-actor--scholar {
    --life-cloth: #6f86a7;
    --life-cloth-dark: #3d5576;
    --life-accent: #f0e4bd;
}

.business-main-map-board-degrid .business-town-life-actor--scholar .business-town-life-prop {
    right: -2px;
    top: 10px;
    width: 4px;
    height: 11px;
    border-radius: 999px;
    background: linear-gradient(180deg, #fff3ca, #cda967);
}

.business-main-map-board-degrid .business-town-life-actor--runner {
    --life-cloth: #a5483f;
    --life-cloth-dark: #672922;
    --life-accent: #222f37;
}

.business-main-map-board-degrid .business-town-life-actor--runner {
    animation-duration: calc(var(--life-duration, 22s) * 1.08);
}

.business-main-map-board-degrid .business-town-life-actor--boatman {
    --life-cloth: #587b80;
    --life-cloth-dark: #33535d;
    --life-accent: #5f4026;
}

.business-main-map-board-degrid .business-town-life-actor--boatman .business-town-life-prop {
    right: -3px;
    top: 2px;
    width: 2px;
    height: 22px;
    border: 0;
    border-radius: 999px;
    background: #5d3b20;
    transform: rotate(10deg);
}

.business-main-map-board-degrid .business-town-life-actor--child {
    --life-cloth: #b38b3f;
    --life-cloth-dark: #795323;
    --life-accent: #e3c06a;
    width: var(--life-width, clamp(24px, 2vw, 36px));
    height: var(--life-height, clamp(30px, 2.7vw, 48px));
}

.business-main-map-board-degrid .business-town-life-actor--child .business-town-life-prop {
    display: none;
}

.business-main-map-board-degrid .business-town-life-moment {
    position: absolute;
    left: var(--moment-left, 50%);
    top: var(--moment-top, 50%);
    z-index: var(--moment-z, 24);
    display: inline-flex;
    align-items: center;
    min-height: 16px;
    max-width: 54px;
    padding: 2px 6px;
    border: 1px solid rgba(96, 66, 30, 0.24);
    border-radius: 999px;
    color: rgba(68, 42, 20, 0.84);
    background: rgba(255, 240, 190, 0.74);
    box-shadow: 0 2px 7px rgba(58, 38, 18, 0.14);
    font-size: 0.62rem;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 0;
    white-space: nowrap;
    opacity: 0;
    transform: translate(-50%, -130%);
    animation: business-town-life-moment 14s ease-in-out infinite;
    animation-delay: var(--moment-delay, 0s);
}

.business-main-map-board-degrid .business-town-life-moment::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 100%;
    width: 5px;
    height: 5px;
    background: inherit;
    border-right: 1px solid rgba(96, 66, 30, 0.18);
    border-bottom: 1px solid rgba(96, 66, 30, 0.18);
    transform: translate(-50%, -2px) rotate(45deg);
}

.business-main-map-board-degrid .business-town-life-moment--delivery {
    color: rgba(45, 61, 34, 0.86);
    background: rgba(229, 244, 192, 0.72);
}

.business-main-map-board-degrid .business-town-life-moment--study {
    color: rgba(37, 58, 80, 0.86);
    background: rgba(219, 238, 252, 0.72);
}

.business-main-map-board-degrid .business-town-life-moment--rest {
    color: rgba(87, 51, 28, 0.86);
    background: rgba(250, 226, 180, 0.72);
}

.business-main-map-board-degrid .business-town-life-ambient {
    position: absolute;
    left: var(--ambient-left, 50%);
    top: var(--ambient-top, 50%);
    z-index: var(--ambient-z, 20);
    display: block;
    pointer-events: none;
}

.business-main-map-board-degrid .business-town-life-ambient--smoke {
    width: 24px;
    height: 30px;
    border-radius: 999px;
    background:
        radial-gradient(circle at 46% 70%, rgba(234, 225, 202, 0.28) 0 18%, transparent 42%),
        radial-gradient(circle at 58% 48%, rgba(234, 225, 202, 0.22) 0 16%, transparent 42%),
        radial-gradient(circle at 42% 28%, rgba(234, 225, 202, 0.16) 0 15%, transparent 40%);
    opacity: 0.72;
    transform: translate(-50%, -100%);
    animation: business-town-life-smoke 5.6s ease-in-out infinite;
}

.business-main-map-board-degrid .business-town-life-ambient--flag {
    width: 18px;
    height: 24px;
    border-left: 2px solid rgba(83, 53, 26, 0.66);
    transform: translate(-50%, -100%);
}

.business-main-map-board-degrid .business-town-life-ambient--flag::before {
    content: "";
    position: absolute;
    left: 1px;
    top: 2px;
    width: 14px;
    height: 9px;
    border-radius: 1px 6px 5px 1px;
    background: linear-gradient(90deg, #9c3f32, #d39a52);
    box-shadow: 0 1px 2px rgba(52, 28, 13, 0.18);
    transform-origin: 0 50%;
    animation: business-town-life-flag 1.8s ease-in-out infinite;
}

.business-main-map-board-degrid .business-town-life-ambient--ripple {
    width: 42px;
    height: 14px;
    border: 1px solid rgba(164, 219, 219, 0.38);
    border-radius: 50%;
    opacity: 0;
    transform: translate(-50%, -50%) rotate(-4deg);
    animation: business-town-life-ripple 4.8s ease-in-out infinite;
}

.business-main-map-board-degrid .business-town-life-ambient--lantern {
    width: 8px;
    height: 12px;
    border-radius: 50% 50% 42% 42%;
    background: radial-gradient(circle at 48% 40%, #ffe0a0 0 28%, #d75a35 60%, #8c2e24 100%);
    box-shadow: 0 0 9px rgba(255, 187, 84, 0.42);
    opacity: 0.86;
    transform: translate(-50%, -100%);
    animation: business-town-life-lantern 2.7s ease-in-out infinite;
}

@keyframes business-town-life-walk {
    0% {
        left: var(--life-p0-left, 0);
        top: var(--life-p0-top, 0);
        opacity: 0.9;
        transform: translate(-50%, -100%) scaleX(1);
    }
    16% {
        left: var(--life-p1-left, 50%);
        top: var(--life-p1-top, 50%);
        opacity: 0.9;
        transform: translate(-50%, -100%) scaleX(1);
    }
    33% {
        left: var(--life-p2-left, 50%);
        top: var(--life-p2-top, 50%);
        opacity: 0.9;
        transform: translate(-50%, -100%) scaleX(1);
    }
    49% {
        left: var(--life-p3-left, 50%);
        top: var(--life-p3-top, 50%);
        opacity: 0.9;
        transform: translate(-50%, -100%) scaleX(1);
    }
    50% {
        left: var(--life-p3-left, 50%);
        top: var(--life-p3-top, 50%);
        opacity: 0.9;
        transform: translate(-50%, -100%) scaleX(var(--life-return-scale-x, -1));
    }
    66% {
        left: var(--life-p2-left, 50%);
        top: var(--life-p2-top, 50%);
        opacity: 0.9;
        transform: translate(-50%, -100%) scaleX(var(--life-return-scale-x, -1));
    }
    83% {
        left: var(--life-p1-left, 50%);
        top: var(--life-p1-top, 50%);
        opacity: 0.9;
        transform: translate(-50%, -100%) scaleX(var(--life-return-scale-x, -1));
    }
    100% {
        left: var(--life-p0-left, 0);
        top: var(--life-p0-top, 0);
        opacity: 0.9;
        transform: translate(-50%, -100%) scaleX(var(--life-return-scale-x, -1));
    }
}

@keyframes business-town-life-step {
    0% {
        transform: translate(-1px, 0) rotate(-1.4deg);
    }
    16.66% {
        transform: translate(-0.5px, -1.6px) rotate(-0.6deg);
    }
    33.33% {
        transform: translate(0, 0) rotate(0deg);
    }
    50% {
        transform: translate(1px, -1.7px) rotate(1.5deg);
    }
    66.66% {
        transform: translate(0.4px, 0) rotate(0.4deg);
    }
    83.33% {
        transform: translate(-0.5px, -0.9px) rotate(-0.8deg);
    }
    100% {
        transform: translate(-1px, 0) rotate(-1.4deg);
    }
}

@keyframes business-town-life-vertical-front-phase {
    0%,
    49.9% {
        opacity: 1;
    }
    50%,
    100% {
        opacity: 0;
    }
}

@keyframes business-town-life-vertical-return-phase {
    0%,
    49.9% {
        opacity: 0;
    }
    50%,
    100% {
        opacity: 1;
    }
}

@keyframes business-town-life-sprite-frame {
    0%,
    12.49% {
        transform: translateX(0);
    }
    12.5%,
    24.99% {
        transform: translateX(-12.5%);
    }
    25%,
    37.49% {
        transform: translateX(-25%);
    }
    37.5%,
    49.99% {
        transform: translateX(-37.5%);
    }
    50%,
    62.49% {
        transform: translateX(-50%);
    }
    62.5%,
    74.99% {
        transform: translateX(-62.5%);
    }
    75%,
    87.49% {
        transform: translateX(-75%);
    }
    87.5%,
    100% {
        transform: translateX(-87.5%);
    }
}

@keyframes business-town-life-shadow-frame {
    0%,
    33.33%,
    66.66%,
    100% {
        width: 58%;
        opacity: 0.48;
        transform: translateX(-50%) scaleX(1);
    }
    16.66%,
    50%,
    83.33% {
        width: 46%;
        opacity: 0.28;
        transform: translateX(-50%) scaleX(0.82);
    }
}

@keyframes business-town-life-moment {
    0%,
    14%,
    100% {
        opacity: 0;
        transform: translate(-50%, -120%) scale(0.92);
    }
    22%,
    38% {
        opacity: 0.88;
        transform: translate(-50%, -140%) scale(1);
    }
    48% {
        opacity: 0;
        transform: translate(-50%, -156%) scale(0.96);
    }
}

@keyframes business-town-life-smoke {
    0% {
        opacity: 0;
        transform: translate(-50%, -86%) scale(0.78);
    }
    35% {
        opacity: 0.64;
    }
    100% {
        opacity: 0;
        transform: translate(-48%, -124%) scale(1.22);
    }
}

@keyframes business-town-life-flag {
    0%,
    100% {
        transform: skewY(-4deg) scaleX(0.94);
    }
    50% {
        transform: skewY(8deg) scaleX(1.04);
    }
}

@keyframes business-town-life-ripple {
    0% {
        opacity: 0;
        transform: translate(-50%, -50%) rotate(-4deg) scale(0.62);
    }
    28% {
        opacity: 0.58;
    }
    100% {
        opacity: 0;
        transform: translate(-50%, -50%) rotate(-4deg) scale(1.35);
    }
}

@keyframes business-town-life-lantern {
    0%,
    100% {
        filter: brightness(0.94);
        transform: translate(-50%, -100%) rotate(-2deg);
    }
    50% {
        filter: brightness(1.18);
        transform: translate(-50%, -101%) rotate(2deg);
    }
}

@media (prefers-reduced-motion: reduce) {
    .business-main-map-board-degrid .business-town-life-actor,
    .business-main-map-board-degrid .business-town-life-actor::before,
    .business-main-map-board-degrid .business-town-life-person,
    .business-main-map-board-degrid .business-town-life-sprite,
    .business-main-map-board-degrid .business-town-life-moment,
    .business-main-map-board-degrid .business-town-life-ambient,
    .business-main-map-board-degrid .business-town-life-ambient::before {
        animation: none !important;
    }

    .business-main-map-board-degrid .business-town-life-actor {
        opacity: 0.72;
    }

    .business-main-map-board-degrid .business-town-life-moment {
        opacity: 0.68;
    }

    .business-main-map-board-degrid .business-town-life-ambient--ripple {
        opacity: 0.36;
    }
}

.business-main-map-board-degrid .business-main-map-city-decoration {
    --decor-image: none;
    position: absolute;
    left: var(--decor-left, 0);
    top: var(--decor-top, 0);
    width: var(--decor-width, 18%);
    height: var(--decor-height, 14%);
    display: block;
    padding: 0;
    border: 0;
    border-radius: 8px;
    background-image: var(--decor-image);
    background-color: transparent;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    opacity: 1;
    transform: rotate(var(--decor-rotate, 0deg)) scale(var(--decor-scale, 1));
    transform-origin: center;
    filter: saturate(1) contrast(1) brightness(1);
    z-index: var(--decor-z, 20);
    pointer-events: none;
}

.business-main-map-board-degrid.business-city-decor-editor-active .business-main-map-city-decorations {
    z-index: 5;
    pointer-events: auto;
}

.business-main-map-board-degrid.business-city-decor-editor-active .business-main-map-ground-overlays {
    z-index: 3;
    pointer-events: auto;
}

.business-main-map-board-degrid.business-city-decor-editor-active .business-main-map-street-layer,
.business-main-map-board-degrid.business-city-decor-editor-active .business-main-map-ground-overlay {
    pointer-events: none;
}

.business-main-map-board-degrid.business-city-decor-editor-active .business-grid-cells {
    z-index: 4;
    padding: 0;
    pointer-events: none;
}

.business-main-map-board-degrid.business-city-decor-editor-active .business-main-map-cell {
    pointer-events: none;
}

.business-main-map-board-degrid.business-city-decor-editor-active .business-main-map-cell:not(.selected):not(:hover):not(:focus-visible) .business-grid-tile-art,
.business-main-map-board-degrid.business-city-decor-editor-active .business-main-map-cell:not(.selected):not(:hover):not(:focus-visible) span,
.business-main-map-board-degrid.business-city-decor-editor-active .business-main-map-cell:not(.selected):not(:hover):not(:focus-visible) strong,
.business-main-map-board-degrid.business-city-decor-editor-active .business-main-map-cell:not(.selected):not(:hover):not(:focus-visible) em,
.business-main-map-board-degrid.business-city-decor-editor-active .business-main-map-cell:not(.selected):not(:hover):not(:focus-visible) .business-grid-object-mark,
.business-main-map-board-degrid.business-city-decor-editor-active .business-main-map-cell:not(.selected):not(:hover):not(:focus-visible) .business-grid-object-signal,
.business-main-map-board-degrid.business-city-decor-editor-active .business-main-map-cell:not(.selected):not(:hover):not(:focus-visible) .business-grid-object-note,
.business-main-map-board-degrid.business-city-decor-editor-active .business-main-map-cell:not(.selected):not(:hover):not(:focus-visible) .business-grid-status-bubbles {
    opacity: 1;
}

.business-main-map-board-degrid.business-city-decor-editor-active .business-main-map-city-decoration {
    --decor-alpha: 1;
    pointer-events: auto;
    cursor: grab;
    outline: none;
    filter: saturate(1) contrast(1) brightness(1.02);
}

.business-main-map-board-degrid.business-city-decor-editor-active .business-main-map-city-decoration:active {
    cursor: grabbing;
}

.business-main-map-board-degrid.business-city-decor-editor-active .business-main-map-city-decoration:hover,
.business-main-map-board-degrid.business-city-decor-editor-active .business-main-map-city-decoration:focus-visible {
    outline: 1px dashed rgba(255, 244, 199, 0.42);
    outline-offset: 2px;
}

.business-main-map-board-degrid.business-city-decor-editor-active .business-main-map-city-decoration.selected {
    outline: 2px solid rgba(255, 189, 82, 0.95);
    box-shadow: 0 0 0 4px rgba(10, 18, 22, 0.5), 0 10px 24px rgba(0, 0, 0, 0.36);
}

.business-main-map-board-degrid.business-city-decor-editor-active .business-main-map-city-decoration::after {
    content: attr(aria-label);
    position: absolute;
    left: 50%;
    bottom: calc(100% + 4px);
    transform: translateX(-50%);
    max-width: 96px;
    padding: 3px 6px;
    border-radius: 6px;
    color: #10151a;
    background: rgba(255, 218, 133, 0.94);
    font-size: 0.62rem;
    font-weight: 900;
    line-height: 1.1;
    white-space: nowrap;
    opacity: 0;
    pointer-events: none;
}

.business-main-map-board-degrid.business-city-decor-editor-active .business-main-map-city-decoration:hover::after,
.business-main-map-board-degrid.business-city-decor-editor-active .business-main-map-city-decoration.selected::after {
    opacity: 1;
}

.business-main-map-board-degrid .business-grid-cells {
    display: block;
    position: relative;
    z-index: 6;
    padding: 0;
}

.business-main-map-board-degrid .business-main-map-cell {
    position: absolute;
    left: var(--map-layout-left, 0);
    top: var(--map-layout-top, 0);
    width: var(--map-layout-width, calc(100% / var(--cols)));
    height: var(--map-layout-height, calc(100% / var(--rows)));
    min-height: 0;
}

.business-main-map-board-degrid.business-map-layout-editor-active .business-grid-cells {
    display: block;
    position: relative;
    z-index: 6;
    padding: 0;
    touch-action: none;
}

.business-main-map-board-degrid.business-city-decor-editor-active .business-grid-cells {
    display: block;
    position: relative;
}

.business-main-map-board-degrid.business-map-layout-editor-active .business-main-map-cell,
.business-main-map-board-degrid.business-city-decor-editor-active .business-main-map-cell {
    position: absolute;
    left: var(--map-layout-left, 0);
    top: var(--map-layout-top, 0);
    width: var(--map-layout-width, calc(100% / var(--cols)));
    height: var(--map-layout-height, calc(100% / var(--rows)));
    min-height: 0;
}

.business-main-map-board-degrid.business-map-layout-editor-active {
    cursor: copy;
}

.business-main-map-board-degrid.business-map-layout-editor-active .business-main-map-street-layer,
.business-main-map-board-degrid.business-map-layout-editor-active .business-main-map-ground-overlay {
    pointer-events: none;
}

.business-main-map-board-degrid.business-map-layout-editor-active .business-main-map-ground-overlays {
    z-index: 4;
    opacity: 1;
    pointer-events: none;
}

.business-main-map-board-degrid.business-map-layout-editor-active .business-main-map-city-decorations {
    z-index: 4;
    opacity: 1;
    pointer-events: none;
}

.business-main-map-board-degrid.business-map-layout-editor-active .business-main-map-city-decoration {
    pointer-events: none;
    filter: saturate(1) contrast(1) brightness(1);
}

.business-main-map-board-degrid.business-map-layout-editor-active .business-main-map-cell {
    cursor: grab;
    border-color: rgba(255, 229, 169, 0.12);
    background: transparent;
    box-shadow: none;
}

.business-main-map-board-degrid.business-map-layout-editor-active .business-map-layout-tools {
    position: absolute;
    top: 2px;
    right: 2px;
    z-index: 520;
    display: flex;
    align-items: center;
    gap: 4px;
    opacity: 0.94;
    pointer-events: auto;
}

.business-main-map-board-degrid.business-map-layout-editor-active .business-map-layout-scale-down,
.business-main-map-board-degrid.business-map-layout-editor-active .business-map-layout-scale-up,
.business-main-map-board-degrid.business-map-layout-editor-active .business-map-layout-rotate,
.business-main-map-board-degrid.business-map-layout-editor-active .business-map-layout-remove {
    display: grid;
    place-items: center;
    width: 21px;
    height: 21px;
    border: 1px solid rgba(255, 236, 193, 0.9);
    border-radius: 999px;
    color: #3b160f;
    background: linear-gradient(135deg, #ffe8ad, #f07a54);
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.34);
    font-size: 0.9rem;
    font-weight: 900;
    line-height: 1;
    opacity: 0.92;
    cursor: pointer;
    pointer-events: auto;
}

.business-main-map-board-degrid.business-map-layout-editor-active .business-map-layout-scale-down,
.business-main-map-board-degrid.business-map-layout-editor-active .business-map-layout-scale-up {
    color: #11232a;
    background: linear-gradient(135deg, #d5f4ff, #7bc2d1);
    font-size: 0.84rem;
}

.business-main-map-board-degrid.business-map-layout-editor-active .business-map-layout-rotate {
    color: #10251f;
    background: linear-gradient(135deg, #e9f7cb, #8ed8a6);
    font-size: 0.68rem;
}

.business-main-map-board-degrid.business-map-layout-editor-active .business-map-layout-remove:hover,
.business-main-map-board-degrid.business-map-layout-editor-active .business-map-layout-remove:focus-visible,
.business-main-map-board-degrid.business-map-layout-editor-active .business-map-layout-scale-down:hover,
.business-main-map-board-degrid.business-map-layout-editor-active .business-map-layout-scale-down:focus-visible,
.business-main-map-board-degrid.business-map-layout-editor-active .business-map-layout-scale-up:hover,
.business-main-map-board-degrid.business-map-layout-editor-active .business-map-layout-scale-up:focus-visible,
.business-main-map-board-degrid.business-map-layout-editor-active .business-map-layout-rotate:hover,
.business-main-map-board-degrid.business-map-layout-editor-active .business-map-layout-rotate:focus-visible {
    opacity: 1;
    transform: scale(1.06);
}

.business-main-map-board-degrid.business-map-layout-editor-active .business-main-map-cell:active {
    cursor: grabbing;
}

.business-main-map-board-degrid.business-map-layout-editor-active .business-main-map-cell .business-grid-tile-art,
.business-main-map-board-degrid.business-map-layout-editor-active .business-main-map-cell .business-grid-building-art,
.business-main-map-board-degrid.business-map-layout-editor-active .business-main-map-cell .business-grid-decoration-art {
    opacity: 1;
}

.business-main-map-board-degrid.business-map-layout-editor-active .business-main-map-cell > span:not(.business-map-layout-tools),
.business-main-map-board-degrid.business-map-layout-editor-active .business-main-map-cell > strong,
.business-main-map-board-degrid.business-map-layout-editor-active .business-main-map-cell > em,
.business-main-map-board-degrid.business-map-layout-editor-active .business-main-map-cell > .business-grid-object-mark,
.business-main-map-board-degrid.business-map-layout-editor-active .business-main-map-cell > .business-grid-object-signal,
.business-main-map-board-degrid.business-map-layout-editor-active .business-main-map-cell > .business-grid-object-note,
.business-main-map-board-degrid.business-map-layout-editor-active .business-main-map-cell > .business-grid-status-bubbles {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.business-main-map-board-degrid.business-map-layout-editor-active .business-main-map-cell.selected {
    z-index: 360;
    border-color: rgba(255, 190, 91, 0.95);
    background:
        linear-gradient(135deg, rgba(255, 203, 115, 0.12), rgba(47, 98, 88, 0.12)),
        rgba(18, 24, 29, 0.28);
    box-shadow:
        inset 0 0 0 2px rgba(255, 196, 92, 0.82),
        0 0 0 4px rgba(8, 13, 16, 0.48),
        0 16px 28px rgba(0, 0, 0, 0.3);
}

.business-main-map-board-degrid.business-map-layout-editor-active .business-main-map-cell:hover,
.business-main-map-board-degrid.business-map-layout-editor-active .business-main-map-cell:focus-visible,
.business-main-map-board-degrid.business-map-layout-editor-active .business-main-map-cell:focus-within {
    z-index: 380;
}

.business-main-map-board-degrid .business-main-map-city-decoration--water {
    --decor-z: 10;
    filter: saturate(1.06) contrast(1) brightness(1.02);
}

.business-main-map-board-degrid .business-main-map-city-decoration--street {
    --decor-z: 4;
    mix-blend-mode: normal;
    filter: saturate(1) contrast(1) brightness(1);
}

.business-main-map-board-degrid .business-main-map-city-decoration--green,
.business-main-map-board-degrid .business-main-map-city-decoration--market {
    --decor-z: 28;
    filter: saturate(1.04) contrast(1) brightness(1);
}

.business-main-map-board-degrid .business-main-map-city-decoration--property {
    --decor-z: 32;
    filter: saturate(1.02) contrast(1.02) brightness(1) drop-shadow(0 8px 8px rgba(17, 12, 7, 0.18));
}

.business-main-map-board-degrid .business-main-map-city-decoration--ground {
    --decor-z: 2;
    mix-blend-mode: normal;
    filter: saturate(1) contrast(1) brightness(1);
}

.business-main-map-board-degrid .business-main-map-city-decoration--nature {
    --decor-z: 36;
    filter: saturate(1.06) contrast(1.02) brightness(1) drop-shadow(0 7px 7px rgba(12, 26, 11, 0.14));
}

.business-main-map-board-degrid .business-main-map-city-decoration--river-bend-a {
    --decor-image: url("../images/business/city/decorations/business-city-decor-river-bend-a-v1.png");
    --decor-left: -1%;
    --decor-top: 2%;
    --decor-width: 26%;
    --decor-height: 23%;
    --decor-opacity: 1;
    --decor-rotate: -5deg;
}

.business-main-map-board-degrid .business-main-map-city-decoration--small-lake-a {
    --decor-image: url("../images/business/city/decorations/business-city-decor-small-lake-a-v1.png");
    --decor-left: 77%;
    --decor-top: 59%;
    --decor-width: 18%;
    --decor-height: 17%;
    --decor-opacity: 1;
    --decor-rotate: 4deg;
}

.business-main-map-board-degrid .business-main-map-city-decoration--canal-a {
    --decor-image: url("../images/business/city/decorations/business-city-decor-canal-a-v1.png");
    --decor-left: 67%;
    --decor-top: 27%;
    --decor-width: 26%;
    --decor-height: 25%;
    --decor-opacity: 1;
    --decor-rotate: 7deg;
}

.business-main-map-board-degrid .business-main-map-city-decoration--wood-bridge-a {
    --decor-image: url("../images/business/city/decorations/business-city-decor-wood-bridge-a-v1.png");
    --decor-left: 64%;
    --decor-top: 42%;
    --decor-width: 18%;
    --decor-height: 15%;
    --decor-opacity: 1;
    --decor-rotate: -4deg;
}

.business-main-map-board-degrid .business-main-map-city-decoration--stone-bridge-arch-a {
    --decor-image: url("../images/business/city/decorations/business-city-decor-stone-bridge-arch-a-v1.png?v=20260517-stone-arch-bridge-v1");
    --decor-left: 52%;
    --decor-top: 34%;
    --decor-width: 42%;
    --decor-height: 34%;
    --decor-opacity: 1;
    --decor-rotate: 0deg;
}

.business-main-map-board-degrid .business-main-map-city-decoration--stone-bridge-vertical-a {
    --decor-image: url("../images/business/city/decorations/business-city-decor-stone-bridge-vertical-a-v1.png?v=20260517-stone-bridge-vertical-v1");
    --decor-left: 48%;
    --decor-top: 26%;
    --decor-width: 24%;
    --decor-height: 42%;
    --decor-opacity: 1;
    --decor-rotate: -4deg;
}

.business-main-map-board-degrid .business-main-map-city-decoration--dock-a {
    --decor-image: url("../images/business/city/decorations/business-city-decor-dock-a-v1.png");
    --decor-left: 82%;
    --decor-top: 7%;
    --decor-width: 15%;
    --decor-height: 14%;
    --decor-opacity: 1;
    --decor-rotate: 5deg;
}

.business-main-map-board-degrid .business-main-map-city-decoration--well-stone-a {
    --decor-image: url("../images/business/city/decorations/business-city-decor-well-stone-a-v1.png");
    --decor-left: 8%;
    --decor-top: 33%;
    --decor-width: 15%;
    --decor-height: 13%;
    --decor-opacity: 1;
    --decor-rotate: -2deg;
}

.business-main-map-board-degrid .business-main-map-city-decoration--tree-courtyard-a {
    --decor-image: url("../images/business/city/decorations/business-city-decor-tree-courtyard-a-v1.png");
    --decor-left: 1%;
    --decor-top: 67%;
    --decor-width: 23%;
    --decor-height: 20%;
    --decor-opacity: 1;
    --decor-rotate: 4deg;
}

.business-main-map-board-degrid .business-main-map-city-decoration--market-corner-a {
    --decor-image: url("../images/business/city/decorations/business-city-decor-market-corner-a-v1.png");
    --decor-left: 35%;
    --decor-top: 3%;
    --decor-width: 18%;
    --decor-height: 16%;
    --decor-opacity: 1;
    --decor-rotate: -2deg;
}

.business-main-map-board-degrid .business-main-map-city-decoration--stone-path-a {
    --decor-image: url("../images/business/city/decorations/business-city-decor-stone-path-a-v1.png");
    --decor-left: 20%;
    --decor-top: 47%;
    --decor-width: 28%;
    --decor-height: 21%;
    --decor-opacity: 1;
    --decor-rotate: 6deg;
}

.business-main-map-board-degrid .business-main-map-city-decoration--stone-road-long-a {
    --decor-image: url("../images/business/city/decorations/business-city-decor-stone-road-long-a-v1.png?v=20260523-stone-road-long-v1");
    --decor-left: 20%;
    --decor-top: 43%;
    --decor-width: 62%;
    --decor-height: 8%;
    --decor-opacity: 1;
    --decor-rotate: 0deg;
}

.business-main-map-board-degrid .business-main-map-city-decoration--stone-road-vertical-a {
    --decor-image: url("../images/business/city/decorations/business-city-decor-stone-road-vertical-a-v1.png?v=20260523-stone-road-vertical-v1");
    --decor-left: 47%;
    --decor-top: 20%;
    --decor-width: 8%;
    --decor-height: 62%;
    --decor-opacity: 1;
    --decor-rotate: 0deg;
}

.business-main-map-board-degrid .business-main-map-city-decoration--lake-steps-a {
    --decor-image: url("../images/business/city/decorations/business-city-decor-lake-steps-a-v1.png");
    --decor-left: 72%;
    --decor-top: 74%;
    --decor-width: 22%;
    --decor-height: 18%;
    --decor-opacity: 1;
    --decor-rotate: -4deg;
}

.business-main-map-board-degrid .business-main-map-city-decoration--river-through-city-a {
    --decor-image: url("../images/business/city/river/business-city-river-through-a-v1.png?v=20260517-image2-river-v1");
    --decor-left: -8%;
    --decor-top: 36%;
    --decor-width: 210%;
    --decor-height: 39%;
    --decor-opacity: 1;
    --decor-rotate: -5deg;
}

.business-main-map-board-degrid .business-main-map-city-decoration--river-through-city-b {
    --decor-image: url("../images/business/city/river/business-city-river-through-b-v1.png?v=20260517-image2-river-v1");
    --decor-left: -6%;
    --decor-top: 48%;
    --decor-width: 190%;
    --decor-height: 32%;
    --decor-opacity: 1;
    --decor-rotate: 3deg;
}

.business-main-map-board-degrid .business-main-map-city-decoration--river-vertical-a {
    --decor-image: url("../images/business/city/river/business-city-river-vertical-a-v1.png?v=20260517-image2-river-v1");
    --decor-left: 44%;
    --decor-top: -6%;
    --decor-width: 44%;
    --decor-height: 150%;
    --decor-opacity: 1;
    --decor-rotate: 0deg;
}

.business-main-map-board-degrid .business-main-map-city-decoration--river-bend-b {
    --decor-image: url("../images/business/city/river/business-city-river-bend-b-v1.png?v=20260517-image2-river-v1");
    --decor-left: 2%;
    --decor-top: 19%;
    --decor-width: 92%;
    --decor-height: 70%;
    --decor-opacity: 1;
    --decor-rotate: -6deg;
}

.business-main-map-board-degrid .business-main-map-city-decoration--river-lake-mouth-a {
    --decor-image: url("../images/business/city/river/business-city-river-lake-mouth-a-v1.png?v=20260517-image2-river-v1");
    --decor-left: 54%;
    --decor-top: 42%;
    --decor-width: 96%;
    --decor-height: 58%;
    --decor-opacity: 1;
    --decor-rotate: 2deg;
}

.business-main-map-board-degrid .business-main-map-city-decoration--river-reeds-bank-long-a {
    --decor-image: url("../images/business/city/river/business-city-river-reeds-bank-long-a-v1.png?v=20260517-image2-river-v1");
    --decor-left: -5%;
    --decor-top: 64%;
    --decor-width: 180%;
    --decor-height: 26%;
    --decor-opacity: 1;
    --decor-rotate: 0deg;
}

.business-main-map-board-degrid .business-main-map-city-decoration--river-through-city-a,
.business-main-map-board-degrid .business-main-map-city-decoration--river-through-city-b,
.business-main-map-board-degrid .business-main-map-city-decoration--river-vertical-a,
.business-main-map-board-degrid .business-main-map-city-decoration--river-bend-b,
.business-main-map-board-degrid .business-main-map-city-decoration--river-lake-mouth-a,
.business-main-map-board-degrid .business-main-map-city-decoration--river-reeds-bank-long-a {
    border-radius: 0;
    background-size: 100% 100%;
    filter: saturate(1.03) contrast(1.02) brightness(1.02);
}

.business-main-map-board-degrid.business-city-decor-editor-active .business-main-map-city-decoration--river-through-city-a.selected,
.business-main-map-board-degrid.business-city-decor-editor-active .business-main-map-city-decoration--river-through-city-b.selected,
.business-main-map-board-degrid.business-city-decor-editor-active .business-main-map-city-decoration--river-vertical-a.selected,
.business-main-map-board-degrid.business-city-decor-editor-active .business-main-map-city-decoration--river-bend-b.selected,
.business-main-map-board-degrid.business-city-decor-editor-active .business-main-map-city-decoration--river-lake-mouth-a.selected,
.business-main-map-board-degrid.business-city-decor-editor-active .business-main-map-city-decoration--river-reeds-bank-long-a.selected {
    outline-color: rgba(126, 226, 238, 0.36);
    box-shadow: none;
}

.business-main-map-board-degrid .business-main-map-city-decoration--large-old-tree-a {
    --decor-image: url("../images/business/city/nature/business-natural-large-old-tree-a-v1.png?v=20260517-large-plant-v1");
    --decor-left: 12%;
    --decor-top: 8%;
    --decor-width: 34%;
    --decor-height: 31%;
    --decor-opacity: 1;
    --decor-rotate: -2deg;
}

.business-main-map-board-degrid .business-main-map-city-decoration--round-canopy-tree-a {
    --decor-image: url("../images/business/city/nature/business-natural-round-canopy-tree-a-v1.png?v=20260517-large-plant-v1");
    --decor-left: 38%;
    --decor-top: 9%;
    --decor-width: 31%;
    --decor-height: 28%;
    --decor-opacity: 1;
    --decor-rotate: 2deg;
}

.business-main-map-board-degrid .business-main-map-city-decoration--willow-grove-a {
    --decor-image: url("../images/business/city/nature/business-natural-willow-grove-a-v1.png?v=20260517-large-plant-v1");
    --decor-left: 68%;
    --decor-top: 8%;
    --decor-width: 30%;
    --decor-height: 30%;
    --decor-opacity: 1;
    --decor-rotate: -1deg;
}

.business-main-map-board-degrid .business-main-map-city-decoration--bamboo-grove-a {
    --decor-image: url("../images/business/city/nature/business-natural-bamboo-grove-a-v1.png?v=20260517-large-plant-v1");
    --decor-left: 84%;
    --decor-top: 12%;
    --decor-width: 24%;
    --decor-height: 32%;
    --decor-opacity: 1;
    --decor-rotate: 2deg;
}

.business-main-map-board-degrid .business-main-map-city-decoration--reed-bank-wide-a {
    --decor-image: url("../images/business/city/nature/business-natural-reed-bank-wide-a-v1.png?v=20260517-large-plant-v1");
    --decor-left: 4%;
    --decor-top: 44%;
    --decor-width: 48%;
    --decor-height: 14%;
    --decor-opacity: 1;
    --decor-rotate: -3deg;
}

.business-main-map-board-degrid .business-main-map-city-decoration--hedge-green-belt-a {
    --decor-image: url("../images/business/city/nature/business-natural-hedge-green-belt-a-v1.png?v=20260517-large-plant-v1");
    --decor-left: 36%;
    --decor-top: 47%;
    --decor-width: 44%;
    --decor-height: 13%;
    --decor-opacity: 1;
    --decor-rotate: 1deg;
}

.business-main-map-board-degrid .business-main-map-city-decoration--flower-tree-clump-a {
    --decor-image: url("../images/business/city/nature/business-natural-flower-tree-clump-a-v1.png?v=20260517-large-plant-v1");
    --decor-left: 62%;
    --decor-top: 42%;
    --decor-width: 32%;
    --decor-height: 20%;
    --decor-opacity: 1;
    --decor-rotate: -2deg;
}

.business-main-map-board-degrid .business-main-map-city-decoration--wildflower-meadow-a {
    --decor-image: url("../images/business/city/nature/business-natural-wildflower-meadow-a-v1.png?v=20260517-large-plant-v1");
    --decor-left: 8%;
    --decor-top: 70%;
    --decor-width: 28%;
    --decor-height: 14%;
    --decor-opacity: 1;
    --decor-rotate: 3deg;
}

.business-main-map-board-degrid .business-main-map-city-decoration--shade-tree-mound-a {
    --decor-image: url("../images/business/city/nature/business-natural-shade-tree-mound-a-v1.png?v=20260517-large-plant-v1");
    --decor-left: 32%;
    --decor-top: 67%;
    --decor-width: 24%;
    --decor-height: 22%;
    --decor-opacity: 1;
    --decor-rotate: -2deg;
}

.business-main-map-board-degrid .business-main-map-city-decoration--rocky-grass-patch-a {
    --decor-image: url("../images/business/city/nature/business-natural-rocky-grass-patch-a-v1.png?v=20260517-large-plant-v1");
    --decor-left: 53%;
    --decor-top: 69%;
    --decor-width: 24%;
    --decor-height: 18%;
    --decor-opacity: 1;
    --decor-rotate: 2deg;
}

.business-main-map-board-degrid .business-main-map-city-decoration--woodland-grove-a {
    --decor-image: url("../images/business/city/nature/business-natural-woodland-grove-a-v1.png?v=20260517-large-plant-v1");
    --decor-left: 71%;
    --decor-top: 68%;
    --decor-width: 28%;
    --decor-height: 19%;
    --decor-opacity: 1;
    --decor-rotate: -1deg;
}

.business-main-map-board-degrid .business-main-map-city-decoration--lotus-reed-clump-a {
    --decor-image: url("../images/business/city/nature/business-natural-lotus-reed-clump-a-v1.png?v=20260517-large-plant-v1");
    --decor-left: 86%;
    --decor-top: 70%;
    --decor-width: 24%;
    --decor-height: 16%;
    --decor-opacity: 1;
    --decor-rotate: 3deg;
}

.business-main-map-board-degrid .business-main-map-ground-overlay {
    position: absolute;
    left: var(--overlay-left, 0);
    top: var(--overlay-top, 0);
    width: var(--overlay-width, 18%);
    height: var(--overlay-height, 18%);
    background-image: var(--overlay-image);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    opacity: calc(var(--overlay-opacity, 0.2) * var(--overlay-alpha, 1));
    border-radius: 999px;
    filter: saturate(0.7) contrast(0.74) brightness(0.99) blur(0.35px);
    mix-blend-mode: multiply;
    transform: rotate(var(--overlay-rotate, 0deg)) scale(var(--overlay-scale, 1));
    transform-origin: center;
    -webkit-mask-image: radial-gradient(ellipse at center, #000 18%, rgba(0, 0, 0, 0.52) 38%, transparent 62%);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-image: radial-gradient(ellipse at center, #000 18%, rgba(0, 0, 0, 0.52) 38%, transparent 62%);
    mask-repeat: no-repeat;
    mask-size: 100% 100%;
}

.business-main-map-board-degrid .business-main-map-ground-overlay--loess-patch {
    --overlay-image: url("../images/business/city/overlays/business-map-overlay-loess-patch-v1.png");
}

.business-main-map-board-degrid .business-main-map-ground-overlay--farm-ridges {
    --overlay-image: url("../images/business/city/overlays/business-map-overlay-farm-ridges-v1.png");
}

.business-main-map-board-degrid .business-main-map-ground-overlay--gravel-road-corner {
    --overlay-image: url("../images/business/city/overlays/business-map-overlay-gravel-road-corner-v1.png");
}

.business-main-map-board-degrid .business-main-map-ground-overlay--dirt-road-straight {
    --overlay-image: url("../images/business/city/overlays/business-map-overlay-dirt-road-straight-v1.png");
}

.business-main-map-board-degrid .business-main-map-ground-overlay--riverbank-posts {
    --overlay-image: url("../images/business/city/overlays/business-map-overlay-riverbank-posts-v1.png");
}

.business-main-map-board-degrid .business-main-map-ground-overlay--loess-a {
    --overlay-left: 2%;
    --overlay-top: 50%;
    --overlay-width: 30%;
    --overlay-height: 34%;
    --overlay-opacity: 0.14;
    --overlay-rotate: -7deg;
}

.business-main-map-board-degrid .business-main-map-ground-overlay--farm-a {
    --overlay-left: 10%;
    --overlay-top: 21%;
    --overlay-width: 26%;
    --overlay-height: 29%;
    --overlay-opacity: 0.13;
    --overlay-rotate: 5deg;
}

.business-main-map-board-degrid .business-main-map-ground-overlay--road-a {
    --overlay-left: 31%;
    --overlay-top: 41%;
    --overlay-width: 34%;
    --overlay-height: 22%;
    --overlay-opacity: 0.11;
    --overlay-rotate: 6deg;
}

.business-main-map-board-degrid .business-main-map-ground-overlay--corner-a {
    --overlay-left: 58%;
    --overlay-top: 16%;
    --overlay-width: 27%;
    --overlay-height: 28%;
    --overlay-opacity: 0.1;
    --overlay-rotate: 2deg;
}

.business-main-map-board-degrid .business-main-map-ground-overlay--river-a {
    --overlay-left: 75%;
    --overlay-top: 58%;
    --overlay-width: 19%;
    --overlay-height: 27%;
    --overlay-opacity: 0.08;
    --overlay-rotate: -6deg;
}

.business-main-map-board-degrid .business-main-map-ground-overlay--loess-b {
    --overlay-left: 36%;
    --overlay-top: 8%;
    --overlay-width: 24%;
    --overlay-height: 26%;
    --overlay-opacity: 0.09;
    --overlay-rotate: 11deg;
}

.business-main-map-board-degrid .business-main-map-ground-overlay--farm-b {
    --overlay-left: 44%;
    --overlay-top: 67%;
    --overlay-width: 28%;
    --overlay-height: 25%;
    --overlay-opacity: 0.09;
    --overlay-rotate: -10deg;
}

.business-main-map-board-degrid .business-main-map-ground-overlay--road-b {
    --overlay-left: 54%;
    --overlay-top: 50%;
    --overlay-width: 31%;
    --overlay-height: 20%;
    --overlay-opacity: 0.085;
    --overlay-rotate: -8deg;
}

.business-main-map-board-degrid .business-main-map-ground-overlay--corner-b {
    --overlay-left: 14%;
    --overlay-top: 68%;
    --overlay-width: 24%;
    --overlay-height: 25%;
    --overlay-opacity: 0.08;
    --overlay-rotate: 18deg;
}

.business-main-map-board .business-grid-cells {
    position: relative;
    z-index: 2;
    min-height: 0;
    height: 100%;
    grid-template-rows: repeat(var(--rows), minmax(48px, 1fr));
    gap: 0;
    padding: 10px;
}

.business-main-map-cell {
    isolation: isolate;
    z-index: var(--cell-z, 1);
    --map-layout-scale: 1;
    min-height: 0;
    padding: 7px 8px;
    transform: rotate(var(--map-layout-rotate, 0deg));
    transform-origin: center;
    border-color: rgba(237, 215, 161, 0.025);
    border-radius: 3px;
    background:
        linear-gradient(135deg, rgba(255, 236, 178, 0.012), rgba(10, 20, 18, 0.026)),
        rgba(25, 34, 28, 0.045);
    backdrop-filter: none;
    box-shadow: inset 0 -8px 14px rgba(0, 0, 0, 0.025);
}

.business-main-map-board-degrid .business-main-map-cell {
    border-color: transparent;
    background: transparent;
    box-shadow: none;
}

.business-main-map-cell .business-map-parcel-base {
    display: none;
}

.business-main-map-board-degrid .business-main-map-cell.plot {
    border-color: transparent;
    background: transparent;
    box-shadow: none;
    overflow: visible;
}

.business-main-map-board-degrid .business-main-map-cell.plot .business-map-parcel-base,
.business-main-map-board-degrid .business-main-map-cell.land-sale .business-map-parcel-base {
    position: absolute;
    z-index: 0;
    left: 19%;
    right: 18%;
    top: 21%;
    bottom: 18%;
    display: block;
    border: 0;
    border-radius: 57% 43% 54% 46% / 39% 47% 41% 35%;
    background:
        radial-gradient(ellipse at 46% 60%, rgba(38, 27, 13, 0.16), transparent 62%),
        radial-gradient(ellipse at 30% 28%, rgba(241, 220, 164, 0.09), transparent 42%);
    box-shadow: none;
    opacity: 0.045;
    transform: rotate(-2deg) scale(0.8) scale(var(--map-layout-scale, 1));
    pointer-events: none;
    filter: blur(0.62px) saturate(0.82);
    -webkit-mask-image: radial-gradient(ellipse at 50% 54%, #000 26%, rgba(0, 0, 0, 0.68) 48%, transparent 76%);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-image: radial-gradient(ellipse at 50% 54%, #000 26%, rgba(0, 0, 0, 0.68) 48%, transparent 76%);
    mask-repeat: no-repeat;
    mask-size: 100% 100%;
}

.business-main-map-board-degrid .business-main-map-cell.land-sale {
    --land-sale-box-size: clamp(36px, 3.1vw, 54px);
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    overflow: visible;
}

.business-main-map-board-degrid .business-main-map-cell.land-sale .business-map-parcel-base {
    display: none;
}

.business-main-map-board-degrid .business-main-map-cell.land-sale .business-grid-tile-art {
    display: none;
}

.business-main-map-board-degrid .business-main-map-cell.land-sale:hover:not(:disabled),
.business-main-map-board-degrid .business-main-map-cell.land-sale:focus-visible,
.business-main-map-board-degrid .business-main-map-cell.land-sale.selected {
    border-color: transparent;
    background: transparent;
    box-shadow: none;
}

.business-main-map-board-degrid .business-main-map-cell.plot.free .business-map-parcel-base {
    background:
        radial-gradient(ellipse at 48% 58%, rgba(54, 86, 44, 0.12), transparent 64%),
        radial-gradient(ellipse at 28% 26%, rgba(207, 225, 156, 0.08), transparent 42%);
    opacity: 0.04;
}

.business-main-map-board-degrid .business-main-map-cell.plot.locked .business-map-parcel-base {
    background:
        radial-gradient(ellipse at 50% 58%, rgba(45, 39, 30, 0.1), transparent 64%),
        radial-gradient(ellipse at 34% 32%, rgba(207, 196, 160, 0.05), transparent 46%);
    opacity: 0.025;
}

.business-main-map-board-degrid .business-main-map-cell.plot.occupied .business-map-parcel-base {
    background:
        radial-gradient(ellipse at 50% 66%, rgba(15, 11, 7, 0.18), transparent 56%),
        radial-gradient(ellipse at 40% 34%, rgba(121, 104, 63, 0.05), transparent 48%);
    opacity: 0.04;
}

.business-main-map-board-degrid .business-main-map-cell.plot.occupied .business-map-parcel-base {
    display: none;
    opacity: 0;
}

.business-main-map-board-degrid .business-main-map-cell.plot.occupied:not(:hover):not(:focus-visible):not(.selected) .business-map-parcel-base {
    opacity: 0;
}

.business-main-map-cell.district {
    border-color: rgba(228, 169, 89, 0.04);
    background:
        linear-gradient(135deg, rgba(150, 103, 49, 0.06), rgba(83, 63, 38, 0.035)),
        rgba(34, 43, 31, 0.055);
}

.business-main-map-cell.plot.occupied {
    border-color: rgba(157, 204, 116, 0.038);
    background:
        linear-gradient(135deg, rgba(82, 122, 67, 0.06), rgba(48, 86, 58, 0.036)),
        rgba(25, 43, 35, 0.055);
}

.business-main-map-cell.plot.free {
    border-color: rgba(111, 174, 168, 0.038);
    background:
        linear-gradient(135deg, rgba(58, 116, 107, 0.052), rgba(40, 83, 75, 0.034)),
        rgba(22, 45, 42, 0.052);
}

.business-main-map-cell.land-sale {
    border-color: rgba(255, 209, 102, 0.34);
    background: transparent;
}

.business-main-map-cell.locked {
    background: rgba(15, 19, 24, 0.12);
}

.business-main-map-cell.water,
.business-main-map-cell.road {
    border-color: rgba(137, 170, 172, 0.035);
    background: rgba(31, 76, 82, 0.05);
}

.business-main-map-cell.road {
    border-color: rgba(194, 160, 104, 0.034);
    background: rgba(93, 76, 48, 0.044);
}

.business-main-map-board-degrid .business-main-map-cell.district,
.business-main-map-board-degrid .business-main-map-cell.water,
.business-main-map-board-degrid .business-main-map-cell.road {
    border-color: transparent;
    background: transparent;
    box-shadow: none;
}

.business-main-map-cell.selected {
    background:
        linear-gradient(135deg, rgba(173, 120, 48, 0.32), rgba(58, 94, 77, 0.24)),
        rgba(18, 24, 29, 0.34);
}

.business-main-map-cell.opening-candidate {
    border-color: rgba(94, 214, 189, 0.68);
    box-shadow:
        0 0 0 2px rgba(94, 214, 189, 0.16),
        0 10px 28px rgba(15, 139, 117, 0.18);
}

.business-main-map-cell.opening-candidate::after {
    border-color: rgba(94, 214, 189, 0.54);
    background: rgba(10, 62, 59, 0.3);
}

.business-main-map-cell span,
.business-main-map-cell strong,
.business-main-map-cell em {
    opacity: 0.22;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.78);
}

.business-main-map-cell .business-grid-tile-art {
    opacity: 1;
    transform: scale(var(--map-layout-scale, 1));
    transform-origin: center;
    filter: saturate(1) contrast(1) brightness(1);
    mix-blend-mode: normal;
}

.business-main-map-board-degrid .business-main-map-cell:not(.selected):not(:hover):not(:focus-visible) .business-grid-tile-art {
    opacity: 0;
}

.business-main-map-cell:hover:not(:disabled),
.business-main-map-cell:focus-visible {
    z-index: 160;
    transform: translateY(-1px) rotate(var(--map-layout-rotate, 0deg));
    border-color: rgba(255, 226, 151, 0.58);
    background:
        linear-gradient(135deg, rgba(255, 226, 151, 0.18), rgba(34, 75, 67, 0.24)),
        rgba(18, 24, 29, 0.5);
    box-shadow:
        inset 0 0 0 1px rgba(255, 244, 204, 0.12),
        0 0 0 1px rgba(255, 226, 151, 0.16),
        0 10px 22px rgba(0, 0, 0, 0.22);
}

.business-main-map-board-degrid .business-main-map-cell.plot:hover:not(:disabled) .business-map-parcel-base,
.business-main-map-board-degrid .business-main-map-cell.plot:focus-visible .business-map-parcel-base,
.business-main-map-board-degrid .business-main-map-cell.plot.selected .business-map-parcel-base {
    border-color: rgba(255, 226, 151, 0.42);
    opacity: 0.9;
    transform: rotate(-1deg) scale(1.02);
    filter: blur(0.25px) saturate(0.95);
    box-shadow:
        inset 0 0 0 1px rgba(255, 244, 204, 0.08),
        0 0 0 1px rgba(255, 226, 151, 0.14),
        0 12px 24px rgba(0, 0, 0, 0.2);
    -webkit-mask-image: radial-gradient(ellipse at 50% 52%, #000 32%, rgba(0, 0, 0, 0.84) 58%, transparent 80%);
    mask-image: radial-gradient(ellipse at 50% 52%, #000 32%, rgba(0, 0, 0, 0.84) 58%, transparent 80%);
}

.business-main-map-cell:hover:not(:disabled) span,
.business-main-map-cell:hover:not(:disabled) strong,
.business-main-map-cell:hover:not(:disabled) em,
.business-main-map-cell:focus-visible span,
.business-main-map-cell:focus-visible strong,
.business-main-map-cell:focus-visible em,
.business-main-map-cell.selected span,
.business-main-map-cell.selected strong,
.business-main-map-cell.selected em {
    opacity: 1;
}

.business-main-map-cell:hover:not(:disabled) .business-grid-tile-art,
.business-main-map-cell:focus-visible .business-grid-tile-art,
.business-main-map-cell.selected .business-grid-tile-art {
    opacity: 1;
    filter: saturate(1) contrast(1) brightness(1);
    mix-blend-mode: normal;
}

.business-main-map-cell:hover:not(:disabled) .business-grid-object-signal,
.business-main-map-cell:hover:not(:disabled) .business-grid-object-note,
.business-main-map-cell:focus-visible .business-grid-object-signal,
.business-main-map-cell:focus-visible .business-grid-object-note,
.business-main-map-cell.selected .business-grid-object-signal,
.business-main-map-cell.selected .business-grid-object-note {
    opacity: 1;
    background: rgba(3, 7, 11, 0.66);
}

.business-main-map-cell:hover:not(:disabled) .business-grid-status-bubbles b,
.business-main-map-cell:focus-visible .business-grid-status-bubbles b,
.business-main-map-cell.selected .business-grid-status-bubbles b {
    opacity: 1;
}

.business-main-map-board-degrid .business-main-map-cell:not(.selected):not(:hover):not(:focus-visible) span,
.business-main-map-board-degrid .business-main-map-cell:not(.selected):not(:hover):not(:focus-visible) strong,
.business-main-map-board-degrid .business-main-map-cell:not(.selected):not(:hover):not(:focus-visible) em,
.business-main-map-board-degrid .business-main-map-cell:not(.selected):not(:hover):not(:focus-visible) .business-grid-object-signal,
.business-main-map-board-degrid .business-main-map-cell:not(.selected):not(:hover):not(:focus-visible) .business-grid-object-note,
.business-main-map-board-degrid .business-main-map-cell:not(.selected):not(:hover):not(:focus-visible) .business-grid-status-bubbles {
    opacity: 0;
}

.business-main-map-board-degrid .business-main-map-cell:not(.selected):not(:hover):not(:focus-visible) .business-grid-object-mark {
    opacity: 0;
}

.business-main-map-board-degrid .business-main-map-cell.plot.free:not(.selected):not(:hover):not(:focus-visible) .business-grid-object-mark,
.business-main-map-board-degrid .business-main-map-cell.plot.locked:not(.selected):not(:hover):not(:focus-visible) .business-grid-object-mark,
.business-main-map-board-degrid .business-main-map-cell.land-sale:not(.selected):not(:hover):not(:focus-visible) .business-grid-object-mark {
    top: 50%;
    left: 50%;
    width: 20px;
    height: 20px;
    opacity: 0.34;
    transform: translate(-50%, -50%) scale(0.92);
}

.business-main-map-board-degrid .business-main-map-cell.land-sale:not(.selected):not(:hover):not(:focus-visible) .business-grid-object-mark {
    opacity: 0;
}

.business-main-map-board-degrid .business-main-map-cell.plot.occupied:not(.selected):not(:hover):not(:focus-visible) .business-grid-object-mark {
    opacity: 0;
}

.business-main-map-board-degrid.business-map-layout-editor-active .business-main-map-cell:not(.selected):not(:hover):not(:focus-visible) .business-grid-tile-art,
.business-main-map-board-degrid.business-map-layout-editor-active .business-main-map-cell:not(.selected):not(:hover):not(:focus-visible) .business-grid-building-art,
.business-main-map-board-degrid.business-map-layout-editor-active .business-main-map-cell:not(.selected):not(:hover):not(:focus-visible) .business-grid-decoration-art {
    opacity: 1;
}

.business-main-map-board-degrid.business-map-layout-editor-active .business-main-map-cell:not(.selected):not(:hover):not(:focus-visible) .business-map-layout-tools {
    opacity: 0.92;
}

.business-grid-object-mark,
.business-grid-object-signal,
.business-grid-object-note {
    position: absolute;
    z-index: 3;
    pointer-events: none;
    font-style: normal;
    line-height: 1;
}

.business-grid-object-mark {
    top: 6px;
    left: 6px;
    display: grid;
    place-items: center;
    width: 22px;
    height: 22px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 999px;
    color: #fff;
    background: rgba(9, 14, 20, 0.48);
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2);
    font-size: 0.68rem;
    font-weight: 900;
}

.business-grid-object-mark.district {
    color: #ffe1ad;
    border-color: rgba(243, 180, 90, 0.26);
    background: rgba(91, 56, 23, 0.48);
}

.business-grid-object-mark.building {
    color: #e7ffd2;
    border-color: rgba(155, 225, 93, 0.3);
    background: rgba(44, 85, 50, 0.5);
}

.business-grid-object-mark.free {
    color: #dffcff;
    border-color: rgba(78, 205, 196, 0.28);
    background: rgba(22, 79, 82, 0.48);
}

.business-grid-object-mark.sale {
    color: #fff7d4;
    border-color: rgba(255, 209, 102, 0.42);
    background: rgba(120, 78, 22, 0.62);
}

.business-grid-object-mark.opening,
.business-grid-object-mark.trade,
.business-grid-object-mark.upgrade,
.business-grid-object-mark.event {
    color: #fff9d8;
    border-color: rgba(255, 209, 102, 0.44);
    background: rgba(127, 80, 26, 0.7);
}

.business-grid-object-mark.locked {
    color: #b7c1cc;
    border-color: rgba(183, 193, 204, 0.18);
    background: rgba(18, 22, 28, 0.5);
}

.business-grid-object-mark.route {
    color: #d7e1ea;
    border-color: rgba(123, 194, 209, 0.22);
    background: rgba(18, 42, 52, 0.46);
}

.business-grid-object-signal {
    right: 6px;
    bottom: 6px;
    max-width: calc(100% - 12px);
    padding: 3px 6px;
    border-radius: 999px;
    color: #f5f7fb;
    background: rgba(3, 7, 11, 0.36);
    font-size: 0.64rem;
    font-weight: 900;
    opacity: 0.42;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.business-grid-object-note {
    left: 6px;
    bottom: 6px;
    max-width: calc(100% - 58px);
    padding: 3px 6px;
    border-radius: 999px;
    color: #d7e1ea;
    background: rgba(3, 7, 11, 0.3);
    font-size: 0.58rem;
    font-weight: 800;
    opacity: 0.36;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.business-grid-status-bubbles {
    position: absolute;
    z-index: 4;
    top: 6px;
    right: 6px;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 4px;
    max-width: calc(100% - 36px);
    pointer-events: none;
}

.business-grid-status-bubbles b,
.business-main-map-bubbles span {
    min-width: 0;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 999px;
    color: #f5f7fb;
    background: rgba(3, 7, 11, 0.46);
    font-weight: 900;
    line-height: 1.1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.business-grid-status-bubbles b {
    min-width: 18px;
    max-width: 38px;
    padding: 3px 5px;
    text-align: center;
    font-size: 0.58rem;
    opacity: 0.62;
}

.business-grid-status-bubbles .ready,
.business-main-map-bubbles .ready {
    color: #e7ffd2;
    border-color: rgba(155, 225, 93, 0.38);
    background: rgba(49, 104, 56, 0.72);
}

.business-grid-status-bubbles .warn,
.business-main-map-bubbles .warn {
    color: #ffe1ad;
    border-color: rgba(243, 180, 90, 0.42);
    background: rgba(112, 72, 22, 0.72);
}

.business-grid-status-bubbles .locked,
.business-main-map-bubbles .locked {
    color: #c8d2dc;
    border-color: rgba(183, 193, 204, 0.28);
    background: rgba(18, 22, 28, 0.72);
}

.business-grid-status-bubbles .decor,
.business-main-map-bubbles .decor {
    color: #f8d8ff;
    border-color: rgba(223, 157, 242, 0.38);
    background: rgba(82, 42, 92, 0.7);
}

.business-grid-status-bubbles .route,
.business-main-map-bubbles .route {
    color: #dffcff;
    border-color: rgba(78, 205, 196, 0.34);
    background: rgba(18, 72, 82, 0.68);
}

.business-grid-status-bubbles .done,
.business-main-map-bubbles .done {
    color: #f5f7fb;
    border-color: rgba(123, 194, 209, 0.34);
    background: rgba(33, 73, 85, 0.68);
}

.business-grid-status-bubbles .owned,
.business-main-map-bubbles .owned,
.business-map-ownership-chip--owned {
    color: #e7ffd2;
    border-color: rgba(155, 225, 93, 0.42);
    background: rgba(39, 93, 54, 0.76);
}

.business-grid-status-bubbles .income,
.business-main-map-bubbles .income,
.business-map-ownership-chip--income {
    color: #fff9d8;
    border-color: rgba(255, 209, 102, 0.52);
    background: rgba(137, 92, 22, 0.82);
}

.business-grid-status-bubbles .opening,
.business-main-map-bubbles .opening,
.business-map-ownership-chip--opening {
    color: #fffbdc;
    border-color: rgba(255, 209, 102, 0.56);
    background: rgba(142, 89, 20, 0.84);
}

.business-grid-status-bubbles .trade,
.business-main-map-bubbles .trade,
.business-map-ownership-chip--trade {
    color: #e7fff1;
    border-color: rgba(131, 215, 162, 0.44);
    background: rgba(32, 92, 60, 0.78);
}

.business-grid-status-bubbles .upgrade,
.business-main-map-bubbles .upgrade,
.business-map-ownership-chip--upgrade {
    color: #dffcff;
    border-color: rgba(123, 194, 209, 0.44);
    background: rgba(24, 76, 92, 0.78);
}

.business-grid-status-bubbles .event,
.business-main-map-bubbles .event,
.business-map-ownership-chip--event {
    color: #fff7e8;
    border-color: rgba(255, 206, 153, 0.52);
    background: rgba(154, 69, 38, 0.84);
}

.business-grid-status-bubbles .acquire,
.business-main-map-bubbles .acquire,
.business-map-ownership-chip--acquire {
    color: #fff2c8;
    border-color: rgba(243, 180, 90, 0.48);
    background: rgba(127, 82, 27, 0.78);
}

.business-grid-status-bubbles .public,
.business-main-map-bubbles .public,
.business-map-ownership-chip--public {
    color: #dffcff;
    border-color: rgba(78, 205, 196, 0.34);
    background: rgba(26, 78, 86, 0.72);
}

.business-map-ownership-chip--free {
    color: #dffcff;
    border-color: rgba(78, 205, 196, 0.34);
    background: rgba(20, 82, 88, 0.72);
}

.business-grid-status-bubbles .sale,
.business-main-map-bubbles .sale,
.business-map-ownership-chip--sale {
    color: #fff7d4;
    border-color: rgba(255, 209, 102, 0.5);
    background: rgba(139, 94, 28, 0.8);
}

.business-map-ownership-chip--locked,
.business-map-ownership-chip--warn {
    color: #ffe1ad;
    border-color: rgba(243, 180, 90, 0.42);
    background: rgba(112, 72, 22, 0.72);
}

.business-map-ownership-chip {
    position: absolute;
    left: 50%;
    bottom: -2px;
    z-index: 7;
    max-width: min(92%, 76px);
    padding: 3px 6px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 999px;
    color: #f5f7fb;
    background: rgba(3, 7, 11, 0.68);
    font-size: 0.6rem;
    font-weight: 900;
    line-height: 1.05;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    pointer-events: none;
    opacity: 0;
    transform: translateX(-50%) translateY(4px);
    transition: opacity 0.16s ease, transform 0.16s ease;
}

.business-main-map-cell:hover:not(:disabled) .business-map-ownership-chip,
.business-main-map-cell:focus-visible .business-map-ownership-chip,
.business-main-map-cell.selected .business-map-ownership-chip {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}

.business-main-map-board-degrid .business-main-map-cell.career-building .business-map-ownership-chip,
.business-main-map-board-degrid .business-main-map-cell.public-building .business-map-ownership-chip {
    bottom: -8px;
    opacity: 0.88;
    transform: translateX(-50%) translateY(0);
}

.business-main-map-cell .business-grid-building-art {
    width: min(56%, 58px);
    opacity: 1;
}

.business-main-map-board-degrid .business-main-map-cell.plot.occupied .business-grid-building-art {
    left: 50%;
    right: auto;
    top: auto;
    bottom: -1px;
    z-index: 2;
    width: min(112%, 110px);
    max-height: 112%;
    border-radius: 0;
    object-fit: contain;
    opacity: 1;
    transform: translateX(-50%) scale(var(--map-layout-scale, 1));
    filter:
        drop-shadow(0 12px 10px rgba(0, 0, 0, 0.36))
        drop-shadow(0 3px 1px rgba(18, 28, 20, 0.24))
        saturate(0.96)
        contrast(1.03);
    mix-blend-mode: normal;
}

.business-main-map-board-degrid .business-main-map-cell.plot.occupied .business-grid-building-art:not(.business-grid-building-sprite) {
    display: none;
}

.business-main-map-cell.has-building-sprite {
    overflow: visible;
}

.business-main-map-cell.has-building-sprite:not(.selected)::before {
    content: "";
    position: absolute;
    left: 11%;
    right: 11%;
    bottom: -1px;
    z-index: 0;
    height: 18%;
    border-radius: 999px;
    background: radial-gradient(ellipse at center, rgba(3, 7, 6, 0.3), rgba(3, 7, 6, 0.1) 44%, transparent 76%);
    filter: blur(1px);
    pointer-events: none;
}

.business-main-map-board-degrid .business-main-map-cell.has-building-sprite:not(.selected)::before {
    left: -5%;
    right: -5%;
    bottom: -8px;
    height: 31%;
    border-radius: 48% 52% 46% 54% / 38% 42% 58% 46%;
    background:
        url("../images/business/city/street-details/business-building-ground-shadow-irregular-b-v1.png") center / 100% 100% no-repeat,
        radial-gradient(ellipse at center, rgba(3, 7, 6, 0.22), rgba(3, 7, 6, 0.07) 50%, transparent 78%);
    opacity: 0.58;
    filter: saturate(0.72) contrast(0.88) brightness(0.72) blur(0.18px);
    transform: rotate(-2deg) scaleX(1.08);
    mix-blend-mode: multiply;
}

.business-main-map-cell .business-grid-building-art.business-grid-building-sprite {
    bottom: -4px;
    width: min(88%, 92px);
    max-height: 96%;
    opacity: 1;
    transform: translateX(-50%) translateY(2px) scale(1.04) scale(var(--map-layout-scale, 1));
    filter:
        drop-shadow(0 13px 8px rgba(0, 0, 0, 0.42))
        drop-shadow(0 3px 1px rgba(18, 28, 20, 0.34))
        saturate(0.98)
        contrast(1.05);
}

.business-main-map-board-degrid .business-main-map-cell.plot.occupied .business-grid-building-art.business-grid-building-sprite {
    bottom: -8px;
    z-index: 7;
    width: min(132%, 132px);
    max-height: 136%;
    opacity: 1;
    transform: translateX(-50%) translateY(2px) scale(1.12) scale(var(--map-layout-scale, 1));
    -webkit-mask-image: none;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-image: none;
    mask-repeat: no-repeat;
    mask-size: 100% 100%;
}

.business-main-map-board-degrid .business-main-map-cell.plot.occupied.selected .business-grid-building-art.business-grid-building-sprite {
    bottom: -8px;
    width: min(132%, 132px);
    max-height: 136%;
    transform: translateX(-50%) translateY(2px) scale(1.12) scale(var(--map-layout-scale, 1));
    filter:
        drop-shadow(0 16px 13px rgba(0, 0, 0, 0.48))
        drop-shadow(0 0 9px rgba(255, 226, 151, 0.26))
        saturate(1.04)
        contrast(1.08)
        brightness(1.04);
}

.business-main-map-board-degrid .business-main-map-cell.plot.occupied .business-map-ownership-chip {
    bottom: -22px;
    z-index: 9;
    opacity: 0.94;
    transform: translateX(-50%) translateY(0);
}

.business-main-map-board-degrid .business-main-map-cell.career-building,
.business-main-map-board-degrid .business-main-map-cell.public-building {
    border-color: transparent;
    background: transparent;
    box-shadow: none;
    overflow: visible;
}

.business-main-map-board-degrid .business-main-map-cell.career-building.has-building-sprite::before,
.business-main-map-board-degrid .business-main-map-cell.career-building.has-building-sprite:not(.selected)::before,
.business-main-map-board-degrid .business-main-map-cell.public-building.has-building-sprite::before,
.business-main-map-board-degrid .business-main-map-cell.public-building.has-building-sprite:not(.selected)::before {
    content: none;
    display: none;
    background: none;
    opacity: 0;
    filter: none;
}

.business-main-map-cell.career-building.occupied,
.business-main-map-cell.public-building.occupied {
    border-color: transparent;
    background: transparent;
    box-shadow: none;
}

.business-main-map-board-degrid .business-main-map-cell.career-building .business-grid-tile-art,
.business-main-map-board-degrid .business-main-map-cell.public-building .business-grid-tile-art {
    display: none;
}

.business-main-map-board-degrid .business-main-map-cell.career-building.occupied .business-grid-building-art,
.business-main-map-board-degrid .business-main-map-cell.public-building.occupied .business-grid-building-art {
    left: 50%;
    right: auto;
    top: auto;
    bottom: -1px;
    z-index: 2;
    width: min(112%, 110px);
    max-height: 112%;
    border-radius: 0;
    object-fit: contain;
    opacity: 1;
    transform: translateX(-50%) scale(var(--map-layout-scale, 1));
    filter: saturate(0.98) contrast(1.04);
    mix-blend-mode: normal;
}

.business-main-map-board-degrid .business-main-map-cell.career-building.occupied .business-grid-building-art:not(.business-grid-building-sprite),
.business-main-map-board-degrid .business-main-map-cell.public-building.occupied .business-grid-building-art:not(.business-grid-building-sprite) {
    display: none;
}

.business-main-map-board-degrid .business-main-map-cell.career-building.occupied .business-grid-building-art.business-grid-building-sprite {
    bottom: -5px;
    width: min(104%, 108px);
    max-height: 112%;
    opacity: 1;
    transform: translateX(-50%) translateY(2px) scale(1.05) scale(var(--map-layout-scale, 1));
    filter: saturate(0.98) contrast(1.04);
    -webkit-mask-image: none;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-image: none;
    mask-repeat: no-repeat;
    mask-size: 100% 100%;
}

.business-main-map-board-degrid .business-main-map-cell.public-building.occupied .business-grid-building-art.business-grid-building-sprite {
    bottom: -6px;
    width: min(124%, 182px);
    max-height: 132%;
    opacity: 1;
    transform: translateX(-50%) translateY(2px) scale(1.04) scale(var(--map-layout-scale, 1));
    filter: saturate(0.98) contrast(1.04);
    -webkit-mask-image: none;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-image: none;
    mask-repeat: no-repeat;
    mask-size: 100% 100%;
}

.business-main-map-cell .business-grid-decoration-art {
    width: min(42%, 46px);
    transform: scale(var(--map-layout-scale, 1));
    transform-origin: center;
}

.business-main-map-layout-preview {
    position: absolute;
    inset: 12px;
    z-index: 5;
    display: grid;
    grid-template-columns: repeat(var(--layout-cols), minmax(0, 1fr));
    grid-template-rows: repeat(var(--layout-rows), minmax(0, 1fr));
    gap: 2px;
    pointer-events: none;
}

.business-main-map-layout-piece {
    grid-column: var(--gx) / span var(--w);
    grid-row: var(--gy) / span var(--h);
    min-width: 0;
    min-height: 0;
    display: grid;
    place-items: center;
    overflow: visible;
}

.business-main-map-layout-piece img {
    width: min(96%, 54px);
    max-height: 96%;
    object-fit: contain;
    filter: drop-shadow(0 7px 9px rgba(0, 0, 0, 0.48));
    transform: rotate(var(--rotation, 0deg));
}

.business-main-map-layout-piece span {
    max-width: 100%;
    padding: 2px 4px;
    border-radius: 6px;
    color: #f5f7fb;
    background: rgba(3, 7, 11, 0.62);
    font-size: 0.56rem;
    font-weight: 900;
    line-height: 1.1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.business-main-map-panel {
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto auto;
    gap: 12px;
    overflow: hidden;
    padding: 13px;
    border-radius: 8px;
}

.business-main-map-panel-head {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.business-main-map-panel-head span {
    color: #7bc2d1;
    font-size: 0.78rem;
    font-weight: 800;
}

.business-main-map-panel-head strong {
    min-width: 0;
    color: #fff;
    font-size: 1.14rem;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.business-main-map-panel-head em,
.business-main-map-empty {
    color: #c6d0da;
    font-size: 0.82rem;
    line-height: 1.45;
    font-style: normal;
}

.business-main-map-object-strip {
    min-width: 0;
    display: grid;
    grid-template-columns: auto minmax(0, 0.7fr) minmax(0, 1fr);
    gap: 7px;
    align-items: center;
    padding: 7px 8px;
    border: 1px solid rgba(123, 194, 209, 0.16);
    border-radius: 8px;
    background: rgba(9, 14, 20, 0.62);
}

.business-main-map-object-strip span {
    display: grid;
    place-items: center;
    width: 24px;
    height: 24px;
    border-radius: 999px;
    color: #fff;
    background: rgba(243, 180, 90, 0.22);
    font-size: 0.72rem;
    font-weight: 900;
}

.business-main-map-object-strip strong,
.business-main-map-object-strip em {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.business-main-map-object-strip strong {
    color: #f3b45a;
    font-size: 0.82rem;
}

.business-main-map-object-strip em {
    color: #d7e1ea;
    font-size: 0.76rem;
    font-style: normal;
}

.business-main-map-object-strip .business-harvest-crop-select {
    min-width: 0;
    width: 100%;
    height: 30px;
    padding: 4px 8px;
    border: 1px solid rgba(123, 194, 209, 0.24);
    border-radius: 7px;
    color: #eaf5ef;
    background: rgba(5, 11, 15, 0.72);
    font-size: 0.76rem;
    font-weight: 800;
    outline: none;
}

.business-main-map-object-strip .business-harvest-crop-select:focus {
    border-color: rgba(243, 180, 90, 0.62);
    box-shadow: 0 0 0 2px rgba(243, 180, 90, 0.14);
}

.business-main-map-object-strip .business-harvest-crop-select:disabled {
    cursor: not-allowed;
    opacity: 0.7;
}

.business-main-map-object-strip .business-harvest-crop-select option {
    color: #eaf5ef;
    background: #081115;
}

.business-main-map-bubbles {
    min-width: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.business-main-map-bubbles span {
    padding: 5px 8px;
    font-size: 0.72rem;
}

.business-main-map-opening-banner {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 4px 8px;
    align-items: center;
    padding: 9px 10px;
    border: 1px solid rgba(94, 214, 189, 0.3);
    border-radius: 8px;
    background: linear-gradient(135deg, rgba(13, 80, 73, 0.7), rgba(16, 28, 34, 0.76));
}

.business-main-map-opening-banner span,
.business-main-map-opening-banner strong,
.business-main-map-opening-banner em {
    min-width: 0;
    overflow-wrap: anywhere;
}

.business-main-map-opening-banner span {
    grid-column: 1;
    color: #9ef1dd;
    font-size: 0.72rem;
    font-weight: 900;
}

.business-main-map-opening-banner strong {
    grid-column: 1;
    color: #f5f7fb;
    font-size: 0.86rem;
    line-height: 1.2;
}

.business-main-map-opening-banner em {
    grid-column: 1 / -1;
    color: #d3efe8;
    font-size: 0.76rem;
    line-height: 1.35;
    font-style: normal;
}

.business-main-map-opening-banner button {
    grid-column: 2;
    grid-row: 1 / 3;
    min-height: 30px;
    padding: 5px 8px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 8px;
    color: #f5f7fb;
    background: rgba(255, 255, 255, 0.08);
    cursor: pointer;
    font-weight: 800;
}

.business-main-map-detail-rows {
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
    overflow-y: auto;
    padding-right: 2px;
}

.business-main-map-detail-row {
    min-width: 0;
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
    gap: 9px;
    align-items: start;
    padding: 9px 10px;
    border-radius: 8px;
    background: rgba(9, 14, 20, 0.62);
}

.business-main-map-detail-row span {
    color: #93a4b7;
    font-size: 0.76rem;
}

.business-main-map-detail-row strong {
    min-width: 0;
    color: #f5f7fb;
    font-size: 0.84rem;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.business-main-map-panel-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    max-height: 132px;
    overflow-y: auto;
    padding-right: 2px;
}

.business-main-map-panel-actions .business-action-btn {
    min-width: 0;
    white-space: normal;
    overflow-wrap: anywhere;
    line-height: 1.25;
}

.business-main-map-status {
    min-width: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.business-main-map-status span {
    min-width: 0;
    padding: 4px 7px;
    border-radius: 999px;
    color: #d7e1ea;
    font-size: 0.72rem;
    line-height: 1.2;
}

.business-main-map-mode-toggle {
    min-width: 0;
    width: min(360px, 100%);
    display: grid;
    grid-template-columns: minmax(120px, 1.1fr) minmax(150px, 1fr);
    align-items: stretch;
    gap: 4px;
    padding: 3px;
    border: 1px solid rgba(123, 194, 209, 0.18);
    border-radius: 8px;
    background: rgba(3, 7, 11, 0.48);
}

.business-main-map-mode-toggle button,
.business-main-map-advanced-modes summary {
    min-width: 0;
    min-height: 26px;
    padding: 5px 8px;
    border: 0;
    border-radius: 6px;
    color: #c6d0da;
    background: transparent;
    cursor: pointer;
    font-size: 0.72rem;
    font-weight: 900;
    line-height: 1.1;
    white-space: nowrap;
}

.business-main-map-advanced-modes {
    min-width: 0;
    position: relative;
}

.business-main-map-advanced-modes summary {
    display: flex;
    align-items: center;
    justify-content: center;
    list-style: none;
}

.business-main-map-advanced-modes summary::-webkit-details-marker {
    display: none;
}

.business-main-map-advanced-mode-list {
    position: absolute;
    z-index: 60;
    right: 0;
    top: calc(100% + 6px);
    width: min(260px, 78vw);
    display: grid;
    gap: 5px;
    padding: 6px;
    border: 1px solid rgba(123, 194, 209, 0.22);
    border-radius: 8px;
    background: rgba(4, 10, 14, 0.96);
    box-shadow: 0 14px 34px rgba(0, 0, 0, 0.38);
}

.business-main-map-mode-toggle button.active {
    color: #10151a;
    background: #f3b45a;
}

.business-main-map-layout.layout-editor-mode {
    grid-template-columns: minmax(0, 1fr) minmax(300px, 360px);
}

.business-main-map-layout.city-map-mode {
    --business-city-canvas-width: 1540px;
    --business-city-canvas-height: 980px;
}

.business-main-map-layout.decor-editor-mode {
    grid-template-columns: minmax(0, 1fr) minmax(310px, 380px);
}

.business-main-map-layout.map-layout-editor-mode {
    grid-template-columns: minmax(0, 1fr) minmax(320px, 390px);
}

.business-main-map-layout.city-map-mode .business-main-map-board-wrap {
    overflow: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable both-edges;
    border-radius: 8px;
    background: rgba(3, 8, 11, 0.28);
}

.business-main-map-layout.city-map-mode .business-main-map-board {
    width: max(100%, var(--business-city-canvas-width));
    height: max(100%, var(--business-city-canvas-height));
    min-width: var(--business-city-canvas-width);
    min-height: var(--business-city-canvas-height);
}

.business-main-map-layout.city-map-mode:not(.decor-editor-mode):not(.map-layout-editor-mode) .business-main-map-board-wrap {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    overflow: auto;
    scrollbar-gutter: stable both-edges;
}

.business-main-map-layout.city-map-mode:not(.decor-editor-mode):not(.map-layout-editor-mode) .business-main-map-board {
    width: max(100%, var(--business-city-canvas-width));
    height: max(100%, var(--business-city-canvas-height));
    min-width: var(--business-city-canvas-width);
    min-height: var(--business-city-canvas-height);
    aspect-ratio: 1540 / 980;
}

.business-city-decor-editor-panel {
    grid-template-rows: auto auto minmax(92px, 0.72fr) auto minmax(58px, 0.32fr) auto auto;
    gap: 12px;
}

.business-city-decor-editor-section-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #8fb7c3;
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0;
}

.business-city-decor-editor-list {
    min-height: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    overflow-y: auto;
    padding-right: 2px;
}

.business-city-decor-editor-item {
    min-width: 0;
    min-height: 54px;
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 8px;
    align-items: center;
    padding: 7px 8px;
    border: 1px solid rgba(132, 150, 160, 0.18);
    border-radius: 8px;
    color: #dce6ee;
    background: rgba(7, 13, 18, 0.58);
    cursor: pointer;
    text-align: left;
}

.business-city-decor-editor-item.selected {
    border-color: rgba(243, 180, 90, 0.92);
    color: #fff6df;
    background: rgba(81, 50, 14, 0.62);
}

.business-city-decor-editor-item.muted {
    opacity: 0.45;
}

.business-city-decor-editor-item img {
    grid-row: 1 / span 2;
    width: 42px;
    height: 34px;
    object-fit: contain;
    filter: drop-shadow(0 4px 6px rgba(0, 0, 0, 0.35));
}

.business-city-decor-editor-item span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.76rem;
    font-weight: 900;
}

.business-city-decor-editor-item em {
    min-width: 0;
    grid-column: 2;
    color: #96a9b7;
    font-size: 0.64rem;
    font-style: normal;
    font-weight: 800;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.business-city-decor-editor-list.placed-list {
    grid-template-columns: 1fr;
}

.business-city-decor-editor-item.placed {
    min-height: 48px;
}

.business-city-decor-editor-empty {
    min-width: 0;
    padding: 9px 10px;
    border: 1px dashed rgba(143, 183, 195, 0.22);
    border-radius: 8px;
    color: #b7c8d1;
    background: rgba(7, 13, 18, 0.36);
    font-size: 0.76rem;
    line-height: 1.42;
}

.business-city-decor-editor-controls {
    display: flex;
    flex-direction: column;
    gap: 9px;
    padding: 10px;
    border: 1px solid rgba(123, 194, 209, 0.13);
    border-radius: 8px;
    background: rgba(3, 7, 11, 0.42);
}

.business-city-decor-editor-controls.empty {
    justify-content: center;
}

.business-city-decor-editor-current {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.business-city-decor-editor-current strong {
    color: #fff3ce;
    font-size: 0.86rem;
}

.business-city-decor-editor-current label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #c8d4dc;
    font-size: 0.74rem;
    font-weight: 800;
}

.business-city-decor-editor-control {
    display: grid;
    gap: 5px;
}

.business-city-decor-editor-control span {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    color: #a8b7c4;
    font-size: 0.72rem;
    font-weight: 800;
}

.business-city-decor-editor-control strong {
    color: #f4dfb0;
    font-size: 0.72rem;
}

.business-city-decor-editor-control input[type="range"] {
    width: 100%;
    accent-color: #f3b45a;
}

.business-city-decor-editor-nudges {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 6px;
}

.business-city-decor-editor-nudges button {
    min-width: 0;
    min-height: 28px;
    border: 1px solid rgba(123, 194, 209, 0.16);
    border-radius: 7px;
    color: #dce8ef;
    background: rgba(9, 17, 24, 0.74);
    cursor: pointer;
    font-size: 0.72rem;
    font-weight: 900;
}

.business-city-decor-editor-controls .business-action-btn.danger {
    border-color: rgba(220, 88, 88, 0.42);
    color: #ffd9d9;
    background: rgba(101, 28, 28, 0.46);
}

.business-map-layout-editor-panel {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.business-map-layout-editor-current {
    padding: 8px 10px;
    border: 1px solid rgba(243, 180, 90, 0.2);
    border-radius: 8px;
    color: #ffe5aa;
    background: rgba(81, 50, 14, 0.28);
    font-size: 0.78rem;
    line-height: 1.35;
}

.business-map-layout-editor-current strong {
    display: block;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.business-map-layout-editor-section-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    color: #f1d79e;
    font-size: 0.72rem;
    font-weight: 900;
}

.business-map-layout-editor-list {
    flex: 1 1 auto;
    min-height: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    overflow-y: auto;
    padding-right: 2px;
}

.business-map-layout-editor-item {
    min-width: 0;
    min-height: 62px;
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr);
    gap: 8px;
    align-items: center;
    padding: 7px 8px;
    border: 1px solid rgba(132, 150, 160, 0.18);
    border-radius: 8px;
    color: #dce6ee;
    background: rgba(7, 13, 18, 0.58);
    cursor: pointer;
    text-align: left;
}

.business-map-layout-editor-item.selected {
    border-color: rgba(243, 180, 90, 0.92);
    color: #fff6df;
    background: rgba(81, 50, 14, 0.62);
}

.business-map-layout-editor-item.unplaced {
    border-color: rgba(123, 194, 209, 0.2);
    color: #d7e3eb;
    background: rgba(12, 22, 30, 0.58);
}

.business-map-layout-editor-thumb {
    grid-row: 1 / span 2;
    position: relative;
    width: 52px;
    height: 42px;
    min-width: 0;
    padding: 0;
    border-radius: 6px;
    overflow: hidden;
    background:
        linear-gradient(135deg, rgba(255, 236, 179, 0.2), rgba(38, 70, 58, 0.18)),
        rgba(13, 21, 25, 0.72);
    box-shadow:
        inset 0 0 0 1px rgba(255, 238, 190, 0.18),
        0 5px 10px rgba(0, 0, 0, 0.24);
}

.business-map-layout-editor-thumb img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.business-map-layout-editor-thumb-tile {
    filter: saturate(1.05) contrast(0.98) brightness(1.02);
}

.business-map-layout-editor-thumb-building {
    object-fit: contain;
    padding: 3px;
    filter: drop-shadow(0 4px 7px rgba(0, 0, 0, 0.38));
}

.business-map-layout-editor-thumb[data-business-map-layout-thumb="career-building"],
.business-map-layout-editor-thumb[data-business-map-layout-thumb="public-building"] {
    background:
        linear-gradient(135deg, rgba(245, 205, 126, 0.16), rgba(76, 48, 26, 0.08)),
        rgba(26, 20, 16, 0.76);
}

.business-map-layout-editor-thumb b {
    position: absolute;
    left: 4px;
    bottom: 4px;
    max-width: calc(100% - 8px);
    padding: 2px 4px;
    border-radius: 5px;
    color: #10151a;
    background: rgba(224, 245, 211, 0.92);
    font-size: 0.58rem;
    font-weight: 900;
    line-height: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.business-map-layout-editor-item strong,
.business-map-layout-editor-item em {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.business-map-layout-editor-item strong {
    grid-column: 2;
    font-size: 0.76rem;
}

.business-map-layout-editor-item em {
    grid-column: 2;
    color: #9fb0bd;
    font-size: 0.68rem;
    font-style: normal;
}

.business-map-layout-editor-item.unplaced .business-map-layout-editor-thumb b {
    color: #0e1820;
    background: rgba(199, 217, 232, 0.94);
}

.business-map-layout-editor-item.unplaced em {
    color: #b9d1df;
}

.business-map-layout-editor-list.duplicate-list {
    flex: 0 1 160px;
    max-height: 160px;
}

.business-map-layout-editor-item.duplicate {
    border-color: rgba(243, 180, 90, 0.24);
    background: rgba(48, 32, 14, 0.52);
}

.business-map-layout-editor-item.duplicate .business-map-layout-editor-thumb b {
    background: rgba(241, 215, 158, 0.94);
}

.business-layout-editor-board {
    border-color: rgba(214, 183, 126, 0.28);
    background:
        radial-gradient(circle at 36% 28%, rgba(118, 130, 78, 0.24), transparent 52%),
        linear-gradient(135deg, rgba(41, 62, 47, 0.9), rgba(24, 44, 44, 0.92) 48%, rgba(62, 50, 34, 0.88)),
        rgba(12, 26, 19, 0.94);
}

.business-layout-editor-board::before {
    opacity: 0.24;
    filter: sepia(0.12) saturate(0.72) contrast(0.88);
}

.business-layout-editor-board::after {
    opacity: 0.22;
}

.business-layout-editor-board .business-layout-cells {
    position: relative;
    z-index: 1;
    min-width: 0;
    min-height: 0;
    height: 100%;
    display: grid;
    grid-template-columns: repeat(var(--cols), minmax(0, 1fr));
    grid-template-rows: repeat(var(--rows), minmax(0, 1fr));
    gap: 2px;
    padding: 10px;
}

.business-layout-cell {
    position: relative;
    isolation: isolate;
    min-width: 0;
    min-height: 0;
    display: grid;
    place-items: center;
    overflow: hidden;
    padding: 0;
    border: 1px solid rgba(240, 219, 164, 0.12);
    border-radius: 4px;
    background:
        linear-gradient(135deg, rgba(255, 238, 184, 0.05), rgba(0, 0, 0, 0.1)),
        rgba(37, 52, 39, 0.2);
    box-shadow: inset 0 0 0 1px rgba(255, 245, 204, 0.025);
    cursor: pointer;
}

.business-layout-cell::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at 22% 18%, rgba(255, 240, 190, 0.08), transparent 34%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.025), rgba(0, 0, 0, 0.12));
}

.business-layout-cell.can-place {
    border-color: rgba(187, 219, 121, 0.3);
    background:
        linear-gradient(135deg, rgba(116, 151, 79, 0.22), rgba(49, 88, 58, 0.18)),
        rgba(32, 82, 48, 0.12);
    box-shadow: inset 0 0 0 1px rgba(187, 219, 121, 0.12);
}

.business-layout-cell.can-move {
    border-color: rgba(123, 194, 209, 0.44);
    background:
        linear-gradient(135deg, rgba(65, 132, 117, 0.36), rgba(36, 83, 86, 0.28)),
        rgba(28, 86, 91, 0.22);
    box-shadow: inset 0 0 0 1px rgba(123, 194, 209, 0.2);
}

.business-layout-cell.occupied {
    border-color: rgba(224, 168, 86, 0.38);
    background:
        linear-gradient(135deg, rgba(135, 91, 38, 0.36), rgba(59, 82, 52, 0.26)),
        rgba(95, 62, 26, 0.22);
}

.business-layout-cell.selected {
    box-shadow: inset 0 0 0 2px rgba(243, 180, 90, 0.85), 0 0 18px rgba(243, 180, 90, 0.25);
}

.business-layout-cell.blocked {
    border-color: rgba(183, 193, 204, 0.08);
    background: rgba(12, 16, 18, 0.26);
    cursor: not-allowed;
}

.business-layout-cell.blocked::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background-image: repeating-linear-gradient(
        135deg,
        rgba(255, 255, 255, 0.1) 0,
        rgba(255, 255, 255, 0.1) 1px,
        transparent 1px,
        transparent 7px
    );
    opacity: 0.34;
}

.business-layout-cell.tile-free {
    border-color: rgba(184, 203, 123, 0.16);
    background: linear-gradient(135deg, rgba(110, 126, 76, 0.24), rgba(55, 91, 61, 0.22));
}

.business-layout-cell.tile-fixed-district {
    border-color: rgba(226, 166, 84, 0.2);
    background: linear-gradient(135deg, rgba(135, 89, 38, 0.28), rgba(92, 67, 43, 0.26));
}

.business-layout-cell.tile-fixed-plot {
    border-color: rgba(157, 204, 116, 0.18);
    background: linear-gradient(135deg, rgba(69, 105, 59, 0.26), rgba(78, 78, 46, 0.22));
}

.business-layout-cell.tile-water-route {
    border-color: rgba(105, 184, 190, 0.2);
    background: linear-gradient(135deg, rgba(40, 102, 104, 0.28), rgba(25, 66, 91, 0.24));
}

.business-layout-cell.tile-road-route {
    border-color: rgba(204, 161, 95, 0.18);
    background: linear-gradient(135deg, rgba(107, 88, 55, 0.28), rgba(79, 67, 48, 0.24));
}

.business-layout-cell.tile-occupied {
    border-color: rgba(231, 186, 104, 0.42);
    background: linear-gradient(135deg, rgba(132, 86, 33, 0.38), rgba(56, 82, 54, 0.3));
}

.business-layout-cell.tile-free.can-place {
    border-color: rgba(188, 226, 120, 0.34);
    background:
        radial-gradient(circle at 50% 54%, rgba(178, 207, 116, 0.14), transparent 54%),
        linear-gradient(135deg, rgba(112, 151, 75, 0.28), rgba(55, 107, 67, 0.24));
}

.business-layout-cell.tile-free.can-move {
    border-color: rgba(123, 194, 209, 0.56);
    background: linear-gradient(135deg, rgba(69, 132, 113, 0.5), rgba(43, 89, 90, 0.42));
}

.business-layout-cell img {
    position: relative;
    z-index: 2;
    width: 92%;
    max-height: 92%;
    object-fit: contain;
    pointer-events: none;
    filter: drop-shadow(0 5px 8px rgba(0, 0, 0, 0.38));
    transform: rotate(var(--rotation, 0deg));
}

.business-layout-cell span,
.business-layout-cell i {
    position: absolute;
    left: 2px;
    right: 2px;
    bottom: 2px;
    z-index: 3;
    min-width: 0;
    padding: 1px 2px;
    border-radius: 4px;
    color: #f5f7fb;
    background: rgba(3, 7, 11, 0.58);
    font-size: 0.5rem;
    font-style: normal;
    font-weight: 900;
    line-height: 1.05;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    pointer-events: none;
}

.business-layout-cell i {
    color: #9eacb8;
    background: transparent;
}

.business-layout-editor-panel {
    grid-template-rows: auto minmax(0, 1fr) auto auto;
}

.business-layout-selected-actions {
    min-width: 0;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
}

.business-layout-selected-actions .business-action-btn {
    min-width: 0;
    padding: 6px 7px;
    white-space: normal;
    line-height: 1.15;
}

.business-layout-selected-actions .business-action-btn.danger {
    color: #ffe1ad;
    border-color: rgba(243, 180, 90, 0.34);
    background: rgba(102, 51, 35, 0.5);
}

.business-layout-selected-item,
.business-layout-item {
    min-width: 0;
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 8px;
    align-items: center;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    background: rgba(9, 14, 20, 0.62);
}

.business-layout-selected-item {
    padding: 8px;
}

.business-layout-selected-item img,
.business-layout-item img {
    width: 42px;
    height: 42px;
    object-fit: contain;
}

.business-layout-selected-item span,
.business-layout-item span {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.business-layout-selected-item strong,
.business-layout-item strong {
    min-width: 0;
    color: #f5f7fb;
    font-size: 0.82rem;
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.business-layout-selected-item em,
.business-layout-item em {
    min-width: 0;
    color: #93a4b7;
    font-size: 0.7rem;
    font-style: normal;
    line-height: 1.25;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.business-layout-item-list {
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-content: start;
    gap: 8px;
    overflow-y: auto;
    padding-right: 2px;
}

.business-layout-item {
    width: 100%;
    padding: 7px;
    color: inherit;
    text-align: left;
    cursor: pointer;
}

.business-layout-item.selected {
    border-color: rgba(243, 180, 90, 0.55);
    background: rgba(95, 62, 26, 0.52);
}

.business-layout-item:disabled {
    opacity: 0.52;
    cursor: not-allowed;
}

.business-layout-empty {
    min-width: 0;
    padding: 10px;
    border-radius: 8px;
    color: #c6d0da;
    background: rgba(9, 14, 20, 0.62);
    font-size: 0.82rem;
    line-height: 1.4;
}

.business-content-fold summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 46px;
    padding: 12px 14px;
    cursor: pointer;
    color: #cfd6df;
    list-style: none;
}

.business-content-fold summary::-webkit-details-marker {
    display: none;
}

.business-content-fold summary span {
    color: #f2d6a2;
    font-weight: 700;
}

.business-content-fold summary strong {
    color: #9fa9b5;
    font-size: 0.86em;
    font-weight: 500;
}

.business-content-fold summary::after {
    content: '+';
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    width: 22px;
    height: 22px;
    border: 1px solid rgba(243, 180, 90, 0.24);
    border-radius: 50%;
    color: #f3b45a;
    background: rgba(11, 17, 24, 0.42);
    font-weight: 800;
}

.business-content-fold[open] summary {
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.business-content-fold[open] summary::after {
    content: '-';
}

.business-content-fold > .business-section {
    margin: 12px;
}

.business-content-fold > .business-section + .business-section {
    margin-top: 0;
}

.business-subtabs {
    display: grid;
    gap: 12px;
    min-width: 0;
}

.business-subnav {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 10px;
    min-width: 0;
    margin-bottom: 2px;
}

.business-subnav-btn {
    min-width: 0;
    min-height: 62px;
    padding: 10px 12px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    color: #cfd6df;
    text-align: left;
    background: rgba(11, 17, 24, 0.42);
    cursor: pointer;
    transition: border-color 0.2s ease, background 0.2s ease, transform 0.2s ease;
}

.business-subnav-btn:hover {
    border-color: rgba(243, 180, 90, 0.34);
    background: rgba(243, 180, 90, 0.08);
    transform: translateY(-1px);
}

.business-subnav-btn.active {
    border-color: rgba(243, 180, 90, 0.52);
    background:
        linear-gradient(135deg, rgba(243, 180, 90, 0.16), rgba(131, 215, 162, 0.08)),
        rgba(11, 17, 24, 0.58);
    box-shadow: inset 0 0 0 1px rgba(243, 180, 90, 0.08);
}

.business-subnav-btn span,
.business-subnav-btn strong {
    display: block;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.business-subnav-btn span {
    color: #f2d6a2;
    font-weight: 800;
}

.business-subnav-btn strong {
    margin-top: 5px;
    color: #9fa9b5;
    font-size: 0.84em;
    font-weight: 500;
}

.business-subpage-deck {
    min-width: 0;
}

.business-subpage {
    display: none;
    min-width: 0;
    animation: fadeInUp 0.24s ease-out;
}

.business-subpage.active {
    display: grid;
    gap: 14px;
}

.business-city-command {
    display: grid;
    grid-template-columns: minmax(180px, 0.7fr) minmax(0, 1.3fr) minmax(170px, 0.5fr);
    gap: 12px;
    align-items: stretch;
    margin-bottom: 14px;
    padding: 12px;
    border: 1px solid rgba(131, 215, 162, 0.24);
    border-radius: 8px;
    background:
        linear-gradient(135deg, rgba(131, 215, 162, 0.11), rgba(243, 180, 90, 0.07)),
        rgba(255, 255, 255, 0.045);
}

.business-city-command-main {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    min-width: 0;
}

.business-city-command-main span {
    color: #83d7a2;
    font-size: 0.86em;
    font-weight: 700;
}

.business-city-command-main strong {
    color: #f2d6a2;
    font-size: 1.22em;
}

.business-city-command-main em {
    color: #aeb8c5;
    font-size: 0.88em;
    font-style: normal;
    line-height: 1.45;
}

.business-city-command-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.business-city-command-stats div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    min-width: 0;
    padding: 9px 10px;
    border-radius: 8px;
    background: rgba(11, 17, 24, 0.42);
    border: 1px solid rgba(255, 255, 255, 0.09);
}

.business-city-command-stats span {
    min-width: 0;
    color: #9fa9b5;
    font-size: 0.82em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.business-city-command-stats strong {
    color: #f3b45a;
    white-space: nowrap;
}

.business-city-command-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    align-content: center;
}

.business-industry-command,
.business-commerce-command,
.business-records-command,
.business-planning-stage {
    min-width: 0;
    margin-bottom: 14px;
    padding: 12px;
    border: 1px solid rgba(243, 180, 90, 0.2);
    border-radius: 8px;
    background:
        linear-gradient(135deg, rgba(243, 180, 90, 0.08), rgba(123, 194, 209, 0.055)),
        rgba(7, 12, 18, 0.72);
}

.business-industry-command,
.business-commerce-command,
.business-records-command {
    display: grid;
    grid-template-columns: minmax(220px, 0.62fr) minmax(0, 1.38fr);
    gap: 12px;
    align-items: stretch;
}

.business-command-visual {
    position: relative;
    min-height: 180px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.11);
    border-radius: 8px;
    background: rgba(8, 13, 18, 0.72);
}

button.business-command-visual,
button.business-planning-hero,
button.business-command-scene-card {
    padding: 0;
    color: inherit;
    font: inherit;
    text-align: left;
    appearance: none;
    cursor: pointer;
}

button.business-command-visual:hover,
button.business-planning-hero:hover,
button.business-command-scene-card:hover {
    border-color: rgba(243, 180, 90, 0.42);
}

button.business-command-visual:focus-visible,
button.business-planning-hero:focus-visible,
button.business-command-scene-card:focus-visible {
    outline: 2px solid rgba(123, 194, 209, 0.76);
    outline-offset: 2px;
}

.business-command-visual:hover img,
.business-planning-hero:hover img,
.business-command-scene-card:hover img {
    transform: scale(1.025);
}

.business-command-visual img {
    width: 100%;
    height: 100%;
    min-height: 180px;
    display: block;
    object-fit: cover;
    transition: transform 0.22s ease;
}

.business-command-visual > div:last-child,
.business-planning-hero > div:last-child {
    position: absolute;
    left: 14px;
    right: 14px;
    bottom: 13px;
    z-index: 2;
    display: flex;
    flex-direction: column;
    gap: 5px;
    min-width: 0;
    color: #f5f7fb;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.72);
}

.business-command-visual span,
.business-planning-hero span {
    color: #ffd28c;
    font-size: 0.8em;
    font-weight: 800;
}

.business-command-visual strong,
.business-planning-hero strong {
    color: #fff;
    font-size: 1.04em;
    line-height: 1.32;
}

.business-command-visual em,
.business-planning-hero em {
    color: #d7e1ea;
    font-size: 0.82em;
    line-height: 1.45;
    font-style: normal;
}

.business-command-main,
.business-planning-side {
    min-width: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    gap: 10px;
}

.business-command-stat-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(104px, 1fr));
    gap: 8px;
    min-width: 0;
}

.business-command-stat-grid div,
.business-opportunity-card,
.business-records-claim-grid article {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 10px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    background: rgba(11, 17, 24, 0.54);
}

.business-command-stat-grid span,
.business-opportunity-card span,
.business-records-claim-grid span {
    color: #93a4b7;
    font-size: 0.78em;
    line-height: 1.3;
}

.business-command-stat-grid strong,
.business-opportunity-card strong,
.business-records-claim-grid strong {
    color: #f3b45a;
    font-size: 1.05em;
    line-height: 1.25;
}

.business-command-shop-strip {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    min-width: 0;
}

.business-command-supply-card {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(118px, 0.34fr) minmax(0, 1fr) minmax(96px, auto);
    gap: 10px;
    align-items: stretch;
    padding: 9px;
    border: 1px solid rgba(137, 197, 122, 0.24);
    border-radius: 8px;
    background:
        linear-gradient(135deg, rgba(90, 123, 70, 0.22), rgba(16, 31, 30, 0.58)),
        rgba(8, 13, 18, 0.66);
}

.business-command-supply-card img {
    width: 100%;
    height: 112px;
    min-width: 0;
    display: block;
    object-fit: cover;
    border-radius: 6px;
    filter: saturate(1.04) contrast(1.02);
}

.business-command-supply-copy {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.business-command-supply-copy span {
    color: #9fe0b1;
    font-size: 0.74rem;
    font-weight: 900;
}

.business-command-supply-copy strong {
    min-width: 0;
    color: #fff7df;
    font-size: 0.94rem;
    line-height: 1.28;
    overflow-wrap: anywhere;
}

.business-command-supply-copy em,
.business-command-supply-copy small {
    min-width: 0;
    color: #d9e5d5;
    font-size: 0.75rem;
    line-height: 1.38;
    font-style: normal;
}

.business-command-supply-next {
    min-width: 0;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 3px 7px;
    align-items: center;
    padding: 6px 7px;
    border: 1px solid rgba(241, 190, 92, 0.24);
    border-radius: 8px;
    background: rgba(9, 14, 13, 0.58);
}

.business-command-supply-next span {
    grid-row: 1 / 3;
    color: #9fe0b1;
    font-size: 0.68rem;
    font-weight: 900;
    white-space: nowrap;
}

.business-command-supply-next strong,
.business-command-supply-next em {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.business-command-supply-next strong {
    color: #fff7df;
    font-size: 0.8rem;
    line-height: 1.18;
}

.business-command-supply-next em {
    color: #d9e5d5;
    font-size: 0.68rem;
    line-height: 1.22;
    font-style: normal;
}

.business-command-supply-chips {
    min-width: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 2px;
}

.business-command-supply-chips span {
    max-width: 100%;
    padding: 3px 6px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 999px;
    color: #f4ead2;
    background: rgba(255, 255, 255, 0.06);
    font-size: 0.68rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.business-command-supply-actions {
    min-width: 96px;
    display: grid;
    align-content: center;
    gap: 7px;
}

.business-command-supply-actions .business-action-btn {
    min-height: 34px;
    padding: 6px 10px;
    white-space: normal;
}

.business-outskirts-contract-board {
    min-width: 0;
    display: grid;
    gap: 8px;
}

.business-outskirts-contract-board-head {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.business-outskirts-contract-board-head span {
    color: #9fe0b1;
    font-size: 0.74rem;
    font-weight: 900;
}

.business-outskirts-contract-board-head strong {
    color: #f3b45a;
    font-size: 0.76rem;
    font-weight: 900;
}

.business-outskirts-contract-board-list {
    min-width: 0;
    display: grid;
    gap: 6px;
    max-height: 168px;
    overflow-y: auto;
    padding-right: 2px;
}

.business-outskirts-contract-card {
    min-width: 0;
    display: grid;
    gap: 8px;
    margin-top: 10px;
    padding: 10px;
    border: 1px solid rgba(241, 190, 92, 0.26);
    border-radius: 8px;
    background:
        linear-gradient(135deg, rgba(95, 128, 68, 0.24), rgba(25, 28, 18, 0.64)),
        rgba(9, 14, 13, 0.8);
}

.business-outskirts-contract-card.compact {
    margin-top: 0;
    gap: 5px;
    padding: 7px 8px;
}

.business-outskirts-contract-card > div {
    min-width: 0;
    display: grid;
    gap: 3px;
}

.business-outskirts-contract-card span {
    color: #9fe0b1;
    font-size: 0.72rem;
    font-weight: 900;
}

.business-outskirts-contract-card strong {
    color: #fff7df;
    font-size: 0.96rem;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.business-outskirts-contract-card em,
.business-outskirts-contract-card small {
    min-width: 0;
    color: #d9e5d5;
    font-size: 0.75rem;
    line-height: 1.38;
    font-style: normal;
    overflow-wrap: anywhere;
}

.business-outskirts-contract-card .business-action-btn {
    min-height: 34px;
}

.business-outskirts-contract-card.compact .business-action-btn {
    min-height: 28px;
    padding: 4px 8px;
}

.business-outskirts-contract-card.compact strong {
    font-size: 0.9rem;
}

.business-outskirts-contract-card.compact em,
.business-outskirts-contract-card.compact small {
    font-size: 0.7rem;
    line-height: 1.28;
}

.business-outskirts-supply-hint {
    min-width: 0;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 8px;
    align-items: center;
    padding: 7px 8px;
    border: 1px solid rgba(137, 197, 122, 0.24);
    border-radius: 8px;
    background: rgba(48, 79, 49, 0.18);
}

.business-outskirts-supply-hint.compact {
    grid-template-columns: auto minmax(0, 1fr);
}

.business-outskirts-supply-hint span {
    color: #9fe0b1;
    font-size: 0.7rem;
    font-weight: 900;
    white-space: nowrap;
}

.business-outskirts-supply-hint strong {
    min-width: 0;
    color: #f2ead6;
    font-size: 0.74rem;
    line-height: 1.32;
    overflow-wrap: anywhere;
}

.business-outskirts-supply-hint .business-mini-btn {
    min-height: 28px;
    padding: 4px 8px;
    font-size: 0.7rem;
}

.business-outskirts-supply-hint.compact .business-mini-btn {
    grid-column: 1 / -1;
}

.business-command-scene-strip {
    min-width: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
    gap: 8px;
}

.business-command-scene-card {
    position: relative;
    min-width: 0;
    min-height: 118px;
    display: block;
    width: 100%;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    background: rgba(12, 18, 24, 0.72);
}

.business-command-scene-card img {
    width: 100%;
    height: 100%;
    min-height: 118px;
    display: block;
    object-fit: cover;
    transition: transform 0.22s ease;
}

.business-command-scene-card::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(4, 8, 12, 0.08) 28%, rgba(4, 8, 12, 0.82) 100%);
}

.business-command-scene-card div {
    position: absolute;
    left: 10px;
    right: 10px;
    bottom: 9px;
    z-index: 1;
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 2px;
    color: #f5f7fb;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.72);
}

.business-command-scene-card span {
    color: #ffd28c;
    font-size: 0.72em;
    font-weight: 800;
}

.business-command-scene-card strong {
    min-width: 0;
    color: #fff;
    font-size: 0.88em;
    line-height: 1.25;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.business-command-scene-card em {
    color: #d7e1ea;
    font-size: 0.74em;
    line-height: 1.35;
    font-style: normal;
}

.business-shop-snapshot {
    min-width: 0;
    display: grid;
    grid-template-columns: 78px minmax(0, 1fr);
    gap: 9px;
    align-items: stretch;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    background: rgba(12, 18, 24, 0.72);
}

.business-shop-snapshot.is-open {
    border-color: rgba(131, 215, 162, 0.24);
}

.business-shop-snapshot.is-locked {
    opacity: 0.76;
}

.business-shop-snapshot img {
    width: 78px;
    height: 76px;
    display: block;
    object-fit: cover;
}

.business-shop-snapshot div {
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 3px;
    padding: 7px 8px 7px 0;
}

.business-shop-snapshot span {
    color: #83d7a2;
    font-size: 0.72em;
    font-weight: 800;
}

.business-shop-snapshot strong {
    min-width: 0;
    color: #f5f7fb;
    font-size: 0.9em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.business-shop-snapshot em {
    color: #9fa9b5;
    font-size: 0.74em;
    line-height: 1.35;
    font-style: normal;
}

.business-command-actions {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
}

.business-planning-stage {
    display: grid;
    grid-template-columns: minmax(190px, 0.52fr) minmax(320px, 1.34fr) minmax(190px, 0.54fr);
    gap: 12px;
    align-items: stretch;
}

.business-planning-hero {
    position: relative;
    min-height: 320px;
    overflow: hidden;
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.11);
    --planning-hero-fallback: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%20640%20360'%3E%3Cdefs%3E%3ClinearGradient%20id%3D'g'%20x1%3D'0'%20y1%3D'0'%20x2%3D'1'%20y2%3D'1'%3E%3Cstop%20offset%3D'0'%20stop-color%3D'%23d6c783'%2F%3E%3Cstop%20offset%3D'.45'%20stop-color%3D'%238fc0a0'%2F%3E%3Cstop%20offset%3D'1'%20stop-color%3D'%23477f8d'%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3Crect%20width%3D'640'%20height%3D'360'%20fill%3D'url(%23g)'%2F%3E%3Cpath%20d%3D'M0%20248C120%20210%20172%20290%20282%20242S456%20176%20640%20218V360H0Z'%20fill%3D'%232c8da0'%20opacity%3D'.85'%2F%3E%3Cpath%20d%3D'M36%20100h152M68%20154h190M318%2080h238M294%20140h284'%20stroke%3D'%23e5d6a6'%20stroke-width%3D'18'%20opacity%3D'.72'%2F%3E%3Cg%20fill%3D'%2339342b'%20opacity%3D'.72'%3E%3Crect%20x%3D'58'%20y%3D'74'%20width%3D'50'%20height%3D'36'%2F%3E%3Crect%20x%3D'132'%20y%3D'126'%20width%3D'58'%20height%3D'38'%2F%3E%3Crect%20x%3D'345'%20y%3D'58'%20width%3D'70'%20height%3D'44'%2F%3E%3Crect%20x%3D'472'%20y%3D'118'%20width%3D'74'%20height%3D'44'%2F%3E%3C%2Fg%3E%3Cg%20fill%3D'%238b5136'%20opacity%3D'.55'%3E%3Cpath%20d%3D'M83%2052l40%2024H43zM161%20102l44%2026h-88zM380%2030l54%2030H326zM510%2090l52%2028H458z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
    background:
        linear-gradient(180deg, rgba(6, 10, 14, 0.12), rgba(6, 10, 14, 0.76)),
        url("../images/business/command/business-planning-command-map-thumb-v1.jpg") center / cover no-repeat,
        var(--planning-hero-fallback) center / cover no-repeat,
        rgba(8, 13, 18, 0.72);
}

.business-planning-hero img {
    width: 100%;
    height: 100%;
    min-height: 320px;
    display: block;
    object-fit: cover;
    object-position: 58% 48%;
    filter: saturate(1.05) brightness(1.08);
    transition: transform 0.22s ease;
}

.business-planning-hero .business-art-shade {
    background:
        linear-gradient(0deg, rgba(7, 10, 12, 0.76), rgba(7, 10, 12, 0.06) 64%),
        linear-gradient(90deg, rgba(7, 10, 12, 0.34), rgba(7, 10, 12, 0.08) 70%);
}

.business-planning-map-slot {
    min-width: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    gap: 8px;
}

.business-planning-map-caption {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 9px 11px;
    border: 1px solid rgba(238, 205, 139, 0.22);
    border-radius: 8px;
    background: linear-gradient(135deg, rgba(238, 205, 139, 0.12), rgba(91, 140, 120, 0.08)), rgba(8, 13, 18, 0.72);
    color: rgba(255, 248, 221, 0.9);
}

.business-planning-map-caption span {
    flex: 0 0 auto;
    font-size: 12px;
    letter-spacing: 0.08em;
    color: rgba(245, 210, 146, 0.92);
}

.business-planning-map-caption strong {
    min-width: 0;
    font-size: 12px;
    line-height: 1.45;
    font-weight: 700;
    text-align: right;
    color: rgba(255, 250, 232, 0.86);
}

.business-planning-preview-map {
    min-height: 0;
    pointer-events: none;
}

.business-planning-preview-map .business-grid-map-board {
    overflow: hidden;
}

.business-planning-preview-map .business-grid-cell > span,
.business-planning-preview-map .business-grid-cell > strong,
.business-planning-preview-map .business-grid-cell > em,
.business-planning-preview-map .business-grid-object-mark,
.business-planning-preview-map .business-grid-object-signal,
.business-planning-preview-map .business-grid-object-note,
.business-planning-preview-map .business-grid-status-bubbles,
.business-planning-preview-map .business-map-ownership-chip {
    display: none;
}

.business-planning-preview-map .business-grid-cell {
    cursor: default;
    background: transparent;
    background-image: none !important;
    border-color: rgba(255, 244, 204, 0.055);
    box-shadow: none;
    text-shadow: none;
}

.business-planning-preview-map .business-grid-tile-art,
.business-planning-preview-map .business-grid-building-art,
.business-planning-preview-map .business-grid-decoration-art {
    display: none;
}

.business-planning-stage .business-grid-map-band {
    height: 100%;
    grid-template-columns: minmax(0, 1fr);
}

.business-planning-stage .business-grid-map-board {
    min-height: 320px;
    border-color: rgba(214, 183, 126, 0.26);
    background:
        radial-gradient(circle at 42% 36%, rgba(154, 139, 82, 0.2), transparent 58%),
        linear-gradient(135deg, rgba(44, 62, 48, 0.86), rgba(22, 38, 40, 0.9) 48%, rgba(58, 47, 34, 0.88)),
        rgba(8, 15, 20, 0.9);
    box-shadow: inset 0 0 0 1px rgba(255, 238, 190, 0.05), 0 14px 34px rgba(0, 0, 0, 0.22);
}

.business-planning-stage .business-grid-map-board::before {
    inset: 12px;
    border-radius: 6px;
    background-image:
        linear-gradient(180deg, rgba(245, 223, 174, 0.04), rgba(8, 18, 18, 0.18)),
        url("../images/business/city/business-grid-map-thumb-v1.jpg");
    background-position: center, center;
    background-repeat: no-repeat, no-repeat;
    background-size: cover, cover;
    opacity: 0.8;
    filter: sepia(0.08) saturate(0.96) contrast(0.98);
}

.business-planning-stage .business-grid-map-board::after {
    background-image:
        radial-gradient(circle at 48% 34%, rgba(255, 224, 155, 0.08), transparent 52%),
        linear-gradient(rgba(245, 225, 176, 0.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(245, 225, 176, 0.035) 1px, transparent 1px);
    background-position: center, center, center;
    background-repeat: no-repeat, repeat, repeat;
    background-size: cover, calc(100% / var(--cols)) calc(100% / var(--rows)), calc(100% / var(--cols)) calc(100% / var(--rows));
    opacity: 0.22;
}

.business-planning-stage .business-grid-cells {
    gap: 0;
}

.business-planning-stage .business-grid-cell {
    --planning-cell-tint: rgba(18, 26, 23, 0.1);
    --planning-cell-glow: rgba(255, 231, 170, 0.025);
    border-color: rgba(237, 215, 161, 0.1);
    border-radius: 2px;
    background-image:
        linear-gradient(135deg, var(--planning-cell-glow), rgba(8, 16, 15, 0.1)),
        linear-gradient(180deg, rgba(255, 244, 204, 0.03), var(--planning-cell-tint));
    background-size:
        cover,
        cover;
    background-position:
        center,
        center;
    background-repeat: no-repeat;
    box-shadow: inset 0 0 0 1px rgba(255, 244, 204, 0.025);
    backdrop-filter: none;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.78);
}

.business-planning-stage .business-grid-cell.district {
    --planning-cell-tint: rgba(105, 76, 38, 0.13);
    --planning-cell-glow: rgba(228, 169, 89, 0.04);
    border-color: rgba(228, 169, 89, 0.14);
}

.business-planning-stage .business-grid-cell.plot.occupied {
    --planning-cell-tint: rgba(43, 78, 47, 0.12);
    --planning-cell-glow: rgba(157, 204, 116, 0.035);
    border-color: rgba(157, 204, 116, 0.13);
}

.business-planning-stage .business-grid-cell.plot.free {
    --planning-cell-tint: rgba(26, 80, 73, 0.11);
    --planning-cell-glow: rgba(111, 174, 168, 0.032);
    border-color: rgba(111, 174, 168, 0.13);
}

.business-planning-stage .business-grid-cell.locked {
    --planning-cell-tint: rgba(9, 12, 16, 0.3);
    --planning-cell-glow: rgba(255, 255, 255, 0.01);
    opacity: 0.58;
}

.business-planning-stage .business-grid-cell.water,
.business-planning-stage .business-grid-cell.road {
    --planning-cell-tint: rgba(20, 71, 78, 0.11);
    --planning-cell-glow: rgba(137, 170, 172, 0.028);
    border-color: rgba(137, 170, 172, 0.1);
}

.business-planning-stage .business-grid-cell.road {
    --planning-cell-tint: rgba(82, 64, 38, 0.11);
    --planning-cell-glow: rgba(194, 160, 104, 0.028);
    border-color: rgba(194, 160, 104, 0.1);
}

.business-planning-stage .business-grid-cell.selected {
    --planning-cell-tint: rgba(132, 82, 25, 0.16);
    --planning-cell-glow: rgba(255, 218, 142, 0.08);
}

.business-planning-stage .business-grid-tile-art {
    opacity: 0;
    visibility: hidden;
}

.business-planning-stage .business-grid-building-art.business-grid-building-sprite {
    width: min(54%, 48px);
    max-height: 72%;
    opacity: 0.72;
}

.business-planning-stage .business-grid-detail {
    max-height: 220px;
    overflow-y: auto;
}

.business-planning-side {
    grid-template-rows: auto auto minmax(0, 1fr) auto;
    align-content: stretch;
}

.business-planning-next-step {
    padding: 12px;
    border: 1px solid rgba(126, 203, 172, 0.24);
    border-radius: 9px;
    background:
        radial-gradient(circle at 100% 0%, rgba(126, 203, 172, 0.12), transparent 48%),
        linear-gradient(135deg, rgba(16, 43, 37, 0.72), rgba(11, 17, 23, 0.82));
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.035);
}

.business-planning-next-step span {
    display: inline-flex;
    margin-bottom: 6px;
    font-size: 12px;
    letter-spacing: 0.12em;
    color: rgba(139, 226, 188, 0.82);
}

.business-planning-next-step strong {
    display: block;
    margin-bottom: 7px;
    font-size: 16px;
    color: rgba(255, 246, 219, 0.95);
}

.business-planning-next-step p {
    margin: 0;
    font-size: 12px;
    line-height: 1.6;
    color: rgba(226, 235, 221, 0.74);
}

.business-planning-action-reasons {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 7px;
    align-content: start;
}

.business-planning-action-reasons li {
    display: grid;
    grid-template-columns: minmax(54px, auto) minmax(0, 1fr);
    gap: 8px;
    align-items: center;
    padding: 8px 10px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 8px;
    background: rgba(7, 12, 18, 0.52);
}

.business-planning-action-reasons li.ready {
    border-color: rgba(127, 202, 138, 0.28);
    background: rgba(22, 62, 42, 0.34);
}

.business-planning-action-reasons li.blocked {
    border-color: rgba(210, 161, 93, 0.2);
    background: rgba(58, 42, 24, 0.26);
}

.business-planning-action-reasons span {
    font-size: 12px;
    color: rgba(245, 210, 146, 0.9);
}

.business-planning-action-reasons strong {
    min-width: 0;
    font-size: 12px;
    line-height: 1.4;
    font-weight: 700;
    color: rgba(244, 239, 220, 0.84);
}

.business-planning-side .business-command-stat-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-content: start;
}

.business-planning-side .business-command-actions {
    grid-template-columns: minmax(0, 1fr);
}

.business-planning-stage .business-command-actions .business-planning-entry-action {
    min-height: 64px;
}

.business-commerce-opportunities,
.business-records-claim-grid {
    min-width: 0;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    align-content: stretch;
}

.business-opportunity-card.ready,
.business-records-claim-grid article:has(.active) {
    border-color: rgba(131, 215, 162, 0.28);
    background: rgba(24, 39, 28, 0.58);
}

.business-opportunity-card .business-mini-btn,
.business-records-claim-grid .business-mini-btn {
    width: 100%;
    margin-top: auto;
}

.business-grid-cell.selected {
    border-color: rgba(255, 226, 151, 0.96);
    background:
        linear-gradient(135deg, rgba(73, 47, 19, 0.42), rgba(16, 36, 35, 0.3)),
        rgba(18, 24, 29, 0.86);
    box-shadow:
        0 0 0 2px rgba(255, 226, 151, 0.2),
        inset 0 0 0 1px rgba(255, 255, 255, 0.08),
        0 10px 24px rgba(0, 0, 0, 0.28);
}

.business-grid-cell.selected::before {
    content: "";
    position: absolute;
    inset: 2px;
    z-index: 2;
    border: 1px solid rgba(255, 226, 151, 0.46);
    border-radius: 5px;
    pointer-events: none;
    animation: businessMapSelectedPulse 1.8s ease-out 2;
}

.business-grid-cell.selected::after {
    content: "已选中";
    position: absolute;
    top: 4px;
    right: 4px;
    z-index: 3;
    max-width: calc(100% - 8px);
    padding: 2px 5px;
    border-radius: 999px;
    border: 1px solid rgba(255, 226, 151, 0.38);
    background: rgba(13, 18, 24, 0.84);
    color: #ffe297;
    font-size: 0.58em;
    font-weight: 800;
    line-height: 1.1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    pointer-events: none;
}

.business-main-map-board .business-main-map-cell.selected {
    z-index: 170;
    border-color: rgba(255, 226, 151, 0.82);
    background: transparent;
    box-shadow:
        0 0 0 2px rgba(255, 226, 151, 0.16),
        inset 0 0 0 1px rgba(255, 255, 255, 0.08),
        0 12px 28px rgba(0, 0, 0, 0.28);
}

.business-main-map-board-degrid .business-main-map-cell.selected {
    box-shadow: none;
}

.business-main-map-board .business-main-map-cell.selected::before {
    inset: 10% 8% 8%;
    z-index: 4;
    border-color: rgba(255, 226, 151, 0.52);
    border-radius: 43% 48% 44% 50% / 18% 22% 20% 24%;
}

.business-main-map-board .business-main-map-cell.selected::after {
    z-index: 5;
    border-color: rgba(255, 226, 151, 0.46);
    background: rgba(13, 18, 24, 0.78);
}

.business-main-map-board-degrid .business-main-map-cell.plot.occupied.selected::before {
    z-index: 1;
}

.business-main-map-board-degrid .business-main-map-cell.plot.occupied.selected::after {
    content: "";
    left: 50%;
    right: auto;
    top: auto;
    bottom: -10px;
    z-index: 1;
    width: 78%;
    height: 22%;
    max-width: none;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: radial-gradient(ellipse at center, rgba(255, 226, 151, 0.28), rgba(42, 26, 12, 0.08) 54%, transparent 78%);
    transform: translateX(-50%);
}

.business-main-map-board-degrid .business-main-map-cell.land-sale,
.business-main-map-board-degrid .business-main-map-cell.land-sale:hover:not(:disabled),
.business-main-map-board-degrid .business-main-map-cell.land-sale:focus-visible,
.business-main-map-board-degrid .business-main-map-cell.land-sale.selected {
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.business-main-map-board-degrid .business-main-map-cell.land-sale::after {
    content: "";
    position: absolute;
    inset: auto;
    left: 50%;
    right: auto;
    top: 50%;
    bottom: auto;
    z-index: 6;
    width: var(--land-sale-box-size);
    height: var(--land-sale-box-size);
    box-sizing: border-box;
    border: 2px solid rgba(255, 236, 176, 0.72);
    border-radius: 2px;
    background: transparent;
    box-shadow: 0 0 0 1px rgba(42, 30, 12, 0.16);
    pointer-events: none;
    transform: translate(-50%, -50%);
}

.business-main-map-board-degrid .business-main-map-cell.land-sale::before {
    content: "可建";
    position: absolute;
    inset: auto;
    left: 50%;
    right: auto;
    top: calc(50% - (var(--land-sale-box-size) / 2) - 4px);
    bottom: auto;
    z-index: 7;
    width: max-content;
    height: auto;
    max-width: none;
    padding: 2px 6px;
    border-radius: 999px;
    border: 1px solid rgba(255, 236, 176, 0.52);
    background: rgba(18, 22, 18, 0.72);
    color: #fff2bd;
    font-size: 0.58rem;
    font-weight: 900;
    line-height: 1;
    white-space: nowrap;
    pointer-events: none;
    transform: translate(-50%, -100%);
}

.business-main-map-board-degrid .business-main-map-cell.land-sale:hover:not(:disabled)::after,
.business-main-map-board-degrid .business-main-map-cell.land-sale:focus-visible::after,
.business-main-map-board-degrid .business-main-map-cell.land-sale.selected::after {
    border-color: rgba(255, 244, 204, 0.96);
    background: transparent;
    box-shadow: 0 0 0 2px rgba(255, 216, 120, 0.2);
}

.business-main-map-board-degrid .business-main-map-cell.land-sale.opening-candidate::after {
    border-color: rgba(94, 214, 189, 0.86);
    background: transparent;
}

.business-main-map-board-degrid .business-main-map-cell.land-sale > span,
.business-main-map-board-degrid .business-main-map-cell.land-sale > strong,
.business-main-map-board-degrid .business-main-map-cell.land-sale > em,
.business-main-map-board-degrid .business-main-map-cell.land-sale .business-grid-object-mark,
.business-main-map-board-degrid .business-main-map-cell.land-sale .business-grid-object-signal,
.business-main-map-board-degrid .business-main-map-cell.land-sale .business-grid-object-note,
.business-main-map-board-degrid .business-main-map-cell.land-sale .business-grid-status-bubbles {
    display: none;
}

.business-main-map-board-degrid .business-main-map-cell.land-sale .business-map-ownership-chip {
    display: none;
    bottom: calc(50% + (var(--land-sale-box-size) / 2) + 6px);
    max-width: max-content;
    padding: 3px 7px;
    border-radius: 3px;
    color: #fff7de;
    background: rgba(3, 7, 11, 0.72);
}

.business-main-map-board-degrid .business-main-map-cell.land-sale:hover:not(:disabled) .business-map-ownership-chip,
.business-main-map-board-degrid .business-main-map-cell.land-sale:focus-visible .business-map-ownership-chip,
.business-main-map-board-degrid .business-main-map-cell.land-sale.selected .business-map-ownership-chip {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}

.business-planning-stage .business-grid-cell.selected {
    --planning-cell-tint: rgba(132, 82, 25, 0.16);
    --planning-cell-glow: rgba(255, 218, 142, 0.08);
    background-image:
        linear-gradient(135deg, var(--planning-cell-glow), rgba(8, 16, 15, 0.1)),
        linear-gradient(180deg, rgba(255, 244, 204, 0.035), var(--planning-cell-tint));
    background-size:
        cover,
        cover;
    background-position:
        center,
        center;
    background-repeat: no-repeat;
    box-shadow:
        0 0 0 2px rgba(255, 226, 151, 0.18),
        inset 0 0 0 1px rgba(255, 255, 255, 0.08),
        0 10px 24px rgba(0, 0, 0, 0.2);
}

.business-planning-stage .business-planning-preview-map .business-grid-cell,
.business-planning-stage .business-planning-preview-map .business-grid-cell.selected {
    background-image: none !important;
    box-shadow: none;
}

.business-feedback-target {
    --business-feedback-main: #ffd28c;
    --business-feedback-bg: rgba(58, 43, 20, 0.76);
    position: relative;
    border-color: rgba(255, 210, 140, 0.58) !important;
    box-shadow:
        0 0 0 1px rgba(255, 210, 140, 0.18),
        0 0 22px rgba(255, 210, 140, 0.14);
    border-color: color-mix(in srgb, var(--business-feedback-main) 72%, transparent) !important;
    box-shadow:
        0 0 0 1px color-mix(in srgb, var(--business-feedback-main) 24%, transparent),
        0 0 22px color-mix(in srgb, var(--business-feedback-main) 18%, transparent);
    animation: businessFeedbackTarget 860ms ease-out;
}

.business-feedback-tone-select {
    --business-feedback-main: #8fd3ff;
    --business-feedback-bg: rgba(19, 48, 61, 0.78);
}

.business-feedback-tone-build {
    --business-feedback-main: #ffd28c;
    --business-feedback-bg: rgba(64, 45, 18, 0.78);
}

.business-feedback-tone-trade {
    --business-feedback-main: #9be15d;
    --business-feedback-bg: rgba(30, 55, 28, 0.78);
}

.business-feedback-tone-work {
    --business-feedback-main: #7bc2d1;
    --business-feedback-bg: rgba(20, 47, 54, 0.78);
}

.business-feedback-label {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 12;
    max-width: calc(100% - 16px);
    padding: 3px 8px;
    border-radius: 999px;
    border: 1px solid rgba(255, 210, 140, 0.42);
    border: 1px solid color-mix(in srgb, var(--business-feedback-main) 46%, transparent);
    background: var(--business-feedback-bg);
    color: #fff7e6;
    font-size: 0.74em;
    font-weight: 800;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    pointer-events: none;
    box-shadow: 0 5px 14px rgba(0, 0, 0, 0.26);
}

.business-grid-cell .business-feedback-label {
    top: auto;
    right: 5px;
    bottom: 5px;
    max-width: calc(100% - 10px);
    padding: 2px 5px;
    font-size: 0.58em;
}

.business-inline-feedback {
    min-width: 0;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    margin-bottom: 10px;
    padding: 9px 11px;
    border: 1px solid rgba(255, 210, 140, 0.34);
    border: 1px solid color-mix(in srgb, var(--business-feedback-main) 38%, transparent);
    border-radius: 8px;
    background:
        linear-gradient(135deg, rgba(255, 210, 140, 0.11), rgba(255, 255, 255, 0.025)),
        rgba(10, 15, 20, 0.86);
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--business-feedback-main) 12%, transparent), rgba(255, 255, 255, 0.025)),
        rgba(10, 15, 20, 0.86);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.18);
    animation: businessFeedbackBanner 220ms ease-out;
}

.business-inline-feedback > span {
    max-width: 112px;
    padding: 4px 8px;
    border-radius: 999px;
    border: 1px solid rgba(255, 210, 140, 0.42);
    border: 1px solid color-mix(in srgb, var(--business-feedback-main) 44%, transparent);
    background: var(--business-feedback-bg);
    color: #fff7e6;
    font-size: 0.76em;
    font-weight: 800;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.business-inline-feedback div {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.business-inline-feedback strong {
    min-width: 0;
    color: #f5f7fb;
    font-size: 0.92em;
    line-height: 1.3;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.business-inline-feedback em {
    min-width: 0;
    color: #c6d0da;
    font-size: 0.78em;
    font-style: normal;
    line-height: 1.35;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@keyframes businessMapSelectedPulse {
    0% {
        opacity: 0.82;
        transform: scale(0.96);
    }
    100% {
        opacity: 0;
        transform: scale(1.12);
    }
}

@keyframes businessFeedbackTarget {
    0% {
        transform: translateY(0);
        box-shadow:
            0 0 0 0 color-mix(in srgb, var(--business-feedback-main) 0%, transparent),
            0 0 0 color-mix(in srgb, var(--business-feedback-main) 0%, transparent);
    }
    38% {
        transform: translateY(-1px);
    }
    100% {
        transform: translateY(0);
    }
}

@keyframes businessFeedbackBanner {
    from {
        opacity: 0;
        transform: translateY(-6px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (max-width: 720px) {
    .business-grid-cell.selected::after {
        content: "选";
        padding: 2px 4px;
    }

    .business-feedback-label {
        top: 6px;
        right: 6px;
        max-width: calc(100% - 12px);
        font-size: 0.66em;
    }

    .business-inline-feedback {
        grid-template-columns: minmax(0, 1fr);
        gap: 7px;
    }

    .business-inline-feedback > span {
        max-width: 100%;
        width: max-content;
    }

    .business-inline-feedback strong,
    .business-inline-feedback em {
        white-space: normal;
        overflow-wrap: anywhere;
    }
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(15px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* 折叠面板 */
.accordion-item {
    margin-bottom: 15px;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    transition: box-shadow 0.3s ease;
}

.accordion-item:hover {
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.accordion-header {
    padding: 16px 20px;
    background: linear-gradient(to right, #f8f9fa, #fff);
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-weight: 600;
    font-size: 15px;
    color: #333;
    transition: all 0.3s ease;
    user-select: none;
}

.accordion-header:hover {
    background: linear-gradient(to right, #e8f4f8, #f0f8ff);
}

.accordion-item.expanded .accordion-header {
    background: linear-gradient(to right, #e8f4f8, #fff);
    border-bottom: 1px solid #e0e0e0;
    color: #3498db;
}

.accordion-header-left {
    display: flex;
    align-items: center;
    gap: 10px;
}

.accordion-icon {
    font-size: 18px;
}

.accordion-count {
    display: inline-block;
    background: #3498db;
    color: white;
    font-size: 12px;
    padding: 2px 8px;
    border-radius: 12px;
    margin-left: 8px;
    font-weight: 600;
}

.accordion-content {
    padding: 0;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease-out, padding 0.4s ease-out;
}

.accordion-item.expanded .accordion-content {
    padding: 20px;
    max-height: 10000px;
    transition: max-height 0.5s ease-in, padding 0.5s ease-in;
}

.accordion-arrow {
    transition: transform 0.3s ease;
    font-size: 14px;
    color: #999;
    font-weight: bold;
}

.accordion-item.expanded .accordion-arrow {
    transform: rotate(90deg);
    color: #3498db;
}

/* 标签页内的分组标题 */
.business-section-title {
    font-size: 18px;
    font-weight: 600;
    color: #2c3e50;
    margin: 25px 0 15px;
    padding-bottom: 10px;
    border-bottom: 2px solid #ecf0f1;
    display: flex;
    align-items: center;
    gap: 10px;
}

.business-section-title::before {
    content: '';
    width: 4px;
    height: 20px;
    background: linear-gradient(to bottom, #3498db, #2980b9);
    border-radius: 2px;
}

/* 空状态提示 */
.business-empty-state {
    text-align: center;
    padding: 60px 20px;
    color: #95a5a6;
}

.business-empty-state-icon {
    font-size: 48px;
    margin-bottom: 15px;
    opacity: 0.5;
}

.business-empty-state-text {
    font-size: 16px;
    margin-bottom: 10px;
}

.business-empty-state-hint {
    font-size: 14px;
    color: #bdc3c7;
}

/* 快捷操作区域 */
.business-quick-actions {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 15px;
    margin-bottom: 25px;
}

.business-quick-action-card {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    padding: 20px;
    border-radius: 10px;
    cursor: pointer;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.business-quick-action-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
}

.business-quick-action-card h4 {
    margin: 0 0 8px 0;
    font-size: 16px;
}

.business-quick-action-card p {
    margin: 0;
    font-size: 13px;
    opacity: 0.9;
}

/* 移动端适配 */
@media (max-width: 768px) {
    .business-tabs {
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        padding: 8px 10px 0;
    }

    .business-tabs::-webkit-scrollbar {
        display: none;
    }

    .business-tab {
        padding: 10px 16px;
        font-size: 14px;
        white-space: nowrap;
        flex-shrink: 0;
    }

    .business-tab-summary {
        grid-template-columns: 1fr;
        gap: 10px;
        padding: 10px;
    }

    .business-tab-summary-chips {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .business-subnav {
        display: flex;
        gap: 8px;
        overflow-x: auto;
        padding-bottom: 3px;
        scrollbar-width: thin;
    }

    .business-subnav-btn {
        flex: 0 0 142px;
    }

    .business-art-ribbon {
        grid-template-columns: 1fr;
        gap: 8px;
        padding: 9px;
    }

    .business-art-ribbon-head {
        min-height: auto;
        padding: 8px 10px;
    }

    .business-art-ribbon-card {
        flex-basis: 118px;
        height: 70px;
    }

    .business-art-lightbox {
        padding: 10px;
    }

    .business-art-lightbox-panel {
        width: 100%;
        max-height: 96vh;
        grid-template-columns: 1fr 1fr;
        grid-template-rows: minmax(0, 1fr) auto auto;
        gap: 10px;
        padding: 12px;
    }

    .business-art-lightbox-figure {
        grid-column: 1 / -1;
        grid-row: 1;
    }

    .business-art-lightbox-figure img {
        max-height: 62vh;
    }

    .business-art-lightbox-figure figcaption {
        align-items: flex-start;
        flex-direction: column;
        gap: 4px;
    }

    .business-art-lightbox-figure figcaption strong {
        max-width: 100%;
        text-align: left;
    }

    .business-art-lightbox-nav {
        min-height: 36px;
        writing-mode: horizontal-tb;
    }

    .business-art-lightbox-nav.prev {
        grid-column: 1;
        grid-row: 2;
    }

    .business-art-lightbox-nav.next {
        grid-column: 2;
        grid-row: 2;
    }

    .business-art-lightbox-strip {
        grid-column: 1 / -1;
        grid-row: 3;
    }

    .business-art-lightbox-strip button {
        flex-basis: 72px;
        height: 50px;
    }

    .business-command-scene-dialog {
        padding: 10px;
    }

    .business-command-scene-dialog-panel {
        width: 100%;
        max-height: 96vh;
        grid-template-columns: 1fr;
        gap: 10px;
        overflow-y: auto;
        padding: 12px;
    }

    .business-command-scene-figure img {
        min-height: 220px;
        max-height: 42vh;
    }

    .business-command-scene-body {
        grid-template-rows: none;
        padding: 0 2px 2px;
    }

    .business-command-scene-metrics,
    .business-command-scene-actions {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .business-main-map-overview-entry {
        align-items: stretch;
        flex-direction: column;
    }

    .business-main-map-overlay {
        place-items: stretch;
        padding: 4px;
    }

    .business-main-map-shell {
        width: calc(100vw - 8px);
        height: calc(100vh - 8px);
        height: calc(100dvh - 8px);
        gap: 9px;
        padding: 8px;
    }

    .business-main-map-topbar {
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 9px;
    }

    .business-main-map-title strong {
        font-size: 0.98rem;
    }

    .business-main-map-hud {
        grid-column: 1 / -1;
        grid-row: 2;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        order: 3;
    }

    .business-main-map-close {
        grid-column: 2;
        grid-row: 1;
    }

    .business-main-map-layout {
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: minmax(0, 1fr) auto;
        gap: 9px;
    }

    .business-main-map-board .business-grid-cells {
        grid-template-rows: repeat(var(--rows), minmax(34px, 1fr));
        gap: 1px;
        padding: 7px;
    }

    .business-main-map-board-degrid .business-main-map-ground-overlays {
        inset: 7px;
    }

    .business-main-map-board-degrid .business-town-life-layer {
        inset: 7px;
    }

    .business-main-map-board-degrid .business-main-map-ground-overlay {
        --overlay-alpha: 0.72;
    }

    .business-main-map-board-degrid .business-main-map-street-corridor {
        --street-alpha: 0.68;
        filter: saturate(0.72) contrast(0.86) brightness(1.02) blur(0.12px);
    }

    .business-main-map-board-degrid .business-main-map-street-detail {
        --detail-alpha: 0.72;
        filter: saturate(0.7) contrast(0.82) brightness(0.98) blur(0.14px);
    }

    .business-main-map-board-degrid .business-main-map-city-decoration {
        --decor-alpha: 1;
        filter: saturate(1) contrast(1) brightness(1);
    }

    .business-main-map-board-degrid .business-main-map-region-label {
        max-width: 7.5em;
        padding: 1px 4px;
        font-size: 0.58rem;
        opacity: 0.64;
    }

    .business-main-map-board-degrid .business-main-map-city-decoration--dock-a,
    .business-main-map-board-degrid .business-main-map-city-decoration--market-corner-a,
    .business-main-map-board-degrid .business-main-map-city-decoration--well-stone-a,
    .business-main-map-board-degrid .business-main-map-city-decoration--old-courtyard-b,
    .business-main-map-board-degrid .business-main-map-city-decoration--street-house-b,
    .business-main-map-board-degrid .business-main-map-city-decoration--abandoned-workshop-a,
    .business-main-map-board-degrid .business-main-map-city-decoration--flower-courtyard-a,
    .business-main-map-board-degrid .business-main-map-city-decoration--bamboo-clump-a,
    .business-main-map-board-degrid .business-main-map-city-decoration--tree-shade-grass-a,
    .business-main-map-board-degrid .business-main-map-city-decoration--garden-greenery-a {
        display: none;
    }

    .business-main-map-board-degrid.business-city-decor-editor-active .business-main-map-city-decoration--dock-a,
    .business-main-map-board-degrid.business-city-decor-editor-active .business-main-map-city-decoration--market-corner-a,
    .business-main-map-board-degrid.business-city-decor-editor-active .business-main-map-city-decoration--well-stone-a,
    .business-main-map-board-degrid.business-city-decor-editor-active .business-main-map-city-decoration--old-courtyard-b,
    .business-main-map-board-degrid.business-city-decor-editor-active .business-main-map-city-decoration--street-house-b,
    .business-main-map-board-degrid.business-city-decor-editor-active .business-main-map-city-decoration--abandoned-workshop-a,
    .business-main-map-board-degrid.business-city-decor-editor-active .business-main-map-city-decoration--flower-courtyard-a,
    .business-main-map-board-degrid.business-city-decor-editor-active .business-main-map-city-decoration--bamboo-clump-a,
    .business-main-map-board-degrid.business-city-decor-editor-active .business-main-map-city-decoration--tree-shade-grass-a,
    .business-main-map-board-degrid.business-city-decor-editor-active .business-main-map-city-decoration--garden-greenery-a {
        display: block;
    }

    .business-main-map-board-degrid .business-main-map-ground-overlay--loess-b,
    .business-main-map-board-degrid .business-main-map-ground-overlay--farm-b,
    .business-main-map-board-degrid .business-main-map-ground-overlay--corner-b {
        display: none;
    }

    .business-main-map-board-degrid .business-grid-cells {
        gap: 0;
    }

    .business-main-map-layout-preview {
        inset: 8px;
        gap: 1px;
    }

    .business-main-map-layout-piece img {
        width: min(96%, 34px);
    }

    .business-main-map-cell {
        min-height: 34px;
        padding: 4px 5px;
        border-radius: 3px;
    }

    .business-grid-object-mark {
        top: 3px;
        left: 3px;
        width: 16px;
        height: 16px;
        font-size: 0.52rem;
    }

    .business-grid-object-signal {
        right: 3px;
        bottom: 3px;
        padding: 2px 4px;
        font-size: 0.5rem;
    }

    .business-grid-object-note {
        display: none;
    }

    .business-grid-status-bubbles {
        top: 22px;
        right: 3px;
        gap: 2px;
        max-width: calc(100% - 6px);
    }

    .business-grid-status-bubbles b {
        min-width: 15px;
        max-width: 24px;
        padding: 2px 3px;
        font-size: 0.48rem;
    }

    .business-main-map-cell span {
        font-size: 0.56rem;
    }

    .business-main-map-cell strong {
        font-size: 0.64rem;
        line-height: 1.12;
    }

    .business-main-map-cell em {
        display: none;
    }

    .business-main-map-cell .business-grid-building-art {
        width: min(58%, 36px);
    }

    .business-main-map-cell .business-grid-building-art.business-grid-building-sprite {
        bottom: -3px;
        width: min(84%, 50px);
        max-height: 98%;
    }

    .business-map-ownership-chip {
        max-width: min(96%, 72px);
        padding: 3px 5px;
        font-size: 0.56rem;
    }

    .business-main-map-board-degrid .business-main-map-cell.plot .business-map-parcel-base {
        left: 7%;
        right: 6%;
        top: 10%;
        bottom: 8%;
    }

    .business-main-map-board-degrid .business-main-map-cell.plot.occupied .business-grid-building-art {
        bottom: -2px;
        width: min(118%, 54px);
        max-height: 116%;
    }

    .business-main-map-board-degrid .business-main-map-cell.plot.occupied .business-grid-building-art.business-grid-building-sprite {
        width: min(108%, 52px);
        max-height: 112%;
    }

    .business-main-map-cell .business-grid-decoration-art {
        width: min(44%, 30px);
    }

    .business-main-map-panel {
        max-height: min(40vh, 340px);
        padding: 10px;
        gap: 8px;
    }

    .business-main-map-mode-toggle {
        width: min(310px, 100%);
        grid-template-columns: minmax(110px, 1fr) minmax(128px, 1fr);
    }

    .business-main-map-mode-toggle button,
    .business-main-map-advanced-modes summary {
        min-height: 24px;
        padding: 4px 5px;
        font-size: 0.66rem;
    }

    .business-main-map-advanced-mode-list {
        width: min(240px, 82vw);
    }

    .business-main-map-layout.layout-editor-mode {
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: minmax(0, 1fr) auto;
    }

    .business-main-map-layout.city-map-mode {
        --business-city-canvas-width: 1540px;
        --business-city-canvas-height: 980px;
    }

    .business-main-map-layout.city-map-mode:not(.decor-editor-mode):not(.map-layout-editor-mode) {
        grid-template-rows: auto minmax(0, 1fr);
        align-content: start;
    }

    .business-main-map-layout.city-map-mode:not(.decor-editor-mode):not(.map-layout-editor-mode) .business-main-map-board-wrap {
        overflow: auto;
        scrollbar-gutter: stable both-edges;
        background: rgba(3, 8, 11, 0.34);
    }

    .business-main-map-layout.city-map-mode:not(.decor-editor-mode):not(.map-layout-editor-mode) .business-main-map-board {
        width: max(100%, var(--business-city-canvas-width));
        height: max(100%, var(--business-city-canvas-height));
        min-width: var(--business-city-canvas-width);
        min-height: var(--business-city-canvas-height);
        aspect-ratio: 1540 / 980;
    }

    .business-main-map-layout.city-map-mode:not(.decor-editor-mode):not(.map-layout-editor-mode) .business-main-map-cell {
        min-height: 0;
        padding: 1px;
    }

    .business-main-map-layout.city-map-mode:not(.decor-editor-mode):not(.map-layout-editor-mode) .business-main-map-cell > span,
    .business-main-map-layout.city-map-mode:not(.decor-editor-mode):not(.map-layout-editor-mode) .business-main-map-cell > strong,
    .business-main-map-layout.city-map-mode:not(.decor-editor-mode):not(.map-layout-editor-mode) .business-main-map-cell > em,
    .business-main-map-layout.city-map-mode:not(.decor-editor-mode):not(.map-layout-editor-mode) .business-grid-object-note,
    .business-main-map-layout.city-map-mode:not(.decor-editor-mode):not(.map-layout-editor-mode) .business-grid-status-bubbles {
        display: none;
    }

    .business-main-map-layout.city-map-mode:not(.decor-editor-mode):not(.map-layout-editor-mode) .business-map-ownership-chip {
        max-width: min(98%, 48px);
        padding: 1px 3px;
        font-size: 0.44rem;
    }

    .business-main-map-layout.decor-editor-mode {
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: minmax(0, 1fr) auto;
    }

    .business-main-map-layout.map-layout-editor-mode {
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: minmax(0, 1fr) auto;
    }

    .business-city-decor-editor-list {
        grid-template-columns: repeat(5, minmax(68px, 1fr));
        overflow-x: auto;
        overflow-y: hidden;
        padding: 0 0 2px;
    }

    .business-city-decor-editor-item {
        min-height: 50px;
        grid-template-columns: 1fr;
        justify-items: center;
        gap: 4px;
        padding: 6px;
    }

    .business-city-decor-editor-item img {
        grid-row: auto;
        width: 38px;
        height: 28px;
    }

    .business-city-decor-editor-item span,
    .business-city-decor-editor-item em {
        grid-column: auto;
        max-width: 100%;
        font-size: 0.66rem;
        text-align: center;
    }

    .business-city-decor-editor-item em {
        display: none;
    }

    .business-city-decor-editor-controls {
        gap: 6px;
        padding: 8px;
    }

    .business-city-decor-editor-nudges {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .business-map-layout-editor-list {
        grid-template-columns: repeat(3, minmax(92px, 1fr));
        overflow-x: auto;
        overflow-y: hidden;
        padding: 0 0 2px;
    }

    .business-map-layout-editor-item {
        min-height: 54px;
        grid-template-columns: 1fr;
        justify-items: center;
        gap: 3px;
        padding: 6px;
    }

    .business-map-layout-editor-item span,
    .business-map-layout-editor-item strong,
    .business-map-layout-editor-item em {
        grid-column: auto;
        grid-row: auto;
        max-width: 100%;
        text-align: center;
    }

    .business-map-layout-editor-item span {
        width: auto;
        min-width: 38px;
        padding: 3px 5px;
        font-size: 0.62rem;
    }

    .business-map-layout-editor-item strong {
        font-size: 0.68rem;
    }

    .business-map-layout-editor-item em {
        font-size: 0.6rem;
    }

    .business-layout-editor-board .business-layout-cells {
        gap: 1px;
        padding: 6px;
    }

    .business-layout-cell {
        border-radius: 3px;
    }

    .business-layout-cell span,
    .business-layout-cell i {
        display: none;
    }

    .business-layout-cell img {
        width: 118%;
        max-height: 118%;
    }

    .business-layout-editor-panel {
        max-height: 36vh;
    }

    .business-layout-item-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 6px;
    }

    .business-layout-selected-item,
    .business-layout-item {
        grid-template-columns: 34px minmax(0, 1fr);
        gap: 6px;
    }

    .business-layout-selected-item img,
    .business-layout-item img {
        width: 34px;
        height: 34px;
    }

    .business-layout-selected-item strong,
    .business-layout-item strong {
        font-size: 0.72rem;
    }

    .business-layout-selected-item em,
    .business-layout-item em {
        font-size: 0.62rem;
    }

    .business-main-map-object-strip {
        grid-template-columns: auto minmax(0, 0.65fr) minmax(0, 1fr);
        padding: 6px 7px;
    }

    .business-main-map-object-strip span {
        width: 20px;
        height: 20px;
        font-size: 0.64rem;
    }

    .business-main-map-object-strip .business-harvest-crop-select {
        height: 28px;
        padding: 3px 6px;
        font-size: 0.7rem;
    }

    .business-main-map-bubbles {
        gap: 4px;
    }

    .business-main-map-bubbles span {
        padding: 4px 6px;
        font-size: 0.66rem;
    }

    .business-main-map-opening-banner {
        grid-template-columns: minmax(0, 1fr);
    }

    .business-main-map-opening-banner button {
        grid-column: 1;
        grid-row: auto;
        width: 100%;
    }

    .business-main-map-detail-row {
        grid-template-columns: 54px minmax(0, 1fr);
        padding: 7px 8px;
    }

    .business-main-map-panel-actions {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        max-height: 118px;
    }

    .business-action-deck {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 10px;
        overflow-x: visible;
        overflow-y: visible;
        padding: 10px;
    }

    .business-action-deck-head,
    .business-action-card {
        width: 100%;
    }

    .business-action-deck.is-empty {
        display: grid;
        grid-template-columns: 1fr;
    }

    .business-action-deck.is-empty .business-action-deck-head {
        flex-basis: auto;
    }

    .business-city-command {
        grid-template-columns: 1fr;
    }

    .business-city-command-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .business-industry-command,
    .business-commerce-command,
    .business-records-command,
    .business-planning-stage {
        grid-template-columns: 1fr;
        padding: 10px;
    }

    .business-command-visual,
    .business-command-visual img {
        min-height: 150px;
    }

    .business-command-main,
    .business-planning-side {
        grid-template-rows: none;
    }

    .business-command-supply-card {
        grid-template-columns: 96px minmax(0, 1fr);
    }

    .business-command-supply-card img {
        height: 104px;
    }

    .business-command-supply-actions {
        grid-column: 1 / -1;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        min-width: 0;
    }

    .business-outskirts-supply-hint {
        grid-template-columns: minmax(0, 1fr);
        gap: 5px;
    }

    .business-outskirts-supply-hint span {
        white-space: normal;
    }

    .business-command-shop-strip,
    .business-command-scene-strip,
    .business-commerce-opportunities,
    .business-records-claim-grid {
        display: flex;
        gap: 8px;
        overflow-x: auto;
        padding-bottom: 2px;
        scrollbar-width: thin;
    }

    .business-shop-snapshot {
        flex: 0 0 230px;
    }

    .business-command-scene-card {
        flex: 0 0 174px;
    }

    .business-opportunity-card,
    .business-records-claim-grid article {
        flex: 0 0 128px;
    }

    .business-command-actions {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .business-planning-hero,
    .business-planning-hero img,
    .business-planning-stage .business-grid-map-board {
        min-height: 220px;
    }

    .business-planning-hero {
        background-position: center, 80% center, 80% center, center;
    }

    .business-planning-hero img {
        object-position: 80% 46%;
        filter: saturate(1.18) brightness(1.24) contrast(1.04);
    }

    .business-planning-hero .business-art-shade {
        background:
            linear-gradient(0deg, rgba(7, 10, 12, 0.62), rgba(7, 10, 12, 0.03) 58%),
            linear-gradient(90deg, rgba(7, 10, 12, 0.2), rgba(7, 10, 12, 0.04) 72%);
    }

    .business-planning-stage .business-grid-map-board {
        height: auto;
        min-height: 170px;
        max-height: 220px;
        aspect-ratio: 16 / 9;
        --planning-map-fallback: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%20640%20360'%3E%3Cdefs%3E%3ClinearGradient%20id%3D'p'%20x1%3D'0'%20y1%3D'0'%20x2%3D'1'%20y2%3D'1'%3E%3Cstop%20offset%3D'0'%20stop-color%3D'%23e1d2a4'%2F%3E%3Cstop%20offset%3D'1'%20stop-color%3D'%23aeb681'%2F%3E%3C%2FlinearGradient%3E%3Cfilter%20id%3D'n'%3E%3CfeTurbulence%20type%3D'fractalNoise'%20baseFrequency%3D'.9'%20numOctaves%3D'2'%20stitchTiles%3D'stitch'%2F%3E%3CfeColorMatrix%20type%3D'saturate'%20values%3D'0'%2F%3E%3CfeComponentTransfer%3E%3CfeFuncA%20type%3D'table'%20tableValues%3D'0%20.08'%2F%3E%3C%2FfeComponentTransfer%3E%3C%2Ffilter%3E%3C%2Fdefs%3E%3Crect%20width%3D'640'%20height%3D'360'%20fill%3D'url(%23p)'%2F%3E%3Cpath%20d%3D'M0%20270%20C95%20238%20135%20305%20220%20270%20S360%20222%20470%20258%20560%20327%20640%20285%20L640%20360%20L0%20360Z'%20fill%3D'%235d9aa0'%20opacity%3D'.78'%2F%3E%3Cpath%20d%3D'M40%2070%20H592%20M42%20132%20H585%20M52%20194%20H570%20M128%2044%20V238%20M220%2038%20V245%20M330%2040%20V252%20M438%2050%20V246%20M535%2064%20V256'%20stroke%3D'%23d9c18b'%20stroke-width%3D'13'%20opacity%3D'.58'%2F%3E%3Cpath%20d%3D'M40%2070%20H592%20M42%20132%20H585%20M52%20194%20H570%20M128%2044%20V238%20M220%2038%20V245%20M330%2040%20V252%20M438%2050%20V246%20M535%2064%20V256'%20stroke%3D'%237d6a45'%20stroke-width%3D'4'%20opacity%3D'.3'%2F%3E%3Cg%20fill%3D'%23526f45'%20opacity%3D'.5'%3E%3Crect%20x%3D'50'%20y%3D'82'%20width%3D'60'%20height%3D'38'%20rx%3D'4'%2F%3E%3Crect%20x%3D'54'%20y%3D'145'%20width%3D'58'%20height%3D'35'%20rx%3D'4'%2F%3E%3Crect%20x%3D'145'%20y%3D'82'%20width%3D'52'%20height%3D'38'%20rx%3D'4'%2F%3E%3Crect%20x%3D'146'%20y%3D'146'%20width%3D'52'%20height%3D'36'%20rx%3D'4'%2F%3E%3C%2Fg%3E%3Cg%20fill%3D'%233f3a32'%20opacity%3D'.64'%3E%3Crect%20x%3D'242'%20y%3D'76'%20width%3D'58'%20height%3D'38'%20rx%3D'4'%2F%3E%3Crect%20x%3D'354'%20y%3D'76'%20width%3D'58'%20height%3D'38'%20rx%3D'4'%2F%3E%3Crect%20x%3D'461'%20y%3D'84'%20width%3D'52'%20height%3D'35'%20rx%3D'4'%2F%3E%3Crect%20x%3D'244'%20y%3D'142'%20width%3D'58'%20height%3D'38'%20rx%3D'4'%2F%3E%3Crect%20x%3D'354'%20y%3D'142'%20width%3D'58'%20height%3D'38'%20rx%3D'4'%2F%3E%3Crect%20x%3D'462'%20y%3D'148'%20width%3D'52'%20height%3D'35'%20rx%3D'4'%2F%3E%3Crect%20x%3D'252'%20y%3D'204'%20width%3D'50'%20height%3D'32'%20rx%3D'4'%2F%3E%3Crect%20x%3D'358'%20y%3D'204'%20width%3D'50'%20height%3D'32'%20rx%3D'4'%2F%3E%3Crect%20x%3D'462'%20y%3D'204'%20width%3D'52'%20height%3D'32'%20rx%3D'4'%2F%3E%3C%2Fg%3E%3Cg%20fill%3D'%238b5136'%20opacity%3D'.42'%3E%3Cpath%20d%3D'M269%2062%20l24%2018%20h-48z'%2F%3E%3Cpath%20d%3D'M381%2062%20l24%2018%20h-48z'%2F%3E%3Cpath%20d%3D'M269%20128%20l24%2018%20h-48z'%2F%3E%3Cpath%20d%3D'M381%20128%20l24%2018%20h-48z'%2F%3E%3Cpath%20d%3D'M488%2070%20l22%2016%20h-44z'%2F%3E%3C%2Fg%3E%3Crect%20width%3D'640'%20height%3D'360'%20filter%3D'url(%23n)'%2F%3E%3Crect%20x%3D'8'%20y%3D'8'%20width%3D'624'%20height%3D'344'%20fill%3D'none'%20stroke%3D'%237b6240'%20stroke-width%3D'5'%20opacity%3D'.25'%2F%3E%3C%2Fsvg%3E");
        border-color: rgba(238, 205, 139, 0.42);
        background:
            linear-gradient(180deg, rgba(247, 228, 177, 0.2), rgba(91, 87, 57, 0.2)),
            rgba(26, 35, 29, 0.84);
        box-shadow: inset 0 0 0 1px rgba(255, 238, 190, 0.12), 0 14px 28px rgba(0, 0, 0, 0.18);
    }

    .business-planning-stage .business-grid-map-board::before {
        inset: 6px;
        background-image:
            linear-gradient(180deg, rgba(255, 248, 218, 0.05), rgba(255, 248, 218, 0)),
            url("../images/business/city/business-grid-map-thumb-v1.jpg"),
            var(--planning-map-fallback);
        background-position: center, center, center;
        background-repeat: no-repeat, no-repeat, no-repeat;
        background-size: cover, cover, cover;
        opacity: 1;
        filter: sepia(0.02) saturate(1.12) contrast(1.05) brightness(1.18);
    }

    .business-planning-stage .business-grid-map-board::after {
        inset: 6px;
        background-image:
            radial-gradient(circle at 50% 36%, rgba(255, 232, 166, 0.12), transparent 55%),
            linear-gradient(rgba(112, 81, 42, 0.1) 1px, transparent 1px),
            linear-gradient(90deg, rgba(112, 81, 42, 0.1) 1px, transparent 1px);
        background-size: cover, calc(100% / var(--cols)) calc(100% / var(--rows)), calc(100% / var(--cols)) calc(100% / var(--rows));
        opacity: 0.18;
    }

    .business-planning-stage .business-grid-cells {
        min-height: 0;
        height: 100%;
        grid-template-rows: repeat(var(--rows), minmax(0, 1fr));
        gap: 0;
        padding: 6px;
    }

    .business-planning-stage .business-grid-cell {
        min-height: 0;
        padding: 0;
        border-radius: 1px;
        border-color: rgba(255, 244, 204, 0.035);
        background: transparent;
        box-shadow: none;
    }

    .business-planning-stage .business-grid-cell > span,
    .business-planning-stage .business-grid-cell > strong,
    .business-planning-stage .business-grid-cell > em,
    .business-planning-stage .business-grid-object-mark,
    .business-planning-stage .business-grid-object-signal,
    .business-planning-stage .business-grid-object-note,
    .business-planning-stage .business-grid-status-bubbles {
        display: none;
    }

    .business-planning-stage .business-grid-map-band {
        grid-template-columns: 1fr;
    }

    .business-planning-stage .business-grid-detail {
        max-height: none;
    }

    .accordion-header {
        padding: 14px 16px;
        font-size: 14px;
    }

    .accordion-item.expanded .accordion-content {
        padding: 16px;
    }

    .business-section-title {
        font-size: 16px;
        margin: 20px 0 12px;
    }

    .business-quick-actions {
        grid-template-columns: 1fr;
        gap: 12px;
    }
}

/* 平板适配 */
@media (min-width: 769px) and (max-width: 1024px) {
    .business-tabs {
        padding: 10px 12px 0;
    }

    .business-tab {
        padding: 11px 18px;
        font-size: 14px;
    }

    .business-tab-summary {
        grid-template-columns: 1fr;
    }

    .business-subnav {
        grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
    }

    .business-city-command {
        grid-template-columns: 1fr;
    }

    .business-industry-command,
    .business-commerce-command,
    .business-records-command {
        grid-template-columns: minmax(200px, 0.76fr) minmax(0, 1.24fr);
    }

    .business-planning-stage {
        grid-template-columns: 1fr;
    }

    .business-planning-stage .business-grid-map-band {
        grid-template-columns: minmax(0, 1.2fr) minmax(210px, 0.8fr);
    }

    .business-command-actions,
    .business-commerce-opportunities,
    .business-records-claim-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .business-command-supply-card {
        grid-template-columns: minmax(96px, 0.28fr) minmax(0, 1fr);
    }

    .business-command-supply-actions {
        grid-column: 1 / -1;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        min-width: 0;
    }

    .business-quick-actions {
        grid-template-columns: repeat(2, 1fr);
    }

    .business-outskirts-map-layout {
        --business-outskirts-canvas-width: 1360px;
        --business-outskirts-canvas-height: 866px;
        grid-template-columns: minmax(0, 1fr) minmax(280px, 340px);
    }

    .business-outskirts-map-board-wrap {
        min-height: 0;
    }

    .business-outskirts-zone-card {
        padding: 9px;
    }

    .business-outskirts-zone-card em {
        -webkit-line-clamp: 1;
    }
}

@media (max-width: 768px) {
    .business-outskirts-map-layout {
        --business-outskirts-canvas-width: 1180px;
        --business-outskirts-canvas-height: 752px;
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: minmax(54vh, 1fr) auto;
    }

    .business-outskirts-map-board-wrap {
        min-height: min(60vh, 560px);
    }

    .business-outskirts-map-tabs {
        flex-wrap: wrap;
    }

    .business-outskirts-map-panel {
        max-height: 34vh;
    }

    .business-harvest-map-layout {
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: minmax(54vh, 1fr) auto;
    }

    .business-harvest-board {
        min-width: 860px;
        min-height: 620px;
    }

    .business-harvest-board--paddy,
    .business-harvest-board--field,
    .business-harvest-board--pond,
    .business-harvest-board--mulberry,
    .business-harvest-board--orchard,
    .business-harvest-board--apiary,
    .business-harvest-board--pasture,
    .business-harvest-board--herb,
    .business-harvest-board--wood {
        width: 980px;
        min-width: 980px;
        min-height: 0;
        height: auto;
        aspect-ratio: 1672 / 941;
    }

    .business-harvest-scene-grid {
        grid-template-columns: repeat(3, minmax(96px, 1fr));
        width: min(620px, calc(100% - 48px));
        margin-inline: 24px;
    }

    .business-harvest-region-strip {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .business-harvest-map-panel {
        max-height: 34vh;
    }

    .business-outskirts-zone-card {
        gap: 3px;
        padding: 6px;
    }

    .business-outskirts-zone-card span {
        padding: 2px 5px;
        font-size: 0.52rem;
    }

    .business-outskirts-zone-card strong {
        font-size: 0.68rem;
        line-height: 1.08;
    }

    .business-outskirts-zone-card em,
    .business-outskirts-zone-meta b:nth-child(2) {
        display: none;
    }

    .business-outskirts-zone-card--waterworks .business-outskirts-zone-actions {
        display: none;
    }

    .business-outskirts-zone-meta b,
    .business-outskirts-zone-card i {
        font-size: 0.56rem;
    }

    .business-outskirts-chip-list {
        gap: 3px;
    }

    .business-outskirts-chip-list span {
        padding: 2px 4px;
        font-size: 0.52rem;
    }
}

/* 经营之道入口加载 */
.business-entry-loader {
    min-height: clamp(360px, 58vh, 620px);
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 20px;
    padding: clamp(28px, 6vw, 72px);
    color: #edf7f1;
    text-align: center;
    overflow: hidden;
    isolation: isolate;
    background:
        linear-gradient(180deg, rgba(9, 20, 22, 0.88), rgba(4, 10, 12, 0.96)),
        linear-gradient(90deg, rgba(72, 183, 164, 0.14), rgba(240, 190, 101, 0.14));
    border: 1px solid rgba(214, 182, 115, 0.28);
    border-radius: 8px;
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.025),
        0 18px 60px rgba(0, 0, 0, 0.24);
}

.business-entry-loader::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.045), transparent),
        repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.035) 0 1px, transparent 1px 18px);
    opacity: 0.45;
}

.business-entry-loader > * {
    position: relative;
    z-index: 1;
}

.business-entry-loader-art {
    width: min(420px, 78vw);
    height: 56px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 9px;
}

.business-entry-loader-art::before,
.business-entry-loader-art::after {
    content: "";
    position: absolute;
    top: 50%;
    width: calc(50% - 42px);
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(218, 183, 112, 0.72));
    transform: translateY(-50%);
}

.business-entry-loader-art::before {
    left: 0;
}

.business-entry-loader-art::after {
    right: 0;
    background: linear-gradient(90deg, rgba(218, 183, 112, 0.72), transparent);
}

.business-entry-loader-art span {
    width: 8px;
    height: 38px;
    display: block;
    border-radius: 2px;
    background: linear-gradient(180deg, #f2d18b, #48b7a4);
    box-shadow: 0 0 16px rgba(242, 209, 139, 0.26);
    animation: businessLoaderPillar 960ms ease-in-out infinite;
}

.business-entry-loader-art span:nth-child(2) {
    animation-delay: 120ms;
}

.business-entry-loader-art span:nth-child(3) {
    animation-delay: 240ms;
}

.business-entry-loader-copy {
    display: grid;
    gap: 8px;
}

.business-entry-loader-kicker {
    color: #9ff1de;
    font-size: 0.84rem;
    font-weight: 800;
    text-shadow: 0 0 14px rgba(72, 183, 164, 0.36);
}

.business-entry-loader-copy h3 {
    margin: 0;
    color: #fff3d7;
    font-size: clamp(1.8rem, 3vw, 3rem);
    font-weight: 900;
    line-height: 1.08;
    letter-spacing: 0;
    text-shadow: 0 0 18px rgba(240, 190, 101, 0.22);
}

.business-entry-loader-copy p {
    margin: 0;
    color: rgba(238, 245, 239, 0.86);
    font-size: 0.96rem;
}

.business-entry-loader-progress {
    width: min(560px, 86vw);
    height: 16px;
    padding: 3px;
    border-radius: 999px;
    background: rgba(2, 8, 10, 0.88);
    border: 1px solid rgba(242, 209, 139, 0.36);
    box-shadow: inset 0 1px 6px rgba(0, 0, 0, 0.42);
    overflow: hidden;
}

.business-entry-loader-progress i {
    display: block;
    width: 18%;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #3db79f, #f0be65, #f6e2aa);
    box-shadow: 0 0 16px rgba(240, 190, 101, 0.34);
    animation: businessEntryProgress 900ms cubic-bezier(0.22, 0.7, 0.22, 1) forwards;
}

.business-entry-loader-steps {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    max-width: 620px;
}

.business-entry-loader-steps span {
    min-width: 84px;
    padding: 7px 12px;
    border-radius: 999px;
    color: rgba(238, 242, 234, 0.86);
    background: rgba(255, 255, 255, 0.075);
    border: 1px solid rgba(255, 255, 255, 0.12);
    font-size: 0.78rem;
    font-weight: 700;
    animation: businessLoaderStep 1200ms ease-in-out infinite;
}

.business-entry-loader-steps span:nth-child(2) {
    animation-delay: 150ms;
}

.business-entry-loader-steps span:nth-child(3) {
    animation-delay: 300ms;
}

.business-entry-loader-steps span:nth-child(4) {
    animation-delay: 450ms;
}

@keyframes businessEntryProgress {
    0% { width: 18%; }
    46% { width: 58%; }
    100% { width: 92%; }
}

@keyframes businessMainMapProgressFlow {
    0%, 100% {
        background-position: 0% 50%;
        filter: saturate(0.96) brightness(0.98);
    }
    50% {
        background-position: 100% 50%;
        filter: saturate(1.12) brightness(1.08);
    }
}

@keyframes businessMainMapProgressShine {
    0% {
        transform: translateX(-115%);
    }
    100% {
        transform: translateX(115%);
    }
}

@keyframes businessLoaderPillar {
    0%, 100% {
        transform: scaleY(0.68);
        opacity: 0.52;
    }
    48% {
        transform: scaleY(1);
        opacity: 1;
    }
}

@keyframes businessLoaderStep {
    0%, 100% {
        border-color: rgba(255, 255, 255, 0.08);
        color: rgba(238, 242, 234, 0.7);
    }
    45% {
        border-color: rgba(240, 190, 101, 0.44);
        color: #f5ead4;
    }
}

@media (prefers-reduced-motion: reduce) {
    .business-entry-loader-art span,
    .business-entry-loader-progress i,
    .business-entry-loader-steps span,
    .business-main-map-opening-progress i,
    .business-main-map-opening-steps span,
    .business-main-map-opening-progress i::after,
    .business-main-map-loader-progress.business-entry-loader-progress i::after {
        animation: none;
    }

    .business-entry-loader-progress i,
    .business-main-map-opening-progress i {
        width: 72%;
    }
}

@media (max-width: 640px) {
    .business-entry-loader {
        min-height: 420px;
        padding: 28px 18px;
    }

    .business-entry-loader-art {
        width: min(300px, 84vw);
    }

    .business-entry-loader-steps span {
        min-width: 72px;
        padding: 6px 9px;
    }
}

/* 加载动画 */
.business-loading {
    text-align: center;
    padding: 40px;
    color: #95a5a6;
}

.business-loading-spinner {
    display: inline-block;
    width: 40px;
    height: 40px;
    border: 4px solid #ecf0f1;
    border-top-color: #3498db;
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

/* 标签页指示器（移动端） */
.business-tabs-indicator {
    display: none;
    text-align: center;
    padding: 8px;
    background: #f8f9fa;
    border-radius: 0 0 8px 8px;
    font-size: 12px;
    color: #7f8c8d;
}

@media (max-width: 768px) {
    .business-tabs-indicator {
        display: block;
    }
}

/* 优化现有业务卡片在标签页中的显示 */
.business-tab-panel .business-card,
.business-tab-panel .business-production-card,
.business-tab-panel .business-industry-card {
    margin-bottom: 15px;
}

/* 网格布局优化 */
.business-grid-layout {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 15px;
    margin-bottom: 20px;
}

@media (max-width: 768px) {
    .business-grid-layout {
        grid-template-columns: 1fr;
    }
}

/* Planning tab preview: show only the clean map image, no grid/cell overlays. */
.business-planning-stage .business-planning-preview-map .business-grid-map-board {
    position: relative !important;
    background: transparent !important;
}

.business-planning-stage .business-planning-preview-map .business-grid-map-board::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    display: block !important;
    z-index: 0 !important;
    background-image: url("../images/business/city/business-grid-map-thumb-v1.jpg") !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
    border-radius: inherit !important;
    opacity: 1 !important;
    filter: none !important;
    pointer-events: none !important;
}

.business-planning-stage .business-planning-preview-map .business-grid-map-board::after,
.business-planning-stage .business-planning-preview-map .business-grid-cells::before,
.business-planning-stage .business-planning-preview-map .business-grid-cell::before,
.business-planning-stage .business-planning-preview-map .business-grid-cell::after {
    content: none !important;
    display: none !important;
    background: none !important;
    border: 0 !important;
    box-shadow: none !important;
    opacity: 0 !important;
}

.business-planning-stage .business-planning-preview-map .business-grid-cells {
    position: relative !important;
    z-index: 1 !important;
    gap: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

.business-planning-stage .business-planning-preview-map .business-grid-cell,
.business-planning-stage .business-planning-preview-map .business-grid-cell:hover,
.business-planning-stage .business-planning-preview-map .business-grid-cell:focus,
.business-planning-stage .business-planning-preview-map .business-grid-cell:focus-visible,
.business-planning-stage .business-planning-preview-map .business-grid-cell.selected {
    background: transparent !important;
    background-image: none !important;
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
    opacity: 1 !important;
    filter: none !important;
    text-shadow: none !important;
    color: transparent !important;
}

.business-planning-stage .business-planning-preview-map .business-grid-cell > *,
.business-planning-stage .business-planning-preview-map .business-map-parcel-base,
.business-planning-stage .business-planning-preview-map .business-map-ownership-chip,
.business-planning-stage .business-planning-preview-map .business-grid-status-bubbles,
.business-planning-stage .business-planning-preview-map .business-grid-object-mark,
.business-planning-stage .business-planning-preview-map .business-grid-object-signal,
.business-planning-stage .business-planning-preview-map .business-grid-object-note,
.business-planning-stage .business-planning-preview-map .business-grid-tile-art,
.business-planning-stage .business-planning-preview-map .business-grid-building-art,
.business-planning-stage .business-planning-preview-map .business-grid-decoration-art,
.business-planning-stage .business-planning-preview-map .business-map-layout-tools {
    display: none !important;
}

/* Business page scroll performance: isolate heavy painted regions and skip offscreen folds. */
#business-panel .business-planning-stage,
#business-panel .business-grid-map-band,
#business-panel .business-planning-preview-map .business-grid-map-board,
#business-panel .business-main-map-overview-grid {
    contain: paint;
}

#business-panel .business-tab-panel.active .business-card-grid,
#business-panel .business-tab-panel.active .business-production-grid,
#business-panel .business-tab-panel.active .business-plot-grid,
#business-panel .business-tab-panel.active .business-project-grid,
#business-panel .business-tab-panel.active .business-decoration-grid,
#business-panel .business-tab-panel.active .business-transport-grid,
#business-panel .business-tab-panel.active .business-district-grid,
#business-panel .business-tab-panel.active .business-trade-grid,
#business-panel .business-tab-panel.active .business-order-grid,
#business-panel .business-tab-panel.active .business-agent-grid,
#business-panel .business-tab-panel.active .business-newbie7-grid,
#business-panel .business-tab-panel.active .business-weekly-grid,
#business-panel .business-tab-panel.active .business-daily-grid,
#business-panel .business-tab-panel.active .business-collection-grid,
#business-panel .business-tab-panel.active .business-operation-grid,
#business-panel .business-tab-panel.active .business-contract-grid,
#business-panel .business-tab-panel.active .business-resident-request-grid,
#business-panel .business-tab-panel.active .business-resident-role-grid,
#business-panel .business-tab-panel.active .business-story-grid,
#business-panel .business-tab-panel.active .business-liveops-grid,
#business-panel .business-tab-panel.active .business-leaderboard-grid,
#business-panel .business-tab-panel.active .business-social-grid,
#business-panel .business-tab-panel.active .business-commercial-grid,
#business-panel .business-tab-panel.active .business-pipeline-grid,
#business-panel .business-tab-panel.active .business-art-manifest-grid,
#business-panel .business-tab-panel.active .business-ops-grid {
    contain: paint;
}

@supports (content-visibility: auto) {
    #business-panel .business-tab-panel.active .business-dashboard-fold,
    #business-panel .business-tab-panel.active .business-section {
        content-visibility: auto;
        contain-intrinsic-size: auto 420px;
    }

    #business-panel .business-tab-panel.active .business-dashboard-fold {
        contain-intrinsic-size: auto 460px;
    }
}

/* Keep map-building decisions centered on the Jiangnan business map. */
#business-tab-planning > .business-subtabs,
#business-tab-planning > .business-tab-summary,
#business-tab-planning > .business-city-command,
#business-tab-planning > .business-city-command .business-city-command-actions,
#business-tab-planning .business-planning-action-reasons,
#business-tab-planning .business-planning-stage .business-command-actions .business-action-btn:not(.business-planning-entry-action) {
    display: none !important;
}