/* libretask boot styles (external file so the CSP needs no inline styles for them). */

:root {
  --lt-board: #24453d;
  --lt-board-deep: #1a332d;
  --lt-board-line: #3b5d54;
  --lt-chalk: #f2f5ec;
  --lt-chalk-dim: #b7c7be;
  --lt-sticky: #ffc94d;
}

html,
body {
  margin: 0;
  height: 100%;
  background: var(--lt-board);
}

/* Clickjacking defence: nothing is shown until js/guard.js has confirmed that
   the page is NOT inside someone else's frame. */
html:not(.lt-unframed) body {
  display: none !important;
}

/* Inside a foreign frame: show only the explanation, never the app. */
html.lt-framed body {
  display: block !important;
}
html.lt-framed body > :not(#lt-framed) {
  display: none !important;
}

/* JavaScript switched off: show the <noscript> message (the app cannot run,
   so there is nothing to click-jack). Same specificity as the rule above and
   later in the file, so it wins. */
@media (scripting: none) {
  html:not(.lt-unframed) body {
    display: block !important;
  }
  html:not(.lt-unframed) body > :not(noscript) {
    display: none !important;
  }
}

[hidden] {
  display: none !important;
}

.lt-screen {
  position: fixed;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
  padding: 24px 16px;
  box-sizing: border-box;
  text-align: center;
  color: var(--lt-chalk);
  font: 15px/1.7 system-ui, -apple-system, "Hiragino Sans", "Yu Gothic UI", "Meiryo", sans-serif;
}

/* splash */
#lt-splash {
  transition: opacity 0.25s ease;
}
#lt-splash.lt-gone {
  opacity: 0;
}
.lt-name {
  font-size: 22px;
  font-weight: 700;
  letter-spacing: 0.02em;
}
.lt-bar {
  width: 160px;
  height: 3px;
  background: var(--lt-board-line);
  overflow: hidden;
  border-radius: 2px;
}
.lt-bar::after {
  content: "";
  display: block;
  width: 40%;
  height: 100%;
  background: var(--lt-chalk);
  animation: lt-slide 1.1s ease-in-out infinite;
}
@keyframes lt-slide {
  from {
    transform: translateX(-100%);
  }
  to {
    transform: translateX(250%);
  }
}
@media (prefers-reduced-motion: reduce) {
  .lt-bar::after {
    animation: none;
    width: 100%;
  }
}

/* F5 guard: pause screen before boot */
#lt-cooldown .lt-title {
  font-size: 20px;
  font-weight: 700;
  max-width: 34em;
}
#lt-cooldown .lt-body {
  max-width: 34em;
  color: var(--lt-chalk-dim);
  text-wrap: balance;
}
#lt-cooldown-count {
  font-size: 34px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

/* F5 guard: banner while the app runs */
#lt-notice {
  position: fixed;
  top: 12px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2147483000;
  max-width: calc(100% - 32px);
  box-sizing: border-box;
  padding: 8px 16px;
  border-radius: 20px;
  background: var(--lt-board-deep);
  color: var(--lt-chalk);
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.35);
  font: 14px/1.5 system-ui, -apple-system, "Hiragino Sans", "Yu Gothic UI", "Meiryo", sans-serif;
  pointer-events: none;
}

/* inside a foreign frame */
#lt-framed a {
  color: var(--lt-sticky);
}
