:root{
    --bg0: rgba(10, 14, 22, 0.88);
    --glass: rgba(255,255,255,0.08);
    --glass2: rgba(255,255,255,0.06);
    --stroke: rgba(255,255,255,0.14);
    --stroke2: rgba(255,255,255,0.10);
    --text: rgba(255,255,255,0.92);
    --muted: rgba(255,255,255,0.62);
    --muted2: rgba(255,255,255,0.45);
    --shadow: 0 22px 70px rgba(0,0,0,0.55);
    --shadow2: 0 10px 30px rgba(0,0,0,0.35);
    --r: 22px;
    --ray-window-grad-a: rgba(7,11,18,0.98);
    --ray-window-grad-b: rgba(10,14,24,0.96);
    --ray-window-grad-c: rgba(7,11,18,0.98);
    --ray-screen-bg: rgba(27, 45, 74, 0.997);
    --ray-eq-1: rgba(94,245,255,0.95);
    --ray-eq-2: rgba(73,130,255,0.95);
    --ray-eq-3: rgba(255,92,176,0.92);
  }
  
  *{ box-sizing:border-box; }
  html, body {
    height: 100%;
    min-height: 100svh;
    min-height: 100dvh;
    margin: 0;
    background:
      radial-gradient(1200px 800px at 50% 0%, rgba(60,90,180,0.25), rgba(0,0,0,0.92)),
      linear-gradient(90deg, var(--ray-window-grad-a), var(--ray-window-grad-b) 50%, var(--ray-window-grad-c));
    overflow: hidden;
    font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;
    color: var(--text);
  }

  .device{
    min-height: 100svh;
    min-height: 100dvh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding:
      max(18px, env(safe-area-inset-top))
      max(18px, env(safe-area-inset-right))
      max(18px, env(safe-area-inset-bottom))
      max(18px, env(safe-area-inset-left));
  }
  .device-frame{
    width: 420px;
    height: 760px;
    border-radius: 38px;
    padding: 6px;
    background: linear-gradient(180deg, rgba(255,255,255,0.14), rgba(255,255,255,0.06));
    border: 1px solid rgba(255, 255, 255, 0.428);
    box-shadow:
      0 40px 120px rgba(0,0,0,0.65),
      0 0 0 1px rgba(255,255,255,0.06) inset,
      -10px -10px 30px rgba(255,255,255,0.06),
      18px 22px 50px rgba(0,0,0,0.35);
    position: relative;
  }
  .device-frame:before{
    content:"";
    position:absolute;
    inset: 8px;
    border-radius: 30px;
    pointer-events:none;
    background: radial-gradient(500px 220px at 18% 10%, rgba(255,255,255,0.18), transparent 60%);
    opacity: .85;
  }

  .device-screen{
    width: 100%;
    height: 100%;
    min-height: 0;
    border-radius: 30px;
    overflow: hidden;
    background: color-mix(in srgb, var(--ray-screen-bg) 72%, transparent);
    border: 1px solid rgba(255, 255, 255, 0.37);
    backdrop-filter: blur(26px);
    -webkit-backdrop-filter: blur(26px);
    box-shadow:
      inset 0 0 0 1px rgba(0,0,0,0.28),
      inset 0 0 0 1px rgba(255,255,255,0.05);
    position: relative;
  }
  .device-screen::before{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    opacity:0;
    z-index:0;
  }

  .raydeo{
    position:relative;
    width:100%;
    height:100%;
    display:flex;
    flex-direction:column;
    min-height:0;
    isolation:isolate;
    z-index:1;
  }

  .device-screen .raydeo{
    height: 100%;
    min-height: 0;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    padding: 12px;
  }

  html[data-raydeo-weather="clear_night"] .device-screen::before{
    opacity:1;
    background:
      radial-gradient(96px 96px at var(--ray-moon-x, 16%) var(--ray-moon-y, 14%), rgba(255,244,214,0.62), rgba(255,240,210,0.24) 45%, transparent 70%),
      radial-gradient(56px 56px at var(--ray-moon-x, 16%) var(--ray-moon-y, 14%), rgba(255,255,255,0.9), rgba(255,255,255,0.16) 58%, transparent 75%),
      radial-gradient(2.8px 2.8px at 12% 22%, rgba(255,255,255,0.98), transparent 60%),
      radial-gradient(2.8px 2.8px at 28% 68%, rgba(200,230,255,0.95), transparent 60%),
      radial-gradient(2.6px 2.6px at 76% 32%, rgba(255,255,255,0.95), transparent 60%),
      radial-gradient(2.6px 2.6px at 68% 78%, rgba(190,220,255,0.9), transparent 60%),
      radial-gradient(3px 3px at 40% 40%, rgba(255,255,255,1), transparent 60%),
      radial-gradient(2.6px 2.6px at 58% 18%, rgba(210,235,255,0.96), transparent 60%),
      radial-gradient(2.8px 2.8px at 82% 55%, rgba(255,255,255,0.94), transparent 60%),
      radial-gradient(2.6px 2.6px at 8% 52%, rgba(210,235,255,0.9), transparent 60%),
      radial-gradient(2.6px 2.6px at 22% 42%, rgba(255,255,255,0.9), transparent 60%),
      radial-gradient(2.6px 2.6px at 34% 18%, rgba(210,230,255,0.88), transparent 60%),
      radial-gradient(2.8px 2.8px at 46% 72%, rgba(255,255,255,0.94), transparent 60%),
      radial-gradient(2.4px 2.4px at 54% 52%, rgba(200,230,255,0.86), transparent 60%),
      radial-gradient(2.6px 2.6px at 64% 12%, rgba(255,255,255,0.9), transparent 60%),
      radial-gradient(2.6px 2.6px at 74% 66%, rgba(230,245,255,0.9), transparent 60%),
      radial-gradient(2.8px 2.8px at 88% 42%, rgba(255,255,255,0.96), transparent 60%),
      radial-gradient(2.4px 2.4px at 92% 72%, rgba(200,230,255,0.86), transparent 60%),
      radial-gradient(2.6px 2.6px at 16% 82%, rgba(255,255,255,0.9), transparent 60%),
      radial-gradient(2.8px 2.8px at 36% 86%, rgba(255,255,255,0.94), transparent 60%),
      radial-gradient(2.6px 2.6px at 58% 86%, rgba(210,235,255,0.9), transparent 60%),
      radial-gradient(2.6px 2.6px at 70% 88%, rgba(255,255,255,0.9), transparent 60%),
      radial-gradient(2.4px 2.4px at 84% 88%, rgba(230,245,255,0.88), transparent 60%),
      radial-gradient(320px 320px at 15% 18%, rgba(220,230,255,0.32), transparent 60%),
      radial-gradient(260px 260px at 84% 16%, rgba(90,130,255,0.28), transparent 65%),
      radial-gradient(360px 300px at 50% 80%, rgba(30,60,140,0.36), transparent 72%),
      radial-gradient(600px 480px at 50% 120%, rgba(0,0,0,0.45), transparent 70%);
    mix-blend-mode: screen;
  }

  html[data-raydeo-weather="partly_night"] .device-screen::before{
    opacity:0.85;
    background:
      radial-gradient(84px 84px at var(--ray-moon-x, 16%) var(--ray-moon-y, 14%), rgba(245,238,210,0.52), rgba(255,250,235,0.16) 50%, transparent 75%),
      radial-gradient(2.4px 2.4px at 18% 26%, rgba(240,246,255,0.9), transparent 60%),
      radial-gradient(2.2px 2.2px at 62% 18%, rgba(200,226,255,0.86), transparent 60%),
      radial-gradient(2.2px 2.2px at 72% 66%, rgba(255,255,255,0.84), transparent 60%),
      radial-gradient(2.2px 2.2px at 28% 58%, rgba(230,245,255,0.86), transparent 60%),
      radial-gradient(2.2px 2.2px at 42% 36%, rgba(255,255,255,0.88), transparent 60%),
      radial-gradient(2.2px 2.2px at 56% 78%, rgba(210,235,255,0.86), transparent 60%),
      radial-gradient(2.2px 2.2px at 82% 44%, rgba(255,255,255,0.88), transparent 60%),
      radial-gradient(2.2px 2.2px at 12% 74%, rgba(210,230,255,0.82), transparent 60%),
      radial-gradient(260px 200px at 20% 20%, rgba(200,220,255,0.24), transparent 62%),
      radial-gradient(320px 240px at 78% 32%, rgba(50,90,200,0.24), transparent 70%);
    mix-blend-mode: screen;
  }

  html[data-raydeo-weather="cloudy_night"] .device-screen::before{
    opacity:0.6;
    background:
      radial-gradient(1.4px 1.4px at 22% 30%, rgba(220,230,255,0.8), transparent 60%),
      radial-gradient(1.4px 1.4px at 64% 24%, rgba(200,220,255,0.76), transparent 60%),
      radial-gradient(220px 200px at 50% 22%, rgba(170,190,230,0.2), transparent 68%),
      radial-gradient(300px 240px at 58% 70%, rgba(40,60,120,0.24), transparent 72%);
    mix-blend-mode: screen;
  }

  html[data-raydeo-weather="clear"] .device-screen::before{
    opacity:0.5;
    background:
      radial-gradient(160px 120px at 12% 12%, rgba(255,220,140,0.22), transparent 65%),
      radial-gradient(260px 180px at 82% 6%, rgba(140,190,255,0.2), transparent 70%),
      radial-gradient(420px 240px at 50% 95%, rgba(255,170,120,0.14), transparent 70%);
    mix-blend-mode: screen;
  }

  html[data-raydeo-weather="partly"] .device-screen::before{
    opacity:0.48;
    background:
      radial-gradient(220px 160px at 18% 14%, rgba(255,220,150,0.18), transparent 65%),
      radial-gradient(280px 180px at 68% 18%, rgba(190,210,255,0.2), transparent 70%),
      radial-gradient(380px 260px at 50% 92%, rgba(140,170,220,0.16), transparent 72%);
    mix-blend-mode: screen;
  }

  html[data-raydeo-weather="cloudy"] .device-screen::before{
    opacity:0.34;
    background:
      radial-gradient(260px 200px at 20% 22%, rgba(200,210,230,0.16), transparent 70%),
      radial-gradient(320px 220px at 76% 26%, rgba(170,190,220,0.18), transparent 72%),
      radial-gradient(420px 260px at 50% 90%, rgba(120,140,180,0.14), transparent 74%);
    mix-blend-mode: screen;
  }

  html[data-raydeo-weather="rain"] .device-screen::before{
    opacity:0.55;
    background:
      linear-gradient(120deg, rgba(80,120,200,0.25) 0%, rgba(20,40,90,0.05) 50%, rgba(80,120,200,0.22) 100%),
      repeating-linear-gradient(120deg, rgba(150,200,255,0.12) 0 1px, transparent 1px 10px),
      radial-gradient(260px 220px at 60% 20%, rgba(120,160,220,0.18), transparent 70%);
    mix-blend-mode: screen;
  }

  html[data-raydeo-weather="storm"] .device-screen::before{
    opacity:0.65;
    background:
      radial-gradient(240px 220px at 70% 22%, rgba(180,200,255,0.18), transparent 70%),
      linear-gradient(100deg, rgba(120,160,255,0.18) 0%, rgba(20,30,60,0.04) 55%, rgba(120,160,255,0.16) 100%),
      linear-gradient(115deg, rgba(255,255,255,0.14) 0 6px, transparent 6px 100%);
    mix-blend-mode: screen;
  }

  html[data-raydeo-weather="snow"] .device-screen::before{
    opacity:0.52;
    background:
      radial-gradient(1.2px 1.2px at 18% 28%, rgba(255,255,255,0.7), transparent 60%),
      radial-gradient(1px 1px at 62% 22%, rgba(255,255,255,0.65), transparent 60%),
      radial-gradient(1.3px 1.3px at 72% 66%, rgba(255,255,255,0.6), transparent 60%),
      radial-gradient(260px 180px at 50% 12%, rgba(210,220,240,0.2), transparent 70%);
    mix-blend-mode: screen;
  }

  html[data-raydeo-weather="fog"] .device-screen::before{
    opacity:0.35;
    background:
      radial-gradient(280px 200px at 40% 20%, rgba(210,210,220,0.18), transparent 70%),
      radial-gradient(320px 220px at 70% 40%, rgba(190,200,210,0.16), transparent 72%),
      radial-gradient(420px 280px at 50% 85%, rgba(150,160,170,0.14), transparent 74%);
    mix-blend-mode: screen;
  }

  @media (max-width: 520px){
    .device{
      padding:
        max(10px, env(safe-area-inset-top))
        max(10px, env(safe-area-inset-right))
        max(10px, env(safe-area-inset-bottom))
        max(10px, env(safe-area-inset-left));
    }
    .device-frame{
      width: min(420px, calc(100vw - 20px));
      width: min(420px, calc(100svw - 20px));
      width: min(420px, calc(100dvw - 20px));
      height: min(760px, calc(100vh - 20px));
      height: min(760px, calc(100svh - 20px));
      height: min(760px, calc(100dvh - 20px));
      border-radius: 32px;
      padding: 5px;
    }
    .device-frame::before{
      inset: 6px;
      border-radius: 27px;
    }
    .device-screen{
      border-radius: 26px;
    }
    .device-screen .raydeo{
      padding: 10px;
    }
  }
  
  /* Ambient background */
  .ray-bg{ position:absolute; inset:0; overflow:hidden; pointer-events:none; z-index:0; }
  .raydeo > *:not(.ray-bg){
    position:relative;
    z-index:1;
  }
  .ray-noise{
    position:absolute; inset:-40px;
    /* background-image: url("assets/noise.png"); */
    background-size: 240px 240px;
    opacity: 0.10;
    filter: contrast(110%);
    animation: drift 10s linear infinite;
  }
  .ray-glow{
    position:absolute; inset:-100px;
    /* background-image: url("assets/glow.png"); */
    background-size: cover;
    background-position:center;
    opacity: 0.22;
    filter: blur(2px) saturate(120%);
    animation: breathe 5.5s ease-in-out infinite;
  }
  .ray-vignette{
    position:absolute; inset:0;
    background: radial-gradient(1200px 700px at 50% 10%, rgba(255,255,255,0.04), rgba(0,0,0,0.42));
  }
  
  /* Device */
  .device-screen::before{
    content:"";
    position:absolute;
    inset:0;
    border-radius: inherit;
    pointer-events:none;
    background:
      radial-gradient(420px 240px at 14% 10%, rgba(255,255,255,0.12), rgba(255,255,255,0.04) 36%, transparent 68%),
      repeating-linear-gradient(135deg, rgba(255,255,255,0.04) 0 2px, rgba(255,255,255,0.00) 2px 6px);
    opacity: 0.9;
  }
  .device-screen::after{
    content:"";
    position:absolute;
    inset:0;
    border-radius: inherit;
    pointer-events:none;
    background: radial-gradient(140% 120% at 50% 18%, transparent 42%, rgba(0,0,0,0.08) 74%, rgba(0,0,0,0.16) 100%);
  }
  
  /* Header */
  .top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding-bottom: 0;
  }
  .header-spacer-card{
    margin-top: 14px;
    flex: 0 0 64px;
    height: 64px;
    min-height: 64px;
    border-radius: 8px;
    background: linear-gradient(135deg, rgba(6,12,26,0.96), rgba(10,18,36,0.92));
    border: .05px solid rgba(255, 255, 255, 0.464);
    box-shadow: 0 12px 28px rgba(0,0,0,0.18);
    position: relative;
    overflow: hidden;
    display:block;
    text-decoration:none;
    color:inherit;
    cursor:pointer;
    user-select:none;
    -webkit-user-select:none;
    -webkit-touch-callout:none;
    touch-action: pan-y;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
  }
  .header-spacer-card:hover{
    transform: translateY(-1px);
    box-shadow: 0 14px 32px rgba(0,0,0,0.22);
    border-color: rgba(255,255,255,0.18);
  }
  .header-spacer-card:active{
    transform: translateY(0);
  }
  .header-spacer-card::before{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background:
      linear-gradient(180deg, rgba(255,255,255,0.08), rgba(255,255,255,0.00) 26%, rgba(255,255,255,0.00));
    opacity: 0.45;
  }
  .header-spacer-card::after{
    content:"";
    position:absolute;
    inset:0;
    border-radius: inherit;
    pointer-events:none;
    background:
      linear-gradient(90deg, rgba(255,255,255,0.00), rgba(255,255,255,0.04) 46%, rgba(255,255,255,0.10));
    opacity:0.38;
  }
  .header-spacer-carousel{
    position:relative;
    width:100%;
    height:100%;
    overflow:hidden;
    z-index:1;
  }
  .header-spacer-track{
    display:flex;
    width:100%;
    height:100%;
    will-change:transform;
  }
  .header-spacer-slide{
    position:relative;
    flex:0 0 100%;
    width:100%;
    height:100%;
    overflow:hidden;
  }
  .header-spacer-media,
  .header-spacer-video{
    position:absolute;
    inset:0;
  }
  .header-spacer-media--image{
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
    background: linear-gradient(135deg, rgba(7,11,20,0.92), rgba(15,19,32,0.86));
  }
  .header-spacer-media--image img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position: 50% 50%;
    display:block;
    transform: translate3d(0,0,0);
    animation: none;
  }
  .header-spacer-video{
    display:block;
    overflow:hidden;
  }
  .header-spacer-video video{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position: 50% 50%;
    display:block;
    background: linear-gradient(135deg, rgba(7,11,20,0.92), rgba(15,19,32,0.86));
  }
  .header-spacer-live{
    position:absolute;
    inset:0;
    display:flex;
    align-items:stretch;
    justify-content:stretch;
    overflow:hidden;
    background:
      radial-gradient(circle at 18% 20%, rgba(255,104,125,0.22), transparent 36%),
      linear-gradient(135deg, rgba(9,16,31,0.96), rgba(18,28,49,0.92));
  }
  .header-spacer-live__image{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:50% 50%;
    opacity:.72;
    filter:saturate(1.04) contrast(1.04);
  }
  .header-spacer-live__copy{
    position:relative;
    z-index:1;
    display:grid;
    align-content:center;
    gap:2px;
    width:100%;
    min-width:0;
    padding:8px 10px;
    background:linear-gradient(90deg, rgba(3,7,18,.84), rgba(3,7,18,.34) 72%, rgba(3,7,18,.12));
  }
  .header-spacer-live__label{
    color:#fda4af;
    font-size:8px;
    font-weight:800;
    letter-spacing:.11em;
    text-transform:uppercase;
    line-height:1;
  }
  .header-spacer-live__headline{
    color:#f8fbff;
    font-size:13px;
    line-height:1.08;
    max-width:76%;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .header-spacer-live__supporting{
    color:rgba(219,234,254,.82);
    font-size:9px;
    line-height:1.15;
    max-width:82%;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .header-spacer-live__cta{
    justify-self:start;
    margin-top:2px;
    padding:3px 7px;
    border-radius:999px;
    color:#eef7ff;
    font-size:8px;
    font-weight:800;
    background:rgba(255,255,255,.14);
    border:1px solid rgba(255,255,255,.18);
  }
  .header-spacer-card[data-dragging="true"]{
    cursor:grabbing;
  }
  .brand{ display:flex; align-items:center; gap:10px; min-width:0; flex:1 1 auto; }
  .top-actions{
    display:flex;
    align-items:center;
    gap:10px;
    flex:0 0 auto;
  }
  .brand-text{
    position:relative;
    min-width:0;
  }
  .brand-text::after{
    content:"";
    position:absolute;
    left:50%;
    width: 220px;
    bottom: -9px;
    height:1.5px;
    transform: translateX(-50%);
    border-radius:999px;
    background: linear-gradient(90deg, rgba(255,255,255,0.00), rgba(124,190,255,0.56) 24%, rgba(255,255,255,0.92) 52%, rgba(255,120,198,0.52) 80%, rgba(255,255,255,0.00));
    box-shadow: 0 0 12px rgba(132,195,255,0.18);
    opacity:0.9;
  }
  .logo{
    width:38px; height:38px;
    border-radius: 12px;
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.10);
    display:flex; align-items:center; justify-content:center;
    overflow:hidden;
  }
  .logo img{ width:46px; height:46px; opacity:0.92; }
  .brand-text .name-row{
    display:flex;
    align-items:center;
    gap:8px;
  }
  .brand-text .name{
    font-weight:700;
    letter-spacing:0.6px;
    font-size: 15px;
    line-height: 1.1;
  }
  .brand-region{
    display:flex;
    align-items:center;
    gap:5px;
    min-width:0;
    font-size: 11px;
    color: rgba(255,255,255,0.78);
    letter-spacing: 0.15px;
  }
  .brand-region-sep{
    color: rgba(255,255,255,0.42);
  }
  .brand-region #pillLocation{
    display:block;
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    max-width: 92px;
  }
  .header-weather{
    display:flex;
    align-items:center;
    gap:6px;
    padding:6px 9px;
    border-radius: 999px;
    border:1px solid rgba(255,255,255,0.14);
    background: rgba(255,255,255,0.06);
    color: rgba(240,248,255,0.92);
    font-size: 11px;
    letter-spacing: 0.2px;
    box-shadow: 0 8px 18px rgba(0,0,0,0.3);
  }
  .header-weather .weather-icon{
    font-size: 13px;
    line-height: 1;
  }
  .header-weather .weather-temp{
    font-weight: 700;
  }
  .brand-eq{
    display:flex;
    align-items:flex-end;
    gap:3px;
    height:16px;
    padding-bottom: 1px;
  }
  .brand-eq .eq-bar{
    width:3px;
    height:100%;
    border-radius:999px;
    background: linear-gradient(180deg, var(--ray-eq-1), var(--ray-eq-2) 55%, var(--ray-eq-3));
    box-shadow: 0 0 10px rgba(94,245,255,0.24);
    opacity:0.48;
    transform-origin:center bottom;
    transform: scaleY(var(--eq-level, 0.16));
    transition: transform 72ms linear, opacity .18s ease, box-shadow .18s ease, background .18s ease;
  }
  .brand-eq .eq-bar:nth-child(1){ --eq-level: 0.14; }
  .brand-eq .eq-bar:nth-child(2){ --eq-level: 0.2; }
  .brand-eq .eq-bar:nth-child(3){ --eq-level: 0.3; }
  .brand-eq .eq-bar:nth-child(4){ --eq-level: 0.18; }
  .brand-eq .eq-bar:nth-child(5){ --eq-level: 0.26; }
  .brand-eq .eq-bar:nth-child(6){ --eq-level: 0.17; }
  .brand-eq .eq-bar:nth-child(7){ --eq-level: 0.12; }
  html[data-raydeo-playback="playing"] .brand-eq .eq-bar{
    opacity:0.96;
    box-shadow: 0 0 12px rgba(94,245,255,0.26);
  }
  html[data-raydeo-eq-style="pulse"] .brand-eq .eq-bar{
    width:4px;
    border-radius: 3px;
    background: linear-gradient(180deg, rgba(255,226,98,0.96), rgba(255,136,69,0.94) 56%, rgba(255,74,123,0.92));
    box-shadow: 0 0 12px rgba(255,170,82,0.28);
  }
  html[data-raydeo-eq-style="prism"] .brand-eq .eq-bar{
    background: linear-gradient(180deg, rgba(99,255,187,0.96), rgba(85,179,255,0.94) 52%, rgba(166,98,255,0.92));
    box-shadow: 0 0 12px rgba(102,214,255,0.26);
  }
  html[data-raydeo-eq-style="prism"] .brand-eq{
    gap:4px;
  }
  .brand-eq-wide{
    flex: 1 1 auto;
    min-width: 0;
    height: 30px;
    gap: 8px;
    padding: 2px 6px 1px;
    justify-content: flex-start;
  }
  .brand-eq-wide .eq-bar{
    width: 5px;
    opacity: 1.94;
  }
  .header-eq{
    height: 24px;
    gap:6px;
    padding: 1px 2px 0;
  }
  .header-eq .eq-bar{
    width:4px;
    opacity:0.9;
  }
  html[data-raydeo-bg-theme="midnight"]{
    --ray-window-grad-a: rgba(7,11,18,0.98);
    --ray-window-grad-b: rgba(10,14,24,0.96);
    --ray-window-grad-c: rgba(7,11,18,0.98);
    --ray-screen-bg: rgba(27, 45, 74, 0.997);
  }
  html[data-raydeo-bg-theme="emerald"]{
    --ray-window-grad-a: rgba(7,18,17,0.98);
    --ray-window-grad-b: rgba(8,28,24,0.96);
    --ray-window-grad-c: rgba(7,18,17,0.98);
    --ray-screen-bg: rgba(16, 67, 64, 0.96);
  }
  html[data-raydeo-bg-theme="plum"]{
    --ray-window-grad-a: rgba(20,10,26,0.98);
    --ray-window-grad-b: rgba(30,14,42,0.96);
    --ray-window-grad-c: rgba(20,10,26,0.98);
    --ray-screen-bg: rgba(60, 31, 92, 0.96);
  }
  html[data-raydeo-bg-theme="sunset"]{
    --ray-window-grad-a: rgba(25,12,16,0.98);
    --ray-window-grad-b: rgba(41,18,23,0.96);
    --ray-window-grad-c: rgba(25,12,16,0.98);
    --ray-screen-bg: rgba(90, 42, 58, 0.96);
  }
  .brand-text .tagline{
    font-size: 12px;
    color: rgba(255,255,255,0.82);
    margin-top: 2px;
    text-shadow: 0 1px 10px rgba(255,255,255,0.08);
  }
  .brand-text .tagline .brightel-t{
    color: rgba(255,72,72,0.96);
    text-shadow: 0 0 10px rgba(255,72,72,0.28);
  }
  .settings-icon-btn{
    width:36px; height:36px;
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,0.12);
    background: rgba(255,255,255,0.06);
    color: var(--text);
    cursor:pointer;
    transition: transform .15s ease, background .15s ease;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size: 34px;
    line-height: 1;
  }
  .settings-icon-btn:hover{ transform: translateY(-1px); background: rgba(255,255,255,0.09); }
  
  /* Status pills */
  .status{ display:flex; align-items:center; gap:12px; margin-top:12.5px; }
  .pill{
    padding: 7px 10px;
    border-radius: 999px;
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.10);
    font-size: 12px;
    color: var(--muted);
    white-space: nowrap;
    overflow:hidden;
    text-overflow: ellipsis;
  }
  .pill.subtle{
    color: rgba(255,255,255,0.50);
    border-color: rgba(255,255,255,0.08);
  }
  #pillMode{
    margin-left: auto;
  }
  
  /* Now playing card */
  .card{
    margin-top: 10px;
    padding: 12px;
    border-radius: 18px;
    background: linear-gradient(180deg, rgba(255,255,255,0.09), rgba(255,255,255,0.05));
    border: .5px solid rgba(255, 255, 255, 0.464);
    box-shadow: 0 16px 40px rgba(0,0,0,0.35);
    position:relative;
  }
  .card.now{
    overflow:hidden;
    min-height: 176px;
    max-height: 176px;
    transform-origin: center top;
    transition:
      min-height 380ms cubic-bezier(.22,1,.24,1),
      max-height 380ms cubic-bezier(.22,1,.24,1),
      padding 380ms cubic-bezier(.22,1,.24,1),
      border-radius 380ms cubic-bezier(.22,1,.24,1),
      transform 420ms cubic-bezier(.18,1,.24,1),
      box-shadow 380ms ease,
      background 380ms ease,
      border-color 320ms ease;
  }
  .card.now > :not(.now-ad-echo){
    position:relative;
    z-index:1;
  }
  .card.now::after{
    content:"";
    position:absolute; inset:-1px;
    border-radius: 18px;
    pointer-events:none;
    background: radial-gradient(400px 180px at 20% 0%, rgba(255,255,255,0.10), transparent 60%);
    mix-blend-mode: screen;
    opacity:0.55;
  }
  .now-ad-echo{
    position:absolute;
    inset: 0;
    border-radius: inherit;
    overflow:hidden;
    pointer-events:none;
    opacity: 1;
    z-index:0;
    mask-image: linear-gradient(124deg, transparent 0%, transparent 24%, rgba(0,0,0,0.02) 34%, rgba(0,0,0,0.10) 43%, rgba(0,0,0,0.24) 52%, rgba(0,0,0,0.46) 62%, rgba(0,0,0,0.74) 74%, rgba(0,0,0,0.94) 88%, rgba(0,0,0,1) 100%);
    -webkit-mask-image: linear-gradient(124deg, transparent 0%, transparent 24%, rgba(0,0,0,0.02) 34%, rgba(0,0,0,0.10) 43%, rgba(0,0,0,0.24) 52%, rgba(0,0,0,0.46) 62%, rgba(0,0,0,0.74) 74%, rgba(0,0,0,0.94) 88%, rgba(0,0,0,1) 100%);
  }
  .now-ad-echo::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:2;
    background:
      linear-gradient(124deg, rgba(255,255,255,0.00) 0%, rgba(255,255,255,0.00) 42%, rgba(255,255,255,0.02) 54%, rgba(10,16,30,0.08) 70%, rgba(8,12,22,0.16) 100%);
  }
  .now-ad-echo__image,
  .now-ad-echo__video{
    position:absolute;
    inset:-1%;
    width:102%;
    height:102%;
    object-fit:cover;
    filter: blur(0.12px) saturate(1.06) brightness(0.88);
    transform: scale(1.01);
    mix-blend-mode: normal;
  }
  .now-ad-echo__image{
    object-position: 54% 50%;
    opacity: 0.42;
    animation: placementEchoPan 16s ease-in-out infinite alternate;
  }
  .now-ad-echo__video{
    opacity:0;
    transition: opacity 320ms ease;
  }
  .now-ad-echo[data-kind="video"] .now-ad-echo__image{
    opacity:0;
  }
  .now-ad-echo[data-kind="video"] .now-ad-echo__video{
    opacity:0.92;
  }
  @keyframes placementEchoPan{
    0%{ object-position: 48% 50%; transform: scale(1.01) translate3d(0,0,0); }
    100%{ object-position: 70% 50%; transform: scale(1.02) translate3d(-0.8%,0,0); }
  }
  .now-meta,
  .controls,
  .now-title-row,
  .now-sub,
  .now-eq-row,
  .now-eq-note,
  .now-eq-visual,
  .play-btn,
  .star-btn-inline,
  .vol-label{
    transition:
      transform 380ms cubic-bezier(.22,1,.24,1),
      opacity 280ms ease,
      margin 320ms ease,
      font-size 320ms ease,
      max-height 320ms ease,
      padding 320ms ease,
      width 320ms ease,
      height 320ms ease,
      border-radius 320ms ease,
      bottom 320ms ease;
  }
  .now-label{ font-size: 11px; color: var(--muted2); letter-spacing: 0.8px; text-transform: uppercase; }
  .now-title-row{
    margin-top:6px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
  }
  .now-station{ font-size: 16px; font-weight: 700; min-width:0; }
  .now-sub{ margin-top:3px; font-size: 12px; color: var(--muted); }
  .now-eq-row{
    margin-top:8px;
    display:flex;
    align-items:center;
    gap:8px;
  }
  .now-eq-badge{
    display:inline-flex;
    align-items:center;
    gap:6px;
    padding:5px 9px;
    border-radius:999px;
    border:1px solid rgba(255,255,255,0.12);
    background: rgba(255,255,255,0.08);
    font-size:11px;
    line-height:1;
    color: rgba(255,255,255,0.84);
    letter-spacing:0.2px;
  }
  .now-eq-badge[data-eq-state="active"]{
    border-color: rgba(110,222,255,0.32);
    background: linear-gradient(180deg, rgba(82,172,255,0.18), rgba(255,255,255,0.06));
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.06), 0 0 16px rgba(73,130,255,0.14);
    color: rgba(255,255,255,0.96);
  }
  .now-eq-badge[data-eq-state="selected"]{
    border-color: rgba(255,209,122,0.24);
    background: linear-gradient(180deg, rgba(255,192,97,0.10), rgba(255,255,255,0.05));
    color: rgba(255,233,191,0.92);
  }
  .now-eq-note{
    margin-top:6px;
    font-size:11px;
    line-height:1.35;
    color: rgba(255,221,164,0.88);
  }
  
  .controls{
    margin-top: 12px;
    display:flex;
    align-items:center;
    gap:10px;
    position: relative;
  }
  .now-eq-visual{
    position:absolute;
    right: 2px;
    bottom: 38px;
    min-width: 46px;
    height: 18px;
    display:flex;
    align-items:flex-end;
    justify-content:flex-end;
    pointer-events:none;
  }
  html[data-eq-placement="now"] .brand-eq{
    height: 18px;
    gap:4px;
    padding: 0;
  }
  html[data-eq-placement="now"] .brand-eq .eq-bar{
    width:3px;
    opacity:0.9;
  }
  .play-btn{
    width:42px; height:42px;
    border-radius: 16px;
    border: 1px solid rgba(255,255,255,0.14);
    background: rgba(255,255,255,0.08);
    color: var(--text);
    cursor:pointer;
    font-size: 18px;
    box-shadow: 0 10px 22px rgba(0,0,0,0.35);
    transition: transform .15s ease, background .15s ease, opacity .15s ease;
  }
  .play-btn:hover{ transform: translateY(-1px); background: rgba(255,255,255,0.11); }
  .play-btn:disabled{ opacity:0.45; cursor:not-allowed; }
  
  .vol{ flex:1; }
  .vol-label{ font-size: 11px; color: var(--muted2); margin-bottom: 6px; }
  input[type="range"]{ width:100%; }
  
  .star-btn{
    width:38px; height:38px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,0.12);
    background: rgba(255,255,255,0.06);
    color: var(--text);
    cursor:pointer;
    font-size: 18px;
    transition: transform .15s ease, background .15s ease, opacity .15s ease;
  }
  .star-btn:hover{ transform: translateY(-1px); background: rgba(255,255,255,0.09); }
  .star-btn:disabled{ opacity:0.45; cursor:not-allowed; }
  .star-btn-inline{
    width:34px;
    height:34px;
    flex:0 0 auto;
    border-radius: 12px;
    font-size: 17px;
  }
  
  /* Tabs */
  .tabs{
    margin-top: 10px;
    display:flex;
    gap:8px;
    align-items:center;
  }
  .tabs-main{
    display:flex;
    gap:8px;
    flex:1 1 auto;
    min-width:0;
  }
  .tab{
    flex:1;
    padding: 7px 10px;
    border-radius: 13px;
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.11);
    color: rgba(255,255,255,0.74);
    cursor:pointer;
    font-size: 12px;
    line-height: 1.1;
    transition: background .15s ease, transform .15s ease, border-color .15s ease, box-shadow .15s ease, color .15s ease;
  }
  .tab:hover{ transform: translateY(-1px); background: rgba(255,255,255,0.08); }
  .tab.active{
    color: rgba(78, 228, 73, 0.98);
    background: linear-gradient(180deg, rgba(255,255,255,0.16), rgba(255,255,255,0.10));
    border-color: rgba(250, 138, 138, 0.22);
    box-shadow: 0 0 0 1px rgba(255,255,255,0.08) inset, 0 8px 20px rgba(92, 174, 255, 0.14);
  }
  
  /* Panels */
  .panels{ margin-top: 10px; flex:1 1 auto; min-height:0; overflow:hidden; }
  .device-screen[data-settings-stage="default"] .card.now{
    min-height: 176px;
    max-height: 176px;
    padding: 12px;
    border-radius: 18px;
    transform: none;
  }
  .device-screen[data-settings-stage="settings"] .card.now{
    min-height: 132px;
    max-height: 132px;
    padding: 9px 12px 7px;
    border-radius: 16px;
    transform: translateY(-4px) scale(0.982);
    background: linear-gradient(180deg, rgba(255,255,255,0.11), rgba(255,255,255,0.035));
    box-shadow:
      0 24px 44px rgba(0,0,0,0.38),
      0 0 0 1px rgba(255,255,255,0.04) inset,
      0 0 26px rgba(117,182,255,0.08);
    border-color: rgba(255,255,255,0.26);
  }
  .device-screen[data-settings-stage="settings"] .card.now::after{
    opacity:0.74;
  }
  .device-screen[data-settings-stage="settings"] .now-meta{
    min-width: 0;
  }
  .device-screen[data-settings-stage="settings"] .now-label{
    letter-spacing: 1.35px;
    opacity: 0.82;
  }
  .device-screen[data-settings-stage="settings"] .now-title-row{
    margin-top: 5px;
    transform: none;
  }
  .device-screen[data-settings-stage="settings"] .now-station{
    font-size: 15px;
    line-height: 1.12;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .device-screen[data-settings-stage="settings"] .now-sub{
    margin-top: 2px;
    font-size: 11px;
    opacity: 0.9;
  }
  .device-screen[data-settings-stage="settings"] .now-eq-row{
    margin-top: 6px;
  }
  .device-screen[data-settings-stage="settings"] .now-eq-badge{
    padding: 4px 8px;
    font-size: 10px;
  }
  .device-screen[data-settings-stage="settings"] .now-eq-note{
    margin-top: 3px;
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transform: translateY(-6px);
  }
  .device-screen[data-settings-stage="settings"] .controls{
    margin-top: 7px;
    gap: 8px;
    transform: translateY(-1px);
  }
  .device-screen[data-settings-stage="settings"] .play-btn{
    width: 36px;
    height: 36px;
    border-radius: 14px;
    font-size: 15px;
  }
  .device-screen[data-settings-stage="settings"] .star-btn-inline{
    width: 30px;
    height: 30px;
    border-radius: 11px;
    font-size: 15px;
  }
  .device-screen[data-settings-stage="settings"] .vol{
    flex: 1 1 auto;
  }
  .device-screen[data-settings-stage="settings"] .vol-label{
    font-size: 10px;
    margin-bottom: 3px;
  }
  .device-screen[data-settings-stage="settings"] input[type="range"]{
    transform: scaleY(0.94);
    transform-origin: center;
  }
  .device-screen[data-settings-stage="settings"] .now-eq-visual{
    bottom: 31px;
    transform: scale(0.92);
    opacity: 0.86;
  }
  .mini-btn-tab{
    flex:0 0 auto;
    padding: 7px 12px;
    border-radius: 13px;
    font-size: 12px;
    line-height: 1.1;
    white-space: nowrap;
  }
  .panel{ display:none; height:100%; min-height:0; overflow:auto; padding-right: 0; }
  .panel.active{ display:block; }
  #panel-about{
    overflow: hidden;
  }
  [data-raydeo="settings"]{
    height: 100%;
    max-height: 100%;
    scrollbar-width: thin;
    scrollbar-color: rgba(255,255,255,0.24) transparent;
  }
  [data-raydeo="settings"] [data-settings-header]{
    margin-bottom: 14px;
  }
  [data-raydeo="settings"] [data-settings-kicker]{
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.1px;
    text-transform: uppercase;
    color: rgba(166,214,255,0.78);
  }
  [data-raydeo="settings"] [data-settings-heading]{
    margin-top: 4px;
    font-size: 18px;
    font-weight: 760;
    letter-spacing: 0.1px;
    color: rgba(255,255,255,0.95);
  }
  [data-raydeo="settings"] [data-settings-summary]{
    margin-top: 6px;
    font-size: 11px;
    line-height: 1.45;
    color: rgba(255,255,255,0.56);
  }
  [data-raydeo="settings"] [data-settings-group]{
    margin-top: 14px;
    padding: 12px;
    border-radius: 16px;
    background: linear-gradient(180deg, rgba(255,255,255,0.06), rgba(255,255,255,0.04));
    border: 1px solid rgba(255,255,255,0.08);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.04);
  }
  [data-raydeo="settings"] [data-settings-group]:first-of-type{
    margin-top: 0;
  }
  [data-raydeo="settings"] [data-settings-title]{
    margin-bottom: 10px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.45px;
    text-transform: uppercase;
    color: rgba(255,255,255,0.80);
  }
  [data-raydeo="settings"] [data-setting-options],
  [data-raydeo="settings"] [data-setting-swatches]{
    display:flex;
    flex-wrap:wrap;
    gap:9px;
  }
  [data-raydeo="settings"] [data-setting-swatches]{
    gap:12px;
    align-items:center;
  }
  [data-raydeo="settings"] [data-bg-theme-strip]{
    display:block;
    overflow-x: scroll;
    overflow-y: hidden;
    height: 58px;
    padding-bottom: 0;
    scrollbar-gutter: stable;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: rgba(255,255,255,0.22) transparent;
    box-sizing: border-box;
  }
  [data-raydeo="settings"] [data-bg-theme-strip]::-webkit-scrollbar{
    height: 5px;
  }
  [data-raydeo="settings"] [data-bg-theme-strip]::-webkit-scrollbar-thumb{
    border-radius: 999px;
    background: rgba(255,255,255,0.20);
  }
  [data-raydeo="settings"] [data-bg-theme-strip]::-webkit-scrollbar-track{
    background: rgba(255,255,255,0.04);
    border-radius: 999px;
  }
  [data-raydeo="settings"] [data-bg-theme-inner]{
    width: max-content;
    min-width: 100%;
    display:flex;
    flex-direction:column;
    gap:6px;
    padding-bottom: 2px;
    box-sizing: border-box;
  }
  [data-raydeo="settings"] [data-bg-theme-labels]{
    display:flex;
    align-items:center;
    gap:12px;
    width:max-content;
  }
  [data-raydeo="settings"] [data-bg-theme-labels] span{
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.7px;
    text-transform: uppercase;
    color: rgba(255,255,255,0.48);
  }
  [data-raydeo="settings"] [data-bg-theme-labels] [data-bg-group="solid"]{
    width: 166px;
  }
  [data-raydeo="settings"] [data-bg-theme-labels] [data-bg-group="gradient"]{
    width: 166px;
  }
  [data-raydeo="settings"] [data-bg-theme-row]{
    flex-wrap: nowrap;
    overflow: visible;
    width: max-content;
    min-width: 100%;
    padding-bottom: 0;
  }
  [data-raydeo="settings"] [data-audio-eq-grid]{
    display:grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap:10px;
  }
  [data-raydeo="settings"] [data-settings-note]{
    margin-top: 10px;
    font-size: 11px;
    line-height: 1.4;
    color: rgba(255,255,255,0.56);
  }
  [data-raydeo="settings"] #raydeoAudioEqNotice{
    color: rgba(255,226,181,0.92);
  }
  [data-raydeo="settings"] [data-eq-style-option],
  [data-raydeo="settings"] [data-audio-eq-option],
  [data-raydeo="settings"] [data-bg-theme-option]{
    -webkit-tap-highlight-color: transparent;
  }
  [data-raydeo="settings"] [data-bg-theme-option]{
    flex: 0 0 auto;
    position: relative;
  }
  [data-raydeo="settings"] [data-bg-theme-option]:nth-child(4),
  [data-raydeo="settings"] [data-bg-theme-option]:nth-child(8){
    margin-right: 18px;
  }
  [data-raydeo="settings"] [data-bg-theme-option]:nth-child(4)::after,
  [data-raydeo="settings"] [data-bg-theme-option]:nth-child(8)::after{
    content:"";
    position:absolute;
    top:50%;
    right:-10px;
    width:1px;
    height:18px;
    transform:translateY(-50%);
    border-radius:999px;
    background: linear-gradient(180deg, rgba(255,255,255,0.00), rgba(255,255,255,0.26), rgba(255,255,255,0.00));
  }
  [data-raydeo="settings"] [data-bg-custom-wrap]{
    width: 28px;
    height: 28px;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,0.18);
    background:
      linear-gradient(135deg, #ff4d7f, #ffb84d 22%, #f6ff4d 38%, #42ff98 56%, #40d5ff 72%, #7b5dff 86%, #ff66d1);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.08);
    cursor: pointer;
    flex: 0 0 auto;
    position: relative;
    overflow: hidden;
  }
  [data-raydeo="settings"] #raydeoBgCustomColor{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    opacity:0;
    cursor:pointer;
    border:0;
    padding:0;
    margin:0;
  }
  [data-raydeo="settings"] [data-bg-custom-wrap][data-selected="true"]{
    box-shadow: 0 0 0 2px rgba(255,255,255,0.16), 0 0 0 6px rgba(132,195,255,0.08), 0 0 18px rgba(132,195,255,0.16);
  }
  [data-raydeo="settings"] [data-audio-eq-option]{
    min-height: 32px;
    width: 100%;
    padding: 8px 8px !important;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    line-height:1.2;
    font-size: 12.5px !important;
    border-radius: 16px !important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,0.08),
      inset 0 -1px 0 rgba(0,0,0,0.18),
      0 10px 22px rgba(9,18,34,0.22) !important;
  }
  [data-raydeo="settings"] [data-audio-eq-option][data-selected="true"]{
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,0.12),
      inset 0 -1px 0 rgba(41,92,156,0.24),
      0 14px 26px rgba(30,84,153,0.24),
      0 0 18px rgba(108,188,255,0.12) !important;
  }
  [data-raydeo="settings"] [data-eq-style-option]:hover,
  [data-raydeo="settings"] [data-audio-eq-option]:hover,
  [data-raydeo="settings"] [data-bg-theme-option]:hover{
    transform: translateY(-2px);
  }
  [data-raydeo="settings"] [data-bg-theme-option][data-selected="false"]:hover{
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.08), 0 0 18px rgba(132,195,255,0.14) !important;
  }
  [data-raydeo="settings"]::-webkit-scrollbar{
    width: 8px;
  }
  [data-raydeo="settings"]::-webkit-scrollbar-thumb{
    border-radius: 999px;
    background: rgba(255,255,255,0.18);
  }
  [data-raydeo="settings"]::-webkit-scrollbar-track{
    background: transparent;
  }
  
  .panel-title{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    margin: 4px 0 10px;
    color: rgba(255,255,255,0.88);
    font-weight: 650;
  }
  .hint{ font-size: 11px; color: var(--muted2); font-weight: 500; }
  .hint-row{ margin-top: 8px; }

  .refine-strip{
    margin: 2px 0 10px;
    padding: 9px 10px 10px;
    border-radius: 16px;
    background: linear-gradient(180deg, rgba(255,255,255,0.055), rgba(255,255,255,0.028));
    border: 1px solid rgba(255,255,255,0.08);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.025);
  }
  .refine-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    margin-bottom: 8px;
  }
  .refine-pill{
    padding: 7px 11px;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,0.12);
    background: rgba(255,255,255,0.06);
    color: var(--text);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.02em;
    cursor: pointer;
    transition: background .15s ease, transform .15s ease, border-color .15s ease;
  }
  .refine-pill:hover{ transform: translateY(-1px); background: rgba(255,255,255,0.10); }
  .refine-pill.active{
    background: linear-gradient(180deg, rgba(113,221,157,0.24), rgba(255,255,255,0.10));
    border-color: rgba(113,221,157,0.28);
  }
  .refine-context{
    min-width: 0;
    text-align: right;
    font-size: 11px;
    color: rgba(255,255,255,0.72);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .refine-grid{
    display:grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
  }
  .refine-field{
    display:flex;
    flex-direction:column;
    gap:5px;
    min-width: 0;
  }
  .refine-field span{
    font-size: 10px;
    color: rgba(255,255,255,0.56);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-weight: 700;
  }
  .refine-field select{
    width:100%;
    padding: 8px 10px;
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,0.10);
    background: rgba(255,255,255,0.045);
    color: var(--text);
    outline:none;
    appearance:none;
  }

  .panel-title-search{
    align-items:flex-start;
    margin-top: 2px;
  }
  .search-inline{
    display:grid;
    gap:10px;
    padding: 10px 0 4px;
  }
  .search-inline__row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
  }
  .search-inline__context{
    min-width:0;
    text-align:right;
    font-size:11px;
    color: rgba(255,255,255,0.72);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .search-inline__grid{
    display:grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }
  .search-inline__field{
    display:flex;
    flex-direction:column;
    gap:5px;
    min-width:0;
  }
  .search-inline__field--full{
    grid-column: 1 / -1;
  }
  .search-inline__field span{
    font-size: 10px;
    color: rgba(255,255,255,0.56);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-weight: 700;
  }
  .search-inline__field input,
  .search-inline__field select{
    width:100%;
    padding: 9px 10px;
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,0.10);
    background: rgba(255,255,255,0.045);
    color: var(--text);
    outline:none;
    appearance:none;
  }
  .search-inline__field input::placeholder{
    color: rgba(255,255,255,0.35);
  }
  .search-inline__toggle{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding: 8px 0 2px;
    font-size:11px;
    color: rgba(255,255,255,0.72);
  }
  .search-inline__toggle input{
    width:16px;
    height:16px;
    accent-color: #7bcfff;
  }
  .search-inline__actions{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
  }
  .search-inline__apply{
    background: linear-gradient(180deg, rgba(108,188,255,0.22), rgba(255,255,255,0.08));
    border-color: rgba(132,195,255,0.24);
  }

  .tora-shell{
    position:absolute;
    inset:0;
    z-index: 10;
    pointer-events:none;
    --tora-panel-shift-x: 0px;
    --tora-panel-shift-y: 0px;
  }
  .tora-shell > *{
    pointer-events:auto;
  }
  .tora-backdrop{
    position:absolute;
    inset:0;
    z-index:0;
    background: rgba(7,10,18,0.22);
    backdrop-filter: blur(10px) saturate(1.06);
    -webkit-backdrop-filter: blur(10px) saturate(1.06);
    opacity:0;
    transition: opacity .2s ease;
    touch-action:none;
  }
  .tora-shell[data-state="opening"] .tora-backdrop,
  .tora-shell[data-state="open"] .tora-backdrop,
  .tora-shell[data-state="closing"] .tora-backdrop{
    opacity:1;
  }
  .tora-hide-toast{
    position:absolute;
    z-index:12;
    left: calc(var(--tora-x, calc(100% - 78px)) + 58px);
    top: calc(var(--tora-y, calc(100% - 118px)) - 52px);
    min-width: 152px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding: 9px 10px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,0.12);
    background: linear-gradient(180deg, rgba(12,18,30,0.94), rgba(10,14,24,0.96));
    box-shadow:
      0 16px 36px rgba(0,0,0,0.34),
      0 0 0 1px rgba(255,255,255,0.03) inset,
      0 0 18px rgba(117,197,255,0.10);
    font-size: 11px;
    color: rgba(255,255,255,0.86);
    opacity:0;
    pointer-events:auto;
    transform: translate(calc(-100% - 8px), 6px);
    transition: opacity .18s ease, transform .18s ease;
  }
  .tora-hide-toast[data-open="true"]{
    opacity:1;
    transform: translate(calc(-100% - 8px), 0);
  }
  .tora-hide-toast__text{
    white-space:nowrap;
  }
  .tora-hide-toast__action{
    border: 1px solid rgba(132,195,255,0.20);
    background: rgba(255,255,255,0.05);
    color: rgba(255,255,255,0.92);
    border-radius: 10px;
    padding: 6px 9px;
    font-size: 10px;
    font-weight: 700;
    cursor:pointer;
    pointer-events:auto;
    touch-action: manipulation;
    transition: background .16s ease, border-color .16s ease, transform .16s ease, box-shadow .16s ease;
  }
  .tora-hide-toast__action:hover,
  .tora-hide-toast__action:focus-visible{
    background: rgba(123,207,255,0.12);
    border-color: rgba(132,195,255,0.34);
    box-shadow: 0 0 0 1px rgba(255,255,255,0.04) inset;
    transform: translateY(-1px);
    outline:none;
  }
  .tora-talk-toast{
    position:absolute;
    z-index:13;
    left: calc(var(--tora-x, calc(100% - 78px)) + 58px);
    top: calc(var(--tora-y, calc(100% - 118px)) - 56px);
    min-width: 172px;
    display:grid;
    gap:10px;
    padding: 10px 11px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,0.12);
    background: linear-gradient(180deg, rgba(12,18,30,0.96), rgba(10,14,24,0.98));
    box-shadow:
      0 16px 36px rgba(0,0,0,0.34),
      0 0 0 1px rgba(255,255,255,0.03) inset,
      0 0 18px rgba(117,197,255,0.10);
    color: rgba(255,255,255,0.88);
    opacity:0;
    transform: translate(calc(-100% - 8px), 6px);
    transition: opacity .18s ease, transform .18s ease;
  }
  .tora-talk-toast[data-open="true"]{
    opacity:1;
    transform: translate(calc(-100% - 8px), 0);
  }
  .tora-talk-toast__text{
    font-size:11px;
    white-space:nowrap;
  }
  .tora-talk-toast__actions{
    display:flex;
    gap:8px;
  }
  .tora-talk-toast__action{
    flex:1 1 auto;
    border:1px solid rgba(255,255,255,0.12);
    background: rgba(255,255,255,0.05);
    color: rgba(255,255,255,0.92);
    border-radius: 10px;
    padding: 7px 10px;
    font-size: 10px;
    font-weight: 700;
    cursor:pointer;
  }
  .tora-talk-toast__action--primary{
    border-color: rgba(132,195,255,0.24);
    background: rgba(123,207,255,0.12);
  }
  .device-screen[data-tora-open="true"]{
    overscroll-behavior: contain;
  }
  .device-screen[data-tora-open="true"] .raydeo{
    overflow: hidden;
  }
  .tora-fab{
    position:absolute;
    z-index:2;
    left: var(--tora-x, calc(100% - 78px));
    top: var(--tora-y, calc(100% - 118px));
    width: 58px;
    border: 0;
    background: transparent;
    color: rgba(255,255,255,0.96);
    cursor:pointer;
    display:grid;
    justify-items:center;
    gap:8px;
    padding:0;
    touch-action:none;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    user-select: none;
    -webkit-user-drag: none;
    transform: translate3d(0,0,0);
  }
  .tora-fab[data-dragging="true"]{
    cursor:grabbing;
  }
  .tora-fab__orb-wrap{
    position:relative;
    width: 42px;
    height: 42px;
    display:grid;
    place-items:center;
    -webkit-touch-callout:none;
    -webkit-user-select:none;
    user-select:none;
    transform: translate3d(var(--tora-drift-x, 0px), var(--tora-drift-y, 0px), 0);
    transition: transform .26s cubic-bezier(.22,.78,.24,1);
    will-change: transform;
  }
  .tora-fab__mist{
    position:absolute;
    inset:-8px;
    border-radius:999px;
    background:
      radial-gradient(circle at 50% 50%, rgba(255,255,255,0.42), rgba(255,255,255,0.12) 36%, rgba(140,208,255,0.10) 54%, transparent 74%);
    filter: blur(9px);
    opacity:.78;
    animation: toraMist 4.8s ease-in-out infinite;
  }
  .tora-fab__orb{
    position:relative;
    width: 34px;
    height: 34px;
    border-radius: 999px;
    background:
      radial-gradient(circle at 34% 28%, rgba(255,255,255,0.96), rgba(180,235,255,0.72) 18%, rgba(113,197,255,0.54) 34%, rgba(87,121,255,0.64) 63%, rgba(255,104,182,0.74) 100%);
    box-shadow:
      0 0 0 1px rgba(255,255,255,0.18) inset,
      0 0 18px rgba(120,196,255,0.28),
      0 0 28px rgba(255,122,198,0.12),
      0 10px 22px rgba(0,0,0,0.28);
    animation: toraBreath 3.8s ease-in-out infinite;
  }
  .tora-fab:hover .tora-fab__orb,
  .tora-fab:focus-visible .tora-fab__orb{
    box-shadow:
      0 0 0 1px rgba(255,255,255,0.24) inset,
      0 0 22px rgba(120,196,255,0.34),
      0 0 32px rgba(255,122,198,0.15),
      0 12px 26px rgba(0,0,0,0.30);
  }
  .tora-fab[data-listening="true"] .tora-fab__mist{
    opacity:.96;
    filter: blur(10px);
    animation-duration: 1.8s;
  }
  .tora-fab[data-listening="true"] .tora-fab__orb{
    box-shadow:
      0 0 0 1px rgba(255,255,255,0.28) inset,
      0 0 26px rgba(120,196,255,0.44),
      0 0 40px rgba(255,122,198,0.22),
      0 12px 26px rgba(0,0,0,0.30);
    animation-duration: 1.9s;
  }
  .tora-fab[data-listening="true"] .tora-fab__label{
    color: rgba(246,249,255,0.98);
    text-shadow: 0 6px 18px rgba(0,0,0,0.38), 0 0 18px rgba(123,207,255,0.18);
  }
  .tora-fab:focus-visible{
    outline:none;
  }
  .tora-fab__copy{
    display:block;
    text-align:center;
    transform: translate3d(calc(var(--tora-drift-x, 0px) * 0.45), calc(var(--tora-drift-y, 0px) * 0.45), 0);
    transition: transform .26s cubic-bezier(.22,.78,.24,1);
    will-change: transform;
  }
  .tora-fab__label{
    display:block;
    font-size: 10px;
    font-weight: 760;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(235,243,255,0.90);
    text-shadow: 0 4px 14px rgba(0,0,0,0.34);
    -webkit-user-select:none;
    user-select:none;
    transition: color .18s ease, text-shadow .18s ease;
  }
  .tora-fab:hover .tora-fab__label,
  .tora-fab:focus-visible .tora-fab__label{
    color: rgba(246,249,255,0.96);
    text-shadow: 0 6px 18px rgba(0,0,0,0.38), 0 0 14px rgba(123,207,255,0.14);
  }
  .tora-panel{
    position:absolute;
    z-index:1;
    left:50%;
    top:50%;
    transform:
      translate(-50%, -50%)
      translate(var(--tora-panel-shift-x), var(--tora-panel-shift-y))
      scale(0.18);
    transform-origin: center center;
    width: min(312px, calc(100% - 30px));
    max-height: min(560px, calc(100% - 32px));
    padding: 13px;
    border-radius: 22px;
    border: 1px solid rgba(137,207,255,0.18);
    background:
      linear-gradient(180deg, rgba(14,20,34,0.95), rgba(10,14,24,0.97)),
      radial-gradient(circle at top right, rgba(98,173,255,0.10), transparent 42%),
      radial-gradient(circle at bottom left, rgba(255,118,196,0.08), transparent 38%);
    box-shadow:
      0 24px 60px rgba(0,0,0,0.48),
      0 0 0 1px rgba(255,255,255,0.03) inset,
      0 0 38px rgba(108,188,255,0.10);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    overflow:auto;
    overscroll-behavior: contain;
    touch-action: pan-y;
    opacity:0;
    transition:
      transform .42s cubic-bezier(.18,.86,.18,1),
      opacity .26s ease,
      box-shadow .42s ease;
    will-change: transform, opacity;
  }
  .tora-shell[data-state="open"] .tora-panel{
    transform:
      translate(-50%, -50%)
      translate(0px, 0px)
      scale(1);
    opacity:1;
  }
  .tora-shell[data-state="open"] .tora-panel,
  .tora-shell[data-state="opening"] .tora-panel{
    box-shadow:
      0 24px 60px rgba(0,0,0,0.48),
      0 0 0 1px rgba(255,255,255,0.03) inset,
      0 0 38px rgba(108,188,255,0.10);
  }
  .tora-shell[data-state="closing"] .tora-panel{
    transform:
      translate(-50%, -50%)
      translate(var(--tora-panel-shift-x), var(--tora-panel-shift-y))
      scale(0.22);
    opacity:0;
  }
  .tora-panel__head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:10px;
  }
  .tora-panel__kicker{
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: rgba(159,219,255,0.76);
  }
  .tora-panel__title{
    margin-top: 3px;
    font-size: 17px;
    font-weight: 780;
    color: rgba(255,255,255,0.96);
  }
  .tora-panel__close{
    width: 28px;
    height: 28px;
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,0.10);
    background: rgba(255,255,255,0.05);
    color: rgba(255,255,255,0.74);
    cursor:pointer;
    transition: background .16s ease, color .16s ease, border-color .16s ease, transform .16s ease;
  }
  .tora-panel__close:hover,
  .tora-panel__close:focus-visible{
    background: rgba(255,255,255,0.08);
    color: rgba(255,255,255,0.90);
    border-color: rgba(255,255,255,0.16);
    transform: translateY(-1px);
    outline:none;
  }
  .tora-greeting{
    margin-top: 8px;
    padding: 11px 12px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,0.08);
    background: rgba(255,255,255,0.04);
    font-size: 11px;
    line-height: 1.45;
    color: rgba(255,255,255,0.62);
  }
  .tora-panel__chips{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top: 11px;
  }
  .tora-panel__chips:empty,
  .tora-panel__chips[hidden]{
    display:none;
  }
  .tora-chip{
    padding: 8px 11px;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,0.10);
    background: rgba(255,255,255,0.05);
    color: rgba(255,255,255,0.84);
    font-size: 11px;
    cursor:pointer;
    transition: transform .15s ease, background .15s ease, border-color .15s ease;
  }
  .tora-chip:hover{
    transform: translateY(-1px);
    background: rgba(255,255,255,0.08);
    border-color: rgba(132,195,255,0.22);
  }
  .tora-chip:focus-visible{
    transform: translateY(-1px);
    background: rgba(123,207,255,0.10);
    border-color: rgba(132,195,255,0.24);
    outline:none;
  }
  .input-shell{
    position:relative;
    width:100%;
  }
  .input-shell input{
    padding-right: 34px;
  }
  .input-shell--tora input{
    padding-right: 36px;
  }
  .input-clear{
    position:absolute;
    right:8px;
    top:50%;
    transform: translateY(-50%);
    width:20px;
    height:20px;
    border-radius:999px;
    border:1px solid rgba(255,255,255,0.10);
    background: rgba(255,255,255,0.05);
    color: rgba(255,255,255,0.72);
    font-size: 12px;
    line-height: 1;
    display:grid;
    place-items:center;
    cursor:pointer;
    padding:0;
    transition: background .15s ease, border-color .15s ease, color .15s ease;
  }
  .input-clear:hover,
  .input-clear:focus-visible{
    background: rgba(123,207,255,0.10);
    border-color: rgba(132,195,255,0.22);
    color: rgba(255,255,255,0.92);
    outline:none;
  }
  .tora-panel__ask{
    display:grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap:8px;
    margin-top: 11px;
  }
  .tora-panel__field{
    display:flex;
    flex-direction:column;
    gap:5px;
    min-width:0;
  }
  .tora-panel__field span{
    font-size: 10px;
    color: rgba(255,255,255,0.56);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: 700;
  }
  .tora-panel__field input{
    width:100%;
    min-width:0;
    padding: 10px 11px;
    border-radius: 13px;
    border: 1px solid rgba(255,255,255,0.10);
    background: rgba(255,255,255,0.045);
    color: var(--text);
    outline:none;
  }
  .tora-panel__field input::placeholder{
    color: rgba(255,255,255,0.34);
  }
  .tora-panel__go{
    align-self:end;
    padding: 10px 12px;
    border-radius: 13px;
    border: 1px solid rgba(132,195,255,0.24);
    background: linear-gradient(180deg, rgba(108,188,255,0.22), rgba(255,255,255,0.08));
    color: rgba(255,255,255,0.94);
    font-size: 11px;
    font-weight: 700;
    cursor:pointer;
    transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease, filter .16s ease;
  }
  .tora-voice-mini{
    margin-top: 10px;
    padding: 10px 11px;
    border-radius: 15px;
    border: 1px solid rgba(255,255,255,0.08);
    background: linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.03));
    display: grid;
    gap: 9px;
    overflow:hidden;
    transition: padding .18s ease, gap .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
  }
  .tora-voice-mini__btn{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    width:100%;
    padding: 10px 12px;
    border-radius: 13px;
    border: 1px solid rgba(132,195,255,0.20);
    background: rgba(255,255,255,0.05);
    color: rgba(255,255,255,0.92);
    font-size: 11px;
    font-weight: 700;
    cursor:pointer;
    user-select:none;
    -webkit-user-select:none;
    -webkit-touch-callout:none;
    -webkit-tap-highlight-color: transparent;
    touch-action:none;
    transition: transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease;
  }
  .tora-voice-mini,
  .tora-voice-mini__btn *,
  .tora-voice-mini__status{
    user-select:none;
    -webkit-user-select:none;
    -webkit-touch-callout:none;
  }
  .tora-voice-mini__btn:hover,
  .tora-voice-mini__btn:focus-visible{
    transform: translateY(-1px);
    border-color: rgba(132,195,255,0.28);
    background: rgba(123,207,255,0.10);
    box-shadow: 0 8px 18px rgba(38,80,152,0.16);
    outline:none;
  }
  .tora-voice-mini__btn[disabled]{
    cursor:not-allowed;
    opacity:.58;
    transform:none;
    box-shadow:none;
  }
  .tora-voice-mini__btn[data-active="true"]{
    border-color: rgba(132,195,255,0.34);
    background: linear-gradient(180deg, rgba(108,188,255,0.18), rgba(255,255,255,0.08));
    box-shadow: 0 0 24px rgba(92,174,255,0.14);
  }
  .tora-voice-mini__icon{
    font-size: 14px;
    line-height: 1;
  }
  .tora-voice-mini__wave{
    position: relative;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:2px;
    height: 34px;
    padding: 0 8px;
    border-radius: 12px;
    overflow:hidden;
    background:
      linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0.01)),
      radial-gradient(circle at 50% 50%, rgba(84,199,255,0.08), transparent 70%);
  }
  .tora-voice-mini__wave::before{
    content:"";
    position:absolute;
    left:8px;
    right:8px;
    top:50%;
    height:2px;
    transform:translateY(-50%);
    border-radius:999px;
    background: linear-gradient(90deg, rgba(102,201,255,0.14), rgba(255,255,255,0.94) 50%, rgba(255,136,206,0.14));
    opacity:.42;
    box-shadow: 0 0 12px rgba(112,207,255,0.16);
  }
  .tora-voice-mini__bar{
    position:relative;
    z-index:1;
    flex:1 1 0;
    max-width:5px;
    min-width:2px;
    height: 24px;
    border-radius:999px;
    background: linear-gradient(180deg, rgba(120,221,255,0.92), rgba(255,255,255,0.98) 50%, rgba(255,136,206,0.92));
    transform: scaleY(var(--tora-mini-scale, .08));
    transform-origin:center center;
    transition: transform 74ms linear, opacity 110ms ease, box-shadow 120ms ease, filter 120ms ease;
    opacity:.6;
    box-shadow: 0 0 12px rgba(114,186,255,0.14);
  }
  .tora-voice-mini__status{
    font-size: 11px;
    line-height: 1.4;
    color: rgba(255,255,255,0.62);
    min-height: 16px;
    transition: opacity .16s ease, max-height .18s ease, transform .18s ease;
  }
  .tora-voice-mini[data-expanded="false"]{
    padding: 8px 10px;
    gap: 0;
  }
  .tora-voice-mini[data-expanded="false"] .tora-voice-mini__wave,
  .tora-voice-mini[data-expanded="false"] .tora-voice-mini__status{
    opacity: 0;
    height: 0;
    min-height: 0;
    max-height: 0;
    transform: translateY(-4px);
    pointer-events:none;
    overflow:hidden;
    margin:0;
  }
  .tora-voice-mini[data-phase="listening"] .tora-voice-mini__bar{
    opacity:.82;
    filter: saturate(1.08);
  }
  .tora-voice-mini[data-phase="listening"]{
    border-color: rgba(120,211,255,0.22);
    box-shadow: 0 0 0 1px rgba(120,211,255,0.08), 0 12px 26px rgba(40,82,138,0.14);
  }
  .tora-voice-mini[data-phase="listening"][data-signal="speech"] .tora-voice-mini__bar{
    box-shadow: 0 0 16px rgba(114,186,255,0.24);
  }
  .tora-voice-mini[data-phase="processing"] .tora-voice-mini__bar{
    opacity:.74;
    filter: saturate(1.14) brightness(1.04);
  }
  .tora-voice-mini[data-phase="processing"]{
    border-color: rgba(166,188,255,0.20);
    box-shadow: 0 0 0 1px rgba(166,188,255,0.08), 0 12px 26px rgba(71,74,151,0.15);
  }
  .tora-voice-mini[data-phase="replying"] .tora-voice-mini__bar{
    opacity:.82;
    filter: saturate(1.18) brightness(1.06);
    box-shadow: 0 0 18px rgba(172,161,255,0.20);
  }
  .tora-voice-mini[data-phase="replying"]{
    border-color: rgba(196,171,255,0.24);
    box-shadow: 0 0 0 1px rgba(196,171,255,0.09), 0 14px 28px rgba(98,78,163,0.17);
  }
  .tora-voice-mini[data-phase="speaking"] .tora-voice-mini__bar{
    opacity:.94;
    filter: saturate(1.24) brightness(1.08);
    box-shadow: 0 0 20px rgba(255,122,197,0.24);
  }
  .tora-voice-mini[data-phase="speaking"]{
    border-color: rgba(255,156,212,0.24);
    box-shadow: 0 0 0 1px rgba(255,156,212,0.08), 0 14px 30px rgba(161,64,123,0.18);
  }
  .tora-voice-mini[data-phase="listening"] .tora-voice-mini__status,
  .tora-voice-mini[data-phase="processing"] .tora-voice-mini__status,
  .tora-voice-mini[data-phase="replying"] .tora-voice-mini__status,
  .tora-voice-mini[data-phase="speaking"] .tora-voice-mini__status{
    color: rgba(255,255,255,0.84);
  }
