:root {
    --shop-paper: #f8f3e9;
    --shop-surface: #fffdf8;
    --shop-ink: #40382f;
    --shop-muted: #786b5d;
    --shop-border: #e4d8c5;
    --shop-sage: #53664f;
    --shop-sage-dark: #3e513b;
    --shop-sage-soft: #edf0e5;
    --shop-terracotta: #a84f3a;
    --shop-terracotta-dark: #853c2c;
    --shop-terracotta-soft: #f7e9de;
    --shop-brass: #91713c;
    --shop-brass-soft: #f5edd9;
    --shop-slate: #4b6569;
    --shop-slate-soft: #eaf0ed;
    --shop-plum: #735b6b;
    --shop-plum-soft: #f1eaf0;
    --shop-danger: #b13f34;
    --shop-danger-soft: #f9e9e4;
    --green-forest: var(--shop-sage);
    --beige-warm: var(--shop-brass-soft);
    --anthracite: var(--shop-ink);
    --cream: var(--shop-surface);
}

html { scroll-behavior: smooth; }
body {
    min-height: 100vh;
    background-color: var(--shop-paper);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32'%3E%3Ccircle cx='2' cy='2' r='.65' fill='%23ded0b9' opacity='.5'/%3E%3C/svg%3E");
    color: var(--shop-ink);
    font-family: 'Trebuchet MS', 'Segoe UI', sans-serif;
    line-height: 1.6;
}
body h1, body h2:not(.text-sm), body h3:not(.text-sm) {
    font-family: Georgia, 'Times New Roman', serif;
    letter-spacing: -.025em;
}
::selection { background: #e7c2a3; color: var(--shop-ink); }
.shop-header { background: var(--shop-surface); border-top: 5px solid var(--shop-sage); border-bottom: 1px solid var(--shop-border); }
.shop-name { font-family: Georgia, 'Times New Roman', serif; font-size: clamp(1.7rem, 3vw, 2.45rem); line-height: 1.15; font-weight: 500; color: var(--shop-ink); }
.shop-eyebrow { font-size: .65rem; line-height: 1.7; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; color: var(--shop-terracotta); }
.shop-tagline { font-size: .85rem; color: var(--shop-muted); }
.shop-seal { width: 60px; height: 74px; border-radius: 30px 30px 14px 14px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; background: var(--shop-sage); color: #fff6dd; outline: 1px solid #a7b09b; outline-offset: -6px; }
.shop-seal i { font-size: 1.4rem; transform: rotate(-30deg); }
.shop-seal span { font-family: Georgia, serif; font-size: .7rem; letter-spacing: .2em; padding-left: .2em; }
.shop-header-illustration { width: 230px; height: 100px; object-fit: contain; }
.shop-account { padding: 7px 8px 7px 14px; border: 1px solid var(--shop-border); background: var(--shop-paper); color: var(--shop-sage-dark); border-radius: 100px; }
.shop-logout { background: var(--shop-surface); color: var(--shop-terracotta); transition: background-color .15s ease; }
.shop-logout:hover { background: var(--shop-terracotta-soft); }
.shop-nav { background: #f1eadc; border-bottom: 1px solid var(--shop-border); }
.nav-link { color: #675949; transition: background-color .15s ease, color .15s ease; }
.nav-link:hover { background: var(--shop-surface); color: var(--shop-terracotta); }
.nav-link.active { background: var(--shop-sage); color: white; box-shadow: 0 3px 7px #53664f22; }
.shop-main { min-height: 56vh; }
.card-custom { background: var(--shop-surface); border: 1px solid var(--shop-border); border-radius: 1.25rem; box-shadow: 0 5px 18px #5c49300a; }
.btn-primary { background: var(--shop-terracotta) !important; color: white !important; border: 1px solid transparent; border-radius: .85rem; cursor: pointer; transition: background-color .15s ease, box-shadow .15s ease; }
.btn-primary:hover { background: var(--shop-terracotta-dark) !important; box-shadow: 0 4px 10px #a84f3a20; }
body :is(a, button, input, select, textarea):focus-visible { outline: 2px solid var(--shop-terracotta); outline-offset: 3px; }
body :is(input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]), select, textarea) { background-color: var(--shop-surface); color: var(--shop-ink); border-color: #d6c6ae; border-radius: .8rem; }
body label { color: #655746; }
body input::placeholder, body textarea::placeholder { color: #8b7c6a; }
body input:focus, body select:focus, body textarea:focus { --tw-ring-color: #a84f3a40; border-color: var(--shop-terracotta); }
body table { background: var(--shop-surface); }
body thead { background: var(--shop-sage-soft); color: var(--shop-sage-dark); }
body th { font-size: .75rem; letter-spacing: .02em; font-weight: 700; }
body td { border-color: var(--shop-border); }
body tbody tr { transition: background-color .15s ease; }
body tbody tr:hover { background: #f6f0e3; }
body tfoot { background: var(--shop-brass-soft); }
body .divide-gray-100 > :not([hidden]) ~ :not([hidden]) { border-color: #eee5d6; }
body .bg-white { background-color: var(--shop-surface); }
body .bg-gray-50, body .bg-gray-100 { background-color: #f2ecdf; }
body .text-gray-800, body .text-gray-900 { color: var(--shop-ink); }
body .text-gray-600, body .text-gray-700 { color: #65594b; }
body .text-gray-400, body .text-gray-500 { color: var(--shop-muted); }
body .border-gray-100, body .border-gray-200, body .border-gray-300 { border-color: var(--shop-border); }
body .bg-green-50, body .bg-emerald-50 { background-color: #f0f2e9; }
body .bg-green-100, body .bg-emerald-100 { background-color: #e3e9d8; }
body .bg-green-600, body .bg-green-700, body .bg-emerald-600, body .bg-emerald-700 { background-color: var(--shop-sage); }
body .text-green-500, body .text-green-600, body .text-green-700, body .text-emerald-600, body .text-emerald-700 { color: var(--shop-sage); }
body .text-green-800, body .text-green-900, body .text-emerald-800 { color: var(--shop-sage-dark); }
body .text-emerald-50, body .text-emerald-100 { color: #f6f4e9; }
body .border-green-100, body .border-green-200, body .border-green-300, body .border-emerald-200 { border-color: #cbd5bd; }
body .border-green-500, body .border-l-green-500, body .border-l-emerald-500 { border-color: var(--shop-sage); }
body .bg-blue-50, body .bg-sky-50, body .bg-teal-50 { background-color: var(--shop-slate-soft); }
body .bg-blue-100, body .bg-teal-100, body .bg-sky-100 { background-color: #dce7e1; }
body .bg-blue-600, body .bg-teal-600 { background-color: var(--shop-slate); }
body .text-blue-500, body .text-blue-600, body .text-blue-700, body .text-blue-800, body .text-sky-800, body .text-teal-600, body .text-teal-700, body .text-teal-800 { color: var(--shop-slate); }
body .border-l-blue-500, body .border-l-teal-500, body .border-sky-200 { border-color: #8aa49b; }
body .bg-orange-50, body .bg-orange-100, body .bg-amber-50, body .bg-yellow-50 { background-color: var(--shop-brass-soft); }
body .bg-amber-100, body .bg-yellow-100 { background-color: #eee1bf; }
body .text-orange-600, body .text-orange-700, body .text-orange-800, body .text-amber-700, body .text-amber-800, body .text-yellow-800 { color: #89632f; }
body .border-l-orange-500, body .border-amber-200, body .border-amber-300 { border-color: #c6a66d; }
body .bg-purple-50, body .bg-indigo-50 { background-color: var(--shop-plum-soft); }
body .bg-purple-100, body .bg-indigo-100 { background-color: #e8dfe6; }
body .bg-indigo-600 { background-color: var(--shop-plum); }
body .text-purple-600, body .text-purple-700, body .text-purple-800, body .text-indigo-600, body .text-indigo-700 { color: var(--shop-plum); }
body .border-l-purple-500, body .border-l-indigo-500 { border-color: #ab8fa0; }
body .bg-red-50, body .bg-rose-50 { background-color: var(--shop-danger-soft); }
body .text-red-600, body .text-red-700, body .text-red-800 { color: var(--shop-danger); }
body .border-red-200 { border-color: #e7bcb0; }
body :is(button, a).bg-green-600, body :is(button, a).bg-green-700 { background-color: var(--shop-terracotta); border-radius: .85rem; }
body :is(button, a).bg-green-600:hover, body :is(button, a).bg-green-700:hover { background-color: var(--shop-terracotta-dark); }
body .hover\:bg-green-50:hover, body .hover\:bg-green-100:hover { background-color: var(--shop-sage-soft); }
body .hover\:text-red-600:hover { color: var(--shop-danger); }
body .text-yellow-500 { color: var(--shop-brass); }
body .text-red-500, body .text-rose-700 { color: var(--shop-danger); }
.shop-footer { margin-top: 3rem; border-top: 1px solid var(--shop-border); background: var(--shop-surface); color: var(--shop-muted); }
.shop-footer-name { font-family: Georgia, serif; font-size: 1.15rem; color: var(--shop-sage-dark); }
.shop-footer-motto { font-family: Georgia, serif; font-style: italic; color: var(--shop-terracotta); }
.shop-login { margin: 1rem auto; }
.shop-login-intro { padding: 1.5rem 0; }
.shop-login-intro h2 { font-size: clamp(2.1rem, 4vw, 3.2rem); color: var(--shop-sage-dark); line-height: 1.15; }
.shop-login-intro img { width: 100%; max-width: 500px; margin-top: 2rem; }
.shop-welcome { max-width: 820px; background: var(--shop-surface); border: 1px solid var(--shop-border); border-radius: 2rem; box-shadow: 0 12px 40px #5c49300c; }
.shop-welcome img { max-width: 560px; margin: 0 auto; width: 100%; }
.chart-container { position: relative; height: 300px; width: 100%; }
.fade-in { animation: shop-enter .3s ease-out; }
@keyframes shop-enter { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: #eee5d7; }
::-webkit-scrollbar-thumb { background: #b6a48a; border: 2px solid #eee5d7; border-radius: 8px; }
@media (min-width: 768px) { .shop-seal { width: 72px; height: 86px; } }
@media (max-width: 768px) { .chart-container { height: 250px; } .shop-eyebrow { font-size: .58rem; letter-spacing: .08em; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } .fade-in { animation: none; } }
@media print {
    body { background: white !important; color: #222 !important; }
    .no-print { display: none !important; }
    .card-custom { box-shadow: none; }
    .shop-header-illustration { display: none !important; }
    .shop-nav, .shop-account { display: none !important; }
    .shop-header { border-top: 0; }
}
