.mai-hero{overflow:hidden}.mai-hero-content{padding-bottom:24px;padding-top:40px}.mai-hero-title{font-size:36px;line-height:1.12;overflow-wrap:anywhere;text-wrap:balance}.mai-hero-subtitle{font-size:16px;line-height:1.65;margin-top:16px;text-wrap:pretty}.mai-hero-prompt{background:hsl(var(--background));border:1px solid hsl(var(--border));border-radius:8px;box-shadow:0 8px 24px #0000000d;margin-top:24px}.mai-hero-prompt:focus-within{outline:2px solid #0a72ef;outline-offset:3px}.mai-hero-input{background:transparent;border:0;border-radius:8px 8px 0 0;color:inherit;display:block;font-size:16px;height:104px;line-height:1.5;outline:none;padding:18px 20px;resize:none;width:100%}.mai-hero-input::-moz-placeholder{color:hsl(var(--muted-foreground));opacity:1}.mai-hero-input::placeholder{color:hsl(var(--muted-foreground));opacity:1}.mai-hero-prompt-actions{align-items:center;display:flex;gap:12px;justify-content:space-between;padding:0 12px 12px 20px}.mai-hero-submit{align-items:center;background:hsl(var(--foreground));border-radius:6px;color:hsl(var(--background));display:inline-flex;font-size:14px;font-weight:600;gap:10px;justify-content:center;line-height:1.4;min-height:44px;padding:10px 18px;transition:opacity .16s ease}.mai-hero-submit:hover{opacity:.85}.mai-hero-submit:active{opacity:.7}.mai-hero-sample:focus-visible,.mai-hero-submit:focus-visible,.mai-sample-close:focus-visible{outline:2px solid #0a72ef!important;outline-offset:4px}.mai-hero-fan{height:290px;margin:28px auto 0;position:relative;width:min(100%,720px)}.mai-hero-sample{--angle:-12deg;--offset:12px;aspect-ratio:3/4;background:hsl(var(--muted));border:3px solid hsl(var(--background));border-radius:8px;box-shadow:0 8px 18px #00000029;cursor:zoom-in;left:19%;padding:0;position:absolute;top:18px;transform:translate(-50%) translateY(var(--offset)) rotate(var(--angle));transition:transform .18s ease;width:25%}.mai-hero-sample:nth-child(2){--angle:-4deg;--offset:0px;left:40%;z-index:2}.mai-hero-sample:nth-child(3){--angle:4deg;--offset:0px;left:61%;z-index:2}.mai-hero-sample:nth-child(4){--angle:12deg;left:82%}.mai-hero-sample img{border-radius:5px;display:block;height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.mai-hero-sample:focus-visible,.mai-hero-sample:hover{transform:translate(-50%) translateY(-6px) rotate(0);z-index:3}.mai-hero-sample:active{transform:translate(-50%) translateY(-2px) rotate(0)}.mai-sample-overlay{background:#000000d9;top:0;right:0;bottom:0;left:0;position:fixed;z-index:100}.mai-sample-dialog{left:50%;max-width:calc(100vw - 32px);outline:none;position:fixed;top:50%;transform:translate(-50%,-50%);width:-moz-max-content;width:max-content;z-index:101}.mai-sample-dialog>img{border-radius:6px;display:block;height:auto;max-height:calc(100dvh - 96px);max-width:calc(100vw - 32px);-o-object-fit:contain;object-fit:contain;width:auto}.mai-sample-close{background:#000c;border-radius:6px;color:#fff;display:grid;height:44px;place-items:center;position:absolute;right:8px;top:8px;width:44px}.mai-sample-close:hover{background:#171717}@media (min-width:640px){.mai-hero-title{font-size:48px}.mai-hero-subtitle{font-size:18px}}@media (max-width:639px){.mai-hero-content{padding-bottom:16px;padding-top:28px}.mai-hero-fan{height:184px;margin-top:24px}.mai-hero-sample{left:16%;width:29%}.mai-hero-sample:nth-child(2){left:39%}.mai-hero-sample:nth-child(3){left:62%}.mai-hero-sample:nth-child(4){left:85%}.mai-hero-prompt-actions{flex-wrap:wrap}}@media (prefers-reduced-motion:reduce){.mai-hero-sample,.mai-hero-submit{transition:none}}
