/* IMOHELPER Mobile Premium UI v11.7
   Final presentation layer: phone-first hierarchy, touch targets and calm emerald glass. */
:root{
  --imo-p-bg:#03130b;
  --imo-p-surface:rgba(12,39,24,.94);
  --imo-p-surface-2:rgba(18,54,32,.88);
  --imo-p-line:rgba(191,237,200,.16);
  --imo-p-line-strong:rgba(126,255,77,.38);
  --imo-p-accent:#78ff36;
  --imo-p-text:#f6fff4;
  --imo-p-muted:#b8cbbd;
  --imo-p-shadow:0 18px 52px rgba(0,0,0,.34);
}

.phone{
  border-radius:26px!important;
  border-color:rgba(134,255,83,.34)!important;
  box-shadow:0 32px 100px rgba(0,0,0,.48),0 0 0 1px rgba(255,255,255,.035) inset!important;
}
.phone::after{
  content:"";position:absolute;z-index:0;inset:0;pointer-events:none;border-radius:inherit;
  background:linear-gradient(135deg,rgba(255,255,255,.045),transparent 24%,transparent 76%,rgba(120,255,54,.025));
}
.topbar{
  height:76px!important;padding:10px 14px!important;
  background:linear-gradient(180deg,rgba(2,24,12,.96),rgba(2,24,12,.78),transparent)!important;
  backdrop-filter:blur(18px) saturate(1.18)!important;
}
.top-title strong{font-size:15px!important;letter-spacing:-.02em!important}
.top-title span{color:rgba(221,239,225,.68)!important}

.feed{
  padding:3px 3px 10px!important;
  scroll-padding:16px 0 24px!important;
}
.bubble{
  padding:11px 13px!important;font-size:12.5px!important;line-height:1.5!important;
  border-radius:18px 18px 18px 7px!important;
}
.bubble.user{border-radius:18px 18px 7px 18px!important}

/* Result cards: one quiet surface, a visible title, then real actions. */
.feed .imo-r8-card,.feed .imo-r6-card,.feed .card{
  position:relative!important;overflow:hidden!important;
  margin:5px 0 6px!important;padding:10px 11px!important;border-radius:14px!important;
  border:1px solid var(--imo-p-line)!important;
  background:linear-gradient(145deg,rgba(25,64,40,.93),rgba(5,25,15,.97))!important;
  box-shadow:0 12px 30px rgba(0,0,0,.2),inset 0 1px 0 rgba(255,255,255,.055)!important;
}
.feed .imo-r8-card::before,.feed .imo-r6-card::before{
  content:""!important;position:absolute!important;left:14px!important;right:14px!important;
  top:0!important;bottom:auto!important;width:auto!important;height:1px!important;border-radius:0!important;
  background:linear-gradient(90deg,transparent,rgba(143,255,95,.75),transparent)!important;opacity:.58!important;
}
.feed .imo-r8-card h3,.feed .imo-r6-card h3,.feed .card h3{
  margin:0 0 3px!important;color:var(--imo-p-text)!important;font-size:13px!important;
  line-height:1.32!important;font-weight:900!important;letter-spacing:-.025em!important;
}
.feed .imo-r8-card p,.feed .imo-r6-card p,.feed .card p,
.feed .imo-r6-card__meta{
  margin:2px 0!important;color:var(--imo-p-muted)!important;font-size:10.8px!important;
  line-height:1.34!important;font-weight:600!important;word-break:keep-all!important;
  display:-webkit-box!important;-webkit-box-orient:vertical!important;-webkit-line-clamp:2!important;overflow:hidden!important;
}
.feed .imo-r6-card__actions,.feed .card-actions{
  display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:5px!important;margin-top:7px!important;
}
.feed .imo-r6-card__actions button,.feed .card-actions button{
  min-width:0!important;min-height:31px!important;height:auto!important;padding:5px 8px!important;
  border:1px solid rgba(192,235,201,.2)!important;border-radius:9px!important;
  background:rgba(255,255,255,.055)!important;color:#effff0!important;
  font-size:10.5px!important;line-height:1.15!important;font-weight:850!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04)!important;
}
.feed .imo-r6-card__actions button:first-child,.feed .card-actions button:first-child{
  border-color:rgba(120,255,54,.44)!important;background:rgba(120,255,54,.14)!important;color:#e6ffd9!important;
}
.feed .imo-r6-card__actions button:active,.feed .card-actions button:active{
  transform:scale(.975)!important;background:rgba(120,255,54,.24)!important;
}

