/* AI Life UI V2 — cinematic mobile game polish layer */
:root{
  --ailife-bg:#070810;
  --ailife-panel:rgba(16,14,24,.64);
  --ailife-panel-strong:rgba(14,12,21,.82);
  --ailife-line:rgba(255,255,255,.13);
  --ailife-line-hot:rgba(255,121,181,.38);
  --ailife-pink:#ff6dad;
  --ailife-pink-soft:#ff9bc9;
  --ailife-purple:#8c6dff;
  --ailife-gold:#e4bd86;
  --ailife-blue:#6ba6ff;
  --ailife-text:#fff8fb;
  --ailife-muted:#a9a0ae;
  --ailife-shadow:0 24px 80px rgba(0,0,0,.44);
}

html{background:#05060b;color-scheme:dark}
body{background:radial-gradient(circle at 50% -10%,#211324 0,#0a0b12 40%,#05060b 100%);letter-spacing:.01em}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:9999;opacity:.055;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E")}
button{-webkit-tap-highlight-color:transparent;transition:transform .2s ease,border-color .2s ease,background .2s ease,box-shadow .2s ease,opacity .2s ease}
button:active{transform:scale(.97)}

.life-shell,.game-shell,.chat-screen,.growth,.date-screen{isolation:isolate}
.life-shell::before,.game-shell::before,.chat-screen::before,.growth::before,.date-screen::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(circle at 80% 10%,rgba(255,86,163,.09),transparent 30%),radial-gradient(circle at 15% 42%,rgba(97,111,255,.07),transparent 28%)}

/* Global resource pills */
.resource-bar{gap:6px!important}
.resource-bar span{position:relative;overflow:hidden;background:linear-gradient(180deg,rgba(29,28,40,.86),rgba(10,10,17,.7))!important;border:1px solid rgba(255,255,255,.12)!important;box-shadow:inset 0 1px rgba(255,255,255,.08),0 8px 24px rgba(0,0,0,.18);backdrop-filter:blur(18px) saturate(145%)}
.resource-bar span::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 15%,rgba(255,255,255,.08) 42%,transparent 68%);transform:translateX(-130%);animation:resourceShine 8s ease-in-out infinite}
.resource-bar span:nth-child(2)::after{animation-delay:1.3s}.resource-bar span:nth-child(3)::after{animation-delay:2.6s}

