@font-face{font-family:Fredoka;font-style:normal;font-weight:400;font-display:swap;src:url(fonts/fredoka-hebrew-400.woff2) format("woff2");unicode-range:U+0307-0308,U+0590-05FF,U+200C-2010,U+20AA,U+25CC,U+FB1D-FB4F}
@font-face{font-family:Fredoka;font-style:normal;font-weight:400;font-display:swap;src:url(fonts/fredoka-latin-400.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Fredoka;font-style:normal;font-weight:600;font-display:swap;src:url(fonts/fredoka-hebrew-600.woff2) format("woff2");unicode-range:U+0307-0308,U+0590-05FF,U+200C-2010,U+20AA,U+25CC,U+FB1D-FB4F}
@font-face{font-family:Fredoka;font-style:normal;font-weight:600;font-display:swap;src:url(fonts/fredoka-latin-600.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Fredoka;font-style:normal;font-weight:700;font-display:swap;src:url(fonts/fredoka-hebrew-700.woff2) format("woff2");unicode-range:U+0307-0308,U+0590-05FF,U+200C-2010,U+20AA,U+25CC,U+FB1D-FB4F}
@font-face{font-family:Fredoka;font-style:normal;font-weight:700;font-display:swap;src:url(fonts/fredoka-latin-700.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
:root{--wall:#FBEFCF;--ink:#1E2328;--mute:#5B6168;--pk:#FFFFFF;--me:#D3ECFF;--brand:#B5361F;--brandD:#8F2814;--tick:#1D6FB8;--line:#E6D7AE}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;color:var(--ink);font:400 17px/1.5 Fredoka,system-ui,sans-serif;background:var(--wall) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260' viewBox='0 0 260 260'%3E%3Cg fill='none' stroke='#E8CC85' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 52c0-16 12-28 28-28s28 12 28 28z'/%3E%3Ccircle cx='34' cy='42' r='5'/%3E%3Ccircle cx='48' cy='38' r='5'/%3E%3Ccircle cx='60' cy='44' r='4'/%3E%3Cpath d='M22 52l6 14h36l6-14'/%3E%3Cg transform='translate(150 20)'%3E%3Ccircle cx='12' cy='50' r='9'/%3E%3Ccircle cx='62' cy='50' r='9'/%3E%3Cpath d='M12 50h22l14-26h10M48 24l-4-10h-8M34 50l10-14h18'/%3E%3C/g%3E%3Cg transform='translate(30 140)'%3E%3Cpath d='M8 0h64v40H8zM8 40v34M72 40v34M0 74h80'/%3E%3Cpath d='M14 52v22M24 52v22M34 52v22M44 52v22M54 52v22M64 52v22M8 52h64'/%3E%3Cpath d='M40 0v40'/%3E%3C/g%3E%3Cg transform='translate(170 120)'%3E%3Cpath d='M30 90V30c0-10 16-10 16 0v60M30 56H18c-8 0-8-14 0-14h0M46 46h12c8 0 8-14 0-14'/%3E%3Cpath d='M14 90h48'/%3E%3Ccircle cx='38' cy='22' r='2'/%3E%3C/g%3E%3Cg transform='translate(120 200) rotate(-20)'%3E%3Cellipse cx='14' cy='14' rx='13' ry='15'/%3E%3Cpath d='M14 29v18'/%3E%3Cellipse cx='60' cy='14' rx='13' ry='15'/%3E%3Cpath d='M60 29v18'/%3E%3Ccircle cx='37' cy='4' r='4'/%3E%3C/g%3E%3Cpath d='M110 110l6 6M116 110l-6 6M230 230l6 6M236 230l-6 6M100 60h0M226 80h0'/%3E%3C/g%3E%3C/svg%3E") repeat;background-size:260px;overflow-x:hidden}
a{color:inherit}
p{margin:0}
h1,h2{margin:0}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;top:-60px;right:12px;z-index:50;background:var(--ink);color:#fff;padding:10px 14px;border-radius:10px;text-decoration:none;font-weight:600}
.skip:focus{top:12px}
:focus-visible{outline:3px solid var(--tick);outline-offset:3px;border-radius:6px}
.chat:focus{outline:none}
.ava{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--brand);flex:none}
.ava svg{width:62%;height:62%;fill:#fff}
.ava--xl{width:92px;height:92px}
.ava--sm{width:22px;height:22px;vertical-align:-5px;margin-inline-end:6px}
/* layout */
.app{max-width:1180px;margin:0 auto;display:flex;flex-direction:column-reverse}
.chat{position:relative;width:100%;max-width:640px;margin:0 auto;display:flex;flex-direction:column;min-height:100vh}
.chat__head{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:12px;padding:10px 14px;background:var(--brand);color:#fff}
.chat__name{font-weight:700;font-size:19px;line-height:1.1}
.chat__st{font-size:13px;opacity:.92}
.log{list-style:none;margin:0;padding:14px 12px 20px;display:flex;flex-direction:column;gap:6px;flex:1}
.chip{align-self:center;margin:6px 0 8px}
.chip span{display:inline-block;background:#FFF8E6;border:1px solid var(--line);padding:3px 12px;border-radius:8px;font-size:13px;color:var(--mute);font-weight:600}
.sys{align-self:center;text-align:center;max-width:88%;margin-bottom:6px}
.sys span{display:inline-block;background:#FFF3C4;padding:6px 12px;border-radius:8px;font-size:14px;color:#4A4F55}
.sys--note{margin-top:14px}
.b{position:relative;max-width:84%;padding:8px 12px 20px;border-radius:14px;box-shadow:0 1px 0 rgba(30,35,40,.12);word-wrap:break-word}
.b p{font-size:17px}
.b--pk{align-self:flex-start;background:var(--pk);border-start-start-radius:4px}
.b--me{align-self:flex-end;background:var(--me);border-start-end-radius:4px}
.b--pk+.b--me,.b--me+.b--pk{margin-top:8px}
.t{position:absolute;bottom:4px;inset-inline-end:10px;font-size:11.5px;color:var(--mute);direction:ltr;display:flex;gap:4px;align-items:center}
.ticks{font-style:normal;color:var(--tick);letter-spacing:-3px;font-size:12px;padding-right:3px}
.b--list ul{margin:6px 0 0;padding:0 18px 0 0}
.b--list li{margin:3px 0}
.b--list li::marker{content:"✔︎  ";color:var(--brand)}
/* link previews */
.b--works{max-width:94%;padding-bottom:22px}
.links{list-style:none;margin:10px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.lp{display:block;text-decoration:none;background:#F3F5F7;border-radius:10px;overflow:hidden;border-inline-start:4px solid var(--brand);height:100%}
.lp img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover;object-position:top}
.lp__b{display:block;padding:6px 8px 8px}
.lp__t{display:block;font-weight:600;font-size:15px;line-height:1.2}
.lp__d{display:block;font-size:12.5px;color:var(--mute);margin-top:2px}
.lp__u{display:block;font-size:12px;color:var(--tick);direction:ltr;text-align:right;margin-top:2px}
.lp:hover .lp__t{text-decoration:underline}
/* voice note */
.b--voice{min-width:250px}
.vn{display:flex;align-items:center;gap:10px;padding-top:4px}
.vn__play{width:34px;height:34px;border-radius:50%;background:var(--brand);position:relative;flex:none}
.vn__play::after{content:"";position:absolute;top:10px;left:13px;border-style:solid;border-width:7px 0 7px 11px;border-color:transparent transparent transparent #fff}
.vn__wave{width:150px;height:26px;flex:1}
.vn__wave rect{fill:#7FA6C6}
.vn__wave rect.on{fill:var(--tick)}
.vn__len{font-size:12.5px;color:var(--mute);direction:ltr}
.vn__tx{font-size:14.5px!important;color:#3E454C;margin-top:6px;border-top:1px dashed #A9C9E3;padding-top:6px}
.vn__lbl{font-weight:600}
/* typing */
.typing{align-self:flex-start;display:flex;align-items:center;gap:8px;margin-top:8px}
.dots{background:#fff;border-radius:14px;border-start-start-radius:4px;padding:12px 14px;display:inline-flex;gap:4px;box-shadow:0 1px 0 rgba(30,35,40,.12)}
.dots i{width:7px;height:7px;border-radius:50%;background:#8A9097;animation:dot 1.2s infinite}
.dots i:nth-child(2){animation-delay:.15s}.dots i:nth-child(3){animation-delay:.3s}
@keyframes dot{0%,60%,100%{transform:none;opacity:.5}30%{transform:translateY(-4px);opacity:1}}
.typing__lbl{font-size:13px;color:var(--mute);font-style:italic}
/* composer */
.composer{position:sticky;bottom:0;z-index:10;padding:8px 10px calc(8px + env(safe-area-inset-bottom));background:rgba(251,239,207,.94);backdrop-filter:blur(6px);border-top:1px solid var(--line)}
.composer__in{display:flex;align-items:center;gap:10px;text-decoration:none}
.composer__txt{flex:1;min-width:0;background:#fff;border-radius:24px;padding:12px 16px;font-size:16px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-shadow:inset 0 0 0 1px var(--line)}
.composer__send{width:48px;height:48px;border-radius:50%;background:var(--brand);display:grid;place-items:center;flex:none;transition:background .15s}
.composer__send svg{width:22px;height:22px;fill:#fff;transform:scaleX(-1)}
.composer__in:hover .composer__send{background:var(--brandD)}
.composer__hint{text-align:center;font-size:12.5px;color:var(--mute);margin-top:4px}
/* side */
.side{padding:8px 14px 8px}
.side__card{background:#fff;border-radius:18px;box-shadow:0 1px 0 rgba(30,35,40,.12);overflow:hidden;max-width:640px;margin:0 auto}
.side__id{text-align:center;padding:24px 18px 18px;border-bottom:8px solid #F6EEDA}
.side__name{font-size:28px;font-weight:700;margin-top:10px}
.side__sub{color:var(--mute);font-size:15px}
.pill{display:inline-block;margin-top:14px;background:var(--brand);color:#fff;text-decoration:none;font-weight:600;padding:9px 22px;border-radius:24px}
.pill:hover{background:var(--brandD)}
.side__facts{margin:0;padding:6px 18px;border-bottom:8px solid #F6EEDA}
.side__facts div{padding:10px 0;border-bottom:1px solid #EFE7D2}
.side__facts div:last-child{border-bottom:0}
.side__facts dt{font-size:13px;color:var(--brand);font-weight:600}
.side__facts dd{margin:0;font-size:16px}
.side__h{padding:14px 18px 8px;font-size:14px;color:var(--mute);font-weight:600}
.side__grid{list-style:none;margin:0;padding:0 18px 18px;display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.side__grid a{display:block;border-radius:8px;overflow:hidden}
.side__grid img{display:block;width:100%;aspect-ratio:1;object-fit:cover;object-position:top}
/* foot */
.foot{max-width:640px;margin:0 auto;padding:22px 16px 36px;text-align:center;font-size:14px;color:var(--ink);display:grid;gap:6px}
.foot__logo{font-weight:700}
.foot__note{font-weight:600}
@media(min-width:560px){.links{grid-template-columns:1fr 1fr 1fr}}
@media(min-width:1000px){
 body{padding:28px 24px 0}
 .app{flex-direction:row;gap:28px;align-items:flex-start}
 .side{display:block;position:sticky;top:28px;width:360px;flex:none;padding:0}
 .chat{max-width:none;flex:1;min-height:auto;border-radius:18px;overflow:clip;box-shadow:0 2px 0 rgba(30,35,40,.08),0 0 0 1px var(--line);background:rgba(251,239,207,.55)}
 .log{padding:20px 28px 26px}
 .b{max-width:70%}
 .b--works{max-width:88%}
 .links{grid-template-columns:repeat(4,1fr)}
 .composer{border-radius:0 0 18px 18px;padding:12px 20px}
 .foot{max-width:1180px}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
img{max-width:100%;height:auto}
.lp img,.side__grid img{height:auto}