/* Shared HTML design system; this stylesheet must be loaded after other CSS. */
:root{--bg:#fcf9f3;--surface:#fffefb;--text:#322721;--muted:#746963;--border:#e5d8bb;--primary:#7a2130;--primary-dark:#56111e;--success:#751f2b;--warning:#a66b1d;--shadow:0 12px 35px #5a282013;--maroon:#7a2130;--emerald:#751f2b;--gold:#d5ac4f}
body{background:var(--bg);color:var(--text)}.site-header{background:linear-gradient(110deg,#3d0c16,#721d2a 65%,#4b111c)!important;border-bottom:3px solid var(--gold)!important;box-shadow:0 6px 20px #4110191c!important;backdrop-filter:none}.site-header .brand{color:#fff5de!important;font-family:Georgia,serif;font-size:1.45rem}.site-header nav>a,.site-header .link-button,.site-header .shop-category-menu>summary{color:#fff5e4!important}.site-header nav>a:hover,.site-header .link-button:hover{color:#f6d685!important}.site-header .shop-category-popover,.shop-category-popover{background:#fffcf5!important;border-color:#e5d5b0!important;box-shadow:0 15px 30px #3c12252e}.shop-category-popover a{color:#5a2631!important}.shop-category-popover a:hover{background:#eef5e9!important}
.container{max-width:1400px}.hero{background:linear-gradient(115deg,#400c16e8,#75202fcf 58%,#345b35c0),radial-gradient(circle at 85% 35%,#bf9558,#531623 58%)!important;color:#fff!important;min-height:510px;border-radius:0!important;box-shadow:0 18px 40px #42101a2a!important;position:relative;overflow:hidden}.hero::after{content:"✦";position:absolute;right:12%;top:18%;font-size:clamp(130px,19vw,280px);color:#d9b45d36;pointer-events:none}.hero>div{max-width:790px;position:relative;z-index:1}.hero .eyebrow{color:#f4d584!important;border:1px solid #e1bb5d;background:#e1bb5d25;border-radius:99px;padding:8px 16px}.hero h1{font-family:Georgia,serif;letter-spacing:-.03em}.hero p{color:#f6e8e0!important}.hero .button.primary{background:#9c2633!important;color:#fff!important;border:1px solid #c04d52}.hero .button.secondary{background:#751f2b!important;color:white!important;border:1px solid #39876b}.hero .actions{margin-top:28px}
.card,.form-card,.stat-card,.table-card,.panel,.product-card{background:#fffefb;border-color:#e2d3b1!important;box-shadow:0 9px 26px #6833230c}.button.primary,.button-primary,.button:not(.danger):not(.secondary){background:#751f2b;color:white}.button.primary:hover,.button-primary:hover{background:#0a503a}.button.secondary{background:#fff9ee;color:#602531;border:1px solid #d3bd87}.eyebrow,.section-tag{color:#751f2b}.form-card h1,.heading-row h1,.container h1{letter-spacing:-.025em}input,select,textarea{accent-color:#751f2b}.form-control:focus,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid #e0b65c;outline-offset:1px}.badge.success,.notice.success{background:#e8f5ed;color:#751f2b}.site-footer{background:#460f1c!important;color:#f1d9cd!important;border-top:2px solid #d2aa52}.site-footer a{color:#f7dfa0}
/* New HTML homepage, aligned to the React visual language. */
.html-royal-feature-strip{display:grid;grid-template-columns:repeat(4,1fr);background:linear-gradient(115deg,#470f1a,#761f2c);border-top:3px solid #d1ac53;border-bottom:1px solid #d1ac53;color:#fff;padding:23px clamp(18px,5vw,80px);gap:15px}.html-royal-feature-strip article{padding:10px 15px;border-right:1px solid #bd865555}.html-royal-feature-strip strong{display:block;color:#fff}.html-royal-feature-strip small{color:#f3d283}.html-royal-section{padding:43px 0}.html-royal-section h2{font-family:Georgia,serif;color:#602031;font-size:clamp(27px,3vw,39px)}.html-royal-section .card h3{color:#62222f}
@media(max-width:850px){.html-royal-feature-strip{grid-template-columns:repeat(2,1fr)}.html-royal-feature-strip article:nth-child(2){border:0}}@media(max-width:540px){.hero{min-height:430px;padding:45px 26px}.html-royal-feature-strip{gap:4px;padding:12px}.html-royal-feature-strip article{padding:9px;border:0}.html-royal-feature-strip small{font-size:11px}}

/* Full-width hero only on the home route; keep forms constrained elsewhere. */
main.container:has(> .html-royal-feature-strip){width:100%;max-width:none;padding:0}
.html-royal-section{max-width:1290px;margin:auto;padding:55px clamp(17px,3vw,40px)}
.html-royal-category-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(165px,1fr));gap:13px;margin-bottom:44px}
.html-royal-category{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px;min-height:150px;background:#fffefb;border:1px solid #e3d09f;border-radius:15px;color:#4f1d28;padding:20px;text-align:center}
.html-royal-category>span{font-size:30px;color:#751f2b}.html-royal-category strong{color:#57202d}.html-royal-category small{color:#751f2b;font-weight:700}
.html-royal-category:hover{border-color:#c19c45;background:#fff9eb;box-shadow:0 9px 20px #491d1c16}

/* Consistent maroon actions on server-rendered admin and customer pages. */
:root{--royal-green:#751f2b;--royal-maroon:#751f2b;--royal-gold:#d5ab4e}
main .button:not(.danger):not(.secondary):not(.outline),main button.primary,main .btn-primary,main a.btn-primary,main button[type="submit"]:not(.danger):not(.secondary){background:#751f2b!important;border-color:#751f2b!important;color:white!important}
main .button:not(.danger):not(.secondary):not(.outline):hover,main button.primary:hover,main .btn-primary:hover{background:#480f1b!important}
main input[type="checkbox"],main input[type="radio"]{accent-color:#751f2b}