@font-face{font-family:Manrope;src:url('./assets/manrope-latin.woff2') format('woff2');font-style:normal;font-weight:200 800;font-display:swap}
@font-face{font-family:Gloock;src:url('./assets/gloock-latin-400-normal.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:"DM Serif Display";src:url('./assets/dm-serif-display-latin-400-normal.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:"DM Sans";src:url('./assets/dm-sans-latin-wght-normal.woff2') format('woff2');font-style:normal;font-weight:100 1000;font-display:swap}
@font-face{font-family:Inter;src:url('./assets/inter-latin-wght-normal.woff2') format('woff2');font-style:normal;font-weight:100 900;font-display:swap}
:root{--paper:#f0f0ea;--ink:#252722;--muted:#80837a;--accent:#0cb6ab;--font:Manrope,Arial,sans-serif}
:root {
  --landing-heading-font: Gloock, Georgia, serif;
  --landing-ui-font: Manrope, Arial, sans-serif;
  --landing-cta-body-font: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --landing-cta-small-font: "DM Sans", Arial, sans-serif;
}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;overscroll-behavior:none}body{font-family:var(--font);color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;border:0;background:none;padding:0;cursor:pointer;text-align:left}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:7px;border-radius:3px}button[hidden],[hidden]{display:none!important}.experience{position:relative;width:100%;height:100%;height:100dvh;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 48% 38%,#fafaf5 0%,#f1f1eb 55%,#e7e8e0 100%)}#space,#nodes{position:absolute;inset:0;width:100%;height:100%}#space{touch-action:none}#nodes{pointer-events:none;perspective:1200px}.masthead{position:absolute;z-index:20;top:max(32px,env(safe-area-inset-top));left:42px;right:42px;display:flex;align-items:center;justify-content:space-between;pointer-events:none}.masthead>*{pointer-events:auto}.brand{display:flex;align-items:center;gap:11px;font-weight:750;font-size:20px;letter-spacing:-1.1px}.brand img{width:28px;height:28px;object-fit:contain}.brand-dot{color:var(--accent)}.masthead-note{position:absolute;left:50%;transform:translateX(-50%);font-size:11px;letter-spacing:.02em;color:#73776d}.icon-button{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:#e5e7de88}.icon-button svg{width:20px;height:20px;stroke:currentColor;stroke-width:1.2}.icon-button:hover{background:#dce1d5}.hud{position:absolute;z-index:20;bottom:max(30px,env(safe-area-inset-bottom));left:42px;right:42px;display:flex;align-items:center;justify-content:space-between;font-size:10px;pointer-events:none}.hud button{pointer-events:auto}.location{display:flex;gap:17px;align-items:center;letter-spacing:.01em}.location>span:first-child{color:var(--accent);font-size:11px;font-weight:700;font-variant-numeric:tabular-nums}.location>span:last-child{color:#62675c}.navigation-instructions{position:absolute;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:10px;color:#70756b;white-space:nowrap}.instruction-mark{font-size:19px;color:var(--accent)}.hud-right{display:flex;align-items:center;gap:22px}.draft-label{font-size:9px;letter-spacing:.13em;color:#969a90}.help-button{width:24px;height:24px;border-radius:50%;border:1px solid #c7ccc0;color:#72786a;font-size:11px;text-align:center}.eyebrow{font-size:9px;letter-spacing:.16em;font-weight:650;color:#85897f;margin:0 0 30px}.galaxy-intro{position:absolute;left:8.5%;bottom:17%;max-width:350px;pointer-events:auto}.galaxy-intro h1{font-size:clamp(30px,3.2vw,48px);font-weight:500;letter-spacing:-.065em;line-height:1.12;margin:0 0 28px}.text-button{display:inline-flex;align-items:center;gap:20px;font-size:11px;font-weight:550;line-height:1.5}.text-button>span{font-size:19px;color:var(--accent)}.text-button:hover{color:#078c83}.node{position:absolute;left:0;top:0;width:min(840px,calc(100vw - 220px));height:460px;transform-origin:50% 50%;will-change:transform,opacity;pointer-events:none;visibility:hidden}.node-copy{position:absolute;left:0;top:80px;width:550px;max-width:72%;transform-origin:0 0}.node .eyebrow{margin-bottom:25px}.node-title{font-size:clamp(48px,6.7vw,92px);font-weight:450;line-height:1.04;letter-spacing:-.075em;margin:0;text-wrap:balance;white-space:pre-line}.node[data-column=A] .node-title,.node[data-column=C] .node-title{font-size:clamp(40px,5.4vw,74px);max-width:690px;line-height:1.12;letter-spacing:-.06em}.node[data-column=A] .node-copy,.node[data-column=C] .node-copy{max-width:88%;width:720px;top:105px}.node[data-column=C] .node-title{font-weight:450}.node-entry .node-copy{top:25px;max-width:94%;width:790px}.entry-question{font-size:clamp(24px,2.8vw,37px);color:#757a70;letter-spacing:-.045em;line-height:1.32;margin:0 0 21px;white-space:pre-line}.node-entry .node-title{font-size:clamp(62px,7.8vw,112px);line-height:1.03;max-width:750px;letter-spacing:-.078em}.node-entry .node-title .quiet{color:#777d71}.entry-underline{display:inline-block;position:relative}.entry-underline:after{content:'';position:absolute;left:2px;right:0;bottom:-10px;height:3px;background:var(--accent);transform:rotate(-1deg);opacity:.65}.node-demo{position:absolute;left:430px;top:225px;width:680px;transform-origin:0 0;pointer-events:auto;cursor:zoom-in;will-change:transform}.node-demo:focus-visible{outline-offset:14px}.demo-shell{width:680px;position:relative;min-height:300px;transform-origin:50% 50%;text-align:left}.demo-caption{font-size:18px;margin:28px 0 0;color:#84897d;letter-spacing:-.03em}.demo-invitation{position:absolute;left:430px;top:422px;display:flex;align-items:center;gap:10px;font-size:10px;color:#6e7568;white-space:nowrap;pointer-events:auto;cursor:zoom-in}.demo-invitation span:first-child{color:var(--accent);font-size:17px}.nutsy-panel{position:relative;background:#fffefa;border-radius:8px;padding:28px 35px;box-shadow:0 3px 5px #28321c03,0 17px 34px -14px #34412b19,0 52px 75px -37px #34412b28;min-height:285px}.panel-grip{color:#bdc1b6;letter-spacing:3px;line-height:10px;font-size:13px;margin:0 0 25px}.panel-title{font-size:20px;font-weight:650;letter-spacing:-.05em;margin:0 0 22px}.note-item{font-size:17px;letter-spacing:-.025em;line-height:43px;min-height:43px;position:relative;padding-left:19px;white-space:nowrap}.note-item:before{content:'';position:absolute;left:1px;top:20px;width:4px;height:4px;border-radius:50%;background:#767f6d}.note-item:first-child{color:#6b7560}.typing-caret{display:inline-block;width:2px;height:20px;background:var(--accent);vertical-align:-3px;margin-left:2px}.demo-writing{padding-left:85px;padding-right:65px}.demo-writing .nutsy-panel{transform:rotate(-3deg)}.demo-dragging{padding-left:70px;padding-right:70px}.demo-dragging .nutsy-panel{transform:rotate(2deg)}.drag-list{position:relative}.drag-target{z-index:2;position:relative}.drag-placeholder{position:absolute;left:0;right:0;top:0;height:40px;border:1px dashed #0cb6ab77;border-radius:4px;background:#0cb6ab06;opacity:0}.virtual-cursor{position:absolute;z-index:9;width:23px;height:30px;top:172px;left:350px;filter:drop-shadow(0 3px 3px #0002);pointer-events:none}.virtual-cursor svg{width:100%;height:100%;fill:var(--ink);stroke:#fff;stroke-width:1.3}.cursor-label{position:absolute;top:29px;left:15px;padding:4px 9px;border-radius:4px;background:var(--accent);font-size:11px;color:#fff;font-weight:600;white-space:nowrap}.demo-structure{display:flex;gap:22px}.demo-structure .nutsy-panel{width:329px;padding:24px;min-height:330px}.demo-structure .note-item{font-size:15px;padding-left:13px;line-height:42px;min-height:42px}.demo-structure .panel-title{font-size:19px}.structure-item{position:absolute;top:241px;left:24px;width:279px;padding:0 13px;height:42px;line-height:42px;background:#fffefa;font-size:15px;border-radius:4px;z-index:3;box-shadow:0 0 0 transparent}.structure-item:before{content:'·';margin-right:9px}.structure-slot{height:42px;border-radius:4px;background:#0cb6ab09;outline:1px dashed #0cb6ab55;margin-top:0;opacity:0}.group-label{font-size:13px;letter-spacing:.08em;margin:0 0 15px;color:#777f6d}.spatial-board{display:flex;gap:22px;transform-origin:25% 45%;width:820px;position:relative}.spatial-column{width:258px;flex:none}.spatial-column .nutsy-panel{padding:20px 21px;min-height:160px;margin-bottom:19px}.spatial-column .panel-grip{margin-bottom:18px}.spatial-column .panel-title{font-size:18px;margin-bottom:14px}.spatial-column .note-item{font-size:14px;line-height:30px;min-height:30px;padding-left:12px}.spatial-column .note-item:before{top:14px;width:3px;height:3px}.demo-spatial{width:820px;min-height:370px}.node-cta{display:inline-flex;align-items:center;gap:35px;background:var(--ink);color:white;border-radius:4px;padding:17px 23px;font-size:12px;margin-top:31px;pointer-events:auto}.node-cta span{color:var(--accent);font-size:20px}.neighbor{position:absolute;z-index:5;pointer-events:auto;max-width:170px;will-change:transform,opacity}.neighbor-label{display:block;text-transform:uppercase;letter-spacing:.13em;color:#959b8e;font-size:8px;margin-bottom:13px}.neighbor-title{display:block;font-size:24px;letter-spacing:-.055em;line-height:1.22;color:#888f80;text-wrap:balance}.neighbor-arrow{display:block;color:#818b76;font-size:19px;margin-top:18px}.neighbor-left{left:-52px;top:40%;width:185px}.neighbor-right{right:-52px;top:40%;width:185px}.neighbor-up{top:116px;left:50%;transform:translateX(-50%);max-width:300px;display:flex;align-items:center;gap:13px}.neighbor-up .neighbor-label{margin:0}.neighbor-up .neighbor-arrow{margin:0;font-size:15px}.neighbor-down{bottom:104px;left:50%;transform:translateX(-50%);width:290px;max-width:290px;display:grid;grid-template-columns:1fr 25px;align-items:center;gap:0 20px}.neighbor-down .neighbor-label{grid-column:1;margin-bottom:8px}.neighbor-down .neighbor-title{grid-column:1;font-size:17px;color:#7f8775}.neighbor-down .neighbor-arrow{grid-column:2;grid-row:1/3;margin:0;color:var(--accent)}.experience[data-mode=entry] .neighbor-down{left:calc(50% - 420px);transform:none}.intent{position:fixed;z-index:30;pointer-events:none;width:30px;height:30px;margin:-15px 0 0 -15px;border:1px solid #0cb6ab77;border-radius:50%;opacity:0;display:grid;place-items:center}.intent span{height:4px;width:4px;background:var(--accent);border-radius:50%}.leave-demo{position:absolute;left:calc(50% - 420px);top:126px;z-index:7;color:#747d6a}.demo-controls{position:absolute;left:50%;transform:translateX(-50%);bottom:111px;display:flex;align-items:center;gap:26px;z-index:8;white-space:nowrap}.demo-controls .text-button{font-size:10px;gap:8px}.demo-status{font-size:10px;color:#777f6e;display:flex;align-items:center;gap:8px}.demo-status i{width:5px;height:5px;background:var(--accent);border-radius:50%}.sr-only{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}dialog{width:min(440px,calc(100vw - 40px));padding:44px;background:#fafaf5;border:none;border-radius:8px;color:var(--ink);box-shadow:0 30px 100px #25301b22}dialog::backdrop{background:#e6e8dfb8;backdrop-filter:blur(9px)}dialog h2{font-size:32px;letter-spacing:-.06em;line-height:1.14;font-weight:500;margin:0 0 22px}dialog p,dialog dd{font-size:12px;line-height:1.8;color:#737b69}dialog .eyebrow{font-size:9px;margin-bottom:20px}dialog dl{display:grid;grid-template-columns:100px 1fr;gap:16px 8px;margin:28px 0}dialog dt{font-size:11px;font-weight:650;line-height:1.8}dialog dd{margin:0;font-size:11px}.dialog-close{position:absolute;right:15px;top:15px;font-size:22px;width:30px;height:30px}.no-script{position:fixed;inset:0;padding:20vh 10vw;background:var(--paper);font-size:30px}.experience[data-depth="2"] .node-demo{cursor:default}.experience[data-mode=galaxy] .neighbor{display:none}.experience[data-mode=galaxy] .masthead-note{opacity:.65}
.fallback-symbol{display:none;position:absolute;right:0;top:18px;width:55px;height:55px}.with-fallback-symbol .fallback-symbol{display:block}.node[data-column=B][data-long=true] .node-title{font-size:clamp(42px,5.6vw,76px)}.demo-spatial{height:370px}.node-demo .virtual-cursor{visibility:hidden}.node[data-focus=deep] .virtual-cursor{visibility:visible}.demo-caption{max-width:100%}
@media(min-width:1600px){.node{width:950px}.node-copy{width:620px}.node-demo,.demo-invitation{left:530px}.experience[data-mode=entry] .neighbor-down,.leave-demo{left:calc(50% - 475px)}}
@media(max-width:1100px){.node{width:calc(100vw - 190px)}.node-demo,.demo-invitation{left:50%}.experience[data-mode=entry] .neighbor-down,.leave-demo{left:95px}.node-title{font-size:76px}.node-copy{max-width:77%}.neighbor-title{font-size:21px}.neighbor-left{left:-77px}.neighbor-right{right:-77px}}
@media(max-width:700px){.masthead{top:max(22px,env(safe-area-inset-top));left:24px;right:22px}.brand{font-size:18px;gap:9px}.brand img{width:25px;height:25px}.masthead-note{display:none}.icon-button{width:34px;height:34px}.hud{left:24px;right:24px;bottom:max(24px,env(safe-area-inset-bottom))}.hud-right{gap:14px}.draft-label{font-size:8px}.location{gap:10px;font-size:9px}.navigation-instructions{bottom:41px;font-size:9px;gap:6px;max-width:calc(100vw - 50px)}.instruction-mark{font-size:15px}.galaxy-intro{left:9%;bottom:19%;max-width:260px}.galaxy-intro h1{font-size:37px}.galaxy-intro .eyebrow{font-size:8px;letter-spacing:.09em}.node{width:calc(100vw - 76px);height:460px}.node-copy{top:58px;width:100%;max-width:100%}.node .eyebrow{font-size:8px;letter-spacing:.10em;margin-bottom:22px}.node-title{font-size:clamp(39px,11.5vw,63px);line-height:1.08;letter-spacing:-.065em}.node[data-column=A] .node-copy,.node[data-column=C] .node-copy{max-width:100%;top:95px}.node[data-column=A] .node-title,.node[data-column=C] .node-title{font-size:clamp(33px,9.5vw,55px);line-height:1.17}.node-entry .node-copy{top:55px;max-width:100%}.entry-question{font-size:clamp(20px,5.8vw,28px);line-height:1.4;margin-bottom:26px}.node-entry .node-title{font-size:clamp(51px,14.3vw,76px);line-height:1.09;letter-spacing:-.07em}.node-entry .eyebrow{max-width:220px;font-size:7px;line-height:1.8;margin-bottom:27px}.entry-underline:after{height:2px;bottom:-7px}.node-demo{left:-3px;top:257px}.demo-invitation{left:0;top:430px;font-size:9px}.neighbor-left{left:-125px;top:38%;width:150px}.neighbor-right{right:-125px;top:38%;width:150px}.neighbor-title{font-size:16px}.neighbor-up{top:93px;max-width:220px}.neighbor-up .neighbor-label{font-size:7px}.neighbor-down{bottom:125px;width:220px;max-width:220px}.neighbor-down .neighbor-title{font-size:13px}.neighbor-down .neighbor-label{font-size:7px}.experience[data-mode=entry] .neighbor-down{left:38px;bottom:147px}.leave-demo{left:38px;top:107px;font-size:10px}.demo-controls{bottom:128px;gap:16px}.demo-status{font-size:9px}.demo-controls .text-button{font-size:9px}.node-cta{font-size:11px;padding:14px 18px;margin-top:26px}.intent{display:none}dialog{padding:35px 28px}.demo-caption{font-size:19px}}
@media(max-height:720px) and (min-width:701px){.node{height:380px}.node-copy{top:55px}.node-title{font-size:70px}.node-entry .node-title{font-size:85px}.entry-question{font-size:29px}.node-demo{top:170px}.demo-invitation{top:355px}.neighbor-up{top:90px}.neighbor-down{bottom:76px}.demo-controls{bottom:85px}.leave-demo{top:95px}}
@media(max-height:700px) and (max-width:700px){.node{height:390px}.node-copy{top:45px}.node-title{font-size:40px}.node-entry .node-copy{top:20px}.node-entry .node-title{font-size:50px}.entry-question{font-size:21px}.node-demo{top:205px}.demo-invitation{top:365px}.neighbor-down{bottom:106px}.experience[data-mode=entry] .neighbor-down{bottom:117px}.neighbor-up{top:78px}.demo-controls{bottom:115px}.leave-demo{top:90px}.node[data-column=A] .node-copy,.node[data-column=C] .node-copy{top:65px}}
@media(max-width:700px){.node[data-column=B][data-long=true] .node-title{font-size:clamp(33px,9.8vw,48px)}.demo-writing,.demo-dragging{width:360px;padding:0 12px;min-height:270px}.demo-writing .nutsy-panel,.demo-dragging .nutsy-panel{padding:22px;min-height:270px}.demo-writing .panel-title,.demo-dragging .panel-title{font-size:18px}.demo-writing .note-item,.demo-dragging .note-item{font-size:14px;line-height:36px;min-height:36px;white-space:normal}.demo-writing .note-item:before,.demo-dragging .note-item:before{top:17px}.demo-dragging .virtual-cursor{left:265px;top:153px}.node-demo:has(.demo-writing),.node-demo:has(.demo-dragging){width:360px}.demo-structure .note-item,.demo-structure .structure-item{font-size:19px}.demo-structure .nutsy-panel{padding-left:18px;padding-right:18px}.demo-caption{font-size:15px;margin-top:20px}.node-demo:has(.demo-structure) .demo-caption,.node-demo:has(.demo-spatial) .demo-caption{font-size:23px}.node-entry .node-title{max-width:100%}}
@media(max-height:480px) and (orientation:landscape){.masthead{top:15px}.hud{bottom:14px}.node{height:260px;width:calc(100vw - 200px)}.node-copy{top:25px;max-width:65%}.node-title{font-size:42px}.node .eyebrow{margin-bottom:14px}.node-entry .node-title{font-size:51px}.node-entry .node-copy{top:15px}.entry-question{font-size:21px;margin-bottom:13px}.neighbor-up{top:67px}.neighbor-down{bottom:48px}.neighbor-label{font-size:7px}.node-demo{top:95px;left:55%}.demo-invitation{top:243px;left:55%}.demo-controls{bottom:48px}.leave-demo{top:66px}.node[data-column=A] .node-title,.node[data-column=C] .node-title{font-size:38px}.node[data-column=A] .node-copy,.node[data-column=C] .node-copy{top:28px}.masthead-note{display:none}.navigation-instructions{font-size:8px}.experience[data-mode=entry] .neighbor-down{bottom:48px}}
@media(max-height:700px) and (max-width:700px){.demo-invitation{display:none}}
@media(max-height:480px) and (orientation:landscape){.demo-invitation,.demo-caption{display:none}.node[data-column=B][data-long=true] .node-title{font-size:42px}.node[data-column=C] .node-title,.node[data-column=A] .node-title{font-size:32px}.node-cta{padding:10px 16px;margin-top:18px}.node-entry .node-copy{width:76%;max-width:76%}.demo-controls{bottom:49px}.node-entry .eyebrow{margin-bottom:13px}.leave-demo{font-size:9px;gap:12px}}

/* Draft 02: a compact symbol network around a single, uninterrupted thought. */
.experience {
  background: radial-gradient(ellipse at 48% 40%, #fafaf5 0%, #f1f1eb 64%, #e7e8e0 100%);
}
.masthead { right: auto; }
.brand { font-weight: 750; letter-spacing: -.055em; }
.hud { font-size: 10px; }
.location { gap: 8px; font-variant-numeric: tabular-nums; }
.location > #location-total { color: #a3a89b; font-size: 9px; }
.draft-label { font-size: 9px; letter-spacing: .12em; color: #8a9280; }
.draft-label:hover { color: var(--ink); }
.galaxy-entry {
  position: absolute; left: 50%; top: 50%; width: 138px; height: 138px;
  transform: translate(-50%, -50%); border-radius: 50%;
}
.node {
  width: min(760px, calc(100vw - 330px));
  height: min(430px, calc(100dvh - 260px));
}
.node-copy, .node-entry .node-copy,
.node[data-column=A] .node-copy, .node[data-column=C] .node-copy {
  top: 40px; left: 0; width: 100%; max-width: 100%;
}
.node-title, .node-entry .node-title,
.node[data-column=A] .node-title, .node[data-column=C] .node-title,
.node[data-column=B][data-long=true] .node-title {
  font-size: clamp(45px, 5.1vw, 74px);
  font-weight: 720; line-height: 1.12; letter-spacing: -.05em;
  max-width: 100%; white-space: normal; text-wrap: balance;
}
.node-entry .node-title { font-size: clamp(44px, 4.85vw, 70px); line-height: 1.16; }
.node[data-column=A] .node-copy, .node[data-column=C] .node-copy { top: 62px; }
.node[data-column=A] .node-title, .node[data-column=C] .node-title { font-size: clamp(39px, 4.2vw, 61px); }
.node-demo { left: 0; top: 155px; }
.demo-caption { display: none; }
.nutsy-panel { box-shadow: 0 3px 5px #28321c03, 0 18px 38px -16px #34412b24, 0 54px 76px -36px #34412b32; }
.node-cta { margin-top: 29px; font-size: 12px; font-weight: 550; }
.node-symbol {
  position: absolute; z-index: 9; width: 112px; height: 118px;
  max-width: none; display: flex; flex-direction: column; align-items: center;
  justify-content: center; gap: 9px; padding: 7px; text-align: center;
  color: #30372a; touch-action: none; border-radius: 50%;
}
.neighbor-surface {
  position: relative; display: block; width: 78px; height: 78px;
  flex: none; transform-origin: center; will-change: transform, filter;
}
.neighbor-symbol, .neighbor-symbol svg { display: block; width: 100%; height: 100%; }
.neighbor-shadow {
  position: absolute; width: 42px; height: 5px; left: calc(50% - 21px); top: 87px;
  background: #505946; border-radius: 50%; filter: blur(5px); opacity: .14;
}
.neighbor-label {
  font-size: 9px; line-height: 1; letter-spacing: .015em; color: #535f48;
  text-transform: none; margin: 0; opacity: .65; white-space: nowrap;
}
.neighbor:focus-visible .neighbor-surface { color: #087f76; }
.intent { display: none; }
.leave-demo { left: calc(50% + 340px); top: calc(50% - 195px); width: 32px; height: 32px; opacity: .5; background: none; }
.leave-demo:hover { opacity: 1; }
.leave-demo svg { width: 17px; height: 17px; stroke-width: 1.4; }
.demo-controls { left: calc(50% + 86px); bottom: 37px; gap: 5px; }
.demo-controls .icon-button { width: 32px; height: 32px; background: none; opacity: .45; }
.demo-controls .icon-button:hover { opacity: 1; }
.demo-controls svg { width: 16px; height: 16px; stroke-width: 1.5; fill: none; }
.fallback-symbol { left: 0; right: auto; top: -40px; width: 62px; height: 62px; }
.fallback-symbol svg { width: 100%; height: 100%; }
.galaxy-symbol { position: absolute; display: block; transform: translate(-50%, -50%); pointer-events: none; }
.galaxy-symbol svg { width: 100%; height: 100%; }
@media (max-width: 1100px) and (min-width: 701px) {
  .node { width: min(760px, calc(100vw - 320px)); }
  .node-title, .node[data-column=B][data-long=true] .node-title { font-size: 58px; }
  .leave-demo { left: calc(100% - 168px); }
}
@media (max-width: 700px) {
  .node { width: calc(100vw - 112px); height: min(430px, calc(100dvh - 250px)); }
  .node-copy, .node-entry .node-copy, .node[data-column=A] .node-copy, .node[data-column=C] .node-copy { top: 30px; width: 100%; max-width: 100%; }
  .node-title, .node-entry .node-title, .node[data-column=B][data-long=true] .node-title,
  .node[data-column=A] .node-title, .node[data-column=C] .node-title {
    font-size: clamp(28px, 8.6vw, 45px); line-height: 1.15;
    font-weight: 720; letter-spacing: -.055em;
  }
  .node-entry .node-title { font-size: clamp(28px, 8.6vw, 43px); }
  .node[data-column=A] .node-copy, .node[data-column=C] .node-copy { top: 48px; }
  .node-symbol { width: 58px; height: 82px; padding: 0; gap: 5px; }
  .neighbor-surface { width: 53px; height: 53px; }
  .neighbor-label { font-size: 8px; }
  .neighbor-shadow { width: 26px; left: calc(50% - 13px); top: 64px; height: 3px; }
  .leave-demo { left: calc(100% - 83px); top: calc(50% - 222px); width: 28px; height: 28px; }
  .demo-controls { left: 50%; bottom: 24px; }
  .draft-label { font-size: 8px; }
  .node-cta { padding: 12px 17px; font-size: 10px; margin-top: 22px; gap: 20px; }
  .fallback-symbol { top: -43px; width: 43px; height: 43px; }
  .galaxy-entry { width: 90px; height: 90px; }
}
@media (max-height: 700px) and (min-width: 701px) {
  .node-title, .node-entry .node-title, .node[data-column=B][data-long=true] .node-title,
  .node[data-column=A] .node-title, .node[data-column=C] .node-title { font-size: 50px; }
  .node-copy, .node-entry .node-copy { top: 24px; }
}
@media (max-height: 700px) and (max-width: 700px) {
  .node-copy, .node-entry .node-copy { top: 24px; }
  .node-title, .node-entry .node-title, .node[data-column=B][data-long=true] .node-title,
  .node[data-column=A] .node-title, .node[data-column=C] .node-title { font-size: 28px; }
  .node[data-column=A] .node-copy, .node[data-column=C] .node-copy { top: 37px; }
  .leave-demo { top: 114px; }
}
@media (max-height: 480px) and (orientation: landscape) {
  .node { width: calc(100vw - 236px); height: 238px; }
  .node-copy, .node-entry .node-copy, .node[data-column=A] .node-copy, .node[data-column=C] .node-copy { top: 35px; }
  .node[data-column=B] .node-copy { width: 49%; }
  .node-title, .node-entry .node-title, .node[data-column=B][data-long=true] .node-title,
  .node[data-column=A] .node-title, .node[data-column=C] .node-title { font-size: 30px; }
  .node-symbol { width: 64px; height: 70px; gap: 4px; }
  .neighbor-surface { width: 48px; height: 48px; }
  .neighbor-label { font-size: 8px; }
  .neighbor-shadow { top: 54px; width: 24px; left: calc(50% - 12px); }
  .leave-demo { left: calc(100% - 150px); top: 78px; }
  .demo-controls { bottom: 8px; }
  .node-cta { padding: 8px 14px; margin-top: 12px; }
}

/* Draft 03: permanent symbol bodies move through the network. */
.node-symbol { left: 0; top: 0; pointer-events: none; will-change: transform, opacity; }
.node-symbol[data-role=neighbor] { pointer-events: auto; }
.node-symbol[data-role=center] .neighbor-label { visibility: hidden; }
.experience[data-motion=commit] .node-symbol,
.experience[data-motion=settle] .node-symbol { pointer-events: none; }

/* Draft 04: the same content opens inside a stable local matrix. */
.node { width: var(--content-width); height: var(--content-height); }
.node-symbol[data-role=center] .neighbor-surface { filter: none; }
.node-symbol[data-primary=false] .neighbor-label { visibility: hidden; }

@media (max-width: 700px) {
  .node-symbol[data-slot=topCenter] .neighbor-label,
  .node-symbol[data-slot=bottomCenter] .neighbor-label { visibility: hidden; }
}

@media (max-height: 480px) and (orientation: landscape) {
  .node-symbol .neighbor-label { visibility: hidden; }
}

/* Draft 05 product-demo layer. Values mirror the Nutsy Notes Shared Core
   Soft theme and Comfortable typography preset; the landing world stays above. */
.nn-demo-ui {
  --nn-font: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --nn-text: #242523;
  --nn-muted: #81847e;
  --nn-accent: #0cb6ab;
  --nn-canvas: #f7f7f5;
  --nn-control: #edf1f3;
  --nn-handle-opacity-rest: .16;
  --nn-handle-opacity-active: .7;
  width: 680px;
  min-height: 300px;
  color: var(--nn-text);
  font-family: var(--nn-font);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.8;
  letter-spacing: normal;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
.nn-demo-panel {
  position: relative;
  width: 100%;
  min-height: 196px;
  margin: 0 0 14px;
  padding: 29px 26px 13px;
  border: 0;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 2px 8px #233c4914;
  transform-origin: 50% 50%;
}
.nn-demo-panel.is-drop-parent { background: color-mix(in srgb, var(--nn-accent) 5%, #fff); }
.nn-demo-blocks { display: grid; gap: 12px; padding-inline: 8px; }
.nn-demo-block, .nn-demo-list { position: relative; min-width: 0; }
.nn-demo-block::before {
  position: absolute;
  top: 4px;
  bottom: 4px;
  left: -26px;
  z-index: 2;
  width: 1px;
  background: linear-gradient(to bottom,currentColor 0 5px,transparent 5px 23px,currentColor 23px);
  color: var(--nn-muted);
  opacity: 0;
  pointer-events: none;
  transition: color 100ms ease,opacity 100ms ease;
  content: "";
}
.nn-demo-block::after {
  position: absolute;
  top: 11px;
  left: -29px;
  z-index: 3;
  width: 7px;
  height: 11px;
  background: radial-gradient(circle at 1.5px 1.5px,currentColor 0 1.25px,transparent 1.5px) 0 0/4px 4px repeat;
  color: var(--nn-muted);
  opacity: 0;
  pointer-events: none;
  transition: color 100ms ease,opacity 100ms ease,scale 100ms ease;
  content: "";
}
.nn-demo-block.is-virtual-hovered::before,
.nn-demo-block.is-virtual-hovered::after { opacity: .55; }
.nn-demo-list {
  --item-indent-step: 14px;
  --item-handle-hit-size: 14px;
  --item-handle-marker-gap: 2px;
  --item-marker-track-size: 16px;
  --item-text-marker-gap: 2px;
}
.nn-demo-item {
  --item-size: 16px;
  --item-leading: 1.35;
  --item-weight: 400;
  --item-spacing: 6px;
  position: relative;
  display: grid;
  grid-template-columns: var(--item-marker-track-size) minmax(0, 1fr);
  align-items: start;
  min-height: 22px;
  margin-inline-start: calc(var(--item-level) * var(--item-indent-step));
  margin-block-end: var(--item-spacing);
  background: transparent;
}
.nn-demo-item::before {
  position: absolute;
  inset: 0;
  z-index: 0;
  border-radius: 14px;
  background: transparent;
  content: "";
  pointer-events: none;
  transition: background 100ms ease;
}
.nn-demo-item > * { position: relative; z-index: 1; }
.nn-demo-item.is-demo-hover::before { background: #edf1f3; }
.nn-demo-item.is-demo-pressed::before { background: color-mix(in srgb, var(--nn-accent) 10%, #fbfcfc); }
.nn-demo-item.is-demo-dropped::before {
  background: color-mix(in srgb, var(--nn-muted) 10%, transparent);
}
.nn-demo-item[data-level="0"] {
  --item-marker-track-size: 0px;
  --item-text-marker-gap: 0px;
  --item-size: 18px;
  --item-leading: 1.4;
  --item-weight: 620;
  letter-spacing: -.005em;
}
.nn-demo-item[data-level="2"] { --item-size: 14px; --item-leading: 1.4; }
.nn-demo-item__editor {
  min-width: 0;
  min-height: 1lh;
  padding: 1px 0;
  padding-inline-start: var(--item-text-marker-gap);
  color: color-mix(in srgb, var(--nn-text) 84%, var(--nn-canvas));
  font-family: var(--nn-font);
  font-size: var(--item-size);
  font-weight: var(--item-weight);
  line-height: var(--item-leading);
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.nn-demo-item[data-level="0"] > .nn-demo-item__editor { color: var(--nn-text); }
.nn-demo-marker {
  align-self: start;
  display: grid;
  place-items: center;
  height: calc(1lh + 2px);
  color: var(--nn-text);
  font-family: var(--nn-font);
  font-size: var(--item-size);
  font-weight: var(--item-weight);
  line-height: var(--item-leading);
}
.nn-demo-marker > span { display: block; line-height: 1; translate: 0 -1px; }
.nn-demo-item[data-level="0"] > .nn-demo-marker { visibility: hidden; }
.nn-demo-handle { color: var(--nn-muted); }
.nn-demo-handle--panel {
  position: absolute;
  top: 3px;
  left: 4px;
  z-index: 2;
  width: 22px;
  height: 22px;
  opacity: var(--nn-handle-opacity-rest);
  transition: opacity 100ms ease;
}
.nn-demo-handle--panel::before {
  position: absolute;
  top: 5.5px;
  left: 7.75px;
  width: 2.5px;
  height: 2.5px;
  border-radius: 50%;
  background: currentColor;
  box-shadow: 6px 0 currentColor, 0 5.5px currentColor, 6px 5.5px currentColor,
    0 11px currentColor, 6px 11px currentColor;
  content: "";
}
.nn-demo-handle--block {
  position: absolute;
  top: -2px;
  left: -33px;
  z-index: 3;
  width: 14px;
  height: 28px;
  color: transparent;
  opacity: 0;
}
.nn-demo-panel:hover > .nn-demo-handle--panel { opacity: var(--nn-handle-opacity-active); }
.nn-demo-handle--item {
  position: absolute;
  inset-inline-start: -16px;
  top: 0;
  display: grid;
  place-items: center;
  width: 14px;
  height: calc(1lh + 2px);
  color: var(--nn-muted);
  font-size: var(--item-size);
  line-height: var(--item-leading);
  opacity: var(--nn-handle-opacity-rest);
  transition: color 100ms ease, opacity 100ms ease;
}
.nn-demo-handle--item::before {
  width: 9px;
  height: 4px;
  background: radial-gradient(circle,currentColor 0 1.75px,transparent 2px) 0 50%/4px 4px no-repeat,
    radial-gradient(circle,currentColor 0 1.75px,transparent 2px) 5px 50%/4px 4px no-repeat;
  content: "";
  scale: 1;
  transition: scale 100ms ease;
}
.nn-demo-item:hover > .nn-demo-handle--item,
.nn-demo-item.is-hovered > .nn-demo-handle--item { opacity: var(--nn-handle-opacity-active); }
.nn-demo-handle--item.is-handle-hover,
.nn-demo-handle--item.is-handle-active { color: var(--nn-accent); opacity: var(--nn-handle-opacity-active); }
.nn-demo-handle--item.is-handle-hover::before,
.nn-demo-handle--item.is-handle-active::before { scale: 1.25; }
.nn-demo-handle--item.is-handle-active { cursor: grabbing; }
.nn-demo-placeholder {
  display: none;
  position: relative;
  z-index: 2;
  box-sizing: border-box;
  height: 28px;
  margin-inline-start: calc(var(--placeholder-level) * 14px);
  border: 0;
  border-radius: 2px;
  background: color-mix(in srgb, var(--nn-muted) 10%, transparent);
  box-shadow: inset 0 2px 0 color-mix(in srgb, var(--nn-accent) 72%, transparent);
}
.nn-demo-item-ghost {
  --item-indent-step: 14px;
  --item-handle-hit-size: 14px;
  --item-handle-marker-gap: 2px;
  --item-marker-track-size: 16px;
  --item-text-marker-gap: 2px;
  display: none;
  position: absolute;
  z-index: 6;
  width: calc(100% - 52px);
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  pointer-events: none;
}
.nn-demo-item-ghost::before {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: 22px;
  z-index: 0;
  border-radius: 14px;
  background: color-mix(in srgb, var(--nn-accent) 10%, #fbfcfc);
  content: "";
}
.nn-demo-item-ghost .nn-demo-handle--item { opacity: .35; }
.nn-demo-item-ghost .nn-demo-item { z-index: 1; }
.nn-demo-item.is-drag-source { display: none; }
.nn-demo-cursor {
  position: absolute;
  z-index: 9;
  width: 23px;
  height: 30px;
  pointer-events: none;
  filter: drop-shadow(0 3px 3px #0002);
}
.nn-demo-cursor svg { display: block; width: 100%; height: 100%; fill: var(--nn-text); stroke: #fff; stroke-width: 1.3; }
.nn-demo-caret { display: inline-block; width: 2px; height: 1em; margin-inline-start: 2px; background: var(--nn-accent); vertical-align: -.12em; }
.demo-writing { padding: 0 70px; }
.nn-demo-ui.demo-writing {
  width: 960px;
  min-height: 420px;
  padding: 0;
  overflow: hidden;
}
.nn-demo-writing-stage {
  position: relative;
  width: 100%;
  min-height: 420px;
  overflow: hidden;
}
.nn-demo-writing-panel {
  position: absolute;
  top: 0;
  left: 0;
  min-height: 0;
  margin: 0;
  padding: 29px 26px 20px;
  overflow: hidden;
  will-change: width,height,transform;
}
.nn-demo-writing-panel > .nn-demo-blocks {
  position: relative;
  display: block;
  height: 100%;
  padding-inline: 8px;
}
.nn-demo-writing-state {
  position: absolute;
  top: 0;
  left: 0;
  display: grid;
  width: 100%;
  gap: 12px;
  visibility: hidden;
  opacity: 0;
  will-change: opacity,transform;
}
.nn-demo-content-block--text .nn-demo-list {
  --item-marker-track-size: 0px;
  --item-text-marker-gap: 0px;
}
.nn-demo-content-block--text .nn-demo-item {
  --item-size: 16px;
  --item-leading: 1.8;
  --item-weight: 400;
  --item-spacing: 8px;
  margin-inline-start: 0;
}
.nn-demo-content-block--text .nn-demo-marker { visibility: hidden; }
.nn-demo-content-block--text .nn-demo-item[data-text-style="heading1"] {
  --item-size: 25.6px;
  --item-leading: 1.2;
  --item-weight: 650;
  --item-spacing: 8px;
  letter-spacing: -.015em;
}
.nn-demo-content-block--text .nn-demo-item[data-text-style="heading2"] {
  --item-size: 21.6px;
  --item-leading: 1.25;
  --item-weight: 620;
  --item-spacing: 12px;
  letter-spacing: -.01em;
}
.nn-demo-content-block--text .nn-demo-item[data-text-style="paragraph"] {
  --item-size: 16px;
  --item-leading: 1.8;
  --item-weight: 400;
  --item-spacing: 0px;
  letter-spacing: normal;
}
.nn-demo-content-block--text .nn-demo-item__editor { color: var(--nn-text); }
.nn-demo-image-button {
  display: block;
  width: 100%;
  max-width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: default;
}
.nn-demo-image {
  display: block;
  width: 100%;
  height: auto;
  max-height: 128px;
  object-fit: contain;
  object-position: left top;
}
.nn-demo-writing-state[data-writing-state="reference-image"] .nn-demo-content-block--list .nn-demo-item {
  --item-spacing: 3px;
  --item-size: 14px;
}
.nn-demo-writing-state[data-writing-state="reference-image"] .nn-demo-content-block--text .nn-demo-item[data-text-style="paragraph"] {
  --item-size: 14px;
  --item-leading: 1.55;
}
.nn-demo-writing-state[data-writing-state="reference-image"] .nn-demo-image-button {
  aspect-ratio: 16 / 9;
  height: auto;
  overflow: hidden;
}
.nn-demo-writing-state[data-writing-state="reference-image"] .nn-demo-image {
  height: 100%;
  max-height: none;
  object-fit: cover;
  object-position: center center;
}
.demo-dragging { padding: 0 70px; }
.nn-demo-drag-stage { position: relative; }
.demo-dragging { width: 1040px; padding: 0; }
.nn-demo-script-stage { width: 1040px; min-height: 390px; }
.nn-demo-script-panels { display: flex; align-items: flex-start; gap: 18px; }
.nn-demo-script-panels > .nn-demo-panel { flex: 0 0 334px; min-height: 370px; margin: 0; padding: 29px 26px 13px; }
.nn-demo-script-panels .nn-demo-item { --item-spacing: 3px; min-height: 20px; }
.nn-demo-script-panels .nn-demo-item__editor { --item-size: 14px; }
.nn-demo-script-panels .nn-demo-item[data-level="0"] { --item-size: 16px; }
.nn-demo-script-panels .nn-demo-item[data-level="2"] { --item-size: 12px; }
.nn-demo-script-placeholder { width: 280px; }
.nn-demo-placeholder-handle { position: absolute; top: 2px; left: -16px; width: 14px; height: 20px; }
.nn-demo-panel-placeholder-handle { position: absolute; top: 3px; left: 4px; width: 22px; height: 22px; }
.nn-demo-script-ghost,.nn-demo-panel-ghost { display: none; position: absolute; top: 0; left: 0; z-index: 8; }
.nn-demo-script-ghost { --item-indent-step: 14px; --item-marker-track-size: 16px; --item-text-marker-gap: 2px; padding: 2px 7px; border-radius: 14px; background: color-mix(in srgb,var(--nn-accent) 10%,#fbfcfc); box-shadow: 0 8px 20px #233c4918; }
.nn-demo-script-ghost .nn-demo-item { margin-bottom: 3px; }
.nn-demo-script-ghost .nn-demo-item > .nn-demo-handle--item { position: absolute; }
.nn-demo-script-ghost .nn-demo-item[data-level="0"] { --item-size: 16px; }
.nn-demo-script-ghost .nn-demo-item[data-level="2"] { --item-size: 12px; }
.nn-demo-panel-ghost { width: 334px; }
.nn-demo-panel-ghost .nn-demo-panel { width: 334px; min-height: 370px; margin: 0; background: color-mix(in srgb,var(--nn-accent) 6%,#fff); box-shadow: 0 12px 28px #233c4922; }
.nn-demo-panel-placeholder { display: none; position: relative; flex: 0 0 334px; min-height: 370px; border-radius: 14px; background: color-mix(in srgb,var(--nn-muted) 8%,transparent); box-shadow: inset 0 2px 0 color-mix(in srgb,var(--nn-accent) 72%,transparent); }
.nn-demo-item.is-complete .nn-demo-item__editor { color: var(--nn-text); }
.nn-demo-item.is-complete .nn-demo-marker { color: var(--nn-accent); }
.nn-demo-drag-stage .nn-demo-placeholder { width: calc(100% - 14px); height: 28px; }
.nn-demo-drag-stage .nn-demo-item-ghost { top: 64px; right: 26px; left: 40px; width: auto; }
.nn-demo-drag-stage .nn-demo-cursor { top: 0; left: 0; }
.nn-demo-ui.demo-structure { width: 1040px; min-height: 390px; overflow: hidden; }
.nn-demo-structure-stage { position: relative; width: 1040px; height: 390px; overflow: hidden; }
.nn-demo-structure-columns { display: flex; align-items: stretch; gap: 16px; width: 1040px; height: 390px; }
.nn-demo-structure-stage .nn-demo-structure-column {
  flex: 0 0 auto;
  width: 336px;
  height: 390px;
  padding-top: 34px;
  will-change: width,transform,opacity;
}
.nn-demo-structure-column--new { display: none; width: 0; opacity: 0; overflow: hidden; }
.nn-demo-structure-column .nn-demo-column-header { padding-right: 4px; }
.nn-demo-column-header__identity { display: flex; align-items: center; min-width: 0; }
.nn-demo-column-add {
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  margin-left: auto;
  color: var(--nn-muted);
  font: 400 17px/1 var(--nn-font);
  opacity: .36;
  transition: color 100ms ease,opacity 100ms ease,scale 100ms ease;
}
.nn-demo-column-add.is-active { color: var(--nn-accent); opacity: .9; scale: 1.14; }
.nn-demo-column-scroll { position: relative; height: 356px; overflow: hidden; }
.nn-demo-column-content { min-height: 100%; padding: 0 3px 14px; }
.nn-demo-structure-stage .nn-demo-structure-column .nn-demo-panel {
  width: 100%;
  min-height: 0;
  margin: 0 0 12px;
  padding: 24px 18px 10px;
}
.nn-demo-structure-stage .nn-demo-structure-column .nn-demo-panel + .nn-demo-panel { margin-top: 0; }
.nn-demo-structure-stage .nn-demo-structure-column .nn-demo-blocks { padding-inline: 6px; }
.nn-demo-structure-stage .nn-demo-structure-column .nn-demo-item { --item-spacing: 2px; min-height: 20px; }
.nn-demo-structure-stage .nn-demo-structure-column .nn-demo-item[data-level="0"] { --item-size: 15px; --item-leading: 1.4; }
.nn-demo-structure-stage .nn-demo-structure-column .nn-demo-item[data-level="1"] { --item-size: 13px; --item-leading: 1.4; }
.nn-demo-structure-stage .nn-demo-structure-panel--text { padding-bottom: 16px; }
.nn-demo-structure-stage .nn-demo-structure-panel--text .nn-demo-blocks { gap: 0; }
.nn-demo-structure-stage .nn-demo-structure-panel--text .nn-demo-content-block--text .nn-demo-item { --item-spacing: 5px; }
.nn-demo-structure-stage .nn-demo-structure-panel--text .nn-demo-item[data-text-style="heading1"] {
  --item-size: 16px;
  --item-leading: 1.3;
  --item-weight: 650;
}
.nn-demo-structure-stage .nn-demo-structure-panel--text .nn-demo-item[data-text-style="heading2"] {
  --item-size: 13.5px;
  --item-leading: 1.35;
  --item-weight: 600;
  --item-spacing: 7px;
}
.nn-demo-structure-stage .nn-demo-structure-panel--text .nn-demo-item[data-text-style="paragraph"] {
  --item-size: 12.5px;
  --item-leading: 1.55;
  --item-weight: 400;
  --item-spacing: 0px;
}
.nn-demo-column-scrollbar {
  position: absolute;
  top: 38px;
  right: -6px;
  width: 3px;
  height: 346px;
  border-radius: 2px;
  pointer-events: none;
}
.nn-demo-column-scrollbar > span {
  display: block;
  width: 3px;
  height: 58px;
  border-radius: 2px;
  background: color-mix(in srgb,var(--nn-muted) 36%,transparent);
  opacity: .56;
}
.nn-demo-structure-column:not([data-column="process"]) .nn-demo-column-scrollbar { opacity: 0; }
.nn-demo-column-gutter {
  position: absolute;
  top: 0;
  right: -14px;
  z-index: 3;
  width: 12px;
  height: 100%;
  cursor: col-resize;
}
.nn-demo-column-gutter::before {
  position: absolute;
  top: 3px;
  bottom: 3px;
  left: 50%;
  width: 1px;
  background: var(--nn-accent);
  opacity: 0;
  content: "";
  transition: opacity 100ms ease;
}
.nn-demo-column-gutter:hover::before,.nn-demo-column-gutter.is-resizing::before { opacity: .72; }
.nn-demo-structure-column:last-child .nn-demo-column-gutter { display: none; }
.nn-demo-structure-column.is-column-drag-source { visibility: hidden; }
.nn-demo-column-reorder-placeholder,.nn-demo-column-ghost,
.nn-demo-structure-panel-placeholder,.nn-demo-structure-panel-ghost {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 7;
  pointer-events: none;
}
.nn-demo-column-reorder-placeholder {
  border-radius: 14px;
  background: color-mix(in srgb,var(--nn-muted) 6%,transparent);
  outline: 1px dashed color-mix(in srgb,var(--nn-muted) 28%,transparent);
  outline-offset: -1px;
}
.nn-demo-column-ghost { z-index: 8; overflow: hidden; border-radius: 4px; background: var(--nn-canvas); box-shadow: 0 12px 28px #233c4922; }
.nn-demo-column-ghost > .nn-demo-column { width: 100%; height: 100%; }
.nn-demo-column-ghost .nn-demo-column-gutter,.nn-demo-column-ghost .nn-demo-column-scrollbar { display: none; }
.nn-demo-column-ghost .nn-demo-handle--column { opacity: var(--nn-handle-opacity-active); }
.nn-demo-structure-panel-placeholder {
  position: relative;
  width: 100%;
  min-height: 92px;
  border-radius: 14px;
  background: color-mix(in srgb,var(--nn-muted) 8%,transparent);
  box-shadow: inset 0 2px 0 color-mix(in srgb,var(--nn-accent) 72%,transparent);
}
.nn-demo-structure-panel-ghost { z-index: 9; overflow: hidden; border-radius: 14px; }
.nn-demo-structure-panel-ghost .nn-demo-panel {
  width: 100%;
  height: 100%;
  min-height: 0;
  margin: 0;
  padding: 24px 18px 10px;
  overflow: hidden;
  background: color-mix(in srgb,var(--nn-accent) 6%,#fff);
  box-shadow: 0 12px 28px #233c4922;
}
.nn-demo-structure-panel-ghost.is-measuring { overflow: visible; }
.nn-demo-structure-panel-ghost.is-measuring .nn-demo-panel { height: auto; overflow: visible; }
.nn-demo-structure-panel-ghost .nn-demo-blocks { padding-inline: 6px; }
.nn-demo-structure-panel-ghost .nn-demo-item { --item-spacing: 2px; min-height: 20px; }
.nn-demo-structure-panel-ghost .nn-demo-item[data-level="0"] { --item-size: 15px; --item-leading: 1.4; }
.nn-demo-structure-panel-ghost .nn-demo-item[data-level="1"] { --item-size: 13px; --item-leading: 1.4; }
.nn-demo-structure-panel-ghost .nn-demo-handle--panel { opacity: var(--nn-handle-opacity-active); }
.nn-demo-structure-stage .nn-demo-cursor { top: 0; left: 0; }
.nn-demo-ui.demo-spatial { width: 880px; min-height: 420px; overflow: visible; }
.nn-demo-page-stage {
  position: relative;
  display: block;
  width: 880px;
  height: 420px;
  transform-origin: top left;
}
.nn-demo-page-caption {
  position: absolute;
  top: 0;
  left: 302px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 276px;
  height: 16px;
  color: var(--nn-muted);
  font: 400 7px/1 var(--nn-font);
  letter-spacing: .015em;
}
.nn-demo-page-caption > span:last-child { display: flex; align-items: center; gap: 5px; }
.nn-demo-page-caption i { width: 5px; height: 5px; border-radius: 50%; background: var(--nn-accent); }
.nn-demo-page-paper {
  position: absolute;
  top: 24px;
  left: 302px;
  width: 276px;
  height: 390px;
  overflow: hidden;
  background: #fff;
  color: var(--nn-text);
  box-shadow: 0 2px 12px #0000000a,0 0 0 1px #00000004;
  transform-origin: top left;
}
.nn-demo-page-cell { position: absolute; overflow: hidden; background: transparent; }
.nn-demo-page-content {
  position: absolute;
  inset: 0;
  display: grid;
  align-content: start;
  gap: 4px;
  min-height: 0;
  padding: 6px;
  overflow: hidden;
}
.nn-demo-page-content > .nn-demo-block { margin: 0; }
.nn-demo-page-cell[data-cell="hero"] .nn-demo-page-content {
  grid-template-columns: .86fr 1.14fr;
  align-content: center;
  align-items: center;
  gap: 7px;
  padding: 8px;
}
.nn-demo-page-cell[data-cell="hero"] .nn-demo-content-block--text { align-self: center; }
.nn-demo-page-cell[data-cell="hero"] .nn-demo-content-block--image { align-self: center; height: 100%; min-height: 0; }
.nn-demo-page-cell[data-cell="middle-image"] .nn-demo-page-content { grid-template-rows: auto minmax(0,1fr); }
.nn-demo-page-cell[data-cell="middle-image"] .nn-demo-content-block--image { min-height: 0; }
.nn-demo-page-paper .nn-demo-image-button { width: 100%; height: 100%; overflow: hidden; }
.nn-demo-page-paper .nn-demo-image { width: 100%; height: 100%; max-height: none; object-fit: cover; object-position: center; }
.nn-demo-page-paper .nn-demo-list { --item-indent-step: 7px; --item-marker-track-size: 8px; --item-text-marker-gap: 1px; }
.nn-demo-page-paper .nn-demo-item { --item-size: 8px; --item-leading: 1.3; --item-spacing: 2px; min-height: 10px; }
.nn-demo-page-paper .nn-demo-item[data-level="0"] { --item-size: 9.5px; --item-leading: 1.25; --item-weight: 640; }
.nn-demo-page-paper .nn-demo-item__editor { padding: 0; }
.nn-demo-page-paper .nn-demo-marker { height: 1lh; }
.nn-demo-page-paper .nn-demo-content-block--text .nn-demo-item[data-text-style="heading1"] {
  --item-size: 11px;
  --item-leading: 1.18;
  --item-weight: 650;
  --item-spacing: 3px;
}
.nn-demo-page-paper .nn-demo-content-block--text .nn-demo-item[data-text-style="heading2"] {
  --item-size: 8.5px;
  --item-leading: 1.25;
  --item-weight: 600;
  --item-spacing: 3px;
}
.nn-demo-page-paper .nn-demo-content-block--text .nn-demo-item[data-text-style="paragraph"] {
  --item-size: 7.5px;
  --item-leading: 1.42;
  --item-weight: 400;
  --item-spacing: 0px;
}
.nn-demo-page-paper .nn-demo-block::before { left: -7px; }
.nn-demo-page-paper .nn-demo-block::after { left: -10px; scale: .7; }
.nn-demo-page-paper .nn-demo-handle--item { inset-inline-start: -8px; width: 7px; scale: .65; transform-origin: right center; }
.nn-demo-page-edge-layer { position: absolute; inset: 0; z-index: 5; pointer-events: none; }
.nn-demo-layout-edge {
  position: absolute;
  z-index: 2;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--nn-muted);
  pointer-events: none;
}
.nn-demo-layout-edge::after { position: absolute; background: currentColor; opacity: .18; content: ""; }
.nn-demo-layout-edge[data-axis="h"] { transform: translateY(-50%); }
.nn-demo-layout-edge[data-axis="h"]::after { top: 50%; right: 4px; left: 4px; height: 1px; }
.nn-demo-layout-edge[data-axis="v"] { transform: translateX(-50%); }
.nn-demo-layout-edge[data-axis="v"]::after { top: 4px; bottom: 4px; left: 50%; width: 1px; }
.nn-demo-layout-edge.is-active { color: var(--nn-accent); }
.nn-demo-layout-edge.is-active::after { opacity: 1; box-shadow: 0 0 0 1px color-mix(in srgb,var(--nn-accent) 22%,transparent); }
.nn-demo-layout-node {
  position: absolute;
  z-index: 3;
  display: grid;
  place-items: center;
  width: 10px;
  height: 10px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--nn-muted);
  transform: translate(-50%,-50%);
  pointer-events: none;
}
.nn-demo-layout-node::after { width: 3px; height: 3px; border-radius: 50%; background: currentColor; opacity: .35; content: ""; }
.nn-demo-layout-node.is-active { color: var(--nn-accent); }
.nn-demo-layout-node.is-active::after { opacity: 1; box-shadow: 0 0 0 2px color-mix(in srgb,var(--nn-accent) 22%,transparent); }
.nn-demo-layout-preview { position: absolute; inset: 0; z-index: 6; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.nn-demo-layout-preview line { stroke: var(--nn-accent); stroke-width: 1.5; stroke-dasharray: 5 4; vector-effect: non-scaling-stroke; }
.nn-demo-page-stage > .nn-demo-cursor { top: 0; left: 0; z-index: 10; }
.row-scene[data-row="R4"] .row-facet--B .row-preview { top: -16px; }
@media (max-width: 700px) {
  .nn-demo-ui.demo-spatial,.nn-demo-page-stage { width: 560px; }
  .nn-demo-page-caption,.nn-demo-page-paper { left: 142px; }
  .row-scene[data-row="R4"] .row-facet--B .row-preview { top: 0; }
}
.nn-demo-ui.demo-local-files { width: 1475px; min-height: 0; overflow: hidden; border-radius: 14px; box-shadow: 0 2px 8px #233c4914; }
.nn-demo-static-image { display: block; width: 100%; height: auto; }
.nn-demo-column { flex: 0 0 258px; position: relative; padding-top: 34px; }
.nn-demo-column-header {
  position: absolute;
  inset: 0 0 auto;
  display: flex;
  align-items: center;
  height: 24px;
  padding: 0 20px 0 2px;
  border-bottom: 1px solid rgba(92,96,89,.13);
  color: var(--nn-muted);
}
.nn-demo-handle--column { flex: 0 0 22px; opacity: .18; }
.nn-demo-handle--column::before { content: "••"; font: 400 8px/1 var(--nn-font); letter-spacing: 2px; }
.nn-demo-column-header__label { overflow: hidden; font: 400 10px/1.25 var(--nn-font); letter-spacing: .08em; text-transform: uppercase; text-overflow: ellipsis; white-space: nowrap; }
.nn-demo-column .nn-demo-panel { min-height: 142px; padding: 25px 21px 11px; }
.nn-demo-column .nn-demo-item { --item-spacing: 2px; }
.nn-demo-column .nn-demo-item[data-level="0"] { --item-size: 15px; --item-weight: 500; --item-leading: 1.45; }
.nn-demo-column .nn-demo-item[data-level="1"] { --item-size: 14px; --item-leading: 1.45; }
.nn-demo-column .nn-demo-panel + .nn-demo-panel { margin-top: 14px; }
@media (max-width: 700px) {
  .nn-demo-ui { font-family: var(--nn-font); }
  .nn-demo-ui.demo-writing { width: 720px; min-height: 420px; }
  .nn-demo-writing-stage { min-height: 420px; }
}

/* Draft 06: one vertical R axis with horizontal facets inside each scene. */
.experience[data-mode="landing"] .hud .location,
.experience[data-mode="landing"] .demo-controls,
.experience[data-mode="intro"] .hud .location { visibility: hidden; }
.hud .location,
.hud .draft-label {
  color: #252722;
  font-family: var(--landing-ui-font);
  font-size: 10px;
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: .1px;
}
.hud .location > span {
  font-family: var(--landing-ui-font);
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: .1px;
}
.masthead { position: fixed; inset: 0; z-index: 30; pointer-events: none; }
.launch-offer {
  position: fixed;
  top: max(24px,env(safe-area-inset-top));
  right: max(32px,env(safe-area-inset-right));
  display: flex;
  align-items: center;
  gap: 22px;
  padding: 14px 18px;
  border: 2px solid currentColor;
  border-radius: 12px;
  background: transparent;
  color: var(--ink);
  font-family: var(--landing-ui-font);
  text-align: left;
  pointer-events: auto;
  transition: color 160ms ease;
}
.launch-offer:hover { color: #078c83; }
.launch-offer__copy { display: grid; gap: 4px; }
.launch-offer__copy strong { font-size: 14px; font-weight: 700; line-height: 1.25; }
.launch-offer__copy > span { font-size: 12px; line-height: 1.4; }
.launch-offer__price { font-size: 32px; font-weight: 700; line-height: 1; }
@media (max-width: 700px) {
  .launch-offer {
    top: max(24px,env(safe-area-inset-top));
    right: max(14px,env(safe-area-inset-right));
    gap: 8px;
    padding: 8px;
  }
  .launch-offer__copy strong { font-size: 12px; }
  .launch-offer__detail { display: none; }
  .launch-offer__copy > span { font-size: 10px; }
  .launch-offer__price { font-size: 26px; }
}
@media (max-width: 360px) {
  .launch-offer { top: max(12px,env(safe-area-inset-top)); padding: 6px 8px; }
}
.brand {
  position: fixed;
  top: 50%;
  left: 50%;
  width: max-content;
  pointer-events: auto;
  transform-origin: center;
  will-change: top,left,transform,filter;
  transition: filter .28s ease;
}
.brand.is-attracted { filter: drop-shadow(0 14px 20px rgba(38,45,31,.16)); }
.brand.is-attracted img { transform: scale(1.08); }
.brand img { transition: transform .28s cubic-bezier(.2,.8,.2,1); }
#nodes { position: fixed; inset: 0; perspective: 1300px; transform-style: preserve-3d; }
.sequence-intro,
.row-scene {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  transform-style: preserve-3d;
  will-change: transform,opacity;
}
.sequence-intro { opacity: 0; pointer-events: none; }
.sequence-intro h1 {
  width: min(860px, calc(100vw - 80px));
  margin: 7vh 0 0;
  color: #252722;
  font-family: var(--landing-heading-font);
  font-size: 80px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0;
  text-align: center;
  text-wrap: balance;
}
.row-scene {
  --side-track: clamp(90px,calc((100% - 918px)/2),170px);
  --side-copy-width: clamp(180px,calc(90vw - 874px),323px);
  --cell-gap: clamp(14px,1vw,18px);
  --edge-track: clamp(0px,calc((100% - 1258px)/2),61px);
  grid-template-columns: var(--edge-track) var(--side-track) minmax(0,1fr) var(--side-track) var(--edge-track);
  gap: var(--cell-gap);
  width: min(1380px,100vw);
  height: min(650px, calc(100vh - 130px));
  margin: auto;
  opacity: 0;
  pointer-events: none;
}
.row-scene[aria-hidden="false"] { pointer-events: auto; }
.row-scene[aria-hidden="false"] .demo-magnifier { pointer-events: auto; }
.row-facet {
  position: relative;
  min-width: 0;
  color: var(--ink);
  transform-origin: center;
  will-change: transform,opacity;
}
.row-facet--A { grid-column: 2; grid-row: 1; justify-self: center; width: var(--side-copy-width); text-align: right; z-index: 2; }
.row-facet--C { grid-column: 4; grid-row: 1; justify-self: center; width: var(--side-copy-width); text-align: left; z-index: 2; }
.facet-label {
  margin: 0 0 16px;
  color: #292929;
  font-family: var(--landing-ui-font);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: 1.2px;
  text-transform: uppercase;
}
.row-facet h2 {
  margin: 0;
  color: #252722;
  font-family: var(--landing-heading-font);
  font-size: 38px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0;
  text-wrap: balance;
  cursor: default;
  user-select: none;
}
.row-facet--B { grid-column: 3; grid-row: 1; align-self: center; width: 100%; text-align: left; z-index: 1; }
.row-facet--B > .facet-label,
.row-facet--B > h2 { width: 100%; margin-right: 0; margin-left: 0; }
.row-facet--B h2 { font-size: 42px; line-height: 1; transform-origin: left bottom; }
.row-scene:not([data-row="R5"]) .row-facet--B > .facet-label { translate: 0 clamp(-32px,-2.3vw,-29px); }
.row-icon { width: 42px; height: 42px; margin: 0 0 18px; color: var(--ink); opacity: 1; }
.row-scene:not([data-row="R5"]) .row-icon {
  translate: 0 clamp(-20px,-1.4vw,-15px);
}
.row-icon svg { display: block; width: 100%; height: 100%; }
.row-icon svg { stroke: none; }
.row-icon polygon { fill: currentColor; fill-opacity: 1; }
.intro-next {
  position: fixed;
  z-index: 18;
  left: 50%;
  bottom: max(112px,calc(env(safe-area-inset-bottom) + 92px));
  width: 64px;
  height: 64px;
  color: #70786c;
  transform: translateX(-50%);
  transition: color .2s ease,filter .25s ease,transform .28s cubic-bezier(.2,.8,.2,1);
  cursor: none;
}
.intro-next svg { display: block; width: 100%; height: 100%; stroke-width: 1.65; }
.intro-next:hover,.intro-next:focus-visible { color: var(--ink); filter: drop-shadow(0 10px 14px rgba(38,45,31,.16)); transform: translateX(-50%) scale(1.12); }
.intro-next::after { position: absolute; inset: -12px; content: ""; }
.scroll-anchor {
  position: fixed;
  z-index: 18;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: none;
}
.scroll-anchor__symbol {
  position: absolute;
  inset: 12px;
  display: block;
  color: #747b70;
  opacity: .46;
  pointer-events: none;
}
.scroll-anchor__symbol svg { display: block; width: 100%; height: 100%; overflow: visible; }
.scroll-hover-cursor {
  position: fixed;
  z-index: 50;
  width: 22px;
  height: 34px;
  color: var(--ink);
  pointer-events: none;
}
.scroll-hover-cursor svg { display: block; width: 100%; height: 100%; overflow: visible; }
.scroll-hover-cursor[data-direction="up"] svg { transform: rotate(180deg); }
.scroll-hover-cursor path {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  animation: scroll-hover-arrow 850ms ease-in-out infinite;
}
.scroll-hover-cursor path:nth-child(2) { animation-delay: 120ms; }
.scroll-hover-cursor path:nth-child(3) { animation-delay: 240ms; }
@keyframes scroll-hover-arrow {
  0%, 100% { opacity: .25; transform: translateY(-2px); }
  50% { opacity: 1; transform: translateY(3px); }
}
@media (prefers-reduced-motion: reduce) {
  .scroll-hover-cursor path { animation: none; opacity: .8; }
}
.row-map {
  position: fixed;
  z-index: 22;
  top: 50%;
  right: max(28px,env(safe-area-inset-right));
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  transform: translateY(-50%);
}
.row-map__item {
  width: 44px;
  height: 44px;
  padding: 5px;
  color: #7f867a;
  opacity: .7;
  transform: scale(1);
  transition: opacity .28s ease,color .28s ease,transform .32s cubic-bezier(.2,.8,.2,1),filter .28s ease;
}
.row-map__item svg { display: block; width: 100%; height: 100%; stroke-width: 1.8; }
.row-map__item:hover,.row-map__item:focus-visible { color: var(--ink); opacity: .9; transform: scale(1.1); }
.row-map__item.is-active { color: var(--ink); opacity: 1; transform: scale(1.22); filter: drop-shadow(0 6px 9px rgba(38,45,31,.16)); }
.row-map__item.is-active svg { stroke: none; }
.row-map__item.is-active polygon { fill: currentColor; fill-opacity: .9; }
.row-preview {
  position: relative;
  width: max-content;
  margin: 18px 0 0;
  transform: none;
  transform-origin: top left;
  will-change: auto;
}
.row-preview .demo-caption { display: none; }
.demo-magnifier {
  position: absolute;
  right: -30px;
  top: -30px;
  z-index: 20;
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #fff;
  color: var(--ink);
  box-shadow: 0 7px 22px rgba(37,48,27,.12);
  cursor: zoom-in;
  transition: transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s ease,color .25s ease;
}
.demo-magnifier { display: none; }
.demo-magnifier svg { width: 21px; fill: none; stroke: currentColor; stroke-width: 1.7; }
.demo-magnifier.is-active,
.demo-magnifier:hover { color: var(--accent); transform: scale(1.12); box-shadow: 0 11px 28px rgba(37,48,27,.18); }
.experience[data-mode="landing"] .draft-label { opacity: .45; }
.hud-right { display: flex; align-items: center; gap: 18px; }
.spatial-privacy-choices { font: inherit; color: #777d72; letter-spacing: .08em; }
.spatial-privacy-choices:hover { color: var(--ink); }

@media (min-width: 701px) and (max-width: 1452px) {
  .row-scene {
    inset: 0 auto 0 0;
    width: calc(100vw - 72px);
    margin: auto 0;
  }
}
@media (max-width: 900px) {
  .row-facet h2 { font-size: clamp(30px,4vw,36px); }
  .row-facet--B h2 { font-size: clamp(27px,4.5vw,36px); }
}
@media (max-width: 700px) {
  .scroll-anchor { display: none; }
  /* Mobile has no depth interaction; keep live demos out of Safari's nested
     preserve-3d layers while retaining their existing size and motion. */
  #nodes { perspective: none; transform-style: flat; }
  .sequence-intro,.row-scene { transform-style: flat; }
  .row-facet,.nn-demo-writing-panel,.nn-demo-writing-state { will-change: auto; }
  .sequence-intro h1 { width: calc(100vw - 44px); margin-top: 4vh; font-size: clamp(32px,8vw,42px); text-align: left; }
  .row-scene {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: clamp(24px,3vh,32px);
    width: 100vw;
    height: calc(100dvh - 110px);
    inset: 0;
    margin: auto;
  }
  .row-facet--A,.row-facet--B,.row-facet--C { position: relative; left: auto; flex: 0 0 auto; transform-origin: center; }
  .row-facet--A,.row-facet--C { width: min(calc(100vw - 64px),520px); }
  .row-facet--A,.row-facet--C { text-align: left; }
  .row-facet--A { top: auto; transform-origin: center bottom; }
  .row-facet--B { top: auto; width: 100%; height: auto; }
  .row-facet--C { bottom: auto; transform-origin: center top; }
  .row-facet h2 { font-size: clamp(18px,4.4vw,22px); line-height: 1.16; }
  .facet-label { font-size: 10px; margin-bottom: 6px; }
  .row-facet--B > .facet-label,
  .row-facet--B > h2 { width: min(calc(100vw - 64px),560px); margin-right: auto; margin-left: auto; }
  .row-facet--B h2 { font-size: clamp(22px,5.6vw,28px); line-height: 1.08; }
  .row-scene:not([data-row="R5"]) .row-facet--B > .facet-label { translate: none; }
  .row-icon { display: none; }
  .row-preview { width: max-content; max-width: none; }
  .row-facet--B .row-preview {
    left: calc(50% - clamp(12px,3vw,22px));
    margin: 42px 0 0;
    translate: -50% 0;
    transform-origin: top center;
  }
  .demo-magnifier { right: 16px; top: 16px; }
  .intro-next { bottom: max(94px,calc(env(safe-area-inset-bottom) + 76px)); width: 58px; height: 58px; }
  .row-map { right: max(10px,env(safe-area-inset-right)); gap: 14px; }
  .row-map__item { width: 36px; height: 36px; padding: 4px; }
}

/* R5: final CTA slide. */
.row-scene[data-row="R5"] {
  inset: 0;
  grid-template-columns: minmax(0,1fr);
  width: min(1180px,calc(100vw - 120px));
  height: min(680px,calc(100dvh - 120px));
  margin: auto;
}
.row-scene[data-row="R5"] .row-facet--A,
.row-scene[data-row="R5"] .row-facet--C { display: none; }
.row-scene[data-row="R5"] .row-facet--B {
  grid-column: 1;
  width: 100%;
  text-align: center;
  opacity: 1 !important;
  transform: none !important;
}
.row-scene[data-row="R5"] .row-facet--B > .facet-label { display: none; }
.row-scene[data-row="R5"] .row-facet--B > h2 {
  width: min(920px,100%);
  margin: 0 auto;
  color: #252722;
  font-family: "DM Serif Display", Georgia, serif;
  font-size: 42px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0;
  text-align: center;
  transform: none !important;
}
.row-scene[data-row="R5"] .row-facet--B > h2 span { display: block; white-space: nowrap; }
.row-scene[data-row="R5"] .row-preview {
  left: auto;
  width: 100%;
  max-width: none;
  margin: 34px 0 0;
  translate: none;
  transform: none !important;
  transform-origin: top center;
  zoom: 1 !important;
}
.demo-shell.demo-cta { width: 100%; min-height: 0; }
.nn-final-cta { width: 100%; }
.nn-final-cta__cards {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 16px;
}
.nn-final-cta-card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 300px;
  padding: 28px 30px 26px;
  overflow: hidden;
  border: 1px solid rgba(37,39,34,.055);
  border-radius: 15px;
  background: #fff;
  color: var(--ink);
  box-shadow: 0 2px 8px rgba(35,60,73,.055),0 18px 42px -30px rgba(38,45,31,.22);
  text-align: left;
  transition: transform 180ms ease,box-shadow 180ms ease;
}
.nn-final-cta-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 4px 11px rgba(35,60,73,.07),0 22px 48px -28px rgba(38,45,31,.26);
}
.nn-final-cta-card--web { border-color: transparent; background: var(--accent); }
.nn-final-cta-card--desktop { border-color: #111210; background: #111210; color: #fff; }
.nn-final-cta-card__arrow {
  display: block;
  width: 52px;
  height: 52px;
  margin: 0 0 22px;
  object-fit: contain;
  transform-origin: center;
}
.nn-final-cta-card__arrow--web { transform: rotate(45deg); }
.nn-final-cta-card__arrow--desktop { filter: invert(1); transform: rotate(180deg); }
.nn-final-cta-card__lead { display: flex; align-items: center; gap: 14px; margin-bottom: 22px; }
.nn-final-cta-card__lead .nn-final-cta-card__arrow { position: static; flex: none; margin: 0; }
.nn-final-cta-card__offer {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px;
  border: 2px solid currentColor;
  border-radius: 12px;
  background: transparent;
  font-family: var(--landing-ui-font);
}
.nn-final-cta-card__offer .launch-offer__copy strong { font-size: 11px; }
.nn-final-cta-card__offer .launch-offer__copy > span { font-size: 10px; }
.nn-final-cta-card__offer .launch-offer__price { font-size: 26px; }
.nn-final-cta-card__heading { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; }
.nn-final-cta-card h3 {
  margin: 0;
  font-family: var(--landing-ui-font);
  font-size: 28px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0;
}
.nn-final-cta-card__label {
  flex: none;
  font-family: var(--landing-cta-small-font);
  font-size: 14px;
  font-weight: 800;
  line-height: 1.8;
  letter-spacing: 1.68px;
}
.nn-final-cta-card p {
  margin: 20px 0 0;
  font-family: var(--landing-cta-body-font);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.6;
  letter-spacing: 0;
}
.nn-final-cta-card ul {
  display: grid;
  gap: 7px;
  margin: 12px 0 0;
  padding: 0;
  list-style: none;
  font-family: var(--landing-cta-body-font);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.6;
  letter-spacing: 0;
}
.nn-final-cta-card li { position: relative; padding-left: 13px; }
.nn-final-cta-card li::before { position: absolute; left: 0; content: "·"; }
.nn-final-cta-card__link {
  align-self: flex-start;
  margin-top: auto;
  padding: 11px 15px;
  border-radius: 7px;
  background: var(--ink);
  color: #fff;
  font-family: var(--landing-cta-small-font);
  font-size: 14px;
  font-weight: 800;
  line-height: 1.8;
  letter-spacing: .4px;
  transition: background-color 160ms ease,color 160ms ease;
}
.nn-final-cta-card--web .nn-final-cta-card__link:hover,
.nn-final-cta-card--web .nn-final-cta-card__link:focus-visible { background: #000; }
.nn-final-cta-card--desktop .nn-final-cta-card__link { background: #fff; color: var(--ink); }
.nn-final-cta-card--desktop .nn-final-cta-card__link:hover,
.nn-final-cta-card--desktop .nn-final-cta-card__link:focus-visible { background: var(--accent); }
.nn-final-cta-card--learn .nn-final-cta-card__link:hover,
.nn-final-cta-card--learn .nn-final-cta-card__link:focus-visible { background: #000; }
@media (max-width: 700px) {
  .row-scene[data-row="R5"] {
    display: flex;
    width: 100vw;
    height: calc(100dvh - 96px);
  }
  .row-scene[data-row="R5"] .row-facet--B { width: min(calc(100vw - 112px),520px); }
  .row-scene[data-row="R5"] .row-facet--B > h2 {
    width: max-content;
    max-width: none;
    margin: 0;
    font-size: clamp(17px,4.8vw,21px);
    line-height: 1.06;
    text-align: left;
  }
  .row-scene[data-row="R5"] .row-preview { margin-top: 20px; }
  .nn-final-cta__cards { grid-template-columns: 1fr; gap: 9px; }
  .nn-final-cta-card {
    min-height: 0;
    padding: 15px 17px 14px;
    border-radius: 12px;
  }
  .nn-final-cta-card__arrow { position: absolute; top: 15px; right: 16px; width: 32px; height: 32px; margin: 0; }
  .nn-final-cta-card__heading { padding-right: 42px; }
  .nn-final-cta-card--desktop .nn-final-cta-card__heading { padding-right: 0; }
  .nn-final-cta-card__lead { gap: 12px; margin-bottom: 10px; }
  .nn-final-cta-card h3 { font-size: 16px; }
  .nn-final-cta-card__label { font-size: 8px; }
  .nn-final-cta-card p { margin-top: 8px; font-size: 11px; line-height: 1.45; }
  .nn-final-cta-card ul { gap: 2px; margin-top: 6px; font-size: 10px; line-height: 1.35; }
  .nn-final-cta-card__link { margin-top: 10px; padding: 8px 11px; font-size: 10px; }
}

@media (max-width: 700px) and (max-height: 720px) {
  .row-scene[data-row="R5"] .row-facet--B > h2 { font-size: 18px; }
  .row-scene[data-row="R5"] .row-preview { margin-top: 13px; }
  .nn-final-cta__cards { gap: 6px; }
  .nn-final-cta-card { padding: 11px 14px 10px; }
  .nn-final-cta-card__arrow { top: 11px; right: 13px; width: 27px; height: 27px; }
  .nn-final-cta-card h3 { font-size: 16px; }
  .nn-final-cta-card p { margin-top: 5px; font-size: 10px; }
  .nn-final-cta-card ul { margin-top: 4px; font-size: 9px; }
  .nn-final-cta-card__link { margin-top: 7px; padding: 6px 9px; font-size: 9px; }
}

@media (prefers-reduced-motion: reduce) {
  .nn-final-cta-card { transition: none; }
  .nn-final-cta-card:hover { transform: none; }
}