/* All themes share the catalog layout and controls. */
:root{--surface:#172635;--bg:#101a26;--text:#eef2f7;--muted:#b3bfca;--accent:#9ec9f5;--surface-opacity:78%;--ui-radius:24px}body[data-ui]{--muted:#b3bfca;--card-glass:color-mix(in srgb,var(--surface) var(--surface-opacity),transparent);--bg-glass:var(--card-glass);--border-glass:color-mix(in srgb,var(--accent) 23%,transparent);background:var(--bg);color:var(--text)}
body[data-ui] .bg-text{display:block;color:var(--accent);font-family:'Manrope',sans-serif;font-size:42vw;letter-spacing:-.09em;filter:none;opacity:.045;animation:rcc-drift 24s ease-in-out infinite;z-index:0}
body[data-ui] .bg-text-rocio{display:block;color:var(--accent);font:800 14vw 'Manrope',sans-serif;filter:none;opacity:.035;animation:rcc-orbit 36s ease-in-out infinite;z-index:0}
body[data-ui] .blob{display:block;background:var(--accent);opacity:.10;filter:blur(90px);max-width:75vw;max-height:75vw}
@keyframes rcc-drift{0%,100%{transform:translate(-52%,-50%) rotate(-12deg)}50%{transform:translate(-45%,-42%) rotate(4deg)}}
@keyframes rcc-orbit{0%,100%{transform:translate(-85%,80%) rotate(12deg)}50%{transform:translate(-20%,-160%) rotate(-8deg)}}
body[data-ui] .main{background:transparent}
body[data-ui] :is(.sidebar,header,.card,.catalog-tools,.code-preview,.discord-panel,.modal-box,.language-trigger,.language-panel){background:var(--card-glass);border-color:var(--border-glass);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px)}
body[data-ui] :is(.card,.code-preview,.discord-panel,.modal-box,.catalog-tools){border-radius:var(--ui-radius)}
body[data-ui] .card:hover{background:color-mix(in srgb,var(--surface) 92%,var(--accent));border-color:var(--accent)}
body[data-ui] :is(.games-nav,.appearance-toggle,.card-action,.load-more,.dev-btn.active,.nav-item.active,.chip,.tag,.tag.exec){background:color-mix(in srgb,var(--accent) 12%,var(--surface));color:var(--accent);border-color:var(--border-glass)}
body[data-ui] :is(input,select,.device-toggle,.modal-body pre){background:var(--bg);color:var(--text);border-color:var(--border-glass)}
body[data-ui] :is(.hero h2,.card h3){color:var(--text)}
body[data-ui] :is(.eyebrow,.brand-dot,.code-keyword,.compat-status,.ver,.badge.free){color:var(--accent)}
body[data-ui] :is(.hero p,.compat-note,.stat small,.catalog-heading a,.catalog-free,.code-preview-bar small,.code-preview-foot){color:var(--muted)}
body[data-ui] :is(.btn-primary,.brand-symbol,.discord-panel a){background:var(--accent);color:var(--bg)}
body[data-ui] .code-preview{box-shadow:10px 10px 0 color-mix(in srgb,var(--accent) 8%,transparent)}
body[data-ui] :is(button,a,input,select,summary):focus-visible{outline:2px solid var(--accent);outline-offset:4px}
body[data-ui="android"] .card{border-radius:30px 12px 30px 30px}
body[data-ui="hyper"] .card{box-shadow:0 12px 32px #120c171f}
body[data-ui="nothing"] :is(.eyebrow,.brand h1,.personalization summary small){font-family:monospace;letter-spacing:3px}
body[data-ui="nothing"] :is(.sidebar,header,.card){backdrop-filter:none}
.personalization{position:relative;z-index:1;margin:28px 36px 0;border:1px solid var(--border-glass);border-radius:var(--ui-radius);background:var(--card-glass);scroll-margin-top:90px;overflow:hidden;backdrop-filter:blur(22px)}
.personalization summary{cursor:pointer;list-style:none;padding:24px;display:flex;justify-content:space-between;align-items:center;font:700 19px 'Manrope',sans-serif}
.personalization summary::-webkit-details-marker{display:none}.personalization summary small{display:block;font:700 9px 'DM Sans',sans-serif;letter-spacing:2px;color:var(--accent);margin-bottom:7px}
.personalization[open] summary{border-bottom:1px solid var(--border-glass)}
.personalization-body{padding:24px}.personalization-intro{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-bottom:24px}.personalization h2{font-size:24px;letter-spacing:-.8px}.personalization p{color:var(--muted);font-size:12px;line-height:1.8}
.theme-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.theme-options button{padding:10px;text-align:left;border-radius:18px;border:1px solid var(--border-glass);background:var(--surface);color:var(--text);cursor:pointer}.theme-options button[aria-pressed="true"]{outline:2px solid var(--accent);outline-offset:2px}.theme-art{height:80px;display:grid;place-items:center;font:800 28px 'Manrope',sans-serif;letter-spacing:-2px;border-radius:10px;margin-bottom:12px}.art-ios{background:linear-gradient(130deg,#243c59,#608ba1);color:#e4eff9}.art-android{background:#c1d6a4;color:#34472a;border-radius:26px 7px 26px 26px}.art-hyper{background:linear-gradient(30deg,#855d56,#ddbaad);color:#fff0e7}.art-nothing{background:#353236;color:#f2a69c;font-family:monospace;letter-spacing:4px;background-image:radial-gradient(#f2a69c44 1px,transparent 1px);background-size:5px 5px}.theme-options strong,.theme-options small{display:block}.theme-options small{color:var(--muted);font-size:10px;margin:5px 0 4px}
.appearance-controls{display:flex;flex-wrap:wrap;gap:24px;align-items:center;margin-top:28px}.appearance-controls label{display:grid;gap:8px;font-size:12px;color:var(--text)}.appearance-controls input{accent-color:var(--accent)}.appearance-controls input[type="color"]{width:64px;height:36px;border:1px solid var(--border-glass);border-radius:8px;padding:3px;cursor:pointer}.appearance-controls select,.appearance-controls button{min-height:40px;padding:9px 14px;border:1px solid var(--border-glass);border-radius:10px;background:var(--surface);color:var(--text);font:inherit;font-size:12px}.appearance-controls .motion-control{display:flex;align-items:center;gap:10px}.motion-control input{width:18px;height:18px}.appearance-controls output{font-size:10px;color:var(--muted)}#appearanceStatus{margin-top:18px}
body[data-density="compact"] .grid{gap:10px}body[data-density="compact"] .card{padding:14px}body[data-density="compact"] .card .desc{line-height:1.5}
body.motion-paused :is(.bg-text,.bg-text-rocio,.blob){animation-play-state:paused}
@media(max-width:900px){.personalization{margin-left:22px;margin-right:22px}}
@media(max-width:600px){.personalization summary,.personalization-body{padding:18px}.personalization-intro{grid-template-columns:1fr;gap:10px}.theme-options{grid-template-columns:repeat(2,minmax(0,1fr))}.personalization h2{font-size:21px}.appearance-controls{gap:18px}.theme-art{height:68px}}
@media(prefers-reduced-motion:reduce){body[data-ui] *,body[data-ui] *::before,body[data-ui] *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
