:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#182139;background:#f7f8fc;font-synthesis:none;font-feature-settings:'ss01' on;-webkit-font-smoothing:antialiased;--ink:#182139;--muted:#727b90;--line:#e8eaf2;--blue:#485bff;--blue-dark:#3245dd;--bg:#f7f8fc;--surface:#fff;--soft:#f4f6fb;--card-shadow:0 14px 54px rgba(16,33,81,.045)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-width:320px}button,input,textarea,select{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.48}a{color:inherit;text-decoration:none}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #a2aaff;outline-offset:3px}img,svg{max-width:100%}h1,h2,h3,p{margin-top:0}h1,h2,h3{letter-spacing:-.045em}button,select,input,textarea{transition:border-color .16s,background-color .16s,box-shadow .16s,transform .16s}textarea{resize:vertical}body::before{content:"";position:absolute;top:0;left:0;width:100%;height:660px;pointer-events:none;z-index:-1;background:radial-gradient(ellipse 600px 340px at 78% 1%,rgba(100,139,255,.105),transparent 70%),radial-gradient(ellipse 490px 240px at 13% 5%,rgba(183,195,255,.09),transparent 67%)}
.container{width:min(1250px,calc(100% - 52px));margin:0 auto}.site-header{height:83px;border-bottom:1px solid #e9eaf0bd;background:rgba(255,255,255,.78);backdrop-filter:blur(16px);position:relative;z-index:10}.header-inner{height:100%;display:flex;align-items:center;gap:30px}.logo-link{display:inline-flex;gap:11px;align-items:center;flex-shrink:0}.logo-symbol{width:41px;height:41px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(135deg,#4d63ff,#7047ed);color:white;box-shadow:0 6px 15px #344dff25}.logo-type{font-size:20px;font-weight:840;letter-spacing:-.07em;line-height:1}.logo-type small{display:block;font-size:10px;font-weight:650;letter-spacing:.045em;color:#8e96aa;margin-top:6px}.top-nav{display:flex;align-items:center;gap:28px;margin-left:31px}.top-nav a{font-size:13px;font-weight:680;color:#637087;white-space:nowrap}.top-nav a:hover,.top-nav a.active{color:var(--blue)}.header-right{display:flex;gap:10px;margin-left:auto;align-items:center}.header-badge{font-size:11px;font-weight:750;border:1px solid #e3e5f0;padding:9px 12px;border-radius:999px;color:#7b849b;background:white;white-space:nowrap}.icon-button{width:39px;height:39px;display:grid;place-items:center;background:var(--surface);border:1px solid var(--line);border-radius:12px;color:#70788a}.icon-button:hover{color:var(--blue);border-color:#cbd2ff}.language-select{border:1px solid var(--line);border-radius:12px;padding:10px 29px 10px 11px;color:var(--ink);font-size:12px;font-weight:780;background:var(--surface);max-width:87px}.menu-button{display:none}.hero{padding:63px 0 34px;display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:36px;align-items:center}.hero-copy{max-width:860px}.eyebrow{display:inline-flex;align-items:center;gap:8px;padding:7px 11px;background:#eef0ff;border:1px solid #e5e8ff;border-radius:100px;color:#4a55d2;font-size:11px;letter-spacing:.08em;font-weight:780;text-transform:uppercase}.eyebrow svg{width:14px;height:14px}.hero h1{font-size:clamp(38px,5.1vw,63px);line-height:1.06;font-weight:840;margin:18px 0 16px;letter-spacing:-.065em;max-width:850px}.hero h1 em{font-style:normal;color:#5260f2}.hero p{font-size:16px;line-height:1.75;color:#707b92;max-width:650px;margin:0}.hero-proof{display:flex;gap:22px;align-items:center;margin-top:23px;flex-wrap:wrap}.hero-proof span{display:flex;align-items:center;gap:7px;color:#5e6d80;font-size:12px;font-weight:670}.hero-proof svg{color:#2aa27e}.hero-art{height:218px;border:1px solid #e7eaf5;background:linear-gradient(142deg,#fafaff 10%,#edf0ff);border-radius:30px;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden}.hero-art:before{content:"";position:absolute;inset:18px;border:1px dashed #c9cef4;border-radius:23px}.art-tile{position:relative;width:132px;height:132px;display:grid;place-items:center;background:white;border-radius:22px;box-shadow:0 22px 40px #495cb62c;transform:rotate(-8deg);color:#4c5fff}.art-tile svg{width:100px;height:100px}.art-chip{position:absolute;display:flex;align-items:center;gap:7px;padding:10px 13px;box-shadow:0 8px 25px #4a65c022;border:1px solid #e9ebfc;background:#fff;border-radius:13px;color:#42506b;font-size:11px;font-weight:700}.art-chip.left{bottom:23px;left:14px;transform:rotate(5deg)}.art-chip.right{top:22px;right:9px;transform:rotate(8deg)}.art-chip svg{color:#4f5bf1}.studio-shell{display:grid;grid-template-columns:minmax(0,1.13fr) minmax(360px,.87fr);gap:23px;align-items:start}.editor-panel,.preview-panel{border:1px solid #e9ecf2;border-radius:23px;background:#fff;box-shadow:var(--card-shadow)}.editor-panel{padding:31px 34px 35px}.preview-panel{padding:25px;position:sticky;top:24px;background:#fff}.section-eyebrow{display:flex;gap:7px;align-items:center;color:#626ff1;letter-spacing:.095em;font-weight:810;font-size:10px}.panel-heading{display:flex;align-items:flex-start;justify-content:space-between;margin:11px 0 30px}.panel-heading h2,.preview-header h2{font-size:30px;line-height:1.1;letter-spacing:-.062em;margin:0 0 9px}.panel-heading h2 span{color:#5362f6}.panel-heading p{font-size:12px;color:#8390a4;line-height:1.6;margin:0}.step-title{display:flex;align-items:center;gap:12px;margin-bottom:18px}.step-number{width:32px;height:32px;display:grid;place-items:center;background:#edf0ff;color:#4e5cea;font-weight:850;font-size:12px;border-radius:11px}.step-title strong{font-size:14px;font-weight:790;display:block;letter-spacing:-.02em}.step-title small{font-size:11px;color:#8c95a5;display:block;margin-top:4px}.type-pills{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:21px}.type-pill{display:inline-flex;gap:8px;align-items:center;font-size:11px;font-weight:740;color:#657086;padding:10px 12px;border:1px solid #e9ebf0;border-radius:11px;background:#fff;white-space:nowrap}.type-pill:hover{border-color:#b4bfff;color:#4657dc}.type-pill.selected{color:#4256db;background:#f0f2ff;border-color:#bfc6ff;box-shadow:inset 0 0 0 1px #f0f2ff}.type-pill svg{flex-shrink:0}.input-group{display:grid;gap:14px}.field{display:flex;flex-direction:column;gap:8px;min-width:0}.field-label{font-size:11px;color:#45536a;font-weight:760}.field input:not([type=color]),.field textarea,.field select{border:1px solid #e2e6ef;border-radius:11px;width:100%;padding:13px 13px;color:var(--ink);background:#fff;min-height:46px;font-size:13px;outline:none}.field textarea{line-height:1.55}.field input:focus,.field textarea:focus,.field select:focus{border-color:#9aa8fc;box-shadow:0 0 0 3px #eef0ff}.field input::placeholder,.field textarea::placeholder{color:#b2b8c6}.field input:disabled{background:#f3f4f8}.field select{appearance:auto}.hint{font-size:11px;color:#8f98aa;line-height:1.6;margin:0}.two-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}.two-fields.spacious{margin:14px 0 15px}.checkbox-label{display:flex;align-items:center;gap:8px;font-size:12px;color:#5f687d}.checkbox-label input{accent-color:var(--blue)}.link-output{border:1px solid #dce5ff;border-radius:14px;padding:14px;background:#f8faff}.link-output-head,.link-output-head>div{display:flex;align-items:center;gap:8px}.link-output-head{justify-content:space-between;font-size:12px}.link-output-head svg{color:var(--blue)}.link-output-head>span{font-size:10px;color:#2a946e;font-weight:800}.generated-link{background:#fff;border:1px solid #e5e9f2;margin-top:11px;border-radius:9px;padding:12px;font-size:11px;color:#57667c;overflow-wrap:anywhere;max-height:94px;overflow-y:auto}.row-buttons{display:flex;gap:7px;margin-top:10px;flex-wrap:wrap}.secondary-button,.quiet-button{display:flex;gap:6px;align-items:center;justify-content:center;background:#fff;border:1px solid #dce2f6;padding:9px 11px;border-radius:9px;font-size:11px;font-weight:740;color:#4052b5}.quiet-button{border:0;background:transparent;color:#667089}.section-break{height:1px;background:var(--line);margin:27px 0}.control-title{font-size:12px;color:#435169;font-weight:780;margin:21px 0 12px}.preset-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}.preset{padding:8px 5px 10px;border:1px solid #e9ebf2;background:white;border-radius:12px;min-width:0;display:flex;flex-direction:column;align-items:center;gap:8px;color:#737e90;font-size:10px;font-weight:690}.preset:hover{border-color:#b3bcff}.preset.selected{border-color:#6372f5;box-shadow:0 0 0 2px #edf0ff;color:#4454d5}.preset-mark{width:42px;height:42px;border-radius:10px;display:grid;place-items:center;background:#f3f5fc}.preset-mark.ink{color:#151b32}.preset-mark.blue{color:#1857d9;background:#e7f5ff}.preset-mark.violet{color:#8c44c2;background:#f4ebff}.preset-mark.green{color:#117b75;background:#e6faf2}.preset-mark.sunset{color:#b2436b;background:#fff0e8}.color-control{display:flex;gap:10px;align-items:center;padding:6px 10px;border-radius:10px;border:1px solid #e6eaf2;height:44px;font-size:12px;font-weight:750;color:#667188;letter-spacing:.015em}.color-control input{border:0;background:none;width:29px;height:29px;padding:0;flex:0 0 29px;cursor:pointer}.color-control input::-webkit-color-swatch-wrapper{padding:0}.color-control input::-webkit-color-swatch{border:2px solid white;box-shadow:0 0 0 1px #dfe3ef;border-radius:8px}.switch-row{display:flex;justify-content:space-between;align-items:center;gap:10px;position:relative;padding:6px 0;cursor:pointer}.switch-row strong{font-size:12px}.switch-row small{display:block;margin-top:3px;color:#8f99a9;font-size:11px}.switch-row input{opacity:0;position:absolute;right:8px}.switch-track{width:39px;height:23px;border-radius:20px;background:#dce1ed;position:relative;transition:background .15s}.switch-track:before{content:"";position:absolute;width:17px;height:17px;border-radius:50%;top:3px;left:3px;background:#fff;box-shadow:0 2px 5px #18213920;transition:transform .15s}.switch-row input:checked+.switch-track{background:var(--blue)}.switch-row input:checked+.switch-track:before{transform:translateX(16px)}.dot-styles{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.dot-style{border:1px solid #e5e8f0;background:white;border-radius:11px;padding:10px;display:flex;align-items:center;justify-content:center;gap:8px;font-size:11px;color:#6f7a8b;font-weight:690}.dot-style.chosen{background:#f0f2ff;border-color:#aeb8ff;color:#4356d7}.shape-mini{width:17px;height:17px;display:inline-block;background-color:#697692}.rounded-mini{border-radius:5px}.dots-mini{width:15px;height:15px;border-radius:50%}.upload-action{border:1px dashed #cbd1e5;border-radius:12px;background:#fbfcff;display:flex;align-items:center;gap:11px;padding:13px 14px;cursor:pointer;color:#5266e8}.upload-action span:not(.upload-plus){flex:1}.upload-action strong{color:#3d4961;display:block;font-size:12px}.upload-action small{font-size:10px;color:#99a3b6;display:block;margin-top:4px}.upload-plus{font-size:22px;font-weight:400;color:#adb5c7}.text-button{border:0;background:transparent;color:#cc4057;font-size:11px;font-weight:720;padding:8px 2px}.preview-header{display:flex;align-items:flex-start;justify-content:space-between;margin:0 4px 20px}.preview-header h2{font-size:23px;margin-top:8px;margin-bottom:0}.live-pill{display:flex;gap:5px;align-items:center;border-radius:100px;background:#eaf9f1;color:#1d985e;font-size:10px;font-weight:800;letter-spacing:.05em;padding:7px 10px}.live-dot{width:6px;height:6px;background:#1fab6b;border-radius:50%;box-shadow:0 0 0 3px #caefd9}.preview-canvas{border-radius:17px;background:radial-gradient(#d6dced 0.7px,transparent 0.7px),#f5f7fd;background-size:16px 16px;min-height:367px;padding:33px 16px 16px;display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px solid #edf0f6}.qr-target{width:min(270px,100%);aspect-ratio:1;display:flex;align-items:center;justify-content:center;border-radius:12px;overflow:hidden;filter:drop-shadow(0 9px 24px rgba(30,50,89,.07))}.qr-target svg{width:100%;height:auto;display:block}.empty-qr{background:white;width:100%;aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;color:#aab3c6}.empty-qr span{font-size:11px}.qr-caption{font-size:10px;font-weight:700;color:#9ca5b5;margin-top:16px;letter-spacing:.01em}.validation{display:flex;align-items:flex-start;gap:9px;padding:13px 4px 4px;font-size:11px;line-height:1.5;color:#718095;min-height:45px}.validation svg{flex:0 0 17px}.validation.ok svg{color:#25a378}.validation.warning svg,.validation.waiting svg{color:#e39a33}.preview-actions{display:grid;gap:10px;margin-top:14px}.primary-button,.outline-button{width:100%;display:flex;align-items:center;justify-content:center;gap:9px;border-radius:12px;padding:15px 14px;font-size:13px;font-weight:770}.primary-button{background:#5263f9;color:#fff;border:1px solid #5263f9;box-shadow:0 8px 19px #5461ea29}.primary-button:not(:disabled):hover{background:#3d4de8;transform:translateY(-1px)}.outline-button{background:#fff;border:1px solid #dfe4ef;color:#465675}.outline-button:not(:disabled):hover{border-color:#acb6ff;color:#4658d8}.preview-actions span{font-size:10px;opacity:.63;font-weight:630;margin-left:auto}.preview-actions svg{margin-left:auto}.primary-button:has(span),.outline-button:has(span){padding-left:21px}.privacy-note{display:flex;gap:9px;align-items:flex-start;color:#8a96a8;font-size:10px;line-height:1.65;margin-top:17px}.privacy-note svg{flex:0 0 16px;color:#24a47f}.mini-separator{height:1px;background:#edf0f6;margin:19px 0}.preview-tip{font-size:11px;line-height:1.5;display:flex;gap:8px;align-items:flex-start;color:#687590}.preview-tip svg{color:#6775ea;flex:0 0 16px}.toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,15px);background:#1f2d4c;color:white;border-radius:12px;padding:12px 18px;box-shadow:0 12px 35px #1d2e5355;font-size:12px;font-weight:700;opacity:0;visibility:hidden;transition:.2s;z-index:1000}.toast.visible{opacity:1;visibility:visible;transform:translate(-50%,0)}.toast.is-error{background:#a32b45}
.content-section{padding:74px 0 70px}.content-section .eyebrow{padding:0;background:none;border:0;color:#6571eb}.content-section h2{font-size:clamp(26px,3.5vw,39px);margin:11px 0 9px}.content-lead{color:#7d889a;line-height:1.7;font-size:14px;max-width:750px}.features-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:17px;margin-top:28px}.feature-card{background:#fff;border:1px solid #eaedf5;border-radius:19px;padding:26px 25px;box-shadow:var(--card-shadow)}.feature-icon{width:40px;height:40px;border-radius:13px;background:#eef0ff;color:#5260ef;display:grid;place-items:center;margin-bottom:18px}.feature-card h3{font-size:16px;margin:0 0 9px}.feature-card p{font-size:12px;color:#7b859b;line-height:1.8;margin:0}.bottom-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:65px}.info-card{background:#fff;border:1px solid #eaedf5;border-radius:19px;padding:28px}.info-card h2{font-size:22px;margin-bottom:20px}.info-card p{font-size:13px;color:#6e7891;line-height:1.75}.info-card ol{padding-left:20px;color:#65718a;line-height:1.9;font-size:13px}.faq-item{padding:12px 0;border-top:1px solid #eef0f5}.faq-item h3{font-size:13px;margin:0 0 5px;letter-spacing:0}.faq-item p{font-size:12px;margin:0;line-height:1.7}.site-footer{background:#141b30;color:#d7dff4;padding:34px 0 28px}.footer-inner{display:flex;gap:22px;align-items:center;justify-content:space-between}.footer-brand{font-size:16px;font-weight:820;letter-spacing:-.045em}.footer-brand small{font-size:10px;display:block;color:#93a0bc;font-weight:450;letter-spacing:0;margin-top:6px}.footer-nav{display:flex;gap:17px;flex-wrap:wrap;font-size:11px;color:#a4aec7}.footer-nav a:hover{color:white}.footer-bottom{margin-top:24px;border-top:1px solid #31394d;padding-top:19px;font-size:10px;color:#71809d;display:flex;justify-content:space-between;gap:10px}.legal-container{background:white;border:1px solid var(--line);border-radius:20px;max-width:850px;padding:40px;margin:55px auto 90px}.legal-container h1{font-size:38px}.legal-container h2{font-size:20px;margin-top:28px}.legal-container p,.legal-container li{color:#606c83;font-size:14px;line-height:1.85}.legal-container ul{padding-left:20px}
/* dark mode, no dependence on user agent browser styling */
html[data-theme="dark"]{--ink:#e9ecf8;--muted:#a1adc4;--line:#333d55;--bg:#11182a;--surface:#1c2538;--soft:#252f44;--card-shadow:0 20px 50px #02061740;color-scheme:dark;background:#11182a;color:var(--ink)}
html[data-theme="dark"] body::before{background:radial-gradient(ellipse 600px 340px at 80% 0%,#293a8533,transparent 68%)}
html[data-theme="dark"] .site-header{background:#172037d9;border-color:#313952}html[data-theme="dark"] .hero-art{background:linear-gradient(142deg,#1a2340,#263564);border-color:#374263}html[data-theme="dark"] .hero-art:before{border-color:#576189}html[data-theme="dark"] .art-tile,html[data-theme="dark"] .art-chip{background:#1e2941;border-color:#3d4868}html[data-theme="dark"] .editor-panel,html[data-theme="dark"] .preview-panel,html[data-theme="dark"] .feature-card,html[data-theme="dark"] .info-card,html[data-theme="dark"] .legal-container{background:#1b2539;border-color:#323e55}html[data-theme="dark"] .icon-button,html[data-theme="dark"] .type-pill,html[data-theme="dark"] .preset,html[data-theme="dark"] .dot-style,html[data-theme="dark"] .field input:not([type=color]),html[data-theme="dark"] .field textarea,html[data-theme="dark"] .field select,html[data-theme="dark"] .color-control,html[data-theme="dark"] .upload-action,html[data-theme="dark"] .outline-button,html[data-theme="dark"] .secondary-button,html[data-theme="dark"] .language-select,html[data-theme="dark"] .header-badge{background:#243049;border-color:#39435a;color:#dce2f2}html[data-theme="dark"] .field-label,html[data-theme="dark"] .control-title,html[data-theme="dark"] .upload-action strong,html[data-theme="dark"] .switch-row strong{color:#dce2f2}html[data-theme="dark"] .type-pill.selected,html[data-theme="dark"] .preset.selected,html[data-theme="dark"] .dot-style.chosen{background:#303c6b;border-color:#7582e5;color:#c5d0ff}html[data-theme="dark"] .link-output{background:#202d4e;border-color:#414b7c}html[data-theme="dark"] .generated-link{background:#182338;border-color:#39465f;color:#bbc9e0}html[data-theme="dark"] .preview-canvas{background-color:#222e46;background-image:radial-gradient(#53607e .7px,transparent .7px);border-color:#3b4661}html[data-theme="dark"] .feature-card p,html[data-theme="dark"] .info-card p,html[data-theme="dark"] .info-card ol,html[data-theme="dark"] .hero p,html[data-theme="dark"] .legal-container p,html[data-theme="dark"] .legal-container li{color:#9eacc3}html[data-theme="dark"] .eyebrow{background:#29346b;border-color:#39478f;color:#c0c7ff}html[data-theme="dark"] .content-section .eyebrow{background:none}html[data-theme="dark"] .site-footer{background:#0c1120}html[data-theme="dark"] .empty-qr{background:#27314b}
@media(max-width:1100px){.top-nav{gap:13px;margin-left:6px}.hero{grid-template-columns:1fr 235px}.hero-art{height:184px}.studio-shell{grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr)}.editor-panel{padding:25px}.preview-panel{padding:20px}}
@media(max-width:850px){.top-nav{display:none}.hero{grid-template-columns:1fr}.hero-art{display:none}.studio-shell{grid-template-columns:1fr}.preview-panel{position:static}.preview-canvas{min-height:320px}.preview-sticky{max-width:660px;margin:0 auto}.features-grid{grid-template-columns:repeat(2,1fr)}.hero{padding-top:42px}}
@media(max-width:540px){.container{width:min(100% - 28px,1250px)}.site-header{height:68px}.header-inner{gap:8px}.logo-symbol{width:36px;height:36px;border-radius:10px}.logo-type{font-size:18px}.logo-type small{font-size:8px}.header-badge{display:none}.language-select{max-width:73px;padding-left:7px;padding-right:5px}.header-right{gap:6px}.icon-button{width:35px;height:35px}.hero{padding:38px 0 27px}.hero h1{font-size:38px;letter-spacing:-.06em}.hero p{font-size:13px;line-height:1.75}.hero-proof{gap:9px 16px}.hero-proof span{font-size:10px}.editor-panel{padding:22px 17px;border-radius:18px}.preview-panel{border-radius:18px;padding:17px}.panel-heading h2{font-size:25px}.type-pills{gap:6px}.type-pill{font-size:10px;padding:9px 9px;gap:5px}.type-pill svg{width:14px;height:14px}.two-fields{grid-template-columns:1fr 1fr;gap:9px}.preset-grid{gap:5px}.preset{font-size:9px;padding:6px 2px}.preset-mark{width:36px;height:36px}.preset-mark svg{width:22px}.dot-style{padding:10px 5px;font-size:10px;gap:5px}.preview-canvas{min-height:300px}.qr-target{width:min(248px,100%)}.features-grid,.bottom-grid{grid-template-columns:1fr}.content-section{padding:50px 0}.footer-inner{flex-direction:column;align-items:flex-start}.footer-bottom{flex-direction:column}.legal-container{padding:25px;margin:30px auto}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}