/* REFERENCE V3 — SHARED DETERMINISTIC FONTS
   Both runnable portal documents load this stylesheet. Keep the font faces
   here so authenticated and unauthenticated canonical surfaces use the same
   local metrics without loading the full Sign-In stylesheet into app.html. */
@font-face{
  font-family:"Daenem Manrope";font-style:normal;font-weight:200 800;font-display:swap;
  src:url("assets/premium/fonts/Manrope-Variable.ttf") format("truetype");
}
@font-face{
  font-family:"Daenem Fraunces";font-style:normal;font-weight:100 900;font-display:swap;
  src:url("assets/premium/fonts/Fraunces-Variable.ttf") format("truetype");
}

/* REFERENCE V3 — CANONICAL SIGN-IN IMPLEMENTATION
   Purpose: deterministic proportions, not "inspired-by" styling.
   Integrate after mapping current DOM. Remove conflicting superseded
   visual rules instead of creating permanent specificity wars.
*/
:root{
  --df-g950:#0b2f27;--df-g900:#103f32;--df-g800:#17533f;
  --df-g700:#1f7756;--df-g600:#2f9a62;--df-lime:#9ddf69;
  --df-gold:#e2bb64;--df-ivory:#fff9ea;--df-paper:#f8fbf5;
  --df-ink:#183b35;--df-ink2:#35574d;--df-muted:#506d63;
  --df-glass:rgba(247,251,244,.78);--df-glass-strong:rgba(250,253,248,.94);
  --df-line:rgba(255,255,255,.68);
  --df-shadow:0 28px 82px rgba(6,39,30,.23);
  --df-shadow-card:0 18px 46px rgba(8,47,36,.16);
  --df-ease:cubic-bezier(.22,.75,.2,1);
  --df-serif:"Daenem Fraunces","Baskerville","Georgia",serif;
  --df-ui:"Daenem Manrope",ui-sans-serif,Arial,sans-serif;
}

html[data-daenem-design="reference-v3"],
html[data-daenem-design="reference-v3"] body.auth-page{
  width:100%;min-width:320px;min-height:100%;margin:0;
  background:var(--df-g950);font-family:var(--df-ui);color:var(--df-ink);
}

html[data-daenem-design="reference-v3"] #portalSigninV712{
  --edge:clamp(24px,3.2vw,76px);
  --auth-w:clamp(500px,29vw,760px);
  --context-w:calc(100vw - var(--auth-w) - (var(--edge) * 1.6));
  position:relative;width:100%;height:100dvh;overflow:hidden;isolation:isolate;
}

html[data-daenem-design="reference-v3"] .v712-visual{
  position:absolute;inset:0;width:100%;height:100%;
  overflow:hidden;background-size:cover!important;background-position:center 42%!important;
}
html[data-daenem-design="reference-v3"] .v712-visual::before{
  content:"";position:absolute;z-index:1;inset:0;pointer-events:none;
  background:
    linear-gradient(90deg,rgba(5,44,33,.53) 0%,rgba(5,44,33,.15) 48%,rgba(8,50,38,.08) 69%,rgba(8,50,38,.18) 100%),
    linear-gradient(180deg,rgba(255,255,255,.02),rgba(6,45,34,.02) 55%,rgba(4,33,27,.30));
}
html[data-daenem-design="reference-v3"] .v712-visual::after{
  content:"";position:absolute;z-index:2;inset:-3%;pointer-events:none;
  background:
    radial-gradient(circle at 58% 14%,rgba(255,245,200,.22),transparent 26%),
    linear-gradient(112deg,transparent 14%,rgba(255,248,214,.10) 46%,transparent 67%);
  background-size:100% 100%,220% 100%;
  animation:df-atmosphere 24s var(--df-ease) infinite;
  mix-blend-mode:screen;
}

