:root{--red:#e30613;--red-dark:#be0010;--ink:#191d21;--muted:#6f757b;--line:#e4e6e8;--paper:#fff;--bg:#f4f5f5;--green:#16845b;--shadow:0 9px 26px rgba(25,29,33,.06)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:'DM Sans',sans-serif}.sidebar{position:fixed;inset:0 auto 0 0;width:250px;background:#17191c;color:#fff;padding:34px 22px;display:flex;flex-direction:column;z-index:10}.brand{display:flex;align-items:center;gap:12px;color:inherit;text-decoration:none}.brand-mark{display:grid;place-items:center;width:38px;height:38px;background:var(--red);font:800 24px/1 Manrope;transform:skew(-8deg)}.brand strong,.brand small{display:block;line-height:1}.brand strong{font:800 17px Manrope;letter-spacing:1px}.brand small{margin-top:6px;color:#aeb2b5;font-size:13px;letter-spacing:3px}.sidebar nav{margin-top:58px;display:grid;gap:8px}.nav-item{width:100%;border:0;border-radius:9px;background:transparent;color:#aeb2b5;text-align:left;padding:13px 14px;font:600 14px DM Sans;cursor:pointer}.nav-item span{font-size:20px;margin-right:10px}.nav-item.active{background:#2b2e32;color:#fff}.nav-item b{float:right;background:#45494e;border-radius:10px;padding:2px 7px;font-size:11px}.sidebar-foot{margin-top:auto;border-top:1px solid #34373a;padding-top:20px;display:flex;align-items:center;gap:11px}.avatar{display:grid;place-items:center;background:#383c40;width:36px;height:36px;border-radius:50%;font-size:12px}.sidebar-foot strong,.sidebar-foot small{display:block}.sidebar-foot strong{font-size:12px}.sidebar-foot small{font-size:10px;color:#92979b;margin-top:3px}main{margin-left:250px;min-height:100vh}.view{display:none;max-width:1050px;margin:auto;padding:58px 50px 80px}.view.active{display:block}.topbar{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:30px}.eyebrow{color:var(--red)!important;font-weight:700;font-size:11px;letter-spacing:2px;margin:0 0 10px!important}.topbar h1{font:800 34px/1.15 Manrope;margin:0}.topbar p{color:var(--muted);margin:9px 0 0;font-size:14px}.autosave{font-size:12px;color:var(--muted);margin-top:18px}.autosave i{display:inline-block;width:7px;height:7px;background:#2ab67d;border-radius:50%;margin-right:6px}.progress-wrap{margin-bottom:22px}.progress-copy{display:flex;justify-content:space-between;font-size:11px;color:var(--muted);margin-bottom:8px}.progress-copy strong{color:var(--ink)}.progress{height:4px;border-radius:3px;background:#ddd}.progress span{display:block;width:25%;height:100%;border-radius:3px;background:var(--red);transition:.3s}.card{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:27px 30px;margin-bottom:16px;box-shadow:var(--shadow)}.section-title{display:flex;align-items:flex-start;gap:15px;margin-bottom:24px}.section-title>span{background:#fdebed;color:var(--red);border-radius:7px;padding:7px 8px;font-weight:800;font-size:11px}.section-title h2{font:800 19px Manrope;margin:0}.section-title p{color:var(--muted);font-size:12px;margin:4px 0 0}.grid{display:grid;gap:20px}.grid.two{grid-template-columns:1fr 1fr}label>span,.photo-heading span{display:block;font-weight:700;font-size:11px;letter-spacing:.3px;margin-bottom:8px}input,textarea{width:100%;border:1px solid #d8dadd;border-radius:7px;background:#fff;padding:12px 13px;font:400 14px DM Sans;outline:none;transition:.2s}textarea{resize:vertical}input:focus,textarea:focus{border-color:var(--red);box-shadow:0 0 0 3px rgba(227,6,19,.08)}.input-icon{position:relative;color:#899096}.input-icon::first-letter{font-size:18px}.input-icon{line-height:42px}.input-icon input{position:absolute;inset:0}.input-icon{height:43px;padding-left:13px}.form-section>label{display:block;margin-top:19px}.hint{display:block;color:#8b9095;font-size:11px;margin-top:7px}.product-picker{position:relative}.suggestions{position:absolute;z-index:4;top:46px;left:0;right:0;background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:0 12px 30px rgba(0,0,0,.12);display:none;overflow:hidden}.suggestions.open{display:block}.suggestion{padding:11px 13px;cursor:pointer;border-bottom:1px solid #eee}.suggestion:last-child{border:0}.suggestion:hover{background:#faf2f3}.suggestion strong{display:block;font-size:13px}.suggestion small{color:var(--muted)}.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:13px}.chip{background:#fff1f2;color:#a7000d;border:1px solid #f6c5c8;border-radius:20px;padding:7px 9px 7px 12px;font-size:12px;font-weight:600}.chip button{border:0;background:none;color:inherit;cursor:pointer;margin-left:5px}.empty-chip{font-size:12px;color:#999}.photo-heading{display:flex;justify-content:space-between}.photo-heading em{font-style:normal;color:#999;font-size:11px}.dropzone{min-height:142px;border:1.5px dashed #c8cbcf;border-radius:9px;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;background:#fafafa;transition:.2s}.dropzone:hover{border-color:var(--red);background:#fff8f8}.dropzone input{display:none}.dropzone .camera{color:var(--red);font-size:25px}.dropzone strong{font-size:12px;margin-top:6px}.dropzone small{color:#969b9f;font-size:10px;margin-top:3px}.previews{display:flex;gap:7px;flex-wrap:wrap;margin-top:8px}.preview{width:55px;height:55px;border-radius:6px;object-fit:cover}.form-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:25px}.primary,.ghost{border:0;border-radius:7px;padding:12px 19px;font:700 12px DM Sans;cursor:pointer}.primary{background:var(--red);color:#fff;box-shadow:0 5px 12px rgba(227,6,19,.2)}.primary:hover{background:var(--red-dark)}.primary span{margin-left:15px}.ghost{background:#fff;border:1px solid var(--line);color:#4d5257}.toast{position:fixed;right:25px;bottom:25px;background:#202326;color:#fff;padding:13px 18px;border-radius:8px;font-size:13px;opacity:0;transform:translateY(15px);pointer-events:none;transition:.3s;z-index:30}.toast.show{opacity:1;transform:none}.reference-list{display:grid;gap:12px}.reference-item{background:#fff;border:1px solid var(--line);border-radius:10px;padding:20px;display:flex;justify-content:space-between;align-items:center}.reference-item h3{font:700 16px Manrope;margin:0}.reference-item p{margin:6px 0 0;color:var(--muted);font-size:12px}.badge{padding:5px 9px;border-radius:14px;font-size:10px;font-weight:700}.badge.draft{background:#fff3d7;color:#966500}.badge.sent{background:#e5f5ef;color:var(--green)}.empty-state{padding:70px;text-align:center;background:#fff;border:1px dashed #ccc;border-radius:10px;color:var(--muted)}.mobile-head{display:none}
@media(max-width:800px){.sidebar{transform:translateX(-100%);transition:.25s}.sidebar.open{transform:none}.mobile-head{display:flex;align-items:center;justify-content:space-between;background:#17191c;color:#fff;padding:14px 18px}.mobile-head button{border:0;background:none;color:#fff;font-size:22px}main{margin:0}.view{padding:30px 18px 70px}.topbar{gap:15px}.topbar h1{font-size:27px}.autosave{display:none}.grid.two{grid-template-columns:1fr}.card{padding:22px 18px}.form-actions{position:sticky;bottom:0;background:var(--bg);padding:12px 0}.form-actions button{flex:1}.topbar .primary{white-space:nowrap}.reference-item{align-items:flex-start}.photos{gap:25px}}

.brand{flex-direction:column;align-items:flex-start;gap:9px;width:max-content}
.brand img{display:block;width:165px;height:auto}
.brand small{margin-top:0;color:#aeb2b5;font-size:13px;line-height:1;letter-spacing:2.8px;white-space:nowrap}
.sidebar>.brand{align-self:center;align-items:center}
.sidebar>.brand small{text-align:center}
.sidebar nav{margin-top:52px}
@media(max-width:800px){.mobile-head .brand{gap:6px}.mobile-head .brand img{width:126px}.mobile-head .brand small{font-size:7px;letter-spacing:2.15px}}
.progress span{width:0}
.progress-wrap{position:sticky;top:0;z-index:6;background:var(--bg);padding:12px 0 14px}
.form-section{display:none}
.form-section.wizard-active{display:block;animation:wizard-slide-next .38s cubic-bezier(.22,.8,.3,1) both}
.form-section.wizard-active.from-left{animation-name:wizard-slide-back}
@keyframes wizard-slide-next{from{opacity:0;transform:translateX(45px)}to{opacity:1;transform:translateX(0)}}
@keyframes wizard-slide-back{from{opacity:0;transform:translateX(-45px)}to{opacity:1;transform:translateX(0)}}
.wizard-actions{display:flex;justify-content:space-between;align-items:center;margin-top:25px}
.wizard-actions .primary{margin-left:auto}
.wizard-actions button[hidden]{display:none}
.form-actions{display:none}
.form-actions.wizard-final{display:flex}
@media(max-width:800px){.wizard-actions{position:sticky;bottom:0;background:var(--bg);padding:12px 0}.wizard-actions button{flex:1}.wizard-actions button+button{margin-left:10px}.form-actions.wizard-final{position:sticky}}