/* demo63: reference picker that writes a brief. Background: silver smoke, denser with every pick. */
.ka2-top { padding-top:clamp(24px,4vw,56px); padding-bottom:clamp(30px,4vw,56px); }
.ka2-top .hero__text { max-width:620px; }
#pick { scroll-margin-top:90px; }
.ka2-bar { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px 20px; margin-bottom:14px; }
.ka2-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); grid-auto-rows:clamp(150px,17vw,250px); grid-auto-flow:dense; gap:10px; }
.ka2-w { position:relative; padding:0; border:0; border-radius:var(--radius); overflow:hidden; background:var(--surface-2); cursor:pointer; color:#fff; text-align:left; }
.ka2-w.tall { grid-row:span 2; }
.ka2-w[hidden] { display:none; }
.ka2-w img { width:100%; height:100%; object-fit:cover; transition:transform .5s; }
.ka2-w:hover img { transform:scale(1.04); }
.ka2-w::after { content:""; position:absolute; inset:50% 0 0; background:linear-gradient(transparent,rgb(0 0 0 / .85)); }
.ka2-w__t { position:absolute; z-index:1; left:12px; bottom:10px; font:600 15px var(--font-head); }
.ka2-w__t small { display:block; font:400 12px var(--font); color:#d2d2d2; }
.ka2-w i { position:absolute; z-index:1; top:10px; right:10px; width:34px; height:34px; display:grid; place-items:center; border-radius:50%; background:rgb(0 0 0 / .55); font:600 20px/1 var(--font-head); font-style:normal; transition:background .2s,color .2s,transform .2s; }
.ka2-w[aria-pressed=true] { box-shadow:inset 0 0 0 3px var(--yellow); }
.ka2-w[aria-pressed=true] i { background:var(--yellow); color:#18171a; transform:rotate(45deg); }
.ka2-tray { position:fixed; z-index:50; left:50%; bottom:16px; transform:translateX(-50%); width:min(960px,calc(100% - 24px)); display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:16px; align-items:center; padding:12px 14px; background:rgb(24 23 26 / .88); }
.ka2-tray[hidden] { display:none; }
.ka2-tray__pics { display:flex; }
.ka2-tray__pics img { width:44px; height:58px; object-fit:cover; border-radius:6px; margin-left:-14px; box-shadow:0 0 0 2px #18171a; }
.ka2-tray__pics img:first-child { margin-left:0; }
.ka2-tray__txt { margin:0; font-size:14px; line-height:1.4; color:#ececec; }
.ka2-tray__go { display:flex; gap:6px; }
.pf.demo63 .main { padding-bottom:120px; }
@media (max-width:900px){ .ka2-grid { grid-template-columns:1fr 1fr; grid-auto-rows:44vw; } }
@media (max-width:640px){ .ka2-tray { grid-template-columns:1fr; } }