:root {
    --ink: #28150e;
    --muted: #715f54;
    --line: #ddcbb4;
    --paper: #f0e7d6;
    --soft: #f5ecdf;
    --surface: #fbf7ef;
    --surface-strong: #fffdf9;
    --brand: #ea2e00;
    --brand-dark: #9f2104;
    --accent: #f58a28;
    --herb: #8b5839;
    --berry: #b63a16;
    --white: #ffffff;
    --sun: #f7b24d;
    --foam: #fff9ef;
    --shadow: 0 22px 50px rgba(98, 45, 20, 0.16);
    --soft-shadow: 0 12px 30px rgba(98, 45, 20, 0.09);
}

::selection {
    background: rgba(234, 46, 0, 0.18);
    color: var(--ink);
}

body {
    background:
        radial-gradient(circle at 7% 7%, rgba(234, 46, 0, 0.1), transparent 22rem),
        radial-gradient(circle at 94% 18%, rgba(245, 138, 40, 0.14), transparent 27rem),
        radial-gradient(circle at 55% 74%, rgba(179, 119, 69, 0.08), transparent 32rem),
        linear-gradient(180deg, #f0e7d6 0%, #fbf7ef 34%, #f6eee2 100%);
}

input {
    border-color: var(--line);
    background: rgba(255, 253, 249, 0.94);
}

input:focus,
.review-form textarea:focus {
    border-color: rgba(234, 46, 0, 0.58);
    box-shadow: 0 0 0 4px rgba(234, 46, 0, 0.1);
}

.site-header {
    background: rgba(240, 231, 214, 0.9);
    border-bottom-color: rgba(185, 151, 116, 0.42);
    box-shadow: 0 8px 28px rgba(98, 45, 20, 0.07);
}

.brand-mark {
    border-radius: 12px 12px 16px 12px;
    background: linear-gradient(145deg, #ea2e00, #f58a28);
    box-shadow: 0 8px 18px rgba(234, 46, 0, 0.22);
}

.gnb a:hover,
.text-link:hover {
    color: var(--brand-dark);
}

.gnb a:hover {
    background: rgba(234, 46, 0, 0.08);
}

.region-form {
    border-color: rgba(98, 45, 20, 0.12);
    background: rgba(255, 253, 249, 0.74);
    box-shadow: 0 8px 22px rgba(98, 45, 20, 0.08);
}

.region-form label {
    background: rgba(234, 46, 0, 0.09);
    color: var(--brand-dark);
}

.region-form select:focus,
.region-form .region-search-input:focus {
    box-shadow: 0 0 0 2px rgba(234, 46, 0, 0.12);
}

.hero::before {
    inset: 74px -3% auto;
    height: 380px;
    border-radius: 44% 56% 48% 52% / 54% 42% 58% 46%;
    background:
        radial-gradient(circle at 14% 22%, rgba(234, 46, 0, 0.12), transparent 24%),
        linear-gradient(115deg, rgba(240, 231, 214, 0.9), rgba(245, 138, 40, 0.12), rgba(234, 46, 0, 0.08));
    clip-path: none;
    transform: rotate(-1.5deg);
}

.hero-copy h1,
.page-title h1,
.detail-hero h1,
.picks-head h1,
.restaurant-card h3 {
    color: var(--ink);
}

.eyebrow,
.text-link,
.restaurant-row em {
    color: var(--brand);
}

.btn {
    border-radius: 12px;
}

.btn.primary,
.filter-btn.active,
.filter-btn:hover,
.hero-social-links a:hover,
.hero-social-links a:focus-visible,
.hero-social-links button:hover,
.hero-social-links button:focus-visible {
    background: linear-gradient(135deg, var(--brand), var(--accent));
}

.btn.primary {
    box-shadow: 0 12px 26px rgba(234, 46, 0, 0.22);
}

.btn.ghost {
    border-color: rgba(159, 33, 4, 0.18);
    background: rgba(255, 253, 249, 0.8);
}

.pick-card,
.curation-card,
.restaurant-card,
.district-guide-card,
.district-restaurant-card,
.district-guide-empty,
.detail-card,
.review-form,
.review-item,
.review-empty {
    border-color: rgba(112, 73, 47, 0.14);
    border-radius: 18px;
    background: linear-gradient(180deg, rgba(255, 253, 249, 0.98), rgba(250, 245, 236, 0.96));
    box-shadow: var(--soft-shadow);
}

.pick-card:hover,
.pick-card:focus-visible,
.restaurant-card:hover,
.district-guide-card:hover,
.district-guide-card:focus-visible,
.district-restaurant-card:hover,
.district-restaurant-card:focus-visible {
    border-color: rgba(234, 46, 0, 0.3);
}

.pick-thumb,
.restaurant-thumb,
.curation-row-thumb,
.detail-media-placeholder,
.map-box {
    background:
        radial-gradient(circle at 82% 18%, rgba(245, 138, 40, 0.2), transparent 26%),
        linear-gradient(145deg, rgba(240, 231, 214, 0.96), rgba(234, 46, 0, 0.08)),
        var(--soft);
}

.pick-body {
    border-top-color: rgba(112, 73, 47, 0.08);
}

.mini-pick,
.restaurant-row {
    border-top-color: var(--line);
}

.restaurant-card:hover,
.restaurant-row:hover,
.mini-pick:hover {
    border-color: rgba(234, 46, 0, 0.34);
}

.section.band {
    border-top: 1px solid rgba(185, 151, 116, 0.22);
    border-bottom: 1px solid rgba(185, 151, 116, 0.22);
    background:
        radial-gradient(circle at 6% 18%, rgba(234, 46, 0, 0.08), transparent 22%),
        radial-gradient(circle at 88% 82%, rgba(245, 138, 40, 0.12), transparent 26%),
        linear-gradient(100deg, rgba(240, 231, 214, 0.98), rgba(255, 250, 241, 0.98) 48%, rgba(245, 233, 216, 0.98));
}

.chip,
.filter-btn,
.tag {
    border-color: rgba(159, 33, 4, 0.14);
}

.chip {
    background: rgba(255, 253, 249, 0.9);
}

.chip:hover {
    background: linear-gradient(135deg, var(--brand), var(--accent));
}

.curation-visual {
    background:
        radial-gradient(circle at 18% 18%, rgba(255, 219, 164, 0.2), transparent 28%),
        linear-gradient(135deg, #b82400, #ea2e00 48%, #f58a28),
        var(--brand);
}

.curation-visual-overlay {
    background: linear-gradient(180deg, rgba(45, 18, 7, 0.08), rgba(45, 18, 7, 0.74));
}

.curation-visual-copy small {
    color: #ffe5cf;
}

.curation-more-button {
    color: var(--brand-dark);
    box-shadow: 0 10px 22px rgba(98, 45, 20, 0.16);
}

.curation-restaurant-card {
    border-color: rgba(112, 73, 47, 0.13);
    border-radius: 16px;
    background: var(--surface);
}

.page-title::before {
    border-bottom-color: rgba(185, 151, 116, 0.4);
    background:
        radial-gradient(circle at 8% 22%, rgba(234, 46, 0, 0.08), transparent 22%),
        radial-gradient(circle at 92% 72%, rgba(245, 138, 40, 0.14), transparent 28%),
        linear-gradient(100deg, rgba(240, 231, 214, 0.98), rgba(252, 247, 238, 0.98) 52%, rgba(247, 234, 215, 0.96));
}

.filter-panel {
    border-color: rgba(112, 73, 47, 0.14);
    border-radius: 18px;
    background: rgba(255, 253, 249, 0.84);
}

.filter-field select,
.filter-field input,
.region-group-select,
.region-search-list {
    border-color: var(--line);
    background: rgba(255, 253, 249, 0.98);
}

.region-search-list {
    border-radius: 14px;
}

.region-search-option {
    border-radius: 10px;
}

.region-search-option:hover,
.region-search-option[aria-selected="true"] {
    background: var(--soft);
}

.filter-search-button {
    background: linear-gradient(135deg, var(--brand-dark), var(--brand));
}

.restaurant-thumb,
.detail-hero-media,
.detail-gallery-item,
.map-box {
    border-radius: 14px;
}

.restaurant-thumb > span,
.pick-thumb > span,
.curation-row-thumb > span,
.detail-media-placeholder span {
    background: linear-gradient(135deg, var(--brand), var(--accent));
}

.district-intro,
.discovery-section {
    border-color: rgba(112, 73, 47, 0.14);
}

.district-facts div,
.hours-list div {
    border-bottom-color: rgba(234, 46, 0, 0.1);
}

.tag {
    background: #f8e0cf;
    color: var(--brand-dark);
}

.detail-hero-copy {
    border-color: rgba(112, 73, 47, 0.14);
    border-radius: 20px;
    background:
        radial-gradient(circle at 90% 12%, rgba(234, 46, 0, 0.1), transparent 28%),
        linear-gradient(145deg, rgba(240, 231, 214, 0.94), rgba(255, 253, 249, 0.98)),
        var(--white);
}

.editor-recommendation {
    border-left-color: var(--brand);
}

.visit-info-grid {
    border-color: rgba(112, 73, 47, 0.14);
    border-radius: 16px;
    background: rgba(112, 73, 47, 0.13);
}

.visit-info-grid div {
    background: rgba(255, 253, 249, 0.97);
}

.detail-title-rating,
.detail-pills span,
.hero-social-links a,
.hero-social-links button,
.icon-btn,
.rating-input span {
    border-color: rgba(159, 33, 4, 0.16);
    background: rgba(255, 247, 237, 0.94);
}

.hero-social-links a,
.hero-social-links button,
.icon-btn {
    border-radius: 11px;
}

.detail-slider-control:hover,
.detail-slider-control:focus-visible {
    background: rgba(234, 46, 0, 0.94);
}

.detail-slider-dot.active,
.detail-slider-dot:focus-visible {
    outline-color: rgba(234, 46, 0, 0.86);
}

.detail-gallery-item:hover,
.detail-gallery-item:focus-visible,
.detail-gallery-item.active {
    border-color: var(--brand);
}

.review-form textarea,
.review-image-field input {
    border-color: var(--line);
    background: rgba(255, 253, 249, 0.98);
}

.review-image-field {
    border-color: rgba(234, 46, 0, 0.24);
    border-radius: 14px;
    background: rgba(248, 224, 207, 0.66);
}

.rating-input span {
    color: var(--brand-dark);
}

.rating-input input:checked + span,
.rating-input label:hover span {
    border-color: rgba(234, 46, 0, 0.36);
    background: #f9dfce;
    color: var(--brand-dark);
}

.review-image-thumb {
    border-color: rgba(159, 33, 4, 0.14);
    border-radius: 12px;
    background: var(--foam);
}

.review-image-thumb:focus-visible {
    box-shadow: 0 0 0 4px rgba(234, 46, 0, 0.12);
}

.review-lightbox {
    background: rgba(40, 21, 14, 0.82);
}

.review-lightbox img {
    background: #fffaf1;
    box-shadow: 0 24px 60px rgba(40, 21, 14, 0.36);
}

.alert.success {
    border-color: rgba(143, 91, 47, 0.24);
    background: #f8efe2;
    color: var(--brand-dark);
}

.site-footer {
    border-top-color: rgba(112, 73, 47, 0.16);
    background: linear-gradient(180deg, rgba(240, 231, 214, 0), rgba(232, 218, 196, 0.78));
}

.legal-content {
    color: var(--ink);
}

@media (max-width: 860px) {
    .gnb a {
        border-color: rgba(112, 73, 47, 0.12);
        background: rgba(255, 253, 249, 0.7);
    }

    .filter-panel {
        background: rgba(255, 253, 249, 0.92);
    }

    .hero::before {
        inset: 54px -8% auto;
        height: 300px;
    }
}

@media (max-width: 560px) {
    .pick-card,
    .restaurant-card,
    .curation-card,
    .district-guide-card {
        box-shadow: 0 10px 26px rgba(98, 45, 20, 0.1);
    }

    .page-title::before {
        background:
            radial-gradient(circle at 88% 18%, rgba(234, 46, 0, 0.1), transparent 32%),
            linear-gradient(110deg, rgba(240, 231, 214, 0.98), rgba(248, 238, 224, 0.96));
    }
}