@layer tg-legacy {
.startup-intro {
  position: fixed;
  inset: 0;
  z-index: 100000;
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  height: 100dvh;
  overflow: hidden;
  background: #FFFFFF;
  color: var(--tg-navy);
  font-family: var(--sans, sans-serif);
  letter-spacing: 0;

}

.startup-intro .doer-skinne { flex: 0 0 auto; }

.startup-skip { position: absolute; z-index: 1; right: max(16px, env(safe-area-inset-right)); bottom: max(12px, env(safe-area-inset-bottom)); display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 44px; padding: 10px 12px; border: 0; border-radius: 4px; background: #ffffffeb; color: var(--tg-navy); font: 500 13px/1.5 var(--sans, sans-serif); letter-spacing: 0; cursor: pointer; }
.startup-skip:hover { background: #FFFFFF; color: var(--tg-primary); }
.startup-skip svg { flex: 0 0 16px; }
.startup-skip:focus-visible { outline: 2px solid var(--tg-primary); outline-offset: 3px; }

.startup-scene { position: relative; display: grid; place-items: center; flex: 1 1 0; min-height: 0; width: 100%; padding: 16px 16px 64px; overflow: hidden; }

.startup-film {
  position: relative;
  width: min(680px, 100%, calc((100vh - 164px) * 720 / 866));
  width: min(680px, 100%, calc((100dvh - 164px) * 720 / 866));
  aspect-ratio: 720 / 866;
  min-height: 0;
  overflow: hidden;
}

.startup-film video { display: block; position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; background: #FFFFFF; pointer-events: none; }
.startup-film video{opacity:1}
.startup-buffering{position:absolute;left:calc(50% - 14px);top:calc(50% - 14px);width:28px;height:28px;border:2px solid var(--tg-bg);border-top-color:var(--tg-ink);border-radius:50%;animation:startup-buffer 800ms linear infinite}
.startup-intro.is-ready .startup-buffering{display:none}
@keyframes startup-buffer{to{transform:rotate(360deg)}}

/* Én statisk kantudtoning som i appen. Videolaget flyttes eller fades ikke. */
.startup-film::after{content:"";position:absolute;inset:-1px;pointer-events:none;background:linear-gradient(90deg,#fff,transparent 12%,transparent 88%,#fff),linear-gradient(0deg,#fff,transparent 8%,transparent 92%,#fff)}
.startup-film video::-webkit-media-controls { display: none !important; }
.startup-film video::-webkit-media-controls-start-playback-button { display: none !important; }
.startup-film video::-webkit-media-controls-overlay-play-button { display: none !important; }
.startup-animation{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#fff;pointer-events:none}
.startup-scene::after{content:"";position:absolute;inset:0;z-index:2;background:#fff;opacity:0;pointer-events:none;transition:opacity 180ms ease;will-change:opacity}
.startup-intro.is-exiting .startup-scene::after{opacity:1}

@media (prefers-reduced-motion: reduce) {
  .startup-scene::after { transition: none; }
  .startup-buffering{animation:none}
}

}