/* BRAND: logo + readable glowing tagline */
.df-brand-v3{
  position:absolute;z-index:12;top:clamp(22px,3vh,58px);left:var(--edge);
  width:clamp(220px,15vw,400px);display:grid;justify-items:center;gap:6px;
}
html[data-daenem-design="reference-v3"] .df-brand-v3 .v712-logo{
  position:relative!important;inset:auto!important;width:100%!important;max-width:none!important;height:auto!important;
  filter:drop-shadow(0 12px 26px rgba(3,37,29,.22))
         drop-shadow(0 0 22px rgba(226,187,100,.34))
         drop-shadow(0 0 30px rgba(157,223,105,.18));
  animation:df-logo-float 7.8s ease-in-out infinite,df-logo-glow 9s ease-in-out infinite;
}
.df-brand-tagline-v3{
  color:#fff1b9;font-size:clamp(13px,.82vw,20px);font-weight:800;letter-spacing:.035em;
  text-shadow:0 0 16px rgba(255,225,142,.52),0 0 28px rgba(157,223,105,.20);
  animation:df-logo-glow 9s ease-in-out infinite;
}
/* Theme 01 uses the approved logo asset, which already contains this tagline. */
html[data-daenem-design="reference-v3"] .df-brand-tagline-v3{display:none!important}

/* DRONE: visibly intentional, not tiny, not frontal, never over content */
html[data-daenem-design="reference-v3"] .v2-drone-layer{
  position:absolute!important;z-index:6!important;
  top:clamp(72px,10vh,180px)!important;
  left:clamp(42%,48vw,58%)!important;
  width:clamp(200px,min(14vw,24vh),440px)!important;
  max-width:none!important;height:auto!important;pointer-events:none;
  transform-origin:50% 50%;filter:drop-shadow(0 16px 22px rgba(18,41,34,.20));
  animation:df-drone-hover 6.2s ease-in-out infinite;
}

/* HERO */
html[data-daenem-design="reference-v3"] .v712-hero-copy{
  position:absolute!important;z-index:8!important;left:var(--edge)!important;
  top:clamp(190px,28vh,440px)!important;
  width:min(51vw,920px)!important;
  max-width:calc(100vw - var(--auth-w) - (var(--edge) * 2.2))!important;
  color:var(--df-ivory)!important;
}
html[data-daenem-design="reference-v3"] .v2-hero-identity{
  padding:clamp(24px,1.7vw,42px) clamp(24px,2vw,48px)!important;
  border:1px solid rgba(255,255,255,.30)!important;border-radius:clamp(24px,1.7vw,38px)!important;
  background:radial-gradient(circle at 8% 0%,rgba(226,187,100,.15),transparent 36%),
             linear-gradient(135deg,rgba(4,47,35,.34),rgba(10,75,52,.10))!important;
  box-shadow:0 20px 48px rgba(2,30,23,.15),inset 0 1px rgba(255,255,255,.20)!important;
  backdrop-filter:blur(5px) saturate(1.08)!important;
}
html[data-daenem-design="reference-v3"] .v2-portal-badge{
  display:inline-flex;align-items:center;min-height:34px;padding:7px 14px;
  border:1px solid rgba(226,187,100,.64);border-radius:999px;background:rgba(15,83,58,.60);
  color:#fff5cd;font-size:clamp(10px,.68vw,15px);font-weight:850;letter-spacing:.10em;text-transform:uppercase;
  box-shadow:0 0 0 4px rgba(226,187,100,.06),0 10px 24px rgba(2,31,24,.14);
}
html[data-daenem-design="reference-v3"] .v712-eyebrow{
  display:block;margin:14px 0 10px!important;color:rgba(255,246,211,.94)!important;
  font-size:clamp(10px,.66vw,15px)!important;font-weight:850;letter-spacing:.16em!important;text-transform:uppercase;
}
html[data-daenem-design="reference-v3"] .v712-hero-copy h1{
  display:grid;gap:.01em;margin:0!important;font-family:var(--df-serif)!important;
  font-size:clamp(54px,4.45vw,120px)!important;font-weight:650!important;
  line-height:.93!important;letter-spacing:-.045em!important;text-wrap:balance;
  text-shadow:0 7px 30px rgba(2,27,22,.44);
}
html[data-daenem-design="reference-v3"] .v712-hero-copy h1 strong{
  color:var(--df-lime)!important;font-weight:720!important;
  text-shadow:0 0 18px rgba(157,223,105,.56),0 0 42px rgba(69,170,91,.30),0 7px 28px rgba(2,27,22,.38)!important;
  animation:df-green-breathe 9.5s ease-in-out infinite;
}
html[data-daenem-design="reference-v3"] .v712-hero-copy p{
  max-width:760px!important;margin:clamp(14px,1.2vw,26px) 0 0!important;
  color:rgba(252,255,250,.95)!important;font-size:clamp(14px,.92vw,22px)!important;
  font-weight:540;line-height:1.48!important;
}

