:root{--bg:#101211;--panel:#1a1d1b;--line:#30352f;--text:#f0f2eb;--muted:#9aa295;--accent:#dfff00}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:14px 'DM Sans',sans-serif}button,input,select,textarea{font:inherit}button,.button{cursor:pointer;transition:background .15s}a{color:inherit}button,.button,select,input,textarea{border:1px solid var(--line);border-radius:8px;background:#222620;color:var(--text);padding:10px 12px}button:hover,.button:hover{background:#32392c}button:disabled{opacity:.4;cursor:wait}button:focus-visible,a:focus-visible{outline:3px solid var(--accent);outline-offset:3px}input,select,textarea{width:100%;outline:none}input:focus,textarea:focus{border-color:#a3b74c}textarea{resize:vertical}input[type=color]{height:38px;padding:4px}input[type=checkbox]{width:auto;accent-color:var(--accent)}input[type=range]{padding:0;accent-color:var(--accent)}[hidden]{display:none!important}header{display:flex;align-items:center;justify-content:space-between;height:86px;padding:0 38px;border-bottom:1px solid var(--line);gap:25px;background:#141713;position:sticky;top:0;z-index:20}.brand{display:flex;align-items:center;text-decoration:none;font:700 44px 'Manrope',sans-serif;letter-spacing:-5px}.brand>span{color:var(--accent);margin-right:20px}.brand b{font:700 21px 'DM Sans',sans-serif;letter-spacing:-.5px}.brand small{display:block;font:8px 'DM Sans';letter-spacing:2px;color:var(--muted);margin-top:4px}nav{display:flex;gap:6px}nav button{border:0;background:none;color:var(--muted);font-size:12px;padding:12px 18px}nav button.active{background:#2c3425;color:var(--accent)}.header-end{display:flex;gap:20px;align-items:center}.header-end span{font-size:10px;color:var(--muted)}.primary{background:var(--accent);color:#172000;border:0;font-weight:700}.primary:hover{background:#eaff6c}.secondary{background:#272d24}.wide{display:block;width:100%}.button{display:inline-block;text-align:center;font-size:12px}main{max-width:1800px;margin:auto;padding:0 38px}.hero{padding:54px 0 40px;display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}.eyebrow{font-size:9px;letter-spacing:2px;font-weight:700;color:#a9b198}h1{font:600 52px/1.07 'Manrope';letter-spacing:-2px;margin:20px 0}h1 em{font-style:normal;color:var(--accent)}.hero p:not(.eyebrow),.ab-heading>p:last-child{color:var(--muted);font-size:13px}.hero-tags{display:flex;gap:10px;flex-wrap:wrap;margin-top:23px}.hero-tags span{font-size:10px;border:1px solid var(--line);border-radius:20px;padding:7px 10px}.hero-preview{transform:rotate(-2deg);background:#252d22;padding:9px;border:1px solid #45503b;border-radius:14px;box-shadow:0 25px 80px #0006}.hero-preview canvas{width:100%;border-radius:8px}.hero-preview>span{display:block;padding:12px 6px 5px;font-size:9px;letter-spacing:2px;color:var(--muted)}.gallery-toolbar{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:12px;padding:20px 0;border-top:1px solid var(--line)}.gallery-toolbar input,.gallery-toolbar select{font-size:12px;background:#191d18}.gallery-meta{display:flex;justify-content:space-between;color:var(--muted);font-size:10px;align-items:center;margin-bottom:15px}#templateGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px 18px}.template-card{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--panel)}.template-card:hover{border-color:#657d3d}.template-cover{position:relative;background:#292e26;cursor:pointer;display:block;width:100%;padding:0;border:0;border-radius:0;overflow:hidden}.template-cover canvas{width:100%;display:block}.template-cover .use-overlay{position:absolute;inset:auto 15px 15px;background:var(--accent);color:#1a230a;padding:10px;border-radius:6px;font-size:11px;font-weight:bold;opacity:0;transition:opacity .15s}.template-cover:hover .use-overlay,.template-cover:focus .use-overlay{opacity:1}.template-info{padding:14px}.template-info h3{font-size:13px;margin:0 0 5px}.template-info p{color:var(--muted);font-size:10px;margin:0 0 12px}.template-bottom{display:flex;align-items:center;justify-content:space-between;font-size:9px;color:var(--muted)}.template-bottom button{padding:5px 8px;font-size:9px;background:none}.subscriber{color:#afc98e}#loadMore{margin:28px auto;max-width:340px}.library-note{font-size:10px;color:var(--muted);line-height:1.7;max-width:1000px}.editor-top{display:flex;justify-content:space-between;gap:15px;align-items:center;padding:24px 0}.editor-top h2{font-size:20px;margin:7px 0}.actions{display:flex;gap:7px;flex-wrap:wrap}.actions button{font-size:11px}.editor-layout{display:grid;grid-template-columns:220px minmax(0,1fr) 255px;gap:18px;align-items:start}.panel{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:17px}.panel-heading{font-size:10px;font-weight:700;letter-spacing:1px;margin-bottom:18px;display:flex;justify-content:space-between}.panel-heading span{font-size:8px;color:var(--muted);font-weight:400;letter-spacing:0}.add-buttons{display:flex;gap:5px;margin-bottom:14px}.add-buttons button,.add-buttons .button{padding:8px;font-size:10px;white-space:nowrap}#layers{display:flex;flex-direction:column;gap:5px;max-height:350px;overflow:auto}.layer{display:flex;text-align:left;gap:9px;align-items:center;width:100%;padding:10px;font-size:10px;background:#20261d}.layer.selected{border-color:#9aaa4d;background:#303a24}.layer>span:first-child{font-size:15px;color:var(--accent)}.layer>span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.layer-actions{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin-top:12px}.layer-actions button{font-size:9px;padding:8px 5px}details{border-top:1px solid var(--line);margin-top:18px;padding-top:14px}summary{font-size:11px;cursor:pointer;margin-bottom:15px}label{display:block;font-size:10px;color:#bfc6b8;margin:12px 0 0}label>input,label>select,label>textarea{display:block;margin-top:7px;font-size:11px}.check{display:flex;align-items:center;gap:8px;font-size:10px}.check input{margin:0}.small{font-size:9px;color:var(--muted);line-height:1.65}.two{display:grid;grid-template-columns:1fr 1fr;gap:8px}.format-buttons{display:flex;gap:5px;margin-top:12px}.format-buttons button{font-size:10px;padding:8px}.format-buttons [aria-pressed=true]{background:#495e25;border-color:#a2c153}.canvas-tools{display:flex;justify-content:space-between;align-items:center;font-size:10px;color:var(--muted);margin:0 0 12px}.canvas-tools button{padding:7px;font-size:10px}.artboard{padding:15px;background-color:#252a23;background-image:linear-gradient(45deg,#2b3128 25%,transparent 25%),linear-gradient(-45deg,#2b3128 25%,transparent 25%);background-size:24px 24px;border:1px solid #3b4434;border-radius:12px;min-height:300px;display:flex;align-items:center;justify-content:center}#canvas{display:block;width:100%;height:auto;max-height:720px;object-fit:contain;touch-action:none;box-shadow:0 15px 40px #0005}#canvas.vertical{width:auto;max-width:100%;height:650px}#canvas.phone{width:300px!important;height:auto!important;max-height:535px}.canvas-hint{font-size:9px;text-align:center;color:var(--muted);margin:12px 0 20px}.export-actions{display:flex;flex-wrap:wrap;gap:8px}.export-actions select{width:140px;font-size:11px}.export-actions button{font-size:11px}.sample-disclosure{color:var(--muted);font-size:9px;margin-top:18px;border-top:1px solid var(--line);padding-top:14px}.reference-info{margin-top:20px;font-size:10px;line-height:1.6;color:var(--muted)}.reference-info button{font-size:10px;width:100%;margin-top:9px}.ab-heading{padding:40px 0 20px}.ab-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}.ab-grid h2{font-size:18px}.ab-grid canvas{width:100%;max-height:550px;object-fit:contain;background:#101410}.ab-grid p{font-size:12px;color:var(--muted)}.ab-footer{padding:25px 0}.ab-footer>button{margin-right:10px}#results{background:#20271c;border:1px solid #435033;border-radius:10px;padding:23px;margin-top:20px;line-height:1.9;font-size:13px;white-space:pre-line}.ab-explainer{font-size:12px;color:var(--muted);line-height:1.7;max-width:950px}footer{border-top:1px solid var(--line);margin-top:50px;padding:25px 0;display:flex;justify-content:space-between;font-size:9px;color:var(--muted)}#toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:#e0eecc;color:#1b2812;border-radius:10px;padding:14px 23px;opacity:0;pointer-events:none;z-index:50;font-size:12px;box-shadow:0 10px 40px #0004}#toast.show{opacity:1}dialog{background:#1b2017;color:var(--text);border:1px solid #52633f;border-radius:14px;max-width:800px;width:90vw;padding:24px}dialog::backdrop{background:#000b}dialog img{width:100%;max-height:450px;object-fit:contain}dialog p{font-size:12px;line-height:1.6;color:var(--muted)}dialog>button{float:right}.empty-state{padding:50px;grid-column:1/-1;text-align:center;color:var(--muted)}@media(min-width:1600px){#templateGrid{grid-template-columns:repeat(5,1fr)}.editor-layout{grid-template-columns:240px minmax(0,1fr) 290px}}@media(max-width:1150px){main{padding:0 22px}header{padding:0 22px}.header-end span{display:none}#templateGrid{grid-template-columns:repeat(3,1fr)}.editor-layout{grid-template-columns:180px minmax(0,1fr) 230px;gap:10px}.panel{padding:12px}.add-buttons{flex-wrap:wrap}.hero{gap:25px}h1{font-size:43px}}@media(max-width:850px){header{height:72px;padding:0 15px;gap:8px}.brand b{font-size:16px}.brand{font-size:35px}.brand>span{margin-right:10px}.brand small{font-size:6px}nav{gap:0}nav button{padding:10px;font-size:10px}.header-end button{padding:10px;font-size:10px}.hero{grid-template-columns:1fr;padding:30px 0;gap:25px}.hero-preview{max-width:550px;transform:none}.hero h1{font-size:43px}.gallery-toolbar{grid-template-columns:1fr 1fr}.gallery-toolbar input{grid-column:1/-1}#templateGrid{grid-template-columns:repeat(2,1fr);gap:12px}.gallery-meta{align-items:flex-start;gap:12px}.gallery-meta>span{max-width:150px;text-align:right}.editor-layout{grid-template-columns:1fr 1fr}.canvas-area{grid-column:1/-1;grid-row:1}.layers-panel{grid-column:1}.inspector{grid-column:2}.editor-top{align-items:flex-start;flex-direction:column}.ab-grid{grid-template-columns:1fr}#canvas.vertical{height:600px}.artboard{min-height:200px}footer{gap:20px;line-height:1.7}.hero-tags{gap:5px}}@media(max-width:450px){main{padding:0 13px}.brand b{display:none}.brand>span{margin-right:3px}h1{font-size:35px!important}.template-info{padding:10px}.template-info h3{font-size:11px}.template-bottom{gap:5px;flex-wrap:wrap}.template-cover .use-overlay{display:none}.gallery-toolbar{gap:7px}.gallery-toolbar select{font-size:10px;padding:9px 5px}.hero-tags span{font-size:8px}.editor-layout{gap:8px}.panel{padding:10px}.two{gap:4px}.format-buttons{flex-wrap:wrap}.export-actions{justify-content:center}.actions button{font-size:9px;padding:9px}.canvas-hint{line-height:1.6}.header-end{margin-left:auto}.gallery-meta{font-size:9px}}

.collection-tabs,.creator-chips,.quick-edit{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 15px}.collection-tabs button{font-weight:700}.collection-tabs .active,.creator-chips .active{background:#dfff00;color:#162000;border-color:#dfff00}.creator-chips button{font-size:12px;border-radius:20px}.creator-chips span{align-self:center;color:var(--muted);font-size:10px;margin-left:auto}.quick-edit{padding:10px;background:#1b2117;border:1px solid var(--line);border-radius:10px}.quick-edit button{font-size:11px}.quick-edit select{width:auto;max-width:200px}.template-info p{min-height:24px;line-height:1.4}@media(max-width:600px){.creator-chips span{width:100%;margin:5px 0}.collection-tabs button{font-size:11px}.quick-edit button{flex:1}.quick-edit .primary{flex-basis:100%}}

.background-actions{display:grid;grid-template-columns:1fr;gap:6px}.background-panel{border:1px solid #45513a;padding:12px;border-radius:12px;background:#20271c;color:var(--text)}.background-panel summary{font-weight:800}.collection-tabs{flex-wrap:wrap}.quick-edit{flex-wrap:wrap}