.tora-talk-panel{
  position:absolute;
  z-index:1;
    left:50%;
    top:50%;
    transform: translate(-50%, -50%) scale(0.92);
    width:min(320px, calc(100% - 30px));
    max-height:min(472px, calc(100% - 44px));
    padding: 16px 14px 14px;
    border-radius: 24px;
    border: 1px solid rgba(137,207,255,0.18);
    background:
      linear-gradient(180deg, rgba(14,20,34,0.96), rgba(9,13,23,0.98)),
      radial-gradient(circle at top right, rgba(98,173,255,0.14), transparent 42%),
      radial-gradient(circle at bottom left, rgba(255,118,196,0.10), transparent 38%);
    box-shadow:
      0 24px 60px rgba(0,0,0,0.48),
      0 0 0 1px rgba(255,255,255,0.03) inset,
      0 0 42px rgba(108,188,255,0.12);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
  opacity:0;
  transition: opacity .22s ease, transform .24s ease;
}
.tora-talk-panel__close{
  position:absolute;
  top:14px;
  right:14px;
  width:42px;
  height:42px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,0.14);
  background: rgba(255,255,255,0.055);
  color: rgba(255,255,255,0.84);
  font-size: 28px;
  line-height: 1;
  cursor:pointer;
  transition: transform .16s ease, border-color .16s ease, background .16s ease, color .16s ease;
}
.tora-talk-panel__close:hover,
.tora-talk-panel__close:focus-visible{
  transform: translateY(-1px);
  border-color: rgba(156,221,255,0.22);
  background: rgba(120,196,255,0.10);
  color: rgba(255,255,255,0.96);
  outline:none;
}
.tora-shell[data-talk="open"] .tora-talk-panel{
  opacity:1;
  transform: translate(-50%, -50%) scale(1);
}
  .tora-talk-panel__kicker{
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: rgba(159,219,255,0.78);
  }
