/* Rey, the companion — brand manual v3.1 (obsidian · platinum · champagne, Syncopate / Jost / Plex Mono,
   Kepler ease). Every class is rc- prefixed: these styles load on every page and must not collide.
   Keyframes animate transform / opacity only. */
.rc-root { --rc-obsidian:#050506; --rc-deep:#0b0b0c; --rc-platinum:#ece8df; --rc-champagne:#d4b67c; --rc-graphite:#9a968e;
  --rc-line:rgba(236,232,223,.16); --rc-kepler:cubic-bezier(.15,.30,0,.65); --rc-spring:cubic-bezier(.34,1.56,.64,1);
  --rc-display:'Syncopate',system-ui,sans-serif; --rc-text:'Jost',system-ui,sans-serif; --rc-mono:'IBM Plex Mono',ui-monospace,monospace; }

/* the body */
.rc-rey { position:fixed; left:0; top:0; z-index:2147483000; width:300px; height:300px; transform-origin:0 0; cursor:grab; touch-action:none;
  user-select:none; -webkit-user-select:none; -webkit-tap-highlight-color:transparent; will-change:transform; }
.rc-rey.rc-held { cursor:grabbing; }
.rc-rey:focus-visible { outline:2px solid #d4b67c; outline-offset:-30px; border-radius:50%; }
.rc-rey > svg { width:100%; height:100%; overflow:visible; display:block; transition:opacity .35s cubic-bezier(.15,.30,0,.65); }
.rc-rey.rc-ghost > svg { opacity:0; }
.rc-float { animation:rc-float 4.8s ease-in-out infinite; transform-box:view-box; transform-origin:50% 50%; }
@keyframes rc-float { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-6px)} }
.rc-body { transform-box:view-box; transform-origin:50% 90%; }
.rc-eyes { transition:transform .22s cubic-bezier(.15,.30,0,.65); }
.rc-rey.rc-squish .rc-body { animation:rc-squish .55s cubic-bezier(.15,.30,0,.65); }
@keyframes rc-squish { 0%{transform:scale(1,1)} 30%{transform:scale(1.1,.88)} 60%{transform:scale(.95,1.06)} 100%{transform:scale(1,1)} }
.rc-rey.rc-bounce .rc-body { animation:rc-bounce .8s cubic-bezier(.15,.30,0,.65); }
@keyframes rc-bounce { 0%{transform:translateY(0) scale(1,1)} 25%{transform:translateY(0) scale(1.12,.86)} 50%{transform:translateY(-34px) scale(.92,1.1)} 80%{transform:translateY(0) scale(1.06,.94)} 100%{transform:translateY(0) scale(1,1)} }
.rc-rey.rc-spin .rc-body { animation:rc-spin .9s cubic-bezier(.15,.30,0,.65); }
@keyframes rc-spin { from{transform:rotate(0)} to{transform:rotate(360deg)} }
.rc-rey.rc-shake .rc-body { animation:rc-shake .5s linear 2; }
@keyframes rc-shake { 0%,100%{transform:translateX(0) rotate(0)} 20%{transform:translateX(-6px) rotate(-4deg)} 40%{transform:translateX(6px) rotate(4deg)} 60%{transform:translateX(-4px) rotate(-3deg)} 80%{transform:translateX(4px) rotate(3deg)} }
.rc-rey.rc-wave .rc-body { animation:rc-wave 1.4s ease-in-out; }
@keyframes rc-wave { 0%,100%{transform:rotate(0)} 15%{transform:rotate(-12deg)} 35%{transform:rotate(10deg)} 55%{transform:rotate(-10deg)} 75%{transform:rotate(8deg)} }
.rc-rey.rc-beat .rc-body { animation:rc-beat .26s cubic-bezier(.15,.30,0,.65); }
@keyframes rc-beat { 0%{transform:scale(1,1)} 40%{transform:scale(1.08,.9) translateY(4px)} 100%{transform:scale(1,1)} }
.rc-rey.rc-sleeping .rc-float { animation-duration:7s; }
.rc-rey.rc-looking .rc-eyes { animation:rc-look 2.4s ease-in-out; }
@keyframes rc-look { 0%,100%{transform:translate(0,0)} 25%{transform:translate(-9px,-2px)} 60%{transform:translate(9px,-1px)} }
.rc-blink { animation:rc-blink 5.2s infinite; transform-box:fill-box; transform-origin:center; }
@keyframes rc-blink { 0%,94%,100%{transform:scaleY(1)} 96%{transform:scaleY(.08)} }
.rc-spinf { animation:rc-spinf 1.1s linear infinite; transform-box:fill-box; transform-origin:center; }
@keyframes rc-spinf { to{transform:rotate(360deg)} }
.rc-heartbeat { animation:rc-heartbeat .7s ease-in-out infinite; transform-box:fill-box; transform-origin:center; }
@keyframes rc-heartbeat { 0%,100%{transform:scale(1)} 40%{transform:scale(1.22)} }
.rc-tremble { animation:rc-tremble .12s linear infinite; transform-box:fill-box; transform-origin:center; }
@keyframes rc-tremble { 0%,100%{transform:translateX(0)} 50%{transform:translateX(1.5px)} }
.rc-scanbar { animation:rc-scanbar 1.1s ease-in-out infinite alternate; transform-box:fill-box; }
@keyframes rc-scanbar { from{transform:translateX(-30px)} to{transform:translateX(30px)} }
.rc-twinkle { animation:rc-twinkle 1s ease-in-out infinite; transform-box:fill-box; transform-origin:center; }
@keyframes rc-twinkle { 0%,100%{transform:scale(1) rotate(0)} 50%{transform:scale(1.2) rotate(18deg)} }
.rc-cheek, .rc-sweat, .rc-zz, .rc-eq, .rc-ring, .rc-jet { opacity:0; transition:opacity .35s; }
.rc-rey[data-face="hype"] .rc-cheek, .rc-rey[data-face="love"] .rc-cheek, .rc-rey[data-face="laugh"] .rc-cheek, .rc-rey[data-face="wink"] .rc-cheek { opacity:.6; }
.rc-rey[data-face="scared"] .rc-sweat { opacity:1; }
.rc-rey[data-face="sleep"] .rc-zz, .rc-rey[data-face="dreamy"] .rc-zz { opacity:1; }
.rc-rey.rc-flying .rc-jet { opacity:1; }
.rc-jet ellipse { transform-box:fill-box; transform-origin:50% 0; animation:rc-jet .14s ease-in-out infinite alternate; }
@keyframes rc-jet { from{transform:scaleY(.7); opacity:.6} to{transform:scaleY(1.15); opacity:1} }
.rc-zz text { animation:rc-zz 2.8s ease-in-out infinite; }
.rc-zz text + text { animation-delay:1.1s; }
@keyframes rc-zz { 0%{transform:translate(0,0); opacity:0} 30%{opacity:1} 100%{transform:translate(14px,-24px); opacity:0} }
.rc-rey.rc-talking .rc-eq { opacity:1; }
.rc-eq rect { transform-box:fill-box; transform-origin:50% 100%; animation:rc-eq .5s ease-in-out infinite alternate; }
.rc-eq rect:nth-child(2){animation-delay:-.15s} .rc-eq rect:nth-child(3){animation-delay:-.3s} .rc-eq rect:nth-child(4){animation-delay:-.1s} .rc-eq rect:nth-child(5){animation-delay:-.4s}
.rc-rey.rc-live-eq .rc-eq rect { animation:none; }
@keyframes rc-eq { from{transform:scaleY(.25)} to{transform:scaleY(1)} }
.rc-rey.rc-listening .rc-ring { opacity:1; }
.rc-ring circle { transform-box:fill-box; transform-origin:center; animation:rc-ring 1.4s ease-out infinite; }
.rc-ring circle + circle { animation-delay:.7s; }
@keyframes rc-ring { 0%{opacity:.7; transform:scale(.92)} 100%{opacity:0; transform:scale(1.45)} }

