:root{--color-dark:#231f20;--color-text:#231f20;--color-text-light:#514e4d;--color-text-lighter:#979490;--color-white:#f8f6f2;--color-magenta:#ff00d4;--color-primary:#231f20;--color-primary-hover:#000;--color-primary-light:#f1efeb;--color-primary-bg:#f1efeb;--color-bg-light:#ebe8e3;--color-bg-lighter:#f1efeb;--color-bg-lightest:#f8f6f2;--color-hover:#e4e1dc;--color-active:#e4e1dc;--color-border:#ebe8e3;--color-border-light:#f1efeb;--color-border-medium:#e4e1dc;--color-warning-bg:#fff3cd;--color-warning-border:#ffc107;--color-warning-text:#856404;--color-danger:#ff0064;--color-danger-hover:#e6003c;--gradient-cmyk:linear-gradient(119deg,#ff00d4 0%,#ff0064 23%,#ff9600 40%,#fd0 51%,#f0f0e4 64%,#a1eeff 79%,#1cb2fc 100%);--gradient-cmyk-left:linear-gradient(119deg,#ff00d4 0%,#ff0064 85%,#ff9600 100%);--gradient-cmyk-left-hover:linear-gradient(119deg,#ff00d4 0%,#ff0064 65%,#ff9600 95%);--spacing-xs:.25rem;--spacing-sm:.5rem;--spacing-md:.75rem;--spacing-lg:1rem;--spacing-xl:1.5rem;--spacing-2xl:2rem;--spacing-3xl:3rem;--radius-sm:4px;--radius-md:8px;--radius-lg:15px;--shadow-sm:none;--shadow-md:none;--shadow-primary:none;--shadow-danger:none;--shadow-inset:none;--transition-fast:.2s;--transition-base:.3s;--transition-slow:.8s;--font-xs:.85rem;--font-sm:.9rem;--font-base:1rem;--font-md:1.1rem;--font-lg:1.2rem;--font-xl:1.5rem;--font-2xl:2rem;--font-3xl:2.5rem;--font-normal:normal;--font-semibold:600;--line-height-base:1.4;--line-height-relaxed:1.5;--container-max-width:1000px}*{box-sizing:border-box;margin:0;padding:0}body{font-family:segoe-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:var(--line-height-base);color:var(--color-text);padding:var(--spacing-3xl);background-color:var(--color-dark);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200' viewBox='0 0 100 100'%3E%3Cg fill-rule='evenodd'%3E%3Cg fill='%2373686b' fill-opacity='0.1'%3E%3Cpath opacity='.5' d='M96 95h4v1h-4v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h4v1h-4v9h4v1h-4v9h4v1h-4v9h4v1h-4v9h4v1h-4v9h4v1h-4v9h4v1h-4v9h4v1h-4v9zm-1 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-9-10h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm9-10v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-9-10h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm9-10v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-9-10h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm9-10v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-10 0v-9h-9v9h9zm-9-10h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9zm10 0h9v-9h-9v9z'/%3E%3Cpath d='M6 5V0H5v5H0v1h5v94h1V6h94V5H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E")}.container{max-width:var(--container-max-width);background-color:var(--color-white);border-radius:var(--radius-md);box-shadow:var(--shadow-md);margin:0 auto;padding:2rem 3.5rem .5rem;overflow:hidden}.hr-cmyk{background:var(--gradient-cmyk);border:none;height:4px;margin:0 0 1rem}hr{background:var(--color-border);border:none;height:2px;margin:0 0 1rem}header{padding-bottom:2rem}header h1{font-size:var(--font-3xl);margin-bottom:var(--spacing-sm)}header p{font-size:var(--font-sm);opacity:.9;margin-top:1rem;line-height:1.6}.header-content{gap:var(--spacing-2xl);align-items:flex-start;display:flex}.header-text{flex:1;max-width:66%}.header-image{flex-shrink:0;width:250px;padding:4.5rem 0 0 3rem}.header-image img{width:100%;height:auto;display:block}section{margin-bottom:var(--spacing-3xl)}h2{font-size:var(--font-xl);color:var(--color-dark);padding-bottom:.5rem;line-height:.8}.section-container{background-color:none;padding:var(--spacing-2xl);border-radius:var(--radius-md);border:2px solid var(--color-border)}.input-grid{column-gap:var(--spacing-lg);row-gap:var(--spacing-md);margin-bottom:var(--spacing-2xl);grid-template-columns:repeat(5,1fr);display:grid}.input-group{flex-direction:column;display:flex}.input-group label{font-weight:var(--font-semibold);margin-bottom:var(--spacing-xs);color:var(--color-text-light)}.input-group input[type=number]{padding:var(--spacing-sm);font-size:var(--font-base);border:2px solid var(--color-border-light);border-radius:var(--radius-sm);transition:border-color var(--transition-base)}.input-group input[type=number]:focus{border-color:var(--color-primary);outline:none}.total-group .total-display{padding:var(--spacing-sm);font-size:var(--font-base);border:2px solid var(--color-primary);border-radius:var(--radius-sm);background-color:var(--color-primary-light);color:var(--color-primary);font-weight:var(--font-semibold);text-align:center;justify-content:center;align-items:center;min-height:42px;display:flex}.optimization-warning{padding:var(--spacing-md)var(--spacing-lg);background-color:var(--color-warning-bg);border:1px solid var(--color-warning-border);border-radius:var(--radius-sm);color:var(--color-warning-text);font-size:.95rem;line-height:var(--line-height-relaxed);margin-bottom:var(--spacing-lg)}.threshold-section label{font-weight:var(--font-semibold);margin-bottom:var(--spacing-sm);color:var(--color-text-light);display:block}.threshold-options{column-gap:var(--spacing-2xl);row-gap:var(--spacing-xs);flex-wrap:wrap;display:flex}.threshold-options label{align-items:center;gap:var(--spacing-xs);font-weight:var(--font-normal);cursor:pointer;display:flex}.threshold-options input[type=radio]{cursor:pointer}.action-buttons{gap:var(--spacing-lg);flex-wrap:wrap;display:flex}button{padding:var(--spacing-md)var(--spacing-3xl);font-size:var(--font-base);font-weight:var(--font-semibold);border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-fast);border:none}.primary-btn{background-image:var(--gradient-cmyk-left-hover);color:var(--color-white);background-position:0 0;background-size:200% 100%;transition:all var(--transition-base)!important}.primary-btn:hover{background-position:66% 0;transition:all var(--transition-base)!important}.secondary-btn{background-color:var(--color-bg);color:var(--color-text-lighter);border:2px solid var(--color-text-lighter)}.secondary-btn:hover{background-color:var(--color-bg-lightest);color:var(--color-text-light);border-color:var(--color-text-light)}.cancel-btn{background-color:var(--color-danger);color:var(--color-white)}.cancel-btn:hover{background-color:var(--color-danger-hover)}button:disabled{opacity:.6;cursor:not-allowed;box-shadow:none!important;transform:none!important}.color-display{margin-bottom:var(--spacing-3xl)}.color-swatch-container{margin-bottom:var(--spacing-xl);justify-content:center;display:flex}.swatch-pair{border:3px solid var(--color-border-light);border-radius:var(--radius-md);width:100%;height:300px;box-shadow:var(--shadow-sm);display:flex;overflow:hidden}.swatch{background-color:var(--color-white);flex:1}.color-info-container{gap:var(--spacing-xl);grid-template-columns:repeat(auto-fit,minmax(250px,1fr));display:grid}.color-info{background-color:var(--color-white);padding:var(--spacing-xl);border-radius:var(--radius-md);border:1px solid var(--color-border)}.color-info h3{margin-bottom:var(--spacing-lg);color:var(--color-text-light);font-size:var(--font-lg);border-bottom:2px solid var(--color-primary);padding-bottom:var(--spacing-xs)}.color-values{gap:var(--spacing-md);flex-direction:column;display:flex}.value-box{align-items:baseline;gap:var(--spacing-xs);padding:var(--spacing-xs)var(--spacing-md);background-color:var(--color-bg-light);border-radius:var(--radius-sm);border:1px solid var(--color-border);cursor:pointer;transition:all var(--transition-fast);display:flex;position:relative}.value-box:hover{background-color:var(--color-hover);border-color:var(--color-primary)}.value-box:active{background-color:var(--color-active)}.value-label{color:var(--color-primary);font-size:var(--font-xs);font-weight:var(--font-semibold);min-width:50px}.value-content{font-family:Courier New,monospace;font-size:var(--font-sm);color:var(--color-text);flex:1}.copied-text{font-size:var(--font-xs);font-weight:medium;color:var(--color-white);white-space:nowrap;margin-left:auto}.results-section{background-color:var(--color-primary-bg);padding:var(--spacing-2xl);border-radius:var(--radius-md)}.results-content{gap:var(--spacing-sm);flex-direction:column;display:flex}.result-item{padding:var(--spacing-md);background-color:var(--color-white);border-radius:var(--radius-sm);border:1px solid var(--color-border);justify-content:space-between;display:flex}.result-label{font-weight:var(--font-semibold);color:var(--color-text-light)}.result-item span:last-child{color:var(--color-primary);font-weight:var(--font-semibold)}.result-item.threshold-metric{background-color:var(--color-primary-light);border:2px solid var(--color-primary)}.progress-container{margin-bottom:var(--spacing-xl);padding:var(--spacing-xl);background-color:var(--color-white);border-radius:var(--radius-md);border:2px solid var(--color-primary);flex-wrap:wrap;justify-content:space-between;display:flex}.progress-label{font-weight:var(--font-semibold);color:var(--color-text-light);margin-bottom:var(--spacing-sm);font-size:.95rem}.progress-bar{background-color:var(--color-border);border-radius:var(--radius-lg);width:100%;height:30px;margin-bottom:var(--spacing-xs);box-shadow:var(--shadow-inset);flex-basis:100%;overflow:hidden}.progress-fill{background:var(--color-dark);width:0%;height:100%;color:var(--color-white);font-weight:var(--font-semibold);font-size:var(--font-xs);justify-content:flex-end;align-items:center;display:flex}.progress-fill.resetting{transition:width var(--transition-slow)ease}.progress-text{text-align:center;font-size:var(--font-sm);color:var(--color-primary);font-weight:var(--font-semibold)}footer{padding-top:var(--spacing-xl);text-align:center;color:var(--color-text-lighter);font-size:var(--font-sm);max-width:var(--container-max-width);margin:0 auto}footer p{margin:var(--spacing-lg)auto;max-width:50%;color:var(--color-bg-light)}footer a{color:var(--color-magenta);transition:color var(--transition-fast)}footer a:hover{color:#8b008b}@media (width<=768px){body{padding:var(--spacing-sm)}header h1{font-size:var(--font-2xl)}.header-content{flex-direction:column}.header-text{max-width:100%}.header-image{width:150px;margin:0 auto;padding:0}main{padding:var(--spacing-xl)}.input-grid{grid-template-columns:repeat(auto-fit,minmax(80px,1fr))}.color-display{grid-template-columns:1fr}.action-buttons{flex-direction:column}button{width:100%}}