/* ==========================================================
   DOUVI V5.8 — UI POLISH
   Content is unchanged. This file intentionally overrides
   legacy spacing / micro typography / mobile game shell only.
   ========================================================== */

:root{
  --v58-section-y:56px;
  --v58-section-y-mobile:36px;
  --v58-body:16px;
  --v58-small:13px;
  --v58-micro:12px;
  --v58-header-h:62px;
}

/* ---------- Core rhythm ---------- */
body{
  font-size:var(--v58-body);
  line-height:1.58;
}
.shell{
  width:min(calc(100% - 40px),1160px);
}
.section{
  padding:var(--v58-section-y) 0!important;
}
.footer{
  padding:38px 0 48px!important;
}
.footer-grid{
  gap:20px!important;
}
.footer a{
  font-size:13px!important;
  line-height:1.45;
}
.footer h4{
  font-size:13px;
}

/* Large heroes: less dead space, same content. */
.labs-v5-hero{
  padding:68px 0 52px!important;
}
.labs-hub-hero{
  padding:50px 0 24px!important;
}
.work-detail-hero{
  padding:42px 0 28px!important;
}
.acq-hero{
  padding:48px 0 34px!important;
}
.today-hero,
.decision-hero,
.analytics-dashboard-hero{
  padding:42px 0 18px!important;
}
.mind-hub-hero,.money-hub-hero,.life-hub-hero,.daily-hub-hero{
  padding:50px 0 22px!important;
}
.mind-game-hero,.money-game-hero,.life-game-hero,.daily-game-hero{
  padding:28px 0 12px!important;
}

/* Avoid double-large spacing between a hero and first section. */
.labs-hub-hero + .section,
.work-detail-hero + .section,
.acq-hero + .section,
.today-hero + section,
.decision-hero + *,
.analytics-dashboard-hero + *{
  padding-top:30px!important;
}

/* ---------- Header ---------- */
.labs-nav{
  height:var(--v58-header-h)!important;
}
.labs-brand{
  font-size:15px!important;
}
.labs-brand img{
  width:36px!important;
  height:36px!important;
  border-radius:12px!important;
}
.labs-public-nav{
  gap:20px!important;
}
.labs-public-nav a{
  font-size:13px!important;
  font-weight:700!important;
}
.labs-account-chip{
  min-height:40px!important;
  font-size:12px!important;
}
.tool-btn,.lang,.menu-btn{
  min-height:40px!important;
}
.labs-lang{
  font-size:12px!important;
}

/* ---------- Typography: stop using unreadable 7–10px UI text ---------- */
.kicker,
.eyebrow,
.portfolio-status,
.portfolio-card-meta,
.portfolio-card-foot,
.labs-v5-category-top span,
.labs-v5-category-top b,
.labs-v5-current>small,
.labs-v5-category-link,
.labs-v5-hero-note,
.portfolio-home-all,
.work-detail-badges>span,
.work-back,
.labs-origin-strip a,
.game-origin-label,
.acq-badges span,
.acq-trust,
.acq-related-card span,
.acq-related-card small,
.acq-discover-meta,
.acq-discover-card>b,
.today-date,
.today-overview span,
.today-primary-reward,
.today-mission small,
.today-secondary-card>span,
.today-context-card>span,
.today-context-card>small,
.today-recent-row small,
.decision-group,
.decision-badge,
.decision-signal span,
.decision-signal small,
.decision-metric span,
.decision-editor-field label,
.analytics-toolbar label span,
.analytics-metrics span,
.analytics-panel .kicker,
.analytics-table th,
.analytics-day-label,
.analytics-retention-note,
.analytics-growth-grid span,
.analytics-growth-grid small,
.analytics-retention-card span,
.analytics-retention-card small{
  font-size:var(--v58-micro)!important;
  line-height:1.35!important;
}

/* Secondary text */
.portfolio-card p,
.labs-v5-category>p,
.labs-v5-current span,
.labs-account-person small,
.labs-account-links small,
.profile-toggle-box small,
.work-detail-panel dt,
.work-detail-panel dd,
.acq-discover-card p,
.acq-note p,
.today-section-head>p,
.today-primary-card p,
.today-secondary-card>small,
.today-recent-row b,
.today-context-card>small,
.decision-why ul,
.decision-rule-note p,
.decision-state,
.analytics-state,
.analytics-table td{
  font-size:var(--v58-small)!important;
  line-height:1.5!important;
}

/* Body copy in important surfaces */
.lead,
.labs-v5-hero .lead,
.labs-hub-hero .lead,
.work-detail-copy .lead,
.acq-hero .lead,
.today-hero .lead,
.decision-hero .lead{
  line-height:1.58!important;
}
.mind-disclaimer,.money-disclaimer,.life-disclaimer,.daily-disclaimer{
  font-size:13px!important;
  line-height:1.6!important;
}

