@keyframes dev-tools-rise{0%{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}.dev-tools-reveal{opacity:0;transform:translateY(14px)}.dev-tools-reveal--in{animation:dev-tools-rise .55s cubic-bezier(.22,1,.36,1) both}.dev-tools-home-wrap{padding:4rem 0;background:linear-gradient(180deg,rgba(15,23,42,.35),rgba(10,10,22,.2))}.dev-tools-home-wrap .container{max-width:72rem;margin-left:auto;margin-right:auto;padding-left:clamp(1rem,3vw,2rem);padding-right:clamp(1rem,3vw,2rem)}.dev-tools--home .dev-tools-header__title{color:var(--text-primary,#f9fafb)}.dev-tools--home .dev-tools-header__lead{color:var(--text-secondary,#94a3b8)}.dev-tools-header{text-align:center;margin-bottom:1.5rem}.dev-tools-header__badge{display:inline-block;margin-bottom:.65rem;padding:.35rem .75rem;border-radius:999px;font-size:.72rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#c7d2fe;border:1px solid rgba(129,140,248,.35);background:rgba(99,102,241,.12)}.dev-tools-header__title{margin:0 0 .5rem;font-size:clamp(1.5rem,4vw,2rem);font-weight:800;letter-spacing:-.03em;color:#f9fafb}.dev-tools-header__lead{margin:0 auto;max-width:40rem;line-height:1.6;color:#94a3b8}.dev-tools-tabs{display:flex;gap:.45rem;margin-bottom:1rem;padding:.35rem;border-radius:.85rem;border:1px solid rgba(129,140,248,.22);background:rgba(15,23,42,.55)}.dev-tools-tabs__btn{flex:1 1;padding:.55rem .75rem;border:none;border-radius:.6rem;background:transparent;color:#94a3b8;font-size:.88rem;font-weight:700;cursor:pointer;transition:background .2s ease,color .2s ease}.dev-tools-tabs__btn--active{color:#fff;background:linear-gradient(135deg,rgba(99,102,241,.55),rgba(79,70,229,.65));box-shadow:0 4px 14px rgba(79,70,229,.25)}.dev-tools-tabs__short{display:none}.dev-tools-grid{display:grid;grid-gap:1rem;gap:1rem}.dev-tools-card{display:none;flex-direction:column;padding:1.1rem 1.15rem 1.2rem;border-radius:1rem;border:1px solid rgba(129,140,248,.22);background:linear-gradient(160deg,rgba(15,23,42,.9),rgba(49,46,129,.18))}.dev-tools-card--active{display:flex}.dev-tools-card__toolbar{display:flex;flex-direction:column;gap:.85rem;margin-bottom:1rem}.dev-tools-card__toolbar--color{gap:1rem}.dev-tools-card__title{margin:0 0 .2rem;font-size:1.02rem;font-weight:800;color:#f9fafb}.dev-tools-card__desc{margin:0;font-size:.86rem;line-height:1.45;color:#94a3b8}.dev-tools-card__head{min-width:0}.dev-tools-panes{display:grid;grid-template-columns:1fr;grid-gap:.85rem;gap:.85rem;flex:1 1;min-height:0}.dev-tools-pane{display:flex;flex-direction:column;min-width:0}.dev-tools-label{display:block;margin-bottom:.35rem;font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#a5b4fc}.dev-tools-textarea{width:100%;min-height:9rem;margin-bottom:0;padding:.75rem .85rem;border-radius:.6rem;border:1px solid rgba(129,140,248,.28);background:rgba(2,6,23,.55);color:#e2e8f0;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.8rem;line-height:1.5;resize:vertical;flex:1 1}.dev-tools-textarea--tall{min-height:11rem}.dev-tools-textarea:focus{outline:none;border-color:rgba(165,180,252,.55);box-shadow:0 0 0 2px rgba(99,102,241,.25)}.dev-tools-textarea--output{background:rgba(0,0,0,.35)}.dev-tools-output-head{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-bottom:.35rem}.dev-tools-output-head .dev-tools-label{margin-bottom:0}.dev-tools-actions{display:flex;flex-wrap:wrap;gap:.45rem}.dev-tools-actions--toolbar{margin-bottom:0}.dev-tools-btn{display:inline-flex;align-items:center;justify-content:center;padding:.48rem .8rem;border-radius:.55rem;font-size:.8rem;font-weight:700;cursor:pointer;border:1px solid transparent;white-space:nowrap;transition:transform .2s ease,background .2s ease}.dev-tools-btn--primary{color:#fff;background:linear-gradient(135deg,#6366f1,#4f46e5);border-color:rgba(165,180,252,.4)}.dev-tools-btn--ghost{color:#c7d2fe;background:rgba(99,102,241,.15);border-color:rgba(129,140,248,.35)}.dev-tools-btn--outline{color:#94a3b8;background:transparent;border-color:rgba(148,163,184,.35)}.dev-tools-btn:hover{transform:translateY(-1px)}.dev-tools-copy{padding:.32rem .65rem;border-radius:.45rem;border:1px solid rgba(129,140,248,.35);background:rgba(99,102,241,.18);color:#e0e7ff;font-size:.72rem;font-weight:700;cursor:pointer}.dev-tools-copy:disabled{opacity:.45;cursor:not-allowed}.dev-tools-check{display:flex;align-items:center;gap:.45rem;font-size:.82rem;color:#94a3b8}.dev-tools-check--inline{margin:0}.dev-tools-status{margin:.65rem 0 0;font-size:.84rem}.dev-tools-status--success{color:#6ee7b7}.dev-tools-status--error{color:#fca5a5}.dev-tools-color-controls{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem}.dev-tools-color-picker{width:2.75rem;height:2.4rem;padding:0;border:none;border-radius:.45rem;cursor:pointer;background:transparent;flex-shrink:0}.dev-tools-hex-input{flex:1 1;min-width:6.5rem;padding:.5rem .7rem;border-radius:.55rem;border:1px solid rgba(129,140,248,.28);background:rgba(2,6,23,.55);color:#e2e8f0;font-family:ui-monospace,monospace;font-size:.82rem}.dev-tools-palette{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-gap:.45rem;gap:.45rem;flex:1 1}.dev-tools-palette__empty{grid-column:1/-1;margin:0;padding:1.25rem;border-radius:.6rem;border:1px dashed rgba(129,140,248,.25);color:#64748b;font-size:.88rem;text-align:center}.dev-tools-swatch{position:relative;min-height:3.5rem;border:1px solid rgba(255,255,255,.15);border-radius:.55rem;cursor:pointer;overflow:hidden;transition:transform .2s ease}.dev-tools-swatch:hover{transform:translateY(-2px)}.dev-tools-swatch__code{position:absolute;left:0;right:0;bottom:0;padding:.2rem .3rem;font-size:.6rem;font-weight:700;color:#fff;background:rgba(0,0,0,.45);text-shadow:0 1px 2px rgba(0,0,0,.6)}.dev-tools-footer{margin-top:1.75rem;text-align:center;color:#94a3b8;font-size:.92rem}.dev-tools-footer__link{color:#a5b4fc;font-weight:600;text-decoration:none}.dev-tools-footer__link:hover{text-decoration:underline}@media (min-width:640px){.dev-tools-panes{grid-template-columns:1fr 1fr}.dev-tools-panes--compact .dev-tools-textarea{min-height:8rem}}@media (min-width:960px){.dev-tools-tabs{display:none}.dev-tools-grid{grid-template-columns:1fr 1fr;grid-template-rows:auto auto;gap:1.1rem;max-width:none}.dev-tools-card{display:flex}.dev-tools-card--json{grid-column:1/-1}.dev-tools-card__toolbar{flex-direction:row;align-items:flex-start;justify-content:space-between;gap:1rem}.dev-tools-card__toolbar--color{flex-wrap:wrap;align-items:center}.dev-tools-card__head{flex:1 1;max-width:22rem}.dev-tools-actions--toolbar{justify-content:flex-end;flex-shrink:0}.dev-tools-color-controls{flex:1 1;justify-content:flex-end;min-width:16rem}.dev-tools-palette{grid-template-columns:repeat(8,minmax(0,1fr))}.dev-tools-swatch{min-height:4.25rem}}@media (min-width:1100px){.dev-tools-textarea--tall{min-height:13rem}}@media (max-width:959px){.dev-tools-tabs__label{display:none}.dev-tools-tabs__short{display:inline}}@media (prefers-reduced-motion:reduce){.dev-tools-reveal,.dev-tools-reveal--in{animation:none;opacity:1;transform:none}.dev-tools-btn:hover,.dev-tools-swatch:hover{transform:none}}