@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--ink:#192d2a;--muted:#76817d;--green:#1d6758;--line:#e5e9e4;--cream:#f7f8f4}*{box-sizing:border-box}body{margin:0;background:#fff;color:var(--ink);font-family:'DM Sans',Arial,sans-serif;font-size:14px}button,input,select,textarea{font:inherit}button,a,label.upload{ -webkit-tap-highlight-color:transparent}button{cursor:pointer;border:0;background:none;color:inherit;border-radius:8px;padding:10px 14px}button:hover{background:#edf2ed}button:focus-visible,a:focus-visible{outline:3px solid #cea555;outline-offset:3px}a{text-decoration:none;color:inherit}.primary{background:var(--green);color:white;font-weight:600}.primary:hover{background:#124e42}aside{width:236px;background:#f6f7f3;position:fixed;inset:0 auto 0 0;padding:30px 20px;border-right:1px solid var(--line);z-index:2}.brand{display:flex;align-items:center;gap:10px;font-size:24px;font-family:'Manrope',Arial,sans-serif;font-weight:800;letter-spacing:-1px}.brand small{display:block;font-size:7px;letter-spacing:1.3px;font-weight:700;margin-top:3px}.brandmark{background:#dfe9c6;border-radius:12px;display:flex;align-items:center;justify-content:center;width:40px;height:44px;font-family:Georgia;font-style:italic;font-size:32px;color:#255a44}.brandmark span{font-size:24px;margin-left:-5px}aside>.primary{margin:36px 0 23px;width:100%;padding:14px}nav{display:grid;gap:7px}nav a{text-align:left;font-size:20px;display:flex;align-items:center;gap:14px;padding:12px 16px}nav span{font-size:14px}nav .active{background:#e5ece0;color:#205a49;font-weight:700}.sidebottom{position:absolute;bottom:23px;left:20px;right:20px}.miniart{padding:20px;background:#e5e9da;border-radius:10px;font-size:22px;line-height:1.3;background-image:radial-gradient(ellipse at 110% 25%,#afbc94 0 30%,transparent 31%);font-family:Georgia}.miniart span{display:block;font-family:Arial;font-size:11px;margin-top:12px;line-height:1.6}.sidebottom p{font-size:9px;letter-spacing:1.5px;margin:24px 0 17px}.avatar{display:inline-grid;place-items:center;width:32px;height:32px;border-radius:50%;background:#ded8ca;margin-right:9px;vertical-align:top}.sidebottom>span{font-size:11px;display:inline-block}.sidebottom small{display:block;color:var(--muted);font-size:10px;margin-top:5px}main{margin-left:236px}header{height:83px;display:flex;align-items:center;justify-content:space-between;padding:0 42px;border-bottom:1px solid var(--line)}.crumb{font-size:12px;color:var(--muted)}.header-right{display:flex;gap:14px;align-items:center}.header-right .primary{font-size:12px}.header-right .primary span{margin-left:20px}#content{padding:32px 42px 20px;max-width:1600px;margin:auto}.hero{position:relative;overflow:hidden;border-radius:16px;background:#eef1e5;min-height:310px;padding:36px 36px 32px}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:700;color:#426b56;margin:0 0 16px}.hero h1{font-family:'Manrope',Arial,sans-serif;font-size:42px;line-height:1.16;font-weight:700;letter-spacing:-1.8px;margin:0 0 16px;max-width:500px}.hero h1 em{font-family:Georgia;font-weight:400;color:#3f7558}.hero p.description{font-size:12px;color:#667369;line-height:1.7;max-width:320px}.hero .primary{margin-top:11px;padding:12px 19px;font-size:12px}.hero .primary span{margin-left:22px}.heroart{position:absolute;right:0;top:0;width:43%;height:100%}.heroart .cardone{position:absolute;transform:rotate(-12deg);width:176px;top:38px;left:20px;box-shadow:0 15px 25px #25332626}.heroart .cardtwo{position:absolute;transform:rotate(10deg);width:174px;right:13px;top:96px;box-shadow:0 15px 25px #25332630}.heroart .sparkle{position:absolute;right:35px;top:25px;font-size:48px;color:#b08d42}.heroart .dot{position:absolute;bottom:18px;left:15px;background:#d5dfbc;width:100px;height:100px;border-radius:50%}.formatrow{display:grid;grid-template-columns:repeat(7,1fr);margin:26px 0 36px;gap:12px}.format{padding:3px;font-size:11px}.format i{display:grid;place-items:center;height:51px;width:51px;border-radius:15px;font-style:normal;font-size:24px;margin:0 auto 10px;background:#edf1f5}.format:nth-child(2) i{background:#f4eadd}.format:nth-child(3) i{background:#efe7f5}.format:nth-child(4) i{background:#e7eee2}.format:nth-child(5) i{background:#f5e7e6}.format:nth-child(6) i{background:#e7eef1}.format:last-child i{background:#f0eee8}.sectionhead{display:flex;align-items:center;justify-content:space-between;margin:0 0 20px}h2{font-family:Manrope,Arial,sans-serif;font-size:23px;letter-spacing:-.6px;margin:0 0 7px}.sectionhead p{font-size:12px;color:var(--muted);margin:0}.sectionhead button{font-size:11px;font-weight:600}.searchbar{display:flex;gap:9px;margin:18px 0 23px;align-items:center;flex-wrap:wrap}.searchbar input{border:1px solid var(--line);padding:10px 13px;border-radius:8px;flex:1;min-width:170px;max-width:340px}.chip{border:1px solid var(--line);border-radius:20px;padding:8px 14px;font-size:11px}.chip.active{background:#243f34;color:white;border-color:#243f34}.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:23px 18px}.template{padding:0;text-align:left;border-radius:10px;overflow:hidden;position:relative}.template:hover{background:none}.preview{height:220px;background:#f0efeb;border-radius:10px;display:flex;align-items:center;justify-content:center;padding:21px;transition:transform .2s;overflow:hidden}.template:hover .preview{transform:translateY(-4px);box-shadow:0 8px 20px #182c2010}.preview svg{max-height:100%;max-width:100%;box-shadow:0 4px 10px #12231919}.template h3{font-size:12px;margin:12px 0 5px;font-weight:600}.template p{font-size:10px;color:var(--muted);margin:0}.use{position:absolute;top:12px;right:10px;border-radius:15px;background:#fff;padding:5px 8px;font-size:9px}.printbanner{margin:37px 0 15px;background:#f4f0e8;border-radius:12px;padding:25px 28px;display:flex;align-items:center;gap:24px}.printicon{font-size:36px;color:#7e6845}.printbanner h3{font-size:17px;margin:0 0 7px}.printbanner p{font-size:12px;color:#847d6e;margin:0}.printbanner button{margin-left:auto;white-space:nowrap;font-size:12px}footer{margin:25px 42px 0;border-top:1px solid var(--line);padding:23px 0;display:flex;align-items:center;gap:12px;color:#78847b;font-size:10px;flex-wrap:wrap}footer .brand{font-size:17px;color:var(--ink)}footer small{margin-left:auto;font-size:9px}.pagetitle{margin:15px 0 30px}.pagetitle h1{font-size:35px;letter-spacing:-1.4px;margin-bottom:10px}.pagetitle p{color:var(--muted)}dialog{border:none;border-radius:16px;padding:36px;width:620px;max-width:94vw;color:var(--ink);box-shadow:0 20px 90px #0003}dialog::backdrop{background:#0f211b77;backdrop-filter:blur(4px)}.close{position:absolute;right:14px;top:10px;font-size:25px}#formats{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin-top:25px}#formats .format{padding:20px;background:var(--cream)}#editor{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;border-radius:0;padding:0;margin:0}.editorhead{height:72px;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:15px;gap:12px}.editorhead input{border:none;background:#f4f5f1;padding:10px;border-radius:6px;min-width:0}.editorhead #savedState{margin-left:auto;font-size:11px;color:var(--muted)}.editorhead select{border:1px solid var(--line);padding:9px;border-radius:6px}.editorbody{display:flex;height:calc(100% - 72px)}.tools{width:245px;flex-shrink:0;overflow:auto;padding:25px 20px;border-right:1px solid var(--line)}.tools h3{margin-top:5px}.tools>button,.upload{display:block;width:100%;text-align:left;border:1px solid var(--line);margin:10px 0;padding:10px;border-radius:6px;font-size:12px;cursor:pointer}.upload input{display:none}.tools label:not(.upload){display:block;margin:12px 0;font-size:11px}.tools textarea,.tools select{display:block;width:100%;border:1px solid var(--line);border-radius:5px;padding:8px;margin-top:5px}.tools input{vertical-align:middle;max-width:130px;margin-left:10px}.fieldtitle{font-size:9px;letter-spacing:1.5px;margin-top:27px;color:var(--muted)}.editorhint{font-size:11px;line-height:1.7;color:var(--muted)}.canvasarea{background:#eaede9;flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:25px;overflow:auto}.canvasbar{display:flex;justify-content:space-between;width:100%;font-size:10px;color:var(--muted);margin-bottom:25px;gap:10px}#canvasWrap{flex:1;min-height:0;width:100%;display:flex;align-items:center;justify-content:center}#canvasWrap svg{max-width:100%;max-height:100%;background:white;box-shadow:0 5px 22px #17251a20;touch-action:none}#canvasWrap svg [data-id]{cursor:move}#canvasWrap svg [data-selected]{filter:drop-shadow(0px 0px 2px #008878)}#canvasWrap svg [data-id]:focus{outline:none;filter:drop-shadow(0px 0px 3px #008878)}.tools textarea:focus-visible,.tools input:focus-visible,.tools select:focus-visible{outline:2px solid #cea555;outline-offset:2px}#canvasWrap svg [data-id]:focus{outline:none;filter:drop-shadow(0px 0px 3px #008878)}.tools textarea:focus-visible,.tools input:focus-visible,.tools select:focus-visible{outline:2px solid #cea555;outline-offset:2px}.canvasfoot{font-size:11px;margin-top:23px;color:#86938a}.canvasfoot span{margin-left:10px}#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:#203d31;color:white;padding:13px 24px;border-radius:8px;z-index:100;display:none}.empty{padding:60px;background:var(--cream);border-radius:15px;text-align:center}.empty p{color:var(--muted)}.formpanel{border:1px solid var(--line);padding:30px;border-radius:15px;max-width:740px;background:#fafbf8}.formgrid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.formpanel label{display:block;font-size:12px;margin-bottom:18px}.formpanel input,.formpanel select,.formpanel textarea{display:block;width:100%;border:1px solid #d9e1d5;border-radius:7px;padding:12px;background:white;margin-top:8px}.formpanel p{font-size:12px;line-height:1.7;color:var(--muted)}.projectactions{display:flex;gap:8px;padding-top:10px}.projectactions button{font-size:10px;border:1px solid var(--line)}#helpDialog li{margin:16px 0;line-height:1.6}#helpDialog p{font-size:12px;color:var(--muted);line-height:1.7}
@media(min-width:1450px){.heroart{right:60px}.hero{min-height:350px;padding:45px}.preview{height:270px}}@media(max-width:1100px){aside{width:200px;padding:25px 15px}main{margin-left:200px}#content{padding:25px}.hero{padding:28px}.hero h1{font-size:35px;max-width:340px}.heroart{width:40%;opacity:.9}.heroart .cardone{width:130px;left:5px}.heroart .cardtwo{width:125px;right:0}.grid{grid-template-columns:repeat(3,minmax(0,1fr))}.preview{height:210px}header{padding:0 25px}.sidebottom{left:15px;right:15px}.hero p.description{max-width:285px}}@media(max-width:760px){aside{position:static;width:auto;padding:16px;border-right:0;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:15px}.brand{font-size:21px}.brandmark{width:34px;height:37px}aside>.primary{display:none}nav{display:flex;margin-left:auto;gap:2px}nav a{padding:8px;font-size:19px}nav span{display:none}.sidebottom{display:none}main{margin-left:0}header{height:62px;padding:0 18px}.crumb{font-size:10px}.header-right{gap:0}.header-right #help span{display:none}.header-right .primary{font-size:10px}.header-right .primary span{margin-left:5px}#content{padding:18px}.hero{min-height:345px;padding:26px}.hero h1{font-size:34px;max-width:340px}.hero p.description{max-width:245px}.heroart{width:37%;top:150px;height:180px;pointer-events:none}.heroart .cardone{width:95px;top:10px;left:-5px}.heroart .cardtwo{width:90px;top:60px;right:0}.heroart .sparkle{font-size:25px;right:12px;top:-20px}.heroart .dot{width:65px;height:65px}.formatrow{grid-template-columns:repeat(4,1fr);gap:18px 8px;margin:24px 0}.format{font-size:10px}.format i{height:42px;width:42px;font-size:21px}.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 12px}.preview{height:190px;padding:17px}.sectionhead h2{font-size:20px}.sectionhead p{font-size:10px}.sectionhead button{font-size:10px;padding:8px}.printbanner{padding:20px;gap:12px;flex-wrap:wrap}.printbanner h3{font-size:15px}.printbanner p{font-size:10px}.printbanner button{margin:5px 0 0}footer{margin:20px 18px 0}footer>span:last-of-type{display:none}.editorhead{height:auto;min-height:70px;flex-wrap:wrap;padding:8px;gap:5px}.editorhead input{width:120px}.editorhead #savedState{display:none}.editorhead button,.editorhead select{font-size:10px;padding:8px}.editorbody{height:calc(100% - 105px);flex-direction:column-reverse}.tools{width:100%;height:230px;border-top:1px solid var(--line);border-right:0;padding:15px;flex-shrink:0;display:flex;flex-wrap:wrap;gap:7px;align-items:start}.tools>.eyebrow,.tools>h3,.tools .fieldtitle,.editorhint{display:none}.tools>button,.tools>.upload{width:auto;margin:0}.tools label:not(.upload){width:135px;margin:0}.tools textarea{height:48px}.canvasarea{padding:12px}.canvasbar{margin-bottom:10px;font-size:9px}.canvasfoot{margin-top:10px}.formgrid{grid-template-columns:1fr}.formpanel{padding:20px}.pagetitle h1{font-size:29px}.empty{padding:35px 20px}}@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

.brand img{width:100%;max-width:190px;height:auto;display:block}footer .brand{max-width:145px}
.brand img{max-width:196px;aspect-ratio:1;object-fit:contain}footer .brand{max-width:100px}
@media(max-width:760px){aside .brand{width:48px;flex-shrink:0}aside .brand img{width:48px;height:48px;max-width:48px}footer .brand{max-width:60px}}

nav a{text-align:left;font-size:20px;display:flex;align-items:center;gap:14px;padding:12px 16px;border-radius:8px;color:inherit;text-decoration:none}nav a:hover{background:#edf2ed}nav a span{font-size:14px}nav a.active{background:#e5ece0;color:#205a49;font-weight:700}
#formatDialog[open],#helpDialog[open]{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);margin:0;max-height:calc(100dvh - 32px);overflow:auto}

/* Interactive editing controls */
.shapeTools,.layerTools,.elementSize{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:10px 0}
.shapeTools button,.layerTools button{border:1px solid var(--line);padding:9px 7px;font-size:11px}
.elementSize label{display:block;margin:0!important;font-size:10px!important}
.elementSize input{width:100%;max-width:none!important;margin:6px 0 0!important;padding:8px;border:1px solid var(--line);border-radius:5px}
.tools button:disabled,.editorhead button:disabled{opacity:.45;cursor:not-allowed}
.editorhead button{white-space:nowrap;font-size:11px}
.projectheadactions{display:flex;align-items:center;gap:8px}
.importProject{display:inline-block;border:1px solid var(--line);border-radius:8px;padding:10px 13px;font-size:11px;cursor:pointer;white-space:nowrap}
.importProject:hover{background:#edf2ed}
.importProject input{display:none}
#canvasWrap svg text{user-select:none}
@media(max-width:760px){.editorhead{overflow:auto;justify-content:flex-start}.editorhead #designName{flex:1}.editorhead #undoDesign,.editorhead #redoDesign{display:none}.projectheadactions{gap:4px}.importProject{font-size:10px;padding:8px}.elementSize{width:100%;gap:8px}.layerTools{margin:0}.shapeTools{margin:0}}
.recentProjects{margin:36px 0}