/* FILUXIA ATLAS · HOME ATLAS ENTRY COMPACT R21
   Compact, balanced ATLAS home gateway. Presentation only. */

/* Desktop / tablet landscape */
@media (min-width:901px){
  html body #appScreen #atlasMain .atlas-ai-home-entry{
    position:relative!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 230px!important;
    align-items:center!important;
    align-self:start!important;
    gap:30px!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    margin:14px 0!important;
    padding:22px 26px!important;
    overflow:hidden!important;
    border-radius:24px!important;
    box-sizing:border-box!important;
    background:
      linear-gradient(135deg,color-mix(in srgb,var(--panel) 94%,transparent),color-mix(in srgb,var(--gold,#b38a3b) 5%,var(--panel)))!important;
    box-shadow:0 12px 34px color-mix(in srgb,var(--text) 7%,transparent)!important;
  }

  html body #appScreen #atlasMain .atlas-ai-home-entry::after{
    content:"✦"!important;
    position:absolute!important;
    right:42px!important;
    top:18px!important;
    width:auto!important;
    height:auto!important;
    font-size:3.6rem!important;
    line-height:1!important;
    opacity:.055!important;
    color:var(--accent,var(--gold,#b38a3b))!important;
    transform:none!important;
    pointer-events:none!important;
  }

  html body #appScreen #atlasMain .atlas-ai-home-copy{
    position:relative!important;
    z-index:1!important;
    display:grid!important;
    gap:6px!important;
    min-width:0!important;
    max-width:820px!important;
    margin:0!important;
    padding:0!important;
    align-self:center!important;
  }

  html body #appScreen #atlasMain .atlas-ai-home-copy .eyebrow{
    margin:0!important;
    font-size:.66rem!important;
    line-height:1.15!important;
    letter-spacing:.14em!important;
  }

  html body #appScreen #atlasMain .atlas-ai-home-copy h2{
    margin:0!important;
    max-width:28ch!important;
    font-size:clamp(1.35rem,2vw,1.82rem)!important;
    line-height:1.14!important;
    letter-spacing:-.018em!important;
  }

  html body #appScreen #atlasMain .atlas-ai-home-copy p{
    margin:0!important;
    max-width:70ch!important;
    font-size:.84rem!important;
    line-height:1.5!important;
    color:var(--soft)!important;
  }

  html body #appScreen #atlasMain .atlas-ai-home-prompts{
    display:flex!important;
    flex-wrap:wrap!important;
    gap:6px!important;
    margin:8px 0 0!important;
    padding:0!important;
  }

  html body #appScreen #atlasMain .atlas-ai-home-prompts button{
    min-height:34px!important;
    height:auto!important;
    padding:6px 11px!important;
    border-radius:999px!important;
    font-size:.70rem!important;
    line-height:1.15!important;
    white-space:nowrap!important;
  }

  html body #appScreen #atlasMain #aiButton.atlas-ai-home-open{
    position:relative!important;
    z-index:2!important;
    justify-self:end!important;
    align-self:center!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:8px!important;
    width:220px!important;
    min-width:0!important;
    max-width:220px!important;
    height:48px!important;
    min-height:48px!important;
    max-height:48px!important;
    margin:0!important;
    padding:0 16px!important;
    border-radius:14px!important;
    white-space:nowrap!important;
    font-size:.83rem!important;
    line-height:1!important;
    box-shadow:0 10px 24px color-mix(in srgb,var(--accent,var(--gold,#b38a3b)) 16%,transparent)!important;
  }

  /* The old global button/icon rules could enlarge this star dramatically. */
  html body #appScreen #atlasMain #aiButton.atlas-ai-home-open>span{
    position:static!important;
    display:inline-grid!important;
    place-items:center!important;
    flex:0 0 22px!important;
    width:22px!important;
    min-width:22px!important;
    max-width:22px!important;
    height:22px!important;
    min-height:22px!important;
    max-height:22px!important;
    margin:0!important;
    padding:0!important;
    font-size:.72rem!important;
    line-height:1!important;
    transform:none!important;
    border:1px solid color-mix(in srgb,currentColor 26%,transparent)!important;
    border-radius:50%!important;
    background:color-mix(in srgb,currentColor 7%,transparent)!important;
  }

  html body #appScreen #atlasMain #aiButton.atlas-ai-home-open>b{
    position:static!important;
    display:inline!important;
    margin:0!important;
    padding:0!important;
    font-size:.95rem!important;
    line-height:1!important;
    transform:none!important;
  }
}

