:root{--ccc-primary:#4361ee;--ccc-primary-deep:#3a56d4;--ccc-secondary:#00a86b;--ccc-secondary-light:#e6f0ff;--ccc-danger:#e74c3c;--ccc-bg:#f7f9fb;--ccc-white:#ffffff;--ccc-text:#2b2d42;--ccc-border:#d8dce2;--ccc-radius:8px;--ccc-spacing:1.5rem;--ccc-gap:0.6rem}.ccc-header{text-align:center;margin-bottom:1.25rem;border:1px solid var(--ccc-border);border-radius:var(--ccc-radius);padding:1.8rem 1rem}.ccc-header-icon{width:50px;height:50px;background:var(--ccc-primary)!important;border-radius:var(--ccc-radius);display:flex;align-items:center;justify-content:center;margin:0 auto 1rem;box-shadow:0 4px 16px rgb(67 97 238 / .25)}.ccc-header-icon svg{width:28px;height:28px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.ccc-header-title{font-size:clamp(1.4rem, 4vw, 2rem)!important;font-weight:800;color:var(--ccc-text)!important;letter-spacing:-.02em;line-height:1.2}.ccc-header-sub-title{font-size:0.95rem!important;color:#6b7280!important;margin-top:.4rem;font-weight:300}.ccc-card{background:var(--ccc-white);border-radius:var(--ccc-radius);border:1px solid var(--ccc-border);padding:var(--ccc-spacing) var(--ccc-spacing);margin-bottom:1.2rem;transition:box-shadow 0.2s}.ccc-card-title{font-size:0.8rem!important;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--ccc-primary)!important;margin-bottom:1rem;display:flex;align-items:center;gap:8px}.ccc-card-title::before{content:"";display:inline-block;width:3px;height:14px;background:var(--ccc-primary)!important;border-radius:2px}.ccc-shape-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:var(--ccc-gap)}.ccc-shape-btn{display:flex;flex-direction:column;align-items:center;gap:6px;padding:.75rem .5rem;background:var(--ccc-bg);border:2px solid var(--ccc-border);border-radius:var(--ccc-radius);cursor:pointer;font-size:0.8rem!important;font-weight:500;color:#6b7280!important;transition:all 0.18s ease}.ccc-shape-btn:hover{border-color:var(--ccc-primary)!important;color:var(--ccc-primary)!important;background:var(--ccc-secondary-light)!important}.ccc-shape-btn.ccc-active{border-color:var(--ccc-primary)!important;background:var(--ccc-secondary-light)!important;color:var(--ccc-primary)!important}.ccc-shape-btn svg{width:36px;height:36px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.ccc-form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--ccc-gap) 1rem}.ccc-field{display:flex;flex-direction:column;gap:5px}.ccc-field label{font-size:0.78rem!important;font-weight:500;color:#6b7280!important;letter-spacing:.02em}.ccc-field label span{color:var(--ccc-danger)!important;margin-left:2px}.ccc-input-wrap{position:relative;display:flex;align-items:center}.ccc-input{width:100%;padding:.65rem .85rem;padding-right:3rem;font-size:0.92rem!important;font-weight:400;color:var(--ccc-text)!important;background:var(--ccc-bg);border:1px solid var(--ccc-border);border-radius:var(--ccc-radius);outline:none;transition:border-color 0.18s,box-shadow 0.18s;-moz-appearance:textfield}.ccc-input::-webkit-inner-spin-button,.ccc-input::-webkit-outer-spin-button{-webkit-appearance:none}.ccc-input:focus{border-color:var(--ccc-primary)!important;box-shadow:0 0 0 3px rgb(67 97 238 / .12)!important;background:var(--ccc-white)!important}.ccc-input.ccc-error{border-color:var(--ccc-danger)!important}.ccc-unit-badge{position:absolute;right:0;top:0;bottom:0;padding:0 .7rem;background:var(--ccc-border);border-radius:0 var(--ccc-radius) var(--ccc-radius) 0;display:flex;align-items:center;font-size:0.78rem!important;font-weight:500;color:#6b7280!important;pointer-events:none}.ccc-select{width:100%;padding:.65rem .85rem;font-size:0.92rem!important;color:var(--ccc-text)!important;background:var(--ccc-bg)!important;border:1px solid var(--ccc-border)!important;border-radius:var(--ccc-radius);outline:none;cursor:pointer;transition:border-color 0.18s;-webkit-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%236b7280' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .85rem center}.ccc-select:focus{border-color:var(--ccc-primary)!important;box-shadow:0 0 0 3px rgb(67 97 238 / .12)!important;background-color:var(--ccc-white)!important}.ccc-slider-wrap{display:flex;align-items:center;gap:.75rem}.ccc-slider{-webkit-appearance:none;appearance:none;flex:1;height:6px;border-radius:3px;background:linear-gradient(to right,var(--ccc-primary) var(--ccc-slider-pct,10%),var(--ccc-border) var(--ccc-slider-pct,10%));outline:none;cursor:pointer}.ccc-slider::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;border-radius:50%;background:var(--ccc-primary)!important;border:3px solid var(--ccc-white);box-shadow:0 2px 6px rgb(67 97 238 / .35);cursor:pointer}.ccc-slider::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:var(--ccc-primary)!important;border:3px solid var(--ccc-white)!important;cursor:pointer}.ccc-slider-val{min-width:3rem;text-align:center;font-size:0.9rem!important;font-weight:600;color:var(--ccc-primary)!important;background:var(--ccc-secondary-light);padding:.2rem .5rem;border-radius:var(--ccc-radius)}.ccc-bag-toggle{display:flex;align-items:center;gap:.5rem;font-size:0.82rem!important;color:var(--ccc-primary)!important;cursor:pointer;font-weight:500;margin-top:.5rem;width:fit-content}.ccc-bag-toggle svg{width:16px;height:16px;transition:transform 0.2s}.ccc-bag-toggle.open svg{transform:rotate(180deg)}.ccc-bag-section{overflow:hidden;max-height:0;transition:max-height 0.3s ease}.ccc-bag-section.open{max-height:300px}.ccc-divider{height:1px;background:var(--ccc-border);margin:1.2rem 0}.ccc-btn-calc{display:flex;align-items:center;justify-content:center;gap:.5rem;width:100%;padding:.85rem 2rem;font-size:1rem;font-weight:600;color:var(--ccc-white)!important;background:var(--ccc-primary)!important;border:none;border-radius:var(--ccc-radius);cursor:pointer;transition:background 0.18s,transform 0.1s,box-shadow 0.18s;letter-spacing:.01em;box-shadow:0 4px 14px rgb(67 97 238 / .35)}.ccc-btn-calc:hover{background:var(--ccc-primary-deep)!important;box-shadow:0 6px 20px rgb(67 97 238 / .45)}.ccc-btn-calc:active{transform:scale(.98)}.ccc-btn-calc.ccc-loading{opacity:.8;pointer-events:none}.ccc-btn-calc .ccc-spinner{width:18px;height:18px;border:2.5px solid rgb(255 255 255 / .35);border-top-color:#fff;border-radius:50%;animation:ccc-spin 0.7s linear infinite;display:none}.ccc-btn-calc.ccc-loading .ccc-spinner{display:block}.ccc-btn-calc.ccc-loading .ccc-btn-label{display:none}.ccc-error-box{background:#fff5f5;border:1px solid #fecaca;border-radius:var(--ccc-radius);padding:.85rem 1rem;font-size:0.85rem!important;color:#b91c1c!important;display:none;margin-bottom:1rem}.ccc-error-box.show{display:block}.ccc-error-box ul{padding-left:1.2rem;margin-top:.3rem}.ccc-results{display:none}.ccc-results.show{display:block;animation:ccc-fade-in 0.35s ease}.ccc-result-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:var(--ccc-gap)}.ccc-stat{background:var(--ccc-bg);border:1px solid var(--ccc-border);border-radius:var(--ccc-radius);padding:1rem;text-align:center}.ccc-stat-val{font-size:1.6rem!important;font-weight:700;color:var(--ccc-primary)!important;line-height:1.1}.ccc-stat-val.green{color:var(--ccc-secondary)!important}.ccc-stat-label{font-size:0.72rem!important;color:#6b7280!important;font-weight:500;margin-top:.3rem;text-transform:uppercase;letter-spacing:.05em}.ccc-stat-sub{font-size:0.75rem!important;color:#9ca3af!important;margin-top:.15rem}.ccc-table-wrap{overflow-x:auto}.ccc-table{width:100%;border-collapse:collapse;font-size:0.86rem!important;border:none}.ccc-table thead,.ccc-table tbody,.ccc-table tr{border:none}.ccc-table th{text-align:left;padding:.6rem .85rem;background:var(--ccc-bg);font-size:0.75rem!important;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:#6b7280!important;border:none;border-bottom:2px solid var(--ccc-border)}.ccc-table td{padding:.65rem .85rem;border:none;border-bottom:1px solid var(--ccc-border);vertical-align:middle;color:var(--ccc-text)!important}.ccc-table tr:last-child td{border-bottom:none}.ccc-table tr:hover td{background:var(--ccc-secondary-light)!important}.ccc-table .ccc-bold{font-weight:600}.ccc-table .ccc-highlight td{background:rgb(67 97 238 / .06);font-weight:600}.ccc-mat-row{display:flex;align-items:center;gap:.75rem;margin-bottom:.75rem}.ccc-mat-label{width:90px;font-size:0.82rem!important;font-weight:500;color:var(--ccc-text)!important;flex-shrink:0}.ccc-mat-bar-bg{flex:1;height:10px;background:var(--ccc-border)!important;border-radius:5px;overflow:hidden}.ccc-mat-bar{height:100%;border-radius:5px;transition:width 0.6s ease}.ccc-mat-val{width:80px;text-align:right;font-size:0.8rem!important;color:#6b7280!important;flex-shrink:0}.ccc-bags-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:var(--ccc-gap)}.ccc-bag-card{background:var(--ccc-bg);border:1px solid var(--ccc-border);border-radius:var(--ccc-radius);padding:.85rem;text-align:center}.ccc-bag-card-count{font-size:1.5rem!important;font-weight:700;color:var(--ccc-primary)!important}.ccc-bag-card-label{font-size:.75rem;color:#6b7280!important;margin-top:.2rem}.ccc-bag-card-cost{font-size:0.9rem!important;font-weight:600;color:var(--ccc-secondary)!important;margin-top:.35rem}.ccc-actions{display:flex;flex-wrap:wrap;gap:var(--ccc-gap);margin-top:1rem}.ccc-btn{display:inline-flex;align-items:center;gap:.4rem;padding:.6rem 1.1rem;font-size:0.85rem!important;font-weight:500;border-radius:var(--ccc-radius);cursor:pointer;transition:all 0.18s;border:1px solid #fff0}.ccc-btn-pdf{background:var(--ccc-primary)!important;color:var(--ccc-white)!important;border-color:var(--ccc-primary)!important}.ccc-btn-pdf:hover{background:var(--ccc-primary-deep)!important;border-color:var(--ccc-primary-deep)!important}.ccc-btn-copy{background:var(--ccc-white)!important;color:var(--ccc-text)!important;border-color:var(--ccc-border)!important}.ccc-btn-copy:hover{border-color:var(--ccc-primary)!important;color:var(--ccc-primary)!important}.ccc-btn-reset{background:var(--ccc-white)!important;color:var(--ccc-danger)!important;border-color:#fecaca!important}.ccc-btn-reset:hover{background:#fff5f5!important}.ccc-btn svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.ccc-overlay{position:fixed;inset:0;background:rgb(0 0 0 / .45);display:none;align-items:center;justify-content:center;z-index:9999}.ccc-overlay.show{display:flex;animation:ccc-fade-in 0.15s ease}.ccc-modal{background:var(--ccc-white)!important;border-radius:12px;padding:1.75rem;max-width:360px;width:90%;text-align:center;box-shadow:0 20px 60px rgb(0 0 0 / .2)}.ccc-modal h3{font-size:1.1rem!important;font-weight:600;margin-bottom:.5rem}.ccc-modal p{font-size:0.88rem!important;color:#6b7280!important;margin-bottom:1.25rem}.ccc-modal-actions{display:flex;gap:.6rem;justify-content:center}.ccc-tooltip-wrap{position:relative;display:inline-flex;cursor:help}.ccc-tooltip-wrap .ccc-tt{position:absolute;bottom:calc(100% + 6px);left:50%;transform:translateX(-50%);background:#1e293b;color:#f1f5f9!important;font-size:0.75rem!important;padding:.4rem .65rem;border-radius:6px;white-space:nowrap;pointer-events:none;opacity:0;transition:opacity 0.18s;z-index:10;font-weight:400}.ccc-tooltip-wrap:hover .ccc-tt{opacity:1}.ccc-toast{position:fixed;bottom:1.5rem;right:1.5rem;background:#1e293b;color:#f1f5f9!important;padding:.7rem 1.1rem;border-radius:var(--ccc-radius);font-size:0.85rem!important;font-weight:500;z-index:9999;transform:translateY(20px);opacity:0;transition:all 0.25s;pointer-events:none}.ccc-toast.show{transform:translateY(0);opacity:1}@keyframes ccc-fade-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes ccc-spin{to{transform:rotate(360deg)}}@media (max-width:600px){.ccc-card{padding:1rem}.ccc-stat-val{font-size:1.35rem!important}.ccc-actions{flex-direction:column}.ccc-btn{justify-content:center}}@media print{.ccc-actions,.ccc-overlay,.ccc-toast,.ccc-btn-calc,.ccc-shape-grid,.ccc-field,.ccc-divider,.ccc-bag-toggle,.ccc-error-box{display:none!important}body{background:#fff;padding:0}.ccc-card{box-shadow:none;border:1px solid #ddd}}