.tora-talk-panel__title{
  margin-top: 5px;
  font-size: 18px;
  font-weight: 780;
  color: rgba(255,255,255,0.97);
  padding-right: 56px;
}
  .tora-talk-panel__status{
    margin-top: 10px;
    font-size: 12px;
    line-height: 1.45;
    color: rgba(255,255,255,0.76);
  }
  .tora-talk-panel__waves{
    position: relative;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:2px;
    margin: 18px 0 14px;
    height: 92px;
    padding: 0 10px;
    border-radius: 22px;
    overflow:hidden;
    background:
      linear-gradient(180deg, rgba(255,255,255,0.035), rgba(255,255,255,0.01)),
      radial-gradient(circle at 50% 48%, rgba(84,199,255,0.12), transparent 62%),
      radial-gradient(circle at 72% 50%, rgba(255,116,198,0.08), transparent 44%);
    box-shadow:
      0 0 0 1px rgba(255,255,255,0.04) inset,
      0 18px 42px rgba(0,0,0,0.18),
      0 0 34px rgba(98,188,255,0.08);
  }
  .tora-talk-panel__waves::before{
    content:"";
    position:absolute;
    left:10px;
    right:10px;
    top:50%;
    height:2px;
    transform:translateY(-50%);
    border-radius:999px;
    background:
      linear-gradient(90deg,
        rgba(102,201,255,0.18),
        rgba(184,242,255,0.82) 22%,
        rgba(255,255,255,0.98) 50%,
        rgba(255,176,226,0.82) 78%,
        rgba(162,122,255,0.18)
      );
    box-shadow:
      0 0 16px rgba(112,207,255,0.18),
      0 0 24px rgba(255,124,196,0.10);
    opacity: calc(0.42 + (var(--waveform-level, .12) * .34));
    pointer-events:none;
  }
  .tora-talk-panel__waves::after{
    content:"";
    position:absolute;
    inset: 10px 18px;
    border-radius:18px;
    background:
      radial-gradient(circle at 50% 50%, rgba(122,205,255,0.10), transparent 52%),
      radial-gradient(circle at 50% 50%, rgba(255,121,197,0.06), transparent 68%);
    opacity: calc(0.28 + (var(--waveform-level, .12) * .32));
    pointer-events:none;
  }
  .tora-talk-wave{
    position:relative;
    z-index:1;
    flex: 1 1 0;
    max-width: 6px;
    min-width: 3px;
    height: 76px;
    border-radius: 999px;
    background:
      linear-gradient(180deg,
        rgba(255,255,255,0.04) 0%,
        rgba(123,220,255,0.95) 18%,
        rgba(255,255,255,1) 50%,
        rgba(255,149,214,0.92) 82%,
        rgba(255,255,255,0.04) 100%
      );
    opacity: var(--wave-alpha, .54);
    transform: scaleY(var(--wave-scale, .08));
    transform-origin: center center;
    transition: transform 64ms linear, opacity 96ms ease, filter 120ms ease, box-shadow 120ms ease;
    box-shadow:
      0 0 0 1px rgba(255,255,255,0.04) inset,
      0 0 18px rgba(114,186,255,0.18);
    filter: saturate(1.06) brightness(1.02);
  }
  .tora-talk-panel[data-phase="idle"] .tora-talk-panel__waves{
    background:
      linear-gradient(180deg, rgba(255,255,255,0.028), rgba(255,255,255,0.008)),
      radial-gradient(circle at 50% 48%, rgba(84,199,255,0.08), transparent 62%);
  }
  .tora-talk-panel[data-phase="idle"] .tora-talk-wave{
    filter: saturate(.96) brightness(.94);
    box-shadow:
      0 0 0 1px rgba(255,255,255,0.03) inset,
      0 0 10px rgba(114,186,255,0.10);
  }
  .tora-talk-panel[data-phase="listening"] .tora-talk-wave{
    filter: saturate(1.14) brightness(1.04);
  }
  .tora-talk-panel[data-phase="listening"][data-signal="speech"] .tora-talk-wave{
    box-shadow:
      0 0 0 1px rgba(255,255,255,0.06) inset,
      0 0 28px rgba(114,186,255,0.32);
  }
  .tora-talk-panel[data-phase="processing"] .tora-talk-wave{
    filter: saturate(1.18) brightness(1.08) blur(.1px);
    box-shadow:
      0 0 0 1px rgba(255,255,255,0.05) inset,
      0 0 20px rgba(255,164,208,0.20);
  }
  .tora-talk-panel[data-phase="processing"] .tora-talk-panel__waves{
    background:
      linear-gradient(180deg, rgba(255,255,255,0.04), rgba(255,255,255,0.015)),
      radial-gradient(circle at 50% 50%, rgba(255,148,203,0.14), transparent 68%);
  }
  .tora-talk-panel[data-phase="replying"] .tora-talk-wave{
    filter: saturate(1.22) brightness(1.12);
    box-shadow:
      0 0 0 1px rgba(255,255,255,0.05) inset,
      0 0 30px rgba(172,161,255,0.28);
  }
  .tora-talk-panel[data-phase="replying"] .tora-talk-panel__waves{
    background:
      linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.018)),
      radial-gradient(circle at 50% 50%, rgba(164,156,255,0.16), transparent 68%);
  }
  .tora-talk-panel[data-phase="speaking"] .tora-talk-wave{
    filter: saturate(1.28) brightness(1.12);
    box-shadow:
      0 0 0 1px rgba(255,255,255,0.05) inset,
      0 0 40px rgba(255,122,197,0.32);
  }
  .tora-talk-panel[data-phase="speaking"] .tora-talk-panel__waves{
    background:
      linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.02)),
      radial-gradient(circle at 50% 50%, rgba(255,122,197,0.20), transparent 68%);
  }
  .tora-talk-panel[data-phase="speaking"] .tora-talk-panel__waves::before{
    box-shadow:
      0 0 18px rgba(112,207,255,0.20),
      0 0 30px rgba(255,124,196,0.18);
    opacity: .84;
  }
  .tora-talk-panel__bubble{
    margin-top: 10px;
    padding: 10px 11px;
    border-radius: 16px;
    border: 1px solid rgba(255,255,255,0.08);
    background: rgba(255,255,255,0.04);
  }
  .tora-talk-panel__bubble--reply{
    background: rgba(123,207,255,0.06);
    border-color: rgba(132,195,255,0.12);
  }
  .tora-talk-panel__label{
    font-size: 10px;
    color: rgba(255,255,255,0.54);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: 700;
    margin-bottom: 6px;
  }
  .tora-talk-panel__text{
    font-size: 12px;
    line-height: 1.5;
    color: rgba(255,255,255,0.86);
    min-height: 18px;
  }