/* Digital life landing */
.life-shell{background:radial-gradient(circle at 74% 3%,rgba(112,48,110,.28),transparent 33%),radial-gradient(circle at 7% 55%,rgba(38,72,126,.2),transparent 36%),linear-gradient(180deg,#0a0b13 0,#070810 72%,#05060a 100%)!important}
.life-head{padding:4px 2px 0}
.life-head b{font-weight:800;text-shadow:0 0 28px rgba(255,118,182,.16)}
.life-avatar-card{position:relative;overflow:hidden;border-color:rgba(255,255,255,.18)!important;box-shadow:0 34px 100px rgba(0,0,0,.52),inset 0 0 80px rgba(255,255,255,.025)!important}
.life-avatar-card::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.04),transparent 30%,transparent 55%,rgba(6,7,12,.82) 92%),linear-gradient(90deg,rgba(255,97,170,.06),transparent 45%);pointer-events:none}
.life-avatar-card>div{position:relative;z-index:2}
.companion-switch{box-shadow:0 12px 28px rgba(0,0,0,.28),inset 0 1px rgba(255,255,255,.07)}
.companion-switch .active{background:linear-gradient(135deg,#ff7db8,#c63e7f)!important;box-shadow:0 5px 20px rgba(255,83,158,.35)}
.hero-copy .eyebrow{color:#f0b4d1;opacity:.9}
.hero-copy h1{letter-spacing:-.045em;text-wrap:balance}
.hero-copy button,.primary{position:relative;overflow:hidden;border-color:rgba(255,153,201,.42)!important;background:linear-gradient(135deg,#d64286 0,#872f71 54%,#56367e 100%)!important;box-shadow:0 14px 42px rgba(211,53,127,.27),inset 0 1px rgba(255,255,255,.25)!important;font-weight:700}
.hero-copy button::after,.primary::after{content:"";position:absolute;left:-30%;top:-70%;width:40%;height:240%;transform:rotate(24deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.16),transparent);animation:buttonSweep 5.5s ease-in-out infinite}
.life-grid article{position:relative;overflow:hidden;background:linear-gradient(140deg,rgba(28,25,39,.74),rgba(11,11,18,.58))!important;border-color:rgba(255,255,255,.11)!important;box-shadow:inset 0 1px rgba(255,255,255,.05),0 14px 32px rgba(0,0,0,.16)}
.life-grid article::before{content:"";position:absolute;inset:auto -25% -55% 45%;height:120px;border-radius:50%;background:radial-gradient(circle,rgba(255,90,163,.14),transparent 70%)}
.life-grid article:hover{border-color:rgba(255,121,181,.25)!important;transform:translateY(-2px)}
.memory-strip{background:linear-gradient(100deg,rgba(120,51,103,.32),rgba(38,45,83,.25),rgba(19,18,29,.45))!important;box-shadow:inset 0 1px rgba(255,255,255,.06),0 14px 36px rgba(0,0,0,.2)}

/* Companion home */
.game-shell{box-shadow:var(--ailife-shadow);background:#080910!important}
.hero-photo{inset:0 0 118px!important;background-position:center 8%!important;filter:saturate(.96) contrast(1.035) brightness(.93)!important;transform:scale(1.01);animation:heroBreath 12s ease-in-out infinite alternate}
.hero-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,7,12,.08) 0,transparent 22%,transparent 47%,rgba(5,6,11,.18) 63%,rgba(5,6,11,.93) 91%,#070810 100%),linear-gradient(90deg,rgba(6,6,12,.34),transparent 30%,transparent 68%,rgba(5,6,12,.22))}
.top-profile{padding:10px 12px 10px 10px;border:1px solid rgba(255,255,255,.09);border-radius:20px;background:linear-gradient(135deg,rgba(12,12,19,.52),rgba(28,19,33,.24));backdrop-filter:blur(13px) saturate(140%);box-shadow:0 14px 40px rgba(0,0,0,.2)}
.avatar{border-color:rgba(255,177,205,.72)!important;box-shadow:0 0 0 3px rgba(255,255,255,.04),0 0 28px rgba(255,95,161,.19)!important}
.avatar i{font-size:10px;min-width:23px;text-align:center;box-shadow:0 4px 14px rgba(0,0,0,.3)}
.top-profile h1{letter-spacing:.01em;text-shadow:0 2px 15px rgba(0,0,0,.6)}
.name-row button{padding:4px 8px!important;background:rgba(10,10,17,.34)!important;backdrop-filter:blur(8px)}
.xp{box-shadow:inset 0 1px 3px rgba(0,0,0,.8)}
.xp span{box-shadow:0 0 14px rgba(255,77,154,.6)}
.game-shell blockquote{padding:13px 15px 13px 17px!important;border:1px solid rgba(255,255,255,.09)!important;border-left:2px solid #f08eae!important;border-radius:0 16px 16px 0;background:linear-gradient(90deg,rgba(12,11,18,.52),rgba(12,11,18,.14));backdrop-filter:blur(7px);box-shadow:0 13px 34px rgba(0,0,0,.18)}
.side-menu{gap:11px!important}
.side-menu button>span:first-child{width:38px;height:38px;display:grid;place-items:center;border-radius:50%;font-size:18px!important;color:#ffe4c4!important;background:linear-gradient(145deg,rgba(30,25,38,.72),rgba(9,9,14,.45));border:1px solid rgba(255,227,191,.18);backdrop-filter:blur(11px);box-shadow:0 7px 20px rgba(0,0,0,.25),inset 0 1px rgba(255,255,255,.07)}
.side-menu button:hover>span:first-child{border-color:rgba(255,204,163,.46);box-shadow:0 0 22px rgba(229,169,111,.15)}
.task-panel{background:linear-gradient(145deg,rgba(19,16,26,.82),rgba(11,10,17,.65))!important;border-color:rgba(255,255,255,.13)!important;border-radius:18px!important;backdrop-filter:blur(22px) saturate(145%)!important;box-shadow:0 24px 60px rgba(0,0,0,.34),inset 0 1px rgba(255,255,255,.055)}
.task-panel header{background:linear-gradient(90deg,rgba(255,82,157,.07),transparent)}
.task{transition:background .2s ease}.task:hover{background:rgba(255,255,255,.025)}
.task button{border-radius:999px!important;padding:5px 10px!important;box-shadow:inset 0 1px rgba(255,255,255,.15),0 5px 15px rgba(0,0,0,.2)}
.limited{background:linear-gradient(110deg,rgba(104,31,66,.84),rgba(54,23,56,.78),rgba(15,14,22,.75))!important;border-color:rgba(255,118,174,.23)!important;border-radius:17px!important;box-shadow:0 18px 42px rgba(0,0,0,.28),inset 0 1px rgba(255,255,255,.07);backdrop-filter:blur(16px)}
.heartbeat{border-color:rgba(255,154,200,.68)!important;background:radial-gradient(circle at 38% 32%,#ff94c3 0,#ed4b9a 18%,#9c245d 48%,rgba(115,22,69,.16) 72%)!important;box-shadow:0 0 22px rgba(255,73,153,.56),0 0 65px rgba(255,73,153,.2),inset 0 2px 7px rgba(255,255,255,.24)!important;animation:heartPulse 2.7s ease-in-out infinite}
.heartbeat::before,.heartbeat::after{content:"";position:absolute;inset:-9px;border-radius:50%;border:1px solid rgba(255,104,171,.2);animation:heartRing 2.7s ease-out infinite}.heartbeat::after{animation-delay:1.35s}
.module-grid{perspective:900px}
.module-grid button{border-color:rgba(255,255,255,.13)!important;border-radius:18px!important;background:linear-gradient(155deg,rgba(59,27,82,.74),rgba(17,13,28,.88))!important;box-shadow:0 17px 40px rgba(0,0,0,.27),inset 0 1px rgba(255,255,255,.06);backdrop-filter:blur(14px)}
.module-grid button::after{content:"";position:absolute;inset:0;background:linear-gradient(140deg,rgba(255,255,255,.05),transparent 31%,transparent 65%,rgba(255,85,161,.05));pointer-events:none}
.module-grid button:nth-child(2){background:linear-gradient(155deg,rgba(112,34,72,.76),rgba(30,14,29,.9))!important}.module-grid button:nth-child(3){background:linear-gradient(155deg,rgba(105,74,39,.74),rgba(32,24,17,.9))!important}.module-grid button:nth-child(4),.module-grid button:nth-child(5){background:linear-gradient(155deg,rgba(30,52,108,.72),rgba(14,17,42,.92))!important}
.module-grid button:hover{transform:translateY(-4px) rotateX(1.5deg);border-color:rgba(255,255,255,.24)!important}
.module-grid button>span:first-child{text-shadow:0 0 25px currentColor}

/* Bottom game navigation */
.bottom-nav{height:84px!important;background:linear-gradient(180deg,rgba(10,10,16,.72),rgba(7,8,13,.96))!important;border-color:rgba(255,255,255,.08)!important;box-shadow:0 -16px 48px rgba(0,0,0,.3);backdrop-filter:blur(28px) saturate(150%)!important}
.bottom-nav button{position:relative;font-size:11px!important}
.bottom-nav button>span:first-child{font-size:20px;transition:transform .2s ease,text-shadow .2s ease}
.bottom-nav .active{color:#ffb6d2!important}
.bottom-nav .active::before{content:"";position:absolute;top:0;width:38px;height:2px;border-radius:999px;background:linear-gradient(90deg,transparent,#ff72ae,transparent);box-shadow:0 0 16px #ff4f9a}
.bottom-nav .active>span:first-child{transform:translateY(-1px);text-shadow:0 0 16px rgba(255,104,170,.55)}

/* Chat */
.chat-screen{background-position:center 8%!important}
.chat-screen::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,transparent 18%,rgba(7,7,12,.16) 42%,rgba(7,7,12,.88) 72%,#070810 100%)}
.chat-screen header,.date-screen header,.growth header{backdrop-filter:blur(8px);border-bottom:1px solid rgba(255,255,255,.035)}
.chat-list{padding-top:30px!important}
.bubble{position:relative;border-color:rgba(255,255,255,.1)!important;box-shadow:0 12px 28px rgba(0,0,0,.2),inset 0 1px rgba(255,255,255,.04);backdrop-filter:blur(16px) saturate(130%)!important}
.bubble.them{background:linear-gradient(145deg,rgba(28,27,35,.84),rgba(14,13,20,.72))!important;border-radius:19px 19px 19px 5px!important}
.bubble.me{background:linear-gradient(135deg,rgba(170,55,111,.86),rgba(86,41,111,.86))!important;border-color:rgba(255,139,193,.2)!important;border-radius:19px 19px 5px 19px!important}
.quick-actions{padding:7px;border-radius:19px;background:rgba(10,10,16,.45);backdrop-filter:blur(18px);border:1px solid rgba(255,255,255,.06)}
.quick-actions button{border-color:rgba(255,255,255,.1)!important;background:linear-gradient(155deg,rgba(38,26,42,.82),rgba(15,13,20,.78))!important;box-shadow:inset 0 1px rgba(255,255,255,.045)}
.quick-actions button:hover{border-color:rgba(255,119,181,.25)!important;background:linear-gradient(155deg,rgba(72,34,61,.85),rgba(20,14,25,.82))!important}
.composer{height:64px!important;background:linear-gradient(145deg,rgba(21,18,27,.92),rgba(11,10,17,.9))!important;backdrop-filter:blur(22px);border-color:rgba(255,255,255,.1)!important;box-shadow:0 16px 45px rgba(0,0,0,.38),inset 0 1px rgba(255,255,255,.055)}
.composer input::placeholder{color:#766f7d}.composer button{font-weight:700;background:linear-gradient(135deg,#dd4a8b,#773466)!important;box-shadow:0 8px 24px rgba(212,61,132,.22),inset 0 1px rgba(255,255,255,.18)}

/* Growth */
.growth{background:radial-gradient(circle at 20% 18%,rgba(128,55,113,.18),transparent 36%),linear-gradient(180deg,#0a0b13,#070810)!important}
.growth-person{position:relative;overflow:hidden;border-color:rgba(255,255,255,.14)!important;box-shadow:0 25px 65px rgba(0,0,0,.35)}
.growth-person::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(8,9,15,.92) 100%);pointer-events:none}.growth-person>div{position:relative;z-index:2}
.growth-tree{padding:20px 8px 20px 0}
.growth-tree::before{width:3px!important;box-shadow:0 0 18px rgba(224,85,161,.2)}
.node>span{position:relative;border-color:rgba(255,255,255,.12)!important;background:linear-gradient(145deg,#26222f,#17151e)!important;box-shadow:0 9px 24px rgba(0,0,0,.25)}
.node.current>span{background:radial-gradient(circle at 35% 30%,#ff83bc,#c13278 44%,#6d2b63 100%)!important;border-color:rgba(255,153,202,.44)!important;box-shadow:0 0 20px rgba(231,64,139,.5),0 0 55px rgba(231,64,139,.18)!important;animation:nodeGlow 2.6s ease-in-out infinite}
.node.done>span{color:#ffd7e7;border-color:rgba(255,136,189,.28)!important}
.stats{background:linear-gradient(145deg,rgba(22,18,29,.78),rgba(12,11,18,.7))!important;backdrop-filter:blur(20px);box-shadow:0 20px 48px rgba(0,0,0,.26),inset 0 1px rgba(255,255,255,.05)}
.stats i{height:7px!important}.stats em{background:linear-gradient(90deg,#e04d91,#bc5fc5,#7e72f6)!important;box-shadow:0 0 14px rgba(215,76,154,.32)}

/* Date */
.date-screen{background-position:center 8%!important}
.date-screen::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,transparent 24%,rgba(7,8,13,.1) 40%,rgba(7,8,13,.92) 74%,#070810 100%)}
.atmos{background:linear-gradient(145deg,rgba(40,21,40,.76),rgba(14,12,20,.65))!important;border-color:rgba(255,137,193,.18)!important;backdrop-filter:blur(18px);box-shadow:0 16px 42px rgba(0,0,0,.24)}
.atmos em{background:linear-gradient(90deg,#ff6bad,#df63c1,#8c72ff)!important;box-shadow:0 0 16px rgba(255,82,158,.38)}
.date-dialog{backdrop-filter:blur(16px);background:linear-gradient(135deg,rgba(128,51,111,.72),rgba(46,29,68,.76))!important;box-shadow:0 16px 38px rgba(0,0,0,.26),inset 0 1px rgba(255,255,255,.05)}
.choices button{background:linear-gradient(145deg,rgba(28,21,33,.88),rgba(13,12,19,.84))!important;border-color:rgba(255,125,184,.19)!important;box-shadow:0 11px 26px rgba(0,0,0,.19),inset 0 1px rgba(255,255,255,.04)}
.choices button:hover,.choices button.chosen{border-color:rgba(255,118,178,.55)!important;background:linear-gradient(145deg,rgba(72,31,62,.9),rgba(27,18,36,.9))!important;box-shadow:0 0 0 1px rgba(255,111,174,.18),0 0 30px rgba(255,77,153,.14)!important}
.date-rewards>div{background:linear-gradient(145deg,rgba(19,17,25,.82),rgba(11,10,16,.74))!important;backdrop-filter:blur(15px);box-shadow:inset 0 1px rgba(255,255,255,.04)}

/* Desktop presentation: phone-like stage */
@media (min-width:900px){
  body{padding:20px 0}
  .game-shell,.chat-screen,.growth,.date-screen{min-height:calc(100dvh - 40px)!important;height:calc(100dvh - 40px)!important;max-width:520px!important;border:1px solid rgba(255,255,255,.08);border-radius:28px;box-shadow:0 34px 120px rgba(0,0,0,.58);overflow:hidden}
  .life-shell{min-height:calc(100dvh - 40px)!important;border:1px solid rgba(255,255,255,.06);border-radius:28px;box-shadow:0 34px 120px rgba(0,0,0,.48)}
}

/* Mobile refinement */
@media (max-width:700px){
  .life-shell{padding-top:max(17px,env(safe-area-inset-top))!important}
  .life-head b{font-size:20px!important}.life-head small{font-size:10px}
  .hero-copy h1{font-size:40px!important}.hero-copy p{font-size:13px}
  .life-avatar-card{min-height:455px!important;background-position:center 4%!important}
  .game-shell{min-height:100dvh!important;height:100dvh!important}
  .hero-photo{inset-bottom:108px!important;background-position:center 5%!important}
  .top-profile{top:max(14px,env(safe-area-inset-top))!important;left:12px!important;padding:7px 8px!important;border-radius:16px!important;max-width:64%}
  .avatar{width:54px!important;height:54px!important;flex:0 0 auto}
  .top-profile h1{font-size:19px!important}.top-profile b,.top-profile label{font-size:9px!important}.xp{width:112px!important;margin:6px 0 7px!important}.xp em{font-size:8px!important;left:calc(100% + 5px)!important}
  .game-shell>.resource-bar{top:max(15px,env(safe-area-inset-top))!important;right:8px!important;max-width:34%}.game-shell>.resource-bar span{font-size:8px!important;padding:4px 6px!important}
  .game-shell blockquote{top:102px!important;left:14px!important;max-width:205px!important;font-size:13px!important;padding:10px 11px 10px 13px!important}
  .side-menu{top:100px!important;right:7px!important;gap:8px!important}.side-menu button{font-size:9px!important}.side-menu button>span:first-child{width:33px;height:33px;font-size:15px!important}
  .task-panel{left:12px!important;bottom:326px!important;width:min(244px,64vw)!important}.task-panel header{padding:10px 11px!important}.task{grid-template-columns:25px 1fr auto!important;padding:7px 10px!important}.task b,.task small{font-size:9px!important}.task button{font-size:8px!important;padding:4px 8px!important}
  .limited{left:12px!important;bottom:248px!important;width:min(244px,64vw)!important;height:68px!important;grid-template-columns:62px 1fr 18px!important}
  .heartbeat{right:12px!important;bottom:254px!important;width:72px!important;height:72px!important;font-size:22px!important}.heartbeat span{font-size:8px!important}
  .module-grid{left:10px!important;right:10px!important;bottom:86px!important;height:150px!important;gap:5px!important}.module-grid button{padding:8px 6px!important;border-radius:14px!important}.module-grid button>span:first-child{font-size:42px!important}.module-grid b{font-size:11px!important}.module-grid small{font-size:7px!important}
  .bottom-nav{height:82px!important}
  .chat-list{padding-left:14px!important;padding-right:14px!important}.bubble{max-width:80%!important;font-size:13px!important}
  .quick-actions{left:10px!important;right:10px!important;bottom:88px!important}.quick-actions button{height:62px!important;font-size:16px!important}.quick-actions button>span{font-size:9px!important}
  .composer{left:10px!important;right:10px!important;bottom:max(12px,env(safe-area-inset-bottom))!important;height:58px!important}.composer input{font-size:13px}.composer button{padding:0 14px!important;font-size:12px}
  .growth-layout{padding:0 12px!important;gap:10px!important;grid-template-columns:.92fr 1.08fr!important}.growth-person{height:455px!important;padding:14px!important}.growth-person h2{font-size:26px!important}.node>span{width:48px!important;height:48px!important;font-size:22px!important}.growth-tree::before{left:24px!important}.node{gap:8px!important}.node b{font-size:12px}.node small{font-size:8px!important}
  .stats{margin:12px!important;padding:14px!important}.stats>div{grid-template-columns:42px 1fr 70px!important;font-size:11px}.growth>.wide{margin:0 12px!important;width:calc(100% - 24px)!important}
  .date-dialog{margin-top:112px!important;max-width:68%!important;font-size:13px}.choices{margin:0 12px!important}.choices button{padding:12px!important;font-size:12px}.date-rewards{margin:12px!important}.date-screen>.wide{margin:0 12px!important;width:calc(100% - 24px)!important}
}

@media (max-width:390px){
  .game-shell blockquote{max-width:180px!important}
  .task-panel,.limited{width:226px!important}
  .module-grid button{padding:7px 5px!important}.module-grid b{font-size:10px!important}
  .growth-layout{grid-template-columns:.88fr 1.12fr!important}
}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;scroll-behavior:auto!important;transition:none!important}}

@keyframes resourceShine{0%,72%,100%{transform:translateX(-140%)}82%{transform:translateX(230%)}}
@keyframes heroBreath{0%{transform:scale(1.01)}100%{transform:scale(1.035)}}
@keyframes heartPulse{0%,100%{transform:scale(1);filter:brightness(1)}50%{transform:scale(1.045);filter:brightness(1.08)}}
@keyframes heartRing{0%{transform:scale(.82);opacity:.7}100%{transform:scale(1.45);opacity:0}}
@keyframes nodeGlow{0%,100%{filter:brightness(1)}50%{filter:brightness(1.18)}}
@keyframes buttonSweep{0%,75%,100%{left:-45%}86%{left:135%}}