/* w4 (Nov 3 2026): bot cards, looks, pirate guide, patch slides, profile, sprite guide, leaderboards nav, Now live bar, loot add-ons */
.w4-wrap{max-width:760px;margin:0 auto}.w4-wide{max-width:1100px}
.w4-box{background:var(--lc-card,#141a2b);border:1px solid var(--lc-line,#2a3450);border-radius:16px;padding:14px 16px;margin:0 0 14px}.w4-box h2{font-size:19px;margin:0 0 8px}
.w4-note{color:var(--lc-muted,#9aa6bd);font-size:14px}.w4-src{color:var(--lc-muted,#9aa6bd);font-size:12.5px;margin:8px 0 0;font-style:italic}
.w4-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:12px 0}
.w4-mini{font-size:12px;padding:3px 9px;border-radius:999px;border:1px solid var(--lc-line,#2a3450);background:transparent;color:inherit;cursor:pointer;vertical-align:middle}
.w4-steps{margin:0;padding-left:20px}.w4-steps li{margin:6px 0}
.w4-pill{display:inline-block;border-radius:999px;padding:2px 9px;font-size:12px;font-weight:700;white-space:nowrap}
.w4-pill-free{background:#163b24;color:#8fe39b}.w4-pill-busy{background:#3d2a0b;color:#ffcf7a}.w4-pill-off{background:#2a2d35;color:#b9bec9}.w4-pill-q{background:#1e2638;color:#9aa6bd}
/* cards */
.w4-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,230px),1fr));gap:14px}
.w4-card{position:relative;display:flex;flex-direction:column;border-radius:20px;padding:12px;background:linear-gradient(160deg,#1b2440,#0f1424 70%);border:3px solid #6c7a96;box-shadow:0 8px 24px rgba(0,0,0,.35),inset 0 0 0 2px rgba(255,255,255,.06);overflow:hidden;min-width:0}
.w4-card:before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 30%,rgba(255,255,255,.08) 45%,transparent 60%);pointer-events:none}
.w4-r-leg{border-color:#e98d4b;background:linear-gradient(160deg,#4a2a14,#1a1220 70%)}.w4-r-epic{border-color:#b15be2;background:linear-gradient(160deg,#3a1d55,#141026 70%)}
.w4-r-rare{border-color:#49acf2;background:linear-gradient(160deg,#123a5c,#0e1526 70%)}.w4-r-unc{border-color:#60aa3a;background:linear-gradient(160deg,#1d3d16,#0f1a14 70%)}
.w4-r-myth{border-color:#f0d24b;background:linear-gradient(160deg,#4d4012,#1a1608 70%)}.w4-r-ser{border-color:#e14f8c;background:linear-gradient(160deg,#3d1530,#120d1e 70%)}
.w4-card-top{display:flex;justify-content:space-between;align-items:center;gap:6px}.w4-card-no{font:800 22px/1 system-ui,sans-serif;color:#f5c542}.w4-card-no small{font-size:12px;color:#c9d2e3;margin-left:1px}
.w4-card-art{aspect-ratio:1/1;margin:8px 0;border-radius:14px;background:radial-gradient(circle at 50% 40%,rgba(255,255,255,.18),rgba(0,0,0,.25));display:flex;align-items:center;justify-content:center;overflow:hidden}
.w4-card-art img{width:100%;height:100%;object-fit:contain}.w4-card-ph{font-size:64px}
.w4-card-name{margin:2px 0 0;font-size:19px;overflow-wrap:anywhere}.w4-card-vibe{margin:2px 0;font-weight:700;color:#ffd77a}.w4-card-desc{margin:0 0 6px;font-size:13.5px;color:#d3d9e6}
.w4-card-fit{display:grid;grid-template-columns:auto 1fr;gap:2px 8px;margin:4px 0 6px;font-size:13px}.w4-card-fit dt{color:#9aa6bd}.w4-card-fit dd{margin:0;overflow-wrap:anywhere}
.w4-card-sig{font-size:13px;margin:0 0 4px;color:#ffe9a8}.w4-card-add{font-size:13px;margin:auto 0 6px;color:#c9d2e3;overflow-wrap:anywhere}
.w4-card-go{display:block;text-align:center;padding:8px;border-radius:12px;background:rgba(255,255,255,.1);color:#fff;font-weight:700;text-decoration:none}
.w4-botgrid{display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:14px;align-items:start}
@media (max-width:640px){.w4-botgrid{grid-template-columns:minmax(0,1fr)}.w4-botgrid .w4-card{max-width:340px;margin:0 auto;width:100%}}
.w4-feed{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr));gap:4px 14px;font-size:14.5px}.w4-feed li{padding:3px 0}
.w4-feedsum{font-weight:700;margin:0 0 8px}
.w4-chip{display:inline-flex;align-items:center;gap:5px;background:rgba(255,255,255,.07);border-radius:999px;padding:2px 9px 2px 3px;margin:2px 4px 2px 0;font-size:13px}.w4-chip img{border-radius:50%;background:#0002}
.w4-hday,.w4-lookrow{margin:4px 0;font-size:14px}.w4-lookrow a{font-weight:700;margin-right:4px}
.w4-looknow{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(46%,150px),1fr));gap:10px}
.w4-look{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;padding:8px;border-radius:14px;background:rgba(255,255,255,.05);color:inherit;text-decoration:none;min-width:0}
.w4-look img{width:96px;height:96px;object-fit:contain}.w4-look b{font-size:14px;overflow-wrap:anywhere}.w4-look small{font-size:11.5px;color:#9aa6bd;overflow-wrap:anywhere}
.w4-look-no{position:absolute;left:8px;top:6px;font-weight:800;color:#f5c542}
/* guide */
.w4-guide ul{padding-left:20px;margin:6px 0}.w4-guide li{margin:5px 0}.w4-guide details{border-top:1px solid var(--lc-line,#2a3450);padding:8px 0}.w4-guide summary{cursor:pointer;font-weight:700}
.w4-dates{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 0 12px}.w4-dates div{background:linear-gradient(135deg,#2a1d05,#141a2b);border:1px solid #5a4614;border-radius:16px;padding:12px}
.w4-dates b{display:block;font-size:32px;color:#f5c542;line-height:1.1}.w4-dates span{font-size:13px;color:#d3d9e6}
.w4-warn{background:#3a1717;border:1px solid #7a2b2b;color:#ffd9d9;border-radius:14px;padding:12px 14px;margin:0 0 14px;font-size:15px}
.w4-cta{background:linear-gradient(135deg,#2a1d05,#141a2b);border-color:#5a4614}
.w4-sprites{list-style:none;padding:0!important;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,220px),1fr));gap:4px 12px}
.w4-rar{display:inline-block;font-size:11.5px;border-radius:6px;padding:1px 6px;background:#222a3d}.w4-rar-m{background:#4d4012;color:#ffe680}.w4-rar-l{background:#4a2a14;color:#ffbe8a}.w4-rar-e{background:#3a1d55;color:#e2b8ff}.w4-rar-r{background:#123a5c;color:#a8d8ff}
/* patch slides */
.w4-slides{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr));gap:12px}
.w4-slide{display:flex;flex-direction:column;gap:4px;padding:14px;border-radius:16px;background:linear-gradient(170deg,#132a52,#0a1020);border:1px solid #2f3d63;color:inherit;text-decoration:none;aspect-ratio:9/12;overflow:hidden}
.w4-slide b{font-size:18px}.w4-slide small{color:#b9c3d6}.w4-slide-d{font-size:12px;color:#f5c542}
.w4-slidebox{max-width:360px;margin:0 auto}.w4-slidebox canvas{width:100%;height:auto;border-radius:16px;box-shadow:0 8px 30px rgba(0,0,0,.5);background:#0a1020}
/* profile */
.w4-me{display:grid;gap:12px}.w4-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.w4-stats div{background:rgba(255,255,255,.05);border-radius:12px;padding:10px;text-align:center}
.w4-stats b{display:block;font-size:24px;color:#f5c542}.w4-stats span{font-size:12.5px;color:#c9d2e3}
.w4-badges span{display:inline-block;background:rgba(255,255,255,.07);border-radius:999px;padding:3px 10px;margin:3px 4px 3px 0;font-size:13.5px}
/* leaderboards nav */
.w4-lbnav{display:flex;gap:8px;overflow-x:auto;padding:4px 0 10px;scrollbar-width:none}.w4-lbnav::-webkit-scrollbar{display:none}
.w4-lbnav a{flex:0 0 auto;padding:6px 12px;border-radius:999px;background:rgba(255,255,255,.07);color:inherit;text-decoration:none;font-size:14px;white-space:nowrap}
.w4-lbh{font-size:21px;margin:18px 0 8px;scroll-margin-top:80px}
/* Now live bar */
.w4-bar{position:relative;z-index:60;display:flex;align-items:center;gap:8px;min-height:30px;padding:4px 40px 4px 10px;background:linear-gradient(90deg,#3a2606,#0f2a33);color:#ffe9b0;font-size:13px;line-height:1.3;border-bottom:1px solid #6b4a1c}
.w4-bar[hidden]{display:none}.w4-bar-live{flex:0 0 auto;font-size:10px;font-weight:800;letter-spacing:.08em;background:#e5484d;color:#fff;border-radius:4px;padding:1px 5px}
.w4-bar-items{display:flex;gap:6px;overflow-x:auto;white-space:nowrap;scrollbar-width:none;-webkit-overflow-scrolling:touch;min-width:0}.w4-bar-items::-webkit-scrollbar{display:none}
.w4-bar a{color:#ffe9b0;text-decoration:none}.w4-bar a b{color:#fff}.w4-bar-dot{opacity:.5}
.w4-bar-x{position:absolute;right:4px;top:50%;transform:translateY(-50%);width:32px;height:28px;border:0;background:transparent;color:#ffe9b0;font-size:15px;cursor:pointer}
.w4-ptog{background:none;border:0;color:inherit;text-decoration:underline;cursor:pointer;font:inherit;padding:0}
.w4-pfoot{text-align:center;font-size:13px;margin:10px 0;opacity:.85}
/* loot add-ons */
.w4-loot{display:grid;gap:12px;margin:0 0 14px}.w4-loot .w4-box{margin:0}
.w4-poid{display:flex;flex-wrap:wrap;align-items:center;gap:8px;background:linear-gradient(90deg,#3a2606,#141a2b);border:1px solid #6b4a1c;border-radius:14px;padding:10px 12px}
.w4-loot select{max-width:100%;padding:7px 8px;border-radius:8px;background:#111a;color:inherit;border:1px solid #ffffff33}
.w4-loot button{padding:7px 11px;border-radius:8px;background:#ffffff14;color:inherit;border:1px solid #ffffff33;cursor:pointer}
.w4-loot .w4-go{background:#f5a524;color:#1b1205;border-color:#f5a524;font-weight:700}
.w4-bt-prog{height:10px;background:#0006;border-radius:6px;overflow:hidden;margin:6px 0}.w4-bt-prog i{display:block;height:100%;background:linear-gradient(90deg,#f5a524,#ffe08a);width:0}
.w4-bt-list{list-style:none;margin:6px 0 0;padding:0;max-height:420px;overflow-y:auto}.w4-bt-list li{display:flex;align-items:center;gap:8px;padding:6px 2px;border-bottom:1px solid #ffffff10;font-size:14px}
.w4-bt-list label{flex:1;display:flex;align-items:center;gap:8px;cursor:pointer;min-width:0}.w4-bt-list input{width:20px;height:20px;flex:0 0 auto}.w4-bt-list li.done span{text-decoration:line-through;opacity:.6}
.w4-bt-g{font-weight:700;color:#f5c542;padding:8px 2px 2px!important;border:0!important}
.w4-feed li.w4-feedfree{grid-column:1/-1}.w4-feedfree a{font-weight:700}

/* w78: Now live bar marquee (only when the text doesn't fit; LIVE pill + ✕ stay put) */
.w4-bar-items.w4-mq,.w4-bar-items.w4-rot{overflow:hidden;flex:1 1 auto}
.w4-bar-items.w4-mq{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 10px,#000 calc(100% - 14px),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 10px,#000 calc(100% - 14px),transparent 100%)}
.w4-bar-track{display:flex;width:max-content;animation:w4mq 20s linear infinite;will-change:transform}
.w4-bar-grp{display:flex;flex:0 0 auto;gap:6px;padding-right:36px;white-space:nowrap}
@keyframes w4mq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.w4-bar-items.w4-mq:hover .w4-bar-track,.w4-bar-items.w4-hold .w4-bar-track,.w4-bar-items.w4-mq:focus-within .w4-bar-track{animation-play-state:paused}
.w4-bar-items.w4-rot .w4-bar-dot,.w4-bar-items.w4-rot a{display:none}
.w4-bar-items.w4-rot a.w4-on{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;animation:w4fade .4s ease}
@keyframes w4fade{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.w4-bar-track{animation:none}}