@font-face { font-family: 'Lexend Deca'; src: url('../rlyn-storefront/public/fonts/LexendDeca-VariableFont_wght.ttf') format('truetype'); font-display: swap; }

:root { --ink:#1d1717; --oxblood:#4a0d08; --wine:#6e1c15; --ivory:#f5f0e8; --paper:#fffdfa; --line:#ddd5ca; --muted:#716b65; --soft:#ebe3d8; --success:#275f43; --sidebar:255px; }
* { box-sizing:border-box; }
html { background:var(--paper); color:var(--ink); font-family:'Lexend Deca', Arial, sans-serif; }
body { margin:0; min-width:320px; }
button, input { font:inherit; }
button { cursor:pointer; }
.skip-link { position:absolute; left:-999px; top:12px; background:var(--ink); color:#fff; padding:10px 14px; z-index:10; }.skip-link:focus { left:12px; }
.admin-shell { min-height:100vh; display:grid; grid-template-columns:var(--sidebar) minmax(0, 1fr); }
.sidebar { background:var(--oxblood); color:#fff9f0; min-height:100vh; padding:25px 15px 18px; position:sticky; top:0; height:100vh; display:flex; flex-direction:column; overflow-y:auto; }
.brand { color:#fff9f0; text-decoration:none; padding:0 13px 25px; font-size:1.5rem; font-weight:730; letter-spacing:-.065em; }.brand span { font-size:.57rem; letter-spacing:.16em; margin-left:7px; vertical-align:middle; font-weight:500; }
.store-switcher { width:100%; display:flex; justify-content:space-between; text-align:left; color:#fff9f0; border:1px solid rgba(255,255,255,.22); background:rgba(255,255,255,.075); border-radius:6px; padding:12px 13px; margin-bottom:24px; }.store-switcher strong,.store-switcher small { display:block; }.store-switcher strong{ font-size:.82rem; }.store-switcher small { color:rgba(255,255,255,.68); font-size:.7rem; margin-top:3px; }.store-switcher b { font-size:1rem; font-weight:400; }
.main-nav { display:flex; flex-direction:column; gap:2px; }.nav-label { color:rgba(255,255,255,.48); font-size:.63rem; letter-spacing:.12em; text-transform:uppercase; margin:20px 13px 7px; }.nav-link,.nav-sub-link { color:rgba(255,255,255,.84); text-decoration:none; border-radius:5px; padding:9px 12px; font-size:.85rem; line-height:1.2; display:flex; align-items:center; gap:10px; }.nav-link:hover,.nav-link.is-active,.nav-sub-link:hover,.nav-sub-link.is-active { background:rgba(255,255,255,.13); color:#fff; }.nav-link i { width:14px; font-style:normal; text-align:center; font-size:.82rem; }.nav-link em { margin-left:auto; font-style:normal; color:#f5cabd; font-size:.7rem; }.nav-sub-link { padding:6px 12px 6px 36px; color:rgba(255,255,255,.7); font-size:.77rem; }.sidebar-bottom { margin-top:auto; border-top:1px solid rgba(255,255,255,.16); padding-top:14px; }.account-chip { display:flex; align-items:center; gap:9px; padding:16px 12px 0; }.account-chip>span { display:grid; place-items:center; width:28px; height:28px; border-radius:50%; background:#ecd8bd; color:var(--oxblood); font-size:.65rem; font-weight:700; }.account-chip strong,.account-chip small { display:block; }.account-chip strong { font-size:.72rem; }.account-chip small { font-size:.63rem; color:rgba(255,255,255,.62); margin-top:2px; }
.workspace { min-width:0; background:var(--paper); }.topbar { height:72px; border-bottom:1px solid var(--line); padding:0 38px; display:flex; align-items:center; justify-content:space-between; gap:20px; position:sticky; top:0; background:rgba(255,253,250,.94); backdrop-filter:blur(14px); z-index:4; }.menu-button { display:none; border:0; background:transparent; font-size:1.3rem; }.search-box { min-width:300px; max-width:540px; flex:1; height:38px; border:1px solid var(--line); border-radius:5px; display:flex; align-items:center; gap:8px; padding:0 10px; color:var(--muted); }.search-box input { border:0; outline:0; flex:1; min-width:0; background:transparent; font-size:.83rem; }.search-box kbd { font-family:inherit; padding:2px 5px; border:1px solid var(--line); border-radius:3px; font-size:.62rem; }.topbar-actions { display:flex; gap:5px; }.topbar-actions button { height:33px; width:33px; border:0; background:transparent; color:var(--ink); border-radius:4px; }.topbar-actions button:hover { background:var(--soft); }
.view { display:none; padding:47px 48px 70px; max-width:1550px; margin:0 auto; }.view.is-active { display:block; }.page-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:28px; }.eyebrow { color:var(--wine); font-size:.67rem; font-weight:650; letter-spacing:.14em; margin:0 0 8px; }.page-heading h1 { font-size:2rem; letter-spacing:-.055em; line-height:1; margin:0; font-weight:680; }.page-intro { color:var(--muted); font-size:.86rem; margin:10px 0 0; }.primary-button,.secondary-button,.text-button { border-radius:4px; padding:10px 14px; font-size:.78rem; white-space:nowrap; }.primary-button { background:var(--oxblood); color:#fff; border:1px solid var(--oxblood); }.primary-button:hover { background:#2f0603; }.secondary-button { background:var(--paper); color:var(--ink); border:1px solid var(--line); }.secondary-button:hover { background:var(--ivory); }.text-button,.row-action { border:0; background:transparent; color:var(--wine); padding:0; text-decoration:underline; text-underline-offset:3px; font-size:.75rem; }
.metric-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:13px; margin-bottom:18px; }.metric-card,.panel { border:1px solid var(--line); background:var(--paper); border-radius:6px; }.metric-card { padding:18px; min-height:124px; display:flex; flex-direction:column; }.metric-card span { color:var(--muted); font-size:.75rem; }.metric-card strong { font-size:1.7rem; letter-spacing:-.055em; margin-top:auto; font-weight:650; }.metric-card small { color:var(--muted); font-size:.69rem; margin-top:5px; }.dashboard-grid { display:grid; grid-template-columns:1.45fr .8fr; gap:18px; }.panel { padding:21px; }.panel-large { min-height:318px; }.panel-heading { display:flex; justify-content:space-between; align-items:start; gap:15px; }.panel h2 { margin:0; font-size:1rem; letter-spacing:-.025em; }.panel-heading p { font-size:.71rem; color:var(--muted); margin:5px 0 0; }.chart-empty { height:220px; margin-top:23px; display:flex; align-items:flex-end; justify-content:center; padding:28px; color:var(--muted); font-size:.75rem; position:relative; overflow:hidden; background:linear-gradient(to bottom, rgba(245,240,232,.45), transparent); }.chart-line { position:absolute; left:20px; right:20px; bottom:74px; height:1px; background:var(--line); }.compact-inventory { margin-top:12px; }.inventory-line { display:grid; grid-template-columns:18px 1fr auto; align-items:center; gap:8px; padding:9px 0; border-bottom:1px solid var(--soft); font-size:.75rem; }.inventory-line:last-child { border-bottom:0; }.colour-dot { width:12px; height:12px; border-radius:50%; border:1px solid rgba(0,0,0,.2); }.inventory-line b { color:var(--muted); font-size:.7rem; font-weight:500; }.empty-inline { min-height:150px; display:flex; flex-direction:column; justify-content:center; gap:7px; color:var(--muted); font-size:.75rem; }.empty-inline strong { color:var(--ink); font-size:.82rem; }
.toolbar { display:flex; align-items:center; gap:8px; margin-bottom:16px; }.table-search { height:38px; display:flex; align-items:center; gap:7px; border:1px solid var(--line); padding:0 10px; border-radius:4px; flex:1; max-width:410px; color:var(--muted); }.table-search input { border:0; outline:0; min-width:0; flex:1; font-size:.78rem; background:transparent; }.table-panel { padding:0; overflow-x:auto; } table { width:100%; border-collapse:collapse; text-align:left; font-size:.78rem; } th { color:var(--muted); background:#fbf8f3; font-size:.68rem; letter-spacing:.03em; font-weight:550; } th,td { padding:15px 18px; border-bottom:1px solid var(--line); vertical-align:middle; white-space:nowrap; } tr:last-child td { border-bottom:0; }.product-cell { display:flex; gap:11px; align-items:center; }.product-cell strong,.product-cell small { display:block; }.product-cell strong { font-size:.82rem; }.product-cell small { color:var(--muted); font-size:.68rem; margin-top:3px; }.product-swatch { width:32px; height:32px; border-radius:3px; border:1px solid var(--line); }.swatch-beige { background:#b79c80; }.status { display:inline-flex; align-items:center; gap:5px; font-size:.68rem; border-radius:100px; padding:4px 8px; font-weight:600; }.status.active { color:var(--success); background:#e3f0e8; }.status.pending { color:#795b13; background:#f8eed0; }.notice-banner { display:flex; gap:13px; align-items:center; background:#efe2d5; color:#4c271d; border:1px solid #e5d2c1; padding:13px 16px; border-radius:5px; margin-bottom:16px; font-size:.76rem; }.notice-banner span { color:#684b41; }.history-panel { margin-top:16px; }.segmented-tabs { display:flex; gap:5px; border-bottom:1px solid var(--line); margin-bottom:22px; }.segmented-tabs button { border:0; background:transparent; padding:0 13px 11px; font-size:.77rem; color:var(--muted); }.segmented-tabs .is-selected { color:var(--ink); border-bottom:2px solid var(--oxblood); }.empty-state { min-height:350px; border:1px dashed #cfc4b8; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:35px; border-radius:6px; background:linear-gradient(135deg,#fffdfa,#f8f2ea); }.empty-state>span { font-size:1.6rem; color:var(--wine); margin-bottom:11px; }.empty-state h2 { font-size:1rem; margin:0; letter-spacing:-.02em; }.empty-state p { color:var(--muted); font-size:.76rem; margin:8px 0 0; max-width:340px; line-height:1.55; }.empty-state.compact { min-height:190px; margin-top:18px; }.content-cards,.settings-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }.content-card { border:1px solid var(--line); min-height:150px; padding:22px; background:linear-gradient(135deg,#fffdfa,#f1e5d8); display:flex; flex-direction:column; justify-content:space-between; }.content-card strong { font-size:1rem; }.content-card span,.security-copy { color:var(--muted); font-size:.77rem; line-height:1.5; }.settings-grid .panel { min-height:190px; }.settings-grid dl { margin:15px 0 0; display:grid; grid-template-columns:110px 1fr; gap:9px 15px; font-size:.77rem; }.settings-grid dt { color:var(--muted); }.settings-grid dd { margin:0; }.toast { position:fixed; right:24px; bottom:24px; max-width:350px; padding:13px 15px; border-radius:5px; background:#24100e; color:#fff; font-size:.76rem; line-height:1.45; transform:translateY(130%); opacity:0; transition:.25s ease; z-index:10; box-shadow:0 12px 32px rgba(0,0,0,.18); }.toast.is-visible { transform:translateY(0); opacity:1; }
@media (max-width:1024px) { :root{--sidebar:225px}.view{padding:36px 30px 60px}.topbar{padding:0 30px}.metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.dashboard-grid{grid-template-columns:1fr}.panel-large{min-height:260px} }
@media (max-width:760px) { .admin-shell{display:block}.sidebar{position:fixed; width:min(290px,88vw); left:0; transform:translateX(-105%); z-index:20; transition:transform .25s ease; box-shadow:20px 0 50px rgba(0,0,0,.2)}body.menu-open .sidebar{transform:translateX(0)}.menu-button{display:block}.topbar{height:62px;padding:0 18px}.search-box{min-width:0;height:35px}.search-box kbd{display:none}.view{padding:30px 18px 50px}.page-heading{align-items:flex-start;flex-direction:column}.page-heading h1{font-size:1.75rem}.metric-grid,.content-cards,.settings-grid{grid-template-columns:1fr}.metric-card{min-height:105px}.toolbar{flex-wrap:wrap}.table-search{max-width:none;width:100%;flex-basis:100%}.notice-banner{align-items:flex-start;flex-direction:column;gap:4px}.toast{left:16px;right:16px;bottom:16px;max-width:none} }
.login-page { min-height:100vh; display:grid; place-items:center; padding:24px; background:linear-gradient(135deg, var(--oxblood), #210504); }.login-card { width:min(100%, 430px); padding:42px; background:var(--paper); border-radius:7px; box-shadow:0 24px 80px rgba(0,0,0,.28); }.login-brand { display:block; color:var(--oxblood); text-decoration:none; font-size:1.45rem; letter-spacing:-.065em; font-weight:730; margin-bottom:45px; }.login-brand span { font-size:.57rem; letter-spacing:.16em; margin-left:7px; vertical-align:middle; font-weight:500; }.login-card h1 { margin:0; font-size:2rem; letter-spacing:-.055em; }.login-intro { color:var(--muted); font-size:.84rem; line-height:1.55; margin:11px 0 25px; }.login-card form { display:grid; gap:16px; }.login-card label { display:grid; gap:7px; font-size:.76rem; font-weight:600; }.login-card input { height:44px; background:#fff; border:1px solid var(--line); border-radius:4px; padding:0 12px; outline-color:var(--oxblood); }.login-card .primary-button { width:100%; height:44px; margin-top:4px; }.login-message { min-height:22px; color:var(--wine); font-size:.76rem; line-height:1.45; margin:16px 0 0; }.login-footnote { border-top:1px solid var(--line); padding-top:16px; color:var(--muted); font-size:.69rem; line-height:1.5; margin:22px 0 0; }