/* Byte on the marketing site: a ◆ button bottom-right and a Classic window-card chat sheet. */
.byte-fab{position:fixed;right:18px;bottom:18px;z-index:60;display:inline-flex;align-items:center;gap:8px;font:700 14px var(--display);background:var(--lime);color:var(--lime-ink);border:1px solid var(--line);border-radius:9px;padding:9px 14px 9px 10px;cursor:pointer;box-shadow:2px 2px 0 var(--line);transition:transform var(--fast) var(--ease),box-shadow var(--fast)}
.byte-fab:hover{transform:translate(-1px,-1px);box-shadow:3px 3px 0 var(--line)}
.byte-fab:active{transform:translate(2px,2px);box-shadow:0 0 0 var(--line)}
.byte-fab .mark{width:20px;height:20px;font-size:13px}
.byte-fab[aria-expanded="true"]{display:none}

.byte{position:fixed;right:18px;bottom:18px;z-index:61;width:min(380px,calc(100vw - 24px));max-height:min(620px,calc(100vh - 36px));display:flex;flex-direction:column;background:var(--win);border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow);overflow:hidden;animation:byte-rise var(--mid) var(--ease)}
@keyframes byte-rise{from{opacity:0;transform:translateY(8px) scale(.98)}}
.byte[hidden]{display:none !important}
.byte .tb{height:28px;display:flex;align-items:center;gap:8px;padding:0 7px;background:var(--win-2);border-bottom:1px solid var(--line);user-select:none;flex:none}
.byte .tb .box{width:13px;height:13px;border:1px solid var(--line);background:var(--win);border-radius:3px;flex:none}
.byte .tb .stripes{flex:1;height:12px;background:repeating-linear-gradient(180deg,var(--line) 0 1px,transparent 1px 3px);opacity:.55;border-radius:1px}
.byte .tb .title{font-family:var(--display);font-weight:700;font-size:13px;padding:0 10px;white-space:nowrap;display:flex;align-items:center;gap:6px}
.byte .tb .title .mark{width:16px;height:16px;font-size:10px}
.byte-close{width:13px;height:13px;border:1px solid var(--line);background:var(--win);border-radius:3px;padding:0;cursor:pointer;flex:none;display:grid;place-items:center;font:700 10px/1 var(--mono);color:var(--ink)}
.byte-close:hover{background:var(--lime)}
.byte-log{flex:1;overflow:auto;padding:12px;display:flex;flex-direction:column;gap:10px;background:var(--paper-2);min-height:160px}
.byte-msg{max-width:88%;font-size:14.5px;line-height:1.45;padding:9px 12px;border:1px solid var(--line);border-radius:9px;background:var(--win);box-shadow:1px 1px 0 var(--hair);white-space:pre-wrap;word-break:break-word}
.byte-msg.me{align-self:flex-end;background:var(--lime);color:var(--lime-ink);border-bottom-right-radius:3px}
.byte-msg.bot{align-self:flex-start;border-bottom-left-radius:3px}
.byte-msg.bot.thinking{color:var(--muted);font-family:var(--mono);font-size:12.5px}
.byte-msg.err{border-color:#b3261e;color:#b3261e}
.byte-links{display:flex;flex-wrap:wrap;gap:6px;max-width:88%}
.byte-chip{font:600 12.5px var(--display);border:1px solid var(--line);border-radius:7px;padding:5px 10px;background:var(--win);color:var(--ink);cursor:pointer;box-shadow:1px 1px 0 var(--line);transition:transform var(--fast) var(--ease),box-shadow var(--fast)}
.byte-chip:hover{transform:translate(-1px,-1px);box-shadow:2px 2px 0 var(--line)}
.byte-chip:active{transform:translate(1px,1px);box-shadow:0 0 0 var(--line)}
.byte-chip.link::before{content:"→ ";color:var(--muted)}
.byte-sugg{display:flex;flex-wrap:wrap;gap:6px;padding:0 12px 10px;background:var(--paper-2);flex:none}
.byte-form{display:flex;gap:8px;padding:10px;border-top:1px solid var(--line);background:var(--win);flex:none}
.byte-form input{flex:1;min-width:0;font:400 15px var(--body);color:var(--ink);background:var(--win);border:1px solid var(--line);border-radius:7px;padding:9px 11px}
.byte-form input:focus{outline:2px solid var(--lime);outline-offset:1px}
.byte-form .btn{padding:8px 14px}
.byte-hp{position:absolute;left:-9999px;top:-9999px;height:0;width:0;overflow:hidden}
.byte-foot{font:11px var(--mono);color:var(--muted);padding:0 12px 8px;background:var(--win);flex:none;letter-spacing:.04em}

/* lime spotlight on a section Byte navigated to */
.byte-spot{outline:2px solid var(--lime);outline-offset:8px;border-radius:10px;box-shadow:0 0 0 6px var(--lime-soft),0 0 28px var(--lime);animation:byte-pulse 1s ease-in-out 3}
@keyframes byte-pulse{50%{box-shadow:0 0 0 6px transparent,0 0 0 var(--lime)}}
.byte-spot-field{outline:2px solid var(--lime) !important;outline-offset:2px;box-shadow:0 0 0 4px var(--lime-soft)}

@media (max-width:600px){
  .byte{right:8px;bottom:8px;left:8px;width:auto;max-height:calc(100vh - 16px)}
  .byte-fab{right:12px;bottom:12px}
  .byte-msg{max-width:94%}
}
@media (prefers-reduced-motion:reduce){.byte{animation:none}.byte-spot{animation:none}}