/* ==========================================================================
   phpwin.homes - dynamic frame stylesheet
   Mobile-first 320-430px canvas, centered phone frame on wide screens.
   Class prefix: uie7930-  |  CSS variables: --uie7930-*
   Palette: berry #880E4F / charcoal #3A3A3A / ice #BAE1FF / blush #FFB6C1
   Direction: geometric headings, small radius high density, pure-image game
   tiles, fact-summary rhythm, sliding focus indicators, full-width CTAs.
   ========================================================================== */

:root{
  --uie7930-berry:#880E4F;
  --uie7930-berry-deep:#6D0B3F;
  --uie7930-berry-ink:#4A0729;
  --uie7930-berry-night:#33051E;
  --uie7930-charcoal:#3A3A3A;
  --uie7930-ice:#BAE1FF;
  --uie7930-blush:#FFB6C1;
  --uie7930-paper:#FFF7F9;
  --uie7930-line:rgba(186,225,255,.16);
  --uie7930-line-strong:rgba(255,182,193,.45);
  --uie7930-radius:6px;
  --uie7930-radius-lg:10px;
  --uie7930-topbar-h:56px;
  --uie7930-dock-h:64px;
  --uie7930-gap:10px;
  --uie7930-shell-w:480px;
  --uie7930-font-head:"Trebuchet MS","Segoe UI","Helvetica Neue",Arial,sans-serif;
  --uie7930-font-body:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
}

*,*::before,*::after{box-sizing:border-box;}

html{-webkit-text-size-adjust:100%;}

body{
  margin:0;
  font-family:var(--uie7930-font-body);
  font-size:14px;
  line-height:1.55;
  color:var(--uie7930-ice);
  background:#2A0416 radial-gradient(circle at 50% 0,#4A0729 0%,#2A0416 62%);
  min-height:100dvh;
  overflow-x:hidden;
}

img{max-width:100%;height:auto;display:block;}
ul,ol{margin:0;padding:0;list-style:none;}
a{color:var(--uie7930-blush);text-decoration:none;}
a:hover,a:focus-visible{text-decoration:underline;}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer;}
p{margin:0 0 10px;}
p:last-child{margin-bottom:0;}

:focus-visible{outline:2px solid var(--uie7930-ice);outline-offset:2px;border-radius:4px;}
::selection{background:var(--uie7930-blush);color:var(--uie7930-berry-ink);}

/* --------------------------------------------------------------------------
   Shell: the phone canvas
   -------------------------------------------------------------------------- */

.uie7930-shell{
  position:relative;
  width:100%;
  max-width:var(--uie7930-shell-w);
  margin:0 auto;
  min-height:100dvh;
  background:linear-gradient(180deg,var(--uie7930-berry-ink) 0%,var(--uie7930-berry) 26%,var(--uie7930-berry-deep) 100%);
  box-shadow:0 0 0 1px rgba(0,0,0,.35),0 0 44px rgba(0,0,0,.5);
  overflow-x:clip;
  padding-bottom:calc(var(--uie7930-dock-h) + env(safe-area-inset-bottom,0px) + 18px);
}

.uie7930-skip{
  position:absolute;
  left:8px;top:-48px;
  z-index:120;
  padding:9px 14px;
  background:var(--uie7930-ice);
  color:var(--uie7930-berry-ink);
  font-weight:700;font-size:12px;
  border-radius:var(--uie7930-radius);
  transition:top .18s ease;
}
.uie7930-skip:focus{top:64px;text-decoration:none;}

/* --------------------------------------------------------------------------
   Top bar: edge-aligned functional header
   -------------------------------------------------------------------------- */

.uie7930-topbar{
  position:fixed;
  top:0;left:0;right:0;
  margin:0 auto;
  max-width:var(--uie7930-shell-w);
  height:var(--uie7930-topbar-h);
  z-index:60;
  display:flex;
  align-items:center;
  gap:6px;
  padding:0 10px 0 12px;
  background:linear-gradient(180deg,rgba(52,5,30,.97),rgba(74,7,41,.97));
  border-bottom:1px solid var(--uie7930-line-strong);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}

.uie7930-brand{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
}
.uie7930-brand-img{
  width:34px;height:34px;
  flex:0 0 34px;
  border-radius:8px;
  border:1px solid var(--uie7930-line-strong);
  box-shadow:0 2px 8px rgba(0,0,0,.35);
  object-fit:cover;
  background:var(--uie7930-berry-night);
}
.uie7930-brand-name{
  font-family:var(--uie7930-font-head);
  font-size:19px;
  font-weight:800;
  letter-spacing:.04em;
  color:#fff;
  white-space:nowrap;
}