/* Control text should be readable, not micro. */
.btn{
  min-height:46px!important;
  padding:0 16px!important;
  font-size:13px!important;
}
.portfolio-filterbar button{
  min-height:40px!important;
  font-size:12px!important;
  padding:0 13px!important;
}

/* Cards: cleaner, more deliberate, less "everything is a giant block". */
.labs-v5-category{
  min-height:350px!important;
  padding:22px!important;
}
.labs-v5-category h3{
  margin-top:52px!important;
}
.portfolio-card{
  min-height:270px!important;
  padding:17px!important;
}
.portfolio-card-meta{
  margin-top:25px!important;
}
.labs-product-row,.labs-game-card{
  padding:20px!important;
}
.labs-experiment-card,.labs-principles article{
  min-height:220px!important;
}
.labs-experiment-card h2,.labs-principles h2{
  margin-top:34px!important;
}
.labs-v5-platform-card,
.labs-v5-about{
  padding:26px!important;
}
.labs-v5-ai-card{
  padding:22px!important;
}

/* Section headers: tighter */
.labs-v5-section-head,
.today-section-head{
  margin-bottom:18px!important;
}
.section-head{
  margin-bottom:22px!important;
}

/* Account sheet/dropdown: readable */
.labs-account-panel{
  width:min(405px,calc(100vw - 24px))!important;
}
.labs-account-person b{
  font-size:14px!important;
}
.labs-account-links b{
  font-size:13px!important;
}
.labs-account-links>a{
  min-height:55px;
  padding:10px 11px!important;
}
.labs-menu-icon{
  width:34px!important;
  height:34px!important;
}
.labs-signout{
  min-height:46px!important;
  font-size:12px!important;
}

/* ---------- Mobile game shell ---------- */
html.game-shell-active,
html.game-shell-active body{
  width:100%;
  height:100%;
  margin:0;
  overflow:hidden!important;
  overscroll-behavior:none;
}

.protected-game-body{
  --game-viewport-height:100dvh;
  width:100%;
  height:var(--game-viewport-height)!important;
  min-height:100svh!important;
  max-height:var(--game-viewport-height)!important;
  margin:0!important;
  padding:0!important;
  overflow:hidden!important;
  display:grid!important;
  grid-template-rows:54px 34px minmax(0,1fr)!important;
  background:#050a08;
  overscroll-behavior:none;
}

.protected-game-body .labs-header{
  position:relative!important;
  top:auto!important;
  height:54px!important;
  min-height:54px!important;
  overflow:hidden;
}
.protected-game-body .labs-nav{
  height:54px!important;
  min-height:54px!important;
  width:min(calc(100% - 20px),1160px)!important;
}
.protected-game-body .labs-public-nav{
  display:none!important;
}
.protected-game-body .labs-theme,
.protected-game-body .labs-lang,
.protected-game-body .labs-menu-btn{
  display:none!important;
}
.protected-game-body .labs-account-chip{
  min-height:36px!important;
  max-width:135px;
}
.protected-game-body .labs-brand img{
  width:34px!important;
  height:34px!important;
}
.protected-game-body .labs-brand span{
  font-size:13px!important;
}

.protected-game-body .game-origin-label{
  min-height:34px;
  height:34px;
  padding:0 10px!important;
  display:flex!important;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  background:#07110f!important;
  border-bottom:1px solid rgba(255,255,255,.08)!important;
  color:rgba(255,255,255,.72)!important;
  font-size:10px!important;
  line-height:1!important;
  letter-spacing:.06em!important;
  overflow:hidden;
  white-space:nowrap;
}

.game-shell-actions{
  display:flex;
  align-items:center;
  gap:6px;
  margin-left:auto;
}
.game-shell-btn{
  min-height:26px;
  height:26px;
  padding:0 9px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:9px;
  background:rgba(255,255,255,.05);
  color:rgba(255,255,255,.85);
  font:inherit;
  font-size:10px;
  font-weight:800;
  cursor:pointer;
}

.protected-game-body .protected-player{
  position:relative!important;
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  overflow:hidden!important;
  inset:auto!important;
  overscroll-behavior:none;
  contain:layout paint size;
}
.protected-game-body .protected-game-frame{
  position:absolute!important;
  inset:0!important;
  display:block;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  border:0!important;
  overflow:hidden;
  touch-action:manipulation;
  overscroll-behavior:none;
}

.protected-game-body .player-loading,
.protected-game-body .player-login-card{
  max-height:calc(var(--game-viewport-height) - 100px);
}
.protected-game-body .player-login-card{
  width:min(calc(100% - 24px),430px)!important;
  padding:24px!important;
}
.protected-game-body .player-login-card p,
.protected-game-body .player-loading span{
  font-size:13px!important;
}

