.py .bx-heart{z-index:2;width:44px;height:44px;color:var(--accent-strong);cursor:pointer;background:#fffffff0;border:1px solid #14211f1f;border-radius:50%;place-items:center;font-size:22px;line-height:1;display:grid;position:absolute;top:8px;right:8px;box-shadow:0 2px 8px #00000026}.py .bx-heart:hover{transform:scale(1.06)}.py .bx-heart.on{background:var(--accent-strong);color:#fff;border-color:var(--accent-strong)}.py .lc .photo .top{right:60px}.py .bx-save.on,.py .bx-cmp.on{border-color:var(--accent-strong);color:var(--accent-ink);background:var(--accent-2)}.py .bx-cmp-go{color:var(--brand);align-self:center;padding:10px 2px;font-size:13px;font-weight:700}.py .bx-err{color:var(--bad);align-self:center;font-size:12px;font-weight:600}.py .bx-actions{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.py .bx-navsaved{gap:4px}.py .bx-count{background:var(--accent-strong);color:#fff;border-radius:999px;place-items:center;min-width:18px;height:18px;padding:0 5px;font-size:12px;display:inline-grid}.py .bx-head{flex-wrap:wrap;align-items:flex-end;gap:12px;margin:6px 0 14px;display:flex}.py .bx-head h1{margin:0;font-size:26px}.py .bx-tabs{flex-wrap:wrap;gap:6px;margin:0 0 16px;display:flex}.py .bx-lay{grid-template-columns:minmax(0,1fr) 340px;align-items:start;gap:20px;display:grid}.py .bx-side{gap:14px;display:grid;position:sticky;top:72px}.py .bx-pick{border-top:1px dashed var(--line);cursor:pointer;align-items:center;gap:8px;min-height:44px;margin:0 14px;padding:8px 0 10px;font-size:13px;font-weight:600;display:flex}.py .bx-pick input{flex:none;width:20px;height:20px}.py .bx-bar{z-index:25;border-top:1px solid var(--line);background:#fffffff7;margin-top:16px;padding:10px 0;position:sticky;bottom:0}.py .bx-bar .in{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.py .bx-note{background:var(--brand-2);border-radius:12px;padding:12px 14px;font-size:13px}.py .bx-note ul,.py .bx-cmpt ul{list-style:outside}.py .bx-ok{color:var(--ok-ink);background:#e3f4ea;border-radius:10px;padding:8px 12px;font-size:13px;font-weight:600}.py .bx-bad{color:var(--bad);background:#fbe7e4;border-radius:10px;padding:8px 12px;font-size:13px;font-weight:600}.py .bx-alerts{gap:8px;margin:0;padding:0;list-style:none;display:grid}.py .bx-alerts li{border:1px solid var(--line);border-radius:12px;gap:6px;padding:10px 12px;font-size:14px;display:grid}.py .bx-alerts li.off{opacity:.6}.py .bx-row{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.py .bx-row .btn{min-height:40px;padding:.4rem .8rem;font-size:13px}.py .bx-notes{gap:6px;margin:0;padding:0;list-style:none;display:grid}.py .bx-notes a{border:1px solid var(--line);background:#fff;border-radius:12px;padding:10px 12px;text-decoration:none;display:block}.py .bx-notes a.unread{border-color:var(--accent-strong)}.py .bx-notes b{font-size:14px;display:block}.py .bx-notes span{color:var(--ink-2);white-space:pre-line;font-size:13px}.py .bx-soon{justify-content:space-between;align-items:center;gap:8px;width:100%;display:flex}.py .bx-linkbtn{color:var(--brand);cursor:pointer;background:0 0;border:0;min-height:32px;padding:6px 2px;font-weight:700;text-decoration:underline}.py .bx-code{text-align:center;letter-spacing:.5em;font-size:22px}.py .bx-cmpwrap{-webkit-overflow-scrolling:touch;border:1px solid var(--line);border-radius:var(--radius);background:#fff;overflow-x:auto}.py table.bx-cmpt{border-collapse:separate;border-spacing:0;table-layout:fixed;width:100%;min-width:560px;font-size:14px}.py .bx-cmpt th,.py .bx-cmpt td{border-bottom:1px solid var(--line);vertical-align:top;text-align:left;overflow-wrap:anywhere;padding:10px 12px}.py .bx-cmpt thead th{vertical-align:bottom;background:#fafaf8}.py .bx-cmpt th[scope=row]{z-index:1;color:var(--ink-2);background:#fafaf8;width:120px;font-size:12px;font-weight:700;position:sticky;left:0}.py .bx-cmpt col.lbl{width:120px}.py .bx-cmpt .best{color:var(--ok-ink);font-weight:800}.py .bx-cmpt .best:after{content:" ✓ " attr(data-best);font-size:12px;font-weight:700}.py .bx-cmpt .best:not([data-best]):after{content:" ✓ ต่ำสุด"}.py .bx-cmpt .price{color:var(--brand);font-size:18px;font-weight:800}.py .bx-thumbs{grid-template-columns:1fr 1fr;gap:6px;display:grid}.py .bx-thumbs figure{aspect-ratio:4/3;border-radius:8px;margin:0;position:relative;overflow:hidden}.py .bx-thumbs figcaption{color:#fff;background:#14211fc7;border-radius:4px;padding:0 5px;font-size:12px;font-weight:700;position:absolute;top:4px;left:4px}.py .bx-thumbs .ex{color:var(--ink-2);background:#ffffffd9;border-radius:4px;padding:0 4px;font-size:12px;position:absolute;bottom:4px;left:4px}.py .bx-cmpt ul{margin:0;padding-left:16px}.py .bx-cmpt .chip{white-space:normal}.py .bx-terms{white-space:pre-line;font-size:13px}.py .bx-remove{color:var(--bad);padding:8px 0;font-size:12px;font-weight:600;display:inline-block}.py .bx-terms-box{background:#fbf1dc;border:1px solid #ecd3a0;border-radius:12px;padding:12px 14px;font-size:14px}.py .bx-terms-box p{white-space:pre-line;margin:6px 0 0}@media (min-width:901px){.py .bx-lay{min-height:660px}}@media (max-width:900px){.py .bx-lay{grid-template-columns:minmax(0,1fr)}.py .bx-side{position:static}}@media (max-width:480px){.py .bx-head h1{font-size:22px}.py table.bx-cmpt{min-width:520px;font-size:13px}.py table.bx-cmpt.n1,.py table.bx-cmpt.n2{min-width:0}.py .bx-cmpt th[scope=row],.py .bx-cmpt col.lbl{width:92px}.py .bx-cmpt th,.py .bx-cmpt td{padding:8px}}.py .bx-thumbs figure.noimg{background:#eceee9;border:1px dashed #c9d0cd}
