@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;550;600;650;700&family=Manrope:wght@500;600;650;700;750;800&display=swap');
:root{color-scheme:light;--bg:#f8f9fd;--surface:#fff;--surface-soft:#f1f3fb;--text:#171c36;--muted:#666d83;--border:#e4e7f1;--accent:#526fe8;--accent-soft:#edf0ff;--shadow:0 22px 60px #29365810;--blue:#566ee5;--pink:#bf6d9e;--violet:#8462cf;--sky:#3b8ba9;--header:#f8f9fdd9}
:root[data-theme=dark]{color-scheme:dark;--bg:#0c0e15;--surface:#141720;--surface-soft:#1a1e2b;--text:#f2f3fc;--muted:#a0a6bd;--border:#292e3e;--accent:#9aaaff;--accent-soft:#252a43;--shadow:0 22px 60px #0004;--blue:#a1b0ff;--pink:#e5a2ce;--violet:#c0a6f7;--sky:#85cde7;--header:#0c0e15d9}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:var(--bg);color:var(--text);font-family:'DM Sans',system-ui,sans-serif;font-size:15px;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button,input{font:inherit}button{cursor:pointer}button,a,input{touch-action:manipulation}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid var(--accent);outline-offset:5px}button{color:inherit}h1,h2,h3,p{margin:0}h1,h2,h3,.brand{font-family:Manrope,'DM Sans',sans-serif}p{line-height:1.7}.wrap{width:min(1240px,calc(100% - 96px));margin-inline:auto}.header{display:flex;align-items:center;height:104px;gap:36px}.brand{font-size:29px;font-weight:800;letter-spacing:-1.8px;display:flex;align-items:center}.brand-dot{color:var(--accent)}.brand-mark{display:grid;place-items:center;width:33px;height:33px;border-radius:11px;font-size:24px;letter-spacing:-3px;padding-right:3px;margin-right:10px;color:#fff;background:linear-gradient(135deg,#587aff,#b381df);transform:rotate(-8deg)}nav{display:flex;gap:32px;margin-left:auto;align-items:center;font-size:13px;font-weight:550;color:var(--muted)}nav a:hover,.footer a:hover{color:var(--accent)}.icon-button{width:39px;height:39px;border:1px solid var(--border);border-radius:50%;background:var(--surface);display:grid;place-items:center}.hero{display:grid;grid-template-columns:1.12fr 1fr;align-items:center;min-height:570px;position:relative;gap:40px;padding-block:40px 72px}.hero:before{content:'';position:absolute;inset:-150px -45px -25px 35%;background:radial-gradient(ellipse at 65% 35%,#a6b8ff22,transparent 64%);z-index:-1}.eyebrow{font-size:10px;font-weight:700;letter-spacing:2.1px;color:var(--muted);display:flex;align-items:center;gap:8px}.spark{font-size:22px;color:var(--accent);font-weight:400}.hero h1{font-size:clamp(36px,4.3vw,62px);font-weight:750;line-height:1.16;letter-spacing:-3.2px;margin:23px 0}.gradient-word{background:linear-gradient(110deg,#5179ed 5%,#9b75d9 60%,#d984b9);-webkit-background-clip:text;background-clip:text;color:transparent}.hero-copy>p{color:var(--muted);font-size:16px;line-height:1.8}.hero-actions{display:flex;align-items:center;gap:27px;margin-top:29px}.button{display:inline-flex;align-items:center;justify-content:center;gap:22px;border:1px solid transparent;border-radius:11px;padding:15px 20px;font-size:13px;font-weight:600;transition:transform .2s,box-shadow .2s}.primary{background:#526ee8;color:white;box-shadow:0 6px 16px #526ee826}.primary:hover{background:#4560db;box-shadow:0 6px 24px #526ee840;transform:translateY(-2px)}.text-link{font-size:12px;color:var(--muted);display:flex;gap:13px}.hero-note{font-size:11px;color:var(--muted);display:flex;align-items:center;gap:7px;margin-top:24px}.small-ring{width:6px;height:6px;border-radius:50%;background:#7c8ce1}.hero-art{height:400px;position:relative;isolation:isolate}.orbit{position:absolute;border:1px solid var(--border);border-radius:50%;width:380px;height:380px;left:70px;top:0;transform:rotate(-24deg)}.orbit-two{width:440px;height:295px;top:68px;left:20px}.art-dot{width:9px;height:9px;border-radius:50%;position:absolute;background:#a3b4fc;top:35px;left:137px}.dot-two{top:345px;left:408px;background:#dc9bc7}.mini-window{background:var(--surface);border:1px solid var(--border);border-radius:17px;box-shadow:var(--shadow);position:absolute;overflow:hidden}.music-window{width:270px;top:6px;right:30px;transform:rotate(7deg)}.window-head{display:flex;align-items:center;gap:8px;font-size:11px;font-weight:650;padding:15px}.window-dots{margin-left:auto;color:var(--muted);letter-spacing:2px}.tiny-logo{width:24px;height:24px;border-radius:7px;display:grid;place-items:center;color:var(--accent);font-weight:700;font-size:15px;background:var(--accent-soft)}.tiny-logo.pink{background:#f7e6f0;color:#a55387}.record-art{height:152px;position:relative;overflow:hidden;background:linear-gradient(130deg,#252042,#866192,#e4a5ac)}.vinyl{width:164px;height:164px;position:absolute;top:24px;left:66px;border-radius:50%;background:repeating-radial-gradient(circle,#242436 0,#242436 2px,#313044 3px,#242436 4px);box-shadow:0 10px 40px #13132577;display:grid;place-items:center}.vinyl div{width:52px;height:52px;border-radius:50%;background:linear-gradient(45deg,#a685d3,#e0a4c2);border:18px solid #ba90be}.vinyl:after{position:absolute;content:'';width:6px;height:6px;background:#282138;border-radius:50%}.record-shine{position:absolute;inset:0;background:linear-gradient(115deg,transparent,#f5c2e329 50%,transparent 65%)}.mini-bottom{padding:17px 15px;display:flex;align-items:center;justify-content:space-between}.mini-bottom strong{display:block;font-size:12px}.mini-bottom span:not(.round-arrow){display:block;font-size:9px;margin-top:6px;color:var(--muted)}.round-arrow{display:grid;place-items:center;width:25px;height:25px;background:var(--surface-soft);border-radius:50%}.fitness-window{width:250px;left:0;top:164px;transform:rotate(-7deg);z-index:2}.workout-label{font-size:8px;letter-spacing:1.2px;color:var(--muted);padding:0 17px;margin-top:1px}.fitness-title{display:block;font-size:16px;padding:6px 17px}.bar-chart{display:flex;gap:8px;align-items:flex-end;height:85px;margin:3px 17px 0;border-bottom:1px solid var(--border)}.bar-chart i{height:var(--height);background:linear-gradient(#a2b4ff,#687ef1);flex:1;border-radius:4px 4px 0 0}.bar-chart i:nth-child(-n+3){opacity:.5}.chart-labels{display:flex;justify-content:space-between;padding:11px 17px 17px;font-size:8px;color:var(--muted)}.floating-label{position:absolute;padding:12px 17px;background:var(--surface);border:1px solid var(--border);box-shadow:0 5px 20px #2e3a6810;border-radius:10px;font-size:10px;z-index:3;white-space:nowrap}.floating-label span{margin-right:7px}.label-top{top:27px;left:0;transform:rotate(-5deg)}.label-top span{color:var(--violet);font-size:17px}.label-bottom{right:-8px;bottom:30px;transform:rotate(4deg)}.check-mark{color:var(--accent)}.tools{padding:32px 0 78px;border-top:1px solid var(--border)}.section-top{display:flex;align-items:flex-end;justify-content:space-between;gap:24px}.section-top h2{font-size:30px;font-weight:750;letter-spacing:-1.2px;margin-top:11px}.section-top>p{font-size:12px;color:var(--muted);padding-bottom:5px}.filter-bar{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:32px}.categories{display:flex;gap:5px;flex-wrap:wrap}.filter{background:transparent;border:1px solid transparent;border-radius:9px;padding:10px 15px;font-size:12px;color:var(--muted);white-space:nowrap}.filter.active{background:var(--surface);border-color:var(--border);color:var(--text);box-shadow:0 2px 4px #25355206}.filter:hover{color:var(--accent)}#saved-count{margin-left:5px;font-size:9px;background:var(--surface-soft);border-radius:4px;padding:2px 5px}.search{display:flex;align-items:center;gap:9px;border:1px solid var(--border);background:var(--surface);padding:10px 12px;border-radius:10px;color:var(--muted)}.search input{border:0;background:transparent;color:var(--text);width:150px;outline:none;font-size:12px}.search:focus-within{outline:2px solid var(--accent);outline-offset:2px}.search kbd{border:1px solid var(--border);border-radius:3px;padding:0 4px;font-size:11px}.results-line{display:flex;align-items:center;justify-content:space-between;margin:20px 0 15px;font-size:10px;color:var(--muted);gap:20px}.product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.product-card{background:var(--surface);border:1px solid var(--border);border-radius:17px;overflow:hidden;transition:transform .22s,box-shadow .22s;position:relative;min-width:0}.product-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}.card-art{height:166px;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;background:var(--surface-soft);color:var(--blue)}.card-art.blue{background:linear-gradient(145deg,#e6ecff,#eef1fc);color:#667ee7}.card-art.pink{background:linear-gradient(145deg,#eaddf4,#f9e6ef);color:#bb82b4}.card-art.violet{background:linear-gradient(145deg,#e8e2fa,#f0eafd);color:#9374cd}.card-art.sky{background:linear-gradient(145deg,#e0effb,#edf3fd);color:#6d97c5}[data-theme=dark] .card-art.blue{background:linear-gradient(145deg,#202941,#23243a)}[data-theme=dark] .card-art.pink{background:linear-gradient(145deg,#322238,#31202d)}[data-theme=dark] .card-art.violet{background:linear-gradient(145deg,#29243f,#2c223a)}[data-theme=dark] .card-art.sky{background:linear-gradient(145deg,#1a2c3a,#222d40)}.card-art svg{width:190px;height:125px}.save-button{position:absolute;right:12px;top:12px;width:31px;height:31px;background:var(--surface);border:1px solid var(--border);border-radius:50%;display:grid;place-items:center;color:var(--muted);z-index:2}.save-button[aria-pressed=true]{color:var(--accent)}.card-content{padding:20px}.card-category{font-size:9px;letter-spacing:1.6px;text-transform:uppercase;color:var(--muted);margin-bottom:8px}.card-title{display:flex;justify-content:space-between;align-items:center;gap:5px;margin-bottom:9px}.card-title h3{font-size:19px;letter-spacing:-.7px}.status{font-size:8px;color:var(--muted);background:var(--surface-soft);padding:4px 6px;border-radius:5px}.card-description{color:var(--muted);font-size:12px;line-height:1.75;min-height:82px}.card-action{display:flex;justify-content:space-between;border-top:1px solid var(--border);padding-top:15px;margin-top:15px;font-size:11px;font-weight:600;color:var(--accent)}.card-action:hover{text-decoration:underline}.empty-state{text-align:center;padding:50px 20px;background:var(--surface);border:1px dashed var(--border);border-radius:16px}.empty-state[hidden]{display:none}.empty-state>span{font-size:36px;color:var(--accent)}.empty-state h3{margin:12px}.empty-state p{font-size:13px;color:var(--muted);margin-bottom:20px}.secondary{background:var(--accent-soft);color:var(--accent);border-color:var(--border)}.approach{display:grid;grid-template-columns:1fr 1fr;gap:130px;padding:64px 0 70px;border-top:1px solid var(--border)}.approach h2{font-size:40px;letter-spacing:-1.6px;line-height:1.2;margin:18px 0}.approach-heading>p{font-size:13px;color:var(--muted);max-width:340px}.principles{display:flex;flex-direction:column;gap:24px}.principles article{display:flex;gap:19px}.principle-number{font-size:10px;color:var(--accent);padding-top:4px}.principles h3{font-size:14px;margin-bottom:5px}.principles p{font-size:12px;color:var(--muted)}.footer{border-top:1px solid var(--border);display:flex;align-items:center;gap:25px;padding-block:30px 35px}.footer>.brand{font-size:24px}.footer>span{font-size:10px;color:var(--muted)}.footer>div{margin-left:auto;display:flex;flex-wrap:wrap;align-items:center;gap:22px;font-size:10px;color:var(--muted)}.skip-link{position:fixed;top:-80px;left:20px;z-index:10;padding:14px;background:var(--surface);border:2px solid var(--accent);border-radius:8px}.skip-link:focus{top:12px}.toast{position:fixed;bottom:20px;left:50%;transform:translate(-50%,20px);padding:13px 20px;background:var(--text);color:var(--bg);font-size:12px;border-radius:10px;opacity:0;transition:opacity .2s,transform .2s;pointer-events:none;z-index:20}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(min-width:1500px){.hero{min-height:630px}.hero h1{font-size:64px}}
@media(max-width:1100px){.wrap{width:calc(100% - 64px)}.hero{gap:20px}.hero h1{font-size:46px}.hero-art{transform:scale(.86);transform-origin:right center;margin-left:-50px}.product-grid{grid-template-columns:repeat(2,1fr)}.card-description{min-height:42px}.approach{gap:70px}.card-art{height:190px}}
@media(max-width:760px){.wrap{width:calc(100% - 40px)}.header{height:80px;gap:15px}nav{gap:18px}nav a{font-size:11px}nav a:last-child{display:none}.brand{font-size:26px}.brand-mark{width:28px;height:28px;font-size:20px}.hero{grid-template-columns:1fr;padding-block:35px 25px;gap:15px}.hero h1{font-size:clamp(37px,8vw,52px);letter-spacing:-2px;margin:20px 0}.hero-copy>p{font-size:14px}.hero-art{height:345px;width:390px;max-width:100%;margin:0 auto;transform:scale(.85);transform-origin:top center;margin-bottom:-35px}.hero-actions{gap:20px}.hero-note{font-size:10px}.section-top{align-items:flex-start;flex-direction:column;gap:12px}.section-top h2{font-size:27px}.filter-bar{flex-direction:column;align-items:stretch;gap:15px;margin-top:20px}.categories{gap:0}.filter{padding:9px 12px}.search input{flex:1;width:auto}.search{padding:13px}.results-line{align-items:flex-start}.preview-note{max-width:150px;text-align:right;line-height:1.5}.product-grid{gap:13px}.card-art{height:145px}.card-art svg{width:155px}.card-content{padding:15px}.card-title{flex-wrap:wrap}.card-title h3{font-size:18px}.card-description{font-size:11px;min-height:96px}.card-action{font-size:10px}.tools{padding-bottom:40px}.approach{grid-template-columns:1fr;gap:35px;padding-block:40px}.approach h2{font-size:34px}.approach-heading>p{max-width:100%}.footer{flex-wrap:wrap;gap:14px}.footer>div{width:100%;margin-left:0}.orbit{left:20px;width:340px;height:340px}.orbit-two{left:-20px;width:390px}.label-bottom{right:-5px;bottom:0}.music-window{right:-8px}.fitness-window{left:-10px;top:160px}.label-top{left:-10px;top:13px}.dot-two{left:355px;top:320px}}
@media(max-width:380px){.product-grid{grid-template-columns:1fr}.card-description{min-height:0}.card-art{height:170px}.hero-art{transform:scale(.72);margin-bottom:-85px}.hero-actions{gap:12px}.text-link{font-size:10px}nav{gap:12px}.brand-mark{display:none}}
.skip-link:not(:focus){clip-path:inset(100%)}
.hero:before{right:0}.hero-art{overflow:clip}
@media(max-width:760px){.hero{grid-template-columns:minmax(0,1fr)}.hero:before{inset:0}.hero-copy,.hero-art{min-width:0}.hero-art{overflow-clip-margin:15px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}

@media(max-width:600px){.hero-art{height:410px}}

.footer>div>a{display:inline-flex;align-items:center;min-width:44px;min-height:44px;padding:8px 4px;font-size:12px}