.game-focus-exit{
  display:none;
  position:fixed;
  z-index:9999;
  right:max(10px,env(safe-area-inset-right));
  top:max(10px,env(safe-area-inset-top));
  min-width:42px;
  height:42px;
  padding:0 11px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:13px;
  background:rgba(4,10,8,.78);
  backdrop-filter:blur(10px);
  color:#fff;
  font-size:12px;
  font-weight:850;
  box-shadow:0 8px 30px rgba(0,0,0,.28);
}

.protected-game-body.game-focus-mode{
  grid-template-rows:0 0 minmax(0,1fr)!important;
}
.protected-game-body.game-focus-mode .labs-header,
.protected-game-body.game-focus-mode .game-origin-label{
  visibility:hidden;
  pointer-events:none;
}
.protected-game-body.game-focus-mode .game-focus-exit{
  display:block;
}
.protected-player:fullscreen,
.protected-player:-webkit-full-screen{
  width:100vw!important;
  height:100dvh!important;
  min-height:100dvh!important;
  background:#000!important;
}
.protected-player:fullscreen .protected-game-frame,
.protected-player:-webkit-full-screen .protected-game-frame{
  width:100%!important;
  height:100%!important;
}

/* ---------- Mobile ---------- */
@media(max-width:720px){
  :root{
    --v58-section-y-mobile:34px;
    --v58-micro:12px;
    --v58-small:13px;
  }

  .shell{
    width:min(calc(100% - 24px),1160px)!important;
  }
  .section{
    padding:var(--v58-section-y-mobile) 0!important;
  }
  .footer{
    padding:30px 0 38px!important;
  }

  .labs-nav{
    height:58px!important;
  }
  .labs-brand span{
    font-size:13px!important;
  }
  .labs-account-chip{
    font-size:11px!important;
  }

  .labs-v5-hero{
    padding:36px 0 34px!important;
  }
  .labs-v5-hero h1{
    font-size:40px!important;
    margin:14px 0 14px!important;
  }
  .labs-v5-hero .lead{
    font-size:15px!important;
  }
  .labs-v5-hero-note{
    margin-top:14px!important;
  }

  .labs-hub-hero{
    padding:34px 0 18px!important;
  }
  .labs-hub-hero h1{
    font-size:38px!important;
    margin:13px 0!important;
  }
  .work-detail-hero,
  .acq-hero,
  .today-hero,
  .decision-hero,
  .analytics-dashboard-hero{
    padding:30px 0 16px!important;
  }

  .labs-v5-category{
    min-height:300px!important;
    padding:17px!important;
  }
  .labs-v5-category h3{
    margin-top:34px!important;
    font-size:29px!important;
  }
  .labs-v5-current{
    padding-top:18px!important;
  }
  .labs-v5-platform-card,
  .labs-v5-about{
    padding:18px!important;
  }
  .labs-v5-ai-card{
    padding:16px!important;
  }

  .portfolio-card{
    min-height:220px!important;
    padding:15px!important;
  }
  .portfolio-card-meta{
    margin-top:19px!important;
  }
  .portfolio-card h3{
    font-size:24px!important;
  }

  /* Keep readable text even when old styles had 7–10px. */
  .portfolio-card p,
  .labs-v5-category>p,
  .labs-v5-current span,
  .acq-discover-card p,
  .today-section-head>p,
  .today-primary-card p,
  .decision-why ul,
  .analytics-table td{
    font-size:13px!important;
  }

  .labs-account-panel{
    max-height:min(86dvh,780px)!important;
  }
  .labs-account-links small{
    display:block!important;
    font-size:11px!important;
  }

  /* Game: use the actually visible mobile viewport. */
  .protected-game-body{
    grid-template-rows:50px 32px minmax(0,1fr)!important;
  }
  .protected-game-body .labs-header{
    height:50px!important;
    min-height:50px!important;
  }
  .protected-game-body .labs-nav{
    height:50px!important;
    min-height:50px!important;
  }
  .protected-game-body .labs-brand span{
    display:none!important;
  }
  .protected-game-body .game-origin-label{
    min-height:32px;
    height:32px;
    font-size:10px!important;
  }
  .game-shell-btn{
    min-height:25px;
    height:25px;
    padding:0 8px;
    font-size:10px;
  }
}

@media(max-width:390px){
  .labs-v5-hero h1{
    font-size:37px!important;
  }
  .labs-hub-hero h1{
    font-size:35px!important;
  }
  .game-origin-title{
    max-width:120px;
    overflow:hidden;
    text-overflow:ellipsis;
  }
}

/* Motion restraint = more polished */
@media(prefers-reduced-motion:no-preference){
  .portfolio-card,
  .labs-v5-category,
  .labs-product-row,
  .labs-game-card,
  .labs-experiment-card,
  .today-primary-card,
  .today-secondary-card{
    transition:transform .16s ease,border-color .16s ease,background-color .16s ease!important;
  }
}