/* Narrow desktop / tablet */
@media (min-width:721px) and (max-width:1100px){
  html body #appScreen #atlasMain .atlas-ai-home-entry{
    grid-template-columns:minmax(0,1fr) 200px!important;
    gap:20px!important;
    padding:20px!important;
  }
  html body #appScreen #atlasMain #aiButton.atlas-ai-home-open{
    width:200px!important;
    max-width:200px!important;
  }
  html body #appScreen #atlasMain .atlas-ai-home-copy p{font-size:.81rem!important}
}

/* Mobile: compact stacked card, CTA remains easy to tap. */
@media (max-width:900px){
  html body #appScreen #atlasMain .atlas-ai-home-entry{
    position:relative!important;
    display:grid!important;
    grid-template-columns:1fr!important;
    align-items:start!important;
    gap:11px!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    margin:10px 0!important;
    padding:15px 14px!important;
    border-radius:20px!important;
    overflow:hidden!important;
  }
  html body #appScreen #atlasMain .atlas-ai-home-entry::after{
    right:16px!important;
    top:14px!important;
    font-size:2.5rem!important;
    line-height:1!important;
    opacity:.05!important;
  }
  html body #appScreen #atlasMain .atlas-ai-home-copy{gap:5px!important;min-width:0!important}
  html body #appScreen #atlasMain .atlas-ai-home-copy h2{
    margin:0!important;
    max-width:24ch!important;
    font-size:1.18rem!important;
    line-height:1.17!important;
  }
  html body #appScreen #atlasMain .atlas-ai-home-copy p{
    margin:0!important;
    font-size:.75rem!important;
    line-height:1.45!important;
    display:-webkit-box!important;
    -webkit-line-clamp:3!important;
    -webkit-box-orient:vertical!important;
    overflow:hidden!important;
  }
  html body #appScreen #atlasMain .atlas-ai-home-prompts{
    display:flex!important;
    flex-wrap:nowrap!important;
    gap:6px!important;
    margin:7px 0 0!important;
    overflow-x:auto!important;
    scrollbar-width:none!important;
    -webkit-overflow-scrolling:touch!important;
  }
  html body #appScreen #atlasMain .atlas-ai-home-prompts::-webkit-scrollbar{display:none!important}
  html body #appScreen #atlasMain .atlas-ai-home-prompts button{
    flex:0 0 auto!important;
    min-height:34px!important;
    padding:6px 10px!important;
    font-size:.67rem!important;
    white-space:nowrap!important;
  }
  html body #appScreen #atlasMain #aiButton.atlas-ai-home-open{
    position:relative!important;
    z-index:2!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:8px!important;
    width:100%!important;
    max-width:none!important;
    height:46px!important;
    min-height:46px!important;
    max-height:46px!important;
    margin:0!important;
    padding:0 14px!important;
    border-radius:14px!important;
    font-size:.78rem!important;
  }
  html body #appScreen #atlasMain #aiButton.atlas-ai-home-open>span{
    position:static!important;
    display:inline-grid!important;
    place-items:center!important;
    width:21px!important;
    min-width:21px!important;
    max-width:21px!important;
    height:21px!important;
    min-height:21px!important;
    max-height:21px!important;
    margin:0!important;
    padding:0!important;
    font-size:.68rem!important;
    line-height:1!important;
    border:1px solid color-mix(in srgb,currentColor 26%,transparent)!important;
    border-radius:50%!important;
    background:color-mix(in srgb,currentColor 7%,transparent)!important;
    transform:none!important;
  }
  html body #appScreen #atlasMain #aiButton.atlas-ai-home-open>b{
    position:static!important;
    margin:0!important;
    font-size:.9rem!important;
    line-height:1!important;
    transform:none!important;
  }
}
