/* Loaded before other styles so mode-specific important rules also win over native layers. */
@layer chat-pure-mode, chat-text-settings;
@layer chat-pure-mode {
  .chat-pure-toggle { cursor:pointer; flex-shrink:0; touch-action:manipulation; }
  .chat-pure-toggle > svg { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
  .chat-pure-toggle[aria-pressed="true"] { color:#91f6e1!important; border-color:#91f6e1!important; background:rgba(18,83,73,.7)!important; }
  .chat-pure-toggle:focus-visible { outline:2px solid #91f6e1!important; outline-offset:2px; }
  .chat-pure-card {
    box-sizing:border-box!important; position:relative!important; display:flex!important; flex-direction:column!important;
    width:136px!important; height:136px!important; min-width:136px!important; max-width:136px!important;
    min-height:136px!important; max-height:136px!important; flex:0 0 136px!important;
    padding:14px 8px!important; margin:0!important; gap:0!important; border:0!important; border-radius:24px!important;
    background:rgba(0,0,0,.7)!important; opacity:1!important; box-shadow:none!important; overflow:hidden!important;
    font-size:0!important; line-height:0!important; text-align:center!important; isolation:isolate;
  }
  .chat-pure-card::before { content:none!important; }
  .chat-pure-card::after {
    display:block!important; visibility:visible!important; z-index:1!important;
    content:""!important; position:absolute!important; inset:0!important; width:auto!important; height:auto!important; min-width:0!important; min-height:0!important; max-width:none!important; max-height:none!important; margin:0!important; border:0!important; border-radius:inherit!important; padding:2px!important;
    background:conic-gradient(from var(--chat-pure-angle),#ff67d4,#a777ff,#508dff,#58eaff,#65f0ae,#ffe875,#ffa866,#ff6e94,#ff67d4)!important;
    -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0)!important;
    -webkit-mask-composite:xor!important; mask-composite:exclude!important;
    pointer-events:none!important; box-shadow:none!important; filter:none!important; transform:none!important; opacity:1!important;
    animation:chat-pure-flow 6.1s linear infinite!important;
  }
  .chat-pure-card:nth-child(2n)::after { animation-direction:reverse!important; animation-delay:-2.7s!important; }
  .chat-pure-card:nth-child(3n)::after { animation-duration:7.9s!important; animation-delay:-5.1s!important; }
  .chat-pure-card > :not(.chat-pure-presentation) { display:none!important; }
  /* Keep the source image link as the actual hit target over its new presentation. */
  .ph-image-bubble.chat-pure-card > a.ph-image-square { display:block!important; position:absolute!important; inset:0!important; width:100%!important; height:100%!important; margin:0!important; padding:0!important; opacity:0!important; z-index:2!important; pointer-events:auto!important; }
  .ph-image-bubble.chat-pure-card:focus-within { outline:2px solid #91f6e1!important; outline-offset:2px!important; }
  .chat-pure-presentation { display:flex!important; flex-direction:column!important; align-items:center!important; justify-content:flex-start!important; gap:10px!important; width:100%!important; height:100%!important; pointer-events:none!important; }
  .chat-pure-visual { display:grid!important; place-items:center!important; position:relative!important; top:3px!important; width:68px!important; height:68px!important; min-height:68px!important; flex:0 0 68px!important; background:none!important; border:0!important; border-radius:0!important; font:12px/1.4 sans-serif!important; color:#eee!important; }
  .chat-pure-visual .chat-pure-art { display:block!important; position:static!important; width:96%!important; height:96%!important; max-width:96%!important; max-height:96%!important; object-fit:contain!important; padding:0!important; margin:0!important; border:0!important; border-radius:0!important; background:none!important; opacity:1!important; transform:none!important; }
  /* Intrinsic portrait/canvas height must not enlarge the grid's implicit row. */
  .chat-pure-visual { grid-template-columns:minmax(0,1fr)!important; grid-template-rows:minmax(0,1fr)!important; }
  .chat-pure-visual .chat-pure-art { box-sizing:border-box!important; min-width:0!important; min-height:0!important; object-position:center!important; align-self:center!important; justify-self:center!important; }
  .chat-pure-visual svg { fill:none; stroke:currentColor; stroke-width:1.8; color:#70e6ed; }
  .chat-pure-card[data-category="investor"] .chat-pure-visual svg { color:#ffc56c!important; }
  .chat-pure-visual[data-placeholder]::after { content:attr(data-placeholder); }
  .chat-pure-visual .chat-pure-windows { display:grid!important; grid-template-columns:repeat(2,1fr)!important; grid-template-rows:repeat(2,1fr)!important; gap:4px!important; width:54px!important; height:54px!important; }
  .chat-pure-windows > i { display:block!important; position:static!important; width:100%!important; height:100%!important; background:#67c8ff!important; border:0!important; transform:none!important; }
  .chat-pure-caption { display:flex!important; align-items:center!important; justify-content:center!important; width:100%!important; height:30px!important; min-height:30px!important; margin:0!important; padding:0!important; color:#fff!important; font-size:22px!important; font-weight:600!important; line-height:28px!important; letter-spacing:0!important; white-space:normal!important; word-break:normal!important; overflow-wrap:anywhere!important; text-align:center!important; text-shadow:0 1px 3px #000!important; }
  .chat-pure-caption-long { font-size:14px!important; line-height:14px!important; }
  .chat-pure-caption { color:transparent!important; text-shadow:none!important; }
  .chat-pure-caption-text { display:block; width:100%; }
  .chat-pure-caption-char { display:inline-block; vertical-align:top; }
  .chat-pure-caption-char::after {
    content:attr(data-char); white-space:pre;
    background:linear-gradient(90deg,#fff,#a8efff,#76bfd2,#d9f8ff,#fff);
    background-size:260% 100%; background-position:100% 50%;
    background-clip:text; -webkit-background-clip:text; color:transparent; -webkit-text-fill-color:transparent;
  }
  .chat-pure-caption-char[data-tone="1"]::after { background-image:linear-gradient(90deg,#fff,#f0c4df,#c79bd7,#e9d7f5,#fff); }
  .chat-pure-caption-char[data-tone="2"]::after { background-image:linear-gradient(90deg,#fff,#fff0b8,#ddbd70,#ffe4a0,#fff); }
  .chat-pure-caption-char[data-tone="3"]::after { background-image:linear-gradient(90deg,#fff,#d7f2df,#91c6aa,#c8ead8,#fff); }
  .chat-pure-grid { display:flex!important; flex-wrap:wrap!important; gap:12px!important; justify-content:flex-start!important; align-items:flex-start!important; grid-template-columns:none!important; }
  /* ProductWindow computes visible ranges from grid columns; spacer rows must span them. */
  .children.chat-pure-grid { display:grid!important; grid-template-columns:repeat(auto-fill,136px)!important; align-content:start!important; }
  .chat-pure-acquisition { display:flex!important; flex-wrap:wrap!important; gap:12px!important; align-items:flex-start!important; }
  .chat-pure-compact { width:91.8px!important; height:91.8px!important; min-width:91.8px!important; max-width:91.8px!important; min-height:91.8px!important; max-height:91.8px!important; flex-basis:91.8px!important; border-radius:16.2px!important; padding:9.45px 5.4px!important; }
  .chat-pure-compact::after { padding:1.35px!important; }
  .chat-pure-compact .chat-pure-presentation { gap:6.75px!important; }
  .chat-pure-compact .chat-pure-visual { width:45.9px!important; height:45.9px!important; min-height:45.9px!important; flex-basis:45.9px!important; top:2.025px!important; }
  .chat-pure-compact .chat-pure-caption { height:20.25px!important; min-height:20.25px!important; font-size:14.85px!important; line-height:18.9px!important; }
  .chat-pure-card[hidden] { display:none!important; }
  @media(max-width:720px) {
    :is(.bean-chat-toolbar,.contact-toolbar,.chat-toolbar) { flex-wrap:wrap!important; row-gap:4px!important; }
    :is(.bean-chat-toolbar-group,.contact-toolbar-group,.toolbar-group) { flex-shrink:0!important; }
  }
  @media(prefers-reduced-motion:reduce) { .chat-pure-card::after { animation:none!important; } }
}
@property --chat-pure-angle { syntax:'<angle>'; inherits:false; initial-value:135deg; }
@keyframes chat-pure-flow { to { --chat-pure-angle:495deg; } }