/* KAVYR 2.1 — clean Telegram-style mobile shell. One authoritative mobile layout. */
:root{
  --tg-bg:#000000;
  --tg-panel:#1c1c1e;
  --tg-panel-2:#242426;
  --tg-bar:#111113;
  --tg-line:rgba(255,255,255,.10);
  --tg-text:#f5f5f7;
  --tg-muted:#8e8e93;
  --tg-accent:#8b7cff;
  --tg-accent-soft:rgba(139,124,255,.16);
  --tg-danger:#ff5d68;
  --tg-green:#54c880;
  --tg-header:44px;
  --tg-tab:49px;
  --tg-safe-top:env(safe-area-inset-top,0px);
  --tg-safe-bottom:env(safe-area-inset-bottom,0px);
  --kavyr-viewport-h:100%;
}
html.is-ios.is-standalone{--tg-safe-bottom:max(env(safe-area-inset-bottom,0px),34px)}
[data-theme="light"]{
  --tg-bg:#f2f2f7;--tg-panel:#fff;--tg-panel-2:#f2f2f7;--tg-bar:#f8f8fa;
  --tg-line:rgba(60,60,67,.18);--tg-text:#111113;--tg-muted:#8e8e93;
}
html,body,#app{margin:0!important;width:100%!important;height:100%!important;min-height:100%!important;background:var(--tg-bar)!important;overscroll-behavior:none}
html{background:var(--tg-bar)!important}
body{position:fixed!important;inset:0!important;overflow:hidden!important;background:var(--tg-bar)!important}
#app{position:fixed!important;inset:0!important;overflow:hidden!important;background:var(--tg-bar)!important}
.boot{position:fixed!important;inset:0!important;display:grid!important;place-items:center!important;background:var(--tg-bg)!important}
.boot-core{display:grid;place-items:center;gap:12px;transform:none!important;margin:0!important}
.boot-mark{width:72px!important;height:72px!important;border-radius:22px!important;background:var(--tg-panel)!important;border:1px solid var(--tg-line)!important}
.boot-word{font-size:18px;font-weight:700;letter-spacing:.05em}.boot-line{position:static!important;margin-top:6px!important}

