/* vietnamese */
@font-face {
  font-family: 'Bungee';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/font-01.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Bungee';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/font-02.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Bungee';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/font-03.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;
}
/* latin */
@font-face {
  font-family: 'Cabin Sketch';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/font-04.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;
}
/* latin */
@font-face {
  font-family: 'Cabin Sketch';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/font-05.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;
}
/* cyrillic-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/font-06.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/font-07.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/font-08.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/font-09.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/font-10.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/font-11.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;
}
/* cyrillic-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/font-12.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/font-13.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/font-14.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/font-15.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/font-16.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/font-17.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;
}
/* cyrillic-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("fonts/font-12.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("fonts/font-13.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("fonts/font-14.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("fonts/font-15.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("fonts/font-16.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("fonts/font-17.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;
}
/* cyrillic-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/font-12.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/font-13.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/font-14.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/font-15.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/font-16.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/font-17.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;
}
/* cyrillic-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("fonts/font-12.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("fonts/font-13.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("fonts/font-14.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("fonts/font-15.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("fonts/font-16.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("fonts/font-17.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;
}


/* ============================================================
   kafana.dev — "Phosphor Tavern"
   A Serbian kafana that runs on a CRT. rakija + bash + beer.
   ============================================================ */

:root{
  /* --- the warm side: tavern, wood, lamplight --- */
  --bg:        #0c0a07;
  --bg-2:      #14100a;
  --wood:      #2a1c10;
  --wood-2:    #4a3018;
  --amber:     #e6a534;
  --amber-hi:  #ffc658;
  --rakija:    #db8722;
  --copper:    #c07b3a;
  --foam:      #f4e9cc;

  /* --- the cold side: CRT, phosphor, terminal --- */
  --phosphor:     #36f08a;
  --phosphor-dim: #1c7a48;
  --cyan:         #3ad6e6;

  /* --- neon signage --- */
  --neon:      #ff513a;   /* hero accent — neon red/orange */
  --neon-glow: #ff7a4d;

  /* --- ink --- */
  --ink:     #efe6d2;
  --ink-dim: #b1a384;
  --ink-faint:#6f6450;

  /* tunable via Tweaks */
  --accent: var(--neon);
  --accent-glow: var(--neon-glow);
  --screen: var(--phosphor);
  --screen-dim: var(--phosphor-dim);

  --maxw: 1180px;
  --mono: 'JetBrains Mono', ui-monospace, monospace;
  --sign: 'Bungee', sans-serif;
  --chalk: 'Cabin Sketch', cursive;
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }

body{
  margin:0;
  background:
    radial-gradient(120% 80% at 50% -10%, rgba(230,165,52,.10), transparent 60%),
    radial-gradient(140% 100% at 50% 110%, rgba(219,135,34,.06), transparent 55%),
    var(--bg);
  color:var(--ink);
  font-family:var(--mono);
  font-size:16px;
  line-height:1.6;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}

/* faint wood-grain + paper noise over everything */
body::before{
  content:"";
  position:fixed; inset:0; z-index:0; pointer-events:none;
  background-image:
    repeating-linear-gradient(94deg, rgba(74,48,24,.05) 0 2px, transparent 2px 7px),
    repeating-linear-gradient(0deg, rgba(0,0,0,.18) 0 1px, transparent 1px 4px);
  opacity:.5;
  mix-blend-mode:overlay;
}

/* CRT scanline + flicker overlay (toggle via .crt-off on body) */
#crt{
  position:fixed; inset:0; z-index:60; pointer-events:none;
  background:
    repeating-linear-gradient(0deg, rgba(0,0,0,.16) 0 1px, transparent 1px 3px);
  mix-blend-mode:multiply;
  opacity:.55;
  animation:crtflicker 5s steps(60) infinite;
}
#crt::after{
  content:""; position:absolute; inset:0;
  background:radial-gradient(120% 120% at 50% 50%, transparent 60%, rgba(0,0,0,.45) 100%);
}
body.crt-off #crt{ display:none; }
@keyframes crtflicker{
  0%,100%{ opacity:.5 } 50%{ opacity:.58 } 51%{ opacity:.42 }
}

