#ttg-app{
  --ttg-grid-line: rgba(14,165,160,0.10);
  font-family:'Plus Jakarta Sans', sans-serif;
  color:#12141C;
  background-color:#FAFAF8;
  background-image:
    linear-gradient(var(--ttg-grid-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--ttg-grid-line) 1px, transparent 1px);
  background-size: 28px 28px;
  line-height:1.5;
}
#ttg-app.ttg-dark{ --ttg-grid-line: rgba(60,201,180,0.10); background-color:#0E1116; }
#ttg-app p, #ttg-app div, #ttg-app span{ margin:0; }
#ttg-app *{ box-sizing:border-box; }

#ttg-app .glass{
  background: rgba(255,255,255,0.72);
  backdrop-filter: blur(14px);
  border:1px solid rgba(18,20,28,0.06);
}
#ttg-app.ttg-dark .glass{
  background: rgba(24,27,34,0.72);
  border:1px solid rgba(255,255,255,0.06);
}

#ttg-app .cell{
  min-height:78px;
  border-radius:12px;
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
#ttg-app .cell.empty{ border:1.5px dashed rgba(18,20,28,0.14); }
#ttg-app.ttg-dark .cell.empty{ border-color: rgba(255,255,255,0.14); }
#ttg-app .cell.empty:hover{ border-color:#0EA5A0; background:rgba(14,165,160,0.06); }
#ttg-app .cell.filled{ cursor:grab; box-shadow:0 1px 2px rgba(18,20,28,.06); }
#ttg-app .cell.filled:active{ cursor:grabbing; }
#ttg-app .cell.dragover{ outline:2px solid #0EA5A0; outline-offset:2px; }
#ttg-app .cell.conflict{ box-shadow: inset 0 0 0 2px #EF4444; }
#ttg-app .cell.searchmatch{ outline:2px solid #F59E0B; outline-offset:2px; }

#ttg-app .modal-backdrop{ background: rgba(10,12,16,0.55); }
#ttg-app .modal-panel{ transform: translateY(12px) scale(.98); opacity:0; transition: all .18s ease; }
#ttg-app .modal-panel.show{ transform: translateY(0) scale(1); opacity:1; }

#ttg-app .toast{ animation: ttgToastIn .25s ease, ttgToastOut .25s ease 2.6s forwards; }
@keyframes ttgToastIn{ from{ opacity:0; transform: translateY(8px);} to{opacity:1; transform:translateY(0);} }
@keyframes ttgToastOut{ to{ opacity:0; transform: translateY(-6px);} }

#ttg-app [data-color="rose"]{ background:#FEE2E2; color:#9F1239; border-color:#FCA5A5; }
#ttg-app [data-color="amber"]{ background:#FEF3C7; color:#92400E; border-color:#FCD34D; }
#ttg-app [data-color="teal"]{ background:#CCFBF1; color:#0F766E; border-color:#5EEAD4; }
#ttg-app [data-color="indigo"]{ background:#E0E7FF; color:#3730A3; border-color:#A5B4FC; }
#ttg-app [data-color="violet"]{ background:#F3E8FF; color:#6B21A8; border-color:#D8B4FE; }
#ttg-app [data-color="sky"]{ background:#E0F2FE; color:#075985; border-color:#7DD3FC; }
#ttg-app [data-color="lime"]{ background:#ECFCCB; color:#3F6212; border-color:#BEF264; }
#ttg-app [data-color="slate"]{ background:#E2E8F0; color:#334155; border-color:#94A3B8; }
#ttg-app.ttg-dark [data-color]{ filter: brightness(0.85) saturate(1.1); }

#ttg-app .accordion-content{ max-height:0; overflow:hidden; transition:max-height .25s ease; }

@media print{
  #ttg-app{ background:#fff !important; }
  #ttg-app .no-print{ display:none !important; }
  #ttg-app #ttg-printArea{ box-shadow:none !important; border:none !important; }
}