/* AUTH RAIL */
html[data-daenem-design="reference-v3"] .v712-auth-panel{
  position:absolute!important;z-index:20!important;top:0!important;right:0!important;
  width:var(--auth-w)!important;height:100dvh!important;
  padding:clamp(18px,2vh,32px) clamp(18px,1.55vw,36px)!important;
  display:flex!important;align-items:center!important;justify-content:center!important;box-sizing:border-box;
  background:linear-gradient(90deg,rgba(244,249,244,.10),rgba(244,249,244,.20))!important;
  backdrop-filter:blur(10px) saturate(1.05);
}
html[data-daenem-design="reference-v3"] .v712-auth-card{
  width:100%!important;max-height:calc(100dvh - 70px)!important;overflow:auto!important;box-sizing:border-box;
  padding:clamp(26px,1.9vw,44px)!important;border:1px solid rgba(255,255,255,.74)!important;
  border-radius:clamp(26px,1.8vw,38px)!important;
  background:radial-gradient(circle at 90% 0%,rgba(157,223,105,.08),transparent 27%),var(--df-glass-strong)!important;
  color:var(--df-ink)!important;box-shadow:var(--df-shadow),inset 0 1px 0 rgba(255,255,255,.92)!important;
  backdrop-filter:blur(28px) saturate(1.08)!important;
}
html[data-daenem-design="reference-v3"] .auth-card-head h2{
  color:var(--df-g900)!important;font-family:var(--df-serif)!important;
  font-size:clamp(34px,2.25vw,58px)!important;line-height:1!important;letter-spacing:-.035em!important;
}
html[data-daenem-design="reference-v3"] .v6-auth-tabs{
  display:grid!important;grid-template-columns:1fr 1fr!important;gap:5px!important;padding:5px!important;
  margin:22px 0!important;border:1px solid rgba(31,119,86,.14)!important;border-radius:16px!important;
  background:rgba(238,247,239,.90)!important;box-shadow:inset 0 1px 4px rgba(14,67,49,.06)!important;
}
html[data-daenem-design="reference-v3"] .v6-auth-tab{
  min-height:50px!important;border:0!important;border-radius:12px!important;background:transparent!important;
  color:var(--df-g900)!important;font-weight:850!important;
  transition:transform 240ms var(--df-ease),box-shadow 240ms var(--df-ease),background 240ms var(--df-ease),color 240ms var(--df-ease)!important;
}
html[data-daenem-design="reference-v3"] .v6-auth-tab.active{
  color:#fff!important;background:linear-gradient(135deg,var(--df-g700),var(--df-g600))!important;
  box-shadow:0 10px 24px rgba(31,119,86,.25),0 0 0 1px rgba(255,255,255,.24) inset,0 0 24px rgba(157,223,105,.34)!important;
  transform:translateY(-1px);
}
html[data-daenem-design="reference-v3"] .form-stack input{
  min-height:52px!important;border:1px solid rgba(31,119,86,.20)!important;border-radius:13px!important;
  background:rgba(255,255,255,.88)!important;color:var(--df-ink)!important;
}
html[data-daenem-design="reference-v3"] .form-stack input:focus{
  outline:none!important;border-color:rgba(47,154,98,.68)!important;background:#fff!important;
  box-shadow:0 0 0 4px rgba(157,223,105,.20),0 8px 20px rgba(16,63,50,.08)!important;
}
html[data-daenem-design="reference-v3"] .primary-button{
  min-height:52px!important;border-radius:13px!important;
  background:linear-gradient(135deg,var(--df-g700),var(--df-g600))!important;color:#fff!important;font-weight:850!important;
  box-shadow:0 14px 26px rgba(31,119,86,.23),0 0 0 1px rgba(255,255,255,.18) inset!important;
}
html[data-daenem-design="reference-v3"] .primary-button:hover{
  transform:translateY(-1px);box-shadow:0 18px 30px rgba(31,119,86,.28),0 0 18px rgba(157,223,105,.28)!important;
}

