*{box-sizing:border-box}body{margin:0;background:#f4f6f3;color:#193c30;font:15px 'Segoe UI',Arial,sans-serif}header{height:88px;display:flex;gap:32px;align-items:center;padding:0 5%;background:#fff;border-bottom:1px solid #dce5dd}.brand{font-weight:900;font-size:25px;letter-spacing:1px;text-decoration:none;color:#194f3a}.brand small{display:block;font-size:10px;letter-spacing:3px}nav{display:flex;gap:24px;margin:auto}a{color:#267450}nav a{text-decoration:none}.pill{font-size:11px;font-weight:700;letter-spacing:1px;background:#e9f2e9;padding:12px 16px;border-radius:24px}main{max-width:1500px;margin:auto;padding:38px 36px}.heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:26px}h1{font-size:42px;letter-spacing:-1.8px;margin:8px 0}p{line-height:1.5;color:#6b8073}.eyebrow{font-size:11px;font-weight:800;letter-spacing:2px;color:#397751}.weight{background:#153f2e;color:white;border-radius:16px;padding:22px 28px;min-width:245px}.weight span,.weight small{display:block;color:#a6c8b4;font-size:11px;letter-spacing:1px}.weight strong{display:block;font-size:35px;margin:8px 0}.flow{display:flex;gap:36px;padding:16px 0 25px;border-bottom:1px solid #dce5dd;margin-bottom:24px;color:#698474}.flow b{background:#dcebdc;color:#1e5c3f;border-radius:50%;display:inline-grid;place-items:center;width:27px;height:27px;margin-right:8px}.layout{display:grid;grid-template-columns:350px minmax(0,1fr);gap:28px}section,details,.print-panel{background:white;border:1px solid #dbe4dc;border-radius:16px;padding:23px;margin-bottom:20px}.section-title{display:flex;align-items:center;gap:12px;margin-bottom:16px}h2{font-size:20px;margin:0 0 16px;letter-spacing:-.4px}.section-title h2{margin:0}.step{font:700 12px monospace;color:#74987d}label{display:block;font-size:12px;font-weight:600;color:#587062;margin-top:13px}input,select,textarea{display:block;width:100%;font:15px 'Segoe UI',Arial;color:#173d2b;background:#fafcf9;border:1px solid #d3dfd2;border-radius:8px;padding:11px;margin-top:7px}input:focus,select:focus,textarea:focus{outline:2px solid #66b48a;outline-offset:1px}.row{display:flex;gap:12px}.row>*{flex:1;min-width:0}.hint{font-size:12px;color:#829184;line-height:1.6}.check{display:flex;align-items:center;gap:9px;font-size:13px}.check input{width:17px;height:17px;margin:0;accent-color:#286c47}button,.button{font:600 14px 'Segoe UI';border:0;border-radius:9px;padding:13px 20px;background:#e9f1e7;color:#275d3a;cursor:pointer;text-decoration:none;display:inline-block}button:disabled{opacity:.5;cursor:wait}.secondary{width:100%;margin-top:12px}.primary{background:#26794b;color:white;width:100%;margin-top:14px;font-size:18px;padding:19px;box-shadow:0 5px 16px #26794b22}.size-controls{display:flex;align-items:center;gap:10px;margin-top:8px}.size-controls input{padding:0;margin:0;accent-color:#26794b}.size-controls button{padding:5px 14px;font-size:25px}.size-controls output{float:right}.preview-heading{display:flex;align-items:center;justify-content:space-between;padding:4px 6px 18px}.preview-heading h2{margin:6px 0 0;font-size:22px}.preview-heading>span{font:12px monospace;color:#6f8a76}.canvas-wrap{background-color:#e7ede6;background-image:radial-gradient(#b5c5b4 1px,transparent 1px);background-size:18px 18px;min-height:560px;overflow:auto;border:1px solid #d4e0d1;border-radius:16px;display:grid;place-items:start center;padding:35px;margin-bottom:22px;max-height:850px}canvas{background:white;box-shadow:0 10px 40px #2a4b2220;border:1px solid #cbd3c9;touch-action:none;max-width:100%;height:auto}summary{cursor:pointer;font-weight:600}.job{padding:12px 0;border-bottom:1px solid #e3eadf;display:flex;justify-content:space-between;gap:12px;font-size:13px}.job small{display:block;color:#708778;margin-top:5px}.job span{max-width:60%;overflow-wrap:anywhere}#notice:not(:empty),#printStatus:not(:empty){padding:14px 18px;background:#e3efdf;border-radius:10px;color:#28533c}.error{background:#ffe6df!important;color:#963c22!important}footer{text-align:center;color:#879c89;font-size:12px;padding:30px}[hidden]{display:none!important}@media(max-width:900px){.layout{grid-template-columns:300px minmax(0,1fr)}main{padding:25px 20px}h1{font-size:34px}.pill{display:none}.canvas-wrap{padding:15px;min-height:400px}}@media(max-width:700px){header{height:72px;padding:0 20px;gap:10px}nav{gap:14px;margin-left:auto;font-size:12px}.heading{display:block}.weight{margin-top:20px}.layout{display:flex;flex-direction:column}.flow{gap:10px;font-size:12px}.canvas-wrap{min-height:0}.heading h1{font-size:32px}.stage{min-width:0}}

.product-bar{padding:20px 24px}.product-buttons{display:flex;flex-wrap:wrap;gap:10px}.product-buttons button{min-height:56px;min-width:116px;font-size:17px;background:#f0f5ed;border:1px solid #d3e3d4}.product-buttons button[aria-pressed=true],.mode-bar button[aria-pressed=true]{background:#184e36;color:#fff;box-shadow:0 5px 14px #184e3620}.mode-bar{display:flex;align-items:center;gap:10px;margin:0 0 22px}.mode-bar span{margin-left:auto;font-size:22px;font-weight:750}.flow{display:none}.layout{display:block}.layout.editing{display:grid;grid-template-columns:350px minmax(0,1fr)}.production-layout{display:grid;grid-template-columns:minmax(300px,.85fr) minmax(320px,1.15fr);gap:24px;align-items:start}.print-panel{margin:0;position:sticky;top:20px}.print-panel h2{font-size:26px}.canvas-wrap{min-height:0;max-height:650px;padding:24px}.preview-heading h2{font-size:19px}.editing .production-layout{display:flex;flex-direction:column-reverse}.editing .preview-area,.editing .print-panel{width:100%}.stage{min-width:0}.stage>section{margin-top:22px}.product-buttons button:focus-visible,.mode-bar button:focus-visible{outline:3px solid #e4b753;outline-offset:3px}@media(max-width:1050px){.layout.editing{grid-template-columns:300px minmax(0,1fr)}.production-layout{grid-template-columns:1fr}.print-panel{position:static}}@media(max-width:700px){.layout.editing{display:flex}.mode-bar{flex-wrap:wrap}.mode-bar span{width:100%;margin:4px 0}.product-buttons button{flex:1;min-width:110px}.product-bar{padding:16px}.production-layout{display:flex;flex-direction:column}.print-panel,.preview-area{width:100%}}