/* atmosphere canvases sit behind content */
canvas.fx{ position:fixed; inset:0; z-index:1; pointer-events:none; }
#rain{ opacity:.0; transition:opacity 1.2s ease; }
body.rain-on #rain{ opacity:.22; }

main{ position:relative; z-index:2; }

/* ---------- shared layout ---------- */
.wrap{ max-width:var(--maxw); margin:0 auto; padding:0 28px; }
section{ position:relative; }
.eyebrow{
  font-size:.72rem; letter-spacing:.32em; text-transform:uppercase;
  color:var(--accent); font-weight:700;
  display:flex; align-items:center; gap:.7em;
}
.eyebrow::before{ content:""; width:26px; height:2px; background:var(--accent); box-shadow:0 0 8px var(--accent-glow); }

a{ color:inherit; }

/* ============================================================
   TOP BAR
   ============================================================ */
.topbar{
  position:fixed; top:0; left:0; right:0; z-index:50;
  display:flex; align-items:center; justify-content:space-between;
  gap:16px; padding:10px 20px;
  font-size:.74rem; letter-spacing:.08em;
  background:linear-gradient(180deg, rgba(12,10,7,.92), rgba(12,10,7,.55) 70%, transparent);
  backdrop-filter:blur(3px);
  color:var(--ink-dim);
}
.topbar .brand{ display:flex; align-items:center; gap:9px; color:var(--ink); font-weight:700; letter-spacing:.04em; }
.topbar .dot{ width:9px; height:9px; border-radius:50%; background:var(--screen);
  box-shadow:0 0 10px var(--screen); animation:pulse 2.2s infinite; }
@keyframes pulse{ 0%,100%{opacity:1} 50%{opacity:.35} }
.topbar .open-sign{
  color:var(--screen); font-weight:700; letter-spacing:.18em;
  text-shadow:0 0 10px var(--screen-dim);
}
.topbar .right{ display:flex; align-items:center; gap:18px; }
.topbar .uptime b{ color:var(--amber-hi); font-weight:700; }
@media(max-width:680px){ .topbar .uptime, .topbar .right .lat{ display:none; } }

/* ============================================================
   HERO
   ============================================================ */
.hero{
  min-height:100svh;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center; padding:120px 20px 70px;
  overflow:hidden;
}

/* swinging hanging sign */
.sign-rig{ display:flex; flex-direction:column; align-items:center; transform-origin:top center;
  animation:sway 6s ease-in-out infinite; }
