/* MyAI Home — real, browser-rendered typography over ORIGINAL (cropped) artwork.
   This stylesheet is intentionally last, scoped to the visible Home page. */
body:has(#home.view:not(.hidden)) #appShell>.side {
  background-image:url('assets/myai-sidebar-art-only.png')!important;
}
body:has(#home.view:not(.hidden)) #appShell>.side>#desktopNav {
  position:relative!important;z-index:1!important;
  margin:0 5%!important;
}
body:has(#home.view:not(.hidden)) #appShell>.side>#desktopNav button {
  display:flex!important;align-items:center!important;
  gap:14px!important;opacity:1!important;visibility:visible!important;
  padding:0 11px!important;border-radius:11px!important;
  background:transparent!important;color:#e4ebf2!important;
  font:500 clamp(12px,1vw,15px)/1.2 Inter,system-ui,-apple-system,sans-serif!important;
  text-align:left!important;white-space:nowrap!important;
  -webkit-font-smoothing:antialiased;
}
body:has(#home.view:not(.hidden)) #appShell>.side>#desktopNav button.active,
body:has(#home.view:not(.hidden)) #appShell>.side>#desktopNav button:hover {
  background:#0a1724!important;color:#fff!important;
}
body:has(#home.view:not(.hidden)) #appShell>.side>#desktopNav button::before {
  content:'◈';display:inline-flex;align-items:center;justify-content:center;
  width:23px;flex:none;font-size:19px;color:#a7b6c1;
}
body:has(#home.view:not(.hidden)) #appShell>.side>#desktopNav button[data-page="home"]::before{content:'⌂';font-size:26px}
body:has(#home.view:not(.hidden)) #appShell>.side>#desktopNav button[data-page="chat"]::before{content:'▤'}
body:has(#home.view:not(.hidden)) #appShell>.side>#desktopNav button[data-page="avatar"]::before{content:'♙'}
body:has(#home.view:not(.hidden)) #appShell>.side>#desktopNav button[data-page="memory"]::before{content:'◇'}
body:has(#home.view:not(.hidden)) #appShell>.side>#desktopNav button[data-page="permissions"]::before{content:'▣'}
body:has(#home.view:not(.hidden)) #appShell>.side>#desktopNav button[data-page="subscription"]::before{content:'▧'}
body:has(#home.view:not(.hidden)) #appShell>.side>#desktopNav button[data-page="audit"]::before{content:'♧'}
body:has(#home.view:not(.hidden)) #appShell>.side>#desktopNav button[data-page="trust"]::before{content:'♢'}
body:has(#home.view:not(.hidden)) #appShell>.side>#desktopNav button[data-page="settings"]::before{content:'⚙'}
body:has(#home.view:not(.hidden)) #appShell>.side>#desktopNav button.active::before{color:#4ce4fa}
#home.view:not(.hidden) .myai-art-stage {
  background-image:url('assets/myai-hero-art-only.png')!important;
  background-size:100% auto!important;
  background-position:center top!important;
  background-repeat:no-repeat!important;
  container-type:inline-size;
}
#home.view:not(.hidden) .myai-live-hero-copy {
  position:absolute;left:0;right:0;top:64.7%;bottom:0;
  display:flex;flex-direction:column;align-items:center;justify-content:flex-start;
  text-align:center;padding:0 1.2%;color:#fff;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,sans-serif;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
#home.view:not(.hidden) .myai-live-hero-copy p,
#home.view:not(.hidden) .myai-live-hero-copy h1 {padding:0;margin:0;max-width:100%}
#home.view:not(.hidden) .myai-live-promise {
  font-size:1.34cqw;font-weight:650;letter-spacing:.37em;color:#d6e0e9;
  line-height:1.45;white-space:nowrap;
}
#home.view:not(.hidden) .myai-live-kicker {
  margin-top:5.5cqw!important;font-size:1.32cqw;font-weight:800;
  letter-spacing:.26em;line-height:1.4;color:#a8e5e9;white-space:nowrap;
}
#home.view:not(.hidden) .myai-live-hero-copy h1 {
  margin-top:1.1cqw!important;font-size:4.42cqw;font-weight:800;
  letter-spacing:-.04em;line-height:1.12;color:#fff;white-space:nowrap;
}
#home.view:not(.hidden) .myai-live-subtitle {
  margin-top:1.1cqw!important;font-size:1.72cqw;font-weight:400;
  line-height:1.3;color:#d4dbe2;white-space:nowrap;
}
#home.view:not(.hidden) .myai-art-search {box-shadow:0 0 9px #00cfff22!important}
#home.view:not(.hidden) .myai-art-features button {background:#07111c!important}
@media(max-width:700px){
 #home.view:not(.hidden) .myai-live-promise{letter-spacing:.22em}
 #home.view:not(.hidden) .myai-live-kicker{letter-spacing:.14em}
}

/* MYAI approved layout step 1: window fit and aligned top edge. */
body:has(#home.view:not(.hidden)) #appShell.shell {
  align-items:start!important;min-height:100dvh!important;
}
#home.view:not(.hidden),
#home.view:not(.hidden) .myai-art-home {
  min-height:100dvh!important;
}
#home.view:not(.hidden) .myai-art-home {
  padding-bottom:0!important;
}
#home.view:not(.hidden) .q-sol-panel {
  margin-top:0!important;top:0!important;border-radius:0 0 20px 20px!important;
}
#home.view:not(.hidden) .myai-art-stage {
  /* Remove the narrow remnant along the upper edge of the artwork. */
  background-position:center -8px!important;
}
@media(min-width:1051px) {
  #home.view:not(.hidden) .myai-art-main {
    width:100%!important;
    max-width:clamp(440px,calc(171.7dvh - 515.1px),100%)!important;
    margin-inline:auto!important;
  }
  #home.view:not(.hidden) .q-sol-panel {
    max-height:100dvh!important;overflow-y:auto!important;
  }
  #home.view:not(.hidden) .myai-art-features button {
    min-height:104px!important;
  }
  #home.view:not(.hidden) .myai-art-footer {
    margin:12px!important;
  }
}
@media(max-width:1050px) {
  #home.view:not(.hidden) .q-sol-panel {
    margin-top:12px!important;border-radius:20px!important;
  }
}

