:root{--bg:#f4f6f8;--card:#fff;--text:#172033;--muted:#667085;--line:#d0d5dd;--accent:#1f6feb;--bad:#b42318;--ok:#067647;--warn:#b54708}*{box-sizing:border-box}body{margin:0;font-family:Arial,Helvetica,sans-serif;background:var(--bg);color:var(--text)}.topbar{background:#111827;color:#fff;padding:14px clamp(14px,2.5vw,34px);display:flex;justify-content:space-between;gap:16px;align-items:center}.topbar h1{margin:0;font-size:25px}.topbar p{margin:5px 0 0;color:#d1d5db;font-size:14px}.layout{display:grid;grid-template-columns:minmax(330px,460px) minmax(620px,1fr);gap:16px;padding:16px;max-width:1540px;margin:0 auto}.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:16px;box-shadow:0 8px 22px rgba(16,24,40,.055)}.result-card{max-width:980px;align-self:start}h2{font-size:17px;margin:18px 0 10px}.grid{display:grid;gap:10px}.grid.two{grid-template-columns:1fr 1fr}label{display:block;font-weight:700;font-size:13px;color:#344054}input,select,textarea{width:100%;margin-top:5px;border:1px solid var(--line);border-radius:9px;padding:9px 10px;font-size:14px;background:#fff}textarea{min-height:78px}input[type=checkbox]{width:auto;margin-right:7px}.actions{display:flex;flex-wrap:wrap;gap:9px;margin-top:14px}button{border:0;border-radius:10px;background:#e5e7eb;color:#111827;padding:10px 13px;font-weight:700;cursor:pointer}.primary,.topbar button{background:var(--accent);color:#fff}.summary{display:grid;grid-template-columns:repeat(4,minmax(105px,1fr));gap:9px;max-width:920px}.metric{border:1px solid var(--line);border-radius:12px;padding:10px;background:#f9fafb}.metric strong{display:block;font-size:19px;line-height:1.1}.metric span{font-size:12px;color:var(--muted)}.status-ok{color:var(--ok)}.status-warn{color:var(--warn)}.status-bad{color:var(--bad)}.canvas-wrap{background:#fff;border:1px dashed var(--line);border-radius:14px;overflow:auto;padding:10px}.plan-compact{max-width:720px;max-height:360px;margin:0 auto}.canvas-wrap svg{width:100%;height:auto;display:block}.plan-compact svg{max-width:690px;margin:0 auto}.canvas-wrap.small{max-width:720px;max-height:215px;margin:0 auto}.canvas-wrap.small svg{max-height:210px}.notice{color:var(--warn);font-weight:700;font-size:13px}.result-card h2{margin-top:16px}.plan-head{display:flex;justify-content:space-between;align-items:center;gap:10px}.plan-head small{color:var(--muted)}
.template-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-bottom:8px}.template{border:1px solid var(--line);background:#fff;border-radius:13px;padding:10px 8px;text-align:left;display:grid;gap:2px;min-height:76px}.template span{font-size:24px;line-height:1;color:#1f2937}.template strong{font-size:13px}.template small{font-size:11px;color:var(--muted)}.template.active{border-color:var(--accent);background:#eff6ff;box-shadow:0 0 0 2px rgba(31,111,235,.08)}.compact-checks label{font-weight:600}.template:hover{border-color:var(--accent)}
footer{padding:20px;color:#475467;text-align:center;font-size:13px}@media(max-width:1200px){.layout{grid-template-columns:1fr}.result-card{max-width:none}.summary{max-width:none}.plan-compact,.canvas-wrap.small{max-width:100%}}@media(max-width:600px){.grid.two,.summary,.template-grid{grid-template-columns:1fr}.layout{padding:10px}.card{padding:14px}.topbar{display:block}.topbar button{margin-top:12px}.topbar h1{font-size:22px}.plan-compact{max-height:none}.canvas-wrap.small{max-height:none}}@media print{.form-card,.topbar button,.actions{display:none}.layout{display:block}.card{box-shadow:none;border:0}.result-card{max-width:none;page-break-inside:avoid}body{background:#fff}.canvas-wrap{max-height:none;overflow:visible}.canvas-wrap svg{max-height:none}}