:root{--ink:#111111;--cream:#f3f4f6;--paper:#ffffff;--line:#e3e5e8;--muted:#6f737a;--gold:#111111;--good:#237a45;--bad:#b33a32}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--ink);font-family:Arial,Helvetica,sans-serif}h1,h2,h3{font-family:Georgia,'Times New Roman',serif;font-weight:400;margin:0}button,input,textarea,select{font:inherit}button{cursor:pointer}.hidden{display:none!important}.eyebrow{font-size:10px;text-transform:uppercase;letter-spacing:.2em;color:var(--gold);font-weight:700}.muted{color:var(--muted);line-height:1.6}.login-screen{min-height:100vh;display:flex;align-items:center;justify-content:center;position:relative;background:url('https://images.unsplash.com/photo-1509440159596-0249088772ff?auto=format&fit=crop&w=1600&q=90') center/cover no-repeat;}.login-visual{position:relative;background:url('https://images.unsplash.com/photo-1509440159596-0249088772ff?auto=format&fit=crop&w=1600&q=90') center/cover}.login-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.2),rgba(0,0,0,.62))}.login-brand{position:absolute;left:8%;bottom:9%;color:#fff}.login-brand img{width:min(280px,52vw);max-height:130px;object-fit:contain;object-position:left center}.login-brand p{letter-spacing:.15em;text-transform:uppercase;font-size:10px}.login-panel{display:flex;align-items:center;justify-content:center;width:100%;position:relative;z-index:2;padding:40px;background:transparent}.login-box{width:min(430px,100%);background:#161616ee;padding:42px;border-radius:18px;box-shadow:0 20px 60px rgba(0,0,0,.45);text-align:center}.login-box h1{font-size:52px;margin:14px 0}.login-box label,label{display:block;margin:18px 0 7px;font-size:10px;text-transform:uppercase;letter-spacing:.14em;font-weight:700}.login-help{font-size:12px;color:var(--muted);margin-top:18px}.wide{width:100%;margin-top:22px}.app{display:grid;grid-template-columns:264px minmax(0,1fr);min-height:100vh}.side{background:var(--ink);color:#fff;padding:30px 20px;display:flex;flex-direction:column;position:sticky;top:0;height:100vh;overflow:auto}.side-logo{display:block;padding:4px 10px 14px}.side-logo img{width:170px;height:72px;object-fit:contain;object-position:left center}.side-caption{padding:0 10px 24px;color:#9c978f;font-size:10px;text-transform:uppercase;letter-spacing:.18em}.side nav{display:grid;gap:3px}.side nav button,.side-footer button{border:0;background:transparent;color:#bbb7af;text-align:left;padding:11px 10px;border-radius:2px;transition:.2s}.side nav button span{font-size:9px;color:#736f68;margin-right:12px}.side nav button:hover,.side nav button.active{background:#2a2a2a;color:#fff}.side-footer{margin-top:auto;padding-top:24px;border-top:1px solid #343434;display:grid}.side-footer a{color:#ffffff;text-decoration:none;padding:10px;font-size:12px}.main{padding:38px 44px 70px;min-width:0}.topbar{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:32px}.topbar h1{font-size:34px;margin-top:7px}.topbar-actions{display:flex;gap:10px;align-items:center}.topbar select{width:auto;min-width:155px}.panel>.section-head,.section-head{display:flex;justify-content:space-between;gap:30px;align-items:end;margin-bottom:24px}.section-head h1{font-size:40px;margin:8px 0}.section-head p{margin:0;color:var(--muted)}input,textarea,select{width:100%;padding:12px 13px;border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:0;outline:none}input:focus,textarea:focus,select:focus{border-color:var(--gold);box-shadow:0 0 0 2px rgba(17,17,17,.10)}textarea{min-height:100px;resize:vertical}.primary,.outline,.danger{border:1px solid var(--ink);padding:12px 17px;transition:.2s}.primary{background:var(--ink);color:#fff}.primary:hover{background:#35352f}.outline{background:transparent;color:var(--ink)}.outline:hover{background:var(--ink);color:#fff}.danger{background:transparent;color:var(--bad);border-color:#b77a74}.small{padding:8px 12px;font-size:12px}.metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:20px}.metric-card{background:var(--paper);border:1px solid var(--line);padding:20px}.metric-card .label{font-size:10px;text-transform:uppercase;letter-spacing:.13em;color:var(--muted)}.metric-card .value{font-family:Georgia,serif;font-size:32px;margin:11px 0 7px}.metric-card .delta{font-size:11px;color:var(--muted)}.metric-card .delta.good{color:var(--good)}.dashboard-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.card,.form-card,.table-card,.list-card{background:var(--paper);border:1px solid var(--line);padding:22px}.span-2{grid-column:span 2}.card-head{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:20px}.card-head h2,.card>h2{font-size:24px;margin:7px 0 18px}.form-grid{display:grid;gap:16px}.form-grid.two{grid-template-columns:repeat(2,1fr)}.form-grid.three{grid-template-columns:repeat(3,1fr)}.form-grid.four{grid-template-columns:repeat(4,1fr)}.form-card>.primary{margin-top:20px}.inline-form{display:flex;gap:16px;align-items:end;margin-bottom:18px}.inline-form>div{flex:1}.inline-form label{margin-top:0}.bar-chart{height:250px;display:flex;align-items:flex-end;gap:5px;padding-top:25px;border-bottom:1px solid var(--line);overflow:hidden}.bar-column{flex:1;min-width:5px;display:flex;flex-direction:column;justify-content:flex-end;height:100%;position:relative}.bar-column i{display:block;background:var(--ink);min-height:2px;transition:.2s}.bar-column:hover i{background:var(--gold)}.bar-column small{font-size:8px;color:var(--muted);text-align:center;margin-top:6px}.bar-column em{display:none;position:absolute;bottom:calc(var(--h) + 10px);left:50%;transform:translateX(-50%);font-style:normal;font-size:10px;background:var(--ink);color:white;padding:5px;white-space:nowrap;z-index:2}.bar-column:hover em{display:block}.rank-row,.breakdown-row,.kpi-row{padding:13px 0;border-bottom:1px solid #eceef1}.rank-row:last-child,.breakdown-row:last-child,.kpi-row:last-child{border-bottom:0}.row-main{display:flex;justify-content:space-between;gap:15px}.progress{height:5px;background:#eceef1;margin-top:9px}.progress i{display:block;height:100%;background:var(--gold)}.profit-block{display:grid;grid-template-columns:1fr 1fr;gap:12px}.profit-box{border:1px solid var(--line);padding:15px}.profit-box strong{display:block;font-family:Georgia,serif;font-size:25px;margin-top:8px}.sale-preview{background:#f1f2f4;padding:14px;margin-top:16px;display:flex;gap:28px;flex-wrap:wrap}.sale-preview span{font-size:12px}.table-card{margin-top:18px}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;min-width:760px}th,td{text-align:left;padding:13px 10px;border-bottom:1px solid var(--line);font-size:12px}th{text-transform:uppercase;letter-spacing:.1em;font-size:9px;color:var(--muted)}.product-admin-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px;margin-top:18px}.product-admin-card{background:var(--paper);border:1px solid var(--line);padding:18px;display:grid;grid-template-columns:84px 1fr;gap:16px}.product-admin-card img{width:84px;height:84px;object-fit:cover;background:#ddd}.product-admin-card h3{font-size:20px}.product-meta{font-size:12px;color:var(--muted);margin:6px 0}.product-actions{display:flex;gap:7px;flex-wrap:wrap;margin-top:12px}.list-row{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:15px 0;border-bottom:1px solid var(--line)}.list-row:last-child{border-bottom:0}.media-admin-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.media-admin-card{background:var(--paper);border:1px solid var(--line);padding:18px}.media-preview{height:220px;background:#eef0f2 center/cover no-repeat;display:grid;place-items:center;overflow:hidden;color:var(--muted);text-align:center}.media-preview video{width:100%;height:100%;object-fit:cover}.media-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.upload-progress{height:5px;background:#eceef1;margin-top:14px;overflow:hidden;display:none}.upload-progress.active{display:block}.upload-progress i{display:block;width:0;height:100%;background:var(--ink)}.media-status{min-height:18px;font-size:11px}.media-status.success{color:var(--good)}.media-status.error{color:var(--bad)}.health-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-bottom:18px}.health-card{background:var(--paper);border:1px solid var(--line);padding:18px}.health-card strong,.health-card span{display:block}.health-card span{font-size:12px;color:var(--muted);margin-top:8px}.health-card.ok{border-left:4px solid var(--good)}.health-card.bad{border-left:4px solid var(--bad)}.system-save-status{position:fixed;top:18px;right:18px;z-index:1000;background:var(--ink);color:#fff;padding:12px 16px;opacity:0;transform:translateY(-10px);pointer-events:none;transition:.25s}.system-save-status.show{opacity:1;transform:none}.system-save-status.error{background:var(--bad)}.local-server-warning{padding:12px;background:#8d302b;color:white;text-align:center}.empty{color:var(--muted);padding:22px 0}.positive{color:var(--good)}.negative{color:var(--bad)}
@media(max-width:1100px){.metric-grid{grid-template-columns:repeat(2,1fr)}.form-grid.four,.form-grid.three{grid-template-columns:repeat(2,1fr)}}
@media(max-width:820px){.login-screen{grid-template-columns:1fr}.login-visual{min-height:280px}.app{grid-template-columns:1fr}.side{position:relative;height:auto}.side nav{grid-template-columns:repeat(2,1fr)}.main{padding:25px 18px}.topbar,.section-head{align-items:flex-start;flex-direction:column}.metric-grid,.dashboard-grid,.product-admin-grid,.media-admin-grid,.health-grid{grid-template-columns:1fr}.span-2{grid-column:auto}.form-grid.two,.form-grid.three,.form-grid.four{grid-template-columns:1fr}.inline-form{align-items:stretch;flex-direction:column}.topbar-actions{width:100%;flex-wrap:wrap}.topbar-actions select{flex:1}.login-box h1{font-size:42px}}

/* Admin visual alignment */
body{background:#f3f4f6}
.main{background:#f3f4f6}
.side{box-shadow:4px 0 18px rgba(0,0,0,.06)}
.side nav button,.side-footer button{border-radius:8px;margin-bottom:2px}
.side nav button:hover,.side nav button.active{background:#2b2b2b}
.metric-card,.card,.form-card,.table-card,.list-card,.product-admin-card,.media-admin-card,.health-card{border-radius:12px;box-shadow:0 1px 2px rgba(15,23,42,.03)}
.primary,.outline,.danger{border-radius:8px}
input,textarea,select{border-radius:8px;background:#fff}
.topbar{padding-bottom:18px;border-bottom:1px solid var(--line)}
.metric-card .value{font-family:Arial,Helvetica,sans-serif;font-weight:700}
.progress{border-radius:999px;overflow:hidden}
.progress i{background:#111}
.bar-column i{border-radius:4px 4px 0 0}
.sale-preview{border-radius:10px}
.table-card{overflow:hidden}
thead{background:#f7f7f8}
.side-logo img{width:182px}

/* Centered premium login */
.login-screen{position:relative;min-height:100vh;display:grid;place-items:center;padding:28px;background:url('https://images.unsplash.com/photo-1509440159596-0249088772ff?auto=format&fit=crop&w=1800&q=90') center/cover no-repeat}
.login-screen>.login-overlay{position:absolute;inset:0;background:rgba(0,0,0,.66)}
.login-panel{position:relative;z-index:1;display:block;width:min(460px,100%);padding:0;background:transparent}
.login-box{width:100%;background:#fff;padding:42px 40px;border:1px solid rgba(255,255,255,.35);text-align:left}
.login-logo{display:block;width:210px;max-height:90px;object-fit:contain;object-position:center;margin:0 auto 8px;filter:invert(1)}
.login-tagline{text-align:center;margin:0 0 28px;font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.login-box>.eyebrow{display:block;text-align:center}
.login-box h1{text-align:center;font-size:46px;margin:12px 0}
.login-box>.muted{text-align:center;margin:0 0 24px}
.login-help{text-align:center}
@media(max-width:560px){.login-screen{padding:18px}.login-box{padding:34px 24px}.login-box h1{font-size:38px}.login-logo{width:185px}}


/* Your Bread Point dark management theme */
:root{
  --dark-bg:#111214;
  --dark-panel:#191b1f;
  --dark-card:#202328;
  --dark-card-2:#262a30;
  --dark-line:#353941;
  --dark-text:#f4f1eb;
  --dark-muted:#a8a9ad;
  --dark-accent:#d0b07b;
}
body,.main{background:var(--dark-bg);color:var(--dark-text)}
.app{background:var(--dark-bg)}
.side{background:#0d0e10;border-right:1px solid #272a2f;box-shadow:none}
.side-caption{color:#85878c}
.side nav button,.side-footer button{color:#b9bbc0}
.side nav button span{color:#6f7279}
.side nav button:hover,.side nav button.active{background:#25282d;color:#fff}
.side-footer{border-top-color:#292c31}.side-footer a{color:#e9e6df}
.topbar{border-bottom-color:var(--dark-line)}
.topbar h1,.section-head h1,.card h2,.card-head h2,.product-admin-card h3{color:var(--dark-text)}
.section-head p,.muted,.metric-card .label,.metric-card .delta,.product-meta,.empty{color:var(--dark-muted)}
.eyebrow{color:var(--dark-accent)}
.metric-card,.card,.form-card,.table-card,.list-card,.product-admin-card,.media-admin-card,.health-card{
  background:var(--dark-card);border-color:var(--dark-line);box-shadow:none;color:var(--dark-text)
}
.metric-card:hover,.card:hover{border-color:#494e57}
input,textarea,select{background:#17191d;border-color:#3a3e46;color:var(--dark-text)}
input::placeholder,textarea::placeholder{color:#777b83}
input:focus,textarea:focus,select:focus{border-color:var(--dark-accent);box-shadow:0 0 0 2px rgba(208,176,123,.12)}
select option{background:#17191d;color:#fff}
.primary{background:#f3efe7;color:#111;border-color:#f3efe7}
.primary:hover{background:var(--dark-accent);border-color:var(--dark-accent);color:#111}
.outline{border-color:#525761;color:#f0eee9;background:transparent}.outline:hover{background:#f3efe7;color:#111;border-color:#f3efe7}
.danger{color:#e29a92;border-color:#784a47}.danger:hover{background:#5a302d;color:#fff}
.sale-preview{background:#17191d;border:1px solid var(--dark-line)}
.table-card thead,thead{background:#181a1e}th,td{border-bottom-color:var(--dark-line)}th{color:#979aa1}
.progress,.upload-progress{background:#343840}.progress i,.upload-progress i,.bar-column i{background:var(--dark-accent)}
.rank-row,.breakdown-row,.kpi-row,.list-row{border-bottom-color:var(--dark-line)}
.profit-box{border-color:var(--dark-line);background:#1b1e22}
.media-preview{background-color:#17191d;color:var(--dark-muted)}
.local-server-warning{background:#24272c;color:#d7d9dd;border-bottom:1px solid #3b3f47}
.local-server-warning strong{color:#fff}
.system-save-status{background:#f3efe7;color:#111}.system-save-status.error{background:#713633;color:#fff}
.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.branding-card{min-width:0}.favicon-preview{width:118px;height:118px;border-radius:22px;background-size:contain;background-repeat:no-repeat;border:1px solid var(--dark-line);margin-bottom:18px}

/* Fully centered black login */
.login-screen{min-height:100vh;display:grid;place-items:center;padding:28px;background:url('https://images.unsplash.com/photo-1509440159596-0249088772ff?auto=format&fit=crop&w=1800&q=90') center/cover no-repeat}
.login-screen>.login-overlay{background:rgba(0,0,0,.72)}
.login-panel{width:min(470px,100%);display:block;padding:0}
.login-box{width:100%;background:rgba(15,16,18,.96);border:1px solid rgba(255,255,255,.13);padding:44px 42px;color:#fff;text-align:left;border-radius:18px;box-shadow:0 24px 70px rgba(0,0,0,.45);backdrop-filter:blur(9px)}
.login-logo{width:205px;max-height:96px;filter:none;object-fit:contain;margin:0 auto 10px}
.login-tagline{color:#a9abb0;margin-bottom:26px}
.login-box>.eyebrow{color:var(--dark-accent)}
.login-box h1{color:#fff;text-align:center;font-size:45px;margin:12px 0}
.login-box>.muted{color:#b5b7bc;text-align:center}
.login-box label{color:#dedfe2}
.login-box input{background:#1b1d21;border-color:#40444c;color:#fff}
.login-box .primary{width:100%;background:#f4f0e8;color:#111;border-color:#f4f0e8}
.login-box .primary:hover{background:var(--dark-accent);border-color:var(--dark-accent)}
@media(max-width:820px){.settings-grid{grid-template-columns:1fr}}
@media(max-width:560px){.login-box{padding:36px 24px}.login-box h1{font-size:38px}}

.login-logo{max-width:180px;margin:0 auto 20px;display:block}.login-brand,.login-visual{display:none}.login-box h1,.login-box,label{color:#fff}.login-box input{background:#222;color:#fff;border:1px solid #444}.login-help{display:none}

/* Database login and user management */
.login-error{min-height:22px;margin:12px 0 0;color:#ff9f9f;font-size:.9rem}.setup-prompt{margin:14px 0 0;font-size:.86rem;text-align:center}.setup-prompt a{color:#fff;text-decoration:underline}.side-user{margin-top:auto;padding:18px 22px;border-top:1px solid rgba(255,255,255,.1);display:grid;gap:3px}.side-user strong{font-size:.9rem}.side-user span{color:rgba(255,255,255,.52);font-size:.72rem;text-transform:uppercase;letter-spacing:.12em}.status-pill{display:inline-flex;padding:5px 9px;border-radius:999px;font-size:.72rem;font-weight:700}.status-pill.active{background:rgba(91,199,128,.12);color:#67d98e}.status-pill.inactive{background:rgba(255,110,110,.12);color:#ff8d8d}.table-actions{display:flex;gap:7px;flex-wrap:wrap}.setup-page{min-height:100vh;background:#0c0c0c;color:#fff;padding:36px 18px}.setup-shell{width:min(900px,100%);margin:0 auto;background:#171717;border:1px solid rgba(255,255,255,.1);border-radius:24px;padding:clamp(28px,5vw,58px);box-shadow:0 30px 90px rgba(0,0,0,.35)}.setup-shell>img{width:180px;height:auto;margin-bottom:30px}.setup-shell h1{font-size:clamp(2rem,5vw,4rem);margin:.25em 0}.setup-shell code{background:#262626;padding:2px 6px;border-radius:5px}.setup-form{margin-top:30px}.setup-form h2{margin:28px 0 14px}.setup-message{padding:14px 16px;border-radius:12px;margin:20px 0}.setup-message.success{background:rgba(91,199,128,.13);color:#7ee5a2}.setup-message.error{background:rgba(255,110,110,.13);color:#ff9f9f}.setup-link{display:inline-flex;text-decoration:none;margin-top:10px}.span-2{grid-column:span 2}@media(max-width:700px){.span-2{grid-column:auto}.setup-shell{padding:26px 20px}}
