.hat-result-card{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border-radius:16px;padding:25px;color:#fff;text-align:center}.hat-result-main{margin-bottom:20px}.hat-result-label{font-size:.9rem;opacity:.9;margin-bottom:5px}.hat-result-value{font-size:2.5rem;font-weight:700;font-family:'Roboto Mono',monospace}.hat-result-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:15px;margin-top:20px}.hat-result-item{background:rgba(255,255,255,.15);border-radius:12px;padding:15px;backdrop-filter:blur(4px)}.hat-result-item-label{font-size:.85rem;opacity:.85;margin-bottom:5px}.hat-result-item-value{font-size:1.5rem;font-weight:600;font-family:'Roboto Mono',monospace}.hat-size-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:15px}.hat-size-card{background:linear-gradient(135deg,#f8fafc 0%,#e2e8f0 100%);border-radius:12px;padding:15px 10px;text-align:center;transition:transform .2s ease,box-shadow .2s ease}.hat-size-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,.1)}.hat-size-card-label{font-size:.75rem;color:#64748b;margin-bottom:5px;text-transform:uppercase;letter-spacing:.5px}.hat-size-card-value{font-size:1.3rem;font-weight:700;color:#667eea;font-family:'Roboto Mono',monospace}.hat-unit-toggle{display:flex;background:#f1f5f9;border-radius:12px;padding:4px;margin-bottom:15px}.hat-unit-option{flex:1;padding:10px 15px;text-align:center;border-radius:10px;cursor:pointer;transition:all .2s ease;font-size:.95rem;color:#64748b}.hat-unit-option.active{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;font-weight:500}.hat-unit-option:hover:not(.active){background:#e2e8f0}.hat-measure-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-top:20px}.hat-measure-step{text-align:center;padding:15px 10px;background:#f8fafc;border-radius:12px;transition:transform .2s ease}.hat-measure-step:hover{transform:translateY(-3px)}.hat-measure-step-icon{font-size:2rem;margin-bottom:10px}.hat-measure-step-title{font-weight:600;color:#334155;font-size:.9rem;margin-bottom:5px}.hat-measure-step-desc{font-size:.8rem;color:#64748b}.hat-size-table-container{overflow-x:auto;margin-top:15px;border-radius:12px}.hat-size-table{width:100%;border-collapse:collapse;font-size:.9rem}.hat-size-table thead{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff}.hat-size-table th{padding:12px 15px;text-align:center;font-weight:600;white-space:nowrap}.hat-size-table td{padding:10px 15px;text-align:center;border-bottom:1px solid #e2e8f0}.hat-size-table tbody tr:nth-child(even){background:#f8fafc}.hat-size-table tbody tr:hover{background:#e0e7ff}.hat-size-table tbody tr.hat-size-highlight{background:#c7d2fe;font-weight:600}.hat-tips-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:15px;margin-top:15px}.hat-tip-item{background:#fef3c7;border-left:4px solid #f59e0b;padding:15px;border-radius:0 12px 12px 0;font-size:.9rem;color:#92400e}.hat-tip-item i{margin-right:8px;color:#f59e0b}.hat-range-indicator{display:flex;align-items:center;gap:10px;margin-top:10px;padding:10px 15px;background:#f0fdf4;border-radius:8px;font-size:.85rem;color:#166534}.hat-range-indicator i{color:#22c55e}@media(max-width:991px){.hat-size-cards{grid-template-columns:repeat(3,1fr)}.hat-measure-steps{grid-template-columns:repeat(2,1fr)}.hat-tips-grid{grid-template-columns:1fr}}@media(max-width:767px){.hat-result-value{font-size:2rem}.hat-result-grid{grid-template-columns:1fr}.hat-size-cards{grid-template-columns:repeat(2,1fr)}.hat-measure-steps{grid-template-columns:repeat(2,1fr)}.hat-size-table{font-size:.8rem}.hat-size-table th,.hat-size-table td{padding:8px 10px}}@media(max-width:480px){.hat-size-cards{grid-template-columns:1fr 1fr}.hat-unit-toggle{flex-direction:column}.hat-unit-option{padding:12px}}