@media(max-width:820px){
  /* Root shell fills the actual installed-web-app viewport. Body background matches the tab bar so iOS cannot expose a black gutter. */
  .app-shell{position:fixed!important;inset:0!important;width:100%!important;height:auto!important;min-height:0!important;display:block!important;padding:0!important;overflow:hidden!important;background:var(--tg-bg)!important;color:var(--tg-text)!important}
  body::after{content:"";position:fixed;left:0;right:0;bottom:0;height:calc(var(--tg-tab) + var(--tg-safe-bottom) + 2px);background:var(--tg-bar);z-index:2;pointer-events:none}

  .sidebar,.mobile-page{
    position:absolute!important;left:0!important;right:0!important;top:0!important;
    bottom:calc(var(--tg-tab) + var(--tg-safe-bottom))!important;
    width:auto!important;height:auto!important;min-height:0!important;margin:0!important;border:0!important;
    background:var(--tg-bg)!important;color:var(--tg-text)!important;overflow:hidden!important;z-index:8!important;
  }
  .mobile-page{display:none!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch!important;padding:0!important}
  .mobile-page.active{display:block!important}
  .sidebar.mobile-hidden{display:none!important}

  .side-top,.page-top{
    position:sticky!important;top:0!important;z-index:20!important;
    height:calc(var(--tg-header) + var(--tg-safe-top))!important;min-height:calc(var(--tg-header) + var(--tg-safe-top))!important;
    padding:var(--tg-safe-top) 10px 0!important;display:grid!important;grid-template-columns:64px 1fr 64px!important;align-items:center!important;
    background:color-mix(in srgb,var(--tg-bar) 95%,transparent)!important;border-bottom:1px solid var(--tg-line)!important;
    backdrop-filter:blur(24px) saturate(1.35)!important;-webkit-backdrop-filter:blur(24px) saturate(1.35)!important;
  }
  .side-top h2,.page-top h2{grid-column:2!important;margin:0!important;text-align:center!important;font-size:17px!important;line-height:22px!important;font-weight:650!important;letter-spacing:-.2px!important;color:var(--tg-text)!important}
  .top-side-space{width:48px}.top-text-btn{border:0!important;background:transparent!important;color:var(--tg-accent)!important;font-size:16px!important;padding:0 4px!important;text-align:left!important}
  .settings-edit-btn{text-align:right!important;justify-self:end!important}
  .page-action-icon,.top-compose-btn{justify-self:end!important;width:40px!important;height:40px!important;border:0!important;background:transparent!important;color:var(--tg-accent)!important;display:grid!important;place-items:center!important;font-size:27px!important;padding:0!important}
  .page-action-icon svg,.top-compose-btn svg{width:23px!important;height:23px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.8!important;stroke-linecap:round!important;stroke-linejoin:round!important}

  .search-wrap,.page-search{padding:7px 8px 7px!important;background:var(--tg-bg)!important}
  .search-box:before{content:"⌕"!important;left:12px!important;top:6px!important;color:var(--tg-muted)!important;font-size:20px!important}
  .search-input{height:36px!important;border:0!important;border-radius:10px!important;background:var(--tg-panel)!important;color:var(--tg-text)!important;padding:0 12px 0 34px!important;font-size:16px!important;box-shadow:none!important}
  .search-input::placeholder{color:var(--tg-muted)!important}

  /* Telegram-style chats: flat rows, no cards. */
  .list-title{display:none!important}.chat-list{padding:0!important;overflow-y:auto!important;background:var(--tg-bg)!important}
  .chat-item{position:relative!important;display:grid!important;grid-template-columns:60px minmax(0,1fr) 48px!important;gap:10px!important;align-items:center!important;min-height:72px!important;margin:0!important;padding:8px 10px!important;border:0!important;border-radius:0!important;background:transparent!important}
  .chat-item::after{content:"";position:absolute;left:80px;right:0;bottom:0;height:1px;background:var(--tg-line);transform:scaleY(.5);transform-origin:bottom}
  .chat-item:active,.chat-item.active{background:var(--tg-panel)!important}
  .chat-item .avatar{width:54px!important;height:54px!important;border:0!important;background:#393940!important;color:white!important;font-size:17px!important}
  .chat-name{font-size:16px!important;font-weight:600!important;color:var(--tg-text)!important}.chat-preview{font-size:14px!important;line-height:18px!important;margin-top:3px!important;color:var(--tg-muted)!important}
  .chat-meta{font-size:12px!important;color:var(--tg-muted)!important;padding-top:2px!important}.badge{background:var(--tg-accent)!important}
  .new-chat-fab{display:none!important}

  /* Contacts */
  .circle-page-body,.goals-page-body{padding:0 0 20px!important;background:var(--tg-bg)!important}
  .circle-list{background:var(--tg-panel)!important;border-top:1px solid var(--tg-line)!important;border-bottom:1px solid var(--tg-line)!important}
  .tg-section-title{padding:18px 16px 7px!important;color:var(--tg-muted)!important;font-size:13px!important}
  .circle-person{position:relative!important;width:100%!important;min-height:64px!important;display:grid!important;grid-template-columns:50px minmax(0,1fr) auto!important;gap:10px!important;align-items:center!important;padding:7px 12px!important;border:0!important;background:transparent!important;color:var(--tg-text)!important;text-align:left!important}
  .circle-person::after{content:"";position:absolute;left:72px;right:0;bottom:0;height:1px;background:var(--tg-line);transform:scaleY(.5)}
  .circle-person:last-child::after{display:none}.circle-person .avatar{width:46px!important;height:46px!important;border:0!important}
  .circle-person-main{border:0!important;background:transparent!important;text-align:left!important;display:grid!important;gap:2px!important;min-width:0!important;color:inherit!important;padding:0!important}
  .circle-person-main strong{font-size:16px!important;font-weight:500!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}.circle-person-main small{font-size:13px!important;color:var(--tg-muted)!important}.circle-person-main em,.mini-goal,.vouch-mini{display:none!important}
  .circle-add{border:0!important;background:transparent!important;color:var(--tg-accent)!important;font-size:14px!important;font-weight:600!important;padding:8px!important}.circle-add.added{color:var(--tg-muted)!important}.tg-chevron{color:var(--tg-muted);font-size:24px}
  .tg-empty{min-height:52vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:30px;color:var(--tg-muted);gap:8px}.tg-empty.compact{min-height:180px}.tg-empty strong{font-size:18px;color:var(--tg-text);font-weight:600}.tg-empty span{max-width:290px;font-size:14px;line-height:1.4}.tg-link-btn{margin-top:8px;border:0;background:transparent;color:var(--tg-accent);font-size:16px}

  /* Goals: one calm list, no dashboard/status noise. */
  .goal-overview,.goal-empty,.section-label{display:none!important}.goal-list{padding:18px 0 0!important;display:block!important;background:transparent!important}
  .goal-card{position:relative!important;width:100%!important;display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:4px 12px!important;align-items:center!important;padding:12px 16px!important;border:0!important;border-radius:0!important;background:var(--tg-panel)!important;color:var(--tg-text)!important;text-align:left!important;min-height:72px!important}
  .goal-card::after{content:"";position:absolute;left:16px;right:0;bottom:0;height:1px;background:var(--tg-line);transform:scaleY(.5)}.goal-card:last-child::after{display:none}
  .goal-row-main{display:grid;gap:4px;min-width:0}.goal-row-main strong{font-size:16px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.goal-row-main span{font-size:13px;color:var(--tg-muted)}
  .goal-row-meta{display:grid;justify-items:end;gap:3px}.goal-row-meta b{color:var(--tg-accent);font-size:15px}.goal-row-meta small{color:var(--tg-muted);font-size:11px}.goal-progress{grid-column:1/3;height:3px!important;border-radius:3px!important;background:rgba(255,255,255,.09)!important;overflow:hidden!important;margin:5px 0 0!important}.goal-progress i{display:block;height:100%;background:var(--tg-accent)!important;border-radius:3px!important}
  .goal-form{display:grid;gap:12px;margin-top:12px}.goal-form label{display:grid;gap:6px;color:var(--tg-muted);font-size:13px}.goal-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}

  /* Settings / own profile, modeled after Telegram settings hierarchy. */
  .tg-settings-scroll{padding:0 0 24px!important}.tg-profile-hero{width:100%;border:0;background:var(--tg-panel);color:var(--tg-text);padding:18px 16px 16px;display:flex;flex-direction:column;align-items:center;text-align:center;border-bottom:1px solid var(--tg-line)}
  .tg-settings-avatar{width:86px;height:86px;border-radius:50%;display:grid;place-items:center;overflow:hidden;background:#35353d;color:white;font-size:27px;font-weight:700;margin-bottom:10px}.tg-settings-avatar img{width:100%;height:100%;object-fit:cover}.tg-profile-hero strong{font-size:21px;font-weight:600}.tg-profile-hero>span{font-size:14px;color:var(--tg-muted);margin-top:2px}.tg-profile-hero small{max-width:320px;font-size:13px;color:var(--tg-muted);margin-top:8px;line-height:1.35}
  .tg-group{margin-top:18px;background:var(--tg-panel);border-top:1px solid var(--tg-line);border-bottom:1px solid var(--tg-line)}
  .tg-info-row{padding:12px 16px;display:grid;gap:4px}.tg-info-row span{font-size:12px;color:var(--tg-muted)}.tg-info-row strong{font-size:15px;font-weight:500}.tg-info-row small{font-size:12px;color:var(--tg-muted)}
  .tg-theme-row{padding:12px 16px;display:grid;gap:9px}.tg-theme-row>span{font-size:15px}.theme-segment{height:36px;display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:2px!important;padding:2px!important;border:0!important;border-radius:9px!important;background:var(--tg-panel-2)!important}.theme-segment button{border:0!important;border-radius:7px!important;background:transparent!important;color:var(--tg-muted)!important;font-size:13px!important}.theme-segment button.active{background:var(--tg-accent)!important;color:#fff!important;box-shadow:none!important}
  .settings-content{padding:0!important}.settings-group{display:contents!important}.settings-card{border:0!important;border-radius:0!important}
  .settings-row{position:relative!important;width:100%!important;min-height:54px!important;padding:8px 16px!important;border:0!important;border-radius:0!important;background:var(--tg-panel)!important;color:var(--tg-text)!important;display:grid!important;grid-template-columns:minmax(0,1fr) 24px!important;gap:8px!important;align-items:center!important;text-align:left!important}.settings-row::after{content:"";position:absolute;left:16px;right:0;bottom:0;height:1px;background:var(--tg-line);transform:scaleY(.5)}.settings-row:last-child::after{display:none}.settings-copy{display:grid!important;gap:2px!important}.settings-copy strong{font-size:16px!important;font-weight:450!important}.settings-copy span{font-size:12px!important;color:var(--tg-muted)!important}.settings-chevron{font-size:22px!important;color:var(--tg-muted)!important}.settings-symbol{display:none!important}.danger-row .settings-copy strong{color:var(--tg-danger)!important}.settings-version{text-align:center;color:var(--tg-muted);font-size:11px;padding:22px 0}

  /* Tab bar. The root/body share the same color, so the Home Indicator area can never expose a separate black strip. */
  .bottom-nav{position:fixed!important;left:0!important;right:0!important;bottom:0!important;z-index:60!important;height:calc(var(--tg-tab) + var(--tg-safe-bottom))!important;min-height:calc(var(--tg-tab) + var(--tg-safe-bottom))!important;padding:0 4px var(--tg-safe-bottom)!important;display:grid!important;grid-template-columns:repeat(4,1fr)!important;background:color-mix(in srgb,var(--tg-bar) 95%,transparent)!important;border-top:1px solid var(--tg-line)!important;backdrop-filter:blur(28px) saturate(1.3)!important;-webkit-backdrop-filter:blur(28px) saturate(1.3)!important;box-sizing:border-box!important;transform:translateZ(0)!important}
  .bottom-tab{position:relative!important;height:var(--tg-tab)!important;border:0!important;background:transparent!important;color:#7f7f86!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:0!important;padding:1px 0 2px!important;font-size:10px!important;font-weight:500!important;line-height:12px!important}.bottom-tab.active{color:var(--tg-accent)!important}.bottom-icon{width:28px!important;height:27px!important;display:grid!important;place-items:center!important}.bottom-icon svg{width:24px!important;height:24px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.7!important;stroke-linecap:round!important;stroke-linejoin:round!important}.nav-badge{position:absolute!important;top:2px!important;left:calc(50% + 8px)!important;min-width:16px!important;height:16px!important;line-height:16px!important;border-radius:9px!important;background:#ff3b5c!important;color:#fff!important;border:2px solid var(--tg-bar)!important;font-size:9px!important;text-align:center!important;padding:0 4px!important}
  .app-shell.chat-open .bottom-nav{opacity:0!important;pointer-events:none!important;transform:translateY(110%)!important}

  /* Chat screen */
  .main{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;z-index:90!important;transform:translateX(102%)!important;transition:transform .18s ease!important;background:var(--wallpaper)!important}.app-shell.chat-open .main{transform:translateX(0)!important}
  .chat-header{height:calc(var(--tg-header) + var(--tg-safe-top))!important;min-height:calc(var(--tg-header) + var(--tg-safe-top))!important;padding:var(--tg-safe-top) 6px 0!important;background:color-mix(in srgb,var(--tg-bar) 95%,transparent)!important;border-bottom:1px solid var(--tg-line)!important;backdrop-filter:blur(24px)!important;-webkit-backdrop-filter:blur(24px)!important}.mobile-back{display:grid!important;color:var(--tg-accent)!important}.header-person .avatar{width:36px!important;height:36px!important;border:0!important}.header-name{font-size:16px!important;font-weight:600!important}.header-status{font-size:11px!important;color:var(--tg-muted)!important}.chat-actions .icon-btn{color:var(--tg-accent)!important}
  .messages{padding:8px 7px 9px!important}.bubble{max-width:82%!important;border:0!important;background:#232326!important;border-radius:17px 17px 17px 5px!important;box-shadow:none!important}.message-row.mine .bubble{background:#5e54b8!important;border-radius:17px 17px 5px 17px!important;color:#fff!important}.bubble p{font-size:16px!important;line-height:20px!important}.message-meta{font-size:10px!important}
  .composer-zone{padding:5px 6px calc(5px + var(--tg-safe-bottom))!important;background:linear-gradient(180deg,transparent,rgba(0,0,0,.18))!important}.composer{min-height:42px!important;grid-template-columns:38px minmax(0,1fr) 38px 38px!important;gap:0!important;border:0!important;border-radius:21px!important;background:#202023!important;padding:2px!important}.composer textarea{border:0!important;background:transparent!important;color:#fff!important;padding:10px 5px!important;box-shadow:none!important;font-size:16px!important;line-height:20px!important}.composer .icon-btn{width:38px!important;height:38px!important;color:#a0a0a8!important}.send-btn{width:38px!important;height:38px!important;border-radius:50%!important;background:var(--tg-accent)!important;color:white!important}.send-btn svg{width:19px;height:19px}.attach-menu,.sticker-panel{bottom:calc(56px + var(--tg-safe-bottom))!important;background:var(--tg-panel)!important;border:1px solid var(--tg-line)!important;border-radius:14px!important}

  /* Profile drawer / editors */
  .drawer{position:absolute!important;inset:0 0 0 auto!important;width:100%!important;max-width:430px!important;height:100%!important;background:var(--tg-bg)!important;z-index:110!important;padding-bottom:var(--tg-safe-bottom)!important;overflow-y:auto!important}.drawer-scrim{z-index:105!important}.drawer-cover{height:180px!important}.profile-avatar{border-color:var(--tg-bg)!important}.profile-body{background:var(--tg-bg)!important}.profile-section{background:var(--tg-panel)!important;border-color:var(--tg-line)!important}.profile-field input,.profile-field textarea,.field-input{border:0!important;background:var(--tg-panel-2)!important;color:var(--tg-text)!important;border-radius:10px!important;box-shadow:none!important}.upload-tile{background:var(--tg-panel-2)!important;border:0!important}.tg-peer-profile{position:relative;padding:calc(var(--tg-safe-top) + 20px) 20px 18px;text-align:center;background:var(--tg-panel);border-bottom:1px solid var(--tg-line)}.tg-peer-profile .drawer-close{position:absolute;left:8px;top:calc(var(--tg-safe-top) + 4px);color:var(--tg-accent)}.social-drawer-avatar{width:96px!important;height:96px!important;margin:0 auto 10px!important;border-radius:50%!important;overflow:hidden!important;background:#36363d!important;display:grid!important;place-items:center!important;font-size:28px!important;font-weight:700!important}.social-drawer-avatar img{width:100%;height:100%;object-fit:cover}.tg-peer-profile h2{margin:0;font-size:22px}.tg-peer-profile>span{display:block;color:var(--tg-muted);font-size:14px;margin-top:2px}.tg-peer-profile p{margin:10px auto 0;max-width:330px;color:var(--tg-muted);font-size:14px;line-height:1.4}.tg-peer-actions{display:grid;grid-template-columns:1.3fr 1fr;gap:8px;padding:12px 12px 0}.peer-info{margin:14px 0 0!important}.primary,.secondary,.danger-btn{border-radius:10px!important;min-height:44px!important}.primary{background:var(--tg-accent)!important}.secondary{background:var(--tg-panel)!important;border:1px solid var(--tg-line)!important}.modal{background:var(--tg-panel)!important;border:1px solid var(--tg-line)!important;border-radius:15px!important}.modal-backdrop{padding:12px 12px calc(12px + var(--tg-safe-bottom))!important}

  .loading-overlay{position:absolute!important;inset:0!important;display:grid!important;place-items:center!important;background:rgba(0,0,0,.18)!important}.spinner{margin:0!important}
  .toast-stack{bottom:calc(var(--tg-tab) + var(--tg-safe-bottom) + 10px)!important}.pwa-nudge{bottom:calc(var(--tg-tab) + var(--tg-safe-bottom) + 10px)!important}
}
@media(max-width:820px){
  .crop-details{margin-top:12px;border-top:1px solid var(--tg-line);padding-top:10px}.crop-details summary{color:var(--tg-accent);font-size:14px;cursor:pointer;list-style:none}.crop-details summary::-webkit-details-marker{display:none}.crop-details .sliders{margin-top:12px}.single-save{display:block!important;padding-bottom:calc(14px + var(--tg-safe-bottom))!important}.single-save .primary{width:100%!important}
}