:root{--bg: #0b0b12;--bg-elev: #11111a;--text: #e8e8ef;--muted: #b0b0c0;--primary: #7c5cff;--primary-2: #ff67d0;--card: #14141f;--border: #27273a;--gradient: radial-gradient(1200px 600px at 10% -10%, rgba(124,92,255,.25), rgba(255,103,208,.15) 35%, transparent 60%), radial-gradient(900px 500px at 110% 10%, rgba(124,92,255,.2), transparent 55%);font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Inter,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji";color-scheme:dark;color:var(--text);background:var(--bg);text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0}img{max-width:100%;display:block}button,input,textarea{font-family:inherit;color:inherit}.app{background:var(--bg);background-image:var(--gradient);min-height:100%;display:flex;flex-direction:column}.container{width:100%;max-width:1120px;margin:0 auto;padding:0 20px}main{flex:1}.header{position:sticky;top:0;z-index:50;-webkit-backdrop-filter:saturate(180%) blur(10px);backdrop-filter:saturate(180%) blur(10px);background:#0b0b1299;border-bottom:1px solid var(--border)}.header__inner{display:flex;align-items:center;justify-content:space-between;padding:14px 0}.brand{display:inline-flex;align-items:center;gap:10px;color:var(--text);font-weight:700;letter-spacing:.5px}.brand__logo{display:grid;place-items:center;width:28px;height:28px;border-radius:8px;background:linear-gradient(135deg,var(--primary),var(--primary-2));box-shadow:0 6px 22px #7c5cff59}.brand__name{font-size:18px}.nav{display:flex;gap:16px;align-items:center}.nav__link{color:var(--muted);font-size:14px;padding:8px 10px;border-radius:8px;border:1px solid transparent}.nav__link:hover{color:var(--text);border-color:var(--border)}.nav__button{color:#0a0715;background:linear-gradient(135deg,var(--primary),var(--primary-2));padding:10px 14px;border-radius:10px;font-weight:700;box-shadow:0 10px 30px #7c5cff73}.nav__toggle{display:none;border:1px solid var(--border);background:var(--bg-elev);color:var(--text);border-radius:10px;padding:8px 10px;font-weight:800}@media (max-width: 640px){.nav__toggle{display:inline-flex;align-items:center;justify-content:center}.nav{position:absolute;left:0;right:0;top:100%;display:grid;gap:8px;background:#0b0b12e6;border-bottom:1px solid var(--border);padding:10px 12px;transform-origin:top;transform:scaleY(0);max-height:0;overflow:hidden;transition:transform .18s ease,max-height .18s ease}.nav--open{transform:scaleY(1);max-height:240px}.nav__link{display:block;padding:10px 12px}.nav__button{display:block;text-align:center}}.hero{padding:72px 0 28px}.headline{font-size:44px;line-height:1.1;letter-spacing:-.02em;margin:0 0 14px}.headline__accent{background:linear-gradient(135deg,var(--primary),var(--primary-2));-webkit-background-clip:text;background-clip:text;color:transparent}.subhead{color:var(--muted);font-size:18px;margin:0 0 18px}.hero__cta{display:flex;gap:12px}.hero__inner{display:flex;flex-direction:column;align-items:center;text-align:center}.hero__cta{justify-content:center}.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 16px;border-radius:12px;border:1px solid var(--border);background:var(--bg-elev);color:var(--text);font-weight:600;text-decoration:none;min-height:44px;transition:all .2s ease}.button--primary{background:linear-gradient(135deg,var(--primary),var(--primary-2));color:#0a0715;border-color:transparent;box-shadow:0 10px 30px #7c5cff73}.button--ghost{background:transparent}.button:hover{transform:translateY(-1px)}.button:active{transform:translateY(0)}@media (max-width: 640px){.button{min-height:48px;padding:14px 18px;font-size:16px}.hero__cta .button{width:100%}}@media (max-width: 480px){.button{min-height:44px;padding:12px 16px;font-size:15px}}.section{padding:54px 0}.section__title{font-size:28px;margin:0 0 24px}.section__title--h1{font-size:44px;line-height:1.1;letter-spacing:-.02em}.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.card{background:linear-gradient(180deg,#ffffff05,#ffffff01);border:1px solid var(--border);border-radius:16px;padding:18px;transition:transform .2s ease,box-shadow .2s ease}.card:hover{transform:translateY(-4px);box-shadow:0 12px 30px #00000040}.card__icon{font-size:22px}.card__title{margin:8px 0 4px;font-size:18px}.card__desc{margin:0;color:var(--muted);font-size:14px}.steps{list-style:none;padding:0;margin:0;display:grid;gap:12px}.step{display:grid;grid-template-columns:36px 1fr;gap:12px;align-items:start;background:var(--card);border:1px solid var(--border);border-radius:14px;padding:12px}.step__num{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:linear-gradient(135deg,var(--primary),var(--primary-2));color:#0a0715;font-weight:800}.step__title{font-weight:700}.step__desc{color:var(--muted)}.generator__box{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:10px;margin-bottom:16px}.input{width:100%;resize:vertical;background:transparent;border:none;outline:none;color:var(--text);font-size:16px;padding:8px;min-height:44px}.results{display:grid;gap:12px}.result{background:linear-gradient(180deg,#ffffff05,#ffffff01);border:1px solid var(--border);border-radius:14px;padding:12px}.result__top{display:flex;justify-content:space-between;gap:10px;align-items:center;flex-wrap:wrap}.result__name{font-weight:700;color:var(--muted);font-size:14px}.result__actions{display:flex;gap:8px;flex-wrap:wrap}.chip{padding:6px 10px;border-radius:999px;border:1px solid var(--border);background:var(--bg-elev);color:var(--text);font-weight:600;min-height:32px;display:inline-flex;align-items:center}.result__text{margin-top:8px;font-size:18px;word-break:break-word}@media (max-width: 640px){.generator__box{padding:12px}.input{font-size:16px;padding:12px;min-height:48px}.result{padding:14px}.result__top{flex-direction:column;align-items:flex-start;gap:8px}.result__actions{width:100%;justify-content:flex-start}.chip{min-height:36px;padding:8px 12px}.result__text{font-size:16px}}@media (max-width: 480px){.generator__box,.input{padding:10px}.result{padding:12px}.result__text{font-size:15px}}.cta{padding:60px 0 80px;text-align:center}.cta__inner{background:linear-gradient(135deg,#7c5cff26,#ff67d01f);border:1px solid var(--border);border-radius:16px;padding:28px}.footer{border-top:1px solid var(--border);padding:16px 0;background:#0b0b1299;-webkit-backdrop-filter:saturate(180%) blur(10px);backdrop-filter:saturate(180%) blur(10px)}.footer__inner{display:grid;grid-template-columns:1fr auto auto;gap:10px;align-items:center}.footer__links{display:flex;gap:12px}.footer__copy{color:var(--muted);font-size:12px}@media (max-width: 1024px){.container{padding:0 16px}.hero{padding:60px 0 24px}.section{padding:48px 0}}@media (max-width: 900px){.cards{grid-template-columns:repeat(2,minmax(0,1fr))}.hero{padding:48px 0 20px}.section{padding:40px 0}.headline{font-size:38px}.subhead{font-size:16px}}@media (max-width: 640px){.container{padding:0 12px}.headline{font-size:32px}.header__inner{padding:10px 0}.nav{gap:4px}.nav__link{display:none}.nav__button{padding:8px 12px;font-size:14px}.cards{grid-template-columns:1fr}.footer__inner{grid-template-columns:1fr;text-align:center}.section{padding:32px 0}.hero{padding:32px 0 16px}.subhead{font-size:15px;line-height:1.5}.section__title{font-size:24px}.section__title--h1{font-size:32px}}@media (max-width: 480px){.container{padding:0 8px}.headline{font-size:28px}.section{padding:24px 0}.hero{padding:24px 0 12px}.brand__name{font-size:16px}.nav__button{padding:6px 10px;font-size:13px}}.grid{display:grid;gap:14px}.grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}.case{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:16px}.case__title{font-weight:700;margin-bottom:6px}.case__desc{color:var(--muted)}.quotes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.quote{background:linear-gradient(180deg,#ffffff05,#ffffff01);border:1px solid var(--border);border-radius:14px;padding:16px}.quote blockquote{margin:0 0 10px;font-size:16px}.quote__name{font-weight:700;margin-right:6px}.quote__handle{color:var(--muted);font-size:14px}.faq__list{display:grid;gap:10px}.faq{border:1px solid var(--border);border-radius:12px;background:var(--card)}.faq__q{width:100%;text-align:left;padding:12px 14px;background:transparent;border:none;display:flex;justify-content:space-between;align-items:center;font-weight:700}.faq__a{padding:0 14px 14px;color:var(--muted)}.faq__icon{opacity:.8}.faq__a--collapsible{overflow:hidden;transition:max-height .22s ease,padding .18s ease;padding:0 14px}.faq__q[aria-expanded=true] .faq__icon{transform:rotate(180deg)}.faq__icon{transition:transform .18s ease}.lead{color:var(--muted);font-size:18px;margin:0 0 14px}.about__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.about__item{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:16px}@media (max-width: 900px){.quotes{grid-template-columns:1fr}}@media (max-width: 640px){.grid--2,.about__grid{grid-template-columns:1fr}}.case__head{display:flex;align-items:center;gap:10px;margin-bottom:6px}.case__icon{font-size:20px}.case__list{margin:10px 0 0;padding:0 0 0 18px;color:var(--muted)}.case__list li{margin:4px 0}.quote__meta{display:grid;grid-template-columns:40px 1fr;gap:10px;align-items:center}.avatar{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,var(--primary),var(--primary-2));color:#0a0715;font-weight:800}.rating{color:#ffd166;font-weight:700;letter-spacing:2px}.rating--muted{color:#5b5b6e}.badges{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}.badge{border:1px solid var(--border);background:var(--bg-elev);border-radius:999px;padding:6px 10px;font-weight:700;font-size:12px;color:var(--muted)}.badgerow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.badgecard{display:grid;grid-template-columns:40px 1fr;gap:10px;align-items:center;padding:12px;border-radius:14px;border:1px solid var(--border)}.badgecard__icon{width:40px;height:40px;border-radius:10px;display:grid;place-items:center;background:linear-gradient(135deg,var(--primary),var(--primary-2));color:#0a0715;font-weight:900}.badgecard__title{font-weight:800}.badgecard__sub{color:var(--muted)}@media (max-width: 900px){.badgerow{grid-template-columns:1fr}}.surface{position:relative;border:1px solid var(--border);border-radius:16px;background:linear-gradient(180deg,#ffffff05,#ffffff01);box-shadow:0 8px 24px #0a08143d;transition:transform .2s ease,box-shadow .2s ease}.surface:hover{transform:translateY(-3px);box-shadow:0 14px 34px #0a081459}.v1{background-image:linear-gradient(180deg,#7c5cff24,#7c5cff0a)}.v2{background-image:linear-gradient(180deg,#ff67d024,#ff67d00a)}.v3{background-image:linear-gradient(180deg,#4ade8024,#4ade800a)}.v4{background-image:linear-gradient(180deg,#3b82f624,#3b82f60a)}.icon-badge{display:inline-grid;place-items:center;width:36px;height:36px;border-radius:10px;background:linear-gradient(135deg,var(--primary),var(--primary-2));color:#0a0715;font-weight:800;box-shadow:0 8px 24px #7c5cff59}.section__title{display:inline-flex;align-items:baseline;gap:8px}.section__title .hl{padding:4px 10px;border-radius:999px;font-size:14px;color:#0a0715;background:linear-gradient(135deg,var(--primary),var(--primary-2));box-shadow:0 8px 20px #7c5cff59}.footer{margin-top:32px;border-top:1px solid var(--border);background:#0b0b1299;-webkit-backdrop-filter:saturate(180%) blur(10px);backdrop-filter:saturate(180%) blur(10px)}.footer__grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:20px;padding:28px 0}.footer__brand{display:inline-flex;align-items:center;gap:10px;font-weight:800}.footer__tag{color:var(--muted);margin:8px 0 12px}.footer__title{font-weight:800;margin-bottom:8px}.footer__list{list-style:none;padding:0;margin:0;display:grid;gap:6px}.footer__list a{color:var(--muted)}.footer__list a:hover{color:var(--text)}.social{display:flex;gap:10px}.social__link{width:36px;height:36px;display:grid;place-items:center;border-radius:10px;background:linear-gradient(135deg,var(--primary),var(--primary-2));color:#0a0715;font-weight:900;box-shadow:0 8px 24px #7c5cff59}.footer__bar{border-top:1px solid var(--border);background:#0a0a10b3}.footer__barinner{display:flex;align-items:center;justify-content:space-between;padding:12px 0}.footer__smalllinks{display:flex;gap:12px}.footer__smalllinks a{color:var(--muted)}.footer__smalllinks a:hover{color:var(--text)}@media (max-width: 1024px){.footer__grid{gap:16px;padding:24px 0}}@media (max-width: 900px){.footer__grid{grid-template-columns:1fr 1fr;gap:20px}.footer__brandcol{grid-column:1 / -1;text-align:center;margin-bottom:16px}}@media (max-width: 640px){.footer__grid{grid-template-columns:1fr;gap:16px;padding:20px 0;text-align:center}.footer__brandcol{margin-bottom:20px}.footer__brand{justify-content:center}.footer__tag,.footer__col{text-align:center}.footer__barinner{flex-direction:column;gap:8px;text-align:center}.footer__smalllinks{justify-content:center;flex-wrap:wrap}.social{justify-content:center}}@media (max-width: 480px){.footer__grid{padding:16px 0;gap:20px}.footer__brand{font-size:18px}.footer__tag{font-size:14px;margin:12px 0 16px}.footer__title{font-size:16px;margin-bottom:12px}.footer__list{gap:8px}.footer__list a{font-size:14px}.social__link{width:40px;height:40px}.footer__copy,.footer__smalllinks a{font-size:12px}}a{transition:color .15s ease}a:not(.button):not(.nav__button){color:var(--muted)}a:not(.button):not(.nav__button):hover{color:var(--text)}a:focus-visible{outline:2px solid var(--primary);outline-offset:2px;border-radius:6px}a,a:hover,a:visited,a:active{text-decoration:none}h1,h2,h3,h4,h5,h6{text-align:center}.section__title{justify-content:center;width:100%}.spot{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.spot__item{padding:16px;border-radius:16px;border:1px solid var(--border)}.spot__preview{font-size:28px;font-weight:800;text-align:center;margin-bottom:10px}.spot__meta{display:flex;justify-content:space-between;align-items:center}.spot__name{font-weight:700;color:var(--muted)}.tips{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}@media (max-width: 900px){.spot{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width: 640px){.spot{grid-template-columns:1fr}}#generator{padding-bottom:24px}#how-to{padding-top:24px}@media (max-width: 640px){#generator{padding-bottom:20px}#how-to{padding-top:20px}}#features,#categories,#what-is,#why-use,#tips{padding-top:24px;padding-bottom:24px}#faqs{padding-top:24px}@media (max-width: 640px){#how-to{padding-bottom:20px}#features,#categories,#what-is,#why-use,#tips{padding-top:20px;padding-bottom:20px}#faqs{padding-top:20px}}:root{--h1: clamp(32px, 5vw, 56px)}.headline{font-size:var(--h1)}.hero__cta{flex-wrap:wrap}@media (max-width: 640px){.hero__cta .button{width:100%}}@media (max-width: 1024px){.card{padding:16px}.step{padding:14px}}@media (max-width: 640px){.cards{gap:12px}.card{padding:14px}.card__title{font-size:16px}.card__desc{font-size:13px}.step{padding:12px;gap:10px}.step__num{width:32px;height:32px;font-size:14px}.step__title{font-size:15px}.step__desc{font-size:13px}.faq__q{padding:14px 16px;font-size:15px}.faq__a{padding:0 16px 16px;font-size:14px}.quote,.case{padding:14px}.case__title{font-size:15px}.case__desc{font-size:13px}}@media (max-width: 480px){.cards{gap:10px}.card{padding:12px}.card__title{font-size:15px}.card__desc{font-size:12px}.step{padding:10px;gap:8px}.step__num{width:28px;height:28px;font-size:13px}.faq__q{padding:12px 14px}.faq__a{padding:0 14px 14px}.quote,.case{padding:12px}}@media (max-width: 640px){.nav__link{min-height:44px}.social__link,.icon-badge{width:40px;height:40px}.badgecard__icon{width:44px;height:44px}}@media (max-width: 640px){body{overflow-x:hidden}.container{max-width:100%}.result__text{overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto}}