.df-provisional-note-v3{
  display:grid;gap:5px;margin-top:16px;padding:13px 14px;border:1px solid rgba(226,187,100,.40);
  border-radius:14px;background:linear-gradient(135deg,rgba(255,249,234,.94),rgba(245,251,239,.92));
  color:var(--df-ink2);font-size:12px;line-height:1.45;
}
.df-provisional-note-v3 strong{color:var(--df-g900);font-size:13px;}

/* LIVE CONTEXT */
html[data-daenem-design="reference-v3"] .v2-context-dock{
  position:absolute!important;z-index:9!important;left:var(--edge)!important;right:calc(var(--auth-w) + var(--edge))!important;
  bottom:clamp(16px,2vh,28px)!important;display:grid!important;gap:10px!important;
}
html[data-daenem-design="reference-v3"] .v712-spotlight-widget,
html[data-daenem-design="reference-v3"] .v712-news-widget,
html[data-daenem-design="reference-v3"] .v712-widget{
  border:1px solid var(--df-line)!important;border-radius:18px!important;
  background:radial-gradient(circle at 0 0,rgba(255,255,255,.32),transparent 36%),var(--df-glass)!important;
  color:var(--df-ink)!important;box-shadow:var(--df-shadow-card),inset 0 1px 0 rgba(255,255,255,.72)!important;
  backdrop-filter:blur(20px) saturate(1.05)!important;
}
html[data-daenem-design="reference-v3"] .v712-auxiliary-head span,
html[data-daenem-design="reference-v3"] .v712-widget-head span,
html[data-daenem-design="reference-v3"] .v712-world-title strong{
  color:var(--df-g900)!important;font-weight:900!important;letter-spacing:.10em!important;
}
html[data-daenem-design="reference-v3"] .v712-news-status,
html[data-daenem-design="reference-v3"] .v712-weather-status,
html[data-daenem-design="reference-v3"] .v712-weather-source,
html[data-daenem-design="reference-v3"] .v712-clock-card small{
  color:var(--df-muted)!important;
}

/* Global Time: exact six. */
html[data-daenem-design="reference-v3"] .v712-clock-scroll-body{
  overflow:visible!important;max-height:none!important;
}
html[data-daenem-design="reference-v3"] .v712-clock-grid{
  display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important;
}
html[data-daenem-design="reference-v3"] .v712-clock-card{
  min-width:0!important;min-height:116px!important;border:1px solid rgba(255,255,255,.70)!important;
  border-radius:15px!important;background:rgba(250,253,248,.74)!important;overflow:hidden!important;
}

/* ULTRAWIDE / SHORT WIDE SCREEN — key fix for giant dead space. */
@media (min-width:1800px) and (min-aspect-ratio:2/1){
  html[data-daenem-design="reference-v3"] #portalSigninV712{
    --auth-w:clamp(520px,27vw,760px);
  }
  html[data-daenem-design="reference-v3"] .df-brand-v3{width:clamp(250px,13vw,390px);}
  html[data-daenem-design="reference-v3"] .v712-hero-copy{
    top:clamp(155px,20vh,270px)!important;width:min(44vw,900px)!important;
  }
  html[data-daenem-design="reference-v3"] .v712-hero-copy h1{font-size:clamp(58px,3.7vw,102px)!important;}
  html[data-daenem-design="reference-v3"] .v2-context-dock{bottom:14px!important;gap:8px!important;}
  html[data-daenem-design="reference-v3"] .v712-clock-grid{grid-template-columns:repeat(6,minmax(0,1fr))!important;}
  html[data-daenem-design="reference-v3"] .v712-clock-card{min-height:102px!important;}
  html[data-daenem-design="reference-v3"] .v2-drone-layer{
    width:clamp(260px,min(12vw,26vh),420px)!important;
    top:clamp(55px,8vh,120px)!important;
  }
}

/* 4K / tall large screens */
@media (min-width:2500px) and (min-height:1500px){
  html[data-daenem-design="reference-v3"] #portalSigninV712{--auth-w:clamp(720px,30vw,1050px);}
  html[data-daenem-design="reference-v3"] .df-brand-v3{width:clamp(320px,13vw,500px);}
  html[data-daenem-design="reference-v3"] .v712-hero-copy{top:clamp(360px,28vh,620px)!important;width:min(49vw,1300px)!important;}
  html[data-daenem-design="reference-v3"] .v712-hero-copy h1{font-size:clamp(96px,4.5vw,170px)!important;}
  html[data-daenem-design="reference-v3"] .v712-hero-copy p{font-size:clamp(20px,.95vw,30px)!important;}
  html[data-daenem-design="reference-v3"] .v2-drone-layer{width:clamp(330px,min(13vw,23vh),520px)!important;}
}

