/* Dulce Hornea — Site launch screen (#sitio).
   Pixel-faithful clone of the openpage-phi prompt UX (dark canvas, green glow,
   1px gradient border, card-lift). Scoped under #main.sl-dark so it never
   leaks into the rest of the dashboard or the public store. */
#main.sl-dark{padding:0;background:#09090b;max-width:none}
#main.sl-dark ~ .demo-footer{display:none}
.sl-stage{position:relative;min-height:calc(100vh - 68px);overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:56px 24px}
.sl-blob{position:absolute;top:30%;left:50%;transform:translate(-50%,-50%);width:700px;height:500px;background:rgba(34,197,94,.07);border-radius:50%;filter:blur(150px);pointer-events:none}
.sl-inner{position:relative;z-index:1;width:100%;display:flex;flex-direction:column;align-items:center}
.sl-h1{font-family:"Space Grotesk",system-ui,-apple-system,sans-serif;font-size:36px;font-weight:700;letter-spacing:-.025em;text-align:center;color:#fafafa;margin:0 0 8px;animation:slFadeInUp .4s cubic-bezier(.16,1,.3,1) both}
.sl-sub{text-align:center;color:#a1a1aa;font-size:14px;line-height:1.5;font-family:"DM Sans",system-ui,-apple-system,sans-serif;margin:0 0 28px;animation:slFadeInUp .4s cubic-bezier(.16,1,.3,1) both;animation-delay:50ms}
.sl-box{width:100%;max-width:680px;border-radius:14px;padding:1px;background:linear-gradient(180deg,#3a3a3f 0%,#2a2a2f 50%,#1f1f24 100%);box-shadow:0 0 60px rgba(34,197,94,.06);transition:box-shadow .3s ease,background .3s ease;animation:slScaleIn .3s cubic-bezier(.16,1,.3,1) both;animation-delay:.1s}
.sl-box:hover,.sl-box:focus-within{background:linear-gradient(180deg,rgba(34,197,94,.25) 0%,rgba(34,197,94,.10) 50%,rgba(34,197,94,.05) 100%);box-shadow:0 0 80px rgba(34,197,94,.10)}
.sl-box textarea{display:block;width:100%;box-sizing:border-box;background:#0f0f12;border:none;border-radius:13px;color:#fafafa;font-size:14px;line-height:1.625;padding:20px 20px 12px;resize:none;outline:none;font-family:"DM Sans",system-ui,-apple-system,sans-serif}
.sl-box textarea::placeholder{color:#52525b}
.sl-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;max-width:680px;margin-top:14px;flex-wrap:wrap}
.sl-chips{display:flex;gap:8px;flex-wrap:wrap}
.sl-chip{padding:3.5px 8.75px;border-radius:9999px;font-size:11px;font-weight:400;color:#52525b;border:1px solid #2a2a2f;background:transparent;cursor:pointer;font-family:"DM Sans",system-ui,-apple-system,sans-serif;transition:color .2s ease,background-color .2s ease,border-color .2s ease}
.sl-chip:hover{color:#fafafa;background:#1e1e23;border-color:#3a3a3f}
.sl-chip:active{transform:scale(.96)}
.sl-generate{display:inline-flex;align-items:center;gap:8px;padding:8.75px 17.5px;border-radius:10.5px;background:#22c55e;color:#000;font-size:13px;font-weight:600;border:none;cursor:pointer;font-family:"DM Sans",system-ui,-apple-system,sans-serif;box-shadow:0 0 20px rgba(34,197,94,.3);transition:background-color .2s ease,box-shadow .2s ease,transform .15s ease}
.sl-generate svg{display:block}
.sl-generate:hover{background:#16a34a;box-shadow:0 0 30px rgba(34,197,94,.4)}
.sl-generate:active{transform:scale(.97)}
.sl-generate:disabled{opacity:.2;cursor:not-allowed;pointer-events:none}
.sl-cards{width:100%;max-width:680px;margin-top:20px;display:grid;grid-template-columns:repeat(4,1fr);gap:10px;animation:slFadeInUp .4s cubic-bezier(.16,1,.3,1) both;animation-delay:.2s}
.sl-card{position:relative;display:flex;flex-direction:column;background:#0f0f12;border:1px solid #2a2a2f;border-radius:12px;padding:14px;text-align:left;cursor:pointer;color:#fafafa;font-family:"DM Sans",system-ui,-apple-system,sans-serif;transition:transform .25s cubic-bezier(.16,1,.3,1),box-shadow .25s cubic-bezier(.16,1,.3,1),border-color .2s ease}
.sl-card:hover{border-color:#3a3a3f;transform:translateY(-4px);box-shadow:0 12px 28px rgba(0,0,0,.35),0 4px 10px rgba(0,0,0,.2),0 0 16px rgba(34,197,94,.06)}
.sl-card:active{transform:translateY(-4px) scale(.97)}
.sl-card h3{font-size:13px;font-weight:600;margin:0 0 4px;color:#fafafa;letter-spacing:-.01em}
.sl-card p{font-size:11px;color:#a1a1aa;margin:0 0 10px;line-height:1.4;flex:1}
.sl-badge{align-self:flex-start;font-size:10px;color:#71717a;border:1px solid #2a2a2f;border-radius:9999px;padding:2px 7px;font-family:"DM Sans",system-ui,sans-serif}
.sl-blank{margin-top:18px;text-align:center;font-size:11px;color:#52525b;font-family:"DM Sans",system-ui,sans-serif}
.sl-blank button{font-size:11px;color:#52525b;background:none;border:none;cursor:pointer;padding:0;font-family:inherit;transition:color .2s ease}
.sl-blank button:hover{color:#a1a1aa}
@media (max-width:740px){
  .sl-h1{font-size:28px}
  .sl-cards{grid-template-columns:repeat(2,1fr)}
  .sl-actions{justify-content:center}
}
@keyframes slFadeInUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@keyframes slScaleIn{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}
@media (prefers-reduced-motion:reduce){
  .sl-h1,.sl-sub,.sl-box,.sl-cards{animation-duration:.001ms;animation-delay:0ms}
  .sl-card,.sl-box,.sl-chip,.sl-generate{transition-duration:.001ms}
}