@import url('fonts.css');
.cgn-studio{box-sizing:border-box;width:min(1370px,98vw);max-width:98vw;height:min(940px,96dvh);max-height:96dvh;margin:auto;padding:0;border:0;border-radius:10px;color:#16191d;background:#fff;box-shadow:0 22px 90px #0007;font:15px/1.45 Arial,sans-serif}
.cgn-studio::backdrop{background:#0b0d14bd}.cgn-studio[open]{display:flex;flex-direction:column}.cgn-studio *{box-sizing:border-box}.cgn-head,.cgn-toolbar,.cgn-summary{padding:12px 20px}.cgn-head,.cgn-toolbar{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #d9d9df}.cgn-head strong{font-size:21px}.cgn-studio button,.cgn-studio select,.cgn-studio input,.cgn-studio textarea{font:inherit;text-transform:none;letter-spacing:normal;margin:0}.cgn-studio button{background:white;color:#222;border:1px solid #bdc2ca;border-radius:5px;padding:6px 12px;min-height:36px;line-height:1.2;cursor:pointer}.cgn-layout{display:grid;grid-template-columns:55% 45%;min-height:0;flex:1}.cgn-left{padding:18px;background:#f4f5f7}.cgn-right{overflow-y:auto;overscroll-behavior:contain;padding:0 20px 22px}.cgn-screen{position:relative;background:radial-gradient(ellipse at 48% 46%,#33343d,#15151d 65%,#101017);border-radius:8px;overflow:hidden}.cgn-screen canvas{display:block;width:100%;height:auto}.cgn-meter{position:absolute;bottom:6%;left:15%;right:15%;border-bottom:1px solid #c6bfbe;color:white;text-align:center;font-size:14px}.cgn-proof{font-size:13px;padding:12px;color:#535660}.cgn-step{padding:16px 0;border-bottom:1px solid #ddd}.cgn-step small{font-size:11px;letter-spacing:.12em;font-weight:700;color:#585b65}.cgn-step h3,.cgn-summary h3{margin:3px 0 12px;color:#1d2025}.cgn-step label,.cgn-summary label{display:block;margin:9px 0;font-weight:600}.cgn-step select,.cgn-step textarea,.cgn-summary input{display:block;width:100%;margin:4px 0}.cgn-chips,.cgn-presets{display:flex;flex-wrap:wrap;gap:5px;margin:9px 0}.cgn-chips button{display:inline-flex;align-items:center;gap:5px;font-size:13px}.cgn-chips i{display:inline-block;width:14px;height:14px;border:1px solid #aaa;border-radius:50%}.cgn-studio button[aria-pressed=true]{border:2px solid #175aa4;background:#edf4fc}.cgn-summary strong{display:block;font-size:19px;margin:9px 0}.cgn-summary button,.cgn-launch{background:#183e69;color:white}.cgn-choice{border:1px solid #d3dae5;border-radius:6px;padding:10px}.cgn-cap,.cgn-step p{font-size:14px}.cgn-step summary{cursor:pointer;font-weight:bold}.cgn-summary{padding-left:0}.cgn-studio:modal{position:fixed}
@media(max-width:800px){.cgn-studio{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;border-radius:0}.cgn-layout{display:block;overflow:auto}.cgn-right{overflow:visible}.cgn-left{padding:8px}.cgn-screen canvas{height:min(38dvh,330px);width:100%;object-fit:contain}.cgn-proof,.cgn-toolbar{padding:5px 10px}.cgn-proof{margin:3px}.cgn-step{padding:13px 0}}
.cgn-tabs{display:flex;gap:5px;margin:0 0 12px}.cgn-panel{margin:8px 0}.cgn-panel[hidden],.cgn-studio textarea[hidden]{display:none}.cgn-studio .cgn-step input[type=number]{width:100%;height:38px}.cgn-step details{margin:8px 0}.cgn-step a{display:inline-block;margin-top:8px}
.cgn-preview-price{position:absolute;top:5%;right:4%;padding:7px 11px;border-radius:5px;background:rgba(14,15,20,.86);color:white;font-size:18px}.cgn-toolbar{gap:6px;flex-wrap:wrap;justify-content:flex-start}.cgn-meter[hidden]{display:none}
.cgn-studio label.cgn-native-font{display:none}
.cgn-font-picker{padding:0;margin:12px 0 16px;border:0;min-width:0}
.cgn-font-picker legend{font:600 15px/1.4 Arial,sans-serif;padding:0}
.cgn-font-picker .cgn-chips{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:6px}
.cgn-font-picker .cgn-chips button{min-height:42px;font-size:20px;font-weight:400;justify-content:center;padding:5px;line-height:1.25}

.cgn-mini-form label.mini-replaced,.cgn-mini-active .cgn-step:nth-child(2),.cgn-mini-active .cgn-font-picker,.cgn-mini-active [aria-label="color options"],.cgn-mini-active .cgn-presets,.cgn-mini-active .cgn-step:first-child details,.cgn-mini-active .cgn-toolbar button:nth-child(3){display:none!important}
.cgn-mini{margin:12px 0}.cgn-mini h3{margin:16px 0 8px}.mini-tabs,.mini-cards,.mini-symbols,.mini-row{display:grid;gap:8px}.mini-tabs,.mini-symbols{grid-template-columns:repeat(3,minmax(0,1fr))}.mini-cards{grid-template-columns:repeat(2,minmax(0,1fr));padding:12px;border:1px solid #dedbe3}.cgn-mini button{min-height:42px;height:auto;white-space:normal;line-height:1.3;margin:0;border:1px solid #d3d1da;background:white;border-radius:8px;text-transform:none;padding:9px;color:#252033}.mini-cards span,.mini-cards strong{display:block}.mini-cards span{font-size:13px}.cgn-mini button[aria-pressed=true]{border:2px solid #7334d6;background:#f7f1ff;color:#5421ad}.mini-row{grid-template-columns:2fr 1fr 1fr;margin-bottom:8px}.mini-row>*{min-width:0;width:100%;margin:0}.cgn-mini-active .cgn-mini{display:block}@media(max-width:600px){.mini-row{grid-template-columns:1fr 1fr}.mini-row input{grid-column:1/-1}}
.mini-row .mini-font-trigger,.mini-font-list button{font-size:20px;font-weight:400;letter-spacing:normal;text-transform:none;line-height:1.45}
.mini-font-trigger::after{content:'\25BE';font:12px sans-serif;margin-left:6px}
.mini-row .mini-font-list{grid-column:1/-1;display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:5px}
.mini-row .mini-font-list[hidden]{display:none}
.mini-row .mini-color-list{display:grid;grid-column:1/-1;grid-template-columns:repeat(auto-fit,minmax(min(110px,100%),1fr));gap:5px}
.mini-row .mini-color-list[hidden]{display:none}
.mini-color-trigger,.mini-color-list button{display:flex;align-items:center;justify-content:center;gap:5px}
.mini-led-swatch{display:inline-block;width:15px;height:15px;flex:none;border:1px solid #767680;border-radius:50%}
.mini-color-trigger::after{content:'\25BE';font:12px sans-serif}
.cgn-studio label.cgn-illustrated-select{display:none!important}
.cgn-image-options{border:0;padding:0;margin:14px 0;min-width:0}.cgn-image-options legend{font-weight:650;margin-bottom:6px}
.cgn-image-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(126px,100%),1fr));gap:7px}
.cgn-studio .cgn-image-grid button{position:relative;height:auto;min-width:0;margin:0;padding:5px;border:1px solid #b9c4d2;border-radius:7px;background:white;color:#172737;white-space:normal;text-transform:none;letter-spacing:normal;line-height:1.3}
.cgn-image-grid img{display:block;width:100%;height:78px;object-fit:contain;background:#253546;border-radius:4px}
.cgn-image-grid span{display:block;padding:5px 2px;font-size:13px}.cgn-studio .cgn-image-grid button[aria-pressed=true]{border-color:#165eba;box-shadow:inset 0 0 0 1px #165eba;background:#eef5ff}
.cgn-image-grid button[aria-pressed=true]::after{content:'\2713';position:absolute;top:7px;right:7px;background:#165eba;color:white;border-radius:50%;width:19px;height:19px}.cgn-dimmer-picture{width:152px;height:84px;display:block;border-radius:5px}
.cgn-width-row{grid-template-columns:repeat(2,minmax(0,1fr));align-items:end;gap:10px;margin:10px 0 14px}
.cgn-width-row>label,.cgn-width-row input[type=number]{display:block;width:100%;min-width:0;margin:0;box-sizing:border-box}
.cgn-width-row input[type=number],.cgn-width-price strong{min-height:40px;margin:4px 0 0;box-sizing:border-box}
.cgn-width-price span{display:block;font-size:14px;font-weight:600}
.cgn-width-price strong{display:flex;align-items:center;padding:4px 10px;background:#eef5ff;border:1px solid #becfe2;border-radius:5px;color:#133f72;font-size:17px;line-height:1.2}
.cgn-trace{margin:16px 0;padding:12px;border:1px solid #b8c7d6;border-radius:8px}
.cgn-trace p{font-size:13px;line-height:1.5}.cgn-trace button{margin:3px;padding:7px 10px}
.cgn-trace-lines{display:flex;flex-wrap:wrap;max-height:170px;overflow:auto;gap:3px}
.cgn-trace-lines button[aria-pressed=true]{background:#e5f2ff;border:2px solid #165eba;color:#123e70}
.cgn-trace input[type=range]{width:100%}
.cgn-trace button[aria-pressed=true]{background:#e9f1ff;border:2px solid #165eba;color:#173b6a}
.cgn-trace-groups{display:flex;flex-wrap:wrap;gap:4px}
.cgn-markup-field{border-top:1px solid #cad2dc;padding-top:12px;margin-top:12px}
@media(max-width:800px){.cgn-screen canvas{width:auto;height:auto;max-width:100%;max-height:min(38dvh,330px);margin-inline:auto}}