*{box-sizing:border-box}html{background:#fcf8f4;color:#493940;font-family:Arial,'Segoe UI',sans-serif}body{margin:0}button,input,a{-webkit-tap-highlight-color:transparent}button,a,input{touch-action:manipulation}button{font:inherit;cursor:pointer;border:0;color:inherit}button:disabled{opacity:.4;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #8c6475;outline-offset:4px}a{color:inherit;text-decoration:none}h1,h2,h3,p{margin:0}p{line-height:1.75}button{min-height:44px}button:hover:not(:disabled){filter:brightness(.96)}.topbar{max-width:1240px;margin:auto;padding:27px 40px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #e4d9d5}.brand{font:28px Georgia,serif;direction:ltr}.brand small{display:block;text-align:center;font:8px Arial;letter-spacing:3px;margin-top:9px}.topbar>button{background:transparent;font-size:13px}.intro{text-align:center;padding:48px 20px 34px}.eyebrow{font:9px Arial;letter-spacing:2px;display:block;color:#a37b83;margin-bottom:15px}.intro h1{font-size:clamp(34px,4vw,50px);font-weight:500;letter-spacing:-1.5px}.intro p{font-size:15px;color:#86767b;margin-top:15px}.workspace{max-width:1100px;margin:auto;padding:0 30px 55px;display:grid;grid-template-columns:1.1fr 1fr;gap:45px;align-items:start}.mirror{height:540px;background:#eadeda;position:relative;overflow:hidden;border-radius:170px 170px 10px 10px;border:1px solid #d8c3c1}.preview-layers{position:absolute;inset:0;overflow:hidden;transform:scaleX(-1)}.preview-layers video{position:absolute;width:100%;height:100%;object-fit:cover}.preview-layers canvas{position:absolute;pointer-events:none}#renderCanvas{z-index:1}#lashCanvas{z-index:2}.welcome{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:80px 45px 60px;background:radial-gradient(ellipse at top,#fff7f1,#e6d7d3);z-index:4}.welcome[hidden]{display:none}.mirror-icon{display:flex;gap:25px;justify-content:center;font:65px Georgia;line-height:.5;color:#b8999c;border:1px solid #ceb5b4;border-radius:50%;height:95px;width:95px;align-items:center;margin-bottom:28px;padding-bottom:15px}.mirror-icon span{font-size:35px}.welcome h2{font-size:24px;font-weight:500;margin-bottom:15px}.welcome p{font-size:13px;color:#8c777e;max-width:300px}.primary{display:inline-flex;justify-content:center;align-items:center;min-height:46px;padding:14px 28px;background:#78565f;color:#fff8f1;border-radius:30px;font-size:14px}.welcome .primary{margin-top:25px;min-width:210px}.photo-upload{margin-top:19px;text-decoration:underline;text-underline-offset:5px;cursor:pointer;font-size:13px;padding:8px;display:block}.sample-link{background:transparent;font-size:11px;color:#a18187;min-height:30px}.mirror-status{position:absolute;bottom:16px;left:50%;transform:translateX(-50%);z-index:5;font-size:11px;white-space:nowrap;background:#fffaf4df;backdrop-filter:blur(8px);padding:9px 16px;border-radius:20px;max-width:95%;white-space:normal;text-align:center;line-height:1.5}.mirror-status.error{color:#9c4141;background:#fff0ed}.mirror-actions{display:flex;justify-content:space-between;gap:8px;margin-top:14px}.mirror-actions button{background:transparent;border:1px solid #d9c9c7;border-radius:25px;padding:8px 15px;font-size:12px;flex:1}.mirror-actions .capture{background:#78565f;color:#fff8f1;border-color:#78565f}.privacy{text-align:center;font-size:10px;color:#a38d92;margin-top:15px}.split-labels{position:absolute;inset:35px 20px auto;display:flex;justify-content:space-between;z-index:3;direction:ltr;font-size:11px;color:#fff;text-shadow:0 1px 5px #000}.split-labels[hidden],.split-control[hidden],#split-line[hidden]{display:none}.split-control{display:flex;gap:15px;align-items:center;margin-top:20px;font-size:11px}.split-control input{flex:1;direction:ltr}#split-line{position:absolute;left:50%;top:0;bottom:0;border-left:1px solid #fff9;z-index:3;pointer-events:none}.controls-panel{padding-top:18px}.controls-heading{position:relative;padding-inline-end:60px}.controls-heading h2{font-size:27px;font-weight:500;letter-spacing:-.5px}.controls-heading>button{position:absolute;inset-inline-end:0;bottom:0;background:transparent;font-size:12px;color:#a4848b}.presets{display:flex;gap:8px;margin:25px 0 22px}.presets button{flex:1;border:1px solid #dac9ca;border-radius:22px;background:transparent;font-size:13px;padding:8px 12px}.presets button.active{background:#78565f;border-color:#78565f;color:#fff8f1}.effects{border-top:1px solid #e2d4d2}.effect{border-bottom:1px solid #e2d4d2;padding:20px 0}.effect-head{display:flex;align-items:center;gap:13px}.effect-mark{height:40px;width:40px;border:1px solid #e1d0ce;border-radius:50%;display:grid;place-items:center;color:#a98690;font:25px Georgia}.effect-head>div{flex:1}.effect h3{font-size:16px;font-weight:500}.effect h3 small{font:7px Arial;color:#b18c93;letter-spacing:1px;padding-inline-start:7px}.effect p{font-size:11px;color:#a38d92;margin-top:5px}.toggle{position:relative;width:40px;height:24px;flex:0 0 40px;cursor:pointer}.toggle input{position:absolute;inset:0;margin:0;opacity:0;width:100%;height:100%;cursor:pointer}.toggle span{display:block;width:40px;height:24px;background:#dfd3d2;border-radius:20px;pointer-events:none;transition:.2s}.toggle span:after{content:'';display:block;position:absolute;width:18px;height:18px;border-radius:50%;background:#fffaf5;top:3px;left:3px;box-shadow:0 1px 3px #0002;transition:.2s}.toggle input:checked+span{background:#8d686f}.toggle input:checked+span:after{left:19px}.toggle input:focus-visible+span{outline:3px solid #8c6475;outline-offset:4px}.effect-options{padding:15px 0 0;display:none}.effect.enabled .effect-options{display:block}.effect-options>label{display:grid;grid-template-columns:50px 1fr 25px;align-items:center;gap:12px;margin-top:11px;font-size:11px;color:#9b7b83}.effect-options output{font:10px Arial;text-align:end}input[type=range]{width:100%;accent-color:#9f7781;height:25px;cursor:pointer}.swatches{display:flex;gap:14px;direction:ltr;margin-bottom:15px}.swatches button{min-height:0;width:29px;height:29px;border-radius:50%;background:var(--swatch);border:3px solid #fcf8f4;outline:1px solid #e2d4d2}.swatches button[aria-pressed=true]{outline:2px solid #a7868e;outline-offset:3px}.booking{display:flex;flex-direction:column;gap:15px;margin-top:28px;background:#eee2df;padding:22px;border-radius:10px}.booking h3{font-size:16px;font-weight:500}.booking p{font-size:12px;color:#9b7b83;margin-top:7px}.booking button{background:transparent;border-top:1px solid #d8c1c1;font-size:13px;padding-top:14px;text-align:start}.simulation-note{font-size:10px;color:#a18a90;margin-top:17px}.diagnostics{font-size:11px;color:#9b828b;margin-top:25px;border-top:1px solid #e2d4d2;padding-top:15px}.diagnostics summary{cursor:pointer}.diagnostics>div{direction:ltr;margin-top:12px;font:10px monospace}.diagnostics p{font-size:10px;margin-top:10px}.diagnostics a{display:block;font-size:10px;margin-top:12px;text-decoration:underline}footer{border-top:1px solid #e4d9d5;display:flex;justify-content:space-between;gap:20px;max-width:1240px;margin:auto;padding:25px 40px;font-size:10px;color:#a18a90}footer>span{direction:ltr}dialog{border:1px solid #d8c3c1;border-radius:20px;background:#fcf8f4;padding:30px;max-width:430px;width:90%;color:#62454d;text-align:center}dialog::backdrop{background:#352a32aa;backdrop-filter:blur(5px)}dialog h2{font-size:24px;font-weight:500;margin-bottom:20px}dialog img{width:100%;max-height:55vh;object-fit:contain;border-radius:10px;margin-bottom:20px}dialog p{font-size:11px;color:#9b828b;margin-top:15px}.close{position:absolute;top:5px;right:12px;background:transparent;font-size:26px}#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:#78565f;color:#fff8f1;padding:15px 25px;z-index:20;border-radius:25px;font-size:13px;opacity:0;pointer-events:none;max-width:90%;text-align:center}#toast.show{opacity:1}
@media(max-width:800px){.workspace{gap:25px;padding-inline:20px}.mirror{height:470px;border-radius:120px 120px 10px 10px}.welcome{padding-inline:25px}.intro{padding-top:35px}.controls-heading h2{font-size:23px}.mirror-actions{flex-wrap:wrap}.mirror-actions button{font-size:11px;padding:8px 10px}}
@media(max-width:600px){.topbar{padding:20px 25px}.brand{font-size:25px}.intro{padding:28px 20px}.intro h1{font-size:35px}.intro p{font-size:13px}.workspace{display:flex;flex-direction:column;padding:0 20px 30px;gap:20px}.mirror-panel,.controls-panel{width:100%}.mirror{height:440px;border-radius:135px 135px 10px 10px;max-width:440px;margin:auto}.welcome{padding:60px 30px 45px}.welcome h2{font-size:23px}.mirror-icon{height:75px;width:75px;margin-bottom:20px}.welcome .primary{margin-top:20px}.mirror-actions{gap:7px}.controls-heading{padding-inline-end:60px}.controls-heading h2{font-size:25px}.diagnostics{margin-top:17px}.presets{margin-block:20px}.effect{padding-block:17px}.effect-head{gap:15px}.effect h3{font-size:17px}.effect p{font-size:12px}.effect-options>label{grid-template-columns:55px 1fr 25px;font-size:12px}.effect-options input{height:32px}.booking{margin-top:22px}footer{padding:25px;flex-wrap:wrap;font-size:10px}.simulation-note{font-size:11px}.split-control{font-size:12px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
