/* MUSIC FOLDER — tokens | исходник: 3400..3458 */

@property --c1 { syntax:'<color>'; inherits:true; initial-value:#7c5cff; }
@property --c2 { syntax:'<color>'; inherits:true; initial-value:#22d3ee; }
:root{
--c1:#7c5cff; --c2:#22d3ee;
--bg:#05060f;
--text:#f2f0fa;
--muted:#9b96ad;
--line:rgba(150,175,255,.12);
--glass:rgba(13,17,32,.55);
--fd:'Unbounded',system-ui,sans-serif;
--fb:'Manrope',system-ui,sans-serif;
--fm:'JetBrains Mono',ui-monospace,monospace;
transition:--c1 1.6s ease,--c2 1.6s ease;
}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
[hidden]{display:none!important}
html{scroll-behavior:smooth;overflow-x:hidden}
body{
font-family:var(--fb);background:var(--bg);color:var(--text);
line-height:1.6;overflow-x:hidden;min-height:100vh;min-height:100dvh;
}
:focus-visible{outline:2px solid var(--c2);outline-offset:2px;border-radius:4px}
::selection{background:color-mix(in srgb,var(--c1) 45%,transparent)}
::-webkit-scrollbar{width:10px}
::-webkit-scrollbar-track{background:#0a0b16}
::-webkit-scrollbar-thumb{background:#272a3f;border-radius:99px}
::-webkit-scrollbar-thumb:hover{background:#3a3e5c}
.wr-card::-webkit-scrollbar,.ios-card::-webkit-scrollbar,.pl-card::-webkit-scrollbar{width:5px}
.wr-card::-webkit-scrollbar-thumb,.ios-card::-webkit-scrollbar-thumb,.pl-card::-webkit-scrollbar-thumb{background:rgba(255,255,255,.18)}
/* ═══ фон ═══ */
#fx{position:fixed;inset:0;z-index:1;pointer-events:none;width:100%;height:100%}
.blob{position:fixed;border-radius:50%;filter:blur(120px);pointer-events:none;z-index:0}
.b1{width:56vw;height:56vw;top:-18vw;left:-14vw;background:var(--c1);opacity:.20;animation:drift1 28s ease-in-out infinite alternate}
.b2{width:48vw;height:48vw;bottom:-16vw;right:-12vw;background:var(--c2);opacity:.16;animation:drift2 34s ease-in-out infinite alternate}
.b3{width:30vw;height:30vw;bottom:-8vw;left:30vw;background:var(--c1);opacity:.10;animation:drift1 40s ease-in-out infinite alternate-reverse}
@keyframes drift1{from{transform:translate(0,0) scale(1)}to{transform:translate(9vw,7vh) scale(1.25)}}
@keyframes drift2{from{transform:translate(0,0) scale(1.15)}to{transform:translate(-8vw,-6vh) scale(.95)}}
.grain{position:fixed;inset:0;z-index:60;pointer-events:none;opacity:.035;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.container{width:min(1140px,92%);margin:0 auto;position:relative;z-index:2;min-width:0}
section{scroll-margin-top:90px}
.mono{font-family:var(--fm)}

/* ── Квадратные скобки для оверлайнов (HUD-стиль) ── */
.overline{display:inline-flex;align-items:center;gap:10px;text-transform:uppercase;letter-spacing:.22em;font-size:11.5px;font-weight:800;color:var(--c2);font-family:var(--fm);}
.overline::before{content:"[";opacity:.6;}
.overline::after{content:"]";opacity:.6;}
/* ═══ nav ═══ */
.nav{position:fixed;top:0;left:0;right:0;z-index:50;
background:rgba(6,7,16,.55);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
border-bottom:1px solid var(--line);padding-top:env(safe-area-inset-top)}
.nav-in{display:flex;align-items:center;gap:16px;padding:14px 0}
.logo{font-family:var(--fd);font-weight:900;font-size:17px;letter-spacing:.03em;color:var(--text);text-decoration:none;white-space:nowrap}
.logo span{background:linear-gradient(90deg,var(--c1),var(--c2));-webkit-background-clip:text;background-clip:text;color:transparent}
.links{display:flex;gap:14px;margin-left:10px;flex-wrap:nowrap}
.links a{color:var(--muted);text-decoration:none;font-weight:700;font-size:12.5px;transition:color .2s;white-space:nowrap}
.links a:hover{color:var(--text)}
.nav-r{margin-left:auto;display:flex;align-items:center;gap:14px}
.clock{font-weight:700;font-size:13px;color:var(--muted);font-variant-numeric:tabular-nums}