/* laptop */
@media (max-width:1366px){
  html[data-daenem-design="reference-v3"] #portalSigninV712{--auth-w:clamp(420px,35vw,500px);}
  html[data-daenem-design="reference-v3"] .df-brand-v3{width:190px;}
  html[data-daenem-design="reference-v3"] .v712-hero-copy{top:clamp(150px,22vh,235px)!important;width:min(48vw,650px)!important;}
  html[data-daenem-design="reference-v3"] .v712-hero-copy h1{font-size:clamp(44px,4.4vw,64px)!important;}
  html[data-daenem-design="reference-v3"] .v2-context-dock{gap:7px!important;bottom:10px!important;}
}

/* tablet / mobile deliberate reflow */
@media (max-width:1023px){
  html[data-daenem-design="reference-v3"] #portalSigninV712{
    height:auto!important;min-height:100dvh!important;overflow:visible!important;
  }
  html[data-daenem-design="reference-v3"] .v712-visual{
    position:relative!important;height:auto!important;min-height:100dvh!important;overflow:visible!important;
  }
  html[data-daenem-design="reference-v3"] .df-brand-v3{left:16px;top:18px;width:clamp(175px,36vw,250px);}
  html[data-daenem-design="reference-v3"] .v712-hero-copy{
    position:relative!important;left:auto!important;top:auto!important;width:auto!important;max-width:none!important;
    margin:clamp(130px,18vh,190px) 14px 18px!important;
  }
  html[data-daenem-design="reference-v3"] .v2-context-dock{
    position:relative!important;left:auto!important;right:auto!important;bottom:auto!important;margin:0 12px 96px!important;
  }
  html[data-daenem-design="reference-v3"] .v712-clock-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  html[data-daenem-design="reference-v3"] .v2-drone-layer{
    width:clamp(110px,24vw,165px)!important;top:78px!important;left:auto!important;right:7%!important;
  }
}

@media (max-width:430px){
  html[data-daenem-design="reference-v3"] .df-brand-v3{width:168px;}
  html[data-daenem-design="reference-v3"] .v2-hero-identity{padding:20px 18px!important;}
  html[data-daenem-design="reference-v3"] .v712-hero-copy h1{font-size:clamp(42px,12vw,56px)!important;}
  html[data-daenem-design="reference-v3"] .v712-hero-copy p{font-size:14px!important;}
  html[data-daenem-design="reference-v3"] .v712-clock-card{min-height:134px!important;}
}

@media (prefers-reduced-motion:reduce){
  html[data-daenem-design="reference-v3"] *,
  html[data-daenem-design="reference-v3"] *::before,
  html[data-daenem-design="reference-v3"] *::after{
    animation:none!important;transition-duration:.01ms!important;scroll-behavior:auto!important;
  }
}

@keyframes df-atmosphere{
  0%,100%{background-position:center,120% 0;transform:scale(1)}
  50%{background-position:center,-35% 0;transform:scale(1.008)}
}
@keyframes df-logo-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@keyframes df-logo-glow{
  0%,100%{filter:drop-shadow(0 12px 26px rgba(3,37,29,.22)) drop-shadow(0 0 18px rgba(226,187,100,.26))}
  50%{filter:drop-shadow(0 14px 28px rgba(3,37,29,.24)) drop-shadow(0 0 26px rgba(226,187,100,.40)) drop-shadow(0 0 32px rgba(157,223,105,.20))}
}
@keyframes df-green-breathe{
  0%,100%{text-shadow:0 0 16px rgba(157,223,105,.48),0 0 34px rgba(69,170,91,.22),0 7px 28px rgba(2,27,22,.38)}
  50%{text-shadow:0 0 22px rgba(157,223,105,.70),0 0 48px rgba(69,170,91,.35),0 7px 28px rgba(2,27,22,.38)}
}
@keyframes df-drone-hover{
  0%,100%{transform:translate3d(0,0,0) rotate(-2deg)}
  50%{transform:translate3d(2px,-4px,0) rotate(1deg)}
}
