:root{--bg:#05080b;--surface:#10151b;--surface-2:#171d25;--line:#232c37;--text:#eef1f4;--muted:#8b93a1;--volt:#19e6d4;--volt-ink:#03211f;--blue:#1fa8ff;--indigo:#4c4de0;--brand-gradient:linear-gradient(90deg, #19e6d4 0%, #1fa8ff 50%, #4c4de0 100%);--danger:#ff5a5f;--ok:#3ddc97;--radius:12px;--display:"Saira Condensed", Impact, sans-serif;--body:"Barlow", system-ui, sans-serif;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body{margin:0}body{background:var(--bg);color:var(--text);font:400 16px/1.5 var(--body);-webkit-font-smoothing:antialiased}h1,h2,h3{font-family:var(--display);text-transform:uppercase;letter-spacing:.01em;margin:0 0 .5em;line-height:1.05}h1{font-size:clamp(2.2rem,5vw,3.4rem);font-weight:800}h2{font-size:1.7rem;font-weight:700}h3{font-size:1.2rem;font-weight:700}a{color:var(--volt)}code{font-size:.85em}img{max-width:100%}button{font:inherit;color:inherit}input,select,textarea{width:100%;font:inherit;color:var(--text);background:var(--surface-2);border:1px solid var(--line);border-radius:8px;padding:.55rem .7rem}input:focus,select:focus,textarea:focus{outline:2px solid var(--volt);outline-offset:1px}input[type=range]{accent-color:var(--volt);background:0 0;border:0;padding:0}input[type=color]{cursor:pointer;width:38px;height:30px;padding:2px}label{color:var(--muted);gap:.3rem;font-size:.9rem;display:grid}.muted{color:var(--muted)}.small{font-size:.85rem}.error{color:var(--danger)}.ok{color:var(--ok)}.mt{margin-top:.75rem}.row{flex-wrap:wrap;align-items:center;display:flex}.row.between{justify-content:space-between}.gap{gap:.75rem}.gap-sm{gap:.5rem}.boot{text-align:center;place-content:center;min-height:100vh;padding:1rem;display:grid}.btn{cursor:pointer;font-family:var(--display);text-transform:uppercase;letter-spacing:.04em;border:1px solid #0000;border-radius:999px;justify-content:center;align-items:center;gap:.4rem;padding:.6rem 1.2rem;font-weight:700;text-decoration:none;transition:transform .1s,background .15s;display:inline-flex}.btn:active{transform:scale(.98)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn.primary{background:var(--volt);color:var(--volt-ink)}.btn.primary:hover:not(:disabled){background:#74f3e9}.btn.ghost{border-color:var(--line);color:var(--text);background:0 0}.btn.ghost:hover:not(:disabled){border-color:var(--muted)}.btn.danger{color:var(--danger)}.btn.sm{padding:.35rem .8rem;font-size:.85rem}.btn.lg{padding:.85rem 1.7rem;font-size:1.1rem}.link{color:var(--volt);cursor:pointer;background:0 0;border:0;padding:0;font-size:.85rem}.link.danger{color:var(--danger)}.chip{background:var(--surface-2);border:1px solid var(--line);cursor:pointer;border-radius:999px;padding:.3rem .8rem;font-size:.85rem}.chip:hover{border-color:var(--muted)}.chip.active{background:var(--volt);color:var(--volt-ink);border-color:var(--volt)}.chips{flex-wrap:wrap;gap:.4rem;margin-top:.5rem;display:flex}.badge{background:var(--surface-2);border:1px solid var(--line);font:600 .75rem var(--body);text-transform:none;vertical-align:middle;color:var(--volt);border-radius:999px;margin-left:.6rem;padding:.1rem .6rem;display:inline-block}.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:1rem}.tabs{background:var(--surface-2);border-radius:999px;margin-bottom:.8rem;padding:4px;display:inline-flex}.tabs button,.seg button{cursor:pointer;color:var(--muted);background:0 0;border:0;border-radius:999px;padding:.4rem 1rem}.tabs button.active,.seg button.active{background:var(--text);color:var(--bg)}.seg{background:var(--surface-2);border-radius:999px;padding:3px;display:inline-flex}.shell{flex-direction:column;min-height:100vh;display:flex}main{flex:1}.nav{z-index:10;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);background:#0b0d10d9;align-items:center;gap:1.5rem;padding:.7rem 1.5rem;display:flex;position:sticky;top:0}.nav nav{flex:1;gap:1.2rem;display:flex}.nav nav a{color:var(--muted);font-weight:500;text-decoration:none}.nav nav a.active,.nav nav a:hover{color:var(--text)}.nav-actions{align-items:center;gap:.6rem;display:flex}.brand{font:800 1.6rem var(--display);color:var(--text);letter-spacing:.02em;text-decoration:none}.brand span{color:var(--volt)}.brand.small{font-size:1.1rem}.plan-tag{text-transform:uppercase;letter-spacing:.05em;font-size:.75rem;font-weight:600}.plan-studio{color:var(--volt)}.plan-club{color:#7cc6ff}.footer{border-top:1px solid var(--line);flex-wrap:wrap;justify-content:space-between;gap:1rem;margin-top:3rem;padding:1.5rem;display:flex}.page,.section{max-width:1200px;margin:0 auto;padding:2rem 1.5rem 0}.section{padding-top:3.5rem}.page .section{padding-left:0;padding-right:0}.hero{grid-template-columns:1fr 1.1fr;align-items:center;gap:2rem;max-width:1200px;margin:0 auto;padding:3rem 1.5rem 1rem;display:grid}.hero h1{font-size:clamp(3.4rem,9vw,6.5rem);line-height:.92}.hero h1 em{color:var(--volt);font-style:normal}.eyebrow{color:var(--volt);font:700 .9rem var(--display);letter-spacing:.2em;text-transform:uppercase}.lead{color:#c3c9d3;max-width:34rem;font-size:1.15rem}.hero-stage{border:1px solid var(--line);background:#101318;border-radius:24px;height:min(640px,72vh);overflow:hidden}.steps{grid-template-columns:repeat(3,1fr);gap:1rem;margin:0;padding:0;list-style:none;display:grid}.steps li{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:1.2rem}.step-no{font:800 1rem var(--display);color:var(--volt);margin-right:.4rem}.sport-grid{grid-template-columns:repeat(3,1fr);gap:1rem;display:grid}.sport-grid.compact{grid-template-columns:repeat(6,1fr);gap:.6rem}.sport-tile{text-align:left;cursor:pointer;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);gap:.15rem;padding:1.1rem;display:grid;position:relative}.sport-tile:hover{border-color:var(--muted)}.sport-tile.selected{border-color:var(--volt);box-shadow:inset 0 0 0 1px var(--volt)}.sport-name{font:700 1.35rem var(--display);text-transform:uppercase}.arrow{color:var(--volt);font-size:1.3rem;position:absolute;top:1rem;right:1rem}.plans{grid-template-columns:repeat(3,1fr);gap:1rem;display:grid}.plan{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);flex-direction:column;padding:1.4rem;display:flex}.plan.featured{border-color:var(--volt)}.plan ul{color:#c3c9d3;flex:1;padding-left:1.1rem}.price{font:800 2.4rem var(--display);margin:0}.cta{text-align:center}.cta .lead{margin:0 auto 1.2rem}.create-step{margin-top:2rem}.upload{grid-template-columns:260px 1fr;align-items:start;gap:1.2rem;display:grid}.dropzone{aspect-ratio:1;border:2px dashed var(--line);border-radius:var(--radius);cursor:pointer;text-align:center;background:var(--surface);place-items:center;padding:1rem;display:grid}.dropzone:hover{border-color:var(--volt)}.dropzone input{display:none}.dropzone img{object-fit:contain;max-height:100%}.swatches{flex-wrap:wrap;align-items:center;gap:.4rem;display:flex}.swatch{border:1px solid #ffffff26;border-radius:6px;width:26px;height:26px}.concepts{grid-template-columns:repeat(4,1fr);gap:1rem;display:grid}.concept{align-content:start;gap:.5rem;display:grid}.concept p{margin:0}.kit-flat{background:radial-gradient(circle at 50% 45%, #232a33, var(--surface) 70%);border-radius:8px;width:100%;height:auto;display:block}.studio{grid-template-columns:310px 1fr 310px;gap:1rem;height:calc(100vh - 150px);min-height:560px;padding:.5rem 1.5rem 1rem;display:grid}.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:1rem;overflow-y:auto}.controls{align-content:start;gap:1rem;display:grid}.title-input{font:700 1.3rem var(--display);text-transform:uppercase;background:0 0;border-color:#0000;padding-left:.3rem}.title-input:hover{border-color:var(--line)}fieldset{border:0;border-top:1px solid var(--line);gap:.6rem;margin:0;padding:.8rem 0 0;display:grid}legend{font:700 .85rem var(--display);letter-spacing:.12em;text-transform:uppercase;color:var(--text);padding-right:.5rem}.colour-row{color:var(--text);grid-template-columns:40px 1fr auto;align-items:center;display:grid}.file-btn{position:relative}.file-btn input{opacity:0;cursor:pointer;position:absolute;inset:0}.stage{flex-direction:column;min-width:0;display:flex}.stage-toolbar{flex-wrap:wrap;align-items:center;gap:.8rem;margin-bottom:.5rem;display:flex}.viewer{border:1px solid var(--line);background:radial-gradient(at 50% 35%,#25303a 0%,#101318 75%);border-radius:20px;flex:1;min-height:420px}.side{align-content:start;gap:1.2rem;display:grid}.actions{gap:.5rem;display:grid}.versions{gap:.6rem;display:grid}.version{border:1px solid #0000;border-radius:8px;grid-template-columns:64px 1fr;gap:.6rem;padding:.4rem;display:grid}.version.selected{border-color:var(--volt)}.version img,.thumb-empty{object-fit:cover;background:var(--surface-2);border-radius:6px;width:64px;height:64px}.version strong,.version span{display:block}.compare-grid{grid-template-columns:1fr 1fr;gap:.5rem;display:grid}.compare figure{text-align:center;margin:0}.modal-backdrop{z-index:50;background:#0009;place-items:center;padding:1rem;display:grid;position:fixed;inset:0}.modal{gap:.8rem;width:min(460px,100%);display:grid}.size-grid{grid-template-columns:repeat(6,1fr);gap:.4rem;display:grid}.design-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1rem;margin-top:1rem;display:grid}.design-card{gap:.4rem;display:grid}.design-card h3,.design-card p{margin:0}.thumb{background:var(--surface-2);cursor:pointer;aspect-ratio:4/3;border:0;border-radius:8px;padding:0;overflow:hidden}.thumb img{object-fit:cover;width:100%;height:100%;display:block}.empty{text-align:center;padding:2.5rem}.artwork-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:.8rem;display:grid}.artwork-grid figure{margin:0}.artwork-grid img{aspect-ratio:1;object-fit:contain;background:var(--surface-2);border-radius:6px;width:100%}.artwork-grid figcaption{word-break:break-all;justify-content:space-between;gap:.4rem;margin-top:.3rem;display:flex}.table{border-collapse:collapse;width:100%;font-size:.95rem}.table th,.table td{text-align:left;border-bottom:1px solid var(--line);vertical-align:middle;padding:.6rem}.table th{font:700 .8rem var(--display);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}.table select{width:auto}.status{background:var(--surface-2);text-transform:capitalize;border-radius:999px;padding:.15rem .6rem;font-size:.8rem}.status-files_sent{color:var(--ok)}.status-rejected{color:var(--danger)}.status-in_review{color:#7cc6ff}.mini-thumb{object-fit:cover;border-radius:4px;width:40px;height:30px}.stats{grid-template-columns:repeat(4,1fr);gap:1rem;margin-bottom:.8rem;display:grid}.stat{display:grid}.stat-value{font:800 2.4rem var(--display)}.auth{place-items:center;padding:3rem 1rem;display:grid}.auth-card{gap:.9rem;width:min(420px,100%);display:grid}@media (width<=1100px){.studio{grid-template-columns:minmax(0,1fr);height:auto}.studio>*{min-width:0}.stage{order:-1}.viewer{flex:none;height:60vh}.concepts{grid-template-columns:repeat(2,1fr)}.sport-grid.compact{grid-template-columns:repeat(3,1fr)}}@media (width<=760px){.nav{flex-wrap:wrap;gap:.6rem;padding:.6rem 1rem}.nav nav{flex-basis:100%;order:3}.nav-actions{margin-left:auto}.nav-actions>span{display:none}.hero{grid-template-columns:1fr;padding:2rem 1rem 0}.hero-stage{height:420px}.page,.section{padding-left:1rem;padding-right:1rem}.studio{padding:1rem}.steps,.sport-grid,.plans,.stats{grid-template-columns:1fr 1fr}.concepts,.upload{grid-template-columns:1fr}.size-grid{grid-template-columns:repeat(3,1fr)}.table{display:block;overflow-x:auto}}@media (width<=480px){.steps,.sport-grid,.plans{grid-template-columns:1fr}}h1,.display{font-style:italic}.brand{line-height:1;display:grid}.wordmark{font:italic 800 1.7rem var(--display);letter-spacing:.02em;background:var(--brand-gradient);color:#0000;-webkit-background-clip:text;background-clip:text}.wordmark.small{font-size:1.2rem}.brand-tag{font:600 .55rem var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-top:2px}.pill{background:var(--volt);color:var(--volt-ink);font:800 .8rem var(--body);letter-spacing:.06em;text-transform:uppercase;border-radius:999px;padding:.35rem 1rem;display:inline-block}.hero h1 em{background:var(--brand-gradient);color:#0000;-webkit-background-clip:text;background-clip:text;padding-right:.08em}.mt-lg{margin-top:1.5rem}.nowrap{flex-wrap:nowrap}.narrow-top{padding-top:1rem}.flow{grid-template-columns:repeat(3,1fr);gap:2.5rem 3rem;margin:1.5rem 0 0;padding:0;list-style:none;display:grid}.flow-card{position:relative}.flow-card a{height:100%;color:inherit;background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:1.6rem 1.5rem 1.4rem;text-decoration:none;display:block;position:relative;overflow:hidden}.flow-card a:before{content:"";background:var(--brand-gradient);height:4px;position:absolute;top:0;left:1.5rem;right:1.5rem}.flow-card a:hover{border-color:var(--volt)}.flow-icon{width:52px;height:52px;color:var(--volt);background:#0a0f14;border-radius:50%;place-items:center;font-size:1.6rem;display:grid}.flow-step{color:var(--volt);font:italic 700 1rem ui-monospace,monospace;position:absolute;top:1.4rem;right:1.5rem}.flow-card h3{letter-spacing:0;margin:.8rem 0 .5rem;font:italic 700 1.45rem ui-monospace,Cascadia Mono,Consolas,monospace}.flow-card p{margin:0}.flow-card:after{color:var(--blue);font-size:1.6rem;position:absolute}.flow-1:after,.flow-2:after{content:"→";top:45%;right:-2.1rem}.flow-3:after{content:"↓";bottom:-2.3rem;left:50%}.flow-5:after,.flow-4:after{content:"←";top:45%;left:-2.1rem}.result{border-top:1px solid var(--line);margin-top:2rem;padding-top:1.2rem}.result strong{color:var(--volt);text-transform:uppercase;margin-right:1rem;font:italic 700 1.1rem ui-monospace,monospace}.stepper{grid-template-columns:repeat(6,1fr);gap:.4rem;margin:0 0 1rem;padding:0;list-style:none;display:grid}.stepper a{color:var(--muted);background:var(--surface);border:1px solid var(--line);border-radius:10px;align-items:center;gap:.5rem;padding:.5rem .7rem;text-decoration:none;display:flex;position:relative;overflow:hidden}.stepper li.done a{color:var(--text)}.stepper li.done a:before,.stepper li.current a:before{content:"";background:var(--brand-gradient);height:3px;position:absolute;top:0;left:0;right:0}.stepper li.current a{border-color:var(--volt);color:var(--text)}.stepper-no{color:var(--volt);font:italic 700 .8rem ui-monospace,monospace}.stepper-title{font:600 .85rem var(--body);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.studio-head{padding:.8rem 1.5rem 0}.studio-head .stepper{margin:0}.carousel{border:1px solid var(--line);touch-action:pan-y;-webkit-user-select:none;user-select:none;border-radius:24px;height:min(72vh,680px);margin:0 1.5rem;position:relative;overflow:hidden}.carousel-stage{position:absolute;inset:0}.carousel-copy{pointer-events:none;text-shadow:0 2px 18px #000000b3;max-width:420px;position:absolute;bottom:4.5rem;left:2.5rem}.carousel-copy .btn{pointer-events:auto}.sport-title{margin:0;font-size:clamp(3rem,7vw,5.5rem)}.carousel-arrow{color:#fff;cursor:pointer;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#05080b8c;border:1px solid #ffffff40;border-radius:50%;width:54px;height:54px;font-size:2rem;position:absolute;top:50%;transform:translateY(-50%)}.carousel-arrow:hover{border-color:var(--volt);color:var(--volt)}.carousel-arrow.left{left:1rem}.carousel-arrow.right{right:1rem}.carousel-dots{flex-wrap:wrap;justify-content:center;gap:.4rem;padding:0 1rem;display:flex;position:absolute;bottom:1rem;left:0;right:0}.carousel-dots button{color:#cfd6de;cursor:pointer;background:#05080b99;border:1px solid #ffffff2e;border-radius:999px;padding:.25rem .8rem;font-size:.8rem}.carousel-dots button.active{background:var(--volt);color:var(--volt-ink);border-color:var(--volt)}.prompt-grid{grid-template-columns:1fr 1fr;gap:1rem;margin-top:1rem;display:grid}.prompt-grid .card{align-content:start;gap:.6rem;display:grid}.prompt-grid h3{margin:0}.brand-colours{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.brand-colour{background:var(--surface-2);border:1px solid var(--line);border-radius:8px;align-items:center;gap:.2rem;padding:.2rem .4rem;display:inline-flex}.dropzone.wide{aspect-ratio:auto;min-height:120px}.uploads{gap:.6rem;display:grid}.upload-item{background:var(--surface-2);border-radius:10px;grid-template-columns:72px 1fr auto;align-items:center;gap:.7rem;padding:.5rem;display:grid}.upload-item img{object-fit:contain;background:#fff;border-radius:6px;width:72px;height:72px}.upload-item>div{gap:.3rem;min-width:0;display:grid}.upload-item strong{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.swatch.sm{border-radius:4px;width:18px;height:18px}.concepts-wrap{position:relative}.concept-view{aspect-ratio:3/4;background:radial-gradient(at 50% 35%,#25303a 0%,#0c1015 75%);border-radius:10px;width:100%}.views-canvas{pointer-events:none;z-index:1;inset:0;position:fixed!important}.concept h3,.concept p,.concept .swatches,.concept .btn{z-index:2;position:relative}.decal{background:var(--surface-2);border-radius:8px;gap:.4rem;padding:.6rem;display:grid}.decal-head{grid-template-columns:36px 1fr auto;align-items:center;gap:.5rem;display:grid}.decal-head img,.decal-text{object-fit:contain;color:#111;background:#fff;border-radius:6px;place-items:center;width:36px;height:36px;font-weight:700;display:grid}.decal-head input{padding:.3rem .5rem}.seg button:disabled{opacity:.4;cursor:not-allowed}.version .kit-flat{width:64px;height:64px}.viewer{overflow:hidden}.viewer.tall{height:70vh;min-height:640px}.complete-grid{grid-template-columns:1.2fr 1fr;align-items:start;gap:1.2rem;margin-top:1rem;display:grid}.complete-stage{gap:.6rem;display:grid;position:sticky;top:80px}.complete-side{gap:1rem;display:grid}.complete-side .card{gap:.6rem;display:grid}.complete-side h2,.complete-side h3{margin:0}.spec{grid-template-columns:auto 1fr;gap:.35rem 1rem;margin:0;font-size:.92rem;display:grid}.spec dt{color:var(--muted)}.spec dd{margin:0}.approved{color:var(--ok);margin:0;font-weight:600}.download-row{border-top:1px solid var(--line);justify-content:space-between;align-items:center;gap:1rem;padding-top:.6rem;display:flex}.download-row p{margin:.2rem 0 0}.estimate{background:var(--surface-2);border-radius:8px;gap:.2rem;padding:.7rem;font-size:.92rem;display:grid}.estimate strong{color:var(--volt);font-size:1.1rem}.order-row{border-top:1px solid var(--line);justify-content:space-between;align-items:center;gap:.8rem;padding-top:.6rem;display:flex}.order-row>div{display:grid}.price-input{width:110px;padding:.3rem .5rem}.status-quoted{color:var(--volt)}.status-order_placed,.status-in_production{color:#7cc6ff}.status-shipped{color:var(--ok)}.status-cancelled{color:var(--danger)}@media (width<=1100px){.flow{grid-template-columns:1fr 1fr}.flow-card:after{display:none}.complete-grid,.prompt-grid{grid-template-columns:1fr}.complete-stage{position:static}.viewer.tall{height:60vh;min-height:420px}}@media (width<=760px){.flow{grid-template-columns:1fr}.stepper{grid-template-columns:repeat(3,1fr)}.carousel{height:72vh;margin:0 1rem}.carousel-copy{bottom:5.5rem;left:1.2rem;right:1.2rem}.carousel-arrow{width:44px;height:44px;top:40%}.studio-head{padding:.8rem 1rem 0}.brand-tag{display:none}}.product-switch{grid-template-columns:1fr 1fr;display:grid}.product-switch button{font-weight:600}.quality-pick{align-items:center;gap:.4rem;margin-left:auto;display:flex}.quality-pick select{width:auto;padding:.3rem .5rem}.my-jerseys-grid{grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:1.25rem;margin-top:1rem;display:grid}.my-jersey-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);flex-direction:column;transition:transform .15s,border-color .2s;display:flex;overflow:hidden}.my-jersey-card:hover{border-color:#19e6d466}.my-jersey-thumb{aspect-ratio:1.1;border-bottom:1px solid var(--line);background:radial-gradient(circle,#17202b 0%,#0c1017 80%);justify-content:center;align-items:center;width:100%;display:flex;position:relative;overflow:hidden}.my-jersey-thumb img{object-fit:contain;width:100%;height:100%}.my-jersey-body{flex-direction:column;flex:1;gap:.65rem;padding:1.1rem;display:flex}.status-pill{text-transform:uppercase;font-size:.75rem;font-weight:700;font-family:var(--display);letter-spacing:.03em;border:1px solid var(--line);background:var(--surface-2);border-radius:999px;align-items:center;gap:.35rem;padding:.2rem .65rem;display:inline-flex}.status-pill.draft{color:var(--muted);border-color:var(--line)}.status-pill.submitted{color:#f59e0b;background:#f59e0b14;border-color:#f59e0b66}.status-pill.approved{color:var(--volt);background:#19e6d41a;border-color:#19e6d466}.status-pill.in_production{color:#38bdf8;background:#38bdf81a;border-color:#38bdf866}.status-pill.completed{color:#10b981;background:#10b9811a;border-color:#10b98166}.status-pill.cancelled{color:var(--danger);background:#ff5a5f1a;border-color:#ff5a5f66}.app-modal-overlay{z-index:50;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#000c;justify-content:center;align-items:center;padding:1rem;display:flex;position:fixed;inset:0}.app-modal-box{background:var(--surface);border:1px solid var(--line);border-radius:16px;flex-direction:column;gap:1rem;width:100%;max-width:500px;padding:1.5rem;display:flex;box-shadow:0 25px 50px -12px #000000b3}.kit-studio-modal-overlay{z-index:9999;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#000000d9;justify-content:center;align-items:center;padding:1rem;display:flex;position:fixed;inset:0}.kit-studio-modal-box{max-height:90vh!important;overflow-y:auto!important;text-align:left!important;background:#10151b!important;border:1px solid #232c37!important;border-radius:16px!important;width:100%!important;max-width:480px!important;padding:1.75rem!important;position:relative!important;box-shadow:0 25px 50px -12px #000c!important}@media (width<=768px){.jersey-modal-container{grid-template-columns:1fr!important}}.kit-studio-shell{height:100vh!important;max-height:100vh!important;overflow:hidden!important}.kit-studio-main{flex-direction:column!important;width:100%!important;max-width:100vw!important;height:calc(100vh - 61px)!important;margin:0!important;padding:0!important;display:flex!important;overflow:hidden!important}

/* ==========================================================================
   3DEEZI REFERENCE STUDIO DESIGN SYSTEM (3D High-End Software Aesthetic)
   ========================================================================== */

/* 0. GRID & ASPECT UTILITIES (Ensures custom matrix grids render perfectly) */
.grid-cols-8, .kit-studio-sidebar div[class*="grid-cols-8"] {
  display: grid !important;
  grid-template-columns: repeat(8, minmax(0, 1fr)) !important;
  gap: 5px !important;
}

.grid-cols-6, .kit-studio-sidebar div[class*="grid-cols-6"] {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 5px !important;
}

.grid-cols-5, .kit-studio-sidebar div[class*="grid-cols-5"] {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 5px !important;
}

.grid-cols-4, .kit-studio-sidebar div[class*="grid-cols-4"] {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 6px !important;
}

.grid-cols-3, .kit-studio-sidebar div[class*="grid-cols-3"] {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 6px !important;
}

.grid-cols-2, .kit-studio-sidebar div[class*="grid-cols-2"] {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

.aspect-square {
  aspect-ratio: 1 / 1 !important;
}

/* 1. TOP TOOLBAR & HEADER POLISH */
.kit-studio-header {
  height: 56px !important;
  min-height: 56px !important;
  max-height: 56px !important;
  background: #090e15 !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 0 14px !important;
  flex-shrink: 0 !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  white-space: nowrap !important;
  -webkit-overflow-scrolling: touch !important;
  gap: 10px !important;
}

.kit-studio-header > div {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 8px !important;
}

.kit-studio-header h1 {
  font-size: 13px !important;
  font-style: normal !important;
  line-height: 1.1 !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 6px !important;
  white-space: nowrap !important;
  letter-spacing: 0.05em !important;
}

.kit-studio-header h1 span {
  font-size: 12px !important;
  font-weight: 900 !important;
}

.kit-studio-header h1 span[class*="text-[9px]"],
.kit-studio-header h1 span:last-child {
  font-size: 9px !important;
  font-weight: 700 !important;
  padding: 2px 6px !important;
  background: rgba(25, 230, 212, 0.15) !important;
  border: 1px solid rgba(25, 230, 212, 0.3) !important;
  border-radius: 9999px !important;
}

.kit-studio-header p {
  font-size: 9px !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1 !important;
}

/* 2. SIDEBAR ROOT & LUXURY CONTAINERS */
.kit-studio-sidebar {
  background: #111720 !important;
  border-right: 1px solid rgba(255, 255, 255, 0.08) !important;
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  overflow: hidden !important;
}

/* Customizer Section Cards */
.kit-studio-sidebar div[class*="bg-gray-900"],
.kit-studio-sidebar div[class*="p-3.bg-gray-900"],
.kit-studio-sidebar div[class*="p-3.bg-gray-800"],
.kit-studio-sidebar div[class*="space-y-3"],
.kit-studio-sidebar div[class*="space-y-4"] > div {
  background: #17202b !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 14px !important;
  padding: 14px !important;
  margin-bottom: 12px !important;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.35) !important;
}

/* Section Header Titles */
.kit-studio-sidebar h3,
.kit-studio-sidebar label.text-xs,
.kit-studio-sidebar span.text-xs.font-bold {
  font-size: 11px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  color: #94a3b8 !important;
  margin-bottom: 8px !important;
  display: block !important;
}

/* 3. TABS NAVIGATION (Product Selection) */
.kit-studio-tabs {
  height: 54px !important;
  min-height: 54px !important;
  background: #0d131a !important;
  border-bottom: 1.5px solid rgba(255, 255, 255, 0.08) !important;
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  width: 100% !important;
  flex-shrink: 0 !important;
  padding: 4px 6px !important;
  gap: 4px !important;
  -webkit-overflow-scrolling: touch !important;
}

.kit-studio-tabs button {
  flex: 1 0 auto !important;
  min-width: 60px !important;
  padding: 6px 4px !important;
  border-radius: 10px !important;
  background: rgba(255, 255, 255, 0.03) !important;
  color: #7b8798 !important;
  border: 1px solid rgba(255, 255, 255, 0.06) !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 3px !important;
  letter-spacing: 0.04em !important;
  transition: all 0.2s ease !important;
  cursor: pointer !important;
}

.kit-studio-tabs button:hover {
  background: rgba(25, 230, 212, 0.08) !important;
  border-color: rgba(25, 230, 212, 0.3) !important;
  color: #ffffff !important;
}

.kit-studio-tabs button[class*="border-[#19e6d4]"],
.kit-studio-tabs button[class*="text-[#19e6d4]"] {
  color: #19e6d4 !important;
  border: 1.5px solid #19e6d4 !important;
  background: linear-gradient(135deg, rgba(25, 230, 212, 0.2) 0%, rgba(0, 180, 216, 0.1) 100%) !important;
  box-shadow: 0 0 12px rgba(25, 230, 212, 0.3) !important;
  text-shadow: 0 0 10px rgba(25, 230, 212, 0.5) !important;
}

/* 4. BUTTONS & SEGMENTED CONTROLS */
.kit-studio-sidebar button {
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
  cursor: pointer !important;
}

/* Active Segmented / Option Buttons */
.kit-studio-sidebar button.bg-cyan-500,
.kit-studio-sidebar button[class*="bg-cyan-500"],
.kit-studio-sidebar button[class*="bg-cyan-600/30"],
.kit-studio-sidebar button[class*="bg-\[\#19e6d4\]"] {
  background: linear-gradient(135deg, #19e6d4 0%, #00b4d8 100%) !important;
  color: #031518 !important;
  font-weight: 800 !important;
  border: none !important;
  box-shadow: 0 3px 12px rgba(25, 230, 212, 0.4) !important;
  border-radius: 8px !important;
  min-height: 36px !important;
  padding: 6px 12px !important;
  font-size: 11px !important;
}

/* Inactive Option Buttons (Excluding Color Swatches) */
.kit-studio-sidebar .grid button:not([class*="bg-cyan"]):not([class*="bg-\[\#19e6d4\]"]):not([style*="background"]):not([style*="background-color"]),
.kit-studio-sidebar div[class*="grid"] button:not([class*="bg-cyan"]):not([class*="bg-\[\#19e6d4\]"]):not([style*="background"]):not([style*="background-color"]),
.kit-studio-sidebar .flex.bg-gray-800 button:not([class*="bg-cyan"]):not([class*="bg-\[\#19e6d4\]"]):not([style*="background"]):not([style*="background-color"]) {
  background: rgba(14, 20, 28, 0.85) !important;
  border: 1px solid rgba(255, 255, 255, 0.09) !important;
  color: #94a3b8 !important;
  border-radius: 8px !important;
  min-height: 36px !important;
  padding: 6px 12px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
}

.kit-studio-sidebar .grid button:not([class*="bg-cyan"]):not([class*="bg-\[\#19e6d4\]"]):not([style*="background"]):hover,
.kit-studio-sidebar div[class*="grid"] button:not([class*="bg-cyan"]):not([class*="bg-\[\#19e6d4\]"]):not([style*="background"]):hover,
.kit-studio-sidebar .flex.bg-gray-800 button:not([class*="bg-cyan"]):not([class*="bg-\[\#19e6d4\]"]):not([style*="background"]):hover {
  background: rgba(25, 34, 46, 0.95) !important;
  border-color: rgba(25, 230, 212, 0.45) !important;
  color: #ffffff !important;
  transform: translateY(-1px) !important;
}

/* 5. COLOR SWATCHES & COLOR MATRIX PRESERVATION */
.kit-studio-sidebar div[class*="grid-cols-8"] button,
.kit-studio-sidebar button[style*="background-color"],
.kit-studio-sidebar button[style*="background:"] {
  display: block !important;
  width: 100% !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
  padding: 0 !important;
  border-radius: 6px !important;
  border: 1.5px solid rgba(255, 255, 255, 0.18) !important;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4) !important;
  cursor: pointer !important;
  box-sizing: border-box !important;
  flex: none !important;
}

.kit-studio-sidebar div[class*="grid-cols-8"] button:hover,
.kit-studio-sidebar button[style*="background-color"]:hover {
  transform: scale(1.15) !important;
  border-color: #ffffff !important;
  box-shadow: 0 0 10px rgba(255, 255, 255, 0.6) !important;
  z-index: 10 !important;
}

.kit-studio-sidebar div[class*="grid-cols-8"] button[class*="border-[#19e6d4]"],
.kit-studio-sidebar div[class*="grid-cols-8"] button[class*="border-cyan"] {
  border: 2px solid #19e6d4 !important;
  box-shadow: 0 0 12px rgba(25, 230, 212, 0.8) !important;
  transform: scale(1.12) !important;
  z-index: 10 !important;
}

.kit-studio-sidebar input[type="text"].font-mono,
.kit-studio-sidebar input[type="text"][class*="font-mono"] {
  width: 80px !important;
  min-width: 80px !important;
  max-width: 80px !important;
  height: 30px !important;
  padding: 2px 4px !important;
  background: #080d13 !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
  color: #ffffff !important;
  font-family: ui-monospace, monospace !important;
  font-weight: 700 !important;
  border-radius: 8px !important;
  font-size: 11px !important;
  text-align: center !important;
  text-transform: uppercase !important;
  flex-shrink: 0 !important;
}

/* 6. FILE UPLOADS & DROPDOWNS */
.kit-studio-sidebar input[type="file"] {
  display: block !important;
  width: 100% !important;
  padding: 8px 12px !important;
  background: #0d131a !important;
  border: 1.5px dashed rgba(25, 230, 212, 0.4) !important;
  border-radius: 10px !important;
  color: #19e6d4 !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  margin: 6px 0 !important;
  transition: all 0.2s ease !important;
}

.kit-studio-sidebar input[type="file"]::file-selector-button {
  background: linear-gradient(135deg, #19e6d4 0%, #0db8a6 100%) !important;
  color: #031518 !important;
  font-weight: 800 !important;
  border: none !important;
  border-radius: 6px !important;
  padding: 4px 10px !important;
  margin-right: 10px !important;
  cursor: pointer !important;
  font-size: 11px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
}

.kit-studio-sidebar select {
  width: 100% !important;
  background: #0d131a !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: 10px !important;
  color: #ffffff !important;
  padding: 8px 12px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  outline: none !important;
  cursor: pointer !important;
  margin: 6px 0 !important;
  transition: all 0.2s ease !important;
}

.kit-studio-sidebar select:focus {
  border-color: #19e6d4 !important;
  box-shadow: 0 0 0 2px rgba(25, 230, 212, 0.25) !important;
}

/* 7. RANGE SLIDERS & VALUE BADGES */
.kit-studio-root input[type="range"],
.kit-studio-sidebar input[type="range"],
input[type="range"].accent-cyan-400 {
  -webkit-appearance: none !important;
  appearance: none !important;
  width: 100% !important;
  height: 5px !important;
  background: #10161f !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: 9999px !important;
  outline: none !important;
  margin: 8px 0 !important;
  cursor: pointer !important;
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.7) !important;
  transition: all 0.2s ease !important;
}

.kit-studio-root input[type="range"]:hover,
.kit-studio-sidebar input[type="range"]:hover {
  border-color: rgba(25, 230, 212, 0.6) !important;
  background: #16202c !important;
}

.kit-studio-root input[type="range"]::-webkit-slider-thumb,
.kit-studio-sidebar input[type="range"]::-webkit-slider-thumb,
input[type="range"].accent-cyan-400::-webkit-slider-thumb {
  -webkit-appearance: none !important;
  appearance: none !important;
  width: 16px !important;
  height: 16px !important;
  border-radius: 50% !important;
  background: radial-gradient(circle at 35% 35%, #ffffff 0%, #19e6d4 50%, #009cb9 100%) !important;
  border: 2px solid #ffffff !important;
  box-shadow: 0 0 10px rgba(25, 230, 212, 0.9), 0 2px 5px rgba(0, 0, 0, 0.8) !important;
  cursor: grab !important;
  transition: transform 0.15s ease, box-shadow 0.15s ease !important;
}

.kit-studio-sidebar .font-mono.text-cyan-400,
.kit-studio-sidebar .font-mono.text-\[\#19e6d4\] {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
  color: #19e6d4 !important;
  background: rgba(25, 230, 212, 0.12) !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
  padding: 2px 7px !important;
  border-radius: 6px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.03em !important;
}

/* 8. ROOT & WORKSPACE RESPONSIVE STRUCTURE */
.kit-studio-root {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  width: 100% !important;
  flex: 1 1 0% !important;
  overflow: hidden !important;
  position: relative !important;
  background-color: #0d1218 !important;
}

.kit-studio-workspace {
  display: flex !important;
  flex-direction: row !important;
  flex: 1 1 0% !important;
  height: calc(100% - 56px) !important;
  min-height: 0 !important;
  overflow: hidden !important;
  position: relative !important;
}

.kit-studio-canvas-container {
  flex: 1 1 0% !important;
  height: 100% !important;
  position: relative !important;
  overflow: hidden !important;
}

.kit-studio-help-pill {
  position: absolute !important;
  bottom: 24px !important;
  left: 24px !important;
  z-index: 20 !important;
}

.kit-studio-reset-btn {
  position: absolute !important;
  bottom: 24px !important;
  right: 24px !important;
  z-index: 20 !important;
}

.kit-studio-mobile-handle {
  display: none !important;
}

.kit-studio-mobile-dock {
  display: none !important;
}

.kit-studio-backdrop-overlay {
  display: none !important;
}

/* DESKTOP (>= 1025px) */
@media (min-width: 1025px) {
  .kit-studio-sidebar {
    width: 384px !important;
    min-width: 384px !important;
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    position: relative !important;
    transform: none !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    border-radius: 0 !important;
    flex-shrink: 0 !important;
  }

  .kit-studio-sidebar-content,
  .kit-studio-sidebar > div:last-child {
    flex: 1 1 0% !important;
    min-height: 0 !important;
    height: 100% !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    padding: 16px !important;
  }
}

/* TABLET (700px - 1024px: iPad, Tablet Devices) */
@media (min-width: 700px) and (max-width: 1024px) {
  .kit-studio-sidebar {
    width: 310px !important;
    min-width: 310px !important;
    flex-shrink: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    position: relative !important;
    height: 100% !important;
    transform: none !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    border-radius: 0 !important;
  }

  .kit-studio-sidebar-content,
  .kit-studio-sidebar > div:last-child {
    flex: 1 1 0% !important;
    min-height: 0 !important;
    height: 100% !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    padding: 14px !important;
  }
  
  .kit-studio-header {
    padding-left: 0.75rem !important;
    padding-right: 0.75rem !important;
  }

  .kit-studio-help-desktop {
    display: none !important;
  }
  .kit-studio-help-mobile {
    display: inline !important;
  }

  .kit-studio-help-pill {
    bottom: 16px !important;
    left: 16px !important;
  }

  .kit-studio-reset-btn {
    bottom: 16px !important;
    right: 16px !important;
  }
}

/* MOBILE (< 700px: iPhone, Samsung Galaxy, Pixel, etc.) */
@media (max-width: 699px) {
  .kit-studio-header {
    height: 50px !important;
    min-height: 50px !important;
    max-height: 50px !important;
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
  }

  .kit-studio-workspace {
    position: relative !important;
    width: 100% !important;
    height: calc(100% - 50px) !important;
    overflow: hidden !important;
  }

  .kit-studio-canvas-container {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 1 !important;
  }

  /* Backdrop Overlay when Drawer is Open */
  .kit-studio-backdrop-overlay {
    display: block !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 65vh !important;
    background: rgba(0, 0, 0, 0.45) !important;
    backdrop-filter: blur(3px) !important;
    -webkit-backdrop-filter: blur(3px) !important;
    z-index: 34 !important;
    cursor: pointer !important;
    animation: fadeInOverlay 0.25s ease forwards !important;
  }

  /* Customizer Bottom Sheet Drawer on Mobile */
  .kit-studio-root aside,
  .kit-studio-sidebar {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100vw !important;
    max-width: 100vw !important;
    height: 65vh !important;
    max-height: 70vh !important;
    z-index: 35 !important;
    display: flex !important;
    flex-direction: column !important;
    border-radius: 22px 22px 0 0 !important;
    border-top: 1.5px solid rgba(25, 230, 212, 0.5) !important;
    border-right: none !important;
    border-left: none !important;
    background: rgba(13, 18, 25, 0.98) !important;
    backdrop-filter: blur(28px) !important;
    -webkit-backdrop-filter: blur(28px) !important;
    box-shadow: 0 -12px 40px rgba(0, 0, 0, 0.95), 0 -1px 15px rgba(25, 230, 212, 0.25) !important;
    transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.25s ease !important;
    overflow: hidden !important;
  }

  .kit-studio-sidebar.mobile-panel-closed {
    transform: translateY(100%) !important;
    pointer-events: none !important;
    opacity: 0 !important;
  }

  .kit-studio-sidebar.mobile-panel-open {
    transform: translateY(0) !important;
    pointer-events: auto !important;
    opacity: 1 !important;
  }

  .kit-studio-mobile-handle {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 8px 14px !important;
    background: #090d14 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
    cursor: pointer !important;
    width: 100% !important;
    flex-shrink: 0 !important;
    height: 48px !important;
  }

  .kit-studio-mobile-handle-pill {
    width: 40px !important;
    height: 4px !important;
    background: rgba(25, 230, 212, 0.5) !important;
    border-radius: 9999px !important;
    margin-bottom: 6px !important;
  }

  .kit-studio-tabs {
    flex-shrink: 0 !important;
    height: 48px !important;
    min-height: 48px !important;
  }

  /* BULLETPROOF MOBILE TOUCH & SCROLL CONTAINER */
  .kit-studio-sidebar-content,
  .kit-studio-sidebar > div:last-child {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    height: calc(65vh - 96px) !important;
    max-height: calc(65vh - 96px) !important;
    overflow-y: scroll !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    touch-action: pan-y !important;
    overscroll-behavior-y: contain !important;
    pointer-events: auto !important;
    padding: 12px 14px 40px 14px !important;
  }

  /* Floating Thumb Dock with Glowing Customize Button */
  .kit-studio-mobile-dock {
    display: flex !important;
    position: fixed !important;
    bottom: 18px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    z-index: 30 !important;
    gap: 8px !important;
    padding: 6px 8px !important;
    background: rgba(13, 19, 26, 0.92) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    border-radius: 9999px !important;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.8), 0 0 15px rgba(25, 230, 212, 0.25) !important;
  }

  .kit-studio-mobile-dock button:first-child {
    background: linear-gradient(135deg, #19e6d4 0%, #0db8a6 100%) !important;
    color: #031518 !important;
    font-weight: 900 !important;
    border: none !important;
    border-radius: 9999px !important;
    padding: 8px 16px !important;
    font-size: 11px !important;
    letter-spacing: 0.05em !important;
    text-transform: uppercase !important;
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    box-shadow: 0 4px 14px rgba(25, 230, 212, 0.4) !important;
    cursor: pointer !important;
  }

  .kit-studio-mobile-dock button:not(:first-child) {
    background: rgba(22, 30, 41, 0.85) !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    color: #e2e8f0 !important;
    border-radius: 9999px !important;
    padding: 8px 14px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    display: flex !important;
    align-items: center !important;
    gap: 5px !important;
    cursor: pointer !important;
  }

  .kit-studio-help-pill {
    bottom: 76px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    white-space: nowrap !important;
    font-size: 10px !important;
    padding: 4px 10px !important;
  }

  .kit-studio-reset-btn {
    display: none !important;
  }

  .kit-studio-help-desktop {
    display: none !important;
  }
  .kit-studio-help-mobile {
    display: inline !important;
  }
}

@keyframes fadeInOverlay {
  from { opacity: 0; }
  to { opacity: 1; }
}