*{box-sizing:border-box;margin:0;padding:0}html{height:100%}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,sans-serif;background:linear-gradient(135deg,#f5f7fa,#e4e8ec);min-height:100vh;color:#333;padding:30px;font-weight:400}.container{max-width:1800px;margin:0 auto;font-weight:400}header{text-align:center;margin-bottom:30px;padding:24px;background:#fffc;border-radius:18px;border:1px solid rgba(0,0,0,.1);font-weight:400;transition:all .2s}header:hover{border-color:#00000026}h1{font-size:2.5rem;font-weight:700;background:linear-gradient(90deg,#0077b6,#00b4d8);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:8px}.subtitle{color:#666;font-size:1.1rem;font-weight:400}.main-content{display:grid;grid-template-columns:1.8fr 1fr;gap:24px;font-weight:400}@media (max-width: 1200px){.main-content{grid-template-columns:1fr}}.panel{background:#ffffffe6;border-radius:18px;padding:30px;border:1px solid rgba(0,0,0,.1);font-weight:400;transition:all .2s;box-shadow:0 2px 8px #0000000d}.panel:hover{border-color:#00000026;box-shadow:0 4px 12px #0000001a}.panel-title{font-size:1.3rem;font-weight:700;margin-bottom:24px;color:#0077b6;display:flex;align-items:center;gap:10px}.panel-title:before{content:"";width:4px;height:24px;background:linear-gradient(180deg,#0077b6,#00b4d8);border-radius:3px}.btn-row{display:flex;gap:12px;margin-top:20px;flex-wrap:wrap}table{width:100%;border-collapse:separate;border-spacing:0;font-size:.95rem;font-weight:400}table th:nth-child(1){width:30px}table th:nth-child(2){width:20%}table th:nth-child(3){width:20%}table th:nth-child(4){width:14%}table th:nth-child(5){width:14%}table th:nth-child(6){width:10%}table th:nth-child(7){width:13%}th{background:#0077b61a;padding:14px 10px;text-align:center;font-weight:600;color:#0077b6;border-bottom:2.5px solid rgba(0,119,182,.2)}th:first-child{text-align:left;padding-left:12px;border-top-left-radius:8px}th:last-child{border-top-right-radius:8px}td{padding:12px 10px;text-align:center;border-bottom:1.5px solid rgba(0,0,0,.05);font-weight:400}td:first-child{text-align:left;padding-left:12px}td:first-child input{border-top-left-radius:6px;border-bottom-left-radius:6px}td:last-child input{border-top-right-radius:6px;border-bottom-right-radius:6px}tr{font-weight:400}tr:hover{background:#00000005}tr:hover .vi-cell{color:#0077b6}input[type=text],input[type=number],input[type=password]{width:100%;background:#ffffffe6;border:1px solid rgba(0,0,0,.15);border-radius:6px;padding:10px 12px;color:#333;font-size:.95rem;font-weight:400;transition:all .2s}input[type=text]:focus,input[type=number]:focus,input[type=password]:focus{outline:none;border-color:#0077b6;box-shadow:0 0 0 3px #0077b61a}input[type=text]::placeholder,input[type=number]::placeholder,input[type=password]::placeholder{color:#999}select{width:100%;background:#ffffffe6;border:1px solid rgba(0,0,0,.15);border-radius:6px;padding:10px 12px;color:#333;font-size:.95rem;font-weight:400;transition:all .2s;cursor:pointer}select:focus{outline:none;border-color:#0077b6;box-shadow:0 0 0 3px #0077b61a}select option{background:#fff;color:#333}.vi-cell{color:#00b4d8;font-weight:600}.total-pct{margin-top:12px;padding:10px 16px;border-radius:8px;font-weight:600;text-align:center}.total-pct.valid{background:#0077b61a;color:#0077b6;border:1px solid rgba(0,119,182,.3)}.total-pct.invalid{background:#dc35451a;color:#dc3545;border:1px solid rgba(220,53,69,.3)}.error{margin-top:12px;padding:12px 16px;background:#dc35451a;border:1px solid rgba(220,53,69,.3);border-radius:8px;color:#dc3545;font-size:.9rem}.warning{margin-top:12px;padding:12px 16px;background:#ffc1071a;border:1px solid rgba(255,193,7,.3);border-radius:8px;color:#ffc107;font-size:.9rem}button{display:flex;align-items:center;justify-content:center;gap:8px;padding:12px 24px;border:none;border-radius:10px;font-size:.95rem;font-weight:600;cursor:pointer;transition:all .2s}.btn-primary{background:linear-gradient(135deg,#0077b6,#0096c7);color:#fff}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 4px 20px #0077b64d}.btn-secondary{background:#0000000d;color:#333;border:1px solid rgba(0,0,0,.15)}.btn-secondary:hover{background:#0000001a;border-color:#00000040}.vi-display{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:20px}.result-card{background:#fffc;border:1px solid rgba(0,0,0,.1);border-radius:12px;padding:20px;transition:all .2s}.result-card:hover{border-color:#00000026}.result-title{font-size:.85rem;color:#666;margin-bottom:8px;text-transform:uppercase;letter-spacing:.5px}.result-value{font-size:1.8rem;font-weight:700;color:#0077b6}.result-unit{font-size:.9rem;color:#666;margin-left:4px}.vi-value{font-size:3rem;font-weight:700;background:linear-gradient(90deg,#0077b6,#00b4d8);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.vi-label{font-size:.85rem;color:#666;margin-top:8px}.info-box{background:#0077b60d;border:1px solid rgba(0,119,182,.15);border-radius:10px;padding:18px;margin-top:20px;font-size:.9rem;color:#555;font-weight:400;transition:all .2s}.info-box:hover{border-color:#0077b640}.info-box h4{color:#0077b6;margin-bottom:12px;font-size:1rem;font-weight:600}.info-box ul{margin-left:24px;font-weight:400}.info-box li{margin-bottom:6px;font-weight:400}footer{text-align:center;margin-top:30px;padding:20px;color:#666;font-size:.9rem;font-weight:400}.scroll-wrapper{overflow-x:auto;-webkit-overflow-scrolling:touch;margin-bottom:8px;font-weight:400}.scroll-wrapper.reverse-table-wrapper{overflow:auto;margin-bottom:0;border-radius:0 0 12px 12px;max-height:none}.presets{margin-top:16px;padding-top:16px;border-top:1px solid rgba(0,0,0,.1);font-weight:400}.presets label{color:#666;font-size:.9rem;margin-right:10px;font-weight:500}.presets select{background:#ffffffe6;border:1px solid rgba(0,0,0,.15);border-radius:8px;padding:10px 14px;color:#333;font-size:.95rem;font-weight:400;cursor:pointer;transition:all .2s}.presets select:focus{outline:none;border-color:#0077b6;box-shadow:0 0 0 3px #0077b61a}.presets select option{background:#fff;color:#333}.auth-container{max-width:400px;margin:100px auto;padding:40px;background:#ffffffe6;border-radius:18px;border:1px solid rgba(0,0,0,.1)}.auth-container h2{text-align:center;margin-bottom:24px;color:#0077b6}.auth-form{display:flex;flex-direction:column;gap:16px}.auth-form input{width:100%;padding:12px 16px;background:#ffffffe6;border:1px solid rgba(0,0,0,.15);border-radius:8px;color:#333;font-size:1rem}.auth-form input:focus{outline:none;border-color:#0077b6}.auth-form button{margin-top:8px}.auth-link{text-align:center;margin-top:16px;color:#666}.auth-link a{color:#0077b6;text-decoration:none}.auth-link a:hover{text-decoration:underline}.dashboard-nav{display:flex;gap:12px;margin-bottom:24px;padding-bottom:16px;border-bottom:1px solid rgba(0,0,0,.1)}.dashboard-nav button{padding:8px 16px;font-size:.9rem}.dashboard-nav button.active{background:linear-gradient(135deg,#0077b6,#0096c7);color:#fff}.blend-card{background:#fffc;border:1px solid rgba(0,0,0,.1);border-radius:12px;padding:16px;margin-bottom:12px;transition:all .2s}.blend-card:hover{border-color:#00000026}.blend-card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.blend-card-title{font-weight:600;color:#0077b6}.blend-card-actions{display:flex;gap:8px}.blend-card-actions button{padding:6px 12px;font-size:.8rem}.blend-card-details{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;font-size:.85rem;color:#666}.blend-card-details span{color:#333}.blend-materials{margin-top:12px;padding-top:12px;border-top:1px solid rgba(0,0,0,.1)}.blend-materials-title{font-size:.85rem;color:#666;margin-bottom:8px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.blend-materials-list{display:flex;flex-direction:column;gap:6px}.blend-material-item{display:flex;justify-content:space-between;align-items:center;padding:6px 10px;background:#0077b60d;border-radius:6px;font-size:.9rem}.material-name{color:#333;font-weight:500}.material-percentage{color:#0077b6;font-weight:600}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.modal{background:#fff;border:1px solid rgba(0,0,0,.1);border-radius:18px;padding:30px;max-width:500px;width:90%}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.modal-header h3{color:#0077b6}.modal-close{background:none;border:none;color:#666;font-size:1.5rem;cursor:pointer;padding:0}.modal-close:hover{color:#333}.modal-body{display:flex;flex-direction:column;gap:16px}.modal-footer{display:flex;justify-content:flex-end;gap:12px;margin-top:24px}.nav-bar{display:flex;justify-content:space-between;align-items:center;padding:16px 24px;background:#ffffffe6;border-radius:12px;margin-bottom:24px;border:1px solid rgba(0,0,0,.1)}.nav-brand{font-size:1.2rem;font-weight:700;background:linear-gradient(90deg,#0077b6,#00b4d8);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.nav-links{display:flex;gap:16px}.nav-links a{color:#666;text-decoration:none;transition:color .2s}.nav-links a:hover,.nav-links a.active{color:#0077b6}.nav-links button{background:none;border:none;color:#666;cursor:pointer;padding:0;font-size:.95rem}.nav-links button:hover{color:#0077b6}.reverse-calculator-panel{display:flex;flex-direction:column;gap:20px;grid-column:1 / -1}.reverse-calculator-header{display:flex;justify-content:space-between;align-items:center;padding-bottom:20px;border-bottom:1px solid rgba(0,0,0,.1)}.reverse-calculator-header .panel-title{margin-bottom:0}.reverse-calculator-header .btn-row{margin-top:0}.reverse-calculator-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:20px}@media (max-width: 1200px){.reverse-calculator-grid{grid-template-columns:1fr}}.reverse-calculator-left,.reverse-calculator-right{display:flex;flex-direction:column;gap:20px}.reverse-card{background:#fffc;border:1px solid rgba(0,0,0,.1);border-radius:12px;overflow:hidden;transition:all .2s;display:flex;flex-direction:column}.reverse-card:hover{border-color:#00000026;box-shadow:0 2px 8px #0000000d}.reverse-card-header{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;background:#0077b60d;border-bottom:1px solid rgba(0,0,0,.08);flex-shrink:0;z-index:5}.reverse-card-header h3{margin:0;font-size:1rem;font-weight:600;color:#0077b6}.reverse-card-badge{font-size:.75rem;padding:4px 10px;border-radius:12px;background:#0000000d;color:#666;font-weight:500;text-transform:uppercase;letter-spacing:.5px}.reverse-card-badge.required{background:#dc35451a;color:#dc3545}.reverse-card-badge.success{background:#1987541a;color:#198754}.reverse-card-body{padding:20px}.reverse-card.unknown-material-card,.reverse-card.blend-results-card,.reverse-card.results-card{flex-shrink:0}.known-materials-card{display:flex;flex-direction:column;overflow:hidden}.reverse-table-wrapper{overflow:auto;max-height:500px}.reverse-table{font-size:.9rem;border-collapse:collapse;width:100%;table-layout:fixed}.reverse-table th{padding:12px 8px;font-size:.85rem;position:sticky;top:0;z-index:20;background:#0077b61a;border-bottom:2px solid rgba(0,119,182,.2);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.reverse-table .col-number{width:40px}.reverse-table .col-material{width:25%}.reverse-table .col-visc{width:12%}.reverse-table .col-pct{width:100px}.reverse-table td{padding:10px 8px;border-bottom:1px solid rgba(0,0,0,.05)}.reverse-table thead{position:sticky;top:0;z-index:10}.reverse-table thead tr{background:#0077b61a}.reverse-table tbody{position:relative;z-index:1}.reverse-table tr:last-child td{border-bottom:none}.reverse-table .active-row{background:#0077b608}.reverse-table .active-row:hover{background:#0077b60f}.reverse-select{width:100%;background:#ffffffe6;border:1px solid rgba(0,0,0,.15);border-radius:6px;padding:8px 10px;color:#333;font-size:.9rem;transition:all .2s;cursor:pointer}.reverse-select:focus{outline:none;border-color:#0077b6;box-shadow:0 0 0 3px #0077b61a}.reverse-input{width:100%;background:#ffffffe6;border:1px solid rgba(0,0,0,.15);border-radius:6px;padding:10px 12px;color:#333;font-size:.95rem;transition:all .2s}.reverse-input:focus{outline:none;border-color:#0077b6;box-shadow:0 0 0 3px #0077b61a}.reverse-form-group{display:flex;flex-direction:column;gap:6px;margin-bottom:12px}.reverse-form-group label{font-size:.85rem;color:#666;font-weight:500}.reverse-form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}@media (max-width: 600px){.reverse-form-row{grid-template-columns:1fr}}.reverse-total-pct{padding:16px 20px;border-radius:10px;text-align:center;transition:all .2s}.reverse-total-pct.valid{background:#1987541a;border:1px solid rgba(25,135,84,.3)}.reverse-total-pct.invalid{background:#dc35451a;border:1px solid rgba(220,53,69,.3)}.reverse-total-label{font-size:.85rem;color:#666;margin-bottom:4px}.reverse-total-value{font-size:1.8rem;font-weight:700}.reverse-total-pct.valid .reverse-total-value{color:#198754}.reverse-total-pct.invalid .reverse-total-value{color:#dc3545}.reverse-total-hint{font-size:.8rem;color:#dc3545;margin-top:4px}.reverse-error,.reverse-warning{margin:0;font-size:.9rem}.results-card{border:2px solid rgba(0,0,0,.1)}.results-card.has-results{border-color:#1987544d;background:#19875405}.reverse-results-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}@media (max-width: 500px){.reverse-results-grid{grid-template-columns:1fr}}.reverse-result-item{display:flex;flex-direction:column;gap:4px;padding:12px;background:#fff9;border-radius:8px;border:1px solid rgba(0,0,0,.05)}.reverse-result-label{font-size:.8rem;color:#666;text-transform:uppercase;letter-spacing:.5px}.reverse-result-value{font-size:1.2rem;font-weight:600;color:#0077b6}.reverse-results-placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;color:#999;text-align:center}.reverse-results-placeholder svg{margin-bottom:16px;opacity:.3}.reverse-results-placeholder p{font-size:.9rem;line-height:1.5}.reverse-info-box{margin-top:0}.row-number{color:#999;font-weight:500;font-size:.85rem}