/* Step 1 correction: hide the three pale rows baked into the sidebar PNG. */
body:has(#home.view:not(.hidden)) #appShell>.side {
  background-position:center -3px!important;
  background-size:100% calc(100% + 3px)!important;
}

/* MYAI front reference: aligned, coloured feature cards and discovery artwork. */
#home.view:not(.hidden) .myai-art-features button {
 display:flex!important;flex-direction:column!important;align-items:center!important;
 justify-content:flex-start!important;text-align:center!important;
 min-height:142px!important;padding:12px 9px!important;
 color:#edf9ff!important;border-color:var(--card-color)!important;
 background:radial-gradient(ellipse at 50% 0%,var(--card-glow),transparent 80%),#030911!important;
 box-shadow:inset 0 0 18px var(--card-glow)!important;
}
#home.view:not(.hidden) .myai-art-features button:nth-child(1){--card-color:#008fcc;--card-glow:#008cff25;--icon-color:#55dcff}
#home.view:not(.hidden) .myai-art-features button:nth-child(2){--card-color:#009a79;--card-glow:#00d59e25;--icon-color:#67ffd2}
#home.view:not(.hidden) .myai-art-features button:nth-child(3){--card-color:#6250d9;--card-glow:#6848ff35;--icon-color:#b9a5ff}
#home.view:not(.hidden) .myai-art-features button:nth-child(4){--card-color:#b9780a;--card-glow:#e48a0025;--icon-color:#ffc47a}
#home.view:not(.hidden) .myai-art-features button::before {
 content:''!important;display:block!important;width:34px!important;height:34px!important;
 margin:0 auto 8px!important;background:var(--icon-color)!important;
 mask:var(--card-icon) center/contain no-repeat;-webkit-mask:var(--card-icon) center/contain no-repeat;
 filter:drop-shadow(0 0 6px var(--icon-color));flex:none!important;
}
#home.view:not(.hidden) .myai-art-features b {
 color:#eef8ff!important;font-size:clamp(10px,1vw,14px)!important;
 line-height:1.25!important;letter-spacing:.07em!important;min-height:18px!important;
}
#home.view:not(.hidden) .myai-art-features small {
 margin-top:6px!important;font-size:clamp(11px,.85vw,13px)!important;line-height:1.45!important;
}
#home.view:not(.hidden) .myai-art-sponsored {
 position:relative!important;aspect-ratio:1630/150!important;min-height:0!important;
 padding:0!important;overflow:hidden!important;border:1px solid #00bdad!important;
 background:#030b13 url('assets/myai-discovery-reference.png') center 89.115%/117.424% auto no-repeat!important;
 box-shadow:0 0 12px #00d9d922!important;
}
#home.view:not(.hidden) .myai-art-sponsored>span {
 position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip-path:inset(50%)!important;
}
#home.view:not(.hidden) .myai-art-sponsored>button {
 position:absolute!important;right:1.8%!important;top:27%!important;width:18.3%!important;height:47%!important;
 padding:0!important;background:transparent!important;color:transparent!important;border:0!important;
}
#home.view:not(.hidden) .myai-art-sponsored>button:focus-visible {
 outline:3px solid white!important;outline-offset:2px!important;
}
@media(min-width:1051px){
 #home.view:not(.hidden) .myai-art-main {max-width:clamp(440px,calc(171.7dvh - 600px),100%)!important;}
}
@media(max-width:700px){
 #home.view:not(.hidden) .myai-art-sponsored {aspect-ratio:auto!important;min-height:110px!important;background:#03111b!important;padding:14px!important;}
 #home.view:not(.hidden) .myai-art-sponsored>span {position:static!important;width:auto!important;height:auto!important;clip-path:none!important;}
 #home.view:not(.hidden) .myai-art-sponsored>button {position:static!important;width:auto!important;height:auto!important;padding:10px 16px!important;background:#08dbca!important;color:#001619!important;}
}