.uie7930-actions{
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:6px;
}

.uie7930-mini{
  min-height:44px;
  min-width:44px;
  padding:7px 12px;
  border-radius:var(--uie7930-radius);
  font-family:var(--uie7930-font-head);
  font-size:12px;
  font-weight:800;
  letter-spacing:.05em;
  text-transform:uppercase;
  transition:transform .14s ease,box-shadow .14s ease,background-color .14s ease;
}
.uie7930-mini-login{
  color:var(--uie7930-ice);
  border:1px solid var(--uie7930-line-strong);
  background:rgba(186,225,255,.06);
}
.uie7930-mini-login:hover{background:rgba(186,225,255,.14);text-decoration:none;}
.uie7930-mini-reg{
  color:var(--uie7930-berry-ink);
  background:linear-gradient(135deg,var(--uie7930-blush) 0%,var(--uie7930-ice) 130%);
  box-shadow:0 3px 10px rgba(255,182,193,.28);
}
.uie7930-mini-reg:hover{box-shadow:0 5px 14px rgba(255,182,193,.42);text-decoration:none;}
.uie7930-mini:active{transform:scale(.94);}

.uie7930-burger{
  width:44px;height:44px;
  display:grid;
  place-content:center;
  gap:4px;
  border-radius:var(--uie7930-radius);
}
.uie7930-burger span{
  width:20px;height:2px;
  border-radius:2px;
  background:var(--uie7930-ice);
  transition:transform .2s ease,opacity .2s ease,width .2s ease;
}
.uie7930-burger:hover span{background:var(--uie7930-blush);}
.uie7930-burger:active span:nth-child(2){width:12px;}

/* --------------------------------------------------------------------------
   Full-height menu layer
   -------------------------------------------------------------------------- */

.uie7930-veil{
  position:fixed;
  inset:0;
  z-index:70;
  background:rgba(26,3,14,.62);
  opacity:0;
  transition:opacity .22s ease;
  border:0;
  cursor:pointer;
}
.uie7930-veil.uie7930-veil-on{opacity:1;}

.uie7930-menu{
  position:fixed;
  top:0;bottom:0;
  right:0;
  z-index:80;
  width:min(84%,318px);
  margin-right:max(0px,calc(50vw - 240px));
  background:linear-gradient(180deg,var(--uie7930-berry-night),var(--uie7930-berry-ink));
  border-left:1px solid var(--uie7930-line-strong);
  display:flex;
  flex-direction:column;
  transform:translateX(102%);
  transition:transform .26s cubic-bezier(.32,.72,.28,1);
  overflow-y:auto;
  overscroll-behavior:contain;
}
.uie7930-menu.uie7930-menu-open{transform:translateX(0);}

.uie7930-menu-head{
  display:flex;
  align-items:center;
  gap:9px;
  padding:14px 14px 12px;
  border-bottom:1px solid var(--uie7930-line);
}
.uie7930-menu-head img{width:30px;height:30px;border-radius:7px;border:1px solid var(--uie7930-line-strong);}
.uie7930-menu-head-name{
  font-family:var(--uie7930-font-head);
  font-weight:800;font-size:16px;color:#fff;letter-spacing:.04em;
}
.uie7930-menu-x{
  margin-left:auto;
  width:44px;height:44px;
  display:grid;place-items:center;
  border-radius:var(--uie7930-radius);
  border:1px solid var(--uie7930-line);
  color:var(--uie7930-ice);
  font-size:16px;line-height:1;
}
.uie7930-menu-x:hover{color:var(--uie7930-blush);border-color:var(--uie7930-line-strong);}

.uie7930-menu-list{padding:8px 10px 6px;}
.uie7930-menu-grp{
  font-family:var(--uie7930-font-head);
  font-size:10.5px;
  font-weight:800;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:rgba(255,182,193,.78);
  padding:14px 10px 6px;
}
.uie7930-menu-grp:first-child{padding-top:6px;}
.uie7930-menu-link{
  display:flex;
  align-items:center;
  gap:10px;
  min-height:46px;
  padding:0 10px;
  border-radius:var(--uie7930-radius);
  color:var(--uie7930-ice);
  font-size:13.5px;
  position:relative;
  transition:background-color .16s ease,color .16s ease;
}
.uie7930-menu-link::before{
  content:"";
  width:3px;height:0;
  border-radius:2px;
  background:var(--uie7930-blush);
  transition:height .18s ease;
}
.uie7930-menu-link:hover,.uie7930-menu-link:focus-visible{
  background:rgba(186,225,255,.08);
  color:#fff;
  text-decoration:none;
}
.uie7930-menu-link:hover::before{height:18px;}

