@charset "UTF-8";

:root{
  --ws-z-sticky:100;
  --ws-z-dropdown:200;
  --ws-z-modal-backdrop:12000;
  --ws-z-modal:12010;
  --ws-z-toast:14000;
  --ws-safe-top:env(safe-area-inset-top,0px);
  --ws-safe-bottom:env(safe-area-inset-bottom,0px);
  --ws-readable-muted:#6f6253;
}
html,body,#app,#root{
  min-height:100%;
  background-color:var(--paper,#f5eee2)!important;
}
body{
  min-height:100dvh;
  color:var(--ink,#2a2520)!important;
}
#wsStatusScrim{
  display:block!important;
  position:fixed!important;
  top:0!important;
  left:0!important;
  right:0!important;
  height:0!important;
  pointer-events:none!important;
  z-index:2147483647!important;
  background:transparent!important;
  opacity:0!important;
}
html[data-theme="dark"] #wsStatusScrim,
html[data-theme^="supreme"] #wsStatusScrim,
html[data-theme="pixel"] #wsStatusScrim{
  background:var(--paper,#111)!important;
}
/* V6.6.1(用户反馈:桌面版PWA顶部UI奇怪):刘海遮罩的 48px 下限只该给触屏/iOS,桌面 PWA 有原生标题栏、safe-area 为 0,原来会盖住 logo 与右上角按钮 */
@media (display-mode:standalone) and (max-width:768px){
  body{background-attachment:scroll!important;}
  #wsStatusScrim{height:max(env(safe-area-inset-top,0px),48px)!important;}
}
@media (max-width:768px){
  #wsStatusScrim{
    height:max(env(safe-area-inset-top,0px),44px)!important;
    background:linear-gradient(to bottom,rgba(0,0,0,.08),rgba(0,0,0,.015) 72%,transparent),var(--paper,#f5eee2)!important;
    opacity:1!important;
  }
}
body.ws-ios-standalone #wsStatusScrim{
  height:max(env(safe-area-inset-top,0px),48px)!important;
  background:linear-gradient(to bottom,rgba(0,0,0,.08),rgba(0,0,0,.015) 72%,transparent),var(--paper,#f5eee2)!important;
  opacity:1!important;
}
/* V6.7.21：48px 下限只给手机宽度；iPad / 横屏 iPhone 安装版走桌面布局(≥769px)时只留真实安全区高度，否则盖住 logo 上半和右上角整排按钮 */
@media (min-width:769px){
  body.ws-ios-standalone #wsStatusScrim{height:env(safe-area-inset-top,0px)!important;}
}
body :is(.contact-modal,.auth-modal,.ws-reg-modal,.ws-onb,.ws-onb-done-modal,.ws-qr-modal,.wait-modal,.wm-ask-mask,.ws-wxbind-mask,.mobile-ach-modal,.ws-rq-mask,.web-share-modal,.completion-share-modal,#view-plan .plan-full-modal,#achievementModal,#policyModal,#installModal,#pwaRetentionModal,.share-dialog-mask,.invite-modal,.danger-modal){
  z-index:var(--ws-z-modal-backdrop)!important;
  align-items:center!important;
  justify-content:center!important;
  box-sizing:border-box!important;
  overscroll-behavior:contain!important;
}
body :is(.contact-dialog,.auth-dialog,.ws-reg-card,.ws-onb-card,.ws-onb-done-card,.ws-qr-card,.wait-card,.wm-ask-card,.ws-wxbind-card,.mobile-ach-modal-panel,.ws-rq-panel,.web-share-dialog,.completion-share-dialog,#view-plan .plan-full-card,#achievementModal .modal-card,#policyModal .modal-card,#installModal .modal-card,#pwaRetentionModal .modal-card,.share-dialog,.invite-card,.danger-card){
  z-index:var(--ws-z-modal)!important;
  max-height:calc(100dvh - 40px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px))!important;
  overflow:auto!important;
  -webkit-overflow-scrolling:touch!important;
  box-sizing:border-box!important;
}
body :is(.toast,.ws-toast,#toast){
  z-index:var(--ws-z-toast)!important;
}
body :is(.intro-text,.streak-text,.ach-text,.notice-text,.site-desc,.plan-onb-sub,.og-desc,.os-desc,.install-step,.invite-note,.policy-body,.memory-next,.online-def-body,.sync-desc,.profile-cta,.share-landing-body,.share-landing-sub,.share-landing-note,.reward-sheet-sub,.reward-sub,.web-share-desc,.completion-share-desc,.pwa-copy,.reminder-copy,.muted,.subtle){
  color:var(--ink-soft,var(--ws-readable-muted))!important;
  opacity:1!important;
}
body :is(input,textarea)::placeholder{
  color:color-mix(in srgb,var(--ink-soft,#6f6253) 82%,transparent)!important;
  opacity:1!important;
}
@media (max-width:768px){
  html,body{width:100%;max-width:100%;overflow-x:hidden!important;}
  body :is(.contact-modal,.auth-modal,.ws-reg-modal,.ws-onb,.ws-onb-done-modal,.ws-qr-modal,.wait-modal,.wm-ask-mask,.ws-wxbind-mask,.mobile-ach-modal,.ws-rq-mask,.web-share-modal,.completion-share-modal,#view-plan .plan-full-modal,#achievementModal,#policyModal,#installModal,#pwaRetentionModal,.share-dialog-mask,.invite-modal,.danger-modal){
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    min-height:100dvh!important;
    padding:calc(16px + env(safe-area-inset-top,0px)) 12px calc(16px + env(safe-area-inset-bottom,0px))!important;
    overflow:auto!important;
  }
  body :is(.contact-dialog,.auth-dialog,.ws-reg-card,.ws-onb-card,.ws-onb-done-card,.ws-qr-card,.wait-card,.wm-ask-card,.ws-wxbind-card,.mobile-ach-modal-panel,.ws-rq-panel,.web-share-dialog,.completion-share-dialog,#view-plan .plan-full-card,#achievementModal .modal-card,#policyModal .modal-card,#installModal .modal-card,#pwaRetentionModal .modal-card,.share-dialog,.invite-card,.danger-card){
    width:min(100%,calc(100vw - 24px))!important;
    max-width:calc(100vw - 24px)!important;
    max-height:calc(100dvh - 32px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px))!important;
    margin:auto!important;
    transform:none!important;
  }
  body :is(button,.btn,.primary,.secondary,.ghost,.pill-btn,.action-btn,.share-action,.ws-rq-btn,.completion-share-btn){
    min-height:44px;
  }
  body :is(.bottom-nav,.mobile-tabbar,.bottom-action-bar){
    padding-bottom:calc(10px + env(safe-area-inset-bottom,0px))!important;
  }
  body :is(.modal-close,.close-btn,.sheet-close,.ws-rq-close,.share-close){
    min-width:40px!important;
    min-height:40px!important;
  }
}
@media (min-width:769px){
  body :is(.contact-dialog,.auth-dialog,.ws-reg-card,.ws-onb-card,.ws-onb-done-card,.ws-qr-card,.wait-card,.wm-ask-card,.ws-wxbind-card,.mobile-ach-modal-panel,.ws-rq-panel,.web-share-dialog,.completion-share-dialog,#view-plan .plan-full-card,#achievementModal .modal-card,#policyModal .modal-card,#installModal .modal-card,#pwaRetentionModal .modal-card,.share-dialog,.invite-card,.danger-card){
    max-width:min(92vw,720px)!important;
  }
  body :is(.leaderboard-modal,.shop-modal,.rank-dialog,.store-dialog){
    max-width:min(92vw,900px)!important;
  }
}