/* Shared finishing layer: ordinary bilingual typography and quiet surfaces. */
:root {
    --ui-ink: #16223a;
    --ui-muted: #59677e;
    --ui-line: #dce3ec;
    --ui-paper: #f4f7fb;
    --ui-gold: #9a7420;
    --ui-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
}

html { -webkit-text-size-adjust: 100%; }
body, button, input, select, textarea, pre, code {
    font-family: var(--ui-font) !important;
}
body { color: var(--ui-ink); }
h1, h2, h3, h4, .logo-title, .page-title, .section-title, .panel-title {
    font-family: var(--ui-font) !important;
    letter-spacing: normal !important;
    text-shadow: none !important;
    -webkit-text-fill-color: currentColor;
}
p, li, label, td, th { line-height: 1.6; }
button, .btn, .btn-primary, .btn-secondary, .action-btn, .save-btn,
.confirm-line-btn, .submit-form-btn, .disclaimer-btn {
    font-family: var(--ui-font) !important;
    letter-spacing: normal !important;
    text-shadow: none !important;
}
button, .btn, .action-btn, .save-btn, .confirm-line-btn, .submit-form-btn {
    transition: background-color .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease !important;
}
button:hover, .btn:hover, .action-btn:hover, .save-btn:hover,
.feature-card:hover, .stat-card:hover { transform: none !important; }

/* Site pages use a calm paper, ink and brass palette. */
body:not(:has(.sidebar)) { background: var(--ui-paper) !important; }
.stars, .mountain-layer, .five-elements-container { display: none !important; }
.feature-card, .delivery-schedule, .main-content, .method-tab,
.scheme-description, .disclaimer-modal, .panel, .stat-card {
    box-shadow: 0 1px 3px rgba(22,34,58,.07) !important;
}
.feature-card, .delivery-schedule, .main-content, .method-tab,
.scheme-description, .disclaimer-modal {
    border-color: var(--ui-line) !important;
}
.confirm-line-btn, .submit-form-btn, .disclaimer-btn,
.btn-primary, .save-btn, .search-bar button, .login-btn {
    background: var(--ui-gold) !important;
    color: #fff !important;
    border-color: var(--ui-gold) !important;
    box-shadow: none !important;
}
.confirm-line-btn:hover, .submit-form-btn:hover, .disclaimer-btn:hover,
.btn-primary:hover, .save-btn:hover, .search-bar button:hover, .login-btn:hover {
    background: #7d5e1e !important;
    box-shadow: none !important;
}
:where(a, button, input, select, textarea):focus-visible {
    outline: 2px solid var(--ui-gold) !important;
    outline-offset: 2px;
}

/* Admin: compact typography and understated controls. */
.sidebar, .sidebar-header { background: #fff !important; box-shadow: none !important; }
.logo p, .logo-subtitle, .stat-label, .menu-item { letter-spacing: normal !important; }
.logo-icon, .stat-icon { text-shadow: none !important; }
.stat-number { background: none !important; -webkit-text-fill-color: currentColor !important; }
.stat-card::before { background: var(--ui-gold) !important; }
.data-table th, .messages-table th { text-transform: none !important; letter-spacing: normal !important; }
.page-title, .panel-title, .section-title { color: var(--ui-ink) !important; }
.btn, .action-btn, .save-btn { font-weight: 600; }

/* Three-coin cast: keep each face readable and the result visually connected. */
.scheme-coins .coin-action-container {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(250px, 320px);
    align-items: center;
    gap: clamp(20px, 4vw, 48px);
}
.scheme-coins .coin-action-left {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: clamp(10px, 2vw, 20px);
    min-width: 0;
}
.scheme-coins .coin {
    box-sizing: border-box;
    width: clamp(80px, 9vw, 108px);
    height: clamp(80px, 9vw, 108px);
    padding: 8px;
    flex: 0 0 auto;
    flex-direction: column;
    gap: 2px;
    font-size: 16px;
    line-height: 1.2;
    border: 1px solid #ad811f;
    box-shadow: 0 2px 8px rgba(93, 71, 25, .16);
}
.scheme-coins .coin-face { display: block; font-size: 1.25rem; font-weight: 700; line-height: 1.2; }
.scheme-coins .coin-value { display: block; font-size: .78rem; font-weight: 600; line-height: 1.2; opacity: .85; }
.scheme-coins .coin-action-right { width: 100%; gap: 12px; }
.scheme-coins .result-display {
    box-sizing: border-box;
    width: 100%;
    min-height: 116px;
    margin: 0;
    padding: 18px;
    background: #fff;
    border: 1px solid var(--ui-line);
    border-radius: 12px;
}
.scheme-coins .result-symbol { margin-bottom: 8px; font-size: 1.9rem; line-height: 1; color: var(--ui-gold); }
.scheme-coins .result-text { font-size: .95rem; line-height: 1.4; color: var(--ui-ink); }
.scheme-coins .confirm-line-btn { width: 100%; max-width: none; margin: 0; border-radius: 10px; font-size: 1rem; }

@media (max-width: 760px) {
    .method-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .method-tab .tab-name { overflow-wrap: anywhere; }
    .scheme-coins .coin-action-container { grid-template-columns: 1fr; gap: 20px; }
    .scheme-coins .coin { width: clamp(76px, 22vw, 96px); height: clamp(76px, 22vw, 96px); }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}