@font-face{font-family:Momo Signature;src:url(/assets/MomoSignature-Regular-HXsmjSEh.ttf)format("truetype");font-style:normal;font-weight:400;font-display:swap}:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--page:#fff8f4;--surface:#fafaf6;--paper:#fffdf7;--paper-shadow:#e9e5da;--ink:#1d1c19;--ink-soft:#5b5a53;--line:#d7d9d1;--line-strong:#c4c7bd;--accent:#ff5a36;--accent-hover:#f04f2c;--accent-soft:#ffe0d6;--hero-scribble-color:#ff5a36;--radius-large:30px;--radius-medium:20px;--radius-control:14px;--shadow-soft:0 28px 80px #2d2c241a;--shadow-lifted:0 18px 48px #2d2c241f;font-synthesis:none;text-rendering:optimizelegibility}*{box-sizing:border-box}html{background:var(--page);min-width:320px}body{background-color:var(--page);min-width:320px;min-height:100dvh;color:var(--ink);-webkit-font-smoothing:antialiased;background-image:url(/air-ink-background.svg?v=5);background-position:top;background-repeat:no-repeat;background-size:cover;margin:0;font-family:Avenir Next,Avenir,Helvetica Neue,sans-serif;overflow-x:hidden}button{font:inherit}button:focus-visible{outline-offset:3px;outline:3px solid #ff5a3657}.appShell{width:min(100%,1480px);min-height:100dvh;margin:0 auto;padding:0 clamp(20px,3vw,48px) clamp(32px,5vw,72px)}.topbar{grid-template-columns:auto minmax(260px,1fr) auto;align-items:center;gap:24px;min-height:74px;display:grid;position:relative}.topbarDivider{width:100%;height:8px;color:var(--accent);pointer-events:none;position:absolute;bottom:-3px;left:0;right:0;overflow:visible}.topbarDividerShapeMobile{display:none}.topbarDividerStroke{fill:none;stroke:url(#topbar-divider-gradient);stroke-linecap:round;vector-effect:non-scaling-stroke}.topbarDividerStrokeMain{stroke-width:1.4px}.topbarDividerStrokeTexture{stroke-width:.8px;opacity:.42}.brand,.privacyNote,.controlButton,.exportFeedback{align-items:center;display:inline-flex}.brand{gap:11px}.brandMark{border-radius:var(--radius-control);background:var(--accent);width:40px;height:40px;color:var(--ink);flex:none;place-items:center;display:grid;box-shadow:inset 0 1px #ffffff61}.brandName{letter-spacing:.015em;font-family:Momo Signature,Avenir Next,sans-serif;font-size:27px;line-height:.88}.privacyNote{color:var(--ink-soft);white-space:nowrap;gap:8px;font-size:13px;font-weight:600}.headerStatement{width:auto;min-height:2.7em;color:var(--ink);letter-spacing:-.018em;text-align:left;text-wrap:balance;white-space:nowrap;justify-self:start;align-items:center;margin:0;padding-left:18px;font-size:clamp(12px,.9vw,14px);font-weight:520;line-height:1.35;display:flex;position:relative}.headerStatementText{min-width:0}.headerStatement:before{content:"";background:var(--accent);border-radius:999px;width:3px;position:absolute;top:.18em;bottom:.18em;left:0}.headerStatement strong{font-weight:700}.statementFinish{background:linear-gradient(to top, var(--accent-soft) 0, var(--accent-soft) 38%, transparent 38%, transparent 100%);-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-inline:.05em;font-weight:650}.privacyNote svg{color:var(--accent-hover)}.workspace{--workspace-column-gap:clamp(32px, 2.5vw, 38px);--workspace-row-gap:clamp(24px, 1.8vw, 28px);--workspace-top-space:clamp(30px, 4vh, 46px);column-gap:var(--workspace-column-gap);row-gap:var(--workspace-row-gap);min-height:calc(100dvh - 74px);padding-top:var(--workspace-top-space);grid-template:"intro stage""camera stage"1fr/minmax(300px,.72fr) minmax(620px,1.62fr);align-items:stretch;display:grid}.introPanel{grid-area:intro;align-self:end;padding:8px clamp(2px,.8vw,12px) 4px;container-type:inline-size}.heroTitle{letter-spacing:-.068em;max-width:none;margin:0;font-size:clamp(3.25rem,17.5cqi,4.8rem);font-weight:650;line-height:.92}.heroLine{white-space:nowrap;display:block}.heroTitle em{color:var(--accent-hover);font-family:inherit;font-style:italic;font-weight:inherit}.heroScribble{width:min(92%,360px);height:clamp(36px,11cqi,50px);color:var(--hero-scribble-color);mix-blend-mode:multiply;pointer-events:none;margin:clamp(8px,2cqi,12px) 0 0 clamp(2px,1.5cqi,8px);display:block;overflow:visible}.heroScribbleShapeTablet,.heroScribbleShapeMobile{display:none}.heroScribbleStroke{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round}.heroScribbleStrokeMain{stroke-width:13px;opacity:.18}.heroScribbleStrokeTexture{stroke-width:4px;opacity:.12}.cameraPanel,.stage{border:1px solid var(--line);background:var(--surface)}.cameraPanel{border-radius:var(--radius-medium);grid-area:camera;align-self:start;gap:13px;padding:14px;display:grid;box-shadow:0 12px 36px #2d2c240f}.actionDock{align-items:center;display:flex}.videoFrame{aspect-ratio:16/9;border-radius:calc(var(--radius-medium) - 4px);background:#272621;border:1px solid #1d1c1929;position:relative;overflow:hidden}.cameraPreview{object-fit:cover;width:100%;height:100%;display:block;transform:scaleX(-1)}.videoPlaceholder{color:#e9e8e2;text-align:center;background:radial-gradient(circle at 50% 35%,#ffffff1a,#0000 45%),#272621;place-content:center;justify-items:center;gap:10px;font-size:12px;font-weight:650;display:grid;position:absolute;inset:0}.videoPlaceholder svg{color:var(--accent)}.inlineError{border-radius:var(--radius-control);background:var(--accent-soft);color:#5a1d11;border:1px solid #f04f2c5c;padding:11px 12px;font-size:12px;font-weight:600;line-height:1.45}.stage{border-radius:var(--radius-large);min-width:0;box-shadow:var(--shadow-soft);grid-area:stage;align-self:start;overflow:hidden}.stageBody{display:flow-root}.drawingSurface{aspect-ratio:16/10;border-radius:var(--radius-medium);background:radial-gradient(circle at 12% 10%, #ff5a360e, transparent 34%), linear-gradient(150deg, var(--paper) 0%, #f8f5eb 100%);border:1px solid #5c57482e;margin:18px 18px 0;position:relative;overflow:hidden;box-shadow:inset 0 1px #ffffffad,inset 0 -24px 70px #b4a98e14}.drawingSurface:before{content:"";z-index:0;pointer-events:none;opacity:.24;background-image:radial-gradient(#5148361f .45px,#0000 .45px);background-size:7px 7px;position:absolute;inset:0}.signatureGuide{z-index:1;pointer-events:none;gap:8px;display:grid;position:absolute;bottom:14%;left:7%;right:7%}.signatureGuideLabel{color:#1d1c1970;letter-spacing:.12em;text-transform:uppercase;font-size:10px;font-weight:750}.signatureGuideLine{background:linear-gradient(90deg,#1d1c191f,#1d1c1952 15% 85%,#1d1c191f);height:1px}.canvasPrompt{z-index:3;border-radius:var(--radius-medium);width:min(78%,440px);box-shadow:var(--shadow-lifted);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);pointer-events:none;background:#fafaf6d6;border:1px solid #433e3121;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:16px;padding:18px;display:grid;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.gestureIcon{border-radius:calc(var(--radius-medium) - 4px);background:var(--accent-soft);width:56px;height:56px;color:var(--accent-hover);place-items:center;display:grid}.canvasPrompt h3{letter-spacing:-.025em;margin:0;font-size:clamp(17px,1.5vw,22px);font-weight:750;line-height:1.15}.canvasPrompt p{max-width:36ch;color:var(--ink-soft);margin:7px 0 0;font-size:13px;line-height:1.5}.ink{z-index:2;background:0 0;width:100%;height:100%;position:absolute;inset:0}.inkLive{pointer-events:none}.airInkCursor{z-index:4;opacity:0;pointer-events:none;transform-origin:86.25% 25.42%;-webkit-user-select:none;user-select:none;will-change:transform;width:18px;height:18px;transition:opacity 80ms;position:absolute;top:0;left:0;transform:translate(-40px,-40px)rotate(180deg)}.airInkCursor.isVisible{opacity:.92}.airInkCursor.isDrawing{opacity:1}.actionDock{justify-content:flex-end;gap:10px;min-height:78px;padding:16px 22px 18px}.controlButton{border:1px solid var(--line-strong);border-radius:var(--radius-control);background:var(--surface);min-height:46px;color:var(--ink);white-space:nowrap;cursor:pointer;justify-content:center;gap:8px;padding:0 16px;font-size:13px;font-weight:750;line-height:1;transition:background-color .18s,border-color .18s,box-shadow .18s,opacity .18s,transform .18s cubic-bezier(.16,1,.3,1);box-shadow:0 5px 14px #2d2c240a}.controlButton:hover:not(:disabled){background:#f3f4ef;border-color:#aeb1a7;transform:translateY(-2px);box-shadow:0 8px 20px #2d2c2414}.controlButton:active:not(:disabled){transform:translateY(0)scale(.98);box-shadow:0 3px 9px #2d2c240f}.controlButton:disabled{opacity:.42;cursor:not-allowed}.controlButton.primary{border-color:var(--accent);background:var(--accent);color:var(--ink);box-shadow:0 9px 22px #f04f2c33}.controlButton.primary:hover:not(:disabled){border-color:var(--accent-hover);background:var(--accent-hover);box-shadow:0 12px 26px #f04f2c40}.cameraAction{width:100%}.exportButton{border-color:var(--ink);background:var(--ink);color:var(--surface)}.exportButton:hover:not(:disabled){background:#32312c;border-color:#32312c}.exportFeedback{color:var(--ink-soft);order:-1;gap:7px;margin-right:auto;font-size:12px;font-weight:700}.exportFeedback svg{color:var(--accent-hover)}.spinner{flex:none}@media (prefers-reduced-motion:no-preference){.brand,.privacyNote,.introPanel,.cameraPanel,.stage{opacity:0;animation:.7s cubic-bezier(.16,1,.3,1) forwards surface-enter}.privacyNote{animation-delay:70ms}.introPanel{animation-delay:.11s}.cameraPanel{animation-delay:.18s}.stage{animation-delay:.23s}.spinner{animation:.9s linear infinite spin}.gestureIcon svg{transform-origin:55% 65%;animation:2.2s cubic-bezier(.4,0,.2,1) infinite pinch-cue}}@keyframes surface-enter{0%{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pinch-cue{0%,55%,to{transform:rotate(-3deg)scale(1)}25%{transform:rotate(3deg)scale(.9)}}@media (width>=721px){.stage{--dock-overlap:18px;--dock-radius:var(--radius-large);--dock-diameter:60px;box-shadow:none;background:0 0;border:0;border-radius:0;overflow:visible}.stageBody{z-index:0;padding-bottom:var(--dock-overlap);border:1px solid var(--line);border-radius:var(--dock-radius) var(--dock-radius) 0 var(--dock-radius);background:var(--surface);box-shadow:var(--shadow-soft);position:relative}.actionDock{z-index:1;width:max-content;max-width:calc(100% - var(--dock-radius));margin:calc(0px - var(--dock-overlap)) 0 0 auto;border:0;border-right:1px solid var(--line);border-bottom:1px solid var(--line);border-radius:0 0 var(--dock-radius) var(--dock-radius);background:var(--surface);position:relative;box-shadow:14px 24px 44px #2d2c2414}.actionDock:before{content:"";top:calc(var(--dock-overlap) - 1px);width:var(--dock-radius);height:var(--dock-radius);background:radial-gradient(circle var(--dock-radius) at 0 100%, transparent calc(var(--dock-radius) - .5px), var(--line) calc(var(--dock-radius) - .25px) var(--dock-radius), var(--surface) calc(var(--dock-radius) + .5px));pointer-events:none;position:absolute;right:100%}.actionDock:after{content:"";top:calc(var(--dock-overlap) + var(--dock-radius) - 1px);width:1px;height:calc(100% - var(--dock-overlap) - var(--dock-diameter) + 1px);background:var(--line);pointer-events:none;position:absolute;left:-1px}}@media (width<=1180px){.headerStatement{font-size:12px}.workspace{grid-template-columns:minmax(270px,.75fr) minmax(520px,1.45fr)}}@media (width>=721px) and (width<=1000px){.headerStatement{white-space:normal;width:min(100%,50ch)}}@media (width>=921px) and (height<=880px){.stage{--dock-overlap:8px}.workspace{--workspace-top-space:clamp(26px, 3.5vh, 30px)}.heroTitle{font-size:clamp(3rem,16.5cqi,4.5rem)}.cameraPanel{gap:9px;padding:12px}.videoFrame{aspect-ratio:2}.cameraPreview{object-fit:contain}.drawingSurface{aspect-ratio:16/9;margin-inline:14px}.actionDock{min-height:68px;padding:11px 18px 13px}.controlButton{min-height:42px}}@media (width<=920px){.appShell{padding-inline:22px}.workspace{--workspace-column-gap:24px;--workspace-row-gap:24px;--workspace-top-space:32px;grid-template-rows:auto auto;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-areas:"intro camera""stage stage";min-height:auto}.introPanel{align-self:center;width:100%;padding-bottom:6px;container-type:inline-size}.heroTitle{text-wrap:balance;max-width:none;font-size:clamp(3.75rem,20cqi,5.5rem)}.heroLine{white-space:normal;display:inline}.heroScribble{width:min(96%,360px);height:clamp(34px,10cqi,48px);margin-top:clamp(8px,2cqi,12px)}.heroScribbleShapeWide{display:none}.heroScribbleShapeTablet{display:inline}.cameraPanel,.stage{align-self:start}.cameraPanel{justify-self:stretch;width:100%}.canvasPrompt{width:min(86%,420px)}.actionDock{flex-wrap:wrap}.exportFeedback{order:1;width:100%;margin:2px 0 0}}@media (width<=720px){.appShell{padding-inline:16px;padding-bottom:36px}.topbar{grid-template-columns:auto minmax(0,1fr);grid-template-areas:"brand statement";gap:clamp(14px,4.5vw,22px);min-height:68px;padding:14px 0}.topbarDividerShapeWide{display:none}.topbarDividerShapeMobile{display:inline}.brand{grid-area:brand}.headerStatement{white-space:normal;grid-area:statement;justify-self:stretch;width:100%;padding-left:clamp(10px,3vw,14px);font-size:clamp(10px,2.8vw,12px);line-height:1.35}.brandMark{width:36px;height:36px}.brandName{font-size:24px}.privacyNote{display:none}.workspace{--workspace-column-gap:0px;--workspace-row-gap:24px;--workspace-top-space:26px;grid-template-columns:1fr;grid-template-areas:"intro""camera""stage"}.introPanel{--mobile-hero-size:clamp(1.75rem, 9.5cqi, 4.25rem);align-self:stretch;padding:4px 2px}.heroTitle{max-width:none;font-size:var(--mobile-hero-size);text-align:center;white-space:nowrap;text-wrap:nowrap}.heroLine{white-space:inherit;display:inline}.heroScribble{width:min(9.3em,100%);height:clamp(26px,9cqi,34px);font-size:var(--mobile-hero-size);margin:5px auto 0}.heroScribbleShapeTablet{display:none}.heroScribbleShapeMobile{display:inline}.cameraPanel{justify-self:center;width:min(100%,520px)}.drawingSurface{border-radius:calc(var(--radius-medium) - 4px);margin:10px 10px 0}.canvasPrompt{text-align:center;grid-template-columns:1fr;justify-items:center;gap:10px;width:min(88%,390px);padding:14px}.gestureIcon{width:46px;height:46px}.gestureIcon svg{width:30px;height:30px}.canvasPrompt h3{font-size:16px}.canvasPrompt p{display:none}.signatureGuide{bottom:12%;left:8%;right:8%}.actionDock{grid-template-columns:.75fr 1.25fr;gap:8px;padding:12px 12px 14px;display:grid}.controlButton{min-width:0;padding-inline:12px}.exportFeedback{grid-column:1/-1}}@media (width<=410px){.controlButton{font-size:12px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
