.gradia-panel{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1.5rem;margin-bottom:1.5rem;padding:1.5rem;display:flex}.gradia-target{flex-direction:column;align-items:center;gap:.5rem;display:flex}.gradia-target-label{color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.05em;font-size:.85rem}.gradia-target-swatch{border:1px solid var(--color-border);background-color:var(--color-bg);border-radius:10px;width:64px;height:64px}.gradia-meta{color:var(--color-text);flex-direction:column;align-items:center;gap:.4rem;font-weight:600;display:flex}.gradia-controls{align-items:center;gap:1rem;display:flex}.gradia-mode-toggle{border:1px solid var(--color-border);border-radius:8px;display:flex;overflow:hidden}.gradia-mode-btn{color:var(--color-text-muted);cursor:pointer;transition:background-color var(--transition-fast), color var(--transition-fast);background:0 0;border:none;padding:.5rem 1rem;font-size:.9rem;font-weight:500}.gradia-mode-btn[aria-pressed=true]{background-color:var(--color-accent);color:#fff}.gradia-stats-btn,.gradia-share-btn{background-color:var(--color-bg);border:1px solid var(--color-border);color:var(--color-text);cursor:pointer;transition:color var(--transition-fast), border-color var(--transition-fast);border-radius:8px;padding:.5rem 1.25rem;font-size:.9rem;font-weight:600}@media (hover:hover){.gradia-stats-btn:hover,.gradia-share-btn:hover{color:var(--color-accent);border-color:var(--color-accent)}}.gradia-grid-wrapper{max-width:500px;margin:0 auto;position:relative}.gradia-grid{aspect-ratio:1;perspective:400px;grid-template-columns:repeat(10,1fr);gap:3px;display:grid}@keyframes gradia-flip-reveal{0%{background-color:var(--color-bg-alt);border-radius:3px;transform:rotateY(0)}50%{background-color:var(--flip-color);border-radius:15%;transform:rotateY(180deg)}to{background-color:var(--color-bg-alt);border-radius:3px;transform:rotateY(360deg)}}.gradia-cell.flip-reveal{animation:1.8s ease-in-out gradia-flip-reveal}.gradia-corner-swatch{border:2px solid var(--color-bg);width:28px;height:28px;box-shadow:0 0 0 1px var(--color-border);border-radius:6px;position:absolute}.gradia-corner-swatch.top-left{top:0;left:0;transform:translate(-50%,-50%)}.gradia-corner-swatch.top-right{top:0;right:0;transform:translate(50%,-50%)}.gradia-corner-swatch.bottom-left{bottom:0;left:0;transform:translate(-50%,50%)}.gradia-corner-swatch.bottom-right{bottom:0;right:0;transform:translate(50%,50%)}.gradia-cell{background-color:var(--color-bg-alt);border:1px solid var(--color-border);cursor:pointer;transition:transform var(--transition-fast);border-radius:3px;padding:0}@media (hover:hover){.gradia-cell:not(.revealed):hover{border-color:var(--color-accent);transform:scale(1.08)}}.gradia-cell.revealed{cursor:default}.gradia-cell.target-found{box-shadow:0 0 0 3px var(--color-accent)}.gradia-win-banner{margin-top:1.5rem;padding:1.5rem}.gradia-win-actions{justify-content:center;align-items:center;gap:1rem;margin:1rem 0;display:flex}.gradia-share-toast{color:var(--color-accent);font-size:.9rem;font-weight:600}.gradia-win-note{color:var(--color-text-muted);text-indent:0;font-size:.9rem}.gradia-modal{z-index:1000;background-color:#00000080;justify-content:center;align-items:center;padding:1rem;display:flex;position:fixed;inset:0}.gradia-modal[hidden]{display:none}.gradia-modal-content{background-color:var(--color-bg);border-radius:12px;width:100%;max-width:400px;padding:2rem;position:relative}.gradia-modal-close{color:var(--color-text-muted);cursor:pointer;background:0 0;border:none;font-size:1.5rem;line-height:1;position:absolute;top:.75rem;right:.75rem}.gradia-stats-grid{text-align:center;grid-template-columns:repeat(3,1fr);gap:.5rem;margin:1rem 0;display:grid}.gradia-stat-num{color:var(--color-text);font-size:1.6rem;font-weight:700;display:block}.gradia-stat-label{color:var(--color-text-muted);font-size:.75rem;display:block}.gradia-distribution{align-items:flex-end;gap:1px;height:50px;margin-bottom:1.5rem;display:flex}.gradia-distribution-bar-wrap{flex-direction:column;flex:1;justify-content:flex-end;align-items:center;height:100%;display:flex}.gradia-distribution-bar{background-color:var(--color-accent);border-radius:2px 2px 0 0;width:100%}.gradia-distribution-label{color:var(--color-text-muted);margin-top:.15rem;font-size:.5rem}@media (width<=636px){.gradia-panel{flex-direction:column}.gradia-grid{max-width:100%}}