*{box-sizing:border-box}body{margin:0;background:#F7F3EC;color:#1C1A17;font-family:Arial,Helvetica,sans-serif}
a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}
.app{display:grid;grid-template-columns:250px 1fr;min-height:100vh}
.side{background:#f7f4ea;border-right:1px solid #ddd8c8;padding:18px 14px;position:sticky;top:0;height:100vh;display:flex;flex-direction:column}
.brand{display:flex;gap:10px;align-items:center;padding:4px 6px 16px}.logo{width:36px;height:36px;border-radius:10px;background:#C96A4A;color:#fff;display:grid;place-items:center;font-size:22px}
.brand b{font-size:19px;display:block}.brand small{color:#777}
.sec{font:600 11px Arial,sans-serif;letter-spacing:.12em;color:#999;margin:18px 8px 6px}
#nav a{display:flex;justify-content:space-between;padding:9px 10px;border-radius:10px;font-family:Arial,sans-serif;font-size:14px}
#nav a:hover,#nav a.on{background:#f3e2d8;color:#C96A4A;font-weight:700}
.badge{background:#C96A4A;color:#fff;border-radius:20px;padding:1px 8px;font-size:11px}.badge.pink{background:#f3d7d7;color:#8a3b3b}
.goal{margin-top:auto;background:#efe9d8;border-radius:14px;padding:12px}.goal .row{display:flex;justify-content:space-between;font-family:Arial,sans-serif;font-size:13px}
.track{height:7px;background:#ddd;border-radius:9px;margin:8px 0;overflow:hidden}.track i{display:block;height:100%;background:#C96A4A}
.goal small{color:#777}.user{display:flex;gap:10px;align-items:center;padding:14px 6px 2px;font-family:Arial,sans-serif}.av{width:36px;height:36px;border-radius:50%;background:#cfe3da;display:grid;place-items:center;font-weight:700}.user small{color:#777;display:block}
main{padding:18px 26px 10px;min-width:0}
.top{display:flex;justify-content:space-between;gap:16px;align-items:center}.search{flex:1;max-width:520px;background:#fff;border:1px solid #ddd8c8;border-radius:30px;padding:9px 14px;display:flex;gap:8px;font-family:Arial}.search input{border:0;outline:0;flex:1}.search kbd{background:#eee;border-radius:5px;padding:2px 6px;font-size:11px}
.topr{display:flex;gap:8px;align-items:center}.pill{background:#fff;border:1px solid #ddd;border-radius:20px;padding:8px 12px;font-family:Arial;font-size:13px}.icon{background:#fff;border:1px solid #ddd;width:36px;height:36px;border-radius:50%}.new{background:#C96A4A;color:#fff;border:0;border-radius:20px;padding:9px 16px}
h1{font-size:38px;margin:6px 0}.sub{font-family:Arial;color:#555;max-width:800px;line-height:1.5}.sub b{color:#111}
.range{display:flex;gap:6px;align-items:center}.range button,.chip{background:#fff;border:1px solid #ddd;border-radius:20px;padding:8px 13px}.range button.on,.chip.on{background:#1d2b29;color:#fff}
.grid{display:grid;grid-template-columns:1.55fr 1fr 1fr;gap:16px;margin-top:18px}
.card{background:#fdfbf5;border:1px solid #e2ddcc;border-radius:18px;padding:18px}.card h3{margin:0 0 4px;font-size:17px}
.teal{background:#C96A4A;color:#fff;border-color:#0d5b55;background-image:radial-gradient(#ffffff14 1px,transparent 1px);background-size:14px 14px}
.teal .mut{color:#f3d9cc}.big{font-size:52px;line-height:1;margin:8px 0 4px}.up{background:#fff;color:#C96A4A;border-radius:20px;padding:3px 9px;font:700 13px Arial}
.bars{display:flex;align-items:end;gap:4px;height:130px;margin:18px 0}.bars i{flex:1;background:#ffffff55;border-radius:3px 3px 0 0}.bars i.gold{background:#e8b93c}.bars i:hover{outline:2px solid #fff}
.legend{display:flex;gap:12px;font:12px Arial;color:#cfe0dc;flex-wrap:wrap}.seg{height:8px;border-radius:9px;display:flex;overflow:hidden;margin:14px 0}.seg i{display:block}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;border-top:1px solid #ffffff33;padding-top:12px;font-family:Arial}.stats b{font-size:20px;display:block}
.dialwrap{text-align:center}.dial{width:190px;height:190px;margin:8px auto;position:relative}.dial svg{width:100%;height:100%}.dial .c{position:absolute;inset:0;display:grid;place-content:center}.dial .c b{font-size:34px}.dial .c span{font:12px Arial;color:#777}
.hourlist{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;font:12px Arial}.hourlist div{background:#f2eee3;border-radius:8px;padding:6px;text-align:center}.hourlist b{display:block}
.kiln{display:flex;gap:10px;padding:10px 0;border-bottom:1px solid #eee;align-items:center}.kiln:last-child{border:0}.sw{width:38px;height:38px;border-radius:10px;flex:none}.kiln b{font-family:Arial;font-size:14px}.kiln small{color:#777;display:block}.plus{margin-left:auto;border:1px solid #ddd;background:#fff;width:28px;height:28px;border-radius:50%}
.grid2{display:grid;grid-template-columns:1.7fr 1fr;gap:16px;margin-top:16px}
.stackbars{display:flex;align-items:end;gap:14px;height:210px;padding-top:20px}.stackbars>div{flex:1;display:flex;flex-direction:column-reverse;border-radius:6px 6px 0 0;overflow:hidden;min-height:20px}.stackbars i{display:block}
.catlist{font-family:Arial;font-size:13px}.catlist div{display:flex;justify-content:space-between;padding:7px 0;border-bottom:1px solid #eee}
table{width:100%;border-collapse:collapse;font-family:Arial;font-size:13px}th{color:#888;text-align:left;font-size:11px;text-transform:uppercase;padding:8px}td{padding:11px 8px;border-top:1px solid #eee}
.pill2{padding:4px 9px;border-radius:20px;background:#e6f2ec;font-size:12px}.pill2.warn{background:#fdf0d5}.pill2.ship{background:#e8eefb}
.products{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.prod{overflow:hidden}
.tabs{display:flex;gap:8px;margin:14px 0;flex-wrap:wrap}.note{background:#fff8d6;border:1px solid #e8d88a;border-radius:12px;padding:12px;font-family:Arial}
footer{color:#888;font:12px Arial;text-align:center;padding:18px}
@media(max-width:1000px){.app{grid-template-columns:1fr}.side{position:static;height:auto}.grid,.grid2,.products{grid-template-columns:1fr}.top{flex-wrap:wrap}}

/* ---- Pelago refinement: demand, bench, drawer, dark theme ---- */
.demandgrid{display:grid;grid-template-columns:220px 1fr 250px;gap:20px;margin-top:14px}
.catclick div{cursor:pointer;border-radius:10px;padding:6px 8px}
.catclick div.sel{background:#efe9d8}
.catclick div{display:flex;justify-content:space-between;align-items:center}
.chartwrap{position:relative}
.mbars{display:flex;align-items:end;gap:10px;height:240px;padding-top:10px}
.mbar{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:6px;cursor:pointer;min-width:0;height:100%}
.mbar .mstack{width:100%;max-width:44px;display:flex;flex-direction:column-reverse;border-radius:6px 6px 0 0;overflow:hidden;background-image:radial-gradient(#C96A4A22 1px,transparent 1.4px);background-size:5px 5px}
.mbar .mstack i{display:block;width:100%}
.mbar span{font:11px Arial;color:#777}
.mbar.sel .mstack{outline:2px solid #C96A4A;outline-offset:2px}
.mtip{display:none;position:absolute;top:0;left:50%;transform:translateX(-50%);background:#1d2b29;color:#fff;font:700 13px Arial;padding:6px 12px;border-radius:20px;z-index:3}
.mini{background:#f2eee3;border-radius:12px;padding:10px 12px;margin-top:12px}
.mini p{margin:4px 0;font-family:Arial;font-size:13px}
.best .brow{display:flex;gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid #eee;font-family:Arial;font-size:13px}
.best .brow small{display:block;color:#777}
.btrack{height:6px;background:#eee;border-radius:9px;margin-top:6px;overflow:hidden}
.btrack i{display:block;height:100%;background:#C96A4A}
.orow{cursor:pointer}.orow:hover{background:#f7f4ea}
.bench{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.benchcol{background:#f2eee3}
.bcard{background:#fdfbf5;border:1px solid #e2ddcc;border-radius:14px;padding:12px;margin-top:10px}
.btn-teal{background:#C96A4A;color:#fff;border:0;border-radius:20px;padding:8px 14px;font-family:Arial;font-size:13px}
.btn-lite{background:#e6e0cd;border:0;border-radius:20px;padding:8px 14px;font-family:Arial;font-size:13px}
.scrim{position:fixed;inset:0;background:#00000055;z-index:40}
.drawer{position:fixed;top:0;right:0;width:400px;max-width:92vw;height:100vh;overflow:auto;background:#fdfbf5;z-index:41;padding:22px;box-shadow:-8px 0 30px #0003}
.timeline{display:flex;justify-content:space-between;margin:18px 0}
.timeline div{text-align:center;font:12px Arial}
.timeline i{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:#C96A4A;color:#fff;margin:0 auto 6px}
.timeline small{display:block;color:#777}
.stamp{display:inline-block;border:3px solid #c96a5a;color:#c96a5a;font:700 18px Arial;letter-spacing:.15em;padding:6px 14px;border-radius:8px;transform:rotate(-8deg);margin:10px 0}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:#1d2b29;color:#fff;font:13px Arial;padding:12px 18px;border-radius:30px;z-index:60;display:flex;gap:14px;align-items:center;box-shadow:0 8px 24px #0004}
.toast button{background:#e8b93c;border:0;border-radius:20px;padding:6px 12px;font-weight:700;cursor:pointer}
.kilncal{display:grid;grid-template-columns:repeat(14,1fr);gap:6px;margin-top:14px;overflow-x:auto}
.kday{background:#f2eee3;border-radius:10px;padding:8px;min-height:110px;font-family:Arial}
.kday small{display:block;color:#777;font-size:11px}
.kday b{display:block;margin:2px 0 6px}
.kday span{font-size:11px;color:#333;display:block;line-height:1.4}
.kday i{color:#ccc}
.shelfbar{height:7px;background:#eee;border-radius:9px;margin:6px 0;position:relative;overflow:visible}
.shelfbar i{display:block;height:100%;border-radius:9px}
.shelfbar em{position:absolute;top:-2px;width:2px;height:11px;background:#999}
.field{display:block;font:13px Arial;margin:10px 0}
.field input,.field textarea,.field select{width:100%;margin-top:6px;padding:9px 12px;border:1px solid #ddd;border-radius:10px;font:inherit;background:#fff}
.statgrid .card small{font:13px Arial;color:#777}
/* dark studio theme (Products view + toggle) */
body.dark{background:#131d1a;color:#e8ede9}
body.dark .side{background:#1a2622;border-color:#2a3a35}
body.dark .side a{color:#cfd8d2}
body.dark #nav a:hover,body.dark #nav a.on{background:#24352f;color:#e8a87c}
body.dark .card{background:#1e2c27;border-color:#2f423b}
body.dark .goal{background:#24352f}
body.dark .search,body.dark .pill,body.dark .icon{background:#1e2c27;border-color:#2f423b;color:#e8ede9}
body.dark .search input{background:transparent;color:#e8ede9}
body.dark .range button,body.dark .chip{background:#24352f;border-color:#2f423b;color:#e8ede9}
body.dark .range button.on,body.dark .chip.on{background:#e8ede9;color:#131d1a}
body.dark .catlist div{border-color:#2f423b}
body.dark td{border-color:#2f423b}
body.dark .bcard,body.dark .drawer{background:#1e2c27}
body.dark .benchcol,body.dark .kday,body.dark .mini{background:#24352f}
body.dark .catclick div.sel{background:#24352f}
body.dark .orow:hover{background:#24352f}
body.dark .field input,body.dark .field textarea,body.dark .field select{background:#24352f;border-color:#2f423b;color:#e8ede9}
body.dark .kday span{color:#cfd8d2}
body.dark .kday small{color:#8a9a92}
body.dark .sub{color:#9aa89f}
body.dark .goal small,body.dark .brand small,body.dark .user small{color:#8a9a92}
body.dark .btn-lite{background:#2f423b;color:#e8ede9}
body.dark footer{color:#7a8a83}
body.dark h1{color:#fff}
@media(max-width:1000px){.demandgrid{grid-template-columns:1fr}.bench{grid-template-columns:1fr}.kilncal{grid-template-columns:repeat(7,1fr)}}

/* refinement additions */
th.sort{cursor:pointer;text-decoration:underline dotted}
.starbtn{background:none;border:0;font-size:18px;cursor:pointer;color:#C96A4A;padding:2px 6px}
.newmenu{position:fixed;top:64px;right:26px;background:#fdfbf5;border:1px solid #e2ddcc;border-radius:14px;padding:8px;z-index:50;box-shadow:0 8px 24px #0003;min-width:220px}
.newmenu button{display:block;width:100%;text-align:left;background:none;border:0;padding:10px 12px;border-radius:8px;font:14px Arial}
.newmenu button:hover{background:#f3e2d8}
body.dark .newmenu{background:#1e2c27;border-color:#2f423b}
body.dark .newmenu button:hover{background:#24352f}
.acc summary{cursor:pointer;font:700 14px Arial;padding:10px 0}
.acc{border-bottom:1px solid #eee;padding:2px 0}
.acc p{font:13px Arial;color:#555;line-height:1.6;margin:0 0 10px}
.costbar{height:10px;background:#eee;border-radius:9px;overflow:hidden;margin:6px 0 12px}
.costbar i{display:block;height:100%;background:#C96A4A}
.feedrow{display:flex;gap:10px;padding:10px 0;border-bottom:1px solid #eee;font:13px Arial}
.feedrow small{color:#777;display:block}
.statusstrip{border-radius:12px;padding:10px 14px;font:13px Arial;margin:8px 0}

body.dark .pill2{background:#24352f;color:#e8ede9}
body.dark .pill2.warn{background:#3a2f22;color:#f3d9a8}
body.dark .pill2.ship{background:#243a4a;color:#cfe3f5}

/* ---- fixpass additions: panels, compare bars, clickable affordances ---- */
.searchwrap{position:relative;flex:1;max-width:520px}
.searchwrap .search{max-width:none}
.searchpanel{position:absolute;top:48px;left:0;right:0;background:#fdfbf5;border:1px solid #e2ddcc;border-radius:14px;padding:14px;z-index:55;box-shadow:0 8px 24px #0003;max-height:60vh;overflow:auto}
.searchpanel .srow{padding:7px 8px;border-radius:8px;font:13px Arial;cursor:pointer}
.searchpanel .srow:hover{background:#f3e2d8}
.notifpanel{position:absolute;top:64px;right:120px;background:#fdfbf5;border:1px solid #e2ddcc;border-radius:14px;padding:14px;z-index:55;box-shadow:0 8px 24px #0003;width:340px;max-width:92vw}
.acctmenu{position:absolute;top:64px;right:26px;background:#fdfbf5;border:1px solid #e2ddcc;border-radius:14px;padding:12px;z-index:55;box-shadow:0 8px 24px #0003;min-width:240px}
.acctmenu button{display:block;width:100%;text-align:left;background:none;border:0;padding:10px 12px;border-radius:8px;font:14px Arial}
.acctmenu button:hover{background:#f3e2d8}
.top{position:relative}
.belldot{position:absolute;top:2px;right:2px;width:10px;height:10px;border-radius:50%;background:#C96A4A;display:block}
.topr .icon{position:relative}
.clickable{cursor:pointer}
.mstacks{display:flex;gap:3px;align-items:end;height:100%;width:100%;justify-content:center}
.mstacks .mstack{flex:1 1 0;width:auto;max-width:44px}
.mstack.ghost{background:transparent;border:1.5px dashed #b9a98a;opacity:.55}
.mbar.sel .mstacks .mstack:not(.ghost){outline:2px solid #C96A4A;outline-offset:2px}
.kday.sel{outline:2px solid #C96A4A;outline-offset:1px}
.prod.hl{outline:2px solid #C96A4A;outline-offset:2px}
tr.hl td{background:#fbf0e2}
body.dark .searchpanel,body.dark .notifpanel,body.dark .acctmenu{background:#1e2c27;border-color:#2f423b}
body.dark .searchpanel .srow:hover,body.dark .acctmenu button:hover{background:#24352f}
body.dark .mstack.ghost{border-color:#5f7268}