:root{--navy:#061b38;--navy2:#08284f;--blue:#1674ff;--violet:#642cff;--ink:#0a1730;--muted:#71809b;--line:#dce6f4;--bg:#f4f8ff;--white:#fff}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:linear-gradient(145deg,#f9fbff,#eef6ff);font:14px/1.5 Inter,Segoe UI,Arial,sans-serif;color:var(--ink);overflow-x:hidden}button,input{font:inherit}a{text-decoration:none}.topbar{height:70px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 24px;gap:18px;position:sticky;top:0;z-index:50}.menuBtn{border:0;background:transparent;color:var(--navy);font-size:25px;cursor:pointer}.brand{display:flex;align-items:center;gap:10px;color:var(--navy);min-width:310px}.brandLogo{width:46px;height:46px;object-fit:contain;filter:drop-shadow(0 5px 8px #18488c25)}.brand>span:last-child{display:grid;line-height:1.05}.brand b{font-size:16px}.brand small{font-size:8px;margin-top:5px;color:#365078}.topsearch{max-width:560px;flex:1;position:relative;margin:auto}.topsearch input{width:100%;height:42px;border:1px solid #ccdaf0;border-radius:13px;padding:0 70px 0 38px;background:#f8fbff;outline:0}.topsearch input:focus{border-color:#7aa6ff;box-shadow:0 0 0 3px #1674ff12}.topsearch span{position:absolute;left:14px;top:7px;font-size:20px;color:#6f86ad}.topsearch kbd{position:absolute;right:9px;top:9px;border:1px solid #d8e3f3;background:white;border-radius:6px;padding:2px 6px;color:#789}.toplinks a{color:#324b74}.appShell{display:grid;grid-template-columns:240px 1fr;min-height:calc(100vh - 70px)}.sidebar{background:linear-gradient(180deg,#061b38,#06264d);padding:18px 10px;position:sticky;top:70px;height:calc(100vh - 70px);z-index:40}.side{display:flex;align-items:center;gap:12px;color:#d7e5fb;padding:11px 13px;border-radius:10px;margin:2px 0}.side i{font-style:normal;width:24px;text-align:center;font-size:17px}.side:hover,.side.selected{background:#ffffff16}.side.active{background:linear-gradient(90deg,#1d8dff,#6b2cff);color:#fff;box-shadow:0 9px 22px #0002}.sideTitle{font-size:10px;color:#7fa0ca;letter-spacing:.08em;margin:23px 10px 8px}.main{position:relative;min-width:0;overflow:hidden}.service-bubbles{position:fixed;inset:70px 0 auto 240px;height:300px;pointer-events:none;z-index:0;overflow:hidden}.service-bubbles span{position:absolute;width:74px;height:74px;border-radius:50%;display:grid;place-items:center;text-align:center;font-weight:800;font-size:11px;color:#19498e;background:radial-gradient(circle at 35% 25%,#fff,#dcecff 58%,#9fc4ff);border:1px solid #b6d2ff;box-shadow:inset 0 0 16px #fff,0 10px 30px #4f7cc422;animation:float 6s ease-in-out infinite}.service-bubbles .b1{left:10%;top:35px}.service-bubbles .b2{left:28%;top:15px;animation-delay:-1s;color:#6127c9;background:radial-gradient(circle at 35% 25%,#fff,#eadfff,#c7aaff)}.service-bubbles .b3{left:18%;top:105px;animation-delay:-2s;color:#087d52;background:radial-gradient(circle at 35% 25%,#fff,#d7fff0,#a6efd1)}.service-bubbles .b4{right:26%;top:15px;animation-delay:-3s}.service-bubbles .b5{right:10%;top:105px;animation-delay:-1.5s;color:#087d52;background:radial-gradient(circle at 35% 25%,#fff,#d7fff0,#a6efd1)}.service-bubbles .b6{left:3%;top:140px;animation-delay:-2.5s;color:#be267f;background:radial-gradient(circle at 35% 25%,#fff,#ffe0f2,#ffb7dc)}.service-bubbles .b7{left:12%;top:205px;animation-delay:-4s;color:#a55d00;background:radial-gradient(circle at 35% 25%,#fff,#fff1d8,#ffd28e)}.service-bubbles .b8{left:35%;top:125px;width:54px;height:54px;font-size:9px}.service-bubbles .b9{right:3%;top:55px;color:#c22778;background:radial-gradient(circle at 35% 25%,#fff,#ffe0f2,#ffb7dc)}.intro{position:relative;z-index:2;text-align:center;padding:58px 24px 16px;min-height:285px;background:radial-gradient(circle at 50% 15%,#ffffffcc,#eef8ff99 60%,transparent)}.ownership{display:inline-block;background:linear-gradient(90deg,#2588ff,#6632ff);color:white;border-radius:99px;padding:6px 16px;font-size:11px;font-weight:700;box-shadow:0 8px 22px #4f57ff30}.intro h1{font-size:44px;line-height:1.05;margin:15px 0 7px;letter-spacing:-.04em}.intro h1 em{font-style:normal;background:linear-gradient(90deg,#1c82ff,#672cff);-webkit-background-clip:text;color:transparent}.intro>p{color:#52698e;font-size:16px;margin:0 auto 18px;max-width:700px}.quickNav{display:grid;grid-template-columns:repeat(6,1fr);gap:7px;max-width:1120px;margin:0 auto}.quickNav a{background:#ffffffd9;border:1px solid #cedcf1;color:#183a6a;padding:11px 9px;border-radius:10px;font-weight:700;box-shadow:0 4px 16px #365f9820}.quickNav a:hover,.quickNav a.active{background:linear-gradient(90deg,#248bff,#6a2dff);color:white;border-color:transparent;transform:translateY(-2px)}.workspace{position:relative;z-index:3;max-width:1260px;margin:0 auto 28px;padding:0 18px;display:grid;grid-template-columns:300px minmax(360px,1fr) 300px;gap:10px}.leftPanel,.rightPanel{display:grid;gap:10px;align-content:start}.panel{background:#fff;border:1px solid var(--line);border-radius:14px;padding:15px;box-shadow:0 10px 30px #123b7110}.panel h3{margin:0 0 2px;font-size:15px}.panel>p,.panelHead p{margin:0;color:var(--muted);font-size:11px}.drop{height:205px;border:1.5px dashed #9dbce9;border-radius:13px;margin:12px 0 8px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#f9fbff;cursor:pointer}.drop:hover,.drop.over{background:#f0f6ff;border-color:#247fff}.drop input{display:none}.uploadIcon{font-size:32px;color:#247fff}.drop b{font-size:15px;margin:6px}.drop small{color:#71809b}.drop strong{margin-top:14px;padding:8px 20px;border-radius:8px;background:linear-gradient(90deg,#1674ff,#6432ff);color:#fff;font-size:11px}.seg{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}.seg button{border:1px solid #d2deef;background:#fff;border-radius:10px;padding:12px 8px;cursor:pointer;color:#263c60}.seg button b,.seg button small{display:block}.seg button small{font-size:9px;margin-top:4px;color:#72819a}.seg button.active{border-color:#6d52ff;background:#f7f5ff;color:#3920c6}.range{margin-top:12px}.range label{display:flex;justify-content:space-between;font-size:10px;color:#71809b}.range input{width:100%;accent-color:#5b3dff}.centerPanel{min-width:0}.previewPanel{padding:0;overflow:hidden;min-height:590px}.panelHead{height:58px;padding:0 14px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.progress{height:3px;background:#edf2fa}.progress span{display:block;width:0;height:100%;background:linear-gradient(90deg,#1674ff,#672cff);transition:.25s}.grid{padding:12px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;align-content:start}.empty{grid-column:1/-1;min-height:480px;display:grid;place-items:center;align-content:center;text-align:center;color:#8492a8}.empty div{font-size:45px;color:#8eabdd}.empty h3{margin:6px 0;color:#314667}.empty p{max-width:320px}.card{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:white;animation:pop .35s ease both}.preview{aspect-ratio:1/1;background-color:#fff;background-image:linear-gradient(45deg,#eef1f5 25%,transparent 25%),linear-gradient(-45deg,#eef1f5 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#eef1f5 75%),linear-gradient(-45deg,transparent 75%,#eef1f5 75%);background-size:16px 16px;background-position:0 0,0 8px,8px -8px,-8px 0;position:relative}.preview img{width:100%;height:100%;object-fit:contain}.badge{position:absolute;top:7px;left:7px;background:#07152dcc;color:#fff;padding:3px 6px;border-radius:6px;font-size:8px}.cardbody{padding:9px}.name{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:11px}.meta{color:var(--muted);font-size:9px;margin:2px 0 7px}.actions{display:flex;gap:5px}.actions button,.actions a{flex:1;text-align:center;border:0;background:#edf3fb;color:#21436d;border-radius:7px;padding:6px;font-size:9px;cursor:pointer}.bgTabs{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin:13px 0}.bgTabs button{border:1px solid #d6e1f1;background:#f9fbff;padding:9px;border-radius:8px;cursor:pointer;color:#345072}.bgTabs .active{background:linear-gradient(90deg,#258aff,#682eff);color:white;border-color:transparent}.fieldLabel{font-size:10px;font-weight:700;display:block;margin:10px 0 6px}.colorWide{width:100%;height:55px;border:1px solid var(--line);border-radius:9px;padding:3px;background:white}.colorLine{display:flex;gap:8px;align-items:center;margin:8px 0 18px}.colorLine #hex{width:85px;height:34px;border:1px solid var(--line);border-radius:7px;padding:0 8px}.swatches{display:flex;gap:5px}.swatches button{width:23px;height:23px;border-radius:50%;border:2px solid white;box-shadow:0 0 0 1px #cad5e5;cursor:pointer}.swatches button:nth-child(1){background:#fff}.swatches button:nth-child(2){background:#0f172a}.swatches button:nth-child(3){background:#dc2626}.swatches button:nth-child(4){background:#1d4ed8}.swatches button:nth-child(5){background:#16a34a}.swatches button:nth-child(6){background:#f59e0b}.primary,.secondary,.success,.outline,.ghost{border:0;border-radius:9px;padding:10px 12px;cursor:pointer;font-weight:700}.primary{background:linear-gradient(90deg,#1674ff,#632eff);color:#fff}.success{background:#0dbd73;color:#fff}.secondary{background:#edf3fb;color:#26466f}.outline{background:white;border:1px solid #1b68f3;color:#1658c8}.ghost{background:#f4f7fb;color:#60708b}.full{width:100%;margin-top:7px}.hint{display:block;color:#7a879c;font-size:9px;margin-top:5px}.mini{background:linear-gradient(145deg,#071d3b,#0a3260);color:white}.mini p{color:#c7d7ee;margin-top:8px}.mini span{font-size:10px;color:#7db5ff}.working:after{content:'';position:absolute;inset:0;background:linear-gradient(110deg,transparent 25%,#ffffffaa 45%,transparent 65%);animation:shine 1.1s infinite}footer{background:#061b38;color:#c3d2e7;padding:18px 28px;font-size:11px}footer span{margin-left:20px;color:#8facd2}#toast{position:fixed;right:20px;bottom:20px;z-index:99;background:#061b38;color:white;padding:11px 15px;border-radius:10px;box-shadow:0 12px 30px #0003;opacity:0;transform:translateY(20px);pointer-events:none;transition:.25s}#toast.show{opacity:1;transform:none}@keyframes float{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-16px) scale(1.04)}}@keyframes pop{from{opacity:0;transform:translateY(8px)}}@keyframes shine{to{transform:translateX(100%)}}@media(max-width:1100px){.workspace{grid-template-columns:280px 1fr}.rightPanel{grid-column:1/-1;grid-template-columns:1fr 1fr}.quickNav{grid-template-columns:repeat(3,1fr)}.service-bubbles{left:0}.toplinks{display:none}}@media(max-width:800px){.appShell{grid-template-columns:1fr}.sidebar{position:fixed;left:-260px;top:70px;width:240px;transition:.25s}.sidebar.open{left:0}.brand{min-width:0}.brand>span:last-child{display:none}.topsearch kbd{display:none}.topsearch input{padding-right:10px}.intro{padding-top:38px}.intro h1{font-size:36px}.service-bubbles{inset:70px 0 auto 0;opacity:.45}.workspace{grid-template-columns:1fr;padding:0 10px}.rightPanel{grid-column:auto;grid-template-columns:1fr}.quickNav{grid-template-columns:1fr 1fr}.grid{grid-template-columns:1fr}.previewPanel{min-height:480px}}@media(max-width:480px){.topbar{padding:0 10px}.topsearch{max-width:none}.intro{padding-left:12px;padding-right:12px}.intro h1{font-size:32px}.quickNav{grid-template-columns:1fr 1fr}.quickNav a{font-size:11px}.workspace{padding:0 7px}.seg{grid-template-columns:1fr}.service-bubbles span{transform:scale(.8)}}

.iconTop{border:1px solid #d8e3f3;background:#fff;color:#3b43ff;width:38px;height:38px;border-radius:20px;cursor:pointer}.toplinks{display:flex;align-items:center;gap:18px}.softDark{--bg:#0b1730}.softDark .main{filter:saturate(.95)}.softDark .topbar{box-shadow:0 2px 16px #0a244415}@media(max-width:1100px){.quickNav{grid-template-columns:repeat(3,1fr)}}@media(max-width:800px){}

.qrWorkspace{margin:0 24px 24px;background:#fff;border:1px solid #dce6f5;border-radius:18px;box-shadow:0 12px 35px rgba(15,23,42,.08);overflow:hidden}.qrWorkspace[hidden]{display:none!important}.qrFrameHead{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 18px;border-bottom:1px solid #e7edf6}.qrFrameHead h2{margin:0;color:#0b2d5b}.qrFrameHead p{margin:4px 0 0;color:#64748b}.qrWorkspace iframe{display:block;width:100%;height:calc(100vh - 170px);min-height:720px;border:0;background:#f7faff}@media(max-width:700px){.qrWorkspace{margin:0 10px 16px}.qrFrameHead{align-items:flex-start;flex-direction:column}.qrWorkspace iframe{height:900px;min-height:900px}}

.textareaField{width:100%;min-height:132px;border:1px solid #d6e1f1;border-radius:12px;padding:12px;background:#f9fbff;outline:none;resize:vertical;color:#16345c;font:13px/1.5 Inter,Segoe UI,Arial,sans-serif}
.textareaField:focus{border-color:#7aa6ff;box-shadow:0 0 0 3px #1674ff12}.textareaField.tall{min-height:250px}
.double{display:grid;grid-template-columns:1fr 1fr;gap:12px}.smallColor{height:42px}.statsMini{display:flex;justify-content:space-between;gap:10px;margin:8px 0 12px;color:#71809b;font-size:10px}.btnRow{display:flex;gap:8px;flex-wrap:wrap}.btnRow .primary,.btnRow .secondary{flex:1}.pill{display:inline-flex;align-items:center;justify-content:center;padding:6px 10px;border-radius:999px;font-size:11px;font-weight:700}.pill.ok{background:#e7f9f0;color:#0a8f55}.qrPreviewPanel{padding:0;overflow:hidden}.qrPreviewWrap{min-height:530px;display:grid;place-items:center;padding:26px;background:linear-gradient(145deg,#f6fbff,#eff5ff)}.qrPreviewWrap img{max-width:min(88%,480px);width:auto;height:auto;border-radius:16px;box-shadow:0 18px 40px rgba(24,73,142,.15)}.qrCaption{text-align:center;margin-top:16px;color:#516987;display:grid;gap:4px}.formatBtns{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:14px 0 8px}.statsStack{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:10px 0 14px}.statsStack div{background:#f8fbff;border:1px solid #d6e1f1;border-radius:12px;padding:12px;text-align:center}.statsStack strong{display:block;font-size:24px;color:#153f73}.statsStack span{display:block;font-size:10px;color:#73819a;margin-top:3px}.quickChips{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.chip{border:1px solid #d4e1f3;background:#f8fbff;color:#21436d;padding:8px 12px;border-radius:999px;cursor:pointer;transition:.2s}.chip:hover{transform:translateY(-1px);background:#eef5ff}.multiGrid{padding:12px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;align-content:start}.multiCard{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:white;animation:pop .35s ease both}.qrTile{aspect-ratio:1/1;padding:18px;display:grid;place-items:center;background:#fff}.qrTile img{max-width:100%;max-height:100%;object-fit:contain}.miniDanger{border:1px solid #e6d0d0;color:#ab4141;background:#fff5f5}.side,.quickNav a,.primary,.secondary,.success,.outline,.ghost,.chip,.formatBtns button,.actions button,.actions a{transition:all .18s ease}.primary:hover,.secondary:hover,.success:hover,.outline:hover,.ghost:hover,.formatBtns button:hover,.actions button:hover,.actions a:hover{transform:translateY(-1px);box-shadow:0 10px 24px rgba(21,82,163,.12)}
@media(max-width:1100px){.multiGrid{grid-template-columns:1fr}.double{grid-template-columns:1fr}}

.sidebar{overflow-y:auto;overflow-x:hidden}
.sidebar::-webkit-scrollbar{width:8px}.sidebar::-webkit-scrollbar-thumb{background:#2c4d78;border-radius:8px}
.actions.three{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px}.danger{background:#fff1f2!important;color:#b42318!important;border:1px solid #f5c2c7!important}.successMini{background:#e8fff4!important;color:#0f8a54!important;border:1px solid #b7eed2!important}.secondaryMini{background:#edf3fb!important;color:#26466f!important;border:1px solid #d7e4f4!important}
.downloadGrid{padding:12px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;align-content:start}.downloadCard .preview{aspect-ratio:1/1}.downloadCard .preview img{object-fit:contain}
.btnRow button,.formatBtns button,.quickNav a,.side,.actions button,.actions a,.chip,.outline,.primary,.secondary,.success,.ghost{transition:transform .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease}
.btnRow button:hover,.formatBtns button:hover,.quickNav a:hover,.side:hover,.actions button:hover,.actions a:hover,.chip:hover,.outline:hover,.primary:hover,.secondary:hover,.success:hover,.ghost:hover{transform:translateY(-2px);box-shadow:0 14px 28px rgba(16,66,148,.16)}
@media(max-width:1100px){.downloadGrid{grid-template-columns:1fr}.actions.three{grid-template-columns:1fr}}