#home.view:not(.hidden) .myai-art-features button:nth-child(1){--card-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2048%2048%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2224%22%20cy%3D%2224%22%20r%3D%2218%22/%3E%3Cellipse%20cx%3D%2224%22%20cy%3D%2224%22%20rx%3D%228%22%20ry%3D%2218%22/%3E%3Cpath%20d%3D%22M6%2024h36M9%2014h30M9%2034h30%22/%3E%3C/svg%3E");}

#home.view:not(.hidden) .myai-art-features button:nth-child(2){--card-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2048%2048%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M24%204l16%206v12c0%2012-16%2022-16%2022S8%2034%208%2022V10z%22/%3E%3Cpath%20d%3D%22M16%2023l6%206%2011-13%22/%3E%3C/svg%3E");}

#home.view:not(.hidden) .myai-art-features button:nth-child(3){--card-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2048%2048%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%2210%22%20y%3D%2221%22%20width%3D%2228%22%20height%3D%2222%22%20rx%3D%223%22/%3E%3Cpath%20d%3D%22M16%2021v-9a8%208%200%200116%200v9M24%2030v6%22/%3E%3C/svg%3E");}

#home.view:not(.hidden) .myai-art-features button:nth-child(4){--card-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2048%2048%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2224%22%20cy%3D%229%22%20r%3D%225%22/%3E%3Ccircle%20cx%3D%229%22%20cy%3D%2237%22%20r%3D%225%22/%3E%3Ccircle%20cx%3D%2239%22%20cy%3D%2237%22%20r%3D%225%22/%3E%3Cpath%20d%3D%22M21%2014L12%2032M27%2014l9%2018M14%2037h20%22/%3E%3C/svg%3E");}

