/* 📊 Compare areas page (#/areas), compare.js. Design B (orange), phone first. */
.on-areas .hdr-areas{background:var(--acc-soft,#fff1e8);color:var(--acc-d,#9a3412)}
@media (max-width:819px){.hdr-areas{padding:0 9px!important;gap:4px;font-size:14px}}
@media (max-width:480px){.hdr-areas span:not(.hdr-fire){display:none}}
.areas-tile{display:flex;align-items:center;gap:12px;margin:10px 0 4px;padding:14px 16px;border-radius:16px;background:#fff;border:1px solid var(--acc-line,#fed7bb);color:var(--ink,#1c1917);text-decoration:none}
.areas-tile .dt-fire{font-size:28px;line-height:1}
.areas-tile .dt-t{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0}
.areas-tile b{font-size:17px}
.areas-tile .dt-t span{font-size:13.5px;color:var(--ink2,#57534e)}
.areas-tile svg{width:20px;height:20px;color:var(--acc,#e8590c);flex:0 0 auto}
#areas{padding-bottom:40px}
.ac-intro{margin:4px 0 14px;color:var(--ink2,#57534e);font-size:15px;line-height:1.45}
.ac-intro small{display:block;color:var(--mut,#78716c);font-size:13px;margin-top:2px}
.ac-sec{margin:22px 0 8px}
.ac-sec h2{font-size:20px;margin:0 0 4px}
.ac-sec>p.ac-how{margin:0 0 10px;font-size:13.5px;color:var(--mut,#78716c);line-height:1.4}
.ac-win{display:flex;gap:12px;align-items:center;padding:14px 16px;border-radius:16px;background:linear-gradient(135deg,#fff4ec,#ffe4d1);border:1px solid #fed7aa;margin:0 0 10px}
.ac-win-i{font-size:30px;line-height:1}
.ac-win>span:last-child{display:flex;flex-direction:column;gap:1px;min-width:0}
.ac-win small{font-size:12.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--acc-d,#c2410c)}
.ac-win b{font-size:22px;line-height:1.15}
.ac-win span span{font-size:14px;color:var(--ink2,#57534e)}
.ac-list{list-style:none;margin:0;padding:0;border:1px solid var(--line,#e7e5e4);border-radius:14px;overflow:hidden;background:#fff}
.ac-row{border-top:1px solid var(--line,#e7e5e4)}
.ac-row:first-child{border-top:0}
.ac-row.me{background:#fffaf5}
.ac-rb{display:flex;align-items:center;gap:10px;width:100%;padding:11px 12px;background:none;border:0;text-align:left;font:inherit;color:inherit;min-height:56px}
button.ac-rb{cursor:pointer}
.ac-rank{flex:0 0 26px;height:26px;border-radius:50%;background:var(--bg,#f5f5f4);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;color:var(--ink2,#57534e)}
.ac-rank.r1{background:var(--acc,#e8590c);color:#fff}
.ac-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.ac-name{font-weight:700;font-size:15.5px;overflow-wrap:anywhere}
.ac-me{font-style:normal;font-size:11.5px;font-weight:700;color:var(--acc-d,#c2410c);background:var(--acc-soft,#fff3ea);border-radius:6px;padding:1px 6px;margin-left:4px;white-space:nowrap}
.ac-sub{font-size:12.5px;color:var(--mut,#78716c)}
.ac-lvl{flex:0 0 auto;max-width:42%;text-align:right;font-size:13.5px;line-height:1.25}
.ac-lvl.cheap{color:#15803d}.ac-lvl.dear{color:#b91c1c}.ac-lvl.avg{color:var(--ink2,#57534e)}
.ac-bar{display:block;height:6px;border-radius:3px;background:var(--bg,#f5f5f4);overflow:hidden;max-width:220px}
.ac-bar i{display:block;height:100%;border-radius:3px}
.ac-bar.cheap i{background:#22c55e}.ac-bar.dear i{background:#f87171}.ac-bar.avg i{background:#d6d3d1}
.ac-more{padding:0 12px 12px 48px;font-size:14px}
.ac-more p{margin:2px 0 6px}
.ac-h4{font-weight:700;font-size:14px;margin:12px 0 6px!important}
.ac-mini{list-style:none;margin:0;padding:0}
.ac-mini li{display:flex;justify-content:space-between;gap:10px;padding:6px 0;border-top:1px dashed var(--line,#e7e5e4);font-size:14px}
.ac-mini li:first-child{border-top:0}
.ac-mini li small{color:var(--mut,#78716c);font-size:12px}
.ac-mini li b{white-space:nowrap}
.ac-mini li.best b{color:#15803d}
.ac-mini li.other{opacity:.75}
.ac-go{margin-top:10px;display:inline-flex}
.ac-note{font-size:13px;color:var(--mut,#78716c);line-height:1.45;margin:10px 2px}
.ac-pick{display:flex;align-items:center;gap:8px;margin:0 0 10px;font-size:14px}
.ac-pick select{flex:1;min-height:44px;border-radius:10px;border:1px solid var(--line,#e7e5e4);padding:0 10px;font:inherit;background:#fff}
.ac-cats{display:flex;gap:8px;overflow-x:auto;padding:2px 0 10px;scrollbar-width:none}
.ac-cats::-webkit-scrollbar{display:none}
.ac-cats button{flex:0 0 auto;min-height:38px;padding:0 14px;border-radius:999px;border:1px solid var(--line,#e7e5e4);background:#fff;font:inherit;font-size:14px;font-weight:600;color:var(--ink2,#57534e)}
.ac-cats button[aria-pressed="true"]{background:var(--acc,#e8590c);border-color:var(--acc,#e8590c);color:#fff}
.ac-cad{margin:12px 0 0;font-size:14px}
.ac-cad summary{cursor:pointer;font-weight:700;padding:8px 0;color:var(--acc-d,#c2410c)}
.ac-look input{width:100%;min-height:46px;border-radius:12px;border:1px solid var(--line,#e7e5e4);padding:0 14px;font:inherit;font-size:16px;margin:0 0 10px}
.ac-item{border:1px solid var(--line,#e7e5e4);border-radius:14px;padding:10px 12px;margin:0 0 10px;background:#fff}
.ac-item>b{display:block;font-size:15px;margin:0 0 4px}
.ac-item>b small{color:var(--mut,#78716c);font-weight:500}
.ac-disc{font-size:12.5px;color:var(--mut,#78716c);line-height:1.45;margin:24px 2px 0}
/* v2 (owner, Nov 1, 2026: "search bar on each", "compare more") */
.ac-find{display:block;width:100%;box-sizing:border-box;min-height:46px;border-radius:12px;border:1px solid var(--line,#e7e5e4);padding:0 14px;font:inherit;font-size:16px;margin:0 0 10px;background:#fff;color:var(--ink,#1c1917)}
.ac-find:focus{outline:2px solid var(--acc,#e8590c);outline-offset:0;border-color:var(--acc,#e8590c)}
.ac-count{font-size:12.5px;color:var(--mut,#78716c);margin:0 2px 6px}
.ac-few{font-style:normal;font-size:11px;font-weight:700;color:#92400e;background:#fef3c7;border-radius:6px;padding:1px 6px;margin-left:4px;white-space:nowrap;vertical-align:1px}
.ac-morebtn{margin-top:10px}
.ac-morebtn small{font-weight:500;color:var(--mut,#78716c)}
.ac-rank{flex:0 0 auto;min-width:26px;padding:0 5px;box-sizing:border-box;border-radius:13px}
.ac-more{padding-left:44px;padding-right:12px}
.ac-vs-box{margin:0 0 8px;padding:8px 12px;border-radius:10px;background:#fff7ed;border:1px solid #fed7aa;font-size:13.5px;color:var(--acc-d,#9a3412)}
.ac-vs{font-weight:500;color:var(--mut,#78716c);font-size:12px}
/* side by side (owner, Nov 1, 2026, 1:34 AM: "option to add a few brands or stores and see how they compare") */
.ac-line{display:flex;align-items:stretch}
.ac-line>.ac-rb{flex:1;min-width:0}
.ac-pk{flex:0 0 44px;min-height:44px;margin:6px 8px 6px 0;align-self:center;border-radius:12px;border:1.5px solid var(--acc-line,#fed7bb);background:#fff;color:var(--acc,#e8590c);font:inherit;font-size:20px;font-weight:700;line-height:1;cursor:pointer}
.ac-pk.on{background:var(--acc,#e8590c);border-color:var(--acc,#e8590c);color:#fff}
.ac-mini li.ac-pkli{align-items:center}
.ac-mini li.ac-pkli .ac-pk{flex-basis:38px;min-height:38px;margin:0;font-size:17px}
.ac-mini li.ac-pkli>span{flex:1}
#areas.ac-tray-on{padding-bottom:120px}
.ac-tray{position:fixed;left:8px;right:8px;bottom:calc(8px + env(safe-area-inset-bottom));z-index:40;max-width:640px;margin:0 auto;background:#1c1917;color:#fff;border-radius:16px;padding:8px 10px;box-shadow:0 8px 28px rgba(0,0,0,.28);display:flex;flex-direction:column;gap:6px}
.ac-tray[hidden]{display:none}
.ac-tray-l{display:flex;align-items:center;gap:8px}
.ac-tray-t{flex:1;min-width:0;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#e7e5e4}
.ac-tray-t b{color:#fff;font-size:14px}
.ac-tray-go{flex:0 0 auto;min-height:40px;padding:0 14px;border-radius:10px;border:0;background:var(--acc,#e8590c);color:#fff;font:inherit;font-weight:700;font-size:14.5px}
.ac-tray-go[disabled]{background:#57534e;color:#d6d3d1}
.ac-tray-x{flex:0 0 36px;min-height:36px;border:0;border-radius:10px;background:transparent;color:#d6d3d1;font-size:16px}
.ac-shake{animation:acsh .35s}
@keyframes acsh{25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}
.ac-vs-sheet{position:fixed;inset:0;z-index:60;background:var(--bg,#fafaf9);overflow-y:auto;-webkit-overflow-scrolling:touch}
.ac-vs-sheet[hidden]{display:none}
.ac-vs-in{max-width:640px;margin:0 auto;padding:0 14px 40px}
.ac-vs-top{position:sticky;top:0;z-index:2;display:flex;gap:10px;align-items:flex-start;padding:12px 0 10px;background:var(--bg,#fafaf9)}
.ac-vs-top h2{font-size:20px;margin:6px 0 2px}
.ac-vs-top p{margin:0;font-size:13.5px;color:var(--ink2,#57534e);line-height:1.4}
.ac-vs-close{flex:0 0 44px;height:44px;border-radius:12px;border:1px solid var(--line,#e7e5e4);background:#fff;font-size:18px}
.ac-vs-rank{margin:6px 0 12px}
.ac-fewsep{list-style:none;margin:14px 0 4px;padding:6px 2px 4px;border-top:1px dashed #e5e7eb;font-size:12px;font-weight:700;color:#92400e}
.ac-ars{margin:6px 0 0;font-size:13px}
.ac-ars summary{cursor:pointer;color:var(--mut,#78716c);font-weight:600;padding:4px 0}
.ac-ar{margin:8px 0 2px;font-weight:700;font-size:13px}