.tora-talk-panel__actions{
  margin-top: 12px;
  display:flex;
  justify-content:flex-start;
  flex-wrap:wrap;
  gap:10px;
}
.tora-talk-panel__btn{
  border: 1px solid rgba(255,255,255,0.12);
    background: rgba(255,255,255,0.05);
    color: rgba(255,255,255,0.92);
    border-radius: 12px;
    padding: 10px 12px;
  font-size: 11px;
  font-weight: 700;
  cursor:pointer;
}
.tora-talk-panel__btn[disabled]{
  opacity:.54;
  cursor:not-allowed;
}
.tora-talk-panel__btn--primary{
  border-color: rgba(132,195,255,0.24);
  background: linear-gradient(180deg, rgba(108,188,255,0.22), rgba(255,255,255,0.08));
}
  .tora-panel__go:hover,
  .tora-panel__go:focus-visible{
    transform: translateY(-1px);
    border-color: rgba(132,195,255,0.30);
    box-shadow: 0 10px 18px rgba(66,118,196,0.18);
    filter: saturate(1.06);
    outline:none;
  }
  .tora-results{
    display:grid;
    gap:8px;
    margin-top: 12px;
    max-height: min(284px, 42vh);
    overflow:auto;
    padding-right: 2px;
    scroll-behavior:smooth;
    scroll-padding-bottom: 12px;
  }
  .tora-results[data-ready="true"] .tora-card{
    animation: toraReveal .28s ease both;
  }
  .tora-empty{
    padding: 10px 11px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,0.08);
    background: rgba(255,255,255,0.04);
    font-size: 11px;
    line-height: 1.45;
    color: rgba(255,255,255,0.62);
  }
  .tora-empty__line{
    color: rgba(255,255,255,0.88);
  }
  .tora-empty__line + .tora-empty__line{
    margin-top: 4px;
  }
  .tora-empty__hint{
    margin-top: 8px;
    color: rgba(255,255,255,0.58);
  }
  .tora-card{
    padding: 10px 11px;
    border-radius: 16px;
    border: 1px solid rgba(255,255,255,0.08);
    background: linear-gradient(180deg, rgba(255,255,255,0.055), rgba(255,255,255,0.035));
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.03), 0 10px 22px rgba(0,0,0,0.12);
  }
  .tora-card--conversation{
    background:
      linear-gradient(180deg, rgba(111,193,255,0.10), rgba(255,255,255,0.035)),
      linear-gradient(180deg, rgba(255,255,255,0.055), rgba(255,255,255,0.035));
    border-color: rgba(132,195,255,0.16);
  }
  .tora-card__top{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:10px;
  }
  .tora-card__title{
    font-size: 12px;
    font-weight: 700;
    color: rgba(255,255,255,0.95);
  }
  .tora-card__pill{
    flex:0 0 auto;
    padding: 4px 7px;
    border-radius: 999px;
    background: rgba(129,214,255,0.10);
    border: 1px solid rgba(129,214,255,0.14);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(164,225,255,0.78);
  }
  .tora-card__detail{
    margin-top: 6px;
    font-size: 11px;
    line-height: 1.44;
    color: rgba(255,255,255,0.62);
  }
  .tora-card__meta{
    margin-top: 7px;
    font-size: 10px;
    color: rgba(255,255,255,0.44);
  }
  .tora-card__action{
    margin-top: 9px;
    padding: 8px 11px;
    border-radius: 12px;
    border: 1px solid rgba(132,195,255,0.20);
    background: rgba(255,255,255,0.05);
    color: rgba(255,255,255,0.92);
    font-size: 11px;
    font-weight: 700;
    cursor:pointer;
    transition: background .16s ease, border-color .16s ease, transform .16s ease, box-shadow .16s ease;
  }
  .tora-card__action:hover,
  .tora-card__action:focus-visible{
    background: rgba(123,207,255,0.10);
    border-color: rgba(132,195,255,0.28);
    transform: translateY(-1px);
    box-shadow: 0 8px 16px rgba(0,0,0,0.16);
    outline:none;
  }
  .tora-preview{
    margin-top: 12px;
    padding-top: 10px;
    border-top: 1px solid rgba(255,255,255,0.08);
    display:grid;
    gap:8px;
  }
  .tora-preview__head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
  }
  .tora-preview__title{
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(190,231,255,0.84);
  }
  .tora-preview__hint{
    font-size: 10px;
    color: rgba(255,255,255,0.42);
  }
  .tora-preview__list{
    display:grid;
    gap:8px;
  }
  .tora-preview-card{
    padding: 10px 11px;
    border-radius: 15px;
    border: 1px solid rgba(255,255,255,0.08);
    background: linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.03));
  }
  .tora-preview-card__top{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:10px;
  }
  .tora-preview-card__title{
    font-size: 12px;
    font-weight: 720;
    color: rgba(255,255,255,0.95);
  }
  .tora-preview-card__sub{
    margin-top: 3px;
    font-size: 10px;
    color: rgba(255,255,255,0.52);
  }
  .tora-preview-card__reason{
    margin-top: 7px;
    font-size: 11px;
    line-height: 1.4;
    color: rgba(255,255,255,0.66);
  }
  .tora-preview-card__actions{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
    margin-top: 9px;
  }
  .tora-preview-card__btn{
    padding: 8px 10px;
    border-radius: 12px;
    border: 1px solid rgba(132,195,255,0.18);
    background: rgba(255,255,255,0.05);
    color: rgba(255,255,255,0.90);
    font-size: 10px;
    font-weight: 700;
    cursor:pointer;
    transition: background .15s ease, border-color .15s ease, transform .15s ease;
  }
  .tora-preview-card__btn:hover,
  .tora-preview-card__btn:focus-visible{
    background: rgba(123,207,255,0.10);
    border-color: rgba(132,195,255,0.26);
    transform: translateY(-1px);
    outline:none;
  }
  .tora-preview-card__btn--primary{
    background: linear-gradient(180deg, rgba(108,188,255,0.18), rgba(255,255,255,0.08));
  }
  @keyframes toraBreath{
    0%, 100%{ transform: scale(1); box-shadow: 0 0 0 1px rgba(255,255,255,0.18) inset, 0 0 18px rgba(120,196,255,0.28), 0 10px 22px rgba(0,0,0,0.28); }
    50%{ transform: scale(1.06); box-shadow: 0 0 0 1px rgba(255,255,255,0.22) inset, 0 0 24px rgba(132,208,255,0.36), 0 12px 24px rgba(0,0,0,0.30); }
  }
  @keyframes toraMist{
    0%, 100%{ transform: scale(0.94); opacity:.58; }
    50%{ transform: scale(1.08); opacity:.88; }
  }
  @keyframes toraTalkIdle{
    0%, 100%{ height: 10px; opacity: .56; }
    50%{ height: 18px; opacity: .78; }
  }
  @keyframes toraTalkListening{
    0%, 100%{ height: 12px; }
    20%{ height: 30px; }
    45%{ height: 18px; }
    65%{ height: 40px; }
    85%{ height: 24px; }
  }
  @keyframes toraTalkSpeaking{
    0%, 100%{ height: 16px; }
    22%{ height: 36px; }
    48%{ height: 26px; }
    70%{ height: 44px; }
    88%{ height: 20px; }
  }
  @keyframes toraReveal{
    0%{ opacity:0; transform: translateY(14px); }
    100%{ opacity:1; transform: translateY(0); }
  }
  @media (max-width: 560px){
    .search-inline__grid{
      grid-template-columns: 1fr;
    }
    .search-inline__row,
    .search-inline__toggle{
      flex-direction:column;
      align-items:flex-start;
    }
    .search-inline__context{
      text-align:left;
      white-space:normal;
    }
    .search-inline__actions .mini-btn{
      width:100%;
    }
    .tora-panel{
      width: min(318px, calc(100% - 22px));
      max-height: min(480px, calc(100% - 24px));
    }
    .tora-panel__ask{
      grid-template-columns: 1fr;
    }
    .tora-voice-mini__btn{
      justify-content:center;
    }
    .tora-fab{ width: 56px; }
    .tora-hide-toast{
      min-width: 118px;
      top: calc(var(--tora-y, calc(100% - 118px)) - 48px);
    }
  }
  @media (prefers-reduced-motion: reduce){
    .tora-fab__mist,
    .tora-fab__orb{
      animation: none;
    }
    .tora-fab__orb-wrap,
    .tora-fab__copy,
    .tora-panel,
    .tora-backdrop,
    .tora-results[data-ready="true"] .tora-card{
      transition: none;
      animation: none;
    }
  }
  
  .searchbox{
    display:flex; gap:8px;
    margin-top: 2px;
  }
  .searchbox input{
    flex:1;
    padding: 10px 12px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,0.12);
    background: rgba(255,255,255,0.05);
    color: var(--text);
    outline:none;
  }
  .searchbox input::placeholder{ color: rgba(255,255,255,0.35); }
  
  .mini-btn{
    padding: 10px 12px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,0.12);
    background: rgba(255,255,255,0.06);
    color: var(--text);
    cursor:pointer;
    transition: transform .15s ease, background .15s ease;
  }
  .mini-btn:hover{ transform: translateY(-1px); background: rgba(255,255,255,0.09); }
  
  .list{ display:flex; flex-direction:column; gap:12px; padding-right: 20px; }
  .row{
    display:flex;
    align-items:center;
    gap:10px;
    padding: 10px 10px;
    border-radius: 16px;
    background: rgba(255,255,255,0.05);
    border: 1px solid rgba(255,255,255,0.10);
    cursor:pointer;
    transition: transform .12s ease, background .12s ease;
  }
  .row:hover{ transform: translateY(-1px); background: rgba(255,255,255,0.08); }
  .row.active{
    background: linear-gradient(180deg, rgba(108,188,255,0.12), rgba(255,255,255,0.06));
    border-color: rgba(132,195,255,0.24);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.06), 0 0 18px rgba(92,174,255,0.10);
  }
  
  .row .left{
    width:34px; height:34px;
    border-radius: 12px;
    display:flex; align-items:center; justify-content:center;
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.10);
    color: rgba(255,255,255,0.88);
  }
  .row.active .left{
    background: linear-gradient(180deg, rgba(102,171,255,0.18), rgba(255,255,255,0.07));
    border-color: rgba(132,195,255,0.22);
    color: rgba(255,255,255,0.96);
  }
  .row .meta{ flex:1; min-width:0; }
  .row .t{ font-weight:650; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .row.active .t{ color: rgba(255,255,255,0.98); }
  .row .s{ font-size:11px; color: var(--muted); margin-top:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .row .right{
    width:34px; height:34px;
    border-radius: 12px;
    display:flex; align-items:center; justify-content:center;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.08);
    color: rgba(255,255,255,0.80);
  }

  @media (max-width: 620px){
    .refine-grid{
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }

  @media (max-width: 420px){
    .refine-head{
      flex-direction: column;
      align-items: stretch;
    }
    .refine-context{
      text-align: left;
      white-space: normal;
    }
    .refine-grid{ grid-template-columns: 1fr; }
  }
  @media (max-width: 420px){
    .tora-talk-panel{
      width:min(328px, calc(100% - 22px));
      max-height:min(488px, calc(100% - 28px));
      padding: 15px 13px 13px;
    }
    .tora-talk-panel__close{
      top:12px;
      right:12px;
      width:40px;
      height:40px;
    }
    .tora-talk-panel__waves{
      height: 82px;
      padding: 0 8px;
      gap: 1px;
    }
    .tora-talk-wave{
      max-width: 5px;
      height: 68px;
    }
  }
  .row.active .right{
    border-color: rgba(255,255,255,0.14);
    background: rgba(255,255,255,0.06);
  }
  
  .divider{
    height:1px;
    background: rgba(255,255,255,0.10);
    margin: 12px 0;
  }
  
  .skeleton, .empty{
    padding: 12px;
    border-radius: 16px;
    background: rgba(255,255,255,0.05);
    border: 1px solid rgba(255,255,255,0.10);
    color: var(--muted);
  }
  
  .about-card{
    height: 100%;
    min-height: 0;
    padding: 14px;
    border-radius: 18px;
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.12);
    overflow: hidden;
  }
  .about-title{ font-size: 18px; font-weight: 800; letter-spacing:0.4px; }
  .about-sub{ margin-top:4px; color: var(--muted); }
  
  .about-lines{ margin-top: 12px; display:flex; flex-direction:column; gap:10px; }
  .line{ display:flex; align-items:center; gap:10px; color: rgba(255,255,255,0.78); }
  .dot{
    width:8px; height:8px; border-radius: 999px;
    background: rgba(255,255,255,0.75);
    box-shadow: 0 0 16px rgba(255,255,255,0.25);
  }

  .promise{
    margin-top: 14px;
    padding: 10px 12px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,0.12);
    background: rgba(255,255,255,0.05);
    color: rgba(255,255,255,0.82);
    text-align:center;
    font-weight: 650;
    letter-spacing: 0.2px;
  }
  
  .danger-btn{
    margin-top: 12px;
    width:100%;
    padding: 11px 12px;
    border-radius: 15px;
    border: 1px solid rgba(255,255,255,0.12);
    background: linear-gradient(180deg, rgba(255,255,255,0.07), rgba(255,255,255,0.04));
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.04);
    color: rgba(255,255,255,0.88);
    cursor:pointer;
    transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
  }
  .danger-btn:hover{
    transform: translateY(-1px);
    border-color: rgba(255,185,185,0.22);
    background: linear-gradient(180deg, rgba(255,255,255,0.09), rgba(255,255,255,0.05));
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.05), 0 12px 26px rgba(0,0,0,0.14);
  }
  
  .foot{
    margin-top: 10px;
    color: rgba(255,255,255,0.45);
    font-size: 11px;
    text-align:center;
    flex: 0 0 auto;
  }
  .update-banner{
    margin-top: 10px;
    padding: 8px 10px;
    border-radius: 14px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    background: linear-gradient(180deg, rgba(102,171,255,0.18), rgba(255,255,255,0.06));
    border: 1px solid rgba(132,195,255,0.24);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.06), 0 0 18px rgba(92,174,255,0.10);
  }
  .update-banner[hidden]{
    display:none !important;
  }
  .update-banner[data-state="success"]{
    background: linear-gradient(180deg, rgba(72,198,132,0.18), rgba(255,255,255,0.05));
    border-color: rgba(118,224,167,0.24);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.05), 0 0 18px rgba(72,198,132,0.10);
  }
  .update-banner-text{
    font-size: 11px;
    color: rgba(255,255,255,0.9);
    letter-spacing: 0.15px;
  }
  .update-banner[data-state="success"] .update-banner-text{
    color: rgba(232,255,242,0.96);
  }
  .update-banner-btn{
    padding: 6px 10px;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,0.16);
    background: rgba(255,255,255,0.08);
    color: rgba(255,255,255,0.94);
    font-size: 11px;
    cursor: pointer;
    transition: transform .15s ease, background .15s ease, border-color .15s ease;
  }
  .update-banner-btn:hover{
    transform: translateY(-1px);
    background: rgba(255,255,255,0.12);
    border-color: rgba(255,255,255,0.22);
  }
  .a2hs-nudge{
    margin-top: 10px;
    padding: 10px 12px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,0.12);
    background: rgba(8,12,18,0.72);
    box-shadow: 0 12px 26px rgba(0,0,0,0.28);
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap: 10px;
  }
  .a2hs-copy{
    display:flex;
    flex-direction:column;
    gap:4px;
  }
  .a2hs-title{
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.2px;
    color: rgba(231,240,255,0.95);
  }
  .a2hs-text{
    font-size: 11px;
    color: rgba(195,210,240,0.86);
    line-height: 1.35;
  }
  .a2hs-actions{
    display:flex;
    align-items:center;
    gap: 8px;
    flex-shrink: 0;
  }
  .a2hs-btn{
    border: 0;
    border-radius: 999px;
    padding: 6px 10px;
    min-height: 34px;
    font-size: 11px;
    font-weight: 700;
    color: #f7fbff;
    background: linear-gradient(180deg, rgba(96,176,255,0.9), rgba(58,125,255,0.9));
    box-shadow: 0 8px 18px rgba(26,90,190,0.28);
    cursor: pointer;
    touch-action: manipulation;
  }
  .a2hs-btn-ghost{
    background: rgba(255,255,255,0.06);
    color: rgba(220,232,255,0.88);
    box-shadow: none;
    border: 1px solid rgba(255,255,255,0.14);
  }
  .a2hs-dismiss{
    border: 0;
    width: 24px;
    height: 24px;
    border-radius: 999px;
    background: rgba(255,255,255,0.08);
    color: rgba(220,230,255,0.86);
    cursor: pointer;
  }
  @media (max-width: 520px){
    .a2hs-nudge{
      align-items: stretch;
      flex-direction: column;
      gap: 12px;
      padding:
        12px
        12px
        calc(12px + env(safe-area-inset-bottom))
        12px;
      position: relative;
    }
    .a2hs-copy{
      padding-right: 28px;
    }
    .a2hs-actions{
      width: 100%;
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 10px;
      align-items: stretch;
    }
    .a2hs-btn{
      width: 100%;
      min-height: 42px;
      padding: 10px 12px;
      font-size: 12px;
    }
    .a2hs-dismiss{
      position: absolute;
      top: 10px;
      right: 10px;
      width: 30px;
      height: 30px;
      z-index: 1;
    }
  }
  .a2hs-modal{
    position: fixed;
    inset: 0;
    background: rgba(6,10,16,0.55);
    display:flex;
    align-items:center;
    justify-content:center;
    z-index: 60;
  }
  .a2hs-modal[hidden],
  .a2hs-nudge[hidden]{
    display:none !important;
  }
  .a2hs-modal-card{
    width: min(320px, 84%);
    border-radius: 16px;
    padding: 16px;
    background: rgba(12,18,30,0.92);
    border: 1px solid rgba(255,255,255,0.12);
    box-shadow: 0 18px 48px rgba(0,0,0,0.45);
    display:grid;
    gap: 10px;
    text-align: left;
  }
  .a2hs-modal-title{
    font-size: 13px;
    font-weight: 700;
    color: rgba(235,245,255,0.96);
  }
  .a2hs-modal-text{
    font-size: 12px;
    color: rgba(200,214,245,0.9);
    line-height: 1.5;
  }

  /* Animations */
  @keyframes breathe{
    0%,100%{ transform: scale(1); opacity:0.22; }
    50%{ transform: scale(1.03); opacity:0.28; }
  }
  @keyframes drift{
    0%{ transform: translate3d(0,0,0); }
    100%{ transform: translate3d(40px, -30px, 0); }
  }