/* speech */
.rc-bubble { position:fixed; left:0; top:0; z-index:2147483001; width:max-content; max-width:min(300px,calc(100vw - 24px)); margin:0;
  padding:11px 14px; background:#0b0b0c; border:1px solid rgba(236,232,223,.18); text-align:left; box-shadow:0 12px 32px rgba(0,0,0,.45);
  font:300 14px/1.45 'Jost',system-ui,sans-serif; color:#ece8df; letter-spacing:0; text-transform:none;
  clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,0 100%);
  opacity:0; pointer-events:none; transition:opacity .3s cubic-bezier(.15,.30,0,.65); }
.rc-bubble.rc-on { opacity:1; }
.rc-bubble.rc-on.rc-interactive { pointer-events:auto; }
.rc-bubble .rc-src { display:block; margin-top:4px; line-height:1.2; font:400 9.5px 'IBM Plex Mono',ui-monospace,monospace; color:#d4b67c; letter-spacing:.06em; }
.rc-actions { display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; }
.rc-btn { display:inline-flex; align-items:center; gap:6px; font:400 9.5px 'Syncopate',system-ui,sans-serif; letter-spacing:.2em; text-transform:uppercase;
  padding:9px 11px; color:#9a968e; background:transparent; border:1px solid rgba(236,232,223,.16); cursor:pointer; border-radius:0; line-height:1; }
.rc-btn:hover { color:#ece8df; border-color:rgba(236,232,223,.35); }
.rc-btn.rc-primary { color:#050506; background:#d4b67c; border-color:#d4b67c; }
.rc-btn.rc-primary:hover { background:#ece8df; border-color:#ece8df; }
.rc-btn:focus-visible { outline:1px solid #d4b67c; outline-offset:3px; }

/* the dock chips beside Rey when he rests */
.rc-dock { position:fixed; left:0; top:0; z-index:2147483000; display:flex; gap:4px; align-items:center; opacity:0; pointer-events:none; transition:opacity .35s cubic-bezier(.15,.30,0,.65); }
.rc-dock.rc-on { opacity:1; pointer-events:auto; }
.rc-ask { display:inline-flex; align-items:center; gap:8px; height:34px; padding:0 14px; border:1px solid #d4b67c; background:#0b0b0c; color:#d4b67c; cursor:pointer;
  font:400 9.5px 'Syncopate',system-ui,sans-serif; letter-spacing:.22em; text-transform:uppercase; border-radius:0; box-shadow:0 8px 24px rgba(0,0,0,.4); }
.rc-ask:hover { background:#d4b67c; color:#050506; }
.rc-mute { width:34px; height:34px; display:grid; place-items:center; border:1px solid rgba(236,232,223,.16); background:#0b0b0c; color:#9a968e; cursor:pointer; border-radius:0; padding:0; }
.rc-mute:hover { color:#ece8df; }
.rc-mute svg { width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.rc-ask:focus-visible, .rc-mute:focus-visible { outline:1px solid #d4b67c; outline-offset:3px; }

/* pointing beam + spotlight */
.rc-beam { position:fixed; inset:0; width:100%; height:100%; z-index:2147482999; pointer-events:none; overflow:visible; }
.rc-beam line { stroke:#d4b67c; stroke-width:1.2; stroke-dasharray:3 6; opacity:0; transition:opacity .3s; animation:rc-flow .6s linear infinite; }
.rc-beam circle { fill:none; stroke:#d4b67c; stroke-width:1.2; opacity:0; transition:opacity .3s; transform-box:fill-box; transform-origin:center; animation:rc-tgt 1.4s ease-out infinite; }
.rc-beam.rc-on line { opacity:.75; } .rc-beam.rc-on circle { opacity:1; }
@keyframes rc-flow { to{stroke-dashoffset:-18} }
@keyframes rc-tgt { 0%{transform:scale(.6); opacity:1} 100%{transform:scale(1.6); opacity:0} }
.rc-spot { outline:1px solid rgba(212,182,124,.75) !important; outline-offset:6px !important; }

/* tour bar */
.rc-tourbar { position:fixed; left:0; right:0; bottom:16px; z-index:2147483001; width:max-content; max-width:calc(100vw - 24px); margin:0 auto;
  display:flex; align-items:center; gap:2px; padding:5px 5px 5px 16px; background:#0b0b0c; border:1px solid rgba(236,232,223,.16); border-radius:999px;
  box-shadow:0 10px 30px rgba(0,0,0,.5); transform:translateY(170%); transition:transform .6s cubic-bezier(.34,1.56,.64,1); }
.rc-tourbar.rc-on { transform:none; }
.rc-tourbar .rc-step { font:400 9.5px 'Syncopate',system-ui,sans-serif; letter-spacing:.22em; text-transform:uppercase; color:#9a968e; margin-right:10px; white-space:nowrap; }
.rc-tourbar .rc-step b { color:#d4b67c; font-weight:400; }
.rc-tb { width:34px; height:34px; display:grid; place-items:center; border:0; border-radius:50%; background:transparent; color:#9a968e; cursor:pointer; font:400 12px 'IBM Plex Mono',ui-monospace,monospace; padding:0; }
.rc-tb:hover { color:#ece8df; background:rgba(236,232,223,.07); }
.rc-tb:focus-visible { outline:1px solid #d4b67c; outline-offset:2px; }

/* particles */
.rc-fx { position:fixed; inset:0; pointer-events:none; z-index:2147483002; overflow:hidden; }
.rc-p { position:absolute; left:0; top:0; width:14px; height:14px; animation:rc-p var(--d,1.3s) cubic-bezier(.15,.30,0,.65) forwards; }
.rc-p svg { width:100%; height:100%; display:block; }
@keyframes rc-p { 0%{opacity:0; transform:translate(var(--x0),var(--y0)) scale(.4) rotate(0)} 12%{opacity:1} 100%{opacity:0; transform:translate(var(--x1),var(--y1)) scale(var(--sc,1)) rotate(var(--r,0deg))} }
.rc-trail { position:absolute; left:0; top:0; width:5px; height:5px; border-radius:50%; background:#d4b67c; animation:rc-trail .7s ease-out forwards; }
@keyframes rc-trail { from{opacity:.8; transform:translate(var(--x0),var(--y0)) scale(1)} to{opacity:0; transform:translate(var(--x0),var(--y0)) scale(.2)} }
.rc-scanline { position:fixed; left:0; right:0; top:0; height:2px; z-index:2147483002; pointer-events:none; background:linear-gradient(90deg,transparent,#d4b67c,transparent); animation:rc-scanline 1.6s cubic-bezier(.15,.30,0,.65) forwards; }
@keyframes rc-scanline { from{transform:translateY(0); opacity:1} 90%{opacity:1} to{transform:translateY(100vh); opacity:0} }

/* the chat panel opens beside Rey, so it is his voice, not a separate widget */
body.rc-embodied .rey-launcher, body.rc-embodied .rey-nudge { display:none !important; }

@media (prefers-reduced-motion: reduce) {
  .rc-float, .rc-blink, .rc-spinf, .rc-heartbeat, .rc-tremble, .rc-scanbar, .rc-twinkle, .rc-zz text, .rc-eq rect, .rc-ring circle, .rc-jet ellipse, .rc-p, .rc-trail, .rc-scanline, .rc-beam line, .rc-beam circle { animation:none !important; }
}
@media print { .rc-rey, .rc-bubble, .rc-dock, .rc-beam, .rc-tourbar, .rc-fx { display:none !important; } }
