:root{--primary:#6b21a8;--primary-light:#f3e8ff;--secondary:#0891b2;--accent:#8b5cf6;--text-dark:#0f172a;--text-light:#64748b;--background:#f8fafc;--white:#fff;--border:#e2e8f0;--input-bg:#f1f5f9;--danger:#ef4444;--danger-light:#fee2e2;--success:#10b981}*{box-sizing:border-box;margin:0;padding:0;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif}body{color:var(--text-dark);background:linear-gradient(135deg,#f1f5f9 0%,#e2e8f0 100%);min-height:100vh;line-height:1.5}.app-container{max-width:1200px;margin:0 auto;padding:2rem 1rem}header{text-align:center;margin-bottom:2rem}header h1{color:var(--primary);justify-content:center;align-items:center;gap:.5rem;font-size:2rem;display:flex}.main-content{grid-template-columns:1fr;gap:2rem;display:grid}@media (width>=1024px){.main-content{grid-template-columns:350px 1fr}}.controls-panel{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#fffffff2;border:1px solid #ffffffb3;border-radius:16px;flex-direction:column;gap:1.5rem;height:fit-content;padding:2.5rem;display:flex;box-shadow:0 10px 25px -5px #0000000d,0 8px 10px -6px #00000003}.form-group{flex-direction:column;gap:.5rem;display:flex}.form-group label{color:var(--text-light);text-transform:uppercase;letter-spacing:.5px;font-size:.85rem;font-weight:600}.form-group input,.form-group textarea,.form-group select{background-color:var(--input-bg);border:1px solid #0000;border-radius:8px;width:100%;padding:.875rem 1rem;font-size:.95rem;transition:all .3s;box-shadow:inset 0 1px 2px #00000005}.form-group input:focus,.form-group textarea:focus,.form-group select:focus{background-color:var(--white);border-color:var(--accent);outline:none;box-shadow:0 0 0 4px #8b5cf626}.form-row{grid-template-columns:1fr 1fr;gap:1rem;display:grid}.section-title{text-transform:uppercase;letter-spacing:1px;color:var(--primary);border-bottom:2px solid var(--primary-light);align-items:center;gap:.5rem;margin-top:1rem;margin-bottom:.5rem;padding-bottom:.75rem;font-size:1rem;font-weight:700;display:flex}.btn{letter-spacing:.5px;text-transform:uppercase;cursor:pointer;border:none;border-radius:8px;justify-content:center;align-items:center;gap:.5rem;padding:.875rem 1.5rem;font-size:.875rem;font-weight:600;transition:all .3s cubic-bezier(.4,0,.2,1);display:inline-flex}.btn-primary{background:linear-gradient(135deg, var(--primary) 0%, var(--accent) 100%);color:var(--white);box-shadow:0 4px 12px #6b21a84d}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 15px #6b21a866}.btn-secondary{background:var(--white);color:var(--primary);border:1px solid var(--border);box-shadow:0 2px 4px #00000005}.btn-secondary:hover{background:var(--primary-light);border-color:var(--primary-light);transform:translateY(-1px)}.btn-danger{background:var(--white);color:var(--danger);border:1px solid var(--danger-light)}.btn-danger:hover{background:var(--danger-light);transform:translateY(-1px)}.btn-icon{border-radius:8px;padding:.75rem}.items-list{flex-direction:column;gap:1rem;display:flex}.item-row{grid-template-columns:2fr 1fr 1fr auto;align-items:center;gap:.5rem;display:grid}.item-row input,.service-row input,.service-row select{background-color:var(--input-bg);border:1px solid #0000;border-radius:8px;width:100%;min-width:0;padding:.875rem 1rem;font-size:.95rem;transition:all .3s;box-shadow:inset 0 1px 2px #00000005}.item-row input:focus,.service-row input:focus,.service-row select:focus{background-color:var(--white);border-color:var(--accent);outline:none;box-shadow:0 0 0 4px #8b5cf626}.service-row{grid-template-columns:2fr 1fr 1fr 1fr auto;align-items:center;gap:.5rem;display:grid}.document-preview-container{background:#e2e8f0;border-radius:12px;justify-content:center;padding:1rem;display:flex;overflow-x:auto}.document-preview-wrapper{transform-origin:top;transition:transform .3s}@media (width<=1024px){.document-preview-wrapper{margin-bottom:-60mm;transform:scale(.8)}}@media (width<=768px){.document-preview-wrapper{margin-bottom:-118mm;transform:scale(.6)}.form-row{grid-template-columns:1fr}.item-row{grid-template-columns:1fr 1fr;grid-template-areas:"desc desc""qty price""action."}.item-row input[placeholder=Description]{grid-area:desc;width:100%;min-width:0}.item-row input[placeholder=Qty]{grid-area:qty;width:100%;min-width:0}.item-row input[placeholder=Price]{grid-area:price;width:100%;min-width:0}.item-row .btn-danger{grid-area:action;justify-self:start}.service-row{grid-template-columns:1fr 1fr;grid-template-areas:"desc desc""type type""qty price""action."}.service-row input[placeholder=Description]{grid-area:desc;width:100%;min-width:0}.service-row select{border:1px solid var(--border);border-radius:6px;grid-area:type;width:100%;min-width:0;padding:.75rem;font-size:1rem}.service-row input[placeholder=Qty],.service-row div{grid-area:qty;width:100%;min-width:0}.service-row input[placeholder=Price]{grid-area:price;width:100%;min-width:0}.service-row .btn-danger{grid-area:action;justify-self:start}.app-container{padding:1rem .5rem}}@media (width<=480px){.document-preview-wrapper{margin-bottom:-178mm;transform:scale(.4)}.doc-addresses{flex-direction:column;gap:1.5rem}.address-block{width:100%}}.document-preview{background:var(--white);color:#000;z-index:1;width:210mm;min-height:297mm;margin:0 auto;padding:40mm 20mm;position:relative;overflow:hidden;box-shadow:0 10px 15px -3px #0000001a}.watermark{text-transform:uppercase;color:#0000000a;white-space:nowrap;pointer-events:none;z-index:0;-webkit-user-select:none;user-select:none;font-size:5rem;font-weight:700;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)rotate(-45deg)}.doc-header,.doc-addresses,.doc-table,.doc-totals,.doc-footer{z-index:2;position:relative}.doc-header{justify-content:space-between;align-items:flex-start;margin-bottom:3rem;display:flex}.doc-logo img{max-width:150px;height:auto}.doc-title-info{text-align:right}.doc-title-info h2{color:var(--primary);text-transform:uppercase;letter-spacing:2px;margin-bottom:.5rem;font-size:2.5rem}.doc-meta{color:var(--text-light);font-size:.875rem}.doc-meta p{margin-bottom:.25rem}.doc-addresses{justify-content:space-between;margin-bottom:3rem;display:flex}.address-block{width:45%}.address-block h3{color:var(--text-light);text-transform:uppercase;border-bottom:1px solid var(--border);margin-bottom:.5rem;padding-bottom:.25rem;font-size:1rem}.doc-table{border-collapse:collapse;width:100%;margin-bottom:2rem}.doc-table th{background:var(--primary);color:var(--white);text-align:left;padding:.75rem;font-weight:500}.doc-table th.text-right{text-align:right}.doc-table td{border-bottom:1px solid var(--border);padding:.75rem}.doc-table td.text-right{text-align:right}.doc-totals{width:300px;margin-left:auto}.total-row{border-bottom:1px solid var(--border);justify-content:space-between;padding:.5rem 0;display:flex}.total-row.grand-total{color:var(--primary);border-bottom:none;border-top:2px solid var(--primary);margin-top:.5rem;padding-top:1rem;font-size:1.25rem;font-weight:700}.doc-footer{text-align:center;color:var(--text-light);border-top:1px solid var(--border);margin-top:5rem;padding-top:1rem;font-size:.875rem}.text-right{text-align:right}.bottom-nav{display:none}@media (width<=1023px){.app-container{padding-bottom:5rem}.bottom-nav{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-top:1px solid var(--border);padding:.5rem 1rem;padding-bottom:max(.5rem, env(safe-area-inset-bottom));z-index:1000;background:#fffffff2;justify-content:space-around;display:flex;position:fixed;bottom:0;left:0;right:0;box-shadow:0 -4px 15px #0000000d}.nav-item{color:var(--text-light);cursor:pointer;background:0 0;border:none;border-radius:8px;flex-direction:column;align-items:center;gap:.25rem;width:30%;padding:.5rem;font-size:.75rem;font-weight:600;transition:all .3s;display:flex}.nav-item:focus{outline:none}.nav-item.active{color:var(--primary);background:var(--primary-light)}.nav-item.active svg{color:var(--primary)}.mobile-hidden{display:none!important}.document-preview-container.mobile-active{display:flex}}@media (width>=1024px){.mobile-hidden{display:flex!important}.form-section.mobile-hidden{display:contents}}