@import url('../salon/salon.css');
body.moments{--pad:clamp(23px,4.7vw,84px)}
.moments .specimen-form.material-velvet{color:#d3bec7}
.moments .specimen-form.material-iris{color:#c3c1d7}
.moments .specimen-form.material-neroli{color:#d3dbb2}
.moments .arrival h1{font-size:clamp(61px,7.3vw,106px);max-width:900px}
.moments .arrival .lede{max-width:470px}
.intention-field{max-width:650px;margin:38px 0 32px;padding-top:22px;border-top:1px solid var(--line)}
.intention-field h2,.note-shaping h3,.meaning-question h3{font-size:19px;font-weight:400;letter-spacing:-.025em;margin:0 0 14px}
.intention-options,.shape-options,.meaning-options{display:flex;flex-wrap:wrap;gap:8px 23px}
.intention-options button,.shape-options button,.meaning-options button{font-size:12px;min-height:44px;border-bottom:1px solid #eee9df25;color:var(--muted)}
.intention-options button[aria-pressed="true"],.shape-options button[aria-pressed="true"],.meaning-options button[aria-pressed="true"]{color:var(--bone);border-bottom-color:var(--bone)}
.note-shaping{border-top:1px solid var(--line);margin:23px 0;padding:22px 0 0;max-width:660px}
.note-shaping p,.meaning-question p{font-size:12px;color:var(--muted);line-height:1.85;max-width:570px}
.meaning-question{margin:24px 0 15px;padding:20px 0;max-width:700px;border-top:1px solid var(--line)}
.contrast-invitation{max-width:860px;margin:40px 0 20px;padding-top:24px;border-top:1px solid var(--line)}
.contrast-invitation h2{font-size:30px;letter-spacing:-.035em;font-weight:400;margin:0 0 14px}
.contrast-invitation>p{font-size:13px;color:var(--muted);max-width:550px;line-height:1.8}
.contrast-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.contrast-offer{text-align:left;display:grid;align-content:start;gap:10px;border-bottom:1px solid var(--line);padding:15px 0;min-height:100px}
.contrast-offer span{font-size:13px}.contrast-offer small{font-size:11px;line-height:1.8;color:var(--muted)}
.moment-room{padding-top:clamp(36px,6vh,84px)}
.moments[data-view="portrait"] #environment{opacity:.16}
.moment-reveal{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,.95fr);gap:clamp(24px,5vw,90px);align-items:center;max-width:1400px}
.moment-reveal .salon-copy{max-width:630px}.moment-reveal .salon-copy h1{font-size:clamp(45px,4.7vw,73px)}
.identity-display{max-width:610px;position:relative}
.living-form{position:relative;isolation:isolate;border-radius:48%;outline:none;touch-action:pan-y;-webkit-tap-highlight-color:transparent}
.living-form:focus-visible{outline:1px solid #d7ccae66;outline-offset:5px}
.form-companionship{display:flex;align-items:center;gap:16px;justify-content:space-between;margin:0 auto;max-width:490px;padding:0 14px}
.form-companionship p{max-width:315px;font-size:11px;color:#bcb8a8;line-height:1.85;margin:0}
.form-companionship button{font-size:10px;min-height:44px;flex-shrink:0;color:#d6d0bd;border-bottom:1px solid #eee9df30}
.form-keyboard-hint{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.takeaway-actions .living-takeaway{flex-basis:100%;text-align:left;font-size:15px;letter-spacing:-.02em;min-height:54px;border-block:1px solid #eee9df30;color:#eee9df;margin-bottom:8px}
.living-takeaway::after{content:'↗';display:inline-block;margin-left:18px;font-size:12px}
.living-takeaway:disabled{color:var(--dim)}
.moments .living-takeaway-note{max-width:420px;line-height:1.85}
.moment-identity{width:100%;height:auto;display:block;max-height:670px}
.identity-display .moment-identity{animation:identity-arrive 2.8s ease both}
.identity-caption{font-size:10px;color:var(--muted);line-height:1.85;text-align:center;max-width:440px;margin:-5px auto 0}
.moment-traits{display:flex;flex-wrap:wrap;gap:12px 20px;margin:26px 0 0;font-size:10px;text-transform:uppercase;letter-spacing:.13em;color:#c5c4b6}
.moment-witness{margin-top:34px;max-width:550px}
.moment-witness .eyebrow{font-size:9px;color:var(--muted)}
.moment-witness .comparison-actions button{font-size:11px}
.moment-keepsake{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.85fr);gap:clamp(30px,6vw,90px);max-width:1170px;margin-top:70px;padding-top:32px;border-top:1px solid var(--line)}
.moment-keepsake h2{font-size:31px;font-weight:400;letter-spacing:-.035em;max-width:520px;margin-bottom:25px}
.moment-keepsake label{display:block;font-size:12px;color:#d5d2c5;margin-bottom:12px}
.moment-keepsake input,.moment-keepsake textarea{display:block;width:100%;background:transparent;border:0;border-bottom:1px solid #eee9df45;border-radius:0;color:var(--bone);padding:13px 0;font:inherit;box-sizing:border-box}
.moment-keepsake input{font-size:21px}.moment-keepsake textarea{font-size:13px;min-height:90px;resize:vertical;line-height:1.8;margin-bottom:23px}
.moment-keepsake input::placeholder,.moment-keepsake textarea::placeholder{color:#aaa89b}
.moment-keepsake .save-actions{margin:24px 0}.moment-keepsake .small{max-width:500px;line-height:1.8}
.moment-keepsake .recognition{padding:0;margin:0;border:0}.moment-keepsake .recognition h2{font-size:22px;margin-bottom:15px}
.moment-keepsake .portrait-body{font-size:15px;line-height:1.9;max-width:550px;color:#cfccbf}
.moment-keepsake .reflection-actions{display:flex;flex-wrap:wrap;gap:8px 16px}
.moment-keepsake .reflection-actions button{font-size:11px;min-height:44px}
.takeaway-actions{display:flex;flex-wrap:wrap;gap:10px 24px;margin:22px 0}.takeaway-actions button{font-size:12px;min-height:44px}
.moments .salon-drawers{margin-top:40px;max-width:1170px}
.moments .salon-invitation{max-width:860px;margin-top:40px}
.moments.listening-only .moment-keepsake,.moments.listening-only .moment-witness,.moments.listening-only .moment-traits,.moments.listening-only .identity-caption,.moments.listening-only .contrast-invitation{display:none}
.moments.listening-only .moment-reveal{grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr)}
.collection-room{padding:50px var(--pad) 160px;max-width:1600px;margin:auto}
.collection-room h1{font-size:clamp(42px,5vw,75px);line-height:1.05;letter-spacing:-.05em;max-width:760px}
.collection-room>.lede{max-width:560px;font-size:15px;line-height:1.9;color:var(--muted)}
.collection-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px;margin:40px 0}
.moment-card{min-width:0;border-top:1px solid var(--line);padding-top:15px}
.moment-card .moment-identity{max-height:390px}.moment-card h2{font-size:21px;font-weight:400;letter-spacing:-.025em;line-height:1.4;overflow-wrap:anywhere;margin:12px 0}
.moment-card p{font-size:11px;line-height:1.8;color:var(--muted);overflow-wrap:anywhere}.moment-card time{font-size:10px;color:var(--muted)}
.moment-card .scene-actions{display:flex;flex-wrap:wrap;gap:8px 20px;margin:14px 0}.moment-card button{font-size:12px;min-height:44px}
.collection-empty{border-top:1px solid var(--line);padding:40px 0;margin:30px 0;max-width:760px;color:var(--muted)}
.collection-toolbar{display:flex;gap:24px;flex-wrap:wrap;margin:26px 0}.collection-toolbar button{min-height:44px;font-size:12px}
.moments #app>.scent-nav{gap:clamp(18px,3vw,50px);flex-wrap:wrap}
.moments #app>.scent-nav button:last-child{margin-left:auto}
@keyframes identity-arrive{from{opacity:.85;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:900px){.moment-reveal{grid-template-columns:1fr 1fr;gap:15px}.moment-reveal .salon-copy h1{font-size:48px}.collection-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.moments .masthead{height:88px}.moments .edition{max-width:145px;font-size:9px}.moments #app>.scent-nav{gap:4px 22px}.moments #app>.scent-nav button{font-size:11px;min-height:41px}.moments #app>.scent-nav button:last-child{margin-left:0}.moment-reveal,.moments.listening-only .moment-reveal{grid-template-columns:1fr}.moment-reveal .salon-copy h1{font-size:48px}.identity-display{max-width:400px;width:100%;margin:0 auto}.moment-identity{max-height:430px}.identity-caption{margin:0 auto}.moment-keepsake{grid-template-columns:1fr;margin-top:38px;gap:30px}.moment-keepsake input{font-size:19px}.contrast-options{grid-template-columns:1fr;gap:0}.contrast-offer{min-height:76px;padding:17px 0;gap:5px}.collection-grid{grid-template-columns:1fr;gap:38px}.collection-room{padding-top:36px}.collection-room h1{font-size:48px}.moment-card .moment-identity{max-height:410px}.moment-traits{margin-top:18px}.moment-room{padding-bottom:160px}.moments .salon-actions{gap:12px 19px}.moments .salon-actions .primary{min-width:190px}.note-shaping{margin-top:20px}.moments .audition-bench .response-row{flex-wrap:wrap}.moments .response-row button{font-size:12px}}
@media(prefers-reduced-motion:reduce){.identity-display .moment-identity{animation:none}}
