:root{--green:#3f776f;--lime:#69d67d;--ink:#102321;--pale:#eef7ec;--line:#9ab2ad}
*{box-sizing:border-box}
body{margin:0;background:#edf3e8;color:var(--ink);font:14px Segoe UI,Arial,sans-serif}
.top{max-width:1500px;margin:0 auto;background:var(--green);color:white;text-align:center;padding:20px;border-radius:0 0 12px 12px}
.top span{font-size:11px;font-weight:700;letter-spacing:1.5px}.top h1{margin:4px 0;font-size:28px}.top p{margin:0;font-weight:700;color:#d9f4dc}
.layout{max-width:1500px;margin:18px auto;display:grid;grid-template-columns:250px minmax(620px,1fr) 260px;gap:16px;padding:0 14px}
.panel,.workspace{background:white;border:1px solid var(--line);border-radius:10px;padding:14px}
.panel h2{font-size:15px;margin:5px 0 10px;border-bottom:1px solid #dce7e2;padding-bottom:6px}
.tools button,.actions button,.file-button{display:block;width:100%;margin:7px 0;padding:9px;border:1px solid #4e706a;border-radius:5px;background:#f7faf8;cursor:pointer;text-align:center;font-weight:650}
.button-grid{display:grid;grid-template-columns:1fr 1fr;gap:5px}.button-grid button{margin:0}.file-button input{display:none}
.primary,.price{background:var(--lime)!important;border-color:#2f9b4a!important}.secondary{background:#e5eff8}
.actions label:not(.file-button){display:block;font-weight:650}.actions input{width:100%;margin-top:5px;padding:8px}.small{font-size:12px;color:#53655f}
.product{display:flex;justify-content:space-between;background:var(--pale);padding:10px;border-radius:6px;margin-bottom:12px}
.canvas-shell{overflow:auto;background:#cad7d8;padding:26px;display:flex;justify-content:center;min-height:550px}
.canvas-container{box-shadow:0 3px 14px #4a5a5a;background:white}
.legend{display:flex;gap:18px;padding:9px;font-size:12px}.legend span:before{content:"";display:inline-block;width:18px;border-top:3px solid;margin-right:5px}
.bleed:before{color:#cf2d75}.trim:before{color:#134bc5}.safe:before{color:#34a057}.status{margin-top:10px}
.layers{padding-left:25px;max-height:180px;overflow:auto}.layers li{padding:5px;cursor:pointer;border-bottom:1px solid #e7ece9}.layers li:hover{background:var(--pale)}
#outputLinks a{display:block;margin:8px 0;color:#064f9c;font-weight:650}button:disabled{opacity:.45;cursor:not-allowed}
@media(max-width:1050px){.layout{grid-template-columns:1fr}.canvas-shell{justify-content:flex-start}.top{border-radius:0}.product{flex-direction:column;gap:4px}}