/* Welcome card: concise, unmistakably actionable. */
.imo-life-home-v114{
  max-width:none!important;width:calc(100% - 6px)!important;margin:3px auto 7px!important;
  padding:11px 12px!important;border-radius:15px!important;
  border-color:rgba(154,255,108,.3)!important;
  background:linear-gradient(145deg,rgba(22,64,37,.96),rgba(5,28,16,.98))!important;
  box-shadow:0 18px 44px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.06)!important;
}
.imo-life-home-kicker{margin-bottom:8px!important;font-size:10px!important;color:#96ff68!important}
.imo-life-home-v114 h2{margin:0 0 3px!important;font-size:15px!important;line-height:1.25!important}
.imo-life-home-v114 p{font-size:11px!important;line-height:1.35!important;color:#c8dbcc!important}
.imo-life-home-v114>div{gap:8px!important;margin-top:14px!important}
.imo-life-home-v114 button{
  min-height:48px!important;padding:9px 11px!important;border-radius:13px!important;
  border-color:rgba(194,235,203,.18)!important;background:rgba(255,255,255,.055)!important;
}
.imo-life-home-v114 button:first-child{background:linear-gradient(135deg,#83ff44,#61db2c)!important}

/* Composer and navigation are one anchored action dock. */
.composer{
  height:58px!important;left:10px!important;right:10px!important;bottom:78px!important;
  grid-template-columns:44px 1fr 52px!important;gap:6px!important;padding:6px!important;
  border-color:rgba(184,233,194,.2)!important;background:rgba(1,13,7,.92)!important;
  box-shadow:0 16px 40px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.055)!important;
}
.composer:focus-within{border-color:rgba(120,255,54,.62)!important;box-shadow:0 0 0 3px rgba(120,255,54,.1),0 18px 42px rgba(0,0,0,.42)!important}
.composer .plus{width:42px!important;height:42px!important;background:rgba(120,255,54,.07)!important}
.composer .send{height:44px!important;min-width:48px!important;background:linear-gradient(145deg,#b2de9f,#78b85e)!important;box-shadow:0 6px 18px rgba(76,145,48,.2)!important}
.composer .input{font-size:14px!important;font-weight:650!important}

#bottomNav.imo-life-nav-v112{
  left:8px!important;right:8px!important;bottom:6px!important;height:58px!important;
  gap:6px!important;padding:5px 6px!important;border:1px solid rgba(184,233,194,.16)!important;
  border-radius:19px!important;background:rgba(2,17,9,.95)!important;
  box-shadow:0 16px 38px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.045)!important;
}
#bottomNav.imo-life-nav-v112>button{
  flex:0 0 56px!important;height:47px!important;gap:0!important;padding:2px!important;
  border:0!important;border-radius:14px!important;background:transparent!important;
}
#bottomNav.imo-life-nav-v112>button span{
  width:25px!important;height:25px!important;border-radius:8px!important;
  background:rgba(255,255,255,.045)!important;color:#9de181!important;
}
#bottomNav.imo-life-nav-v112>button b{max-width:52px!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;font-size:9px!important;line-height:11px!important;color:#d8e7da!important}
#bottomNav.imo-life-nav-v112>button.active{
  transform:translateY(-2px)!important;background:linear-gradient(180deg,rgba(120,255,54,.17),rgba(120,255,54,.05))!important;
  box-shadow:0 8px 18px rgba(0,0,0,.25),inset 0 0 0 1px rgba(120,255,54,.36)!important;
}
#bottomNav.imo-life-nav-v112>button.active span{background:#78ff36!important;color:#08210f!important}
/* Remove decorative pseudo-icons left by older themes. One semantic SVG owns each action. */
#bottomNav.imo-life-nav-v112>button::before,
#bottomNav.imo-life-nav-v112>button span::before,
#bottomNav.imo-life-nav-v112>button span::after,
#bottomNav.imo-life-nav-v112>button b::before,
#bottomNav.imo-life-nav-v112>button b::after{content:none!important;display:none!important}
#bottomNav.imo-life-nav-v112>button span>.imo-life-icon{display:block!important;width:18px!important;height:18px!important;margin:auto!important}