@keyframes sway{ 0%,100%{transform:rotate(-1.1deg)} 50%{transform:rotate(1.1deg)} }
.chains{ display:flex; gap:230px; height:34px; }
.chains span{ width:3px; height:100%; background:
  repeating-linear-gradient(0deg, var(--copper) 0 4px, #1c130a 4px 7px); border-radius:2px;
  box-shadow:0 0 6px rgba(0,0,0,.6); }

.sign{
  position:relative;
  border:3px solid var(--wood-2);
  background:
    linear-gradient(180deg, rgba(42,28,16,.96), rgba(20,13,7,.98));
  border-radius:14px;
  padding:30px 46px 34px;
  box-shadow:0 18px 50px rgba(0,0,0,.6), inset 0 0 0 2px rgba(192,123,58,.25);
}
.sign .bolts{ position:absolute; inset:8px; pointer-events:none; }
.sign .bolts i{ position:absolute; width:8px; height:8px; border-radius:50%;
  background:radial-gradient(circle at 35% 30%, #d7a45c, #5a3d22); box-shadow:0 1px 2px rgba(0,0,0,.6); }
.sign .bolts i:nth-child(1){ top:0; left:0 } .sign .bolts i:nth-child(2){ top:0; right:0 }
.sign .bolts i:nth-child(3){ bottom:0; left:0 } .sign .bolts i:nth-child(4){ bottom:0; right:0 }

.neon{
  font-family:var(--sign);
  font-size:clamp(3.1rem, 12vw, 8.2rem);
  line-height:.92;
  color:#fff3e0;
  letter-spacing:.02em;
  text-transform:lowercase;
  margin:0;
  filter:drop-shadow(0 0 2px var(--accent));
}
.neon .k{
  color:var(--accent);
  text-shadow:
    0 0 6px var(--accent-glow), 0 0 16px var(--accent-glow),
    0 0 40px var(--accent), 0 0 80px var(--accent);
  animation:flicker 7s infinite;
}
.neon .dev{
  color:var(--screen);
  text-shadow:0 0 6px var(--screen), 0 0 22px var(--screen-dim), 0 0 50px var(--screen-dim);
  font-size:.42em;
  vertical-align:.42em;
  animation:flicker2 9s infinite;
}
@keyframes flicker{
  0%,18%,22%,25%,53%,57%,100%{ opacity:1 }
  19%,24%,55%{ opacity:.45 } 20%{ opacity:.85 }
}
@keyframes flicker2{
  0%,40%,43%,100%{ opacity:1 } 41%,42%{ opacity:.3 } 70%,72%{ opacity:.6 }
}
.sign .cyr{
  font-family:var(--mono); font-weight:800; letter-spacing:.42em;
  font-size:clamp(.62rem,1.6vw,.92rem); text-transform:uppercase;
  color:var(--amber); margin-top:10px; opacity:.85;
}

.tagline{
  margin:30px auto 0; max-width:680px;
  font-size:clamp(1rem,2.4vw,1.32rem); color:var(--ink); line-height:1.55;
  text-wrap:balance;
}
.tagline code{
  color:var(--screen); background:rgba(54,240,138,.08);
  border:1px solid rgba(54,240,138,.2); border-radius:5px; padding:.05em .4em;
}

/* boot/motd strip */
.motd{
  margin:34px auto 0; width:min(640px, 92vw); text-align:left;
  background:rgba(6,5,3,.72); border:1px solid rgba(192,123,58,.28);
  border-radius:10px; padding:14px 16px 16px;
  font-size:.82rem; line-height:1.7; color:var(--ink-dim);
  box-shadow:0 14px 40px rgba(0,0,0,.5), inset 0 0 60px rgba(54,240,138,.03);
}
.motd .ln{ white-space:pre-wrap; }
.motd .g{ color:var(--screen); } .motd .a{ color:var(--amber-hi); } .motd .n{ color:var(--accent); }
.motd .cursor{ display:inline-block; width:9px; height:1.05em; background:var(--screen);
  vertical-align:-2px; margin-left:2px; animation:blink 1s steps(1) infinite; }
@keyframes blink{ 50%{ opacity:0 } }

.cta{ display:flex; gap:14px; margin-top:34px; flex-wrap:wrap; justify-content:center; }
.btn{
  font-family:var(--mono); font-weight:700; font-size:.92rem;
  padding:13px 22px; border-radius:10px; cursor:pointer;
  border:1px solid transparent; text-decoration:none;
  display:inline-flex; align-items:center; gap:9px;
  transition:transform .12s ease, box-shadow .2s ease, background .2s;
}
.btn:hover{ transform:translateY(-2px); }
.btn-primary{
  background:linear-gradient(180deg, var(--accent), #c23a26);
  color:#fff; box-shadow:0 0 0 1px rgba(255,122,77,.4), 0 10px 26px rgba(255,81,58,.32);
}
.btn-primary:hover{ box-shadow:0 0 0 1px rgba(255,122,77,.6), 0 14px 34px rgba(255,81,58,.45); }
.btn-ghost{
  background:rgba(54,240,138,.06); color:var(--screen);
  border-color:rgba(54,240,138,.35); box-shadow:inset 0 0 24px rgba(54,240,138,.05);
}
.btn-ghost:hover{ background:rgba(54,240,138,.12); }

.scroll-hint{ margin-top:54px; color:var(--ink-faint); font-size:.72rem; letter-spacing:.2em;
  display:flex; flex-direction:column; align-items:center; gap:8px; animation:bob 2.4s ease-in-out infinite; }
@keyframes bob{ 0%,100%{transform:translateY(0)} 50%{transform:translateY(6px)} }

/* steaming coffee, bottom-left flourish */
.steam-cup{ position:absolute; left:max(24px,4vw); bottom:36px; z-index:3; opacity:.9; }
@media(max-width:760px){ .steam-cup{ display:none; } }

/* ============================================================
   SECTION HEADERS
   ============================================================ */
.sec-head{ display:flex; flex-direction:column; gap:14px; margin-bottom:38px; }
.sec-head h2{
  font-family:var(--sign); font-size:clamp(1.8rem,5vw,3.1rem); margin:0; line-height:1;
  color:var(--foam); letter-spacing:.01em;
}
.sec-head p{ color:var(--ink-dim); max-width:620px; margin:0; }

/* ============================================================
   MENI — chalkboard
   ============================================================ */
.meni{ padding:96px 0 100px; }
.board{
  background:
    radial-gradient(120% 140% at 30% 0%, #14352a, #0b201a 70%);
  border:14px solid #3a2615;
  border-radius:10px;
  box-shadow:
    0 30px 70px rgba(0,0,0,.55),
    inset 0 0 120px rgba(0,0,0,.55),
    inset 0 0 0 2px rgba(255,255,255,.02);
  padding:48px clamp(26px,5vw,70px) 54px;
  position:relative;
  outline:2px solid #5a3d22; outline-offset:-9px;
}
.board::after{ /* chalk dust smudge */
  content:""; position:absolute; inset:0; border-radius:4px; pointer-events:none;
  background:radial-gradient(70% 50% at 80% 90%, rgba(244,233,204,.05), transparent 60%),
            radial-gradient(50% 40% at 15% 20%, rgba(244,233,204,.04), transparent 60%);
}
.board-title{
  font-family:var(--chalk); font-weight:700; text-align:center;
  font-size:clamp(2.4rem,7vw,4.4rem); color:var(--foam); margin:0 0 6px;
  text-shadow:0 0 1px rgba(244,233,204,.5);
}
.board-sub{ font-family:var(--chalk); text-align:center; color:#bcd; font-size:1.3rem; margin:0 0 36px; opacity:.8; }

.meni-grid{ display:grid; grid-template-columns:1fr 1fr; gap:30px 56px; }
@media(max-width:760px){ .meni-grid{ grid-template-columns:1fr; } }
.meni-cat h3{
  font-family:var(--chalk); font-size:1.9rem; color:var(--amber-hi); margin:0 0 14px;
  border-bottom:2px dashed rgba(244,233,204,.25); padding-bottom:6px;
  text-shadow:0 0 8px rgba(255,198,88,.25);
}
.dish{ display:grid; grid-template-columns:1fr auto; gap:4px 12px; margin-bottom:16px; align-items:baseline; }
.dish .nm{ font-weight:700; color:var(--foam); }
.dish .pr{ font-family:var(--chalk); font-size:1.35rem; color:var(--screen); white-space:nowrap;
  text-shadow:0 0 8px var(--screen-dim); }
.dish .ds{ grid-column:1/-1; font-size:.82rem; color:#9fb3ab; line-height:1.45; }
.dish .nm .tag{ font-size:.62rem; letter-spacing:.12em; text-transform:uppercase; color:var(--neon);
  border:1px solid currentColor; border-radius:4px; padding:1px 5px; margin-left:8px; vertical-align:middle; }

/* ============================================================
   TERMINAL — pull up a stool
   ============================================================ */
.stool{ padding:90px 0 100px; }
.term-shell{
  background:linear-gradient(180deg,#0a0d0b,#070908);
  border:1px solid rgba(54,240,138,.22);
  border-radius:14px;
  box-shadow:0 30px 80px rgba(0,0,0,.6), inset 0 0 120px rgba(54,240,138,.04);
  overflow:hidden;
  max-width:880px; margin:0 auto;
}
.term-bar{
  display:flex; align-items:center; gap:8px; padding:11px 15px;
  background:linear-gradient(180deg,#141a16,#0d110f);
  border-bottom:1px solid rgba(54,240,138,.14);
}
.term-bar .tl{ width:12px; height:12px; border-radius:50%; }
.tl.r{ background:#ff5f57 } .tl.y{ background:#febc2e } .tl.g{ background:#28c840 }
.term-bar .ttl{ margin-left:10px; color:var(--ink-dim); font-size:.78rem; letter-spacing:.04em; }
.term-bar .hint{ margin-left:auto; color:var(--ink-faint); font-size:.72rem; }
.term-body{
  height:430px; overflow-y:auto; padding:18px 20px 8px;
  font-size:.86rem; line-height:1.55; color:var(--screen);
  background:radial-gradient(120% 120% at 50% 0%, rgba(54,240,138,.05), transparent 60%);
  scrollbar-width:thin; scrollbar-color:var(--screen-dim) transparent;
}
.term-body::-webkit-scrollbar{ width:8px } .term-body::-webkit-scrollbar-thumb{ background:var(--screen-dim); border-radius:4px }
.term-line{ white-space:pre-wrap; word-break:break-word; }
.term-line .pmt{ color:var(--amber-hi); } .term-line .pmt .u{ color:var(--screen); }
.term-line.dim{ color:var(--ink-dim); } .term-line.amber{ color:var(--amber-hi); }
.term-line.neon{ color:var(--accent); } .term-line.cyan{ color:var(--cyan); }
.term-line.foam{ color:var(--foam); }
.term-line a{ color:var(--cyan); text-decoration:underline; }
.term-input-row{ display:flex; align-items:baseline; gap:8px; padding:6px 20px 18px; }
.term-input-row .pmt{ color:var(--amber-hi); white-space:nowrap; }
.term-input-row .pmt .u{ color:var(--screen); }
#term-input{
  flex:1; background:transparent; border:0; outline:0; color:var(--screen);
  font-family:var(--mono); font-size:.86rem; caret-color:var(--screen);
}
.term-ascii{ color:var(--screen); line-height:1.15; font-size:.8rem; white-space:pre; }
.neofetch{ display:flex; gap:20px; flex-wrap:wrap; }
.neofetch pre{ margin:0; color:var(--amber-hi); }
.neofetch .info b{ color:var(--accent); }

/* ============================================================
   BARTENDER + future teaser
   ============================================================ */
.bar{ padding:80px 0 90px; }
.bar-grid{ display:grid; grid-template-columns:auto 1fr; gap:50px; align-items:center; }
@media(max-width:760px){ .bar-grid{ grid-template-columns:1fr; gap:34px; text-align:center; } }
.tux-stage{ position:relative; display:flex; justify-content:center; padding-top:54px; }
.tux-ascii{
  font-size:.78rem; line-height:1.02; white-space:pre; color:var(--foam);
  text-shadow:0 0 14px rgba(244,233,204,.12);
  font-family:var(--mono); font-weight:700;
}
.tux-bubble{
  position:absolute; top:6px; right:-6px;
  background:var(--foam); color:#1a120a; font-weight:700; font-size:.78rem;
  padding:8px 12px; border-radius:10px; max-width:190px;
  box-shadow:0 8px 22px rgba(0,0,0,.4);
}
.tux-bubble::after{ content:""; position:absolute; bottom:-7px; left:24px;
  border:7px solid transparent; border-top-color:var(--foam); border-bottom:0; }
.bar-copy h2{ font-family:var(--sign); font-size:clamp(1.7rem,4.5vw,2.7rem); margin:.2em 0 .3em; color:var(--foam); }
.bar-copy p{ color:var(--ink-dim); max-width:520px; }
@media(max-width:760px){ .bar-copy p{ margin-inline:auto; } }

.brewing{
  margin-top:30px; border:1px solid rgba(219,135,34,.3); border-radius:12px;
  background:linear-gradient(180deg, rgba(42,28,16,.5), rgba(12,10,7,.4));
  padding:22px 24px;
}
.brewing .lbl{ font-size:.72rem; letter-spacing:.24em; text-transform:uppercase; color:var(--amber); display:flex; align-items:center; gap:9px; }
.brewing .lbl .spin{ display:inline-block; animation:spin 1.4s linear infinite; color:var(--screen); }
@keyframes spin{ to{ transform:rotate(360deg) } }
.brewing h3{ margin:8px 0 4px; color:var(--foam); font-size:1.15rem; }
.brewing p{ margin:0 0 16px; font-size:.86rem; }
.tabform{ display:flex; gap:10px; flex-wrap:wrap; }
.tabform input{
  flex:1; min-width:180px; background:rgba(6,5,3,.6); border:1px solid rgba(192,123,58,.35);
  border-radius:9px; padding:12px 14px; color:var(--ink); font-family:var(--mono); font-size:.86rem; outline:none;
}
.tabform input:focus{ border-color:var(--amber); box-shadow:0 0 0 3px rgba(230,165,52,.12); }

/* ============================================================
   FOOTER / guestbook
   ============================================================ */
.foot{ border-top:1px solid rgba(192,123,58,.2); padding:60px 0 40px; margin-top:30px; position:relative; }
.zdravica{
  text-align:center; font-family:var(--chalk); font-size:clamp(2rem,6vw,3.4rem);
  color:var(--amber-hi); text-shadow:0 0 18px rgba(255,198,88,.3); margin:0 0 6px;
}
.zdravica-sub{ text-align:center; color:var(--ink-dim); margin:0 0 40px; font-size:.9rem; }
.foot-links{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; margin-bottom:34px; }
.foot-links a{
  display:inline-flex; align-items:center; gap:9px; text-decoration:none;
  border:1px solid rgba(192,123,58,.3); border-radius:10px; padding:11px 16px;
  color:var(--ink); font-size:.86rem; font-weight:500; transition:.18s;
  background:rgba(42,28,16,.3);
}
.foot-links a:hover{ border-color:var(--accent); color:var(--accent); transform:translateY(-2px);
  box-shadow:0 8px 22px rgba(0,0,0,.4); }
.foot-links a .ic{ width:17px; height:17px; }
.foot-meta{ text-align:center; color:var(--ink-faint); font-size:.76rem; line-height:1.8; }
.foot-meta b{ color:var(--screen); } .foot-meta .heart{ color:var(--neon); }

/* selection + reduced-motion */
::selection{ background:var(--accent); color:#fff; }
@media(prefers-reduced-motion:reduce){
  .sign-rig,.scroll-hint,.brewing .lbl .spin,.topbar .dot{ animation:none !important; }
}

/* ---------- easter eggs: drunk mode + last-call toast ---------- */
@keyframes kafana-sway {
  0%,100% { transform: translateX(0) rotate(0); }
  25%     { transform: translateX(3px) rotate(.25deg); }
  75%     { transform: translateX(-3px) rotate(-.25deg); }
}
body.drunk main { animation: kafana-sway 3.2s ease-in-out infinite; }
body.drunk      { filter: saturate(1.15) blur(.4px); transition: filter .6s; }

.lastcall-toast {
  position: fixed; left: 50%; bottom: 26px; transform: translateX(-50%) translateY(20px);
  z-index: 90; background: rgba(20,16,10,.96); border: 1px solid var(--copper);
  border-radius: 12px; padding: 12px 18px; color: var(--ink); font-family: var(--mono);
  font-size: 14px; box-shadow: 0 14px 40px rgba(0,0,0,.5); opacity: 0;
  transition: opacity .4s ease, transform .4s ease; max-width: 90vw;
}
.lastcall-toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }
.lastcall-toast b { color: var(--amber-hi); }

@media (prefers-reduced-motion: reduce) {
  body.drunk main { animation: none; }
  body.drunk { filter: none; }
  .lastcall-toast { transition: opacity .2s; }
}