/* MYAI fit step 3: fill the desktop window down to a shared lower edge. */
@media(min-width:1051px){
 #home.view:not(.hidden) .myai-art-home {align-items:start!important;}
 #home.view:not(.hidden) .myai-art-main {
  display:flex!important;flex-direction:column!important;justify-content:space-between!important;
  min-height:100dvh!important;padding-bottom:12px!important;box-sizing:border-box!important;
 }
 #home.view:not(.hidden) .myai-art-main>* {flex-shrink:0!important;}
 #home.view:not(.hidden) .q-sol-panel {
  min-height:calc(100dvh - 12px)!important;box-sizing:border-box!important;
 }
 #home.view:not(.hidden) .q-sol-portrait {
  height:clamp(170px,25dvh,280px)!important;
 }
}

/* Sol panel: professional text and individually spaced voice controls. */
#home.view:not(.hidden) .q-sol-panel {
 font-family:Inter,ui-sans-serif,system-ui,-apple-system,sans-serif!important;
 font-size:13px!important;line-height:1.5!important;color:#dce8f2!important;
}
#home.view:not(.hidden) .q-sol-panel .q-sol-head strong {font-size:22px!important;line-height:1.2!important;}
#home.view:not(.hidden) .q-sol-panel .q-sol-head span {font-size:12px!important;color:#a5bdcc!important;}
#home.view:not(.hidden) .q-sol-panel .q-sol-message p {font-size:13px!important;line-height:1.6!important;}
#home.view:not(.hidden) .q-sol-panel>label {
 display:flex!important;align-items:center!important;gap:9px!important;
 margin:10px 0 0!important;padding:9px 10px!important;
 border:1px solid #183b4b!important;border-radius:10px!important;
 background:#06121c!important;font-size:12px!important;font-weight:500!important;
 line-height:1.5!important;color:#e1eef5!important;cursor:pointer!important;
}
#home.view:not(.hidden) .q-sol-panel>label input {
 margin:0!important;width:15px!important;height:15px!important;flex:0 0 15px!important;
 accent-color:#0edbc8!important;cursor:pointer!important;
}
#home.view:not(.hidden) #qHandsStop,
#home.view:not(.hidden) #qSolVoiceTest {
 display:block!important;width:100%!important;min-height:34px!important;
 margin:7px 0 0!important;padding:7px 12px!important;
 border:1px solid #245267!important;border-radius:9px!important;
 background:#0a1c2b!important;color:#ccebf5!important;
 font:600 12px/1.5 Inter,system-ui,sans-serif!important;cursor:pointer!important;
}
#home.view:not(.hidden) #qHandsStop:hover,
#home.view:not(.hidden) #qSolVoiceTest:hover {background:#123146!important;border-color:#19c7c4!important;}
#home.view:not(.hidden) #qHandsStop:focus-visible,
#home.view:not(.hidden) #qSolVoiceTest:focus-visible {outline:2px solid #26e3d4!important;outline-offset:2px!important;}
#home.view:not(.hidden) #qAvatarStatus,
#home.view:not(.hidden) #qHandsStatus {
 margin:10px 0 0!important;padding:0 0 0 9px!important;
 border-left:2px solid #225466!important;font-size:12px!important;line-height:1.5!important;
 color:#b3cbd9!important;overflow-wrap:anywhere!important;
}
#home.view:not(.hidden) #qSolMicStatus {
 margin:12px 0 0!important;font-size:11px!important;line-height:1.55!important;
 color:#91aab9!important;overflow-wrap:anywhere!important;
}
#home.view:not(.hidden) .q-sol-panel>small {
 display:block!important;margin-top:14px!important;padding-top:12px!important;
 border-top:1px solid #173343!important;text-align:center!important;
 font-size:10px!important;line-height:1.5!important;color:#91adbc!important;
}