html,body{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;background:#1f1f1f;height:100%;margin:0;font-family:-apple-system,system-ui,sans-serif;overflow:hidden}#view{width:100%;height:100%;display:block;position:fixed;inset:0}#tray{padding:10px 16px calc(14px + env(safe-area-inset-bottom));align-items:center;gap:14px;display:flex;position:fixed;bottom:0;left:0;right:0}#tabs{flex-direction:column;gap:10px;display:flex}.tab{color:#fff;border:4px solid #fff0;border-radius:20px;place-items:center;width:64px;height:64px;font-size:30px;display:grid;box-shadow:0 4px 10px #0006}.tab.on{border-color:#fff;transform:scale(1.06)}#cards{scrollbar-width:none;touch-action:pan-x;flex:1;gap:14px;padding:10px 4px;display:flex;overflow-x:auto}#cards::-webkit-scrollbar{display:none}.card{background:#ffffffeb;border:5px solid #0000;border-radius:26px;flex:none;place-items:center;width:120px;height:120px;transition:transform .12s;display:grid;overflow:hidden;box-shadow:0 6px 14px #00000073}.card.on{border-color:#fc0;transform:scale(1.06)}.card:active{transform:scale(.94)}.card img{object-fit:cover;pointer-events:none;width:100%;height:100%}.swatch{border-radius:50%;width:84px;height:84px;box-shadow:inset 0 -8px 14px #00000059,inset 0 6px 10px #ffffff73}