main .tab-button{color:theme(colors.slate.7)}main .tab-button.active,main .tab-button:hover,main .tab-button.active:hover{color:#fff}.cssgen-layout{display:grid;gap:1.5rem;margin-top:1.25rem}@media (min-width: 768px){.cssgen-layout{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start}}@media (min-width: 768px){.cssgen-preview-wrap{position:sticky;top:5.5rem}}.cssgen-preview{min-height:220px;border-radius:.75rem;border:1px solid theme(colors.slate.2);background-color:#fff;background-image:linear-gradient(45deg,theme(colors.slate.1) 25%,transparent 25%),linear-gradient(-45deg,theme(colors.slate.1) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,theme(colors.slate.1) 75%),linear-gradient(-45deg,transparent 75%,theme(colors.slate.1) 75%);background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0}#gradPreview{background-image:none;background-size:auto}.cssgen-preview--shadow,.cssgen-preview--radius{display:flex;align-items:center;justify-content:center;padding:2.5rem}.cssgen-shadow-box,.cssgen-radius-box{width:60%;max-width:200px;aspect-ratio:1 / 1;background-color:var(--color-primary, #C2682E)}.cssgen-radius-box{background:linear-gradient(135deg,var(--color-primary-light, #E08A4C),var(--color-primary, #C2682E))}.cssgen-stops{display:flex;flex-direction:column;gap:.5rem}.cssgen-stop-row{display:flex;align-items:center;gap:.5rem}.cssgen-color{width:44px;min-width:44px;height:38px;padding:2px;border:1px solid theme(colors.slate.3);border-radius:.5rem;background-color:#fff;cursor:pointer}.cssgen-stop-pos{width:80px;flex:0 0 auto}.cssgen-unit{color:theme(colors.slate.5);font-size:.875rem}.cssgen-remove{margin-left:auto}.cssgen-remove:disabled{opacity:.4;cursor:not-allowed}.cssgen-shadow-layer{border:1px solid theme(colors.slate.2);border-radius:.5rem;padding:.85rem 1rem;background-color:theme(colors.slate.5);display:flex;flex-direction:column;gap:.6rem}.cssgen-shadow-bottom{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem 1.25rem}.cssgen-inline-field{display:flex;align-items:center;gap:.5rem}.cssgen-opacity-field{flex:1 1 160px}.cssgen-opacity-field input[type=range]{flex:1}.cssgen-code{width:100%;resize:vertical}.cssgen-steps{list-style:decimal;padding-left:1.5rem;display:flex;flex-direction:column;gap:.5rem;color:theme(colors.slate.7);font-size:.95rem}
