.ds-bg{background:radial-gradient(900px 600px at 92% 8%,rgba(0,64,255,.06) 0%,transparent 55%),radial-gradient(700px 500px at 8% 92%,rgba(0,64,255,.04) 0%,transparent 60%),radial-gradient(1200px 600px at 85% -10%,#DCE7F2 0%,transparent 55%),radial-gradient(900px 500px at 5% 110%,#EEF2F5 0%,transparent 50%),linear-gradient(180deg,#f5f6f4,#fbfbfa 60%,#f5f6f4);background-attachment:fixed}.ds-noise:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:1;opacity:.035;mix-blend-mode:multiply;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.7 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}.glass-pill{background:linear-gradient(180deg,#fffffff2,#ffffffb3);border:1px solid rgba(255,255,255,.85);box-shadow:var(--sombra-suave),inset 0 1px #ffffffe6;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.btn-glass-primary{background:linear-gradient(180deg,#fffffff7,#f6f7f5e6,#e8eae6ed);border:1px solid rgba(255,255,255,.8);box-shadow:inset 0 1.5px #fff,inset 0 -1px #1118270d,inset 0 -6px 10px #11182706,0 1px 2px #1118270a,0 4px 12px #1118270d;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);transition:transform .18s ease,box-shadow .18s ease,background .18s ease}.btn-glass-primary:hover{background:linear-gradient(180deg,#fff,#fafbf9f0,#eceeebf5);box-shadow:inset 0 1.5px #fff,inset 0 -1px #1118270d,inset 0 -8px 12px #11182708,0 2px 4px #1118270d,0 6px 18px #11182712;transform:translateY(-1px)}.btn-glass-primary:active{background:linear-gradient(180deg,#eceeebf2,#e4e6e2eb);box-shadow:inset 0 1.5px 3px #11182712,inset 0 1px #ffffff80;transform:translateY(0)}.btn-glass-secondary{background:linear-gradient(180deg,#fffffff0,#ffffffad);border:1px solid var(--border);box-shadow:inset 0 1px #ffffffe6,inset 0 -1px #11182708,0 1px 2px #1118270a,0 3px 8px #1118270a;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);transition:transform .18s ease,box-shadow .18s ease,background .18s ease,border-color .18s}.btn-glass-secondary:hover{background:linear-gradient(180deg,#fffffffa,#ffffffe6);border-color:#c7cbc0;box-shadow:inset 0 1px #fffffff2,inset 0 -1px #11182708,0 2px 4px #1118270d,0 5px 14px #1118270f;transform:translateY(-1px)}.btn-glass-secondary:active{background:#eef2f5e0;border-color:#c7cbc0;box-shadow:inset 0 1.5px 3px #1118270f;transform:translateY(0)}.ds-frame{border-radius:24px;border:2px solid #fff;background:linear-gradient(180deg,var(--humo),var(--niebla));box-shadow:0 0 0 1px var(--border),var(--sombra-elevada);overflow:hidden;aspect-ratio:16/9;position:relative}@keyframes ds-blink{0%,to{opacity:1}50%{opacity:0}}.ds-cursor{display:inline-block;width:2px;height:1.1em;vertical-align:text-bottom;background:var(--foreground);border-radius:1px;animation:ds-blink 1s step-end infinite}.ds-grid>*{min-width:0}.ds-grid{display:grid;gap:1rem;grid-template-columns:1fr;grid-template-areas:"profile" "buttons" "colors" "typography" "icono" "images" "spacing" "inputs" "motion"}@media(min-width:640px){.ds-grid{grid-template-columns:1fr 1fr;grid-template-areas:"profile    buttons" "colors     colors" "typography typography" "icono      icono" "images     images" "spacing    spacing" "inputs     motion"}}@media(min-width:1024px){.ds-grid{grid-template-columns:1fr 1fr 1fr;grid-template-areas:"profile  buttons     typography" "colors   colors      typography" "icono    icono       images" "spacing  inputs      motion"}}.ds-area-profile{grid-area:profile;align-self:start}@media(min-width:640px){.ds-area-profile{align-self:stretch}}.ds-area-buttons{grid-area:buttons}.ds-area-colors{grid-area:colors}.ds-area-typography{grid-area:typography}.ds-area-iconography{grid-area:icono}.ds-area-images{grid-area:images}.ds-area-spacing{grid-area:spacing}.ds-area-inputs{grid-area:inputs}.ds-area-motion{grid-area:motion}.input-glass{width:100%;background:linear-gradient(180deg,#ffffffe6,#ffffffb3);border:1px solid var(--border);box-shadow:inset 0 1.5px 4px #1118270d,inset 0 1px #fffc;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-radius:12px;padding:10px 14px;font-family:var(--font-sans);font-size:13px;color:var(--foreground);outline:none;transition:border-color .18s ease,box-shadow .18s ease}.input-glass::placeholder{color:var(--text-tertiary)}.input-glass:focus{border-color:var(--primary);box-shadow:inset 0 1.5px 4px #1118270a,0 0 0 3px #0040ff1a}.input-glass:disabled{opacity:.45;cursor:not-allowed}.input-glass--error{border-color:#ef4444;box-shadow:inset 0 1.5px 4px #ef44440a,0 0 0 3px #ef44441f}.input-glass--focus{border-color:var(--primary);box-shadow:inset 0 1.5px 4px #1118270a,0 0 0 3px #0040ff1a}@keyframes readcue-shine{0%{text-shadow:0 0 0 transparent;filter:brightness(1)}45%{text-shadow:0 0 10px var(--readcue-glow, rgba(0,64,255,.3));filter:brightness(1.09)}to{text-shadow:0 0 0 transparent;filter:brightness(1)}}.readcue-shine{animation:readcue-shine 1.5s ease-in-out}@media(prefers-reduced-motion:reduce){.readcue-shine{animation:none}}