/* Scrap Yard (scrap.js) and Scrap Yard looks next to names everywhere (flair.js). Colours come from the theme. */
.sy-tag{display:inline-block;font-family:'Press Start 2P',monospace;font-size:8px;letter-spacing:.06em;line-height:1;padding:4px 5px;color:#120808;background:var(--tc,#F5C542);vertical-align:middle;white-space:nowrap;border-radius:2px}
.sy-tag.shine,.sy-name.prism{background:linear-gradient(90deg,#F5C542,#fff6c9,#ff7ad9,#5fd7ff,#F5C542);background-size:300% 100%;animation:sy-shine 3s linear infinite}
.sy-name.prism{-webkit-background-clip:text;background-clip:text;color:transparent}
.no-motion .sy-tag.shine,.no-motion .sy-name.prism{animation:none}
@keyframes sy-shine{to{background-position:-300% 0}}
.sy-name.big{font-family:'Press Start 2P',monospace;font-size:13px}
.sy-chip{font-family:'VT323',monospace;font-size:20px;background:var(--bg-panel-alt);color:var(--text-primary);border:1px solid var(--border);padding:2px 10px;margin-right:6px;cursor:pointer;border-radius:4px}
.sy-chip:hover{border-color:var(--accent-amber)}
.opp-card.has-bn{position:relative;overflow:hidden}
.opp-card .opp-bn{position:absolute;left:0;top:0;width:100%;height:46px;image-rendering:pixelated;opacity:.55;pointer-events:none}
.opp-card.has-bn>*:not(.opp-bn){position:relative}

.sy-head-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:14px;margin-bottom:14px}
@media (max-width:640px){.sy-head-grid{grid-template-columns:1fr}}
.sy-head{display:grid;gap:12px;justify-items:start;margin-bottom:14px}
.sy-bal{display:grid;gap:6px}
.sy-bal b{font-size:20px;color:var(--accent-amber)}
.sy-bal small,.sy-today small{color:var(--text-muted)}
.sy-today{display:grid;gap:6px}
.sy-bar{height:10px;background:var(--bg-panel-alt);border:1px solid var(--border)}
.sy-bar i{display:block;height:100%;background:#F5C542}
.sy-bar i.g{background:#33C17A}
.sy-tabs{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 14px}
.sy-tabb{font-family:'VT323',monospace;font-size:20px;background:var(--bg-panel);color:var(--text-primary);border:1px solid var(--border);padding:6px 12px;cursor:pointer;border-radius:4px}
.sy-tabb.on{background:var(--accent-amber);border-color:var(--accent-amber);color:#fff}
.sy-stack{display:grid;gap:14px}
.sy-h{font-family:'VT323',monospace;font-size:22px;margin:0 0 8px}
.sy-chests{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.sy-chestcard{display:grid;gap:8px;justify-items:center;text-align:center}
.sy-chestcard.off{opacity:.5}
.sy-chestcard h3{font-family:'Press Start 2P',monospace;font-size:10px;margin:0;line-height:1.5}
.sy-chest{width:160px;height:144px;image-rendering:pixelated;max-width:100%}
.sy-chest.big{width:240px;height:216px}
.sy-price{color:#F5C542;font-size:11px}
.sy-odds{display:flex;flex-wrap:wrap;gap:4px 10px;justify-content:center;font-size:17px}
.sy-pity{color:var(--text-muted)}
.sy-pill{display:inline-block;font-family:'Press Start 2P',monospace;font-size:7px;letter-spacing:.06em;padding:3px 5px;border:1px solid currentColor;border-radius:2px;white-space:nowrap}
.t-c{color:var(--text-muted)}.t-r{color:#4FA3FF}.t-e{color:#B57BFF}.t-l{color:#E0A81B}
.sy-feed{display:grid;gap:4px}
.sy-feedrow{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;padding:6px 0;border-bottom:1px solid var(--border)}
.sy-feedrow small{color:var(--text-muted)}
.sy-smash{position:fixed;inset:0;z-index:200;background:rgba(10,4,4,.86);display:grid;place-items:center;align-content:center;gap:14px;padding:16px}
.sy-stage{position:relative;display:grid;place-items:center;width:280px;height:240px;max-width:100%}
.sy-chest.shake{animation:sy-shake .5s steps(6) infinite}
@keyframes sy-shake{0%,100%{transform:none}25%{transform:translateX(-6px) rotate(-3deg)}75%{transform:translateX(6px) rotate(3deg)}}
.sy-chest.open{animation:sy-pop .35s steps(4)}
@keyframes sy-pop{50%{transform:scale(1.15)}}
.no-motion .sy-chest.shake,.no-motion .sy-chest.open{animation:none}
.sy-spark{position:absolute;left:50%;top:50%;width:6px;height:6px;animation:sy-spark .9s steps(6) forwards}
@keyframes sy-spark{to{transform:translate(var(--dx),var(--dy));opacity:0}}
.sy-prize{display:grid;gap:10px;justify-items:center;text-align:center;background:var(--bg-panel);border:2px solid currentColor;padding:16px;max-width:420px;width:100%;color:var(--text-primary)}
.sy-prize.t-r{border-color:#4FA3FF}.sy-prize.t-e{border-color:#B57BFF}.sy-prize.t-l{border-color:#E0A81B;box-shadow:0 0 30px rgba(245,197,66,.45)}.sy-prize.t-c{border-color:var(--border)}
.sy-prize-name{font-size:12px;line-height:1.6}
.sy-prize-btns{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.sy-prev{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:center;min-height:28px}
.sy-icon{font-size:30px}
.sy-title{font-style:italic;color:var(--text-muted)}
.sy-swatch{display:inline-block;width:26px;height:18px;background:linear-gradient(90deg,#E8362B,#FF7A45,#FFD24A)}
.sy-banner{width:160px;height:40px;image-rendering:pixelated;max-width:100%;display:block}
.sy-banner.big{width:320px;height:80px}
.sy-banner.wide{width:100%;height:auto;aspect-ratio:4/1}
.sy-banner.empty{background:repeating-linear-gradient(45deg,var(--bg-panel-alt) 0 10px,var(--bg-panel) 10px 20px)}
.sy-card{padding:0;overflow:hidden}
.sy-who{display:flex;align-items:center;gap:12px;padding:10px 14px;flex-wrap:wrap}
.sy-av{font-size:30px;width:50px;height:50px;display:grid;place-items:center;background:var(--bg-panel-alt);border:3px solid #F5C542;margin-top:-30px;position:relative}
.sy-profile{margin-bottom:16px;display:grid;gap:8px}
.sy-slots{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px}
.sy-slot{display:grid;gap:6px;align-content:start;min-width:0}
.sy-opts{display:flex;flex-wrap:wrap;gap:6px}
.sy-opt{display:flex;align-items:center;gap:6px;background:var(--bg-panel-alt);color:var(--text-primary);border:1px solid var(--border);padding:4px 8px;cursor:pointer;font-family:'VT323',monospace;font-size:18px;border-radius:4px;max-width:100%}
.sy-opt .sy-prev{min-height:0}
.sy-opt .sy-banner{width:80px;height:20px}
.sy-opt .sy-icon{font-size:20px}
.sy-opt.on{border-color:#F5C542;box-shadow:0 0 0 1px #F5C542}
.sy-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px}
.sy-it{display:grid;gap:6px;align-content:start;background:var(--bg-panel-alt);border:1px solid var(--border);padding:8px;border-radius:4px;min-width:0}
.sy-it.locked{opacity:.6}
.sy-it.have{border-color:var(--accent-violet)}
.sy-it .sy-prev{justify-content:flex-start}
.sy-it .sy-banner{width:100%;height:auto;aspect-ratio:4/1}
.sy-itrow{display:flex;justify-content:space-between;align-items:center;gap:6px;flex-wrap:wrap}
.sy-src{color:var(--text-muted);font-size:16px}
.sy-tablewrap{overflow-x:auto}
.sy-tablewrap td.num{text-align:right;white-space:nowrap}
.sy-done{color:var(--accent-violet)}
.sy-code{font-family:ui-monospace,monospace;font-size:12px;word-break:break-all}