:root{color-scheme:light;--bg: #f5f5f2;--bg-2: #ececea;--surface: #fff;--surface-2: #ececea;--surface-inset: #070518;--border: #0b0920;--border-2: var(--border);--text: #0b0920;--dim: color-mix(in srgb, var(--text) 75%, var(--bg));--faint: color-mix(in srgb, var(--text) 65%, var(--bg));--body-copy: var(--dim);--accent: #3987e5;--accent-2: #3d6fd0;--accent-soft: #e6edf3;--immersive-accent: var(--accent);--immersive-accent-2: var(--accent-2);--cta: var(--text);--cta-hover: var(--accent-2);--cta-ink: #fff;--shadow-ink: #0b0920;--product-bg: #0b0920;--paper: #f5f5f2;--flow-packet: #ffb628;--font-display: "Hanken Grotesk", system-ui, -apple-system, sans-serif;--font-sans: "Hanken Grotesk", system-ui, -apple-system, sans-serif;--font-mono: "JetBrains Mono", ui-monospace, Menlo, monospace}*{box-sizing:border-box}html{background:var(--bg);scroll-behavior:smooth}html,body{margin:0;color:var(--text);font:16px/1.6 var(--font-sans);-webkit-font-smoothing:antialiased}body{border-top:5px solid var(--border);container-type:inline-size}::selection{background:var(--accent-2);color:var(--paper)}a{color:var(--accent-2);text-decoration-thickness:2px;text-underline-offset:4px}a:hover{text-decoration:underline}code{font:.88em var(--font-mono)}button,select{font:inherit}button,a{-webkit-tap-highlight-color:transparent}:focus-visible{outline:3px solid var(--accent-2);outline-offset:5px}[id]{scroll-margin-top:2rem}#app{max-width:88rem;margin:0 auto;padding:0 clamp(1.25rem,4vw,4rem)}.site-nav{position:relative;display:flex;align-items:center;justify-content:space-between;gap:2rem;padding:1.2rem 0;border-bottom:2px solid var(--border)}.brand{display:flex;align-items:center;gap:.65rem;color:var(--text);font-size:1.4rem;font-weight:800;letter-spacing:-.045em;text-decoration:none}.brand:hover{text-decoration:none}.brand img{display:block}.nav-links{display:flex;align-items:center;gap:1.75rem;font:600 .9rem var(--font-sans)}.nav-links a{color:var(--text);text-decoration:none}.nav-links a:hover{text-decoration:underline}.nav-links .nav-install{color:var(--paper);background:var(--text);border:2px solid var(--border);padding:.6rem .9rem;text-decoration:none}.nav-links .nav-install:hover{background:var(--accent-2)}.screen{position:relative;margin:0;padding:clamp(3.5rem,6vw,5rem) 0}.screen+.screen{border-top:2px solid var(--border)}.hero{padding:clamp(3rem,5vw,4.5rem) 0}.hero-grid{display:grid;grid-template-columns:.88fr 1.12fr;gap:3.5rem;align-items:center}.hero-copy,.hero-shot{min-width:0}.hero h1{font:900 clamp(3.5rem,6.1vw,5.5rem)/.97 var(--font-display);letter-spacing:-.065em;margin:0 0 1.75rem}.hero h1 span{display:block;color:var(--accent-2)}.tag{max-width:29rem;color:var(--body-copy);font-size:clamp(1.1rem,1.4vw,1.25rem);line-height:1.55;margin:0 0 2rem}.cta-row{display:flex;align-items:center;flex-wrap:wrap;gap:1rem 1.5rem}.btn{display:inline-flex;justify-content:center;align-items:center;gap:.5rem;min-height:50px;padding:.75rem 1.25rem;border:2px solid var(--border);border-radius:0;font-weight:700;cursor:pointer;box-shadow:4px 4px 0 var(--shadow-ink);text-decoration:none;transition:transform .12s,box-shadow .12s}.btn:hover{text-decoration:none;transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--shadow-ink)}.btn:active{transform:translate(4px,4px);box-shadow:none}.btn-primary{background:var(--cta);color:var(--cta-ink)}.btn-primary:hover{background:var(--cta-hover)}.spotify-link{color:var(--text);font-weight:700}.availability{margin:1.5rem 0 0;color:var(--body-copy);font-size:.875rem}.availability strong{color:var(--text)}.availability span{display:inline-block}h2{font:800 clamp(2.5rem,4.1vw,3.8rem)/1.02 var(--font-display);letter-spacing:-.05em;margin:0 0 1.5rem;text-wrap:balance}h2 span{color:var(--accent-2)}h3{font-size:1.15rem;font-weight:800;line-height:1.3;letter-spacing:-.02em;margin:0 0 .65rem}.feature-grid{display:grid;grid-template-columns:.75fr 1.25fr;gap:clamp(2rem,5vw,5rem);align-items:center}.feature-grid.reverse{grid-template-columns:1.25fr .75fr}.feature-grid.reverse .feature-copy{order:2}.feature-copy,.feature-visual{min-width:0}.feature-copy h2{font-size:clamp(2.4rem,3.6vw,3.2rem)}.feature-copy>p{color:var(--body-copy)}.feature-copy>p:last-child{margin-bottom:0}.feature-deck,.lead{font-size:1.2rem;line-height:1.6;margin:0 0 1.5rem}.feature-pair{display:grid;grid-template-columns:.9fr 1.1fr;column-gap:clamp(2.5rem,5vw,4.5rem);row-gap:2rem;padding-block:clamp(3.5rem,6vw,5rem)}.feature-pair>.screen{display:grid;grid-row:span 2;grid-template-rows:subgrid;align-items:start;padding:0;border:0}.paired-copy{margin-bottom:0}.paired-copy h2{font-size:clamp(2.4rem,3.6vw,3.2rem)}.paired-copy .feature-deck{color:var(--body-copy);font-size:1.1rem;margin-bottom:0}.feature-pair .product-shot{box-shadow:4px 4px 0 var(--shadow-ink)}.taste-visual{min-width:0}.history-intro{max-width:45rem;margin:0 0 2rem}.history-intro .feature-deck{color:var(--body-copy)}.history-visual{width:82%;max-width:57rem;margin-left:auto}.radio-feature{padding:clamp(1.5rem,4vw,3.5rem);background:var(--product-bg);color:var(--paper)}.radio-copy{max-width:60rem;margin-bottom:2.5rem}.radio-copy h2{font-size:clamp(2.6rem,5vw,4.6rem)}.radio-copy .feature-deck{max-width:46rem;margin-bottom:0;color:color-mix(in srgb,var(--paper) 80%,var(--product-bg))}.radio-visual{max-width:60.25rem;margin-inline:auto}.radio-visual .product-shot{border:0;box-shadow:none}.product-shot{min-width:0;margin:0;background:var(--product-bg);border:2px solid var(--border);box-shadow:6px 6px 0 var(--shadow-ink)}.shot-image{display:block;background:var(--product-bg)}.shot-image img{display:block;width:100%;height:auto}.hero-shot .product-shot{box-shadow:10px 10px 0 var(--shadow-ink)}.algorithm-section{padding-bottom:3rem}.import-section{display:flex;align-items:center;gap:1.25rem;padding:1.5rem 0;border-block:2px solid var(--border)}.spotify-mark{flex-shrink:0;width:36px;height:36px}.import-copy{display:flex;flex-wrap:wrap;align-items:baseline;gap:.4rem 1.5rem;min-width:0}.import-section h2{margin:0;font-size:clamp(1.5rem,2vw,1.8rem);letter-spacing:-.035em}.import-copy>p{color:var(--body-copy);margin:0;font-size:1rem}.local-section{display:grid;grid-template-columns:.85fr 1.15fr;align-items:center;gap:3rem;padding-block:3rem}.local-section h2{margin-bottom:1rem;font-size:clamp(1.8rem,2.5vw,2.3rem)}.local-copy{min-width:0}.local-copy p{margin:0 0 1rem;color:var(--body-copy)}.text-links{display:flex;flex-wrap:wrap;gap:1rem 1.75rem;font:600 .9rem/1.5 var(--font-sans)}.lead{color:var(--body-copy);max-width:45rem}@font-face{font-family:Install Marker;src:url(/fonts/east-sea-dokdo-numbers.ttf) format("truetype");font-style:normal;font-weight:400;font-display:swap}@font-face{font-family:Install Hand;src:url(/fonts/la-belle-aurore-note.woff2) format("woff2");font-style:normal;font-weight:400;font-display:swap}.install{--bg: #171329;--text: var(--paper);--body-copy: #d0cdd8;--surface-2: #2b253f;--border: #61586f;--border-2: var(--border);--accent-2: var(--flow-packet);--cta: var(--paper);--cta-ink: #171329;--cta-hover: #ffcf68;color-scheme:dark;isolation:isolate;width:100cqw;margin-inline:calc(50% - 50cqw);padding:4.5rem clamp(1.25rem,4vw,4rem) 3rem;overflow:clip;scroll-margin-top:0;color:var(--text);background:var(--bg)}.screen.install{border-top:0}.install-content{position:relative;isolation:isolate;max-width:80rem;margin-inline:auto}.install-art{position:absolute;z-index:-1;left:-7.5rem;bottom:-.5rem;width:53rem;max-width:none;height:auto;pointer-events:none}.install a:not(.btn){color:var(--accent-2)}.install ::selection{background:var(--accent-2);color:var(--bg)}.install-intro{margin:0 0 4rem}.install-intro p{max-width:40rem;margin:1rem 0 0;color:var(--body-copy);font-size:1.05rem}.install h2{margin:0;font-size:3.25rem;line-height:1.05;letter-spacing:-.05em}.install h2>span{color:var(--accent-2)}.install .btn{min-height:54px;padding:.85rem 1.5rem;border:2px solid var(--cta);border-radius:0;font-size:1.05rem;box-shadow:4px 4px 0 var(--bg),6px 6px 0 var(--accent-2)}.install .btn:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--bg),8px 8px 0 var(--accent-2)}.install .btn:active{transform:translate(3px,3px);box-shadow:none}.install .btn>svg{width:20px;height:20px;margin-left:.7rem}.install :focus-visible{outline-color:var(--accent-2)}.steps{position:relative;display:grid;grid-template-columns:5fr 1fr 6fr;grid-template-rows:minmax(32rem,auto) auto;align-items:start;list-style:none;padding:0;margin:0}.steps>li{position:relative;min-width:0;padding-left:5.75rem}.step-number{position:absolute;display:block;top:-1.45rem;left:0;color:var(--accent-2);font:400 6.5rem/1 Install Marker,cursive;transform:rotate(-7deg);pointer-events:none}.step-number:before{content:"";position:absolute;z-index:-1;top:50%;left:50%;width:.94em;height:1em;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath d='M83 19C65 5 36 8 19 27C3 45 9 75 29 88C49 101 79 90 89 71C101 47 89 19 67 12C45 5 22 17 13 38' fill='none' stroke='%23e4e1e9' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;transform:translate(-50%,-50%) rotate(8deg)}.app-step>.step-number:before{transform:translate(-50%,-50%) rotate(-18deg) scaleX(1.04)}.rock-step>.step-number:before{transform:translate(-50%,-50%) rotate(24deg) scaleY(.96)}.steps .step-heading{max-width:15ch;margin:0 0 1.2rem;font:800 clamp(2rem,3vw,2.7rem)/1.04 var(--font-display);letter-spacing:-.045em;text-wrap:balance}.step-details{min-width:0}.steps p{margin:0 0 1rem;color:var(--body-copy)}.steps>.extension-step{grid-column:1}.extension-setup>p:first-child{max-width:29ch;font-size:1.1rem;line-height:1.5}.extension-action{display:flex;align-items:center}.steps .browser-note{margin:1.2rem 0 0;font-size:.8rem}.steps>.app-step{grid-column:3;margin-top:9rem}.app-step>.step-heading{max-width:none}.steps>.rock-step{grid-column:1 / -1;justify-self:end;width:43%;min-height:23rem;margin-top:8rem;padding-top:3rem}.rock-step>.step-number{top:1.6rem}.rock-step>.step-heading{position:relative;width:fit-content;max-width:none;margin:0;font-size:clamp(4.5rem,7vw,6rem);font-weight:900;font-style:italic;white-space:nowrap;transform:rotate(-7deg)}.rock-step>.step-heading:after{content:"";position:absolute;bottom:-1rem;left:.2rem;right:0;height:.6rem;background:var(--accent-2);clip-path:polygon(0 40%,100% 0,91% 43%,5% 100%)}.rock-asterisk,.note-asterisk{width:1.2rem;height:1.2rem;transform:rotate(11deg)}.rock-asterisk{margin:.08em 0 0 .18em;vertical-align:top}.note-asterisk{margin-right:.2em;vertical-align:-.12em}.steps .rock-note{width:fit-content;margin:3.2rem 0 0 .8rem;color:var(--paper);font:400 1.65rem/1.4 Install Hand,cursive;white-space:nowrap;transform:rotate(-5deg)}.method-tabs{display:flex;flex-wrap:wrap;width:fit-content;max-width:100%;gap:.2rem;padding:0;margin:0 0 1.1rem;border:0;border-radius:0;background:transparent}.method-tab{min-height:44px;padding:.65rem .75rem;border:0;border-radius:0;color:var(--body-copy);background:transparent;font:600 .85rem var(--font-sans);cursor:pointer;transition:background-color .12s,color .12s}.method-tab:hover{background:var(--surface-2);color:var(--text)}.method-tab.on{background:transparent;color:var(--text);box-shadow:inset 0 -3px 0 var(--accent-2)}.method-panel{display:flex;flex-direction:column;align-items:flex-start;gap:.3rem}.mac-download{display:flex;align-items:flex-end;flex-wrap:wrap;gap:1rem 1.5rem;max-width:100%}.mac-download>.btn{min-height:50px;padding-block:.5rem}.mac-download .btn:disabled{cursor:default;opacity:.55;transform:none}.mac-processor,.container-engine{display:flex;flex-direction:column;gap:.5rem;max-width:100%;color:var(--body-copy);font:600 .85rem/1.5 var(--font-sans)}.mac-processor select,.container-engine select{-webkit-appearance:none;-moz-appearance:none;appearance:none;height:50px;width:100%;min-width:0;max-width:100%;padding:.75rem 2.5rem .75rem .9rem;border:1px solid var(--border-2);border-radius:4px;background-color:var(--bg);background-image:linear-gradient(45deg,transparent 50%,var(--accent-2) 50%),linear-gradient(135deg,var(--accent-2) 50%,transparent 50%);background-position:calc(100% - 19px) 22px,calc(100% - 13px) 22px;background-size:6px 6px;background-repeat:no-repeat;color:var(--text);font:.85rem/1.4 var(--font-sans)}.mac-processor select:focus,.container-engine select:focus{outline:none;border-color:var(--accent-2)}.container-engine{width:fit-content;margin-bottom:1rem}.container-updates{margin-top:1.5rem;scroll-margin-top:6rem}.container-updates summary{cursor:pointer;font-weight:700}.container-updates[open] summary{margin-bottom:.75rem}.steps .method-note{max-width:62ch;margin:.85rem 0 0;color:var(--body-copy);font-size:.8rem;line-height:1.65}.steps .method-note code{overflow-wrap:anywhere}.terminal{position:relative;min-width:0;border:1px solid var(--border);border-radius:0;background:var(--product-bg);overflow:hidden}.copy-status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.term-copy{position:absolute;top:.4rem;right:.4rem;display:grid;place-items:center;width:40px;height:40px;padding:0;border:0;border-radius:3px;color:var(--body-copy);background:transparent;cursor:pointer}.term-copy svg{display:block;width:20px;height:20px}.term-copy:hover{background:var(--surface-2);color:var(--text)}.term-copy:focus-visible{outline-offset:-3px}.term-body{min-width:0;padding:1.1rem 3.2rem 1.1rem 1.1rem;margin:0;overflow-x:auto;white-space:pre-wrap;overflow-wrap:anywhere;color:var(--text);font:.8125rem/1.85 var(--font-mono)}.term-body code{font:inherit}footer{position:relative;isolation:isolate;display:flex;justify-content:space-between;flex-wrap:wrap;gap:1rem;color:#bdb8c9;padding:2rem 0;font:.85rem/1.6 var(--font-sans)}footer:before{content:"";position:absolute;top:-1px;right:0;bottom:0;left:0;z-index:-1;background:#171329;box-shadow:0 0 0 100vmax #171329;clip-path:inset(0 -100vmax)}.footer-links{display:flex;flex-wrap:wrap;gap:1.25rem}footer a{color:var(--paper)}footer a:hover{color:var(--flow-packet)}footer :focus-visible{outline-color:var(--flow-packet)}.policy{max-width:52rem;margin:auto;padding:3rem 0 4rem;color:var(--body-copy)}.policy .back{display:inline-block;margin-bottom:2rem;font-size:.85rem}.policy h1{color:var(--text);font:800 clamp(2.5rem,6vw,5rem)/1 var(--font-display);letter-spacing:-.055em;margin:0 0 1rem}.policy .updated{color:var(--body-copy);font:.75rem var(--font-mono);margin:0 0 2.5rem}.policy h2{color:var(--text);font-size:1.5rem;letter-spacing:-.025em;text-transform:none;margin:2.5rem 0 .75rem}.policy ul{padding-left:1.2rem}.policy li{margin:.5rem 0}.policy code{overflow-wrap:anywhere;background:var(--surface);border:1px solid var(--border);padding:.05rem .35rem}.policy .foot{margin-top:2.5rem;padding-top:1.2rem;border-top:1px solid var(--border)}@media(max-width:1050px){.local-section{grid-template-columns:1fr;gap:1.5rem}.local-copy{max-width:42rem}.install-art{left:-7rem;width:38rem}.steps{grid-template-columns:1fr 1.2fr;column-gap:2rem}.steps>.app-step{grid-column:2}.steps>li{padding-left:4.25rem}.step-number{font-size:5rem;top:-.8rem}.steps .step-heading{font-size:2rem}.steps>.rock-step{width:43%}.rock-step>.step-heading{font-size:4rem}}@media(max-width:900px){.install-content{max-width:42rem}.install-art{width:32rem;left:-4rem;bottom:7.5rem}.install-intro{margin-bottom:3rem}.steps{display:block}.steps>.extension-step{max-width:30rem}.steps>.app-step{margin-top:5rem}.steps>.rock-step{width:fit-content;min-height:33rem;margin:5rem 0 0 auto;padding:28rem 1rem 0 4.25rem}.rock-step>.step-number{top:27rem}.hero-grid{grid-template-columns:1fr;gap:2.5rem}.hero-copy{max-width:42rem}.hero h1{font-size:clamp(3.5rem,8vw,5rem)}.hero h1 span{white-space:nowrap}.tag{max-width:34rem}.hero-shot{width:100%}.feature-grid,.feature-grid.reverse{grid-template-columns:1fr;gap:2rem}.feature-grid.reverse .feature-copy{order:0}.feature-copy{max-width:40rem}.feature-pair{grid-template-columns:1fr;gap:3.5rem}.feature-pair>.screen{display:block}.paired-copy{margin-bottom:2rem}.history-visual{width:100%}}@media(max-width:760px){.site-nav{flex-wrap:wrap;gap:1rem;padding:1rem 0}.brand{font-size:1.1rem}.brand img{width:28px;height:28px}.nav-links{width:100%;gap:.75rem;font-size:.85rem}.nav-links .nav-install{position:absolute;top:.9rem;right:0;padding:.4rem .6rem;font-size:.75rem}}@media(max-width:620px){body{border-top-width:4px}.screen{padding:3.5rem 0}.radio-feature{padding:1.5rem}.install{padding:3rem 1.25rem 2rem}.install-art{width:27rem;left:-6rem;bottom:7.5rem}.install-intro{margin:0 0 3rem}.install h2{font-size:clamp(2rem,10.2vw,2.5rem)}.hero{padding:2.5rem 0 3rem}.hero h1{font-size:clamp(2.85rem,12.7vw,4.6rem)}.hero h1 span{white-space:normal}.btn{padding:.65rem 1rem;font-size:.9rem}.spotify-link{font-size:.9rem}.availability{font-size:.8rem}.product-shot,.hero-shot .product-shot{box-shadow:5px 5px 0 var(--shadow-ink)}.algorithm-section{padding-bottom:3rem}.import-section{align-items:flex-start;gap:1rem;padding-block:1.25rem}.spotify-mark{width:28px;height:28px}.feature-deck{font-size:1.05rem}.steps>li{padding-left:3.75rem}.step-number{top:-.65rem;font-size:4.5rem}.steps .step-heading{max-width:15ch;font-size:1.8rem}.extension-step>.step-heading{max-width:12ch}.steps p{font-size:.9rem}.steps>.app-step{margin-top:4rem}.app-step>.install-setup{width:calc(100% + 3.75rem);margin:1.5rem 0 0 -3.75rem}.steps>.rock-step{min-height:30rem;margin-top:4rem;padding-top:25rem}.rock-step>.step-number{top:24.5rem}.rock-step>.step-heading{font-size:clamp(2.75rem,10vw,3.5rem)}.steps .rock-note{font-size:clamp(1.25rem,6.77vw,1.65rem)}.install .method-tabs{width:100%}.install .method-tab{padding-inline:.4rem}.term-body{font-size:.75rem;padding:.8rem 3.2rem .8rem .8rem}.method-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.method-tab{padding:.6rem .75rem}}@media(max-width:360px){.install-art{width:24rem;left:-6.5rem}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*:not(.packet),*:before,*:after{animation:none!important;transition:none!important}}
