body{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;margin:0;min-height:100vh;background:radial-gradient(circle at top,#f5f7fb 0%,#e7edf9 55%,#dfe9f6 100%);color:#111;display:flex;align-items:center;justify-content:center;padding:24px;width:100%;overflow-x:hidden}*{box-sizing:border-box}html{width:100%;overflow-x:hidden}main{max-width:680px;width:100%;min-width:0;background:rgba(255,255,255,.95);border-radius:18px;box-shadow:0 24px 50px #18274b26;padding:28px 28px 32px;border:1px solid rgba(255,255,255,.7)}h1{margin-top:0;font-size:1.8rem;letter-spacing:.02em;margin-bottom:18px;text-align:center}.form{display:grid;gap:14px;margin-bottom:18px;min-width:0}.form>*{min-width:0}label{display:flex;flex-direction:column;gap:6px;font-weight:500;color:#16203a;min-width:0}label small{color:#16203abf;font-weight:400}.fieldGroup{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px}.fieldGroup>label{min-width:0}.iconPicker{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px;width:100%;min-width:0;max-width:100%}.iconButton{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;font-size:.9rem;border-radius:8px;border:1px solid #ccc;background:#fff;cursor:pointer;color:#111;max-width:100%;min-width:0}.iconButton span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.iconButton.selected{border-color:#36739a;background:rgba(54,115,154,.12)}.iconButton:hover:not(:disabled){background:rgba(54,115,154,.14)}label.checkbox{flex-direction:row;align-items:center;gap:10px;font-weight:500;color:#101828cc}label.checkbox input{width:18px;height:18px;accent-color:#36739a}input[type=text],input[type=number]{width:100%;max-width:100%;min-width:0;padding:11px 14px;font-size:1rem;color:#132236;border:1px solid rgba(54,115,154,.24);border-radius:14px;background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(246,250,255,.95));box-shadow:inset 0 1px #ffffffe6,0 2px 8px #1a2d4814;transition:border-color .18s ease,box-shadow .18s ease,transform .12s ease}input[type=text]::placeholder,input[type=number]::placeholder{color:#1322367a}input[type=text]:focus,input[type=number]:focus{outline:none;border-color:#36739ae6;box-shadow:0 0 0 4px #36739a24,0 10px 18px #20426521;transform:translateY(-1px)}.sizeInput{width:100%;max-width:100%;min-width:0;-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield}.sizeInput::-webkit-outer-spin-button,.sizeInput::-webkit-inner-spin-button{margin:0}.customLogoInput{width:100%;max-width:100%;min-width:0;padding:12px 16px;border:1px solid rgba(54,115,154,.3);border-radius:10px;background:linear-gradient(180deg,#ffffff 0%,#f4f9ff 100%);box-shadow:inset 0 1px #fffffff2,0 4px 12px #2042651a;transition:border-color .18s ease,box-shadow .18s ease,transform .12s ease}.customLogoInput::placeholder{color:#13223680}.customLogoInput:focus,.customLogoInput:focus-visible{outline:none;border-color:#36739af2;box-shadow:0 0 0 4px #36739a29,0 12px 20px #20426524;transform:translateY(-1px)}input[type=color]{width:46px;height:46px;padding:0;border:1px solid rgba(16,24,40,.25);border-radius:10px;background:#fff;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;box-shadow:0 6px 16px #1018281f;transition:transform .15s ease,box-shadow .15s ease}input[type=color]:hover{transform:translateY(-1px);box-shadow:0 10px 22px #1018282e}input[type=color]::-webkit-color-swatch-wrapper{padding:0;border-radius:10px}input[type=color]::-webkit-color-swatch{border:none;border-radius:10px}input[type=color]:focus{outline:none;box-shadow:0 0 0 4px #36739a1f}button{padding:10px 16px;font-size:1rem;border-radius:10px;border:1px solid rgba(54,115,154,.55);background:linear-gradient(135deg,#36739a,#2a5f80);color:#fff;cursor:pointer;box-shadow:0 10px 20px #36739a33;transition:transform .15s ease,box-shadow .15s ease}button:disabled{opacity:.65;cursor:not-allowed;box-shadow:none}button:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 14px 22px #36739a40}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.spinner{display:inline-block;width:18px;height:18px;border:2px solid rgba(255,255,255,.7);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite;margin-right:10px}button.loading{pointer-events:none;opacity:.9}.copyMessage{margin-top:10px;font-size:.9rem;color:#36739a;text-align:center}button svg,.button svg{margin-right:8px;width:1.05em;height:1.05em}.result{display:grid;gap:12px;margin-top:16px}.result img{max-width:100%;border:1px solid rgba(0,0,0,.12);border-radius:10px;background:white}.actions{display:flex;gap:10px;flex-wrap:wrap;width:100%;min-width:0}.actions>*{min-width:0;max-width:100%}.layout{display:grid;gap:18px;width:100%;min-width:0}.panel{background:rgba(255,255,255,.92);border:1px solid rgba(54,115,154,.14);border-radius:16px;padding:14px;width:100%;min-width:0}.button{display:inline-flex;align-items:center;justify-content:center;padding:10px 16px;border-radius:8px;border:1px solid #36739a;background:#36739a;color:#fff;text-decoration:none;cursor:pointer;font-size:1rem}.button:hover{background:#2a5f80}.button.secondary{border-color:#666;background:#f4f4f4;color:#222}.button.secondary:hover{background:#e0e0e0}.supportRow{margin-top:14px;display:flex;justify-content:center}.bmcButton{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 16px;border-radius:999px;text-decoration:none;font-size:.94rem;font-weight:600;color:#fff;background:#4ac15e;border:1px solid #39a84d;box-shadow:0 8px 16px #4ac15e47;transition:transform .14s ease,box-shadow .14s ease,background .14s ease}.bmcButton:hover{transform:translateY(-1px);background:#3db353;box-shadow:0 10px 18px #4ac15e5c}.error{color:#c53030;background:#ffe3e3;padding:12px;border-radius:8px;border:1px solid #f5c2c2}.footer{margin-top:24px;font-size:.9rem;color:#444}code{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;background:rgba(0,0,0,.05);padding:0 4px;border-radius:4px}@media (max-width: 768px){body{align-items:flex-start;padding:10px}main{max-width:100%;border-radius:22px;padding:16px 12px 18px;box-shadow:0 16px 28px #18274b1f}h1{font-size:1.4rem;margin-bottom:10px;line-height:1.2}.heroSub{font-size:.92rem;line-height:1.4;margin-bottom:6px}.form{gap:11px}label{font-size:.9rem}.fieldGroup{grid-template-columns:1fr;gap:8px}.fieldGroup input[type=color]{width:100%;height:42px}.iconPicker{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;overflow:visible;padding:2px 0}.iconButton{justify-content:center;width:100%;border-radius:12px}.actions{flex-direction:column}.generateBtn,.actions .button{width:100%;min-height:44px}}@media (max-width: 420px){body{padding:8px}main{border-radius:18px;padding:14px 10px 16px}.iconButton{min-width:0;font-size:.84rem;padding:7px 10px}.supportRow{margin-top:12px}.bmcButton{width:100%}}