:root{--accent:#f6a;--accent-strong:#f04f98;--accent-light:#ff8fc3;--accent-muted:#ff66aa7a;--accent-soft:#ff66aa29;--bg:#07070a;--border:#ffffff14;--border-strong:#ff66aa38;--danger:#ff6f9f;--heading:#fbf7fa;--input:#111116;--muted:#9d96a0;--muted-soft:#67606a;--panel:#0d0d12;--panel-solid:#0b0b10;--row:#101017;--row-hover:#15121a;--surface:#15151d;--surface-strong:#1d1b24;--text:#ece7eb;--mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;--sans:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--shadow:0 18px 70px #00000057;color:var(--text);background:var(--bg);font:16px/1.5 var(--sans);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}html{background:var(--bg)}body{background:var(--bg);min-width:320px;min-height:100vh;margin:0}button,input{font:inherit}h1,h2,p{margin:0}h1,h2{color:var(--heading);line-height:1.05}h1{letter-spacing:-.06em;max-width:760px;margin-bottom:12px;font-size:clamp(34px,6vw,68px)}h2{letter-spacing:-.04em;font-size:clamp(24px,3vw,34px)}a{color:inherit}:root{--space-2xs:1px;--space-xs:2px;--space-sm:5px;--space-md:6px;--space-lg:8px;--space-xl:10px;--space-2xl:12px;--space-3xl:14px;--space-4xl:16px;--space-5xl:24px;--space-page:clamp(12px, 7vw, 100px);--radius-sm:12px;--radius-md:14px;--radius-lg:18px;--radius-xl:20px;--radius-pill:999px;--control-height:40px;--button-size:42px;--action-size:28px;--audio-button-size:36px;--card-overlap:var(--space-lg);--cover-size:104px;--cover-size-tablet:86px;--cover-size-mobile:92px;--icon-xs:15px;--icon-sm:16px;--icon-md:18px;--icon-lg:32px}.app-shell{width:100%;min-height:100vh;padding:0 var(--space-page) calc(var(--space-4xl) * 2);flex-direction:column;display:flex}.site-footer{margin-top:var(--space-5xl);color:var(--muted-soft);letter-spacing:.04em;place-items:center;font-size:12px;font-weight:750;display:grid}.site-footer a{color:var(--accent-muted);text-decoration:none}.site-footer a:hover{color:var(--accent-light)}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.eyebrow{color:var(--accent);letter-spacing:.16em;text-transform:uppercase;margin:0 0 8px;font-size:12px;font-weight:800}.control-panel{gap:var(--space-lg);border:1px solid var(--border);border-radius:var(--radius-md);background:var(--row);padding:var(--space-lg);box-shadow:var(--shadow);display:grid}.sticky-search-wrap{z-index:10;background:var(--bg);padding:var(--space-xl) 0;position:sticky;top:0}.primary-controls,.advanced-filters,.filter-controls{gap:var(--space-xl);display:grid}.primary-controls{align-items:center;gap:var(--space-lg);grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.filter-controls{grid-template-columns:repeat(4, minmax(0, 1fr)) var(--control-height);align-items:center;gap:var(--space-lg);width:100%;min-width:0;display:grid}.advanced-filters{border-top:1px solid var(--border);padding-top:var(--space-xl);grid-template-columns:repeat(4,minmax(170px,1fr)) auto;align-items:stretch}.field,.range-field,.slider-field{gap:calc(var(--space-md) + var(--space-2xs));display:grid}.search-field{gap:0;min-width:0}.field>span:not(.input-with-status,[aria-hidden=true]),.slider-label{color:var(--muted);letter-spacing:.08em;text-transform:uppercase;font-size:12px;font-weight:800;line-height:1}.range-field{align-items:center;gap:var(--space-sm);width:100%;min-width:0;height:var(--control-height);border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--input);box-sizing:border-box;padding:0 var(--space-md) 0 var(--space-lg);grid-template-columns:auto minmax(78px,1fr)}.range-field>span{grid-column:auto}.range-field>span:first-child,.status-field>span:first-child{width:var(--icon-md);height:var(--icon-md);color:var(--muted);place-items:center;display:grid}.range-field>span:first-child svg,.status-field>span:first-child svg{width:var(--icon-sm);height:var(--icon-sm);fill:none;stroke:currentColor}.range-inputs{align-items:center;gap:var(--space-sm);color:var(--muted-soft);grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);min-width:0;font-size:13px;line-height:1;display:grid}.range-inputs input{width:100%;min-width:0;height:calc(var(--control-height) - 2px);border-radius:var(--radius-sm);min-height:0;color:var(--text);padding:0 var(--space-xs);text-align:center;background:0 0;border:0;font-size:13px;line-height:1}.range-inputs input:focus{background:var(--surface);box-shadow:none}input,select{width:100%;min-height:var(--control-height);border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--input);color:var(--text);font:inherit;padding:calc(var(--space-lg) + var(--space-2xs)) calc(var(--space-xl) + var(--space-2xs));outline:none}input[type=number]{appearance:textfield}input[type=number]::-webkit-inner-spin-button{appearance:none;margin:0}input[type=number]::-webkit-outer-spin-button{appearance:none;margin:0}input[type=range]{min-height:var(--icon-md);accent-color:var(--accent);pointer-events:none;background:0 0;border:0;padding:0}input[type=range]:focus{box-shadow:none}input::placeholder{color:var(--muted-soft)}input:focus,select:focus{border-color:var(--accent);box-shadow:0 0 0 calc(var(--space-xs) + var(--space-2xs)) var(--accent-soft)}.input-with-status{min-width:0;display:block;position:relative}.search-pill{height:var(--control-height);min-height:var(--control-height);border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--input);box-sizing:border-box;grid-template-columns:minmax(0,1fr) auto;display:grid;overflow:hidden}.search-pill:focus-within{border-color:var(--border);box-shadow:none}.search-pill:has(input.has-field-error){border-color:#ff4a8675}.search-pill:has(input.has-field-error:focus){box-shadow:none;border-color:#ff4a8694}.search-pill input{min-height:calc(var(--control-height) - 2px);border-radius:var(--radius-sm) 0 0 var(--radius-sm);background:0 0;border:0;padding-top:0;padding-bottom:0;font-size:14px;line-height:1}.search-pill input:focus{box-shadow:none}.search-button.primary-button{border-left:1px solid var(--border);border-radius:0 var(--radius-sm) var(--radius-sm) 0;background:var(--surface-strong);box-sizing:border-box;width:58px;height:100%;min-height:0;color:var(--text);padding:0}.search-button.primary-button:not(:disabled):hover{background:var(--surface);color:var(--accent-light)}.status-field{align-items:center;gap:var(--space-sm);width:100%;min-width:0;height:var(--control-height);border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--input);box-sizing:border-box;padding:0 var(--space-xs) 0 var(--space-xl);grid-template-columns:auto minmax(0,1fr)}.status-field select{min-height:0;height:calc(var(--control-height) - 2px);padding:0 var(--space-lg) 0 var(--space-xs);background:0 0;border:0;font-size:13px;line-height:1}.status-field select:focus{box-shadow:none}.search-pill input,.range-inputs input,.status-field select{color:var(--text);letter-spacing:.01em;font-size:14px;font-weight:600;line-height:1}input.has-field-error{padding-right:calc(var(--space-5xl) + var(--space-xs));border-color:#ff4a8675}.search-pill input.has-field-error{padding-right:calc(var(--space-5xl) + var(--space-xs))}input.has-field-error:focus{box-shadow:0 0 0 calc(var(--space-xs) + var(--space-2xs)) #ff4a861f;border-color:#ff4a8694}.search-pill input.has-field-error:focus{box-shadow:none}.field-error-icon{top:50%;right:var(--space-xl);width:var(--icon-md);height:var(--icon-md);color:#ff4a86d1;outline:none;place-items:center;display:grid;position:absolute;transform:translateY(-50%)}.search-field .field-error-icon{right:calc(58px + var(--space-xl))}.field-error-icon svg{width:var(--icon-md);height:var(--icon-md);fill:none;stroke:currentColor}.field-tooltip{right:calc(var(--space-2xs) * -1);bottom:calc(100% + var(--space-lg));border-radius:var(--radius-pill);width:max-content;max-width:160px;color:var(--text);letter-spacing:0;opacity:0;padding:var(--space-md) var(--space-xl);pointer-events:none;text-transform:none;white-space:nowrap;background:#0d0d12f0;border:1px solid #ff4a8638;font-size:11px;font-weight:750;transition:opacity .12s,transform .12s;position:absolute;transform:translateY(3px)}.field-error-icon:hover .field-tooltip,.field-error-icon:focus .field-tooltip{opacity:1;transform:translateY(0)}.check-field{align-items:center;gap:calc(var(--space-lg) + var(--space-2xs));min-height:var(--control-height);color:var(--text);white-space:nowrap;font-size:13px;font-weight:700;display:flex}.check-field input{width:var(--icon-sm);min-height:var(--icon-sm);accent-color:var(--accent)}button,.row-actions a{border-radius:var(--radius-sm);cursor:pointer;font:inherit;border:0;font-weight:800;text-decoration:none}button:disabled{cursor:not-allowed;opacity:.5}.primary-button,.ghost-button{width:var(--button-size);min-height:var(--control-height);padding:calc(var(--space-lg) + var(--space-2xs));place-items:center;display:grid}.primary-button svg,.ghost-button svg{fill:none;stroke:currentColor;width:18px;height:18px}.primary-button{background:var(--accent);color:#f5eef3}.primary-button:not(:disabled):hover{background:var(--accent-strong)}.ghost-button{border:1px solid var(--border);background:var(--surface);color:var(--text)}.filter-controls .ghost-button{width:var(--control-height);height:var(--control-height);min-height:var(--control-height);border-radius:var(--radius-sm);background:var(--surface-strong);box-sizing:border-box;padding:0}.ghost-button:hover{border-color:var(--accent-muted);color:var(--accent-light)}.spinner-icon{animation:2s linear infinite spin}@keyframes spin{to{rotate:360deg}}.advanced-toggle{width:32px;min-height:calc(var(--space-xl) * 2 + var(--space-xs));border:1px solid var(--border);border-radius:var(--radius-pill);background:var(--surface);color:var(--accent-light);justify-content:center;justify-self:center;align-items:center;padding:0;display:grid}.advanced-toggle:hover{border-color:var(--accent-muted);background:var(--surface-strong)}.advanced-toggle svg{fill:none;stroke:currentColor;width:16px;height:16px}.slider-field{align-items:center;gap:var(--space-lg);border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface);padding:calc(var(--space-lg) + var(--space-2xs)) var(--space-xl);grid-template-columns:auto auto minmax(76px,1fr) auto}.slider-field strong{color:var(--text);white-space:nowrap;font-size:12px;font-weight:850}.dual-slider{height:var(--action-size);align-items:center;display:grid;position:relative}.dual-slider:before,.dual-slider:after{content:"";height:var(--space-xs);border-radius:var(--radius-pill);position:absolute;left:0;right:0}.dual-slider:before{background:var(--input)}.dual-slider:after{right:var(--range-right);left:var(--range-left);background:var(--accent)}.dual-slider input{z-index:1;position:absolute}.dual-slider input::-webkit-slider-thumb{z-index:2;width:var(--icon-sm);height:var(--icon-sm);border:2px solid var(--heading);appearance:none;background:var(--accent);cursor:pointer;pointer-events:auto;border-radius:50%;position:relative}.dual-slider input::-webkit-slider-runnable-track{height:var(--space-xs);background:0 0}.dual-slider input::-moz-range-thumb{z-index:2;width:var(--space-3xl);height:var(--space-3xl);border:2px solid var(--heading);background:var(--accent);cursor:pointer;pointer-events:auto;border-radius:50%;position:relative}.dual-slider input::-moz-range-track{height:var(--space-xs);background:0 0;border:0}.results-panel{flex-direction:column;flex:auto;display:flex}.empty-results{min-height:100%;color:var(--muted);text-align:center;flex:auto;place-items:center;margin:0;font-size:clamp(18px,2vw,26px);font-weight:800;display:grid}.loading-recommendations{padding-top:var(--space-5xl);align-items:start}.error-text{margin:0 var(--space-lg) var(--space-3xl);border-radius:var(--radius-md);color:var(--danger);padding:var(--space-2xl) var(--space-3xl);background:#ff4a8617;border:1px solid #ff4a8652;font-weight:700}.beatmap-card{border:1px solid var(--border);border-radius:var(--radius-md);background:var(--row);align-items:stretch;display:grid;position:relative;overflow:hidden}.source-card{grid-template-columns:minmax(calc(240px + var(--card-overlap)), calc(340px + var(--card-overlap))) minmax(0, 1fr);margin:0}.recommend-layout{gap:0;display:grid}.recommend-layout>.source-card{margin-top:var(--space-xl)}.source-cover{aspect-ratio:10/3;background:var(--surface);border-radius:0;width:100%;min-height:132px;overflow:hidden}.source-cover img,.source-cover .cover-placeholder{width:100%;height:100%;display:block}.source-cover img{object-fit:cover;object-position:center}.source-main{gap:var(--space-md);align-content:center;min-width:0;display:grid}.beatmap-card-content{gap:var(--space-2xl);min-width:0;margin-left:calc(var(--card-overlap) * -1);background:var(--row);grid-template-columns:minmax(0,1fr) 300px;display:grid;position:relative}.source-content{border-radius:var(--card-overlap) 0 0 var(--card-overlap);padding:var(--space-xl) var(--space-xl) var(--space-xl) var(--radius-md);align-items:stretch}.source-heading{min-width:0;display:grid}.source-copy{min-width:0}.source-results{min-height:calc(var(--space-xl) * 2);border-radius:var(--radius-pill);background:var(--accent);color:#f5eef3;letter-spacing:.04em;padding:calc(var(--space-xs) + var(--space-2xs)) calc(var(--space-md) + var(--space-2xs));white-space:nowrap;border:1px solid #ffffff1f;flex:none;justify-content:center;align-items:center;font-size:10px;font-weight:850;line-height:1;display:inline-flex}.source-title{color:var(--text);text-overflow:ellipsis;white-space:nowrap;font-size:17px;font-weight:850;overflow:hidden}.clickable-card{cursor:pointer}.clickable-card:focus-visible{border-color:var(--accent-muted);outline:2px solid var(--accent-soft);outline-offset:2px}.result-list{gap:var(--space-xl);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.result-list-wrap{position:relative}.results-loading-overlay{z-index:2;border-radius:var(--radius-lg);pointer-events:auto;background:#0000008f;position:absolute;inset:0}.beatmap-row{grid-template-columns:calc(var(--cover-size) + var(--card-overlap)) minmax(0, 1fr);min-height:var(--cover-size-mobile);content-visibility:auto;contain-intrinsic-size:104px}.beatmap-row:hover{background:var(--row-hover)}.cover-preview{height:100%;min-height:var(--cover-size);background:var(--surface);text-align:left;border:0;border-radius:0;padding:0;display:block;position:relative;overflow:hidden}.cover-preview:not(:disabled):hover{cursor:pointer}.cover-preview:disabled{cursor:not-allowed;opacity:.62}.cover-preview:after{content:"";opacity:0;background:#00000075;transition:opacity .18s;position:absolute;inset:0}.cover-preview img,.cover-placeholder{width:100%;height:100%;transition:transform .22s,filter .18s;display:block}.cover-preview img{object-fit:cover;object-position:calc(50% - (var(--card-overlap) / 2)) center}.beatmap-row:hover .cover-preview:not(:disabled):after,.cover-preview:not(:disabled):focus-visible:after,.cover-preview.is-audio-active:after{opacity:1}.beatmap-row:hover .cover-preview:not(:disabled) img,.cover-preview:not(:disabled):focus-visible img,.cover-preview.is-audio-active img{filter:saturate(.9);transform:scale(1.04)}.cover-play-overlay{z-index:1;opacity:0;place-items:center;transition:opacity .16s,transform .2s cubic-bezier(.22,1,.36,1);display:grid;position:absolute;inset:0;transform:scale(.92)}.beatmap-row:hover .cover-preview:not(:disabled) .cover-play-overlay,.cover-preview:not(:disabled):focus-visible .cover-play-overlay,.cover-preview.is-audio-active .cover-play-overlay{opacity:1;transform:scale(1)}.cover-play-button{width:calc(var(--button-size) + var(--space-xs));height:calc(var(--button-size) + var(--space-xs));color:var(--accent-light);filter:drop-shadow(0 6px 16px #0000008c);place-items:center;display:grid}.cover-play-button svg{fill:none;stroke:currentColor;width:32px;height:32px}.filled-icon{fill:currentColor;stroke:currentColor}.cover-placeholder{color:var(--accent-light);place-items:center;font-size:20px;font-weight:900;display:grid}.map-content{border-radius:var(--card-overlap) var(--radius-md) var(--radius-md) var(--card-overlap);padding:calc(var(--space-xl) - 1px) calc(var(--space-xl) - 1px) calc(var(--space-xl) - 1px) calc(var(--radius-md) - 1px);border:1px solid #0000;align-items:center}.beatmap-row:hover .map-content{background:var(--row-hover)}.map-main{min-width:0;min-height:78px;padding:var(--space-xs) 0;position:relative}.title-line{align-items:center;gap:calc(var(--space-lg) + var(--space-2xs));min-width:0;display:flex}.map-title{min-width:0;color:var(--heading);letter-spacing:-.02em;text-overflow:ellipsis;white-space:nowrap;flex:auto;font-size:17px;font-weight:850;text-decoration:none;overflow:hidden}.artist-line{margin-top:var(--space-xs);color:var(--muted);text-overflow:ellipsis;white-space:nowrap;font-size:13px;font-weight:750;overflow:hidden}.version-line{margin-top:var(--space-xs);color:var(--muted-soft);text-overflow:ellipsis;white-space:nowrap;font-size:12px;font-weight:700;overflow:hidden}.version-line span:first-child{text-overflow:ellipsis;white-space:nowrap;display:block;overflow:hidden}.match-pill{border-radius:var(--radius-pill);color:#f5eef3;min-width:46px;padding:calc(var(--space-xs) + var(--space-2xs)) calc(var(--space-md) + var(--space-2xs));white-space:nowrap;background:#d65c94c7;border:1px solid #ffffff24;justify-content:center;justify-self:start;align-items:center;font-size:11px;font-weight:800;display:inline-flex}.match-line{align-items:center;gap:var(--space-md) var(--space-xl);min-width:0;margin-top:var(--space-lg);color:var(--muted-soft);flex-wrap:nowrap;font-size:11px;font-weight:650;display:flex}.match-line a,.match-line>span:last-child{min-width:0;color:var(--muted-soft);text-overflow:ellipsis;white-space:nowrap;text-decoration:none;overflow:hidden}.match-line .mapper-link{color:#c4bec8;font-weight:850;text-decoration:none}.match-line .mapper-link:hover{color:#d6d0da;text-decoration:underline}.status-label{min-height:calc(var(--space-xl) * 2);border-radius:var(--radius-pill);color:#f5eef3;letter-spacing:.04em;padding:calc(var(--space-xs) + var(--space-2xs)) calc(var(--space-md) + var(--space-2xs));text-transform:uppercase;white-space:nowrap;background:#5f5b64;border:1px solid #ffffff1f;flex:none;justify-content:center;align-items:center;font-size:10px;font-weight:850;line-height:1;display:inline-flex}.status-ranked{background:#a3873d}.status-loved{background:#8361c9}.stat-strip{justify-content:flex-end;align-items:center;gap:var(--space-3xl);width:300px;min-width:300px;display:flex}.stat-row{align-items:center;gap:var(--space-2xl);display:flex}.stat-row-main{gap:var(--space-md)}.stat-row-main .stat-item{min-width:54px}.stat-row-sub{align-items:stretch;gap:calc(var(--space-md) + var(--space-2xs));flex-direction:column}.stat-side{align-items:center;gap:var(--space-2xl);display:flex}.row-actions{align-items:center;gap:var(--space-sm);flex-direction:column;display:flex}.stat-row-sub .stat-item{justify-content:start;align-items:baseline;gap:var(--space-xs);text-align:left;grid-template-columns:2ch 3.5ch;min-width:0}.stat-row-sub .stat-item strong{font-variant-numeric:tabular-nums;justify-self:end}.stat-item{align-content:center;gap:var(--space-2xs);text-align:center;justify-items:center;min-width:34px;display:grid}.stat-item span{color:var(--muted);letter-spacing:.08em;text-transform:uppercase;font-size:10px;font-weight:850}.stat-item span svg{fill:none;stroke:currentColor;width:12px;height:12px;display:block}.stat-item strong{color:var(--text);font-size:13px;line-height:1}.featured-stat{min-width:50px}.featured-stat strong{color:var(--heading);letter-spacing:-.03em;font-size:17px;font-weight:900}.row-actions button,.row-actions a{width:var(--action-size);min-height:var(--action-size);color:#c4bec8;opacity:0;padding:var(--space-md);pointer-events:none;text-align:center;background:0 0;place-items:center;line-height:1;transition:opacity .12s,color .12s;display:grid}.beatmap-row:hover .row-actions button,.beatmap-row:hover .row-actions a,.beatmap-row .row-actions:focus-within button,.beatmap-row .row-actions:focus-within a{opacity:1;pointer-events:auto}.row-actions svg{fill:none;stroke:currentColor;width:15px;height:15px}.row-actions button:hover,.row-actions a:hover{color:#fff}.row-actions button:disabled,.row-actions button:disabled:hover{color:var(--muted-soft);cursor:not-allowed}.beatmap-row:hover .row-actions button:disabled,.beatmap-row .row-actions:focus-within button:disabled{opacity:.42;pointer-events:none}.source-card .source-content{grid-template-columns:minmax(0,1fr) auto}.source-card .stat-strip{width:auto;min-width:0}.source-card .stat-side{gap:var(--space-2xl)}.source-card .stat-row-sub{align-items:center;gap:var(--space-md);flex-direction:row}.source-card .stat-row-sub .stat-item{justify-content:center;justify-items:center;gap:var(--space-2xs);text-align:center;grid-template-columns:none;min-width:54px}.source-card .stat-row-sub .stat-item strong{color:var(--heading);letter-spacing:-.03em;justify-self:center;font-size:17px;font-weight:900}.source-stat-separator{background:var(--border);width:2px;height:34px}.audio-pill{right:var(--space-3xl);bottom:var(--space-3xl);z-index:40;align-items:center;gap:var(--space-lg);border:1px solid var(--border-strong);border-radius:var(--radius-pill);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);width:min(360px,100vw - 28px);padding:var(--space-lg);transform-origin:100% 100%;background:#0d0d12eb;transition:opacity .18s,transform .24s cubic-bezier(.22,1,.36,1);display:flex;position:fixed;box-shadow:0 18px 60px #0000006b}.audio-pill.is-visible{opacity:1;pointer-events:auto;transform:translateY(0)scale(1)}.audio-pill.is-hidden{opacity:0;pointer-events:none;transform:translateY(34px)scale(.97)}.audio-control-button{width:calc(var(--audio-button-size) - var(--space-md));min-height:calc(var(--audio-button-size) - var(--space-md));border:1px solid var(--border);background:var(--surface-strong);color:var(--text);padding:var(--space-md);border-radius:50%;flex:none;place-items:center;display:grid}.audio-control-button:hover{border-color:var(--accent-muted);background:var(--accent);color:#f5eef3}.audio-control-button svg{fill:none;stroke:currentColor;width:15px;height:15px}.audio-pill-main{flex:auto;min-width:0;display:grid}.audio-pill input[type=range]{min-height:var(--space-3xl);accent-color:var(--accent);pointer-events:auto;background:0 0;border:0;padding:0}.audio-pill input[type=range]::-webkit-slider-thumb{width:10px;height:10px}.audio-pill input[type=range]::-moz-range-thumb{width:10px;height:10px}.audio-pill input[type=range]:disabled{opacity:.45}.audio-volume{align-items:center;gap:var(--space-md);flex:none;display:flex}.audio-volume input{width:58px}@media (width<=1180px){.primary-controls{grid-template-columns:1fr}.filter-controls{grid-template-columns:repeat(4, minmax(0, 1fr)) var(--control-height)}.advanced-filters{grid-template-columns:repeat(2,minmax(170px,1fr))}.beatmap-field{grid-column:1/-1}.beatmap-row{grid-template-columns:calc(var(--cover-size) + var(--card-overlap)) minmax(0, 1fr)}}@media (width<=1080px){.result-list{grid-template-columns:1fr}.source-card{grid-template-columns:clamp(calc(180px + var(--card-overlap)), calc(30vw + var(--card-overlap)), calc(260px + var(--card-overlap))) minmax(0, 1fr)}.source-card .source-content{grid-template-columns:minmax(0,1fr) 300px}.source-card .stat-strip{width:300px;min-width:300px}.source-card .stat-row-sub{align-items:stretch;gap:calc(var(--space-md) + var(--space-2xs));flex-direction:column}.source-card .stat-row-sub .stat-item{justify-content:start;align-items:baseline;gap:var(--space-xs);text-align:left;grid-template-columns:2ch 3.5ch;min-width:0}.source-card .stat-row-sub .stat-item strong{color:var(--text);letter-spacing:0;justify-self:end;font-size:13px;font-weight:700}.source-stat-separator{display:none}}@media (width<=760px){.app-shell{padding:0 var(--space-2xl) var(--space-5xl)}.audio-pill{right:var(--space-xl);bottom:var(--space-xl);width:min(340px, calc(100vw - var(--space-5xl)));border-radius:var(--radius-xl)}.audio-volume input{width:52px}.control-panel{border-radius:0 0 var(--space-4xl) var(--space-4xl)}.results-panel{border-radius:var(--space-4xl)}.primary-controls,.advanced-filters{grid-template-columns:1fr 1fr}.primary-controls{grid-template-columns:1fr}.filter-controls{grid-template-columns:1fr 1fr}.beatmap-field{grid-column:1/-1}.primary-button,.ghost-button{width:100%}.search-button.primary-button{width:58px}.filter-controls .ghost-button{width:100%}.beatmap-row{grid-template-columns:calc(var(--cover-size-tablet) + var(--card-overlap)) minmax(0, 1fr)}.source-card{grid-template-columns:clamp(calc(160px + var(--card-overlap)), calc(32vw + var(--card-overlap)), calc(240px + var(--card-overlap))) minmax(0, 1fr)}.map-content{gap:var(--space-2xl);grid-template-columns:minmax(0,1fr)}.cover-preview{min-height:var(--cover-size-tablet)}.stat-strip{width:100%;min-width:0}.featured-stat{min-width:calc(var(--button-size) + var(--space-xs))}}@media (width<=680px){.result-list{grid-template-columns:1fr}}@media (width<=480px){.audio-pill{gap:var(--space-lg);padding:var(--space-lg)}.audio-control-button{width:calc(var(--audio-button-size) - var(--space-md));min-height:calc(var(--audio-button-size) - var(--space-md))}.audio-volume{gap:var(--space-md)}.audio-volume input{width:48px}.primary-controls,.advanced-filters,.beatmap-row,.filter-controls{grid-template-columns:1fr}.map-content{margin-top:calc(var(--card-overlap) * -1);border-radius:var(--card-overlap) var(--card-overlap) var(--radius-md) var(--radius-md);padding:calc(var(--radius-md) - 1px) calc(var(--space-xl) - 1px) calc(var(--space-xl) - 1px);margin-left:0}.source-content{margin-top:calc(var(--card-overlap) * -1);border-radius:var(--card-overlap) var(--card-overlap) 0 0;padding:var(--radius-md) var(--space-xl) var(--space-xl);margin-left:0}.beatmap-field{grid-column:auto}.cover-preview{height:calc(var(--cover-size-mobile) + var(--card-overlap))}.map-content{grid-template-columns:1fr}.map-main{min-height:0}.source-card{grid-template-columns:1fr;align-items:flex-start}.source-content{grid-template-columns:1fr}.stat-row{justify-content:space-between}.stat-strip{justify-content:space-between;min-width:0}.stat-row-main{flex:auto}.stat-row-sub{flex:none}}svg.filled-icon{fill:currentColor;stroke:currentColor}
