.quick-actions{margin:20px 0 6px}
.qa-head{display:flex;align-items:baseline;gap:8px;margin-bottom:10px}
.qa-head h2{margin:0;font-size:20px}
.qa-head small{color:var(--muted,#a6a5b6);font-size:13px}
.qa-row{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;padding:2px 2px 8px;margin:0 -2px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.qa-row::-webkit-scrollbar{display:none}
.qa-card{flex:0 0 min(86%,300px);scroll-snap-align:start;display:flex;flex-direction:column;padding:8px 8px 10px;border-radius:22px;border:1px solid var(--line,#ffffff22);background:var(--surface,#ffffff10)}
.qa-compare{position:relative;aspect-ratio:5/3;border-radius:16px;overflow:hidden;touch-action:pan-y;user-select:none;background:#111}
.qa-compare img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}
.qa-before{position:absolute;inset:0;clip-path:inset(0 calc(100% - var(--pos)) 0 0)}
.qa-handle{position:absolute;top:0;bottom:0;left:var(--pos);width:2px;background:#fff;transform:translateX(-1px);pointer-events:none;box-shadow:0 0 8px #0007}
.qa-handle span{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:#fff;color:#16121f;border-radius:50%;width:30px;height:30px;display:grid;place-items:center;box-shadow:0 2px 10px #0006}
.qa-handle svg{width:16px;height:16px}
.qa-compare input{position:absolute;inset:0;width:100%;height:100%;opacity:0;margin:0;cursor:ew-resize}
.qa-tag,.qa-chip{position:absolute;font-style:normal;font-size:11px;font-weight:600;padding:3px 9px;border-radius:999px;background:#000000a8;color:#fff;pointer-events:none;backdrop-filter:blur(4px)}
.qa-tag{bottom:8px}.qa-tag-b{left:8px}.qa-tag-a{right:8px}
.qa-chip{top:8px;right:8px}
.qa-text{display:flex;flex-direction:column;gap:2px;padding:10px 4px 0}
.qa-text strong{font-size:16px;line-height:1.25}
.qa-text small{font-size:12.5px;color:var(--muted,#a6a5b6)}
.qa-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 4px 0}
.qa-drag{display:inline-flex;align-items:center;gap:4px;font-size:12.5px;color:var(--muted,#a6a5b6);white-space:nowrap}
.qa-drag svg{width:15px;height:15px}
.qa-go svg{width:17px;height:17px;flex:none}
.grid>div{position:relative}
.tile-card{display:flex;flex-direction:column;gap:7px;padding:6px 6px 8px;border-radius:20px;border:1px solid var(--line,#ffffff26);background:var(--surface,#ffffff10);min-width:0}
.tile-card .tile{border-radius:15px;width:100%}
.tile-card .tile-content{display:none}
.tile-cap{display:flex;flex-direction:column;gap:1px;padding:0 3px;min-width:0}
.tile-cap strong{font-size:14px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tile-cap small{font-size:11.5px;color:var(--muted,#a6a5b6);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tile-foot{display:flex;align-items:center;gap:6px;min-width:0}
.tile-foot .again{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer}
.tile-foot .again svg{width:15px;height:15px;flex:none}
.tile-foot .heart{position:static;flex:none;width:34px;height:34px;border:1px solid var(--line,#ffffff30);background:var(--surface2,#ffffff12);color:var(--text,#fff);padding:0;font-size:16px}
.popular-actions{grid-template-columns:repeat(3,minmax(0,1fr))}
.popular-actions>button{min-width:0;overflow:hidden}
.popular-actions strong,.popular-actions small{overflow-wrap:break-word}
@media(max-width:350px){.popular-actions>button{padding-left:10px;padding-right:10px}.popular-actions strong{font-size:13px}.popular-actions small{font-size:11px}.qa-drag{font-size:0;gap:0}.qa-drag svg{width:18px;height:18px}}
.qa-head .qa-nav{margin-left:auto;display:flex;gap:6px}
.qa-arrow{width:30px;height:30px;display:grid;place-items:center;padding:0;border-radius:50%;border:1px solid var(--line,#ffffff30);background:var(--surface,#ffffff12);color:var(--text,#fff);cursor:pointer}
.qa-arrow svg{width:16px;height:16px}
.qa-arrow:disabled{opacity:.35;cursor:default}
.qa-row.dragging{scroll-snap-type:none;cursor:grabbing;user-select:none}
.qa-text,.qa-foot{cursor:grab}
.qa-head{align-items:center}
.qa-head h2{white-space:nowrap}
.qa-head small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
@media(max-width:420px){.qa-head small{display:none}}
.qa-compare video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}
.qa-animate .qa-backdrop{object-fit:cover;filter:blur(16px) brightness(.55);transform:scale(1.15)}
.qa-animate .qa-main{inset:auto;left:50%;top:0;width:66%;height:auto;transform:translate(-50%,3%);object-fit:fill}
