
html.top-tue body.home{ background:#cfd1d0; }
html.top-tue.isl-t-dawn body.home{ background:#d9e2e8; }
html.top-tue.isl-t-dusk body.home{ background:#2c3540; }
html.top-tue.isl-t-night body.home{ background:#05090e; }
html.top-tue{ --tf-ink:31,42,48; --tf-glow:236,238,238; }
html.top-tue.isl-t-dawn{ --tf-glow:236,242,246; }
html.top-tue.isl-t-dusk, html.top-tue.isl-t-night{ --tf-ink:238,243,247; --tf-glow:8,16,28; }
html.top-tue .isl-pre, html.top-tue .isl-fog{ display:none; }
.tf{ position:fixed; left:0; top:0; width:100%; height:100%; z-index:0; overflow:hidden; pointer-events:none; }
.tf > div, .tf > canvas{ position:absolute; left:0; top:0; transform-origin:0 0; will-change:transform; }
.tf img{ display:block; width:100%; height:100%; }
.tf-blur{ opacity:0; transition:opacity 1.2s ease; }
.tf-sharp{ opacity:0; transition:opacity 1s ease; }
.tf-gl{ image-rendering:pixelated; opacity:0; transition:opacity 1.2s ease; }
.tf.in .tf-blur, .tf.in .tf-gl{ opacity:1; }
.tf.win .tf-sharp{ opacity:1; }


.tf-fr{ position:fixed; left:0; top:0; z-index:1; pointer-events:none; }
.tf-fr s{ position:absolute; background:rgb(var(--tf-ink)); transition:transform .9s cubic-bezier(.16,.84,.3,1); }
.tf-fr s:nth-of-type(1){ left:0; top:0; width:100%; height:1.5px; transform-origin:0 0; transform:scaleX(0); }
.tf-fr s:nth-of-type(2){ left:0; top:0; width:1.5px; height:100%; transform-origin:0 0; transform:scaleY(0); }
.tf-fr s:nth-of-type(3){ right:0; bottom:0; width:100%; height:1.5px; transform-origin:100% 0; transform:scaleX(0); }
.tf-fr s:nth-of-type(4){ right:0; bottom:0; width:1.5px; height:100%; transform-origin:0 100%; transform:scaleY(0); }
.tf-fr.on s{ transform:none; }
.tf-fr i{ position:absolute; width:10px; height:10px; background:#fff; opacity:0; transition:opacity .4s ease; }
.tf-fr i:nth-of-type(1){ left:-5px; top:-5px; } .tf-fr i:nth-of-type(2){ right:-5px; bottom:-5px; }
.tf-fr.on i{ opacity:1; }
.tf-fr b{ position:absolute; right:0; bottom:calc(100% + 8px); font:500 13px/1 'Inter',sans-serif; letter-spacing:.04em; color:rgb(var(--tf-ink)); opacity:0; transition:opacity .6s ease .5s; }
.tf-fr.on b{ opacity:1; }


html.top-tue:not(.isl-t-dusk):not(.isl-t-night) body.home .logo{ filter:blur(12px) drop-shadow(0 2px 16px rgba(var(--tf-glow),.95)); }
html.top-tue:not(.isl-t-dusk):not(.isl-t-night) body.home.isl-logo .logo{ filter:blur(0) drop-shadow(0 2px 16px rgba(var(--tf-glow),.95)); }
html.top-tue:not(.isl-t-dusk):not(.isl-t-night) .isl-tag{ color:#1f2a30; }
html.top-tue .isl-tag, html.top-tue body.home .quote, html.top-tue body.home .right-list li .label, html.top-tue body.home .right-list li .value{ text-shadow:0 1px 10px rgba(var(--tf-glow),.95); }
html.top-tue:not(.isl-t-dusk):not(.isl-t-night) body.home .right-list li small{ color:#2f3a44; }
html.top-tue body.home .right-list li small{ text-shadow:0 1px 8px rgba(var(--tf-glow),.95); }
html.top-tue body.home .nav-jump a{ text-shadow:0 1px 8px rgba(var(--tf-glow),.95); }


body.tf-cursor, body.tf-cursor *{ cursor:none !important; }
.tf-cur{ position:fixed; left:0; top:0; z-index:9999; pointer-events:none; width:15px; height:24px; image-rendering:pixelated; transition:opacity .3s; }
.tf-cur path{ fill:#fff; stroke:#1f2a30; transition:fill .25s; }
.tf-cur.is-hot path{ fill:var(--acc); }
.tf-cur.is-out{ opacity:0; }


.tf-fr.lock i{ background:var(--acc); transition:background .2s; }
.tf-fr.lock::before{ animation:none !important; transform:translate(-6px,0); transition:transform .5s cubic-bezier(.16,.84,.3,1); }
.tf-fr.lock::after{ animation:none !important; transform:translate(6px,0); transition:transform .5s cubic-bezier(.16,.84,.3,1); }
body.tf-leave .tf-chip, body.tf-leave .tf-lead{ opacity:0 !important; transition:opacity .25s ease; }
body.tf-leave .tf-fr q{ animation:none; opacity:0; }
.tf-out{ position:fixed; inset:0; z-index:10010; pointer-events:none; overflow:hidden; }
.tf-out i{ position:absolute; left:0; width:100%; display:block; background:#f4f5f5; transform:scaleX(0);
  box-shadow:inset 0 1px 0 rgba(110,200,214,.55); transition:transform .5s cubic-bezier(.7,0,.2,1); }
.tf-out i.l{ transform-origin:0 50%; } .tf-out i.r{ transform-origin:100% 50%; }
.tf-out.on i{ transform:scaleX(1); }
.tf-out b{ position:absolute; left:0; right:0; top:0; height:1px; background:var(--acc); box-shadow:0 0 12px 2px rgba(var(--acc-rgb),.35); opacity:0; }
.tf-out.on b{ animation:tf-out-scan .55s cubic-bezier(.6,0,.3,1) .12s forwards; }
@keyframes tf-out-scan{ 0%{ top:0; opacity:1; } 90%{ opacity:1; } 100%{ top:100%; opacity:0; } }

@media (max-width:960px){
  .tf{ height:50vh; -webkit-mask:linear-gradient(#000 70%,transparent); mask:linear-gradient(#000 70%,transparent); }
  .tf-fr b{ bottom:auto; top:calc(100% + 6px); }
}



.tf-fr u{ position:absolute; width:14px; height:14px; border:0 solid rgba(var(--tf-ink),.55); opacity:0; transition:opacity .8s ease 1s; }
.tf-fr u:nth-of-type(1){ left:-22px; top:-22px; border-width:1px 0 0 1px; }
.tf-fr u:nth-of-type(2){ right:-22px; top:-22px; border-width:1px 1px 0 0; }
.tf-fr u:nth-of-type(3){ left:-22px; bottom:-22px; border-width:0 0 1px 1px; }
.tf-fr u:nth-of-type(4){ right:-22px; bottom:-22px; border-width:0 1px 1px 0; }
.tf-fr.on u{ opacity:1; }

.tf-fr em{ position:absolute; opacity:0; transition:opacity .8s ease 1.2s; --ink:rgba(var(--tf-ink),.5); }
.tf-fr .rx{ left:0; right:0; top:calc(100% + 6px); height:7px;
  background:repeating-linear-gradient(90deg,var(--ink) 0 1px,transparent 1px 10%), repeating-linear-gradient(90deg,var(--ink) 0 1px,transparent 1px 2%);
  background-size:100% 7px, 100% 4px; background-repeat:no-repeat; }
.tf-fr .ry{ top:0; bottom:0; left:-13px; width:7px;
  background:repeating-linear-gradient(180deg,var(--ink) 0 1px,transparent 1px 10%), repeating-linear-gradient(180deg,var(--ink) 0 1px,transparent 1px 2%);
  background-size:7px 100%, 4px 100%; background-position:right top, right top; background-repeat:no-repeat; }
.tf-fr.on em{ opacity:1; }

.tf-fr q{ position:absolute; left:0; right:0; top:0; height:42px; margin-top:-42px; overflow:hidden; opacity:0; pointer-events:none;
  background:linear-gradient(180deg,rgba(110,200,214,0),rgba(110,200,214,.22)); border-bottom:1px solid rgba(var(--acc-rgb),.75); }
.tf-fr q::before, .tf-fr q::after{ content:none; }
body.tf-deco .tf-fr q{ animation:tf-scan 9s cubic-bezier(.45,0,.55,1) infinite; }
@keyframes tf-scan{ 0%{ top:0; opacity:0; } 4%{ opacity:1; } 40%{ top:100%; opacity:1; } 44%,100%{ top:100%; opacity:0; } }

.tf-fr::before, .tf-fr::after{ content:""; position:absolute; inset:0; pointer-events:none; opacity:0; transition:opacity 1s ease; }
.tf-fr::before{ border:1px solid rgba(110,200,214,.8); }
.tf-fr::after{ border:1px solid rgba(var(--acc-rgb),.6); }
body.tf-deco .tf-fr::before{ opacity:1; animation:tf-ca1 7s ease-in-out infinite; }
body.tf-deco .tf-fr::after{ opacity:1; animation:tf-ca2 7s ease-in-out infinite; }
@keyframes tf-ca1{ 0%,100%{ transform:translate(-1px,0); } 50%{ transform:translate(-3px,1px); } }
@keyframes tf-ca2{ 0%,100%{ transform:translate(1px,0); } 50%{ transform:translate(3px,-1px); } }

.tf-chip{ position:fixed; left:0; top:0; z-index:1; width:120px; height:76px; pointer-events:none; opacity:0; transition:opacity 1s ease;
  background-repeat:no-repeat; filter:saturate(.7); outline:1px solid rgba(var(--tf-ink),.7); outline-offset:3px; }
.tf-chip::after{ content:""; position:absolute; top:0; right:0; bottom:0; width:38%; background:inherit; background-color:transparent;
  -webkit-mask:radial-gradient(circle,#000 46%,transparent 52%) 0 0 / 4px 4px; mask:radial-gradient(circle,#000 46%,transparent 52%) 0 0 / 4px 4px; }
.tf-lead{ position:fixed; inset:0; width:100%; height:100%; z-index:1; pointer-events:none; overflow:visible; opacity:0; transition:opacity 1s ease .3s; }
.tf-lead polyline{ fill:none; stroke:rgba(var(--tf-ink),.6); stroke-width:1; }
.tf-lead rect{ fill:#fff; stroke:rgb(31,42,48); stroke-width:1; }
body.tf-deco .tf-chip, body.tf-deco .tf-lead{ opacity:1; }
@media (max-width:960px){ .tf-chip, .tf-lead, .tf-fr em, .tf-fr u{ display:none; } }
@media (prefers-reduced-motion:reduce){ .tf-fr q{ display:none; } body.tf-deco .tf-fr::before, body.tf-deco .tf-fr::after{ animation:none; } }


.tf-fr b{ display:none !important; }

