* {
    box-sizing: border-box;
}

body {
    margin: 0;
    font-family: "Microsoft YaHei", "PingFang SC", sans-serif;
    background: #f7f5ef;
    color: #2b2b2b;
}

a {
    text-decoration: none;
}

.layout {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.top-navigation {
    position: fixed;
    z-index: 1000;
    top: 0;
    left: 0;
    right: 0;
    height: 76px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    padding: 10px 28px;
    background: linear-gradient(90deg, #ffd24d 0%, #ffbc1f 100%);
    box-shadow: 0 3px 18px rgba(0, 0, 0, 0.1);
}

.top-navigation .brand { margin: 0; flex: 0 0 auto; }
.top-navigation .brand-badge { width: 44px; height: 44px; border-radius: 14px; font-size: 21px; }
.top-navigation .menu { flex-direction: row; align-items: center; gap: 8px; margin-left: auto; }
.top-navigation .menu a { padding: 11px 16px; white-space: nowrap; }

.sidebar {
    width: 250px;
    background: linear-gradient(180deg, #ffd24d 0%, #ffbc1f 100%);
    padding: 28px 18px;
    box-shadow: 2px 0 18px rgba(0, 0, 0, 0.08);
}

.brand {
    display: flex;
    gap: 14px;
    align-items: center;
    margin-bottom: 32px;
}

.brand-badge {
    width: 48px;
    height: 48px;
    border-radius: 16px;
    background: #111;
    color: #ffd24d;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    font-weight: 700;
}

.brand p {
    margin: 4px 0 0;
    font-size: 12px;
    opacity: 0.7;
}

.menu {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.menu a {
    padding: 14px 16px;
    border-radius: 14px;
    color: #2b2b2b;
    font-weight: 600;
}

.menu a.active,
.menu a:hover {
    background: rgba(255, 255, 255, 0.66);
}

.content {
    flex: 1;
    width: 100%;
    padding: 104px 28px 28px;
}

.topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 24px;
}

.topbar h1 {
    margin: 0 0 8px;
    font-size: 28px;
}

.topbar p {
    margin: 0;
    color: #7b6a3f;
}

.user-card,
.panel,
.stat-card,
.login-panel {
    background: #fffdf7;
    border: 1px solid #f0e2b6;
    border-radius: 22px;
    box-shadow: 0 10px 30px rgba(255, 188, 31, 0.08);
}

.user-card {
    padding: 14px 18px;
    text-align: right;
}

.grid.cards {
    display: grid;
    grid-template-columns: repeat(4, minmax(180px, 1fr));
    gap: 16px;
    margin-bottom: 20px;
}

.stat-card {
    padding: 20px;
}

.stat-card span {
    display: block;
    color: #8a7a50;
    margin-bottom: 14px;
}

.stat-card strong {
    font-size: 34px;
}

.panel-row {
    display: grid;
    grid-template-columns: repeat(4, minmax(220px, 1fr));
    gap: 18px;
    margin-bottom: 20px;
}

.panel {
    padding: 22px;
    margin-bottom: 20px;
}

.panel-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
}

.panel-title h2 {
    margin: 0;
    font-size: 20px;
}

.status-indicator-wrap {
    margin-bottom: 18px;
}

.status-indicator {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 16px 18px;
    border-radius: 16px;
    background: #fffaf0;
    border: 1px solid #f2e1ab;
}

.status-dot {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    display: inline-block;
    box-shadow: 0 0 0 6px rgba(0, 0, 0, 0.04);
}

.status-indicator strong {
    display: block;
    margin-bottom: 4px;
    font-size: 18px;
}

.status-indicator p {
    margin: 0;
    color: #7b6a3f;
}

.status-normal .status-dot,
.status-completed .status-dot,
.tag-running {
    background: #16a34a;
    color: #15803d;
    box-shadow: 0 0 0 6px rgba(22, 163, 74, 0.14);
}

.status-invalid .status-dot,
.status-missing .status-dot,
.status-empty .status-dot,
.status-expired .status-dot,
.status-error .status-dot {
    background: #dc2626;
    box-shadow: 0 0 0 6px rgba(220, 38, 38, 0.14);
}

.status-waiting .status-dot,
.status-pending .status-dot {
    background: #d97706;
    box-shadow: 0 0 0 6px rgba(217, 119, 6, 0.14);
}

.list div {
    display: flex;
    justify-content: space-between;
    padding: 10px 0;
    border-bottom: 1px dashed #f0e2b6;
}

.list label {
    color: #8a7a50;
}

table {
    width: 100%;
    border-collapse: collapse;
}

th,
td {
    padding: 12px;
    border-bottom: 1px solid #f5ebcf;
    text-align: left;
    vertical-align: top;
}

th {
    color: #7b6a3f;
    font-size: 13px;
}

.stores-table {
    table-layout: auto;
    min-width: 1900px;
}

.stores-table td,
.stores-table th {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.stores-table td { padding-top: 8px; padding-bottom: 8px; height: 52px; }
.stores-table th { padding-top: 9px; padding-bottom: 9px; }
.stores-table td.single-line-cell {
    display: table-cell;
    max-width: 220px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.store-name-cell { min-width: 420px; }
.store-name-text { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.name-tag-row { margin-top: 6px; overflow: visible; }
.name-tag-row .field-tag { flex: 0 0 auto; padding: 2px 8px; }
.compact-badges { flex-wrap: nowrap; min-width: max-content; }
.muted-inline { color: #8a7a50; font-size: 12px; }

.tag {
    display: inline-block;
    padding: 6px 12px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
}

.tag-normal,
.tag-completed {
    background: #e8fff1;
    color: #15803d;
}

.tag-pending,
.tag-waiting {
    background: #fff5d6;
    color: #b7791f;
}

.tag-invalid,
.tag-missing,
.tag-empty {
    background: #ffe8e8;
    color: #c53030;
}

.guide-panel {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.guide-copy h2 {
    margin: 10px 0 8px;
}

.guide-copy p {
    margin: 0;
    color: #7b6a3f;
    max-width: 700px;
}

.guide-badge {
    display: inline-flex;
    align-items: center;
    padding: 6px 12px;
    border-radius: 999px;
    background: #fff3c2;
    color: #996b00;
    font-size: 12px;
    font-weight: 700;
}

.open-wizard-button {
    min-width: 140px;
}
.failed-fill-card { border-color: #f1c3b9; background: linear-gradient(145deg, #fffaf1, #fff1ed); }
.global-fill-card { border-color: #b9d8f1; background: linear-gradient(145deg, #f7fbff, #edf6ff); }
.global-fill-card > strong { color: #1769aa; }
.global-fill-card small { display: block; margin-top: 10px; color: #567086; }
.cookie-page-head { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 18px; }
.cookie-page-head h2 { margin: 0 0 6px; }
.cookie-page-head p { margin: 0; color: #6f7d8c; }
.cookie-card-grid { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.cookie-node-card { min-height: 235px; display: flex; flex-direction: column; }
.cookie-node-card.is-disabled { opacity: .68; filter: grayscale(.25); }
.cookie-card-title { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.cookie-card-title > span { font-weight: 700; color: #253447; overflow-wrap: anywhere; }
.cookie-card-title .status-pill { font-style: normal; font-size: 12px; padding: 4px 9px; border-radius: 999px; background: #eaf7ef; color: #20834a; }
.cookie-card-title .status-pill:not(.status-normal) { background: #fff0ed; color: #c9362b; }
.cookie-node-card > p { color: #667689; margin: 4px 0; }
.cookie-node-card > small { margin-top: auto; padding-top: 10px; color: #768597; }
.cookie-node-actions { display: flex; align-items: center; gap: 8px; margin: 14px 0 10px; flex-wrap: wrap; min-height: 38px; }
.cookie-node-actions form { margin: 0; }
.cookie-node-actions .mini-button { height: 36px; box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; padding: 0 12px; }
.cookie-toggle-form { height: 36px; display: inline-flex; align-items: center; gap: 8px; margin: 0; }
.cookie-enabled-state { min-width: 24px; color: #667085; font-size: 12px; font-weight: 600; line-height: 1; }
.cookie-ios-switch {
    appearance: none;
    position: relative;
    display: inline-block;
    flex: 0 0 51px;
    width: 51px;
    min-width: 51px;
    height: 31px;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: #e9e9eb;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .04);
    overflow: visible;
    vertical-align: middle;
    transition: background-color .22s ease;
}
.cookie-ios-switch.is-on { background: #34c759; }
.cookie-ios-switch:focus-visible { outline: 3px solid rgba(0, 122, 255, .28); outline-offset: 2px; }
.cookie-ios-switch-knob {
    position: absolute;
    top: 2px;
    left: 2px;
    display: block;
    width: 27px;
    height: 27px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 2px 5px rgba(0, 0, 0, .22), 0 0 1px rgba(0, 0, 0, .18);
    transform: translateX(0);
    transition: transform .22s cubic-bezier(.4, 0, .2, 1);
    pointer-events: none;
}
.cookie-ios-switch.is-on .cookie-ios-switch-knob { transform: translateX(20px); }
.cookie-ios-switch:active { filter: brightness(.97); }
.cookie-ios-switch:disabled { cursor: wait; opacity: 1; background: #e9e9eb; }
.cookie-ios-switch.is-on:disabled { background: #34c759; }
.cookie-settings-grid { grid-template-columns: 2fr 1fr; }
.cookie-format-detector { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; margin-top: 2px; }
.cookie-format-detector span { padding: 4px 8px; border-radius: 999px; background: #f0f2f5; color: #8a94a3; font-size: 11px; font-weight: 700; }
.cookie-format-detector span.is-active { background: #e8f8ee; color: #18864b; box-shadow: inset 0 0 0 1px #b9e8ca; }
.cookie-format-detector strong { margin-left: 3px; color: #6c7888; font-size: 12px; font-weight: 500; }
.settings-page-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(330px, 520px)); gap: 18px; }
.proxy-summary-card { min-height: 240px; }
.proxy-summary-card .panel-title { align-items: flex-start; gap: 16px; }
.proxy-summary-card .panel-title > div { min-width: 0; flex: 1; }
.proxy-summary-card [data-open-proxy-settings] { flex: 0 0 auto; min-width: 72px; white-space: nowrap; display: inline-flex; align-items: center; justify-content: center; }
.proxy-settings-card { width: min(760px, calc(100vw - 32px)); }
.proxy-enable { margin: 4px 0 18px; padding: 12px 14px; border-radius: 10px; background: #f3f7fb; }
.proxy-pool-textarea { min-height: 230px; resize: vertical; font-family: Consolas, "Microsoft YaHei", monospace; line-height: 1.65; }
.proxy-pool-tools { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 10px 0 16px; }
.proxy-pool-tools button, .proxy-file-button { padding: 8px 12px; font-size: 12px; }
.proxy-pool-tools strong { margin-left: auto; color: #607086; font-size: 12px; }
.proxy-file-button { display: inline-flex; align-items: center; }
.searchable-select { position: relative; display: block !important; width: 100%; min-width: 0; }
.searchable-select > input { width: 100%; padding-right: 42px; box-sizing: border-box; }
.searchable-select-arrow { position: absolute; z-index: 2; top: 50%; right: 7px; width: 32px; height: 32px; padding: 0; border: 0; border-radius: 9px; background: transparent; color: #7b6a3f; font-size: 18px; line-height: 1; transform: translateY(-50%); box-shadow: none; }
.searchable-select-arrow:hover { background: #fff4cf; }
.searchable-select-arrow:disabled { background: transparent; opacity: .45; }
.searchable-select-menu { position: absolute; z-index: 1080; top: calc(100% + 6px); left: 0; right: 0; max-height: 280px; overflow-y: auto; padding: 6px; border: 1px solid #ead590; border-radius: 14px; background: #fff; box-shadow: 0 16px 38px rgba(58, 43, 8, .18); }
.searchable-select-menu[hidden] { display: none !important; }
.searchable-select-option { display: block; width: 100%; padding: 9px 11px; border: 0; border-radius: 8px; background: transparent; color: #344054; font-weight: 500; text-align: left; box-shadow: none; }
.searchable-select-option:hover, .searchable-select-option:focus { background: #fff4cf; color: #754f00; outline: none; }
.searchable-select-empty { padding: 12px; color: #8b94a1; font-size: 13px; text-align: center; }
.searchable-select.is-open > input { border-color: #ffbc1f; box-shadow: 0 0 0 3px rgba(255, 188, 31, .16); }
.failed-fill-card > strong { color: #c9362b; }
.failed-fill-actions { display: flex; align-items: center; gap: 8px; margin-top: 12px; }
.failed-fill-actions form { margin: 0; }
.failed-fill-card small { display: block; margin-top: 10px; color: #806850; }
.compact-settings-card { width: min(620px, calc(100vw - 32px)); }
.fill-frequency-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.filter-grid,
.settings-grid,
.wizard-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(180px, 1fr));
    gap: 14px;
}

.filter-grid div,
.settings-grid div,
.wizard-field {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

input,
select,
button,
.button-link {
    border: 1px solid #ecd48e;
    border-radius: 12px;
    padding: 12px 14px;
    font-size: 14px;
    background: #fff;
}

button:disabled {
    cursor: not-allowed;
    border-color: #ddd7c7;
    background: #e9e6de;
    color: #99958b;
    box-shadow: none;
    opacity: 1;
}

button,
.button-link {
    cursor: pointer;
    background: #ffbc1f;
    color: #2b2b2b;
    font-weight: 700;
}

button.secondary,
.button-link.secondary,
.mini-button.secondary {
    background: #fff7dc;
}

.mini-button.danger {
    background: #d92d20;
    color: #fff;
    border-color: #b42318;
}

.actions {
    display: flex;
    gap: 12px;
    margin-top: 18px;
}

.inline-actions {
    align-self: end;
}

.filter-grid .store-filter-actions {
    grid-column: 1 / -1;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 12px;
    overflow-x: auto;
}

.filter-grid .store-filter-actions button,
.filter-grid .store-filter-actions .button-link {
    display: inline-flex !important;
    flex: 0 0 auto;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    white-space: nowrap !important;
    min-height: 44px;
    line-height: 1;
    text-decoration: none;
}

.table-wrap,
.cookie-table {
    overflow-x: auto;
}

.table-actions {
    display: inline-flex;
    gap: 8px;
    flex-wrap: nowrap;
    align-items: center;
    white-space: nowrap;
}

.table-actions form {
    display: inline-flex;
    margin: 0;
    flex: 0 0 auto;
}

.mini-button {
    padding: 8px 12px;
    border-radius: 10px;
    font-size: 12px;
    white-space: nowrap;
}

.task-ops-cell {
    min-width: 560px;
}

.store-actions-cell {
    width: 110px;
}

.single-line-cell {
    display: block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.store-row {
    cursor: pointer;
}

.store-row:hover {
    background: #fff9e6;
}

.store-main {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.store-subline {
    color: #7b6a3f;
    font-size: 12px;
}

.store-badges,
.store-detail-tags {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.mini-tag {
    display: inline-flex;
    align-items: center;
    max-width: 120px;
    padding: 4px 10px;
    border-radius: 999px;
    background: #fff3c2;
    color: #8b6508;
    font-size: 12px;
    font-weight: 700;
}

.field-tag {
    display: inline-flex;
    align-items: center;
    max-width: 190px;
    padding: 4px 9px;
    border: 1px solid #3b82f6;
    border-radius: 999px;
    background: #f3f7ff;
    color: #1d4ed8;
    font-size: 12px;
}

.store-filter-grid {
    grid-template-columns: repeat(4, minmax(180px, 1fr));
}

.category-filter-field { position: relative; min-width: 0; }
.category-dropdown { position: relative; width: 100%; min-width: 0; }
.category-dropdown summary {
    min-height: 44px;
    display: flex;
    align-items: center;
    padding: 0 42px 0 14px;
    border: 1px solid #ecd48e;
    border-radius: 12px;
    background: #fff;
    cursor: pointer;
    list-style: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.category-dropdown summary::-webkit-details-marker { display: none; }
.category-dropdown summary::after { content: "⌄"; position: absolute; right: 15px; color: #8a7a50; }
.category-dropdown[open] summary { border-color: #ffbc1f; box-shadow: 0 0 0 3px rgba(255, 188, 31, 0.16); }
.category-dropdown-panel {
    position: fixed;
    z-index: 1050;
    top: calc(100% + 8px);
    left: 0;
    width: min(420px, calc(100vw - 40px));
    padding: 12px;
    border: 1px solid #ecd48e;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 18px 42px rgba(62, 45, 5, 0.18);
    box-sizing: border-box;
}
.category-dropdown-tools { display: flex; flex-direction: row !important; gap: 8px !important; margin-bottom: 10px; }
.category-dropdown-tools button { padding: 7px 12px; font-size: 12px; }
.category-option-list { max-height: 280px; overflow-y: auto; display: grid; gap: 2px; scrollbar-gutter: stable; }
.category-check-option { display: flex; align-items: center; gap: 9px; min-width: 0; padding: 7px 9px; border-radius: 9px; cursor: pointer; }
.category-check-option:hover { background: #fff7dc; }
.category-check-option input { width: 16px; height: 16px; padding: 0; flex: 0 0 auto; accent-color: #ffbc1f; }
.category-tree-group { border-bottom: 1px solid #f4ead0; }
.category-tree-group:last-child { border-bottom: 0; }
.category-parent-option { background: #fffaf0; }
.category-parent-option strong { flex: 1; }
.category-child-count { color: #9a8650; font-size: 12px; }
.category-tree-children { display: grid; grid-template-columns: 1fr; padding: 2px 4px 8px 18px; }
.category-tree-branch > summary { list-style: none; position: relative; padding-right: 30px; }
.category-tree-branch > summary::-webkit-details-marker { display: none; }
.category-tree-branch > summary::after { content: "›"; position: absolute; right: 10px; color: #9a7a13; font-size: 18px; transition: transform .25s ease; }
.category-tree-branch[open] > summary::after { transform: rotate(90deg); }
.category-tree-nested { padding-left: 22px; border-left: 1px solid #ead590; margin-left: 17px; }
.category-tree-node { min-width: 0; }
.category-child-option { min-width: 0; padding-left: 9px; }
.category-tree-node[data-category-depth="1"] > summary,
.category-tree-node[data-category-depth="1"] > label,
.category-tree-node[data-category-depth="2"] > summary,
.category-tree-node[data-category-depth="2"] > label { color: #6f6240; font-size: 13px; }
.category-child-option span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.wizard-field .category-dropdown-panel {
    position: fixed;
    z-index: 99999;
    width: min(680px, calc(100vw - 32px));
    max-height: min(680px, 78vh);
    overflow: hidden;
}
.wizard-field .category-option-list { max-height: min(590px, calc(78vh - 82px)); }
.wizard-pane[data-step-pane="2"] .wizard-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.wizard-pane[data-step-pane="2"] .wizard-field { min-width: 0; }
.wizard-pane[data-step-pane="2"] .wizard-field > input,
.wizard-pane[data-step-pane="2"] .wizard-field > select { width: 100%; min-width: 0; box-sizing: border-box; }
.wizard-pane[data-step-pane="2"] .wizard-intro-card { padding: 13px 16px; margin-bottom: 16px; }
.preview-step-card { min-height: 210px; align-content: center; padding: 28px; }
.preview-step-card strong { font-size: 30px; color: #8d6300; }
.preview-step-card p { grid-column: 1 / -1; padding: 14px 16px; border-radius: 12px; background: #fff8df; }

@media (max-width: 720px) {
    .wizard-field .category-dropdown-panel { max-height: 68vh; }
}

@media (max-width: 960px) {
    .wizard-pane[data-step-pane="2"] .wizard-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 620px) {
    .wizard-pane[data-step-pane="2"] .wizard-grid { grid-template-columns: 1fr; }
}


.filter-checks {
    grid-column: span 3;
    display: flex;
    flex-direction: row !important;
    align-items: center;
    gap: 18px !important;
    border: 1px solid #ecd48e;
    border-radius: 12px;
    padding: 10px 14px;
}

.filter-checks label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.filter-checks input {
    width: auto;
}

.pagination {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
    margin-top: 18px;
}

.advanced-filter-panel {
    margin-top: 16px;
    padding: 14px 16px;
    border: 1px solid #ecd48e;
    border-radius: 16px;
    background: #fffaf0;
}
.advanced-filter-panel summary { cursor: pointer; font-weight: 700; color: #7b6a3f; }
.advanced-filter-grid { display: grid; grid-template-columns: repeat(2, minmax(260px, 1fr)); gap: 12px; margin-top: 14px; }
.advanced-filter-grid fieldset { display: flex; flex-wrap: wrap; gap: 10px 16px; border: 1px solid #f0e2b6; border-radius: 12px; padding: 12px; background: #fff; }
.advanced-filter-grid label { display: inline-flex; align-items: center; gap: 5px; font-size: 13px; }
.advanced-filter-grid input { width: auto; }

.empty {
    text-align: center;
    color: #8a7a50;
    padding: 34px 0;
}

.login-body {
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    background: radial-gradient(circle at top, #ffe28a, #f7f5ef 60%);
}

.login-panel {
    width: 420px;
    padding: 34px;
}

.login-title span {
    color: #7b6a3f;
    font-weight: 700;
}

.login-title h1 {
    margin: 8px 0 24px;
}

.login-form {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.toast-message {
    position: fixed;
    top: 24px;
    right: 24px;
    z-index: 1200;
    min-width: 240px;
    max-width: 420px;
    padding: 14px 16px;
    border-radius: 16px;
    box-shadow: 0 16px 36px rgba(0, 0, 0, 0.16);
    opacity: 0;
    transform: translateY(-10px) scale(0.98);
    transition: opacity 0.4s ease, transform 0.4s ease;
}

.toast-message.is-visible {
    opacity: 1;
    transform: translateY(0) scale(1);
}

.toast-message.is-hiding {
    opacity: 0;
    transform: translateY(-10px) scale(0.98);
}

.toast-message.is-error {
    background: #fff1f1;
    color: #c53030;
}

.toast-message.is-success {
    background: #ecfdf3;
    color: #15803d;
}

.redis-switch-form {
    margin-top: 14px;
}

.ios-switch {
    position: relative;
    width: 58px;
    height: 34px;
    border: 0;
    background: transparent;
    padding: 0;
}

.ios-switch-track {
    position: absolute;
    inset: 0;
    border-radius: 999px;
    background: #d1d5db;
    transition: background 0.4s ease;
}

.ios-switch-thumb {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.18);
    transition: left 0.4s ease, transform 0.4s ease;
}

.ios-switch.is-on .ios-switch-track {
    background: #34c759;
}

.ios-switch.is-on .ios-switch-thumb {
    left: 26px;
}

.wizard-modal {
    position: fixed;
    inset: 0;
    z-index: 1100;
    display: none;
}

.wizard-modal[hidden] {
    display: none !important;
}

.wizard-modal.is-open {
    display: block;
}

.wizard-overlay {
    position: absolute;
    inset: 0;
    background: rgba(20, 20, 20, 0.34);
    backdrop-filter: blur(3px);
}

.wizard-card {
    position: relative;
    width: min(920px, calc(100vw - 32px));
    margin: 48px auto;
    background: #fffdf7;
    border: 1px solid #f0e2b6;
    border-radius: 28px;
    box-shadow: 0 24px 50px rgba(0, 0, 0, 0.18);
    padding: 24px;
    transform: translateY(20px);
    opacity: 0;
    transition: all 0.4s ease;
}

.store-detail-card {
    width: min(760px, calc(100vw - 32px));
}

.store-detail-top {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
}

.detail-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(220px, 1fr));
    gap: 14px;
    margin-top: 18px;
}

.detail-grid div {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 12px 14px;
    border-radius: 16px;
    background: #fffaf0;
    border: 1px solid #f2e1ab;
}

.detail-grid label {
    color: #7b6a3f;
    font-size: 12px;
}

.detail-grid-wide {
    grid-column: 1 / -1;
}

.wizard-modal.is-open .wizard-card {
    transform: translateY(0);
    opacity: 1;
}

.wizard-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.wizard-head h3 {
    margin: 10px 0 0;
}

.wizard-close {
    background: #fff7dc;
}

.wizard-steps {
    display: flex;
    gap: 10px;
    margin: 18px 0 20px;
    flex-wrap: wrap;
}

.wizard-step {
    padding: 10px 14px;
    border-radius: 999px;
    background: #fff6da;
    color: #9a7a13;
    transition: all 0.4s ease;
}

.wizard-step.is-active {
    background: #ffbc1f;
    color: #2b2b2b;
}

.wizard-body {
    min-height: 360px;
    max-height: calc(100vh - 290px);
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 8px;
    overscroll-behavior: contain;
}

.wizard-card { max-height: calc(100vh - 32px); overflow: visible; transform: none; }
.wizard-modal.is-open .wizard-card { transform: none; }
.wizard-card form { min-height: 0; }
.store-more-filters { grid-column: 1 / -1; }
.store-more-filters .advanced-filter-grid { max-height: 360px; overflow-y: auto; padding-right: 6px; }

.wizard-pane {
    display: none;
    opacity: 0;
    transform: none;
    transition: opacity 0.4s ease;
}

.wizard-pane.is-active {
    display: block;
    opacity: 1;
    transform: none;
}

.wizard-intro-card {
    padding: 16px 18px;
    margin-bottom: 18px;
    border-radius: 18px;
    background: linear-gradient(180deg, #fff8df 0%, #fffdf7 100%);
    border: 1px solid #f3dea1;
}

.wizard-intro-card h4 {
    margin: 0 0 8px;
}

.wizard-intro-card p {
    margin: 0;
    color: #7b6a3f;
}

.wizard-actions {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 20px;
}

.wizard-submit {
    display: none;
}

.cookie-editor-form {
    margin-top: 18px;
}

.cookie-editor-textarea {
    min-height: 260px;
    resize: vertical;
    width: 100%;
    border: 1px solid #ecd48e;
    border-radius: 16px;
    padding: 14px 16px;
    font-size: 14px;
    font-family: Consolas, "Microsoft YaHei", monospace;
    line-height: 1.6;
    background: #fff;
}

.cookie-format-hint {
    display: flex;
    gap: 10px;
    align-items: center;
    flex-wrap: wrap;
    margin-top: 14px;
    color: #7b6a3f;
}

.cookie-format-hint strong {
    padding: 6px 10px;
    border-radius: 999px;
    background: #fff6da;
    color: #9a7a13;
}

.wizard-preview-actions {
    margin-top: 16px;
}

.preview-card {
    margin-top: 16px;
    padding: 16px 18px;
    border-radius: 18px;
    background: linear-gradient(180deg, #fff8df 0%, #fffdf7 100%);
    border: 1px solid #f3dea1;
}

.preview-card div {
    display: flex;
    justify-content: space-between;
    padding: 8px 0;
}

.preview-card p {
    margin: 10px 0 0;
    color: #7b6a3f;
}

.muted {
    color: #8a7a50;
    margin-top: 14px;
}

.map-api-console-output { max-height: 280px; overflow-y: auto; padding: 14px; border-radius: 14px; background: #202124; color: #e8eaed; font-family: Consolas, "Microsoft YaHei", monospace; }
.map-api-console-output p { margin: 0; color: #9aa0a6; }
.map-api-console-output > div { display: grid; grid-template-columns: 140px 160px 1fr; gap: 12px; padding: 7px 0; border-bottom: 1px solid #3c4043; }
.map-api-console-output time { color: #fbbc04; }
.map-api-console-output strong { color: #8ab4f8; }
.global-console-panel { margin-top: 20px; }
.amap-key-list { max-height: 480px; overflow-y: auto; padding-right: 6px; }
.amap-key-row { padding: 16px; margin-bottom: 14px; border: 1px solid #ecd48e; border-radius: 16px; background: #fffaf0; }
.amap-key-row-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; }
.inline-check { display: flex; align-items: center; gap: 8px; min-height: 42px; }

@media (max-width: 960px) {
    .layout {
        flex-direction: column;
    }

    .sidebar {
        width: 100%;
    }

    .top-navigation { padding: 10px 14px; gap: 14px; overflow-x: auto; }
    .top-navigation .brand p { display: none; }
    .top-navigation .menu { flex: 0 0 auto; }
    .content { padding: 96px 14px 20px; }

    .grid.cards,
    .panel-row,
    .filter-grid,
    .settings-grid,
    .wizard-grid {
        grid-template-columns: 1fr;
    }

    .guide-panel {
        flex-direction: column;
        align-items: flex-start;
    }

    .map-api-console-output > div { grid-template-columns: 1fr; }

    .wizard-card {
        margin: 16px auto;
        padding: 18px;
    }

    .detail-grid {
        grid-template-columns: 1fr;
    }
}