/* Virtual Lorcan — shared styles. Design tokens from README §8. */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,500;9..144,600;9..144,700&family=Geist:wght@400;500;600;700&family=Geist+Mono:wght@400;500&display=swap');

:root {
  --canvas:#FBFAF7; --surface:#FFFFFF; --ink:#1C1917; --muted:#57534e;
  --border:#EFEDE7; --accent:#047857; --grad:linear-gradient(180deg,#059669,#047857);
  --soft:rgba(4,120,87,.13); --ring:rgba(4,120,87,.4); --avatarBg:#0F2A22; --btnText:#fff;
  --panelGreenBg:#F0FDF4; --panelGreenBd:#BBF7D0; --panelGreenFg:#16A34A;
}
[data-theme="terracotta"]{
  --canvas:#FBF6F2; --surface:#FFFFFF; --ink:#1C1917; --muted:#6f6058;
  --border:#F1E7E0; --accent:#C2410C; --grad:linear-gradient(180deg,#EA580C,#C2410C);
  --soft:rgba(194,65,12,.12); --ring:rgba(194,65,12,.4); --avatarBg:#2A1710; --btnText:#fff;
}
[data-theme="midnight"]{
  --canvas:#0B1220; --surface:rgba(255,255,255,.04); --ink:#F8FAFC; --muted:#94A3B8;
  --border:rgba(255,255,255,.1); --accent:#F59E0B; --grad:linear-gradient(180deg,#FBBF24,#F59E0B);
  --soft:rgba(245,158,11,.16); --ring:rgba(245,158,11,.5); --avatarBg:#1E293B; --btnText:#1C1408;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;height:100%}
body{font-family:'Geist',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;background:var(--canvas);color:var(--ink);-webkit-font-smoothing:antialiased}
::placeholder{color:#94A3B8}
button{font-family:inherit}
a{color:inherit}
.mono{font-family:'Geist Mono',ui-monospace,monospace}
.disp{font-family:'Fraunces',Georgia,serif}

.scroll::-webkit-scrollbar{width:8px}
.scroll::-webkit-scrollbar-thumb{background:#E2E8F0;border-radius:8px}
.scroll::-webkit-scrollbar-track{background:transparent}

@keyframes vlblink{0%,80%,100%{opacity:.25;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}
@keyframes vlfade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@keyframes vlpop{from{opacity:0;transform:scale(.97)}to{opacity:1;transform:scale(1)}}
@keyframes vlrise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
@keyframes vlring{0%,100%{transform:scale(1);opacity:.55}50%{transform:scale(1.09);opacity:.18}}
.rise{animation:vlrise .6s cubic-bezier(.22,1,.36,1) both}
.fade{animation:vlfade .35s ease both}

/* markdown */
.md h1{font-size:19px;font-weight:700;letter-spacing:-.01em;margin:2px 0 12px;line-height:1.25}
.md h2{font-size:15px;font-weight:600;letter-spacing:-.01em;margin:20px 0 8px}
.md h3{font-size:13.5px;font-weight:600;margin:14px 0 6px}
.md p{margin:0 0 10px;line-height:1.6}
.md ul{margin:0 0 12px;padding-left:18px}
.md li{margin:0 0 5px;line-height:1.55}
.md strong{font-weight:600}
.md hr{border:none;border-top:1px solid #E2E8F0;margin:16px 0}

/* responsive: collapse the side columns on narrow screens */
@media (max-width:820px){
  .vl-side,.vl-panel{display:none!important}
  .vl-only-mobile{display:flex!important}
}

@media (prefers-reduced-motion: reduce){
  *{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
}
