:root{color-scheme:dark;--bg:#101210;--paper:#e7e5db;--muted:#93978f;--line:#30352e;--amber:#d7ba76;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-synthesis:none}*{box-sizing:border-box}html{scroll-behavior:auto;scroll-padding-top:85px}body{margin:0;background:var(--bg);color:var(--paper)}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--amber);outline-offset:6px}img{display:block;max-width:100%;height:auto}figure,p,h1,h2{margin:0}::selection{background:#d7ba76;color:#101210}.skip{position:fixed;top:-100px;left:20px;z-index:20;padding:15px;background:var(--paper);color:var(--bg)}.skip:focus{top:10px}
.navigation{height:80px;padding:0 5%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);position:relative;z-index:5}.brand{display:flex;align-items:center;gap:12px;font-size:17px;letter-spacing:.07em;font-weight:600}.brand img{border-radius:7px}.brand-slash{color:#596054;font-weight:300}.runa{font-size:12px;letter-spacing:.2em;font-weight:400;color:var(--muted)}.nav-links{display:flex;gap:32px;font-size:14px;color:#bcc0b6}.nav-purchase{font-size:14px;border-bottom:1px solid #697060;padding:12px 0}.nav-purchase span{margin-left:22px}.nav-links a:hover,.text-link:hover,footer a:hover{color:var(--amber)}
.hero{min-height:690px;height:min(850px,calc(100svh - 80px));position:relative;padding:72px 5% 90px;display:grid;grid-template-columns:43% 57%;isolation:isolate;overflow:hidden}.hero-copy{position:relative;z-index:2}.eyebrow{font-size:12px;text-transform:uppercase;letter-spacing:.16em;line-height:1.5;color:var(--muted)}.hero .eyebrow{display:flex;gap:14px;align-items:center}.four-marks{display:flex;gap:3px}.four-marks i{width:6px;height:13px;background:#ee5946}.four-marks i:nth-child(2){background:#59b9dc}.four-marks i:nth-child(3){background:#8abd7a}.four-marks i:nth-child(4){background:#dbbb70}h1{width:clamp(235px,30vw,430px);margin:35px 0 24px}h1 svg{width:100%;overflow:visible;fill:none;stroke:var(--paper);stroke-width:1;stroke-linejoin:bevel}.hero-line{font-size:clamp(30px,3.25vw,50px);font-weight:350;letter-spacing:-.035em;line-height:1.12}.hero-description{color:var(--muted);font-size:17px;line-height:1.55;margin-top:21px}.actions{display:flex;gap:24px;align-items:center;margin-top:30px}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:24px;min-height:48px;padding:14px 20px;font-size:14px;border:1px solid var(--line)}.primary{color:var(--bg);background:var(--paper);border-color:var(--paper)}.primary:hover{background:var(--amber);border-color:var(--amber)}.text-link{font-size:14px;line-height:1.5;padding:12px 0;display:inline-block}/* The original intro artwork, kept separate from the editorial layout. */
.hero-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:0;opacity:.5;pointer-events:none;mask-image:linear-gradient(90deg,transparent 15%,#0008 45%,#000 100%)}
.loop-object{position:absolute;left:43%;right:0;top:4%;bottom:11%;z-index:1;pointer-events:none}
.object-caption{position:absolute;bottom:0;left:15%;right:15%;display:flex;justify-content:space-between;align-items:center;font-size:10px;letter-spacing:.16em;color:#8a9180}.object-caption span:last-child{font-size:27px;color:var(--amber)}
.hero-foot{position:absolute;bottom:0;left:5%;right:5%;height:63px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;font-size:12px;color:var(--muted)}.hero-foot>a{font-size:24px;padding:10px}.loop-controls{display:flex;gap:18px}.loop-controls button{font-size:12px;background:none;border:0;padding:12px 0;color:var(--muted)}.loop-controls button[aria-pressed=true]{color:var(--amber)}
.section{margin:0 5%;padding:95px 0;border-bottom:1px solid var(--line)}h2{font-size:clamp(38px,4.4vw,66px);font-weight:350;line-height:1.06;letter-spacing:-.045em}h2 em{font-style:normal;color:#969d89}.section-copy{font-size:16px;line-height:1.7;color:var(--muted);max-width:350px}.section-heading{display:grid;grid-template-columns:1fr 2.2fr 1.15fr;gap:32px;align-items:start}.section-heading .section-copy{align-self:end}.instrument-stage{position:relative;margin-top:56px;padding:0 14% 25px 4%}.device{border:1px solid #424a3b;border-radius:12px;overflow:hidden;box-shadow:0 25px 65px #0005;background:#0a0d0b}.instrument-stage .pad{transform:rotate(-2deg)}.instrument-stage .phone{position:absolute;width:22%;max-width:230px;right:3%;bottom:0;transform:rotate(5deg);border:6px solid #1b2019;border-radius:22px}.image-note{display:block;margin:26px 0 0;font-size:12px;letter-spacing:.06em;color:var(--muted)}
.track-intro{display:flex;align-items:start;justify-content:space-between;margin-bottom:36px}.track-intro>p:last-child{font-size:26px;line-height:1.3;letter-spacing:-.025em;width:38%}.track-row{--track:#ee5946;display:grid;grid-template-columns:55px 1.1fr 1.7fr 1fr 20px;gap:25px;align-items:center;width:100%;text-align:left;min-height:92px;border:0;border-top:1px solid var(--line);background:transparent;padding:12px 4px;opacity:.6;transition:opacity .2s,color .2s}.track-row:nth-child(2){--track:#59b9dc}.track-row:nth-child(3){--track:#8abd7a}.track-row:nth-child(4){--track:#dbbb70}.track-row:last-child{border-bottom:1px solid var(--line)}.track-row:hover,.track-row.active{opacity:1}.track-number{font-size:13px;color:var(--track)}.track-row strong{font-size:clamp(24px,3vw,43px);font-weight:350;letter-spacing:-.035em}.track-rail{height:1px;position:relative;background:color-mix(in srgb,var(--track),transparent 65%)}.track-rail:before{content:"";position:absolute;inset:-8px 0;background:repeating-linear-gradient(90deg,transparent 0,transparent calc(6.25% - 1px),var(--track) calc(6.25% - 1px),var(--track) 6.25%);opacity:.18}.track-rail i{width:8px;height:8px;border-radius:50%;position:absolute;left:20%;top:-4px;background:var(--track)}.track-row:nth-child(2) i{left:57%}.track-row:nth-child(3) i{left:74%}.track-row:nth-child(4) i{left:38%}.track-detail{font-size:13px;color:var(--muted)}.track-row.active strong{color:var(--track)}.track-preview{margin:35px auto 0;max-width:900px}.track-preview img{border:1px solid #353c31;border-radius:8px;width:100%}.track-preview p{font-size:12px;color:var(--muted);line-height:1.6;margin-top:15px;min-height:38px}
.movement{display:grid;grid-template-columns:1fr 1.4fr;column-gap:7%;align-items:center}.movement .eyebrow{margin-bottom:28px}.movement .section-copy{margin-top:25px}.movement .text-link{margin-top:16px}.movement-image{transform:rotate(2deg)}.step-score{grid-column:1/-1;display:flex;gap:8px;margin-top:55px;align-items:end;height:40px}.step-score i{flex:1;height:20%;border:1px solid #6b805d;background:#77996513}.step-score i:nth-child(3n){height:70%;background:#77996535}.step-score i:nth-child(5n){height:100%}.step-score i:nth-child(4n+1){height:45%}
.tolf{display:grid;grid-template-columns:1.25fr 1fr;gap:30px 12%;--tolf:#a1b8c1}.tolf .eyebrow{color:var(--tolf)}.tolf h2{font-size:clamp(65px,8vw,120px);margin:24px 0;display:flex;justify-content:space-between;align-items:center}.tolf h2 span{font-size:.62em;font-weight:200;color:#698c99}.tolf-line{font-size:clamp(26px,3vw,40px);line-height:1.15;letter-spacing:-.03em}.tolf-copy{align-self:end;font-size:16px;line-height:1.7;color:var(--muted)}.tolf-price{color:var(--paper);font-size:29px;margin:22px 0 0}.tolf-price span{display:block;color:var(--muted);font-size:13px}.tolf-screen{grid-column:1/-1;margin-top:12px;border-color:#3c5055}.tolf-note{grid-column:1/-1;font-size:12px;color:var(--muted);margin-top:-12px}.finish h2{font-size:clamp(50px,7.5vw,110px);margin:36px 0 50px}.finish-bottom{display:flex;justify-content:space-between;gap:36px}.finish-name{font-size:22px;font-weight:400;letter-spacing:.08em}.finish-bottom p{font-size:14px;color:var(--muted);margin-top:14px}.finish-bottom .price{font-size:26px;color:var(--paper)}.price span{font-size:13px;margin-left:10px}.finish-bottom .fine{font-size:12px}.finish-actions{display:flex;flex-direction:column;align-items:start;gap:9px}.release-note{font-size:13px;color:var(--muted);margin-bottom:6px}.connections{margin-top:45px;padding-top:24px;border-top:1px solid var(--line);font-size:14px;color:var(--muted)}.connections summary{cursor:pointer;display:flex;justify-content:space-between;list-style:none;padding:8px 0}.connections summary::-webkit-details-marker{display:none}.connections[open] summary span{transform:rotate(45deg)}.connections>div{max-width:750px;line-height:1.7;padding:20px 0 0}.connections p{margin-bottom:15px}.connections a{color:var(--paper)}footer{padding:32px 5%;display:flex;justify-content:space-between;gap:25px;align-items:center;font-size:12px;color:var(--muted)}footer>div{display:flex;gap:18px}footer .brand{color:var(--paper);font-size:14px}
@media(min-width:1600px){.navigation,.hero,main,footer{max-width:1600px;margin-left:auto;margin-right:auto}.hero{height:820px}}
@media(max-width:1000px){.hero{min-height:650px;padding-top:62px}.hero .actions{gap:12px;flex-wrap:wrap}.section-heading{grid-template-columns:1fr 2fr}.section-heading .section-copy{grid-column:2}.section{padding:70px 0}.track-row{grid-template-columns:35px 1fr 1fr 1fr 20px;gap:15px}.movement{gap:4%}.movement h2{font-size:40px}footer>span{display:none}.nav-links{gap:20px}}
@media(max-width:700px){.navigation{height:65px}.nav-links a:first-child{display:none}.brand-slash{display:none}.brand{flex-wrap:wrap;column-gap:12px;row-gap:2px}.brand .runa{flex-basis:100%;padding-left:44px;font-size:9px;letter-spacing:.18em}.nav-purchase{font-size:12px}.nav-purchase span{margin-left:8px}.nav-links{gap:17px;font-size:13px}.hero{height:auto;min-height:790px;padding:42px 6% 72px;display:flex;flex-direction:column}.hero .eyebrow{font-size:10px}h1{width:240px;margin:28px 0 22px}.hero-line{font-size:36px}.hero-description{font-size:15px;line-height:1.5}.desktop-break{display:none}.actions{margin-top:22px}.hero .text-link{font-size:12px}.button{font-size:13px;padding:13px 16px;gap:16px}.loop-object{position:relative;left:auto;right:auto;top:auto;bottom:auto;height:300px;width:116%;margin:-12px -8% -12px}.object-caption{left:17%;right:17%;bottom:8px;font-size:9px}.hero-foot{left:6%;right:6%;height:52px}.hero-foot>span{display:none}.loop-controls button{font-size:11px;min-height:44px}.section{margin:0 6%;padding:55px 0}.section-heading{display:block}.section-heading .eyebrow{margin-bottom:25px}h2{font-size:42px}.section-copy{margin-top:22px;max-width:100%;font-size:15px}.instrument-stage{margin-top:32px;padding:0 13% 30px 0}.instrument-stage .phone{width:27%;border-width:3px;border-radius:10px;right:-1%;bottom:26px}.device{border-radius:7px}.image-note{font-size:10px;margin-top:24px}.track-intro{gap:24px;margin-bottom:25px}.track-intro>p:last-child{font-size:20px;width:auto}.track-row{grid-template-columns:25px 1.3fr 1fr 15px;gap:12px;min-height:80px}.track-row strong{font-size:28px}.track-detail{display:none}.track-number{font-size:11px}.track-preview{max-width:340px}.track-preview img{aspect-ratio:900/1951;object-fit:contain}.track-preview p{font-size:11px}.movement{display:block;overflow:hidden}.movement h2{font-size:42px}.movement .text-link{margin-top:8px}.movement-image{margin:32px 2% 0;transform:rotate(2deg)}.step-score{margin-top:32px;height:30px;gap:5px}.tolf{display:block}.tolf h2{font-size:80px;margin:22px 0}.tolf-line{font-size:32px}.tolf-copy{margin:25px 0 30px;font-size:15px}.tolf-price{margin-top:16px;display:flex;align-items:baseline;gap:18px}.tolf-price span{font-size:12px}.tolf-screen{max-width:340px;margin:0 auto 22px}.tolf-screen img{aspect-ratio:900/1951;object-fit:contain}.tolf-note{font-size:11px;line-height:1.6;margin:0}.finish h2{font-size:53px;margin:28px 0 35px}.finish-bottom{display:block}.finish-bottom .price span{display:block;margin:8px 0 0;line-height:1.5}.finish-actions{margin-top:30px}.finish-bottom .fine{line-height:1.6}.connections{margin-top:28px}footer{padding:26px 6%;align-items:start}footer>div{justify-content:end;flex-wrap:wrap;max-width:245px;gap:15px}footer .brand{font-size:13px}.eyebrow{font-size:11px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}

.finish{position:relative;isolation:isolate}.finish h2{position:relative}.navigation .brand img{width:40px;height:40px}
@media(max-width:700px){.navigation .brand img{width:32px;height:32px}.hero-canvas{top:400px;height:320px;opacity:.28;mask-image:linear-gradient(0deg,transparent,#000 30%,#000 70%,transparent)}.loop-object{margin-top:0;height:300px}.finish>.eyebrow{padding-right:80px}}


/* Signal is the sole animated hero. App artwork stays a quiet, static layer. */
.hero .hero-canvas{inset:2% 5% 8%;width:90%;height:90%;opacity:.85;visibility:visible;mask-image:linear-gradient(0deg,transparent,#000 12%,#000 88%,transparent)}
.instrument{position:relative;isolation:isolate}
.movement{position:relative;isolation:isolate}
@media(max-width:700px){.hero .hero-canvas{inset:0 5% 10%;height:90%}}


/* ---- Rune stave: a carved tick rule under each section, and the RÚNA row ---- */
.section{position:relative}
.section::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:6px;pointer-events:none;opacity:.55;background:repeating-linear-gradient(90deg,var(--line) 0 1px,transparent 1px 34px)}
.section .eyebrow::before{color:var(--amber);opacity:.62;font-size:1.25em;letter-spacing:0;margin-right:.85em;vertical-align:-.08em}
#instrument>.section-heading .eyebrow::before{content:"ᚱ"}
#tracks .track-intro .eyebrow::before{content:"ᚢ"}
#movement .eyebrow::before{content:"ᚾ"}
#tolf .eyebrow::before{content:"ᚨ"}
#store>.eyebrow::before{content:"ᛉ"}

/* ---- TÓLF: Jera, the twelfth rune, exactly as the app draws it ---- */
.jera{display:inline-flex;align-items:center;justify-content:center;width:.72em;height:.72em}
.jera svg{width:100%;height:100%;overflow:visible;fill:none;stroke:#698c99;stroke-width:2.8;stroke-linecap:square;stroke-linejoin:miter}
.tolf h2 .jera{color:#698c99}

/* ---- Huginn: the grain bird ---- */
.grain-bird{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:-1}

/* ---- Jötunheim: the mushroom field along the foot of the page ---- */
.mushroom-field{position:absolute;left:0;right:0;bottom:0;width:100%;height:265px;pointer-events:none;z-index:-1;mask-image:linear-gradient(0deg,#000 48%,#000a 78%,transparent)}
@media(max-width:1000px){.mushroom-field{height:200px}}
@media(max-width:700px){.mushroom-field{height:150px}.section::after{background:repeating-linear-gradient(90deg,var(--line) 0 1px,transparent 1px 26px)}}

/* A restrained night sky, shared by the instrument's existing visual language. */
body{isolation:isolate;background:#0d100f}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 83% 18%,#46575d17,transparent 48%),radial-gradient(ellipse at 12% 73%,#63523112,transparent 48%),radial-gradient(circle at 19% 22%,#c5ac7440 0 1px,transparent 1.5px),radial-gradient(circle at 77% 63%,#a6c0c833 0 1px,transparent 1.5px);background-size:auto,auto,313px 367px,457px 419px}
#grain-sky{position:fixed;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none;opacity:0;transition:opacity 1s ease}
.sky-ready #grain-sky{opacity:1}
.navigation{background:#0d100f55}
.hero .hero-canvas{mix-blend-mode:screen;opacity:.9}
.hero-copy{max-width:100%}
h1 svg{filter:drop-shadow(0 0 12px #dbc48618)}
.section{border-bottom-color:#42483980}

/* ---- Video manual: a local poster, YouTube only loads after a press ---- */
#video .eyebrow::before{content:"ᚲ"}
.video-heading{display:grid;grid-template-columns:1fr 2.2fr 1.15fr;gap:32px;align-items:start}.video-heading .section-copy{align-self:end}
.video-frame{position:relative;margin-top:56px;aspect-ratio:16/9}.video-frame iframe,.video-play{position:absolute;inset:0;width:100%;height:100%;border:0}
.video-play{padding:0;background:#0a0d0b}.video-play img{width:100%;height:100%;object-fit:cover;opacity:.9;transition:opacity .2s}.video-play:hover img{opacity:1}
.video-play-icon{position:absolute;left:50%;top:50%;width:84px;height:84px;margin:-42px 0 0 -42px;border-radius:50%;background:#101210cc;border:1px solid var(--amber);transition:background .2s}.video-play-icon:before{content:"";position:absolute;left:34px;top:27px;border-style:solid;border-width:15px 0 15px 24px;border-color:transparent transparent transparent var(--paper)}
.video-play:hover .video-play-icon{background:var(--amber)}.video-play:hover .video-play-icon:before{border-left-color:var(--bg)}
.video-note{margin-top:18px;font-size:12px;color:var(--muted)}.video-note a{color:var(--paper);margin-left:8px}.video-note a:hover{color:var(--amber)}
@media(max-width:1000px){.video-heading{grid-template-columns:1fr 2fr}.video-heading .section-copy{grid-column:2}}
@media(max-width:700px){.video-heading{display:block}.video-heading .eyebrow{margin-bottom:25px}.video-frame{margin-top:32px}.video-play-icon{width:62px;height:62px;margin:-31px 0 0 -31px}.video-play-icon:before{left:25px;top:20px;border-width:11px 0 11px 18px}.video-note{font-size:11px;line-height:1.6}}