.color-grid{display:grid;gap:.5rem;margin-top:1rem}.color-grid.grid-cols-5{grid-template-columns:repeat(5,1fr)}.color-grid.grid-cols-6{grid-template-columns:repeat(6,1fr)}@media (max-width:768px){.color-grid.grid-cols-5,.color-grid.grid-cols-6{grid-template-columns:repeat(3,1fr)}}@media (max-width:480px){.color-grid.grid-cols-5,.color-grid.grid-cols-6{grid-template-columns:repeat(2,1fr)}}.color-item{padding:.75rem;border-radius:.5rem;border:1px solid #e5e7eb;cursor:pointer;transition:all .2s ease-in-out;text-align:center;min-height:80px;display:flex;flex-direction:column;justify-content:center;outline:none}.color-item:hover{transform:translateY(-1px)}.color-item:focus,.color-item:hover{box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06)}.color-item:focus{outline:2px solid #ec4899;outline-offset:2px}.color-item:active{transform:translateY(0);box-shadow:0 2px 4px -1px rgba(0,0,0,.1)}.color-hex{font-family:Courier New,monospace;font-size:.875rem;font-weight:700;margin-bottom:.25rem}.color-rgb{font-size:.75rem;opacity:.75}.color-name{font-weight:700;font-size:.875rem;margin-bottom:.25rem}.color-table{width:100%;border-collapse:collapse;overflow-x:auto;margin-top:1rem}.color-table td,.color-table th{border:1px solid #e5e7eb;padding:.5rem;text-align:left}.color-table th{font-weight:600}.color-table th,.color-table tr:hover{background-color:#f9fafb}.color-preview{width:2rem;height:2rem;border-radius:.25rem;border:1px solid #e5e7eb}.copy-button{padding:.25rem .75rem;font-size:.875rem;border:1px solid #d1d5db;border-radius:.375rem;background-color:white;cursor:pointer;transition:all .2s ease-in-out}.copy-button:hover{background-color:#f3f4f6;border-color:#9ca3af}.copy-button:focus{outline:2px solid #ec4899;outline-offset:2px}.tab-list{display:grid;width:100%;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:.5rem;margin-bottom:1.5rem;min-height:2.5rem}.tab-list[role=tablist]{height:auto!important;min-height:2.5rem!important}@media (max-width:640px){.tab-list{grid-template-columns:repeat(2,1fr)}}.card-header{margin-bottom:1rem}.card-content{padding-top:1rem}.info-card,.tabs-content{margin-top:1rem}.info-card{background-color:#f0f9ff;border:1px solid #bae6fd;border-radius:.5rem;padding:1.5rem}.info-card h3{color:#0369a1;font-size:1.125rem;font-weight:600;margin-bottom:.75rem}.info-card p{color:#0c4a6e;margin-bottom:.5rem}.info-card.blue{background-color:#eff6ff;border-color:#bfdbfe}.info-card.blue h3{color:#1d4ed8}.info-card.blue p{color:#1e40af}.info-card.green{background-color:#f0fdf4;border-color:#bbf7d0}.info-card.green h3{color:#15803d}.info-card.green p{color:#166534}.space-y-8>*+*{margin-top:2rem}.space-y-4>*+*{margin-top:1rem}.card-title{margin-bottom:1rem!important}.tabs-trigger{padding:.5rem 1rem;min-height:2.5rem}.border-dashed{border-style:dashed}.border-pink-500{border-color:#ec4899}.bg-decoration{position:absolute;pointer-events:none;z-index:-1}.bg-decoration-circle{width:200px;height:200px;border-radius:50%;background:linear-gradient(45deg,#fce7f3,#fdf2f8);opacity:.6}.bg-decoration-top-right{top:-100px;right:-100px}.bg-decoration-bottom-left{bottom:-100px;left:-100px}.decoration-dots{position:absolute;top:0;left:0;right:0;bottom:0;background-image:radial-gradient(circle,#fce7f3 1px,transparent 0);background-size:20px 20px;opacity:.3;pointer-events:none;z-index:-1}.symbol-selector{margin-bottom:3rem}.back-to-top{position:fixed;bottom:2rem;right:2rem;z-index:50}@media (max-width:768px){.back-to-top{bottom:1.5rem;right:1.5rem}}.loading{opacity:.6;pointer-events:none}:focus{outline:2px solid #ec4899;outline-offset:2px}:focus:not(:focus-visible){outline:none}:focus-visible{outline:2px solid #ec4899;outline-offset:2px}