/* Attune refinement owners: canonical demo, Signal Lab, compound visual, catalog views. */
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-weight:600;font-kerning:normal;font-synthesis:none}
.hero h1,.big{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-weight:800;letter-spacing:-.027em;line-height:1.01}
.button,button,input,select,textarea{font-family:inherit}
.listen .demo{border-width:2px;border-color:rgba(139,190,255,.62)}
.listen .step{border-right-width:2px;border-right-color:rgba(139,190,255,.42)}
.listen .step-label b{border-width:2px;border-color:rgba(119,178,255,.68)}
.listen .song-card img,.listen .next img{border:2px solid rgba(144,194,255,.36)}
.listen .rxn,.listen .chip{border-width:2px;border-color:rgba(144,190,252,.52)}
.listen .rxn.active{border-width:2px}
.listen .orbit:before,.listen .orbit:after{content:none}
@media(max-width:850px){body .listen .step{border-right:0;border-bottom:2px solid rgba(139,190,255,.42)}body .listen .step:last-child{border-bottom:0}body .listen .confirm{grid-column:1/-1;min-height:390px}}@media(max-width:560px){body .listen .confirm{min-height:0}}
.listen .demo{--demo-tint:#f0624c}.listen .song{background:radial-gradient(circle at 48% 20%,color-mix(in srgb,var(--track-tint) 30%,transparent),transparent 44%),linear-gradient(160deg,#2f6fff20,transparent)}.listen .rxn{position:relative;display:grid;grid-template-columns:16px 1fr;align-items:center;gap:5px;padding:8px 7px;text-align:left}.listen .rxn svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.listen .rxn span{font-size:10px;line-height:1;font-weight:900}.listen .rxn em{position:absolute;right:6px;bottom:5px;color:#d6e8ff;font-size:7px;font-style:normal;letter-spacing:.06em;text-transform:uppercase}.listen .rxn.active:after{position:absolute;top:7px;right:7px;width:6px;height:6px;border-radius:50%;background:currentColor;box-shadow:0 0 0 3px color-mix(in srgb,currentColor 18%,transparent);content:""}.listen .chip{position:relative}.listen .chip.selected:after{margin-left:5px;color:#ddecff;content:"✓"}.listen .try-again{padding:0;border:0;background:transparent;color:#a7c9f2;font:900 10px/1.3 "Avenir Next","Plus Jakarta Sans",sans-serif;letter-spacing:.08em;text-align:right;text-transform:uppercase;cursor:pointer}.listen .try-again:hover{color:#fff}.listen .try-again:focus-visible{outline:2px solid #8fc1ff;outline-offset:5px}.resolution-model{position:relative;display:grid;gap:9px;width:100%;max-width:270px;margin:auto}.resolution-inputs{display:grid;gap:7px}.resolver-input{position:relative;display:grid;grid-template-columns:76px minmax(0,1fr);align-items:center;gap:9px;min-height:43px;padding:8px 11px;border:2px solid rgba(116,171,255,.34);border-radius:11px;background:rgba(7,29,67,.72);color:#c9e0fb;opacity:.66;transition:transform 180ms cubic-bezier(.2,.8,.2,1),opacity 180ms cubic-bezier(.2,.8,.2,1),border-color 180ms cubic-bezier(.2,.8,.2,1),background 180ms cubic-bezier(.2,.8,.2,1)}.resolver-input:after{position:absolute;bottom:-9px;left:50%;width:2px;height:8px;background:#5f95d7;content:""}.resolver-input:last-child:after{content:none}.resolver-input i{color:#86add9;font-size:8px;font-style:normal;font-weight:900;letter-spacing:.09em;text-transform:uppercase}.resolver-input b{min-width:0;color:#f4f8ff;font-size:10px;line-height:1.25;letter-spacing:.015em;text-align:left;overflow-wrap:break-word}.resolution-flow{display:grid;place-items:center;height:15px;color:#6eaaff;font-size:16px;line-height:1}.resolution-center{position:relative;padding:14px 15px 13px;border:2px solid #6ba8f2;border-radius:15px;background:linear-gradient(145deg,#0a2c61,#061a3d);box-shadow:inset 0 1px rgba(255,255,255,.09),0 12px 24px rgba(0,0,0,.18);text-align:left}.resolution-center>small{display:block;color:#9cc8ff;font-size:8px;letter-spacing:.12em;text-transform:uppercase;font-weight:900}.resolution-center strong{display:block;margin-top:7px;color:#fff;font-size:14px;line-height:1.15;letter-spacing:.035em}.resolution-center p{margin:7px 0 0;color:#c8d9ef;font-size:10px;line-height:1.42}.resolution-preserved{display:grid;grid-template-columns:auto 1fr;gap:4px 8px;margin-top:10px;padding-top:9px;border-top:2px solid rgba(126,174,235,.26)}.resolution-preserved small{color:#7faddf;font-size:7px;font-weight:900;letter-spacing:.1em;text-transform:uppercase}.resolution-preserved span{color:#a9c8eb;font-size:9px;font-weight:750;line-height:1.35}.resolution-model.preview{opacity:.9}.resolution-model.preview .resolution-center{border-color:#568ed2}.resolution-model.never .resolver-reaction,.resolution-model.never .resolver-duration{border-color:#d8e1ec}.resolution-model.love .resolver-reaction,.resolution-model.love .resolver-meaning{border-color:#ff8fa2}.resolution-model.like .resolver-reaction,.resolution-model.like .resolver-meaning{border-color:#78aaff}.resolution-model.dis .resolver-reaction,.resolution-model.dis .resolver-meaning{border-color:#ff9b7d}.demo.is-resolving .rxn.active{animation:signalCommit 150ms cubic-bezier(.2,.8,.2,1) both}.demo.is-resolving .chip.selected{animation:scopeToResolver 250ms 100ms cubic-bezier(.2,.8,.2,1) both}.demo.is-resolving .resolver-reaction{border-color:var(--demo-tint);background:rgba(18,54,105,.92);opacity:1;transform:translateX(4px)}.demo.scope-resolved .resolver-meaning{border-color:var(--demo-tint);background:rgba(18,54,105,.92);opacity:1;transform:translateX(4px)}.demo.persistence-resolved .resolver-duration{border-color:#7fb6ff;background:rgba(18,54,105,.92);opacity:1;transform:translateX(4px)}.demo.route-resolved .resolution-center{animation:instructionResolve 210ms cubic-bezier(.2,.8,.2,1) both}.demo.route-resolved .player-signal i{animation:routeResolve 230ms cubic-bezier(.2,.8,.2,1) both}.next{transition:opacity 180ms cubic-bezier(.2,.8,.2,1),transform 180ms cubic-bezier(.2,.8,.2,1)}.demo.is-resolving .next{opacity:.45;transform:translateX(-7px)}.demo.is-resolved .next{opacity:1;transform:none}.demo.is-resolved .next img{animation:nextTrackIn 240ms cubic-bezier(.2,.8,.2,1) both}.next .next-why{margin-top:11px!important;padding-top:9px;border-top:2px solid rgba(133,181,247,.3);color:#a9d4ff!important;font-size:9px!important;line-height:1.35;letter-spacing:.07em;text-transform:uppercase;font-weight:900}.player-signal{display:flex;align-items:center;gap:3px;height:20px;margin-top:11px;overflow:hidden}.player-signal i{display:block;width:2px;background:#6aa8ff;transform-origin:center;animation:playerPulse 1.8s cubic-bezier(.2,.8,.2,1) infinite}.player-signal i:nth-child(1){height:8px}.player-signal i:nth-child(2){height:18px;animation-delay:.14s}.player-signal i:nth-child(3){height:12px;animation-delay:.28s}.demo[data-reaction="love"] .player-signal:after{width:34px;height:16px;margin-left:5px;border-top:2px solid #ef6880;border-right:2px solid #ef6880;border-radius:0 24px 0 0;content:""}.demo[data-reaction="like"] .player-signal{gap:4px}.demo[data-reaction="like"] .player-signal i{height:13px!important;background:#69a7ff}.demo[data-reaction="dis"] .player-signal i:nth-child(2){background:#ff8769;transform:translateY(4px)}.demo[data-reaction="never"] .player-signal i:nth-child(3){height:18px;background:#dae2ed}.demo[data-reaction="never"] .player-signal:after{width:2px;height:18px;margin-left:5px;background:#dae2ed;content:""}@keyframes signalCommit{50%{transform:scale(.94)}100%{transform:scale(1)}}@keyframes scopeToResolver{50%{transform:translate(14px,-22px) scale(.9);opacity:.55}100%{transform:none;opacity:1}}@keyframes instructionResolve{0%{transform:scale(.86);opacity:.15}100%{transform:scale(1);opacity:1}}@keyframes routeResolve{0%{transform:translateX(-14px);opacity:.2}100%{transform:none;opacity:1}}@keyframes nextTrackIn{0%{transform:translateX(-16px) scale(.94);opacity:.1}100%{transform:none;opacity:1}}@keyframes playerPulse{50%{transform:scaleY(.58);opacity:.55}}@media(prefers-reduced-motion:reduce){.listen .rxn.active,.listen .chip.selected,.listen .resolution-center,.listen .player-signal i,.listen .next img{animation:none!important}.listen .next,.listen .resolver-input{transition:none!important}}
.device{overflow:visible}.device-screen{position:absolute;inset:0;overflow:hidden;border-radius:25px;background:linear-gradient(150deg,#07142d,#17376c)}.device-screen:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 78% 16%,rgba(88,163,255,.42),transparent 28%);pointer-events:none}.device-status{position:absolute;z-index:2;top:17px;left:20px;color:#b8d7ff;font-size:9px;letter-spacing:.15em;text-transform:uppercase;font-weight:900}.device-cover{position:absolute;z-index:1;top:51px;left:25px;width:42%;aspect-ratio:1;border-radius:11px;object-fit:cover;box-shadow:0 16px 25px rgba(0,0,0,.34)}.device-track{position:absolute;z-index:2;top:54px;right:17px;width:42%;color:#fff}.device-track b{display:block;font-size:17px;letter-spacing:-.04em;line-height:1}.device-track span{display:block;margin-top:5px;color:#9cc4ff;font-size:10px}.device-time{display:flex;justify-content:space-between;margin-top:13px;color:#b2c8e7;font-size:8px}.device-timeline{height:3px;margin:6px 0 11px;background:#547195}.device-timeline i{display:block;width:39%;height:100%;background:#7eb5ff}.device-controls{display:flex;gap:8px;color:#fff;font-size:14px}.device-react{position:absolute;z-index:3;right:-28px;bottom:-37px;width:69%;padding:12px 13px;border:1px solid rgba(147,195,255,.35);border-radius:13px;background:rgba(3,18,47,.93);box-shadow:0 18px 34px rgba(0,0,0,.34)}.device-react strong{display:block;color:#e8f3ff;font-size:9px;letter-spacing:.12em;text-transform:uppercase}.device-reaction-buttons{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin:8px 0}.device-reaction-buttons span{display:grid;place-items:center;min-height:25px;border:1px solid rgba(153,199,255,.22);border-radius:6px;color:#bad4f6;font-size:8px;font-weight:900}.device-reaction-buttons span.active{color:#fff;background:#e458663d;border-color:#ff8594}.device-chips{display:flex;flex-wrap:wrap;gap:5px}.device-chips em{padding:4px 6px;border-radius:9px;background:#fff1;color:#b9d7ff;font-size:8px;font-style:normal}.device-chips em.on{color:#fff;background:#176cee}.device-output{display:flex;align-items:center;justify-content:space-between;margin-top:9px;color:#aaffcb;font-size:8px;font-weight:900;letter-spacing:.06em;text-transform:uppercase}.device-output b{padding:4px 7px;border-radius:8px;background:#2c7df5;color:#fff;font-size:8px}
.signal-select{width:100%;height:100%;padding:0;border:0;background:transparent;color:inherit;text-align:left;cursor:pointer}.signal-select:focus-visible,.signal-tab:focus-visible{outline:3px solid rgba(18,105,239,.45);outline-offset:-3px}.card:has(.signal-select.active){background:linear-gradient(145deg,#f3f8ff,#fff)}.card:has(.signal-select.active)::after{content:"";position:absolute;right:20px;bottom:18px;left:20px;height:2px;background:currentColor}.signal-lab{display:grid;grid-template-columns:.72fr 1.28fr;gap:1px;margin-top:1px;overflow:hidden;border-radius:0 0 22px 22px;background:#b9d5fa;box-shadow:0 23px 48px rgba(17,77,154,.12)}.lab-aside{padding:34px;background:#061738;color:#fff}.lab-aside .eyebrow{color:#7bb7ff}.lab-aside h3{max-width:315px;margin:17px 0;font-size:clamp(2rem,3.2vw,3.4rem);line-height:.94;letter-spacing:-.047em}.lab-aside p{max-width:325px;margin:0;color:#b6c9e7;font-size:14px;line-height:1.55}.signal-tabs{display:flex;gap:7px;margin-top:25px}.signal-tab{padding:9px 10px;border:1px solid rgba(155,198,255,.27);border-radius:10px;background:transparent;color:#d8e9ff;font-size:10px;font-weight:900;letter-spacing:.05em;cursor:pointer}.signal-tab.active{background:#fff;color:#071229}.lab-detail{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:#c6ddfb}.lab-cell{min-height:154px;padding:25px;background:#f8fbff}.lab-cell small{display:block;color:#347ce8;font-size:10px;letter-spacing:.13em;text-transform:uppercase;font-weight:900}.lab-cell b{display:block;margin-top:15px;font-size:21px;line-height:1.08;letter-spacing:-.035em}.lab-cell p{margin:9px 0 0;color:#566b86;font-size:13px;line-height:1.5}.lab-wave{grid-column:1/-1;min-height:108px;padding:22px 25px;background:linear-gradient(100deg,#eff7ff,#fff)}.lab-wave .wave-line{height:48px;margin-top:10px;background:repeating-linear-gradient(90deg,transparent 0 8px,#186ced 8px 10px,transparent 10px 16px);mask:radial-gradient(ellipse at center,#000 0 21%,transparent 22% 35%,#000 36% 61%,transparent 62%)}.compound{position:relative;overflow:hidden;padding:108px 0;background:#f5faff}.compound:before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(38,103,193,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(38,103,193,.04) 1px,transparent 1px);background-size:34px 34px}.compound .shell{position:relative}.compound-head{display:grid;grid-template-columns:.8fr 1.2fr;gap:56px;align-items:end;margin-bottom:46px}.compound-head h2{margin:14px 0 0;font-size:clamp(2.5rem,4vw,4.55rem);line-height:.95;letter-spacing:-.047em}.compound-head p{max-width:560px;margin:0;color:var(--muted);line-height:1.65}.compound-paths{display:grid;gap:16px}.compound-path{display:grid;grid-template-columns:210px 1fr 190px;gap:20px;align-items:center;padding:22px 24px;border:1px solid #c8defa;background:#fff;box-shadow:0 15px 31px rgba(27,83,151,.07)}.compound-path.bad{border-left:4px solid #ff836d}.compound-path.good{border-left:4px solid #176cee}.compound-label small{color:#497298;font-size:10px;letter-spacing:.12em;text-transform:uppercase;font-weight:900}.compound-label b{display:block;margin-top:7px;font-size:20px;letter-spacing:-.035em}.compound-signal{display:flex;align-items:center;gap:8px;min-width:0}.compound-token{flex:1;min-width:0;padding:10px 8px;border-radius:9px;background:#f0f5fb;color:#36506f;font-size:10px;text-align:center;font-weight:900;white-space:nowrap}.bad .compound-token:nth-child(even){background:#fff0ed;color:#d95a45}.good .compound-token{background:#e7f1ff;color:#176cee}.compound-result{font-size:11px;line-height:1.45;color:#526b87}.compound-result b{display:block;color:var(--ink);font-size:12px}.catalog-event{position:relative}.catalog-event img{border-radius:2px}.catalog-meta{display:flex;justify-content:space-between;gap:8px;margin-top:5px;color:#66809f;font-size:9px}.catalog-event .state{margin-top:11px}.catalog-event .event-runtime{display:block;margin-top:5px;color:#6d84a0;font-size:10px}.discovery-stage.catalog-field{grid-template-columns:1fr .7fr 1.25fr;gap:20px}.catalog-stack{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.catalog-stack.new{grid-template-columns:repeat(4,1fr)}.catalog-stack img{width:100%;aspect-ratio:1;object-fit:cover;border:1px solid rgba(161,202,255,.28);border-radius:8px;box-shadow:0 12px 22px rgba(0,0,0,.22)}.catalog-stack img:nth-child(2),.catalog-stack img:nth-child(5){transform:translateY(15px)}.catalog-stack img:nth-child(3),.catalog-stack img:nth-child(6){transform:translateY(-8px)}.catalog-label{grid-column:1/-1;margin:3px 0 7px;color:#96c6ff;font-size:10px;letter-spacing:.13em;text-transform:uppercase;font-weight:900}.catalog-stack.new .catalog-label{color:#d3e7ff}.discovery-signal-copy{position:absolute;z-index:2;bottom:-27px;left:50%;width:205px;transform:translateX(-50%);color:#afd2ff;font-size:9px;line-height:1.35;text-transform:uppercase;letter-spacing:.08em}.history .events{grid-template-columns:repeat(4,1fr)}@media(max-width:850px){.signal-lab,.compound-head{grid-template-columns:1fr}.compound-path{grid-template-columns:1fr;gap:14px}.compound-signal{overflow-x:auto;padding-bottom:3px}.discovery-stage.catalog-field{grid-template-columns:1fr}.catalog-stack.new{grid-template-columns:repeat(4,1fr)}.history .events{grid-template-columns:repeat(2,1fr)}}@media(max-width:560px){.device-react{right:-10px;width:83%}.device-cover{left:16px;width:45%}.device-track{right:12px}.signal-lab{border-radius:0}.lab-detail{grid-template-columns:1fr}.lab-wave{grid-column:auto}.compound{padding:78px 0}.compound-path{padding:20px 17px}.catalog-stack{grid-template-columns:repeat(3,1fr)}.catalog-stack.new{grid-template-columns:repeat(3,1fr)}.catalog-stack img:nth-child(n+5){display:none}.history .events{grid-template-columns:1fr}.history .catalog-event{display:grid;grid-template-columns:98px 1fr;gap:0 13px}.history .catalog-event time{grid-column:2}.history .catalog-event img{grid-row:1/span 6;margin:0}.history .catalog-event h3{margin-top:8px}.history .catalog-event .catalog-meta,.history .catalog-event .event-runtime,.history .catalog-event .state{grid-column:2}}