/* Modal: premium sheet on phones, compact dialog on wide screens. */
.imo-life-backdrop{background:rgba(0,7,4,.74)!important;backdrop-filter:blur(10px) saturate(.85)!important}
.imo-life-panel{
  border-color:rgba(120,255,54,.4)!important;background:linear-gradient(165deg,#0c321d,#03150c 72%)!important;
  box-shadow:0 -28px 80px rgba(0,0,0,.58),inset 0 1px 0 rgba(255,255,255,.06)!important;
}
.imo-life-panel header{height:58px!important;padding:0 9px!important;background:rgba(0,0,0,.08)!important}
.imo-life-panel header h2{font-size:17px!important;letter-spacing:-.025em!important}
.imo-life-body{padding:16px 16px 24px!important}
#imoLifeRouteForm>label{display:block!important;margin-bottom:7px!important;font-size:13px!important;font-weight:850!important}
#imoLifeRouteForm>input{
  height:54px!important;margin:0!important;padding:0 14px!important;border-radius:14px!important;
  border-color:rgba(220,244,226,.3)!important;background:rgba(0,12,6,.8)!important;font-size:15px!important;
}
.imo-life-mode{gap:8px!important;margin:17px 0 14px!important}
.imo-life-mode span{min-height:48px!important;border-radius:13px!important;font-size:12.5px!important;font-weight:800!important}
.imo-life-primary{min-height:54px!important;border-radius:14px!important;font-size:15px!important;background:linear-gradient(135deg,#82ff42,#5fe725)!important}
.imo-life-task-grid{gap:9px!important}
.imo-life-task-grid button{min-height:82px!important;padding:12px!important;border-radius:16px!important}
.imo-life-task-grid b{font-size:13px!important}
.imo-life-form-error{min-height:17px!important;margin:5px 2px 0!important;color:#ffb3a7!important;font-size:11px!important;font-weight:750!important}
#imoLifeDestination[aria-invalid="true"]{border-color:#ff796a!important;box-shadow:0 0 0 3px rgba(255,91,70,.12)!important}

@media (max-width:520px){
  #app{display:block!important;background:#001007!important}
  .phone{width:100vw!important;height:100dvh!important;max-height:none!important;border:0!important;border-radius:0!important;box-shadow:none!important}
  .topbar{height:72px!important;padding-top:calc(8px + env(safe-area-inset-top))!important}
  .feed{left:9px!important;right:56px!important;top:126px!important;bottom:148px!important;padding-right:1px!important;scrollbar-width:none!important}
  .feed::-webkit-scrollbar{display:none!important}
  .feed .imo-r8-card,.feed .imo-r6-card,.feed .card{padding:9px 10px!important;border-radius:13px!important}
  .feed .imo-r6-card__actions button,.feed .card-actions button{min-height:30px!important}
  .imo-life-home-v114{width:100%!important;padding:10px 11px!important;border-radius:14px!important}
  .composer{bottom:calc(76px + env(safe-area-inset-bottom))!important}
  #bottomNav.imo-life-nav-v112{bottom:calc(6px + env(safe-area-inset-bottom))!important}
  .imo-life-panel{width:100%!important;max-height:86dvh!important;border-width:1px 0 0!important;border-radius:27px 27px 0 0!important}
  .imo-life-sheet-v112{align-items:flex-end!important}
}
@media (max-width:360px){
  .topbar{gap:4px!important;padding-left:7px!important;padding-right:7px!important}
  .topbar .icon-round,.topbar .sound-btn,.topbar .camera-btn{flex:0 0 36px!important;width:36px!important;height:36px!important;min-width:36px!important}
  .topbar .brand-avatar,.topbar img{max-width:42px!important;max-height:42px!important}
  .top-title{min-width:0!important;max-width:112px!important}
  .top-title strong{font-size:13px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  .top-title span{font-size:9px!important;white-space:nowrap!important}
  .points,.credit-pill{min-width:54px!important;padding-left:8px!important;padding-right:8px!important;font-size:12px!important}
  .feed{left:7px!important;right:52px!important}
  .feed .imo-r6-card__actions,.feed .card-actions{grid-template-columns:1fr!important}
  #bottomNav.imo-life-nav-v112{height:55px!important;gap:3px!important;padding-left:4px!important;padding-right:4px!important}
  #bottomNav.imo-life-nav-v112>button{flex-basis:55px!important;height:44px!important}
  #bottomNav.imo-life-nav-v112>button span{width:23px!important;height:23px!important}
  #bottomNav.imo-life-nav-v112>button b{max-width:50px!important;font-size:8.5px!important;line-height:10px!important}
  .imo-life-home-v114>div{grid-template-columns:1fr!important}
  .imo-life-home-v114 button.danger{grid-column:auto!important}
  .imo-life-panel header{height:52px!important}
  .imo-life-body{padding:12px 14px calc(18px + env(safe-area-inset-bottom))!important}
  .imo-life-task-grid{gap:7px!important}
  .imo-life-task-grid button{min-height:72px!important;padding:10px!important}
  #imoLifeRouteForm>input{height:49px!important}
  .imo-life-mode{gap:6px!important;margin:12px 0!important}
  .imo-life-mode span{min-height:44px!important}
  .imo-life-primary{min-height:50px!important}
}
@media (prefers-reduced-motion:reduce){
  #bottomNav.imo-life-nav-v112>button,.feed button{transition:none!important;animation:none!important}
}