/* Reviews and comments on app pages, and the optional maker review on /review. Glass Home look: tokens from ipip.css,
   so light and dark both follow the page. */
.cx{margin-top:20px;padding:22px;border-radius:30px}
.cx-head{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.cx-head h2{font:700 22px/1.2 var(--font-display);margin:0;letter-spacing:-.01em}
.cx-sum{max-width:560px;display:grid;grid-template-columns:auto minmax(0,1fr);gap:18px;align-items:center;padding:14px 16px;margin-bottom:14px;border-radius:20px;background:var(--chip)}
.cx-avg{display:grid;justify-items:center;gap:3px}
.cx-avg b{font:800 34px/1 var(--font-display)}
.cx-avg small{color:var(--ink2);font-size:12.5px}
.cx-bars{display:grid;gap:4px;font-size:12px;color:var(--ink2)}
.cx-bars div{display:grid;grid-template-columns:12px minmax(0,1fr) 22px;gap:8px;align-items:center}
.cx-bars i{height:6px;border-radius:9px;background:var(--hair);overflow:hidden}
.cx-bars i b{display:block;height:100%;background:var(--y);border-radius:9px}
.cx-stars{display:inline-flex;gap:1px;vertical-align:-2px}
.cx-stars i,.cx-stars-in button{display:inline-flex;color:var(--ink3)}
.cx-stars svg{width:13px;height:13px;fill:currentColor}
.cx-stars i.on{color:var(--y)}
.cx-stars-in{display:flex;align-items:center;gap:2px;flex-wrap:wrap;margin:6px 0 10px}
.cx-stars-in button{background:none;border:0;padding:6px;border-radius:12px;cursor:pointer;min-width:44px;min-height:44px;justify-content:center;align-items:center;transition:transform .25s var(--spring)}
.cx-stars-in button svg{width:24px;height:24px;fill:currentColor}
.cx-stars-in button.on{color:var(--y)}
.cx-stars-in button:hover{transform:scale(1.12)}
.cx-stars-in button:focus-visible{outline:2px solid var(--b);outline-offset:1px}
.cx-stars-in small{color:var(--ink2);font-size:12.5px;margin-left:6px}
.cx-box{display:grid;gap:10px;margin-bottom:8px}
.cx-box>.btn{justify-self:start}
.cx-empty{color:var(--ink2)}
.cx-empty h3{margin:0 0 2px;color:var(--ink);font-size:16px}
.cx-empty p{margin:0}
.cx-form{display:grid;gap:4px}
.cx-lab{display:grid;gap:6px;font-size:13px;font-weight:650;color:var(--ink2)}
.cx-form textarea,.cx-form input,.sw textarea{width:100%;box-sizing:border-box;font:inherit;font-size:16px;color:var(--ink);background:var(--chip);border:1px solid var(--hair);border-radius:16px;padding:12px 14px;resize:vertical}
.cx-form textarea:focus,.cx-form input:focus,.sw textarea:focus{outline:2px solid var(--b);outline-offset:1px}
.cx-foot,.sw-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:6px}
.cx-foot>span:last-child,.sw-foot>span:last-child{display:flex;gap:10px;align-items:center;margin-left:auto}
.cx-err{color:var(--r);font-size:13.5px;line-height:1.4;margin:0}
.cx-err b{color:var(--ink)}
.cx-note{color:var(--g);font-weight:650;font-size:13.5px;margin:0}
.linkbtn{background:none;border:0;padding:8px 4px;font:inherit;font-size:14px;font-weight:600;color:var(--ink2);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.cx-list{display:grid;gap:4px}
.cx-c{display:grid;grid-template-columns:34px minmax(0,1fr);gap:12px;padding:14px 0;border-top:1px solid var(--hair)}
.cx-replies .cx-c{border-top:0;padding:10px 0 0}
.cx-replies{margin-top:4px;padding-left:12px;border-left:2px solid var(--hair)}
.cx-av{position:relative;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;overflow:hidden;font-weight:800;font-size:14px;color:#fff;background:var(--b)}
.cx-av[data-c="1"]{background:var(--g)}.cx-av[data-c="2"]{background:var(--o)}.cx-av[data-c="3"]{background:var(--r)}.cx-av[data-c="4"]{background:var(--v)}.cx-av[data-c="5"]{background:#1f9d9a}
.cx-av img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cx-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;font-size:13px;color:var(--ink2)}
.cx-meta strong{color:var(--ink);font-size:14px}
.cx-tag{font-size:11px;font-weight:700;padding:3px 8px;border-radius:99px;background:var(--chip);color:var(--ink)}
.cx-swap{background:color-mix(in srgb,var(--v) 16%,transparent)}
.cx-mk>.cx-main>.cx-meta .cx-tag:first-of-type{background:color-mix(in srgb,var(--b) 18%,transparent)}
.cx-txt{margin:6px 0 0;font-size:15px;line-height:1.5;white-space:pre-line;overflow-wrap:anywhere}
.cx-h{font-size:12.5px;color:var(--ink2)}
.cx-acts{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px;align-items:center}
.cx-acts button{background:none;border:0;font:inherit;font-size:13px;font-weight:600;color:var(--ink2);padding:8px 10px;min-height:36px;border-radius:99px;cursor:pointer}
.cx-acts button:hover:not(:disabled){background:var(--chip);color:var(--ink)}
.cx-acts button[aria-pressed="true"]{background:color-mix(in srgb,var(--g) 18%,transparent);color:var(--ink)}
.cx-acts button:disabled{opacity:.5;cursor:default}
.cx-acts button b{margin-left:3px}
[data-reply-at]:not(:empty){margin-top:8px}

/* /review */
.sw .sw-app{padding:20px;border-radius:28px;display:grid;gap:6px}
.sw-card{display:grid;grid-template-columns:56px minmax(0,1fr) auto;gap:14px;align-items:center;margin-bottom:8px}
.sw-card img{border-radius:14px}
.sw-card b{display:block;font-size:17px}
.sw-card span{display:block;color:var(--ink2);font-size:14px}
.sw-card small{display:inline-block;margin-top:4px;font-size:12px;color:var(--ink2)}
.sw-foot [data-sw-count]{font-size:13px;color:var(--ink2)}
.sw-note{font-size:13px;color:var(--ink2);margin:8px 0 0}
.sw-done h2{margin-top:0}
@media (max-width:520px){
  .cx{padding:16px;border-radius:24px}
  .cx-sum{grid-template-columns:minmax(0,1fr)}
  .sw-card{grid-template-columns:48px minmax(0,1fr)}
  .sw-card .btn{grid-column:1/-1}
}
.cx .btn:disabled,.sw .btn:disabled{opacity:.4;cursor:default;transform:none}
/* Phones and touch screens: 44px tap targets (QA sweep 2). */
@media (pointer:coarse),(max-width:560px){.linkbtn{min-height:44px}.cx-acts button{min-height:44px}}
