:root{
  --bg:#020402;
  --fg:#c9ffd6;
  --muted:#7dff9d;
  --dim:#49d96b;
  --link:#b7ff38;

  /* title colors */
  --title-fill:#f78a05;
  --title-outline:#bdf589;

  /* title glow */
  --title-glow: rgba(0,255,102,.55);
}

/* ========== BASE ========== */
*{ box-sizing:border-box; }

body{
  margin:0;
  background: var(--bg);
  color: var(--fg);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono","Courier New", monospace;
  font-size: 13px;
  line-height: 1.15;
}

.wrap{
  max-width: 980px;
  margin: 0 auto;
  padding: 12px 10px 24px;
}

/* ========== HEADER + SUB ========== */
.sub{
  margin: 2px 0 10px;
  color: var(--muted);
  font-size: 13px;
}

/* ========== PIXEL FONT FOR TITLE ONLY ========== */
@font-face{
  font-family: "Pixelout";
  src: url("/fonts/pixelout.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}

/* ========== HEADER CRT WRAP (optional class on header area) ========== */
/* Put header elements inside:
   <header class="headerCRT"> ... </header>
*/
.headerCRT{
  position: relative;
  margin-left: -18px;
  margin-right: -18px;
  padding-left: 18px;
  padding-right: 18px;

  /* room for glow */
  padding-top: 8px;
  padding-bottom: 24px;

  overflow: visible;
  border-radius: 10px;

  /* subtle bloom bed */
  background: radial-gradient(
    1200px 320px at 30% 0%,
    rgba(0,255,140,0.08),
    rgba(0,0,0,0) 65%
  );
}

/* scanlines */
.headerCRT::before{
  content:"";
  position:absolute;
  inset: 0;
  pointer-events:none;
  border-radius: 10px;
  opacity: .18;
  background:
    repeating-linear-gradient(
      to bottom,
      rgba(0,0,0,0) 0px,
      rgba(0,0,0,0) 2px,
      rgba(0,0,0,0.55) 3px
    );
  mix-blend-mode: soft-light;
}

/* gentle bottom fade so glow doesn't hard-stop */
.headerCRT::after{
  content:"";
  position:absolute;
  left:0; right:0; bottom:-2px;
  height: 42px;
  pointer-events:none;
  border-radius: 10px;
  background: linear-gradient(
    to bottom,
    rgba(0,0,0,0),
    rgba(2,4,2,0.85),
    rgba(2,4,2,1)
  );
}

/* ========== TITLE ========== */
h1{
  margin: 0 0 6px;
  font-family: "Pixelout", monospace;
  font-size: 48px;
  letter-spacing: 2px;
  color: var(--title-fill);

  text-shadow:
    -1px -1px 0 var(--title-outline),
     0px -1px 0 var(--title-outline),
     1px -1px 0 var(--title-outline),
    -1px  0px 0 var(--title-outline),
     1px  0px 0 var(--title-outline),
    -1px  1px 0 var(--title-outline),
     0px  1px 0 var(--title-outline),
     1px  1px 0 var(--title-outline),

     0 0 10px rgba(0,255,102,0.80),
     0 0 22px rgba(0,255,102,0.55),
     0 0 46px rgba(0,255,102,0.30),
     0 0 80px rgba(0,255,102,0.18);

  -webkit-font-smoothing: none;
  text-rendering: optimizeSpeed;

  animation:
    crtPulse 9s ease-in-out infinite,
    titleFlicker 8s infinite;
}

@keyframes titleFlicker{
  0%, 96%, 100% { opacity: 1; }
  97% { opacity: .92; }
  98% { opacity: 1; }
  99% { opacity: .96; }
}

@keyframes crtPulse{
  0%, 100% { filter: brightness(1.10) saturate(1.10); }
  50%      { filter: brightness(1.35) saturate(1.35); }
}

/* ========== CONTROLS ========== */
.controls{
  display:flex;
  flex-wrap:wrap;
  gap:6px 10px;
  align-items:center;
  padding: 6px 0 8px;
  border-bottom: 1px solid rgba(183,255,56,.25);
}

label{
  display:flex;
  align-items:center;
  gap:6px;
  color: var(--muted);
  font-size: 12px;
}

input[type="checkbox"]{
  transform: scale(.85);
  transform-origin: left center;
}

input[type="search"], input[type="date"]{
  background: transparent;
  color: var(--fg);
  border: 1px solid rgba(183,255,56,.25);
  border-radius: 0;
  padding: 4px 6px;
  outline: none;
}

input[type="date"]{
  color-scheme: dark;
}

input[type="search"]{ min-width: 240px; }
input[type="date"]{ min-width: 140px; }

button{
  background: transparent;
  color: var(--fg);
  border: 1px solid rgba(183,255,56,.25);
  border-radius: 0;
  padding: 4px 8px;
  cursor:pointer;
}
button:hover{
  border-color: rgba(183,255,56,.55);
  color: var(--link);
}

/* ========== META ROW ========== */
.meta{
  margin-top: 6px;
  color: rgba(125,255,157,.85);
  font-size: 12px;
}
.meta a{
  color: var(--link);
  text-decoration: underline;
}
.sep{ margin: 0 8px; color: rgba(125,255,157,.65); }

/* ========== DAY SECTIONS ========== */
.day{
  margin-top: 10px;
  padding-top: 6px;
  border-top: 1px solid rgba(183,255,56,.18);
}

.dayHeader{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap:16px;
  padding: 12px 0 8px;
}

.dayHeader .date{
  font-size: 20px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-shadow:
    0 0 12px rgba(0,255,140,0.26),
    0 0 2px rgba(0,255,140,0.30);
}

.dayHeader .count{
  font-size: 12px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  opacity: 0.75;
}

/* ========== GROUPING (One-offs / Recurring) ========== */
.dayGroup{ margin-top: 10px; }

.groupHeader{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin: 6px 0 8px;
  padding: 7px 10px;
  border: 1px solid rgba(0,255,140,0.18);
  background: rgba(0,255,140,0.04);
  letter-spacing: 0.22em;
  text-transform: uppercase;
  font-size: 11px;
  position: relative;
  overflow: hidden;
}

/* terminal notch */
.groupHeader::before{
  content:"";
  position:absolute;
  left:-12px; top:0;
  width:24px; height:100%;
  background: rgba(0,255,140,0.10);
  transform: skewX(-18deg);
  opacity: .9;
}

/* shimmer sweep */
.groupHeader::after{
  content:"";
  position:absolute;
  left:-10%; top:0;
  width:30%; height:100%;
  background: linear-gradient(
    90deg,
    rgba(255,255,255,0),
    rgba(0,255,140,0.10),
    rgba(255,255,255,0)
  );
  opacity: .45;
  animation: groupSweep 4.8s linear infinite;
}

@keyframes groupSweep{
  0% { transform: translateX(-20%); }
  100% { transform: translateX(420%); }
}

.groupLabel{ font-weight: 900; }
.groupCount{ opacity: .65; font-weight: 800; }

/* ========== TABLE ========== */
.table{
  width:100%;
  table-layout: fixed;
  border-collapse: collapse;
  margin-top: 6px;
}

.table th, .table td{
  padding: 3px 6px;
  vertical-align: top;
  border: none;
  font-size: 12px;
}

.table thead th{
  color: rgba(125,255,157,.95);
  font-weight: 700;
  font-size: 12px;
  letter-spacing: .14em;
  text-transform: uppercase;
  padding-top: 10px;
  padding-bottom: 10px;
}

.table thead tr{
  border-bottom: 1px solid rgba(0,255,140,0.16);
}

.table tbody tr:hover{
  background: rgba(56,255,106,.06);
}

/* subtle venue signal bar */
.table tbody tr{
  border-left: 3px solid transparent;
}

/* column widths */
.col-venue   { width: 17%; }
.col-event   { width: 45%; }
.col-category{ width: 12%; }
.col-time    { width: 10%; white-space: nowrap; }
.col-price   { width: 12%; }
.col-museum  { width: 4%;  text-align:center; white-space: nowrap; }

/* links */
a{ color: var(--fg); }

.eventTitle{
  font-weight: 800;
  color: var(--link);
  text-decoration: none;
  line-height: 1.1;
}
.eventTitle:hover{ text-decoration: underline; }

@keyframes powerSpike{
  0%   { filter: brightness(1); }
  35%  { filter: brightness(1.25); }
  100% { filter: brightness(1); }
}
a:hover{ animation: powerSpike 220ms steps(3, end) 1; }

/* chips */
.chip{
  padding: 0;
  border: none;
  background: none;
  color: rgba(125,255,157,.95);
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}

/* category colors */
.cat-drink-draw .eventTitle { color: #b7ff38; }
.cat-workshop   .eventTitle { color: #38ff6a; }
.cat-figure     .eventTitle { color: #7dff9d; }
.cat-museum     .eventTitle { color: #c9ff6a; }
.cat-zine       .eventTitle { color: #7cffc4; }
.cat-opening    .eventTitle { color: #d2ff8a; }
.cat-talk       .eventTitle { color: #9eff5a; }
.cat-market     .eventTitle { color: #b7ff38; }
.cat-other .eventTitle      { color: var(--link); }

/* ========== PRICE WRAP + TOOLTIP ========== */
.col-price{
  max-width: 22ch;
  white-space: normal;
  word-break: break-word;
  line-height: 1.2;
  color: #c8ffb8;
}

.hasTip{ position: relative; cursor: help; }

.hasTip::after{
  content: attr(data-tip);
  position: absolute;
  left: 0;
  top: 100%;
  margin-top: 6px;
  padding: 8px 10px;
  max-width: 36ch;
  white-space: normal;
  line-height: 1.25;
  z-index: 50;

  background: rgba(0,0,0,0.92);
  border: 1px solid rgba(120,255,120,0.35);
  box-shadow: 0 8px 24px rgba(0,0,0,0.6);

  opacity: 0;
  transform: translateY(-2px);
  pointer-events: none;
  transition: opacity 120ms ease, transform 120ms ease;
}

.hasTip:hover::after{
  opacity: 1;
  transform: translateY(0);
}

/* ========== SOURCE + RECURRING BADGES ========== */
.sourceBadge{
  display:inline-block;
  margin-left: 10px;
  padding: 2px 6px;
  font-size: 9px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  border: 1px solid rgba(255,255,255,0.18);
  background: rgba(255,255,255,0.04);
  opacity: 0.85;
  vertical-align: middle;
}

.sourceBadge.source-case{ border-color: rgba(0,255,140,0.32); background: rgba(0,255,140,0.06); }
.sourceBadge.source-syzygy{ border-color: rgba(0,255,140,0.22); background: rgba(0,255,140,0.04); }
.sourceBadge.source-sketchboard{ border-color: rgba(255,255,255,0.22); background: rgba(255,255,255,0.04); }
.sourceBadge.source-csv{ border-color: rgba(255,255,255,0.14); background: rgba(255,255,255,0.03); }
.sourceBadge.source-other{ border-color: rgba(255,255,255,0.12); background: rgba(255,255,255,0.03); }

.recurringBadge{
  display:inline-block;
  margin-left: 10px;
  padding: 2px 6px;
  font-size: 9px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  border: 1px solid rgba(0,255,140,0.30);
  background: rgba(0,255,140,0.05);
  opacity: 0.82;
  vertical-align: middle;
}

/* recurring rows: tight but breathable */
tr.isRecurring td{
  padding-top: 7px !important;
  padding-bottom: 7px !important;
  line-height: 1.25;
  opacity: 0.92;
}

tr.isRecurring + tr.isRecurring td{
  border-top: 1px dashed rgba(0,255,140,0.08);
}

tr.isOneOff .eventTitle{
  font-weight: 900;
  letter-spacing: 0.03em;
}

/* ========== VENUE COLOR CODING (left signal bar) ========== */
.table tbody tr.venue-syzygy{ border-left-color: rgba(0,255,140,0.18); }
.table tbody tr.venue-case{ border-left-color: rgba(0,255,140,0.14); }
.table tbody tr.venue-cast{ border-left-color: rgba(255,255,255,0.14); }
.table tbody tr.venue-madron{ border-left-color: rgba(255,255,255,0.10); }
.table tbody tr.venue-monument{ border-left-color: rgba(255,255,255,0.12); }
.table tbody tr.venue-sketchboard{ border-left-color: rgba(255,255,255,0.08); }

/* ========== LEGEND ========== */
.legend{
  margin: 6px 0 10px;
  color: var(--muted);
  font-size: 11px;
}

.legend > summary{
  cursor: pointer;
  user-select: none;
  display: inline-block;
  color: var(--link);
  text-decoration: underline;
  font-size: 11px;
}

.legend[open] > summary{ color: var(--fg); }

.legend-items{
  margin-top: 4px;
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

.legend-item{
  padding: 0;
  border: none;
  background: none;
  font-size: 10px;
  font-weight: 700;
}

.legend-item.cat-drink-draw{ color: #b7ff38; }
.legend-item.cat-workshop  { color: #38ff6a; }
.legend-item.cat-figure    { color: #7dff9d; }
.legend-item.cat-museum    { color: #c9ff6a; }
.legend-item.cat-zine      { color: #7cffc4; }
.legend-item.cat-opening   { color: #d2ff8a; }
.legend-item.cat-talk      { color: #9eff5a; }
.legend-item.cat-market    { color: #b7ff38; }
.legend-item.cat-other     { color: var(--link); }

/* ========== BOOT FLICKER (optional) ========== */
@keyframes bootFlicker{
  0%   { opacity: 0; filter: brightness(0.7) contrast(1.2); transform: translateY(-2px); }
  6%   { opacity: 1; }
  8%   { opacity: 0.25; }
  10%  { opacity: 1; }
  14%  { opacity: 0.6; }
  16%  { opacity: 1; }
  22%  { opacity: 0.4; }
  24%  { opacity: 1; transform: translateY(0); filter:none; }
  100% { opacity: 1; filter:none; }
}
.boot{ animation: bootFlicker 900ms steps(10, end) 1; }

/* ========== FLOATIES (falling sprites) ========== */
#floaties{
  position: fixed;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
  z-index: 9999;
}

.floaty{
  position: absolute;
  top: -80px;
  left: 0;
  width: var(--size, 38px);
  height: auto;
  opacity: var(--op, 0.9);
  image-rendering: pixelated;
  image-rendering: crisp-edges;
  filter:
    drop-shadow(0 0 6px rgba(0,255,102,0.18))
    drop-shadow(0 0 12px rgba(0,0,0,0.35));
  will-change: transform;
}

@media (prefers-reduced-motion: reduce){
  #floaties{ display:none; }
}

/* ========== MOBILE FRIENDLY TABLE ========== */
@media (max-width: 780px){
  input[type="search"]{ min-width: 200px; }

  .table thead{ display:none; }
  .table, .table tbody, .table tr, .table td{
    display:block;
    width:100%;
  }

  .table tr{
    border-top: 1px solid rgba(120,255,120,0.18);
    padding: 10px 0;
  }

  .table td{ padding: 6px 0; }

  .table td.col-venue::before{ content:"Venue: "; opacity:.7; }
  .table td.col-event::before{ content:"Event: "; opacity:.7; }
  .table td.col-category::before{ content:"Category: "; opacity:.7; }
  .table td.col-time::before{ content:"Time: "; opacity:.7; }
  .table td.col-price::before{ content:"Price: "; opacity:.7; }
  .table td.col-museum::before{ content:"Museum: "; opacity:.7; }

  .hasTip{ cursor: default; }
  .hasTip::after{ display:none; }
}

/* ========== INSTAGRAM EMBED ========== */
.ig-btn{
  display: inline-block;
  margin-left: 8px;
  padding: 1px 6px;
  font-size: 9px;
  font-family: inherit;
  letter-spacing: .12em;
  text-transform: uppercase;
  border: 1px solid rgba(183,255,56,.28);
  background: rgba(183,255,56,.04);
  color: rgba(183,255,56,.8);
  cursor: pointer;
  vertical-align: middle;
  transition: border-color 100ms, background 100ms;
}
.ig-btn:hover{ border-color: rgba(183,255,56,.6); background: rgba(183,255,56,.09); color: #b7ff38; }

.ig-panel{
  margin-top: 8px;
  padding: 10px 12px;
  border: 1px solid rgba(183,255,56,.14);
  background: rgba(0,255,140,.025);
}

.ig-embed-wrap{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
}
.ig-embed-frame{
  width: 320px;
  max-width: 100%;
  height: 420px;
  border: none;
  background: rgba(0,0,0,.3);
}
.ig-view-link{
  font-size: 10px;
  color: rgba(183,255,56,.65);
  text-decoration: none;
  letter-spacing: .08em;
}
.ig-view-link:hover{ color: #b7ff38; }

.ig-link-card{
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 11px;
}
.ig-insta-icon{ font-size: 16px; }
.ig-profile-link{
  color: #b7ff38;
  text-decoration: none;
  font-weight: 700;
}
.ig-profile-link:hover{ text-decoration: underline; }
.ig-link-hint{ color: rgba(125,255,157,.5); font-size: 10px; }

/* Row tint for events with IG */
.table tbody tr.has-ig{
  border-left-color: rgba(183,255,56,.22);
}

/* Hide IG panel on mobile (iframe doesn't behave well stacked) */
@media (max-width: 780px){
  .ig-embed-frame{ width: 100%; height: 360px; }
  .ig-panel{ padding: 8px; }
}

/* ========== COMMUNITY / RADIO CATEGORY ========== */
.cat-community .eventTitle { color: #38d9ff; }
.legend-item.cat-community  { color: #38d9ff; }

/* ========== SKETCH JAM CATEGORY ========== */
.cat-sketch-jam .eventTitle { color: #ff9f38; }
.legend-item.cat-sketch-jam  { color: #ff9f38; }