:root{color-scheme:dark;--orange:#ff7b23;--text:#f8f5f1}*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,system-ui,-apple-system,'Segoe UI',sans-serif;background:#08090b;color:var(--text)}body{min-height:100svh;overflow-x:hidden;isolation:isolate}.scene{position:fixed;inset:0;z-index:-3;background:radial-gradient(ellipse at 72% 60%,#23130f 0%,#0a0b0d 67%)}.boiler{position:absolute;inset:0 39% 0 0;background:url('boiler-room.webp') 45% 45%/cover no-repeat;filter:saturate(1.18) brightness(1.18) contrast(1.02)}.boiler:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 45%,#09090c 100%),linear-gradient(0deg,#09090c 0%,transparent 24%)}.window-view{position:absolute;top:0;right:0;width:37%;height:79%;background:url("tatry-window.webp") center 34%/cover no-repeat;opacity:.91;filter:saturate(1.05);mask-image:linear-gradient(90deg,transparent 0%,#000 29%,#000 92%);-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 29%,#000 92%)}.window-view:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#08090b1a 0%,transparent 33%,#09090cdd 100%)}.ambient{position:absolute;inset:0;background:linear-gradient(90deg,transparent 0%,#08090b0a 42%,#08090b35 65%,#09090b80 100%);animation:ambient 6s ease-in-out infinite alternate}.smoke{position:absolute;bottom:-10%;left:-5%;width:90%;height:34%;background:radial-gradient(ellipse,#d17b3922,transparent 70%);filter:blur(32px);animation:smoke 14s ease-in-out infinite alternate}#embers{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:4}.top{display:flex;justify-content:space-between;align-items:center;padding:24px clamp(20px,4vw,66px);position:relative;z-index:5}.wordmark{font-weight:900;letter-spacing:1px;font-size:18px;text-shadow:0 2px 12px #000}.wordmark>span:not(.mark){color:var(--orange)}.wordmark .mark{color:var(--orange);font-size:26px;vertical-align:middle;margin-right:7px}.wordmark small{font-weight:500;font-size:10px;letter-spacing:3px;color:#d7c6bd}.lang{font-size:13px;border:1px solid #ffffff26;padding:7px 13px;border-radius:30px;background:#0008}.layout{max-width:1550px;margin:0 auto;min-height:calc(100svh - 225px);display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,390px);align-items:center;gap:3vw;padding:0 clamp(25px,6vw,105px) 110px;position:relative;z-index:3}.intro{display:none}.login-wrap{grid-column:2;width:100%;justify-self:end}.glass{position:relative;border:1px solid #ffb17c9a;border-radius:25px;padding:27px 30px 30px;background:linear-gradient(135deg,#151316df,#0a0b0de8 80%);box-shadow:0 0 0 1px #ffffff0a inset,0 0 38px #ff5e171b,0 24px 90px #000b;backdrop-filter:blur(18px);overflow:hidden}.glass:before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;box-shadow:inset 0 0 30px #fa63250b}.logo{display:flex;align-items:center;justify-content:center;gap:10px}.flame-icon{font-size:49px;line-height:1;color:#ff7427;text-shadow:0 0 25px #f60;animation:glow 3s ease-in-out infinite}.logo-text{font-weight:900;font-size:29px;letter-spacing:-1px}.logo-text span{background:linear-gradient(90deg,#ffb345,#fb391d);color:transparent;background-clip:text}.cloud{font-size:12px;letter-spacing:7px;text-align:center;font-weight:500;margin-top:3px}.cloud b{color:#ff7526;font-size:18px;letter-spacing:0}.subtitle{text-align:center;letter-spacing:2.2px;font-size:8px;color:#c1b6b2;margin:17px 0}.preview-pill{text-align:center;font-size:8px;letter-spacing:.8px;border:1px solid #ff9c4240;background:#fa681210;color:#f9a36d;border-radius:30px;padding:7px;margin-bottom:14px}form label{font-size:11px;color:#ded6d2;display:block;margin:10px 0 6px}.field{display:flex;align-items:center;gap:10px;padding:0 12px;height:45px;border:1px solid #88858a5a;border-radius:8px;background:#0c0c10c9}.field span{font-size:17px;color:#ddd}.field input{width:100%;border:0;background:none;color:white;outline:none;font-size:13px}.field input::placeholder{color:#777078}.extras{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:12px 0 18px}.extras .remember{margin:0;display:flex;align-items:center;gap:6px}.remember input{accent-color:#f70}.muted{font-size:11px;color:#e98c55}.login-button,.outline{height:45px;width:100%;border-radius:10px;font-size:11px;font-weight:800;letter-spacing:2.5px}.login-button{background:linear-gradient(95deg,#ff9c25,#fb3e23);border:0;color:white;box-shadow:0 0 25px #ff621b5a}.login-button span{float:right;margin-right:12px}.outline{background:transparent;border:1px solid #fa6e20;color:#ff8b41}.outline span{margin-left:8px}.login-button:disabled,.outline:disabled{cursor:not-allowed;opacity:.84}.divider{display:flex;align-items:center;gap:12px;margin:15px 0;color:#9e8e86;font-size:9px;letter-spacing:2px}.divider:before,.divider:after{content:"";height:1px;background:#ffffff22;flex:1}.footer{position:relative;z-index:3;padding:0 25px 100px;margin-top:-62px}.features{max-width:1280px;margin:0 auto;display:flex;justify-content:space-between;gap:12px;align-items:center;padding:17px 19px;border:1px solid #ff85322a;border-radius:14px;background:#100e0bc9;backdrop-filter:blur(9px)}.features span{display:flex;align-items:center;gap:7px;color:#ff7925;font-size:21px}.features b{font-size:9px;letter-spacing:.4px;color:#e6dcd7;font-weight:650;max-width:110px}.footerline{text-align:center;color:#ff8c3b;font-size:9px;letter-spacing:3px;margin-top:13px}.footerline i{display:inline-block;width:1px;height:12px;background:#f70;margin:0 13px;vertical-align:middle}.fire{position:fixed;bottom:0;left:0;right:0;height:155px;pointer-events:none;z-index:6;overflow:hidden}#fire-canvas{position:absolute;inset:0;width:100%;height:100%;display:block}.fire-glow{position:absolute;inset:65% 0 -30%;background:linear-gradient(0deg,#ff390c5c,transparent);filter:blur(20px)}@keyframes glow{50%{filter:brightness(1.4);text-shadow:0 0 40px #ff4e16}}@keyframes smoke{to{transform:translate(80px,-16px)}}@keyframes ambient{to{opacity:.78}}@media(max-width:900px){.layout{grid-template-columns:1fr;justify-items:center;min-height:auto;padding:20px 18px 145px}.login-wrap{grid-column:1;justify-self:center;max-width:390px}.boiler{inset:0;background-position:36% 42%;opacity:.65}.ambient{background:#08090b85}.footer{margin-top:-85px}.features{flex-wrap:wrap;justify-content:center}.features span{width:30%;justify-content:center}}@media(max-width:600px){.top{padding:15px 18px}.wordmark{font-size:15px}.wordmark .mark{font-size:20px}.wordmark small{font-size:8px;letter-spacing:1px}.layout{padding:30px 13px 145px}.glass{border-radius:20px;padding:23px 20px}.features{padding:12px 8px;gap:12px}.features span{width:45%;font-size:16px}.features b{font-size:8px}.footer{padding:0 10px 75px}.footerline{font-size:8px;letter-spacing:1px}.fire{height:105px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}#embers{display:none}}

/* v2.1: mountains visible behind the compact glass login card. */
.glass{background:linear-gradient(135deg,#151316d9,#0a0b0dd9 80%)}
@media(max-width:900px){.window-view{width:65%;opacity:.45;right:0}.ambient{background:#08090b90}}
@media(max-width:600px){.window-view{width:100%;height:65%;opacity:.24}}
/* v2.2 — surface refinements only; v2.1 layout metrics stay unchanged. */
.window-view{
  opacity:1;
  filter:saturate(1.07) brightness(1.24) contrast(1.04);
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 12%,#000 100%);
  mask-image:linear-gradient(90deg,transparent 0%,#000 12%,#000 100%);
}
/* Steel reveal: the crop already includes the sill. Keep its perspective and
   blend the left reveal into the wall instead of adding a rectangular cutout. */
.window-view:before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(176deg,#080b0e 0 4.8%,#45474b 5%,#171b20 5.5%,#080a0e 6.6%,transparent 6.9%),
    linear-gradient(90deg,transparent 10%,#090c10c9 11%,#4b4b4d85 11.8%,#13171b 12.8%,transparent 14%);
  box-shadow:inset 0 -12px 18px #06080b80;
}
.window-view:after{
  background:linear-gradient(180deg,#08090b0d,transparent 24%,transparent 65%,#09090cb3 96%,#09090c 100%),
    linear-gradient(90deg,#09090c55,transparent 24%);
}
.ambient{
  background:linear-gradient(90deg,transparent 0%,#08090b0a 42%,#08090b18 65%,#09090b12 100%);
}
.glass{
  background:linear-gradient(125deg,#1d191bbf 0%,#101115d6 46%,#0a0b0dd9 78%,#241710bf 100%);
  border-color:#ffaf789e;
  box-shadow:0 0 0 1px #ffffff0a inset,0 0 28px #ff6a2526,0 24px 90px #000b;
  -webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);
  transition:border-color .22s ease,box-shadow .22s ease;
}
.glass:before{
  background:linear-gradient(118deg,#ffffff08,transparent 23% 72%,#ffb47707);
  box-shadow:inset 1px 1px 0 #ffe0c74d,inset -1px -1px 0 #ff6a383b,inset 0 0 26px #fa63250a;
}
.glass:after{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  border:1px solid transparent;
  background:linear-gradient(135deg,#ffac70cc,transparent 22%,transparent 76%,#ff813acc) border-box;
  -webkit-mask:linear-gradient(#fff 0 0) padding-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
}
.glass:focus-within{border-color:#ffd5ad;box-shadow:0 0 0 1px #ffcc9940 inset,0 0 34px #ff6a253b,0 24px 90px #000b}
.field{transition:border-color .18s ease,box-shadow .18s ease,background-color .18s ease}
.field:focus-within{border-color:#ffab68;box-shadow:0 0 0 3px #ff7b231c;background-color:#111115}
.field input:focus-visible{outline:0}
.login-button:focus-visible,.outline:focus-visible{outline:2px solid #ffd3aa;outline-offset:4px}
.login-button,.outline{transition:box-shadow .18s ease,border-color .18s ease}
@media(hover:hover){
  .glass:hover{border-color:#ffc08dcc;box-shadow:0 0 0 1px #ffffff0e inset,0 0 32px #ff6a2533,0 24px 90px #000b}
  .field:hover{border-color:#b5a29590}
  .login-button:not(:disabled):hover{box-shadow:0 0 32px #ff782e80}
  .outline:not(:disabled):hover{border-color:#ffc18b;box-shadow:inset 0 0 18px #ff782e18}
}
/* No layout animation; 30 discrete visual steps per second at most. */
.ambient{animation-timing-function:steps(180,end)}
.smoke{animation-timing-function:steps(420,end)}
.flame-icon{animation-timing-function:steps(45,end)}
.effects-paused .ambient,.effects-paused .smoke,.effects-paused .flame-icon{animation-play-state:paused}
@media(max-width:900px){
  .window-view{opacity:.64;filter:saturate(1.03) brightness(1.15)}
  .ambient{background:#08090b78}
  .glass{background:linear-gradient(125deg,#1d191bcc,#0a0b0de3 80%)}
}
@media(max-width:600px){.window-view{opacity:.43}}