:root{--bg:#f6f4f0;--card:#fff;--ink:#1f2328;--muted:#6b6f76;--line:#e6e1d8;--accent:#b4541a;--accent-2:#f3e3d6;
--up:#c0392b;--down:#1e8449;--promo:#7d3c98;--own:#b4541a;--radius:10px;font-size:14px}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.45}
a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}
header{background:#22201c;color:#fff;display:flex;align-items:center;gap:1.2rem;padding:.6rem 1.2rem;position:sticky;top:0;z-index:5;flex-wrap:wrap}
header .brand{font-weight:700;letter-spacing:.02em}header .brand span{color:#f0a36b}
header nav{display:flex;gap:.2rem;flex-wrap:wrap}header nav a{color:#ddd;padding:.35rem .6rem;border-radius:6px}
header nav a.on,header nav a:hover{background:#3a362f;color:#fff;text-decoration:none}
header .me{margin-left:auto;color:#aaa;font-size:.9em}header .me a{color:#ccc}
.badge{display:inline-block;background:var(--accent);color:#fff;border-radius:9px;padding:0 .45em;font-size:.8em;margin-left:.2em}
main{padding:1.2rem;max-width:1500px;margin:0 auto}
h1{font-size:1.45rem;margin:.2rem 0 1rem}h2{font-size:1.1rem;margin:1.4rem 0 .6rem}h3{font-size:1rem;margin:.8rem 0 .4rem}
.grid{display:grid;gap:1rem}.g2{grid-template-columns:repeat(auto-fit,minmax(420px,1fr))}.g4{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:1rem;overflow:auto}
.kpi .v{font-size:1.7rem;font-weight:700}.kpi .l{color:var(--muted);font-size:.85em}
table{border-collapse:collapse;width:100%}th,td{padding:.38rem .5rem;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
th{font-size:.8em;text-transform:uppercase;letter-spacing:.03em;color:var(--muted);background:#faf8f5;position:sticky;top:0}
td.n,th.n{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
tr.own td{background:var(--accent-2)}tr:hover td{background:#fbf6f0}
.muted{color:var(--muted)}.small{font-size:.85em}.nowrap{white-space:nowrap}
.tag{display:inline-block;border:1px solid var(--line);border-radius:5px;padding:0 .35em;font-size:.78em;color:var(--muted);margin:.05rem .1rem .05rem 0;background:#fff}
.tag.promo{border-color:var(--promo);color:var(--promo)}.tag.key{border-color:var(--accent);color:var(--accent)}.tag.own{background:var(--own);color:#fff;border-color:var(--own)}
.up{color:var(--up)}.down{color:var(--down)}
.idx{font-weight:600}.idx.hi{color:var(--up)}.idx.lo{color:var(--down)}
form.filters{display:flex;gap:.5rem;flex-wrap:wrap;align-items:end;margin-bottom:1rem}
label{display:flex;flex-direction:column;font-size:.8em;color:var(--muted);gap:.2rem}
input,select,textarea{font:inherit;padding:.38rem .5rem;border:1px solid #cfc8bc;border-radius:7px;background:#fff;color:var(--ink)}
input[type=checkbox]{width:auto}
button,.btn{font:inherit;background:var(--accent);color:#fff;border:0;border-radius:7px;padding:.42rem .9rem;cursor:pointer;display:inline-block}
button.ghost,.btn.ghost{background:#fff;color:var(--ink);border:1px solid #cfc8bc}
button.danger{background:#8e2b22}
.row{display:flex;gap:.6rem;align-items:center;flex-wrap:wrap}
.heat td.cell{text-align:right;font-variant-numeric:tabular-nums}
.chart{position:relative;height:340px}
.thumb{width:44px;height:44px;object-fit:contain;border-radius:6px;background:#fff;border:1px solid var(--line)}
.photo-big{max-width:100%;max-height:78vh;border-radius:8px;border:1px solid var(--line)}
.notice{background:#fff8e6;border:1px solid #f0d58c;padding:.6rem .8rem;border-radius:8px;margin-bottom:1rem}
.ok{background:#e9f7ef;border-color:#a9dfbf}
.login{max-width:380px;margin:12vh auto}.login .card{padding:1.6rem}
@media (max-width:700px){main{padding:.7rem}.g2{grid-template-columns:1fr}th,td{padding:.3rem}}

/* nav menu */
details.menu{position:relative}details.menu summary{list-style:none;cursor:pointer;color:#ddd;padding:.35rem .6rem;border-radius:6px}
details.menu summary::-webkit-details-marker{display:none}details.menu summary::after{content:" ▾";font-size:.8em}
details.menu[open] summary,details.menu summary:hover,details.menu summary.on{background:#3a362f;color:#fff}
details.menu>div{position:absolute;top:110%;left:0;background:#2b2823;border-radius:8px;padding:.3rem;min-width:210px;box-shadow:0 8px 24px rgba(0,0,0,.3);z-index:20}
details.menu>div a{display:block;color:#ddd;padding:.45rem .7rem;border-radius:6px}details.menu>div a:hover{background:#3a362f;color:#fff;text-decoration:none}
/* board */
.bar{display:flex;gap:.6rem;flex-wrap:wrap;align-items:end;margin-bottom:.8rem}
.bar .scope{color:var(--muted);font-size:.85em;margin-left:auto;align-self:center}
.tabs{display:flex;gap:.25rem;border-bottom:2px solid var(--line);margin-bottom:1rem;overflow-x:auto}
.tabs button{background:none;color:var(--muted);border:0;border-bottom:3px solid transparent;border-radius:0;padding:.6rem .9rem;margin-bottom:-2px;font-weight:600;white-space:nowrap}
.tabs button.on{color:var(--ink);border-bottom-color:var(--accent)}.tabs button:hover{color:var(--ink)}
.pane{display:none}.pane.on{display:block}
.lead{color:var(--muted);font-size:.9em;margin:-.3rem 0 .8rem;max-width:900px}
.chart.tall{height:auto;min-height:260px}
table.click tr[data-k]{cursor:pointer}table.click tr.sel td{background:var(--accent-2);box-shadow:inset 0 -1px 0 var(--accent)}
.drill{margin-top:1rem}.drill h3{display:flex;gap:.6rem;align-items:baseline;flex-wrap:wrap}
tr.rej td{opacity:.5}.ok-mark{color:var(--down);font-weight:700}.no-mark{color:var(--up);font-weight:700}
.pill{display:inline-block;border-radius:9px;padding:0 .5em;font-size:.78em;background:#eee;color:#444}.pill.l1{background:#e3f1e8;color:#1e8449}.pill.l2{background:#fdf2dc;color:#9a6b00}.pill.l3{background:#eee;color:#666}
.empty{color:var(--muted);padding:1rem 0}
.spin{color:var(--muted);padding:2rem;text-align:center}
.btns{display:flex;gap:.4rem;flex-wrap:wrap}
button.ok{background:#1e8449}button.no{background:#8e2b22}button.small,.btn.small{padding:.25rem .6rem;font-size:.85em}
/* modal */
.modal{position:fixed;inset:0;background:rgba(20,18,15,.55);z-index:50;display:flex;align-items:flex-start;justify-content:center;padding:4vh 1rem;overflow:auto}
.modal[hidden]{display:none}
.modal .box{background:var(--card);border-radius:12px;max-width:1000px;width:100%;padding:1.2rem 1.3rem;position:relative;box-shadow:0 20px 60px rgba(0,0,0,.35)}
.modal .x{position:absolute;right:.6rem;top:.5rem;background:none;color:var(--muted);font-size:1.6rem;padding:.1rem .5rem}
.modal h2{margin:0 2rem .3rem 0;font-size:1.2rem}
.modal .head{display:flex;gap:1rem;align-items:flex-start}.modal .head img{width:90px;height:90px;object-fit:contain;border:1px solid var(--line);border-radius:8px;background:#fff}
.modal .facts{display:flex;gap:1.4rem;flex-wrap:wrap;margin:.8rem 0}.modal .facts div{font-size:.8em;color:var(--muted)}.modal .facts b{display:block;font-size:1.25rem;color:var(--ink)}
.verdict{display:flex;gap:.6rem;align-items:center;flex-wrap:wrap;background:#faf8f5;border:1px solid var(--line);border-radius:8px;padding:.6rem .8rem;margin:.6rem 0}
@media (max-width:700px){.modal{padding:0}.modal .box{border-radius:0;min-height:100vh}.bar .scope{margin-left:0}}

/* merchandising */
.kpis{margin-bottom:1rem}.kpis .card{padding:.7rem .9rem}.kpis .v{font-size:1.5rem;font-weight:700}.kpis .l{color:var(--muted);font-size:.8em}
.score{display:inline-block;min-width:2.4em;text-align:center;border-radius:7px;padding:.05em .35em;font-weight:700;color:#fff;background:#999}
.score.g{background:#1e8449}.score.a{background:#c58b00}.score.r{background:#b03a2e}.score.big{font-size:1.5rem;padding:.15em .5em}
.photos{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:.7rem}
.photos .ph{border:1px solid var(--line);border-radius:9px;overflow:hidden;background:#fff;cursor:pointer;position:relative}
.photos .ph img{width:100%;height:150px;object-fit:cover;display:block;background:#eee}
.photos .ph .m{padding:.4rem .5rem;font-size:.8em;line-height:1.35}.photos .ph .score{position:absolute;top:.4rem;left:.4rem}
.photos .ph.fixed{opacity:.6}.photos .ph .fx{position:absolute;top:.4rem;right:.4rem;background:#1e8449;color:#fff;border-radius:6px;padding:0 .35em;font-size:.75em}
.ph-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:1rem}.ph-grid img.full{width:100%;border-radius:8px;border:1px solid var(--line)}
.iss{margin:.2rem 0;padding:.35rem .5rem;border-left:4px solid #bbb;background:#faf8f5;border-radius:4px;font-size:.9em}
.iss.high{border-color:#b03a2e}.iss.medium{border-color:#c58b00}.iss.low{border-color:#7f8c8d}
.advice ol{margin:.4rem 0 0;padding-left:1.2rem}.advice li{margin:.35rem 0}.advice .why{color:var(--muted);font-size:.85em}
.howto{background:#fff;border:1px dashed #cfc8bc;border-radius:10px;padding:1rem 1.2rem}.howto ol{margin:.4rem 0 0;padding-left:1.2rem}
@media (max-width:800px){.ph-grid{grid-template-columns:1fr}}

/* like-for-like picker */
.pgroup{display:flex;flex-wrap:wrap;gap:.35rem;align-items:center;margin:.25rem 0 .55rem}
.pgroup .pg{font-size:.75em;text-transform:uppercase;letter-spacing:.03em;color:var(--muted);min-width:9.5em;margin-right:.2rem}
.pbtn{font:inherit;font-size:.86em;background:#fff;color:var(--ink);border:1px solid #d9d2c6;border-radius:999px;padding:.28rem .7rem;cursor:pointer;display:inline-flex;gap:.4rem;align-items:center}
.pbtn:hover{border-color:var(--accent)}.pbtn.on{background:var(--accent);border-color:var(--accent);color:#fff}
.pbtn.none{color:var(--muted);border-style:dashed}.pbtn .w{color:var(--muted);font-size:.9em}.pbtn.on .w{color:#ffe3cf}
.pbtn .d{font-size:.82em;font-weight:700;border-radius:999px;padding:0 .4em;background:#eee;color:#555}
.pbtn .d.cheap{background:#dcebf7;color:#1f5f8b}.pbtn .d.dear{background:#f7d9d5;color:#a1342a}.pbtn.on .d{background:rgba(255,255,255,.25);color:#fff}
.pview h3{margin:0}.pview .sum{margin:.5rem 0 .8rem;font-size:1.02em}.pview .seg{display:inline-flex;border:1px solid #cfc8bc;border-radius:8px;overflow:hidden}
.pview .seg button{background:#fff;color:var(--ink);border:0;border-radius:0;padding:.3rem .7rem;font-size:.85em}.pview .seg button.on{background:var(--ink);color:#fff}
.diff.cheap{color:#1f5f8b;font-weight:600}.diff.dear{color:#a1342a;font-weight:600}

/* side-by-side comparison */
.modal .box.wide{max-width:1180px}
.vs-pick{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}.vs-pick select{max-width:420px}
table.vs{table-layout:fixed}table.vs th,table.vs td{vertical-align:middle}table.vs tbody th{text-transform:none;letter-spacing:0;font-size:.85em;background:#faf8f5;position:static}
table.vs thead th{background:#fff;text-transform:none;letter-spacing:0;font-size:1em;color:var(--ink);vertical-align:bottom;position:static}
table.vs td.dcol,table.vs th.dcol{font-size:.88em}
.vs-head{display:flex;gap:.7rem;align-items:center}.vs-head img,.vs-head .noimg{width:96px;height:96px;object-fit:contain;border:1px solid var(--line);border-radius:8px;background:#fff;flex:none}
.vs-head b{font-weight:600;line-height:1.3}
@media (max-width:800px){table.vs{table-layout:auto}.vs-head{flex-direction:column;align-items:flex-start}.vs-head img,.vs-head .noimg{width:64px;height:64px}}

/* ROMA product picker: foldable categories */
.pcat{border-top:1px solid var(--line)}.pcat:first-child{border-top:0}
.pcat-h{width:100%;background:none;color:var(--ink);text-align:left;display:flex;gap:.6rem;align-items:baseline;flex-wrap:wrap;padding:.6rem .2rem;border-radius:0;font-weight:600}
.pcat-h:hover{background:#faf8f5}.pcat-h .caret{display:inline-block;width:1em;color:var(--muted);transition:transform .15s}
.pcat.open .caret{transform:rotate(90deg)}.pcat-h .picked{margin-left:auto;font-weight:500;font-size:.85em;color:var(--accent)}
.pcat-b{display:none;padding:0 .2rem .9rem 1.6rem}.pcat.open .pcat-b{display:block}
.ptype{font-size:.72em;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin:.55rem 0 .3rem}
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:.4rem}
.pchip{font:inherit;font-size:.86em;text-align:left;background:#fff;color:var(--ink);border:1px solid #e1dacd;border-radius:8px;padding:.42rem .55rem;display:flex;gap:.45rem;align-items:center;cursor:pointer;min-width:0}
.pchip:hover{border-color:var(--accent)}.pchip .nm{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pchip .w{color:var(--muted);font-size:.85em;white-space:nowrap}
.pchip .d{font-size:.8em;font-weight:700;border-radius:999px;padding:0 .45em;background:#eee;color:#666;white-space:nowrap}
.pchip .d.cheap{background:#dcebf7;color:#1f5f8b}.pchip .d.dear{background:#f7d9d5;color:#a1342a}
.pchip.on{border-color:var(--accent);background:var(--accent-2);box-shadow:inset 3px 0 0 var(--accent)}
.pchip.none{color:var(--muted);background:#fbfaf8;border-style:dashed}

.seg{display:inline-flex;border:1px solid #cfc8bc;border-radius:8px;overflow:hidden}
.seg button{background:#fff;color:var(--ink);border:0;border-radius:0;padding:.3rem .7rem;font-size:.85em}.seg button.on{background:var(--ink);color:#fff}
table.promo td{vertical-align:middle}table.promo tr.ended td{color:var(--muted)}table.promo .old{text-decoration:line-through;color:var(--muted)}
table.promo .roma{font-size:.88em;line-height:1.3}
table.promo{table-layout:fixed}table.promo tr.tsub td{background:#faf8f5;font-size:.72em;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);padding-top:.5rem}
table.promo td{overflow-wrap:anywhere}
#pr-cats .pcat-b{padding-left:0;padding-right:0}