/* Layout utilities are compiled from Tailwind. These rules provide the scan artwork and brand details. */
:root { --v4-paper:#faf7f5;--v4-ink:#423943;--v4-sage:#8c6377;--v4-muted:#817680;--v4-line:#e7dde2;--v4-panel:#f4edf0; }
#app-container { background:radial-gradient(ellipse at 100% 10%,#f1e7ed77,transparent 55%),var(--v4-paper); }
.glass-header { min-height:70px; }
.scan-shell { color:var(--v4-ink);padding:0 0 20px; }
.scan-preview-note { font-size:10px;letter-spacing:.025em;color:#82707d;border-bottom:1px solid var(--v4-line);padding:0 0 12px;margin-bottom:20px; }
.scan-steps { display:flex;align-items:center;justify-content:space-between;gap:12px;max-width:650px;margin:0 auto 42px; }
.scan-steps>span { display:flex;align-items:center;gap:10px;font-size:10px;letter-spacing:.04em;color:#b0a4ae; }
.scan-steps b { font-size:10px;font-weight:400;display:grid;place-items:center;width:27px;height:27px;border:1px solid #e3dbe1;border-radius:50%; }
.scan-steps .is-active { color:var(--v4-sage); }.scan-steps .is-active b { border-color:#b69aaa;background:#eee3ea; }
.scan-eyebrow { margin-bottom:22px;color:var(--v4-sage);font-size:10px;font-weight:500;letter-spacing:.16em;text-transform:uppercase; }
.scan-title { font-family:'Playfair Display',Georgia,serif!important;font-size:clamp(40px,4.4vw,66px)!important;line-height:1.12!important;letter-spacing:-.045em;font-weight:400!important;animation:scan-rise .8s both; }
.scan-title em { color:var(--v4-sage);font-weight:400; }
.scan-intro { color:var(--v4-muted);font-size:14px;line-height:1.85; }
.scan-primary { border:1px solid var(--v4-sage);background:var(--v4-sage);color:#fff;min-height:50px;padding:14px 23px;border-radius:12px;font-size:12px;font-weight:500;display:inline-flex;align-items:center;justify-content:center;gap:12px;transition:transform .25s,box-shadow .25s,background .25s; }
.scan-primary:hover { background:#775269;box-shadow:0 9px 28px #8c637726;transform:translateY(-2px); }.scan-primary:focus-visible { outline:3px solid #c7b2c3;outline-offset:4px; }
.scan-primary svg:last-child { margin-left:8px; }.scan-secondary { display:flex;align-items:center;justify-content:center;gap:9px;min-height:49px;border:1px solid #dbccd6;border-radius:11px;background:#fffafc;color:var(--v4-ink);padding:11px;font-size:12px;transition:border-color .2s,background .2s; }
.scan-secondary:hover { border-color:var(--v4-sage);background:#f3eaf0; }
.scan-small { font-size:10px!important;color:var(--v4-muted);line-height:1.7; }
.scan-text-link { display:inline-flex;align-items:center;gap:6px;font-size:11px;color:var(--v4-sage);border-bottom:1px solid #d5c4d0;padding-bottom:3px; }
.scan-benefits { border-top:1px solid var(--v4-line);padding-top:22px; }.scan-benefits>div>span { font-size:10px;color:#b29ba9; }.scan-benefits p { font-size:11px;line-height:1.65;margin-top:7px;max-width:160px; }
.scan-hero-card,.scan-capture-card { background:#fdfbfd;border:1px solid #e5dce4;box-shadow:0 12px 45px #70546d08;animation:scan-rise .9s 100ms both; }
.scan-live { display:inline-flex;align-items:center;gap:6px;font-size:9px;color:var(--v4-muted); }.scan-live i { width:5px;height:5px;border-radius:50%;background:#9b7b92;box-shadow:0 0 0 4px #9b7b9210;animation:scan-pulse 3s infinite; }
.scan-portrait { position:relative;aspect-ratio:1/1.06;overflow:hidden;border-radius:1.4rem;background:#e9dfe7;isolation:isolate; }
.scan-face-image,.scan-portrait video { display:block;width:100%;height:100%;object-fit:cover; }.scan-portrait video { transform:scaleX(-1); }
.scan-portrait:after { content:'';position:absolute;inset:0;background:linear-gradient(180deg,#31243610,transparent 30%,transparent 75%,#31243650);pointer-events:none; }
.scan-face-guide { position:absolute;left:23%;top:15%;width:54%;height:66%;border:1px solid #ffffff70;border-radius:45% 45% 48% 48%;box-shadow:0 0 0 100px #6b527608;pointer-events:none; }
.scan-corner { position:absolute;width:29px;height:29px;border-color:#ffffffd9;border-style:solid;z-index:3; }.scan-corner.tl { top:24px;left:24px;border-width:1.5px 0 0 1.5px;border-top-left-radius:8px; }.scan-corner.tr { top:24px;right:24px;border-width:1.5px 1.5px 0 0;border-top-right-radius:8px; }.scan-corner.bl { bottom:24px;left:24px;border-width:0 0 1.5px 1.5px;border-bottom-left-radius:8px; }.scan-corner.br { bottom:24px;right:24px;border-width:0 1.5px 1.5px 0;border-bottom-right-radius:8px; }
.scan-beam { position:absolute;top:28%;left:10%;width:80%;height:2px;z-index:3;background:linear-gradient(90deg,transparent,#fff,#f2cfea,#fff,transparent);box-shadow:0 0 22px 4px #fff7,0 -17px 45px 20px #f8e6f422;animation:scan-sweep 6s ease-in-out infinite;pointer-events:none; }
.scan-landmarks i { position:absolute;z-index:2;width:7px;height:7px;border:1px solid #fff;background:#e9cedc;border-radius:50%;box-shadow:0 0 0 6px #fff1;animation:scan-pulse 4s ease-in-out infinite; }.scan-landmarks i:nth-child(1){top:37%;left:35%;}.scan-landmarks i:nth-child(2){top:37%;left:61%;animation-delay:.5s;}.scan-landmarks i:nth-child(3){top:49%;left:50%;animation-delay:1s;}.scan-landmarks i:nth-child(4){top:55%;left:32%;animation-delay:1.5s;}.scan-landmarks i:nth-child(5){top:55%;left:65%;animation-delay:2s;}.scan-landmarks i:nth-child(6){top:68%;left:50%;animation-delay:2.5s;}
.scan-visual-label { position:absolute;top:18px;left:50%;transform:translateX(-50%);z-index:4;display:flex;align-items:center;gap:7px;white-space:nowrap;border:1px solid #ffffff65;border-radius:30px;background:#ffffff25;backdrop-filter:blur(10px);padding:7px 12px;color:white;font-size:8px;letter-spacing:.15em;text-transform:uppercase; }
.scan-art-disclosure { position:absolute;bottom:18px;left:50%;transform:translateX(-50%);color:#fffc;font-size:8px;white-space:nowrap;z-index:4;letter-spacing:.04em; }
.scan-hero-caption { color:var(--v4-sage); }.scan-hero-caption strong { font-size:12px;font-weight:500;display:block;color:var(--v4-ink); }.scan-hero-caption p { font-size:9px;color:var(--v4-muted);margin-top:5px;line-height:1.6; }
.scan-sample-btn { border:1px solid #e1d4df;border-radius:10px;padding:10px 14px;display:flex;align-items:center;justify-content:space-between;color:var(--v4-sage);font-size:10px;background:#f5eef4; }
.scan-footer { border-top:1px solid var(--v4-line);padding-top:18px;font-size:9px;color:var(--v4-muted); }.scan-footer button { display:inline-flex;align-items:center;gap:8px; }
.scan-stage-title { font-family:'Playfair Display',Georgia,serif!important;font-size:clamp(29px,3vw,43px)!important;line-height:1.2!important;font-weight:400!important;letter-spacing:-.035em; }
.scan-tip { border:1px solid #e0d4de;background:#f6f0f5;border-radius:7px;padding:6px 9px;display:inline-flex;align-items:center;gap:5px;font-size:10px;color:#8b7284; }
.scan-consent-box { border:1px solid var(--v4-line);background:#f5eff3; }.scan-consent-box label { font-size:11px;line-height:1.7; }
.scan-error { border:1px solid #dcaab9;background:#fff0f3;color:#94536c;font-size:12px;line-height:1.7;padding:12px;border-radius:10px;margin-bottom:18px; }
.scan-field { display:block; }.scan-field>span,.scan-label { display:block;font-size:11px;font-weight:500;margin-bottom:8px;color:var(--v4-ink); }
.scan-field input,.scan-field textarea,.scan-field select { display:block;width:100%;border:1px solid #dbced8;border-radius:10px;background:#fffdfd;padding:12px;color:var(--v4-ink);font-size:13px;line-height:1.7; }.scan-field textarea { resize:vertical; }.scan-field input::placeholder,.scan-field textarea::placeholder { color:#ad9caa!important;-webkit-text-fill-color:#ad9caa!important; }
.scan-field :is(input,textarea,select):focus { outline:2px solid #cbb6c5;outline-offset:2px; }
.scan-concern input { position:absolute;opacity:0;width:1px;height:1px; }.scan-concern span { display:block;padding:7px 10px;border:1px solid #e1d7de;border-radius:8px;background:#fffdfd;font-size:10px;color:var(--v4-muted);cursor:pointer; }.scan-concern input:checked+span { border-color:#b699ad;background:#eee3eb;color:#795c70; }.scan-concern input:focus-visible+span { outline:2px solid #8c6377;outline-offset:2px; }
.scan-analysis-steps li { display:flex;align-items:center;gap:10px;font-size:12px;color:var(--v4-muted);animation:scan-rise .8s both;animation-delay:calc(var(--step) * 250ms); }.scan-analysis-steps li>span { display:block;width:7px;height:7px;background:#b798ad;border-radius:50%;animation:scan-pulse 1.8s infinite;animation-delay:calc(var(--step) * 350ms); }
.scan-chat-context { padding:20px 0;border-bottom:1px solid var(--v4-line); }.scan-chat-context h2 { font-size:11px!important;font-weight:500; }
body[data-v4-view="chat"] .v4-care-canvas { top:70px; }
.is-analyzing .scan-beam { animation-duration:2.5s; }.scan-review-image .scan-beam,.scan-review-image .scan-landmarks { display:none; }
html.dark { --v4-paper:#261f29;--v4-ink:#eee4ec;--v4-sage:#c2a5bc;--v4-muted:#b2a2af;--v4-line:#493a49;--v4-panel:#302633; }
html.dark .scan-hero-card,html.dark .scan-capture-card,html.dark .scan-field :is(input,textarea,select),html.dark .scan-concern span { background:#342a37;border-color:#554153; }
html.dark .scan-consent-box,html.dark .scan-tip,html.dark .scan-sample-btn,html.dark .scan-secondary { background:#3d2f40;color:#dac5d6;border-color:#644d60; }
html.dark .scan-primary { color:#261f29; }.scan-hero-copy>button { max-width:100%; }
@keyframes scan-rise { from{opacity:0;transform:translateY(15px);}to{opacity:1;transform:translateY(0);} }
@keyframes scan-pulse { 0%,100%{opacity:.45;}50%{opacity:1;} }
@keyframes scan-sweep { 0%,100%{top:23%;opacity:.1;}15%,85%{opacity:.9;}50%{top:73%;} }
@media(max-width:760px){
  .glass-header { min-height:60px; }.scan-steps { margin-bottom:25px;gap:5px; }.scan-steps>span { font-size:9px;gap:5px; }.scan-steps b { width:22px;height:22px;font-size:9px; }
  .scan-title { font-size:clamp(37px,9.8vw,54px)!important; }.scan-intro { font-size:13px; }.scan-hero-copy .scan-benefits { margin-top:27px;gap:12px; }
  .scan-hero-copy .scan-benefits>div { display:flex;align-items:baseline;gap:10px; }.scan-benefits p { max-width:none;margin-top:0; }.scan-primary { min-height:49px;font-size:12px;padding:13px 16px; }
  .scan-review-image { max-width:230px;width:100%;margin:auto; }.scan-review-image .scan-portrait { aspect-ratio:1.15; }.scan-field input,.scan-field textarea,.scan-field select { font-size:16px; }
  body[data-v4-view="chat"] .v4-care-canvas { top:auto; }.scan-chat-context { padding:8px 0 14px; }.scan-hero-card { max-width:510px;width:100%;margin:auto; }
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important;}}
body[data-v4-view="chat"] .human-bubble { background:#efe4eb;border-color:#e0cfda; }
body[data-v4-view="chat"] #input-wrapper { border-color:#d6c4d1;background:#fffdfd; }
html.dark body[data-v4-view="chat"] :is(.human-bubble,#input-wrapper,.ai-bubble) { background:#382b3a;border-color:#584253; }
@media(max-width:760px){body[data-v4-view="chat"] .v4-care-canvas:not(:has(.v4-routine li)){display:block;max-height:23dvh;}body[data-v4-view="chat"] .v4-care-canvas:not(:has(.v4-routine li)) .v4-routine{display:none;}body[data-v4-view="chat"] .scan-chat-context{border-bottom:0;}body[data-v4-view="chat"] .v4-canvas-heading{margin-bottom:8px;}}
@media(max-width:767px){.scan-hero-card{display:none;}.scan-mobile-glimpse .scan-portrait{height:174px;aspect-ratio:auto;background:radial-gradient(ellipse at 50% 35%,#eee1e8,#e5d8e2);border-radius:16px;}.scan-mobile-glimpse .scan-face-image{object-fit:contain;object-position:center 24%;}.scan-mobile-glimpse .scan-face-guide{width:23%;left:38.5%;top:11%;height:77%;}.scan-mobile-glimpse .scan-landmarks{display:none;}.scan-mobile-glimpse .scan-beam{width:40%;left:30%;}.scan-mobile-glimpse .scan-visual-label{left:16px;transform:none;top:15px;font-size:7px;}.scan-mobile-glimpse .scan-art-disclosure{left:16px;transform:none;bottom:12px;font-size:7px;}.scan-hero-copy .scan-intro{margin-top:18px;}.scan-hero-copy .scan-primary{margin-top:20px;}.scan-hero-copy .scan-text-link{margin-top:15px;}}
#send-btn{background:var(--v4-sage)!important;color:#fff!important;border-color:var(--v4-sage)!important;box-shadow:none!important;}.v4-save{border-color:#ceb8c8;background:#f0e5ed;color:#795d70;}.v4-save:hover{background:#e8d7e3;}.v4-step-num{color:#a2869a;}
.scan-reflection{background:#f2e8ef;border:1px solid #e1d1dd;}.scan-adjust summary{cursor:pointer;color:var(--v4-sage);font-size:11px;padding:10px 0;}.scan-adjust[open]{border-bottom:1px solid var(--v4-line);padding-bottom:16px;}.v4-orb span{background:linear-gradient(135deg,#c6a8bfaa,#e2cfdbaa);}.v4-orb span:nth-child(3){background:#e6d3e1aa;}html.dark .scan-reflection{background:#3d2f40;border-color:#644d60;}