.uie7930-menu-cta{
  margin-top:auto;
  padding:14px 12px calc(16px + env(safe-area-inset-bottom,0px));
  display:grid;
  gap:8px;
  border-top:1px solid var(--uie7930-line);
  background:rgba(0,0,0,.14);
}

/* --------------------------------------------------------------------------
   Main column
   -------------------------------------------------------------------------- */

.uie7930-main{
  padding:calc(var(--uie7930-topbar-h) + 14px) 12px 8px;
}

.uie7930-kicker{
  font-family:var(--uie7930-font-head);
  font-size:10px;
  font-weight:800;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--uie7930-blush);
  margin:0 0 8px;
}

.uie7930-h1{
  font-family:var(--uie7930-font-head);
  font-size:clamp(21px,6.4vw,26px);
  line-height:1.22;
  font-weight:800;
  letter-spacing:.005em;
  color:#fff;
  margin:0 0 12px;
  text-wrap:balance;
}

.uie7930-lead{
  font-size:13.5px;
  color:rgba(186,225,255,.92);
}

.uie7930-lead strong{color:#fff;font-weight:700;}

/* Fact strip: summary-first rhythm */
.uie7930-facts{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:6px;
  margin:14px 0 0;
}
.uie7930-fact{
  background:rgba(58,58,58,.42);
  border:1px solid var(--uie7930-line);
  border-radius:var(--uie7930-radius);
  padding:8px 10px;
  display:flex;
  flex-direction:column;
  gap:2px;
}
.uie7930-fact-n{
  font-family:var(--uie7930-font-head);
  font-size:15px;
  font-weight:800;
  color:#fff;
  line-height:1.1;
}
.uie7930-fact-t{
  font-size:10.5px;
  letter-spacing:.05em;
  text-transform:uppercase;
  color:rgba(255,182,193,.85);
}

/* --------------------------------------------------------------------------
   Full-width CTA
   -------------------------------------------------------------------------- */

.uie7930-cta{
  width:100%;
  min-height:48px;
  margin:12px 0 0;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  border-radius:var(--uie7930-radius-lg);
  background:linear-gradient(135deg,var(--uie7930-blush) 0%,#FFD9DF 55%,var(--uie7930-ice) 145%);
  color:var(--uie7930-berry-ink);
  font-family:var(--uie7930-font-head);
  font-size:14px;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase;
  box-shadow:0 6px 18px rgba(255,182,193,.24);
  transition:transform .15s ease,box-shadow .15s ease;
}
.uie7930-cta:hover{box-shadow:0 8px 22px rgba(255,182,193,.4);text-decoration:none;}
.uie7930-cta:active{transform:translateY(1px) scale(.99);}
.uie7930-cta-ico{font-size:15px;line-height:1;}

.uie7930-cta-note{
  margin:8px 0 0;
  font-size:11px;
  color:rgba(186,225,255,.66);
  text-align:center;
}

/* --------------------------------------------------------------------------
   Carousel
   -------------------------------------------------------------------------- */

.uie7930-carousel{
  position:relative;
  margin:16px 0 4px;
  border-radius:var(--uie7930-radius-lg);
  overflow:hidden;
  border:1px solid var(--uie7930-line-strong);
  background:var(--uie7930-berry-night);
  box-shadow:0 10px 26px rgba(0,0,0,.35);
  touch-action:pan-y;
  user-select:none;
  -webkit-user-select:none;
}

.uie7930-caro-track{
  display:flex;
  transition:transform .42s cubic-bezier(.35,.75,.3,1);
}

.uie7930-slide{
  flex:0 0 100%;
  position:relative;
  aspect-ratio:2/1;
  cursor:pointer;
}
.uie7930-slide img{
  width:100%;height:100%;
  object-fit:cover;
  pointer-events:none;
}

.uie7930-slide-cap{
  position:absolute;
  left:0;right:0;bottom:0;
  padding:26px 12px 10px;
  background:linear-gradient(180deg,rgba(51,5,30,0) 0%,rgba(51,5,30,.92) 78%);
  display:flex;
  flex-direction:column;
  gap:4px;
  pointer-events:none;
}
.uie7930-slide-t{
  font-family:var(--uie7930-font-head);
  font-size:13px;
  font-weight:800;
  color:#fff;
  line-height:1.3;
}
.uie7930-slide-b{
  font-size:11px;
  color:var(--uie7930-blush);
  font-weight:700;
  letter-spacing:.04em;
}

.uie7930-dots{
  position:absolute;
  right:10px;bottom:8px;
  display:flex;
  gap:5px;
  z-index:3;
}
.uie7930-dot{
  width:7px;height:7px;
  border-radius:4px;
  background:rgba(186,225,255,.4);
  transition:width .24s ease,background-color .24s ease;
}
.uie7930-dot.uie7930-dot-on{
  width:20px;
  background:var(--uie7930-blush);
}

/* --------------------------------------------------------------------------
   Category rail with sliding focus indicator
   -------------------------------------------------------------------------- */

.uie7930-rail{
  display:flex;
  gap:6px;
  overflow-x:auto;
  padding:10px 2px 8px;
  margin:0 -12px;
  padding-left:12px;
  padding-right:12px;
  scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
  scroll-snap-type:x proximity;
}
.uie7930-rail::-webkit-scrollbar{display:none;}

.uie7930-railchip{
  flex:0 0 auto;
  scroll-snap-align:start;
  min-height:44px;
  padding:6px 12px 7px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:3px;
  border-radius:var(--uie7930-radius);
  border:1px solid var(--uie7930-line);
  background:rgba(58,58,58,.4);
  position:relative;
  transition:background-color .18s ease,border-color .18s ease;
}
.uie7930-railchip::after{
  content:"";
  position:absolute;
  left:14%;right:14%;bottom:4px;
  height:2px;
  border-radius:2px;
  background:var(--uie7930-blush);
  transform:scaleX(0);
  transform-origin:center;
  transition:transform .22s ease;
}
.uie7930-railchip-name{
  font-family:var(--uie7930-font-head);
  font-size:11.5px;
  font-weight:800;
  letter-spacing:.04em;
  color:var(--uie7930-ice);
  white-space:nowrap;
}
.uie7930-railchip-n{
  font-size:10px;
  color:rgba(255,182,193,.8);
}
.uie7930-railchip:hover{border-color:var(--uie7930-line-strong);}
.uie7930-railchip.uie7930-railchip-on{
  background:rgba(186,225,255,.1);
  border-color:var(--uie7930-line-strong);
}
.uie7930-railchip.uie7930-railchip-on::after{transform:scaleX(1);}
.uie7930-railchip-on .uie7930-railchip-name{color:#fff;}

/* --------------------------------------------------------------------------
   Sections
   -------------------------------------------------------------------------- */

.uie7930-section{padding:18px 0 6px;}

/* Anchor jumps from the rail must clear the fixed top bar */
.uie7930-shelf{scroll-margin-top:calc(var(--uie7930-topbar-h) + 10px);}

.uie7930-sec-head{
  display:flex;
  align-items:baseline;
  gap:8px;
  padding-bottom:6px;
  margin-bottom:10px;
  border-bottom:1px solid var(--uie7930-line);
  position:relative;
}
.uie7930-sec-head::after{
  content:"";
  position:absolute;
  left:0;bottom:-1px;
  width:56px;height:2px;
  border-radius:2px;
  background:linear-gradient(90deg,var(--uie7930-blush),rgba(255,182,193,0));
}

.uie7930-h2{
  font-family:var(--uie7930-font-head);
  font-size:17px;
  line-height:1.28;
  font-weight:800;
  color:#fff;
  margin:0;
  letter-spacing:.01em;
}

.uie7930-count{
  flex:0 0 auto;
  font-family:var(--uie7930-font-head);
  font-size:10.5px;
  font-weight:800;
  letter-spacing:.08em;
  color:var(--uie7930-berry-ink);
  background:var(--uie7930-blush);
  border-radius:20px;
  padding:3px 9px;
  white-space:nowrap;
}

.uie7930-brief{
  font-size:12.5px;
  font-weight:700;
  color:#fff;
  margin:0 0 6px;
  padding-left:9px;
  border-left:3px solid var(--uie7930-blush);
}

.uie7930-body{
  font-size:13px;
  color:rgba(186,225,255,.88);
}
.uie7930-body a{font-weight:700;}
.uie7930-body .uie7930-inline{
  color:var(--uie7930-blush);
  font-weight:700;
  text-decoration:underline;
  text-decoration-color:rgba(255,182,193,.5);
  text-underline-offset:3px;
}
.uie7930-body .uie7930-inline:hover{color:#fff;}

.uie7930-h3{
  font-family:var(--uie7930-font-head);
  font-size:13.5px;
  font-weight:800;
  color:var(--uie7930-blush);
  letter-spacing:.02em;
  margin:14px 0 6px;
}

/* --------------------------------------------------------------------------
   Game grid: pure-image tiles, name below, 4 cols @320 / 5 cols @400+
   -------------------------------------------------------------------------- */

.uie7930-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:10px 6px;
  margin-top:12px;
}

.uie7930-tile{
  display:flex;
  flex-direction:column;
  gap:5px;
  border-radius:var(--uie7930-radius);
  text-align:center;
  transition:transform .16s ease;
  -webkit-tap-highlight-color:transparent;
}
.uie7930-tile:hover{transform:translateY(-2px);}
.uie7930-tile:active{transform:scale(.94);}
.uie7930-tile-img{
  width:100%;
  aspect-ratio:1/1;
  object-fit:cover;
  border-radius:var(--uie7930-radius);
  border:1px solid var(--uie7930-line);
  background:var(--uie7930-berry-night);
  box-shadow:0 4px 12px rgba(0,0,0,.28);
  transition:border-color .18s ease,box-shadow .18s ease;
}
.uie7930-tile:hover .uie7930-tile-img{
  border-color:var(--uie7930-line-strong);
  box-shadow:0 6px 16px rgba(255,182,193,.18);
}
.uie7930-tile-name{
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  font-size:10.5px;
  line-height:1.3;
  font-weight:600;
  color:rgba(186,225,255,.94);
  min-height:27px;
  overflow-wrap:break-word;
}
.uie7930-tile:hover .uie7930-tile-name{color:#fff;}

/* --------------------------------------------------------------------------
   Module: player voices
   -------------------------------------------------------------------------- */

.uie7930-quotes{
  display:grid;
  gap:8px;
  margin-top:12px;
}
.uie7930-quote{
  background:rgba(58,58,58,.4);
  border:1px solid var(--uie7930-line);
  border-left:3px solid var(--uie7930-blush);
  border-radius:var(--uie7930-radius);
  padding:10px 12px;
}
.uie7930-quote p{
  font-size:12.5px;
  color:rgba(186,225,255,.92);
  font-style:italic;
}
.uie7930-quote footer{
  margin-top:6px;
  font-family:var(--uie7930-font-head);
  font-size:11px;
  font-weight:800;
  letter-spacing:.05em;
  color:var(--uie7930-blush);
}

/* --------------------------------------------------------------------------
   Module: promo fact rows
   -------------------------------------------------------------------------- */

.uie7930-offers{
  display:grid;
  gap:6px;
  margin:12px 0;
}
.uie7930-offer{
  display:grid;
  grid-template-columns:86px 1fr;
  gap:10px;
  align-items:start;
  background:rgba(51,5,30,.55);
  border:1px solid var(--uie7930-line);
  border-radius:var(--uie7930-radius);
  padding:9px 10px;
}
.uie7930-offer-k{
  font-family:var(--uie7930-font-head);
  font-size:11px;
  font-weight:800;
  letter-spacing:.05em;
  text-transform:uppercase;
  color:var(--uie7930-blush);
  line-height:1.35;
}
.uie7930-offer-v{
  font-size:12px;
  color:rgba(186,225,255,.88);
  line-height:1.5;
}

/* --------------------------------------------------------------------------
   Module: numbered steps
   -------------------------------------------------------------------------- */

.uie7930-steps{
  counter-reset:uie7930step;
  display:grid;
  gap:8px;
  margin:12px 0;
}
.uie7930-step{
  counter-increment:uie7930step;
  display:grid;
  grid-template-columns:30px 1fr;
  gap:10px;
  align-items:start;
  background:rgba(58,58,58,.38);
  border:1px solid var(--uie7930-line);
  border-radius:var(--uie7930-radius);
  padding:10px;
}
.uie7930-step::before{
  content:counter(uie7930step,decimal-leading-zero);
  font-family:var(--uie7930-font-head);
  font-size:13px;
  font-weight:800;
  color:var(--uie7930-berry-ink);
  background:var(--uie7930-blush);
  border-radius:var(--uie7930-radius);
  min-width:30px;
  height:30px;
  display:grid;
  place-items:center;
}
.uie7930-step b{color:#fff;}
.uie7930-step p{font-size:12.5px;color:rgba(186,225,255,.88);margin:2px 0 0;}

/* --------------------------------------------------------------------------
   Module: play-style comparison rows
   -------------------------------------------------------------------------- */

.uie7930-styles{
  display:grid;
  gap:6px;
  margin:12px 0;
}
.uie7930-style{
  border:1px solid var(--uie7930-line);
  border-radius:var(--uie7930-radius);
  background:linear-gradient(180deg,rgba(58,58,58,.5),rgba(51,5,30,.35));
  padding:9px 10px;
}
.uie7930-style-name{
  font-family:var(--uie7930-font-head);
  font-size:12.5px;
  font-weight:800;
  color:#fff;
  letter-spacing:.03em;
  margin-bottom:5px;
}
.uie7930-style-rows{display:grid;gap:3px;}
.uie7930-style-row{
  display:grid;
  grid-template-columns:64px 1fr;
  gap:8px;
  font-size:11.5px;
  line-height:1.45;
}
.uie7930-style-row b{
  font-family:var(--uie7930-font-head);
  font-size:10px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:rgba(255,182,193,.85);
  padding-top:2px;
}
.uie7930-style-row span{color:rgba(186,225,255,.88);}

/* --------------------------------------------------------------------------
   Module: requirement chips
   -------------------------------------------------------------------------- */

.uie7930-reqs{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:6px;
  margin:12px 0;
}
.uie7930-req{
  background:rgba(58,58,58,.4);
  border:1px solid var(--uie7930-line);
  border-radius:var(--uie7930-radius);
  padding:9px 10px;
}
.uie7930-req b{
  display:block;
  font-family:var(--uie7930-font-head);
  font-size:11.5px;
  font-weight:800;
  color:#fff;
  margin-bottom:3px;
}
.uie7930-req span{font-size:11px;color:rgba(186,225,255,.82);line-height:1.45;}

/* --------------------------------------------------------------------------
   Module: criteria list
   -------------------------------------------------------------------------- */

.uie7930-criteria{
  display:grid;
  gap:6px;
  margin:12px 0;
}
.uie7930-crit{
  display:grid;
  grid-template-columns:1fr;
  border-left:2px solid var(--uie7930-line-strong);
  padding:2px 0 2px 10px;
}
.uie7930-crit b{
  font-family:var(--uie7930-font-head);
  font-size:12.5px;
  font-weight:800;
  color:var(--uie7930-blush);
  display:block;
  margin-bottom:2px;
}
.uie7930-crit span{font-size:12px;color:rgba(186,225,255,.88);line-height:1.5;}

/* --------------------------------------------------------------------------
   Extended footer: sectioned list, promotions > brand > directory > note
   -------------------------------------------------------------------------- */

.uie7930-extended{
  margin-top:22px;
  padding:16px 12px 14px;
  background:linear-gradient(180deg,rgba(26,3,14,.65),rgba(26,3,14,.92));
  border-top:1px solid var(--uie7930-line-strong);
}

.uie7930-xpromo{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:6px;
  margin:12px 0 4px;
}
.uie7930-xbtn{
  min-height:52px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:3px;
  border-radius:var(--uie7930-radius);
  border:1px solid var(--uie7930-line-strong);
  background:linear-gradient(180deg,rgba(255,182,193,.14),rgba(186,225,255,.07));
  font-family:var(--uie7930-font-head);
  font-size:11px;
  font-weight:800;
  letter-spacing:.03em;
  color:#fff;
  transition:transform .15s ease,background-color .15s ease;
}
.uie7930-xbtn:hover{background:linear-gradient(180deg,rgba(255,182,193,.26),rgba(186,225,255,.13));text-decoration:none;}
.uie7930-xbtn:active{transform:scale(.95);}
.uie7930-xbtn small{
  font-family:var(--uie7930-font-body);
  font-size:9.5px;
  font-weight:600;
  letter-spacing:.02em;
  color:rgba(255,182,193,.85);
  text-transform:none;
}

.uie7930-xbrand{
  margin:16px 0 0;
  padding-top:14px;
  border-top:1px solid var(--uie7930-line);
  font-size:12px;
  color:rgba(186,225,255,.82);
  line-height:1.6;
}
.uie7930-xbrand b{color:#fff;}

.uie7930-xdir{
  margin:14px 0 0;
  padding-top:12px;
  border-top:1px solid var(--uie7930-line);
  columns:2;
  column-gap:12px;
}
.uie7930-xdir li{
  break-inside:avoid;
  margin-bottom:2px;
}
.uie7930-xdir a{
  display:flex;
  align-items:center;
  gap:6px;
  min-height:38px;
  font-size:12px;
  color:rgba(186,225,255,.92);
  border-radius:var(--uie7930-radius);
  transition:color .15s ease,background-color .15s ease;
}
.uie7930-xdir a::before{
  content:"";
  width:4px;height:4px;
  border-radius:50%;
  background:var(--uie7930-blush);
  flex:0 0 4px;
}
.uie7930-xdir a:hover{color:#fff;background:rgba(186,225,255,.07);text-decoration:none;}

.uie7930-xnote{
  margin:14px 0 0;
  padding:10px;
  border-radius:var(--uie7930-radius);
  background:rgba(58,58,58,.5);
  border:1px dashed var(--uie7930-line-strong);
  font-size:11px;
  line-height:1.55;
  color:rgba(186,225,255,.72);
}
.uie7930-xnote b{color:var(--uie7930-blush);}

/* --------------------------------------------------------------------------
   Common footer bar
   -------------------------------------------------------------------------- */

.uie7930-footer{
  padding:14px 12px 16px;
  text-align:center;
  border-top:1px solid var(--uie7930-line);
  background:rgba(26,3,14,.55);
}
.uie7930-footer-copy{
  font-family:var(--uie7930-font-head);
  font-size:12px;
  font-weight:700;
  letter-spacing:.04em;
  color:rgba(186,225,255,.9);
  margin:0;
}
.uie7930-footer-sub{
  margin:4px 0 0;
  font-size:10.5px;
  color:rgba(186,225,255,.55);
}

/* --------------------------------------------------------------------------
   Dock: compact icon rack, 5 roles, top indicator line + icon morph
   -------------------------------------------------------------------------- */

.uie7930-dock{
  position:fixed;
  bottom:0;left:0;right:0;
  margin:0 auto;
  max-width:var(--uie7930-shell-w);
  z-index:65;
  height:calc(var(--uie7930-dock-h) + env(safe-area-inset-bottom,0px));
  padding-bottom:env(safe-area-inset-bottom,0px);
  display:grid;
  grid-template-columns:repeat(5,1fr);
  background:rgba(26,3,14,.94);
  border-top:1px solid var(--uie7930-line-strong);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}

.uie7930-dock-item{
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:3px;
  min-width:44px;
  color:rgba(186,225,255,.72);
  -webkit-tap-highlight-color:transparent;
}
.uie7930-dock-item::before{
  content:"";
  position:absolute;
  top:0;left:26%;right:26%;
  height:2.5px;
  border-radius:0 0 3px 3px;
  background:linear-gradient(90deg,var(--uie7930-blush),var(--uie7930-ice));
  transform:scaleX(0);
  transform-origin:center;
  transition:transform .24s cubic-bezier(.32,.72,.28,1);
}
.uie7930-dock-item:hover,.uie7930-dock-item:focus-visible{color:#fff;text-decoration:none;}

.uie7930-dock-ico{
  width:32px;height:32px;
  display:grid;
  place-items:center;
  border-radius:9px;
  background:rgba(186,225,255,.08);
  border:1px solid transparent;
  transition:transform .22s cubic-bezier(.34,1.4,.5,1),background-color .22s ease,color .22s ease,box-shadow .22s ease;
}
.uie7930-dock-ico svg{
  width:17px;height:17px;
  display:block;
}
.uie7930-dock-item:active .uie7930-dock-ico{transform:scale(.86);}

.uie7930-dock-txt{
  font-family:var(--uie7930-font-head);
  font-size:9.5px;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase;
  line-height:1;
}

/* Active role: indicator line slides in, tile morphs into filled chip */
.uie7930-dock-item.uie7930-dock-on{color:#fff;}
.uie7930-dock-item.uie7930-dock-on::before{transform:scaleX(1);}
.uie7930-dock-item.uie7930-dock-on .uie7930-dock-ico{
  background:linear-gradient(150deg,var(--uie7930-blush),#FFD9DF);
  color:var(--uie7930-berry-ink);
  transform:translateY(-1px) scale(1.09);
  box-shadow:0 4px 12px rgba(255,182,193,.32);
}

/* --------------------------------------------------------------------------
   Reveal on scroll (subtle, respects reduced motion)
   -------------------------------------------------------------------------- */

.uie7930-rev{
  opacity:0;
  transform:translateY(12px);
  transition:opacity .5s ease,transform .5s ease;
}
.uie7930-rev.uie7930-rev-in{
  opacity:1;
  transform:none;
}

/* --------------------------------------------------------------------------
   Responsive: 5-column game grid on wider phones
   -------------------------------------------------------------------------- */

@media (max-width:380px){
  .uie7930-brand{gap:6px;}
  .uie7930-brand-name{font-size:16px;letter-spacing:0;}
  .uie7930-topbar{padding:0 6px 0 8px;gap:4px;}
  .uie7930-actions{gap:4px;}
  .uie7930-mini{padding:6px 7px;letter-spacing:.02em;font-size:11px;}
}

@media (min-width:400px){
  .uie7930-grid{grid-template-columns:repeat(5,1fr);gap:12px 7px;}
  .uie7930-main{padding-left:14px;padding-right:14px;}
  .uie7930-rail{margin:0 -14px;padding-left:14px;padding-right:14px;}
  .uie7930-extended{padding-left:14px;padding-right:14px;}
  .uie7930-facts{gap:8px;}
}

@media (min-width:480px){
  .uie7930-h1{font-size:27px;}
  .uie7930-lead,.uie7930-body{font-size:13.5px;}
  .uie7930-slide-t{font-size:14px;}
}

/* Wide screens: keep the centered phone canvas, darken the surround */
@media (min-width:560px){
  body{background:#1E0210;}
  .uie7930-shell{margin-top:0;}
}

/* High-contrast, forced-colors safety */
@media (forced-colors:active){
  .uie7930-tile,.uie7930-dock-item,.uie7930-xbtn,.uie7930-mini{forced-color-adjust:none;}
}

/* Help pages: question stack, symptom rows, term rows, verdict pairs */
.uie7930-crumb{
  margin:0 0 8px;
  font-size:11px;
  letter-spacing:.04em;
  color:rgba(255,182,193,.8);
}
.uie7930-qstack{display:grid;gap:8px;margin-top:12px;}
.uie7930-q{
  position:relative;
  background:rgba(58,58,58,.42);
  border:1px solid var(--uie7930-line);
  border-radius:var(--uie7930-radius);
  padding:12px 12px 10px;
}
.uie7930-q::before{
  content:"";
  position:absolute;
  left:10px;right:10px;top:0;
  height:2px;
  border-radius:0 0 2px 2px;
  background:linear-gradient(90deg,var(--uie7930-blush),rgba(186,225,255,.15));
  transform:scaleX(.35);
  transform-origin:left center;
  transition:transform .22s ease;
}
.uie7930-q:hover::before{transform:scaleX(1);}
.uie7930-q-q{
  font-family:var(--uie7930-font-head);
  font-size:13.5px;
  font-weight:800;
  color:#fff;
  line-height:1.35;
  margin:4px 0 6px;
}
.uie7930-q-a{font-size:12.5px;color:rgba(186,225,255,.9);line-height:1.55;}

.uie7930-sym{display:grid;gap:6px;margin:12px 0;}
.uie7930-sym-row{
  display:grid;
  grid-template-columns:minmax(0,86px) minmax(0,1fr);
  gap:8px;
  align-items:start;
  background:rgba(51,5,30,.5);
  border:1px solid var(--uie7930-line);
  border-radius:var(--uie7930-radius);
  padding:9px 10px;
}
.uie7930-sym-k{
  font-family:var(--uie7930-font-head);
  font-size:10.5px;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--uie7930-blush);
  line-height:1.35;
}
.uie7930-sym-v{font-size:12px;color:rgba(186,225,255,.9);line-height:1.5;}

.uie7930-def{display:grid;gap:6px;margin:12px 0;}
.uie7930-def-row{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:3px;
  border-top:1px solid var(--uie7930-line);
  padding-top:8px;
}
.uie7930-def-row b{
  font-family:var(--uie7930-font-head);
  font-size:12px;
  color:#fff;
}
.uie7930-def-row span{font-size:12.5px;color:rgba(186,225,255,.88);line-height:1.5;}

.uie7930-warn{display:grid;gap:8px;margin:12px 0;}
.uie7930-warn-item{
  border-left:3px solid var(--uie7930-blush);
  background:rgba(58,58,58,.38);
  border-radius:0 var(--uie7930-radius) var(--uie7930-radius) 0;
  padding:8px 10px;
}
.uie7930-warn-item b{display:block;color:#fff;font-size:12.5px;margin-bottom:3px;}
.uie7930-warn-item span{font-size:12.5px;color:rgba(186,225,255,.88);line-height:1.5;}

.uie7930-pair{display:grid;gap:8px;margin:12px 0;}
.uie7930-pair-card{
  border:1px solid var(--uie7930-line-strong);
  border-radius:var(--uie7930-radius);
  overflow:hidden;
  background:rgba(51,5,30,.45);
}
.uie7930-pair-h{
  font-family:var(--uie7930-font-head);
  font-size:11px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--uie7930-berry-ink);
  background:var(--uie7930-blush);
  padding:6px 10px;
}
.uie7930-pair-b{padding:8px 10px;font-size:12.5px;color:rgba(186,225,255,.9);line-height:1.5;}

.uie7930-meter{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin:12px 0;}
.uie7930-meter div{
  min-height:44px;
  border-radius:var(--uie7930-radius);
  border:1px solid var(--uie7930-line);
  background:rgba(58,58,58,.45);
  padding:8px;
}
.uie7930-meter b{display:block;color:#fff;font-family:var(--uie7930-font-head);font-size:13px;}
.uie7930-meter span{font-size:10.5px;color:rgba(255,182,193,.85);letter-spacing:.04em;text-transform:uppercase;}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
    scroll-behavior:auto !important;
  }
  .uie7930-rev{opacity:1;transform:none;}
}
