*{margin:0;padding:0;box-sizing:border-box;font-family:system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;}
  body{background:#f7f9fc;padding-bottom:16px;}

  /* 主菜单页背景：仅在主菜单显示时生效（专业科技感 - 浅蓝到浅紫渐变） */
  .main-page{position:relative;}
  .main-page::before{
    content:'';
    position:fixed;top:0;left:0;right:0;bottom:0;
    z-index:-1;
    background:linear-gradient(160deg, #e8f4fc 0%, #eef2ff 45%, #f3efff 100%);
  }
  /* 护眼柔和感：浅薄荷绿/浅灰 — 取消上面 gradient，改用下面两行
  .main-page::before{ background:#e8f0e8; }
  */
  /* 高级质感：带细微纹理的浅灰 — 改用下面
  .main-page::before{ background:#e8e8ec; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E"); }
  */

  /* 登录页 - 按截图规范 */
  #login-page{background:#165DFF!important;}
  #login-page .login-card{
    background:#ffffff;
    padding:36px 32px;
    border-radius:20px;
    width:90%;
    max-width:400px;
    box-shadow:0 8px 30px rgba(0,0,0,0.12);
    display:flex;
    flex-direction:column;
    align-items:center;
    transform:scale(0.8);
    transform-origin:center center;
  }
  #login-page .login-title{
    text-align:center;
    font-size:24px;
    font-weight:bold;
    color:#333333;
    cursor:pointer;
    margin-bottom:8px;
  }
  #login-page .login-title-underline{
    display:block;
    width:60px;
    height:4px;
    background:#FF6B35;
    margin:0 auto 24px;
    border-radius:2px;
  }
  #login-page #login-pwd{
    width:100%;
    padding:16px 20px;
    border:1px solid #e0e0e0;
    border-radius:24px;
    font-size:16px;
    margin-bottom:20px;
    box-sizing:border-box;
    color:#333;
  }
  #login-page #login-pwd::placeholder{color:#999999;}
  #login-page #loginBtn{
    width:100%;
    padding:16px;
    background:#FF6B35;
    color:#ffffff;
    border:none;
    border-radius:28px;
    font-size:18px;
    font-weight:bold;
    cursor:pointer;
    box-shadow:0 4px 14px rgba(255,107,53,0.4);
  }
  #login-page #loginBtn:hover{filter:brightness(1.05);}
  #login-page .login-footer{
    text-align:center;
    margin-top:20px;
    color:#999999;
    font-size:14px;
  }
  #login-page #noPwdHint{color:#0456a8;}
  /* 上次为免密时尽早隐藏登录层，减少首屏闪一下登录页（由 body 首脚本加 html 类名） */
  html.km-skip-login-gate #login-page { display: none !important; }
  html.km-skip-login-gate #main-page.page {
    display: block !important;
    visibility: visible !important;
  }
  .container{max-width:750px;margin:0 auto;padding:12px 16px;min-height:100vh;}
  /* 页面基础样式 - 移动端优化版 */
  .page{
    display:none;
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    padding:0 16px;
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    touch-action:pan-y;
    background:transparent;
    transform:translateX(0) translateZ(0);
    opacity:1;
    z-index:1;
    will-change:transform,opacity;
    box-sizing:border-box;
    /* GPU加速 */
    -webkit-transform:translateZ(0);
    -webkit-backface-visibility:hidden;
    -webkit-perspective:1000;
    backface-visibility:hidden;
    perspective:1000;
    /* 强制硬件合成层 */
    contain:layout style;
  }
  .page.active{
    display:block;
    transform:translateX(0) translateZ(0);
    opacity:1;
    z-index:10;
    background:#f7f9fc;
  }
  /* 页面进入动画 - 使用transform和opacity，避免重排 */
  .page.entering{
    animation:pageEnter 0.2s cubic-bezier(0.25,0.46,0.45,0.94) forwards;
    background:#f7f9fc;
    /* 移动端防止闪烁 */
    -webkit-transform:translateZ(0);
    transform:translateZ(0);
  }
  /* 页面退出动画 */
  .page.exiting{
    animation:pageExit 0.2s cubic-bezier(0.55,0.085,0.68,0.53) forwards;
    pointer-events:none;
    background:#f7f9fc;
    /* 防止退出时闪烁 */
    -webkit-transform:translateZ(0);
    transform:translateZ(0);
    /* 确保退出期间可见性，防止白屏 */
    z-index:100;
  }
  @keyframes pageEnter{
    from{
      transform:translate3d(100%,0,0);
      opacity:0;
    }
    to{
      transform:translate3d(0,0,0);
      opacity:1;
    }
  }
  @keyframes pageExit{
    from{
      transform:translate3d(0,0,0);
      opacity:1;
    }
    to{
      transform:translate3d(-30%,0,0);
      opacity:0;
    }
  }
  /* 主页面退出动画 */
  .page.main-exiting{
    animation:mainPageExit 0.2s cubic-bezier(0.55,0.085,0.68,0.53) forwards;
    pointer-events:none;
    background:#f7f9fc;
    -webkit-transform:translateZ(0);
    transform:translateZ(0);
    /* 确保退出期间可见性，防止白屏 */
    z-index:100;
  }
  @keyframes mainPageExit{
    from{
      transform:scale3d(1,1,1) translateZ(0);
      opacity:1;
    }
    to{
      transform:scale3d(0.95,0.95,1) translateZ(0);
      opacity:0;
    }
  }
  /* 确保动画期间背景色平滑过渡 */
  .page.exiting,
  .page.main-exiting,
  .page.entering {
    background:#f7f9fc !important;
    -webkit-transition:background-color 0.1s;
    transition:background-color 0.1s;
    /* 移动端防白屏：确保动画期间内容可见 */
    visibility: visible !important;
  }
  /* 修复移动端白色闪烁 - 强制透明背景直到激活 */
  .page:not(.active):not(.entering):not(.exiting):not(.main-exiting) {
    background:transparent !important;
    visibility: hidden;
  }
  /* 防止移动端渲染白屏 - 确保主页面始终有内容 */
  #main-page {
    min-height: 100vh;
    background: linear-gradient(160deg, #e8f4fc 0%, #eef2ff 45%, #f3efff 100%) !important;
  }
  /* 移动端GPU加速优化 */
  .page {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-perspective: 1000;
    perspective: 1000;
  }
  .header{text-align:center;padding:14px 0;font-size:18px;font-weight:bold;color:#222;cursor:pointer;} /* 标题可点 */

  /* 工具页微调 */
  #contact-page .header, #prescription-page .header, #tool4-page .header {padding:4px 0!important;}
  #contact-page .sync-toggle{margin:4px 0 6px!important;padding:6px 10px!important;}
  #contact-page .eye-row{margin-bottom:6px!important;gap:6px!important;}
  #contact-page .eye-card{padding:10px!important;}
  #contact-page .result-card{padding:12px!important;margin-top:6px!important;border:0.8px dashed rgba(0,0,0,0.4)!important;box-sizing:border-box;}

  #prescription-page .convert-card{padding:6px 10px!important;margin-top:4px!important;}
  #prescription-page .convert-btn{margin:4px auto!important;padding:8px!important;display:none;}
  #prescription-page .convert-result{padding:8px 12px!important;margin-top:6px!important;border:0.8px dashed rgba(0,0,0,0.4)!important;box-sizing:border-box!important;}

  #tool5-page .header{margin-bottom:6px!important;}

  /* 五个工具页面滚动支持（子页无底栏，仅留少量底部呼吸距） */
  #diam-page,
  #contact-page,
  #prescription-page,
  #tool4-page,
  #tool5-page {
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 32px;
    scrollbar-width: thin;
    scrollbar-color: rgba(4, 86, 168, 0.3) transparent;
  }

  /* 自定义滚动条样式 - Webkit浏览器 */
  #diam-page::-webkit-scrollbar,
  #contact-page::-webkit-scrollbar,
  #prescription-page::-webkit-scrollbar,
  #tool4-page::-webkit-scrollbar,
  #tool5-page::-webkit-scrollbar {
    width: 6px;
  }

  #diam-page::-webkit-scrollbar-track,
  #contact-page::-webkit-scrollbar-track,
  #prescription-page::-webkit-scrollbar-track,
  #tool4-page::-webkit-scrollbar-track,
  #tool5-page::-webkit-scrollbar-track {
    background: transparent;
  }

  #diam-page::-webkit-scrollbar-thumb,
  #contact-page::-webkit-scrollbar-thumb,
  #prescription-page::-webkit-scrollbar-thumb,
  #tool4-page::-webkit-scrollbar-thumb,
  #tool5-page::-webkit-scrollbar-thumb {
    background-color: rgba(4, 86, 168, 0.3);
    border-radius: 3px;
  }

  #diam-page::-webkit-scrollbar-thumb:hover,
  #contact-page::-webkit-scrollbar-thumb:hover,
  #prescription-page::-webkit-scrollbar-thumb:hover,
  #tool4-page::-webkit-scrollbar-thumb:hover,
  #tool5-page::-webkit-scrollbar-thumb:hover {
    background-color: rgba(4, 86, 168, 0.5);
  }

  /* 直径计算 */
  .diam-page .mode-tabs{display:flex;gap:8px;margin-bottom:12px;}
  .diam-page .mode-btn{flex:1;background:#fff;color:#666;border:none;border-radius:12px;padding:11px 12px;font-size:14px;cursor:pointer;}
  .diam-page .mode-btn.active{background:#0456a8;color:#fff;}
  .diam-page .row{display:flex;gap:8px;margin-bottom:10px;}
  .diam-page .input-group,
  .contact-page .input-group,
  .prescription-page .input-group{flex:1;background:#fff;border-radius:8px;padding:11px;border-left:2px solid #ff6b00;}
  .diam-page .input-label,
  .contact-page .input-label,
  .prescription-page .input-label{font-size:13px;color:#666;margin-bottom:6px;}
  
  .diam-page .result {
    background: #e6f7ff;
    border-radius: 12px;
    padding: 16px;
    text-align: center;
    margin-top: 16px;
    color: #0456a8;
    border: 0.8px dashed rgba(0,0,0,0.4);
    box-sizing: border-box;
  }
  .diam-page .result .result-title {
    color: #000;
  }

  /* 镜片直径 - 一图看懂参数测量 展开按钮 */
  .diam-page .param-expand-btn {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 12px 14px;
    margin-bottom: 12px;
    background: #f8f9fa;
    border: 1px dashed #d0d5dd;
    border-radius: 10px;
    cursor: pointer;
    font-size: 15px;
    color: #0d3f67;
    transition: background 0.2s;
  }
  .diam-page .param-expand-btn:hover { background: #f0f2f5; }
  .diam-page .param-expand-btn .param-icon {
    flex-shrink: 0;
    width: 24px;
    height: 24px;
  }
  .diam-page .param-expand-btn .param-text { flex: 1; text-align: left; }
  .diam-page .param-expand-btn .param-arrow {
    flex-shrink: 0;
    width: 12px;
    height: 12px;
    transition: transform 0.25s;
  }
  .diam-page .param-expand-btn.expanded .param-arrow { transform: rotate(180deg); }
  .diam-page .param-expand-content {
    overflow: hidden;
    transition: max-height 0.3s ease;
  }
  .diam-page .param-expand-content img {
    width: 100%;
    display: block;
    margin-bottom: 12px;
    border-radius: 8px;
  }

  /* 滚轮 (原有) */
  .wheel-mask{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.4);z-index:9998;display:none;}
  .wheel-panel{position:fixed;bottom:0;left:0;width:100%;background:#fff;z-index:9999;border-radius:16px 16px 0 0;padding-bottom:20px;display:none;}
  .wheel-header{display:flex;justify-content:space-between;padding:14px 16px;border-bottom:1px solid #eee;}
  .wheel-cancel,.wheel-ok{font-size:16px;color:#0456a8;cursor:pointer;}
  .wheel-title{font-size:16px;font-weight:500;}
  .wheel-box{display:flex;justify-content:center;padding:10px 0;height:200px;overflow:hidden;position:relative;}
  .wheel-list{width:100%;text-align:center;overflow:auto;scroll-snap-type:y mandatory;padding:80px 0;}
  .wheel-item{height:40px;line-height:40px;font-size:16px;color:#333;scroll-snap-align:center;}
  .wheel-line-top,.wheel-line-bottom{position:absolute;left:50%;transform:translateX(-50%);width:120px;height:1px;pointer-events:none;}
  .wheel-line-top{top:50%;transform:translate(-50%,-20px);background:linear-gradient(to right,rgba(4,86,168,0.2),#0456a8,rgba(4,86,168,0.2));}
  .wheel-line-bottom{top:50%;transform:translate(-50%,20px);background:linear-gradient(to right,rgba(4,86,168,0.2),#0456a8,rgba(4,86,168,0.2));}
  .wheel-trigger{width:100%;background:#fff;border:1px solid #eee;border-radius:6px;padding:9px;text-align:left;font-size:15px;cursor:pointer;}

  /* 隐形计算 - 按钮隐藏 */
  .contact-page .btn-calc {display: none;}

  .sync-toggle{background:#fff;border-radius:12px;padding:12px 14px;display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;}
  .switch-btn{width:46px;height:26px;background:#ccc;border-radius:13px;position:relative;cursor:pointer;}
  .switch-btn::after{content:'';position:absolute;width:22px;height:22px;background:#fff;border-radius:50%;top:2px;left:2px;transition:left 0.2s;}
  .switch-btn.active{background:#ff6b00;}
  .switch-btn.active::after{left:22px;}

  .eye-row{display:flex;gap:10px;margin-bottom:12px;}
  .eye-card{flex:1;background:#fff;border-radius:12px;padding:14px;border:none;cursor:pointer;}
  .eye-card.active{border:2px solid #ff6b00;}
  .eye-title{display:flex;align-items:center;gap:8px;margin-bottom:12px;font-size:13px;font-weight:bold;color:#222;}
  .eye-radio{width:18px;height:18px;border:2px solid #999;border-radius:50%;}
  .eye-card.active .eye-radio{border-color:#ff6b00;}
  .eye-card.active .eye-radio::after{content:'';width:8px;height:8px;background:#ff6b00;border-radius:50%;display:block;margin:3px auto;}
  .eye-label{font-size:13px;color:#666;margin:8px 0 4px;}

  /* 左眼输入框禁用状态样式 */
  .eye-card.disabled-inputs .wheel-trigger {
    background: #f5f5f5 !important;
    color: #999 !important;
    cursor: not-allowed;
    opacity: 0.7;
  }

  .result-card{background:#e6f7ff;border-radius:12px;padding:12px;margin-top:6px;}
  .result-title{font-weight:600;margin-bottom:14px;text-align:center;font-size:15px;}
  .result-grid{display:flex;justify-content:space-around;text-align:center;}
  .result-col{flex:1;}
  .result-eye{font-size:14px;color:#666;margin-bottom:6px;}
  .result-value-label{font-size:14px;color:#666;}
  .result-sph-od{font-size:22px;font-weight:700;color:#ff6b00;}
  .result-cyl-od{font-size:16px;font-weight:600;color:#ff6b00;margin-top:4px;}
  .result-sph-os{font-size:22px;font-weight:700;color:#007aff;}
  .result-cyl-os{font-size:16px;font-weight:600;color:#007aff;margin-top:4px;}

  /* 隐形计算结果球镜数值缩小2号 */
  .result-sph-od, .result-sph-os {
    font-size: 18px !important;  /* 原22px，缩小2个号 */
  }

  .convert-wrap{display:flex;flex-direction:column;gap:8px;}
  .convert-card{background:#fff;border-radius:12px;padding:12px;border-left:4px solid #ff6b00;margin-top:12px;}
  .convert-tip{font-size:14px;color:#666;margin-bottom:10px;}
  .convert-item{display:flex;justify-content:space-between;align-items:center;margin-bottom:9px!important;}
  .convert-item label{font-size:16px;color:#333;font-weight:500;}
  /* 处方转换输入框数值居中 */
  .convert-card .wheel-trigger{
    text-align:center!important;  /* 原right，改为居中 */
    font-size:16px!important;
    font-weight:700!important;
    background:#f5f7fa!important;
    border-radius:4px!important;
    width:110px!important;
    height:28px!important;
    line-height:28px!important;
    padding:0 6px!important;
    border:none!important;
  }
  .convert-result{background:#e6f7ff;border-radius:12px;padding:14px;border-left:4px solid #ff6b00;margin-top:12px;}
  .res-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;}
  .res-label{font-size:16px;color:#666;}
  .res-val-orange{font-size:16px;font-weight:700;color:#ff6b00;background:#f5f7fa;padding:4px 0;border-radius:4px;width:110px;text-align:center;}
  .res-val-blue{font-size:16px;font-weight:700;color:#0456a8;background:#f5f7fa;padding:4px 0;border-radius:4px;width:110px;text-align:center;}
  .res-val-orange#cv-res-a{color:#666!important;}

  /* 近视预测页面 */
  #tool4-page {
    padding-top: 0;
  }
  
  .predict-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin: 8px 0;
  }
  .predict-item {
    background: #f2f7fd;
    border-radius: 20px;
    padding: 12px 10px;
    border: 1px solid #dde7f0;
  }
  .predict-label {
    font-size: 11px;  /* 缩小2号 (原13px) */
    color: #4a5f73;
    margin-bottom: 6px;
    display: flex;
    align-items: center;
    gap: 4px;
  }
  .predict-value {
    display: flex;
    align-items: center;
    border-bottom: 2px dashed #b0c8da;
    padding: 2px 0;
  }
  .predict-value input {
    width: 100%;
    border: none;
    background: transparent;
    font-size: 18px;  /* 缩小2号 (原22px) */
    font-weight: 700;
    color: #0d3f67;
    outline: none;
  }
  .predict-value input[type="number"]::-webkit-inner-spin-button,
  .predict-value input[type="number"]::-webkit-outer-spin-button {
    opacity: 0.6;
    height: 24px;
    margin-left: 4px;
  }
  .predict-unit {
    font-size: 11px;  /* 缩小2号 (原13px) */
    color: #7b8fa2;
    text-align: right;
    margin-top: 2px;
  }

  .params-row {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin: 8px 0;
  }
  .param-card {
    background: #f2f7fd;
    border-radius: 20px;
    padding: 12px 10px;
    border: 1px solid #dde7f0;
  }
  .param-label {
    font-size: 11px;  /* 缩小2号 (原13px) */
    color: #4a5f73;
    margin-bottom: 6px;
    display: flex;
    align-items: center;
    gap: 4px;
  }
  .param-value {
    font-size: 18px;  /* 缩小2号 (原22px) */
    font-weight: 700;
    color: #0d3f67;
    border-bottom: 2px dashed #b0c8da;
    padding: 2px 0;
    margin-bottom: 2px;
  }
  .age-select {
    width: 100%;
    border: none;
    background: transparent;
    font-size: 18px;  /* 缩小2号 (原22px) */
    font-weight: 700;
    color: #0d3f67;
    outline: none;
    cursor: pointer;
  }
  .reserve-number {
    font-size: 18px;  /* 缩小2号 (原22px) */
    font-weight: 700;
    color: #0d3f67;
  }
  .param-unit {
    font-size: 11px;  /* 缩小2号 (原13px) */
    color: #7b8fa2;
    text-align: right;
    margin-top: 2px;
  }
  .risk-badge-card {
    font-size: 18px;  /* 缩小2号 (原22px) */
    font-weight: 700;
    padding: 2px 0;
    border-radius: 8px;
    text-align: left;
  }
  .risk-badge-card.risk {
    color: #b91c1c;
  }
  .risk-badge-card.safe {
    color: #166534;
  }

  .top-info-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #edf3fa;
    border-radius: 30px;
    padding: 10px 20px;
    margin: 12px 0 6px 0;
  }
  .current-degree-box {
    display: flex;
    align-items: center;
    gap: 8px;
  }
  .current-degree-label {
    font-size: 12px;  /* 缩小2号 (原14px) */
    color: #1f3a5f;
  }
  .current-degree-value {
    font-size: 18px;  /* 缩小3号 (原24px -> 21px? 但要求缩小3号，从24到18为缩小3号) */
    font-weight: 700;
    color: #0456a8;
  }
  .axlcr-box {
    display: flex;
    align-items: center;
    gap: 8px;
  }
  .axlcr-label {
    font-size: 12px;  /* 缩小2号 (原14px) */
    color: #1f3a5f;
  }
  .axlcr-value {
    font-size: 16px;  /* 缩小2号 (原20px) */
    font-weight: 700;
    color: #0d3f67;
  }

  .legend-row {
    display: flex;
    gap: 20px;
    margin-bottom: 8px;
    padding: 0 5px;
  }
  .legend-dot {
    display: inline-block;
    width: 18px;
    height: 18px;
    border-radius: 4px;
    margin-right: 6px;
    vertical-align: middle;
  }
  .legend-orange { background: #f97316; }
  .legend-green { background: #10b981; }

  .chart-box {
    background: #ffffff;
    border-radius: 28px;
    padding: 15px 15px 5px;
    margin: 15px 0 15px;
    border: 1px solid #dde7f0;  /* 保留外框 */
    box-shadow: 0 4px 12px rgba(0,0,0,0.02);
  }
  canvas {
    width: 100%;
    height: auto;
    background: #fdfeff;
    border-radius: 20px;
    display: block;
    /* 取消内框：移除 border */
    border: none;
    margin-top: 8px;
  }
  .axis-labels {
    display: flex;
    justify-content: space-between;
    padding: 0 20px;
    font-size: 13px;
    color: #5f748b;
    margin-top: 4px;
  }
  /* 曲线下方的虚线 */
  .dashed-line {
    width: 100%;
    height: 1px;
    border-bottom: 1px dashed #a0b8d0;
    margin: 8px 0 4px;
  }

  /* 主界面 3行2列网格：同比缩小，整体下移5mm */
  .main-page .header { margin-bottom: 20px; }
  .main-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: repeat(4, 1fr);
    gap: 22px;
    padding: 10px 6px;
    margin-top: 5mm;
    transform: scale(0.88);
    transform-origin: center top;
  }
  .main-menu-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 16px 10px;
    border: none;
    border-radius: 16px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.12);
    cursor: pointer;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    min-height: 88px;
  }
  .main-menu-btn:hover { transform: translateY(-2px); box-shadow: 0 6px 16px rgba(0,0,0,0.18); }
  .main-menu-btn:active { transform: translateY(0); box-shadow: 0 2px 8px rgba(0,0,0,0.15); }
  .main-menu-icon { display: flex; align-items: center; justify-content: center; }
  .main-menu-icon svg { display: block; width: 36px; height: 36px; }
  .main-menu-label { text-align: center; line-height: 1.3; }
  .main-btn-1 { background: linear-gradient(135deg, #2563eb, #1d4ed8); }
  .main-btn-2 { background: linear-gradient(135deg, #059669, #047857); }
  .main-btn-3 { background: linear-gradient(135deg, #ea580c, #c2410c); }
  .main-btn-4 { background: linear-gradient(135deg, #7c3aed, #6d28d9); }
  .main-btn-5 { background: linear-gradient(135deg, #dc2626, #b91c1c); }
  .main-btn-6 { background: linear-gradient(135deg, #0891b2, #0e7490); }
  .main-btn-7 { background: linear-gradient(135deg, #d97706, #b45309); }
  .main-btn-8 { background: linear-gradient(135deg, #c026d3, #a21caf); }

  .footer-nav{display:none !important;}
  .nav-item{text-align:center;font-size:12px;color:#999;cursor:pointer;}
  .nav-item.active{color:#0456a8;}
  .nav-item svg{width:22px;height:22px;margin-bottom:2px;display:block;margin:0 auto;}

  .copyright{position:fixed;right:16px;bottom:16px;text-align:right;font-size:12px;color:#999;padding:0;line-height:1.3;z-index:99;}

  /* 底部栏：主菜单保留版权 + 浏览量；子页面通过 body.sub-page-active 隐藏 */
  .bottom-bar {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 10px 0 16px;
    gap: 0;
    background: #f7f9fc;
    z-index: 9990;
    border-top: 1px solid rgba(0,0,0,0.06);
  }
  .bottom-bar .copyright {
    position: static;
    right: auto;
    bottom: auto;
    text-align: center;
  }
  .bottom-bar-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    max-width: 750px;
    padding: 0 16px;
  }
  .bottom-bar-row .copyright { text-align: center; }
  .view-count {
    font-size: 11px;
    color: #999;
    white-space: nowrap;
  }

/* 子页左右边缘透明热区：仅作结构标记，手势由 JS 全局监听，避免遮挡按钮点击 */
  .km-edge-back {
    position: fixed;
    top: 0;
    bottom: 0;
    z-index: 9900;
    touch-action: pan-y;
    -webkit-touch-callout: none;
    pointer-events: none;
    background: transparent;
  }
  .km-edge-back--left {
    left: 0;
  width: max(20px, calc(16px + env(safe-area-inset-left, 0px)));
  }
  .km-edge-back--right {
    right: 0;
  width: max(20px, calc(16px + env(safe-area-inset-right, 0px)));
  }
  body.sub-page-active .km-edge-back {
  pointer-events: none;
  }

  /* 返回主菜单：子页左上角小房子图标 */
  #back-to-main {
    position: fixed;
    left: max(10px, env(safe-area-inset-left, 0px));
    top: max(10px, env(safe-area-inset-top, 0px));
    z-index: 10050;
    width: 40px;
    height: 40px;
    min-width: 40px;
    max-width: 40px;
    padding: 0;
    margin: 0;
    display: none;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.92);
    color: #111;
    border: 1px solid rgba(0, 0, 0, 0.12);
    border-radius: 12px;
    transform: none;
    transform-origin: left top;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    cursor: pointer;
    transition: background 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease;
    line-height: 0;
    -webkit-tap-highlight-color: transparent;
  }
  #back-to-main svg {
    display: block;
    width: 22px;
    height: 22px;
  }
  #back-to-main path,
  #back-to-main polyline {
    stroke: currentColor;
  }
  #back-to-main:hover {
    filter: none;
    background: #fff;
    box-shadow: 0 3px 12px rgba(0, 0, 0, 0.1);
  }
  #back-to-main:active {
    filter: none;
    transform: scale(0.96);
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
  }
  body.sub-page-active #back-to-main {
    display: flex;
  }
  body.sub-page-active {
    padding-bottom: 16px;
  }
  body.sub-page-active .bottom-bar {
    display: none !important;
  }
  body:not(.sub-page-active) {
    padding-bottom: 72px;
  }
  body.sub-page-active .page.active:not(#main-page) {
    padding-top: 50px;
  }

  /* 色盲筛查演示（非临床诊断） */
  #colorblind-page .cb-wrap {
    max-width: 520px;
    margin: 0 auto;
    padding: 0 12px 28px;
    box-sizing: border-box;
  }
  #colorblind-page .cb-disclaimer {
    font-size: 12px;
    color: #5a6b78;
    line-height: 1.5;
    margin: 0 0 14px;
    padding: 10px 12px;
    background: #eef3f8;
    border-radius: 12px;
    border: 1px solid rgba(13, 71, 110, 0.12);
  }
  #colorblind-page .cb-progress {
    font-size: 14px;
    font-weight: 600;
    color: #0c1929;
    margin-bottom: 10px;
    text-align: center;
  }
  #colorblind-page .cb-plate {
    width: 100%;
    margin: 0 auto 16px;
    border-radius: 14px;
    overflow: hidden;
    border: 1px solid rgba(0, 0, 0, 0.08);
    box-shadow: 0 4px 16px rgba(13, 71, 110, 0.08);
  }
  #colorblind-page .cb-plate-mock {
    position: relative;
    width: 100%;
    display: block;
    padding: 0;
    box-sizing: border-box;
    background: #eceff1;
    min-height: 120px;
  }
  #colorblind-page .cb-plate-img {
    display: block;
    width: 100%;
    height: auto;
    max-width: 100%;
    object-fit: contain;
    object-position: center;
    opacity: 0;
    transition: opacity 0.15s ease;
  }
  #colorblind-page .cb-plate-mock.cb-img-ready .cb-plate-img {
    opacity: 1;
  }
  #colorblind-page .cb-q-hint {
    font-size: 12px;
    color: #5f748b;
    text-align: center;
    margin-bottom: 10px;
  }
  #colorblind-page .cb-options {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-bottom: 16px;
  }
  #colorblind-page .cb-opt {
    padding: 12px 10px;
    font-size: 15px;
    font-weight: 600;
    border: 2px solid #cfd8dc;
    border-radius: 12px;
    background: #fff;
    color: #0c1929;
    cursor: pointer;
    transition: border-color 0.15s, background 0.15s, transform 0.1s;
    font-family: inherit;
    -webkit-tap-highlight-color: transparent;
  }
  #colorblind-page .cb-opt:hover {
    border-color: #0b6bcb;
    background: #f3f8fd;
  }
  #colorblind-page .cb-opt:active {
    transform: scale(0.98);
  }
  #colorblind-page .cb-opt.cb-opt-selected {
    border-color: #0b6bcb;
    background: #e8f2fc;
    box-shadow: 0 0 0 1px rgba(11, 107, 203, 0.2);
  }
  #colorblind-page .cb-nav-row {
    display: flex;
    gap: 12px;
    justify-content: center;
    flex-wrap: wrap;
  }
  #colorblind-page .cb-nav {
    min-width: 120px;
    padding: 11px 18px;
    font-size: 14px;
    font-weight: 600;
    border-radius: 12px;
    border: none;
    cursor: pointer;
    font-family: inherit;
    -webkit-tap-highlight-color: transparent;
  }
  #colorblind-page .cb-nav-prev {
    background: #eceff1;
    color: #37474f;
  }
  #colorblind-page .cb-nav-next {
    background: linear-gradient(135deg, #d97706, #b45309);
    color: #fff;
    box-shadow: 0 2px 8px rgba(180, 83, 9, 0.35);
  }
  #colorblind-page .cb-nav:disabled {
    opacity: 0.45;
    cursor: not-allowed;
    box-shadow: none;
  }
  #colorblind-page .cb-result {
    text-align: center;
    padding: 20px 14px;
    background: #fff;
    border-radius: 16px;
    border: 1px solid rgba(13, 71, 110, 0.15);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
  }
  #colorblind-page .cb-result-score {
    font-size: 28px;
    font-weight: 700;
    color: #0b6bcb;
    margin: 8px 0 6px;
  }
  #colorblind-page .cb-result-detail {
    font-size: 15px;
    color: #37474f;
    margin-bottom: 14px;
  }
  #colorblind-page .cb-restart {
    padding: 12px 28px;
    font-size: 15px;
    font-weight: 600;
    border: none;
    border-radius: 12px;
    background: linear-gradient(135deg, #2563eb, #1d4ed8);
    color: #fff;
    cursor: pointer;
    font-family: inherit;
  }
  /* 后台管理样式 - 轻量弹窗 */
  .admin-modal{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.5);display:flex;justify-content:center;align-items:center;z-index:100000;}
  .admin-card{background:#fff;border-radius:28px;width:90%;max-width:400px;padding:24px;box-shadow:0 20px 40px rgba(0,0,0,0.2);}
  .admin-card h3{font-size:20px;margin-bottom:20px;color:#222;}
  .admin-card input{width:100%;padding:14px;border:1px solid #ddd;border-radius:12px;margin-bottom:16px;font-size:16px;}
  .admin-card button{width:100%;padding:14px;background:#0456a8;color:#fff;border:none;border-radius:12px;font-size:16px;margin-bottom:10px;cursor:pointer;}
  .admin-card .close-btn{background:#f0f0f0;color:#333;}
  .admin-row{display:flex;align-items:center;justify-content:space-between;margin:16px 0;}
  .toggle-desc{font-size:16px;}
  .admin-switch{width:46px;height:26px;background:#ccc;border-radius:13px;position:relative;cursor:pointer;display:inline-block;}
  .admin-switch::after{content:'';width:22px;height:22px;background:#fff;border-radius:50%;position:absolute;top:2px;left:2px;transition:0.2s;}
  .admin-switch.active{background:#ff6b00;}
  .admin-switch.active::after{left:22px;}
  .danger-btn{background:#b91c1c!important;}
  
  /* 后台设置面板 - 紧凑布局，无需滚动 */
  #adminPanel .admin-card {
    max-width: 420px;
    max-height: 90vh;
    padding: 12px 16px;
    overflow-y: auto;
  }
  #adminPanel .admin-card h3 { font-size: 16px; margin-bottom: 8px; }
  #adminPanel .admin-card > div[style*="margin"] { margin: 6px 0 !important; }
  #adminPanel #newAdminPwd, #adminPanel #newStaffPwd { padding: 8px 10px; font-size: 14px; margin-bottom: 0; }
  #adminPanel .admin-row { margin: 8px 0 !important; }
  #adminPanel .toggle-desc { font-size: 14px; }
  #adminPanel .param-group { margin: 8px 0 !important; padding: 8px 10px !important; border-radius: 10px; }
  #adminPanel .param-group h4 { font-size: 13px; margin-bottom: 6px; }
  #adminPanel .param-item { margin-bottom: 4px !important; }
  #adminPanel .param-item label { font-size: 12px; white-space: nowrap; }
  #adminPanel .param-item input { width: 68px; padding: 4px 6px; font-size: 13px; flex-shrink: 0; }
  #adminPanel .param-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2px 8px; }
  #adminPanel .param-grid .param-item { display: flex; align-items: center; justify-content: space-between; }
  #adminPanel button[onclick="saveAllSettings()"] { padding: 8px; font-size: 13px; margin-top: 4px; }
  #adminPanel button.close-btn { padding: 8px; margin-top: 8px; }
  
  /* 后台参数区域样式 */
  .param-group {
    margin: 16px 0;
    padding: 12px;
    background: #f5f7fa;
    border-radius: 16px;
  }
  .param-group h4 {
    font-size: 16px;
    margin-bottom: 12px;
    color: #0456a8;
  }
  .param-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
  }
  .param-item label {
    font-size: 14px;
    color: #333;
  }
  .param-item input {
    width: 80px;
    padding: 6px;
    border: 1px solid #ccc;
    border-radius: 6px;
    text-align: center;
    font-size: 14px;
  }

  /* 镜片 AI 推荐（紧凑布局：上下收缩约 25%） */
  #tool6-page {
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    max-height: 100%;
    padding-bottom: 32px;
  }
  #tool6-page .header {
    margin-bottom: 6px;
  }
  #tool6-page .ai-form-wrap {
    display: flex;
    flex-direction: column;
    gap: 7px;
  }
  #tool6-page .ai-card {
    background: #fff;
    border-radius: 10px;
    padding: 8px 10px;
    border-left: 4px solid #ff6b00;
  }
  #tool6-page .ai-card.no-left-accent {
    border-left: none;
  }
  #tool6-page .ai-card-title {
    font-size: 11px;
    font-weight: 600;
    color: #222;
    margin-bottom: 6px;
  }
  #tool6-page .ai-eye-line-row {
    align-items: center;
    flex-wrap: nowrap;
    margin-bottom: 0;
  }
  #tool6-page .ai-eye-line-row .ai-card-title {
    margin: 0;
    white-space: nowrap;
    flex: 0 0 auto;
  }
  #tool6-page .ai-eye-line-row .ai-input-group {
    min-width: 0;
  }
  #tool6-page .ai-prescription-card .ai-eye-line-row .ai-label {
    display: block;
    text-align: center;
    margin-bottom: 4px;
  }
  #tool6-page .ai-row {
    display: flex;
    gap: 8px;
    margin-bottom: 5px;
  }
  #tool6-page .ai-row:last-child {
    margin-bottom: 0;
  }
  #tool6-page .ai-input-group {
    flex: 1;
  }
  #tool6-page .ai-label {
    font-size: 13px;
    color: #666;
    margin-bottom: 4px;
  }
  #tool6-page .ai-inline-row {
    align-items: center;
    margin-bottom: 0;
  }
  #tool6-page .ai-inline-row .ai-label {
    margin-bottom: 0;
    white-space: nowrap;
    color: #222;
    flex: 0 0 auto;
  }
  #tool6-page .ai-inline-row .ai-input-group {
    min-width: 0;
  }
  #tool6-page .ai-select {
    width: 100%;
    border: 1px solid #e6eaf0;
    border-radius: 6px;
    background: #fff;
    color: #333;
    padding: 6px 8px;
    font-size: 13px;
    outline: none;
  }
  #tool6-page .ai-select:focus {
    border-color: #0456a8;
    box-shadow: 0 0 0 2px rgba(4, 86, 168, 0.08);
  }
  #tool6-page .ai-check-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px 12px;
    align-items: center;
  }
  #tool6-page .ai-check-item {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 13px;
    color: #333;
    line-height: 1.35;
    min-width: 0;
  }
  #tool6-page .ai-check-item input[type="checkbox"] {
    width: 14px;
    height: 14px;
    accent-color: #0456a8;
    flex-shrink: 0;
  }
  #tool6-page .ai-action-btn {
    width: 100%;
    border: none;
    border-radius: 28px;
    background: #0456a8;
    color: #ffffff;
    font-size: 15px;
    font-weight: 700;
    padding: 10px 12px;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(4, 86, 168, 0.35);
  }
  #tool6-page .ai-action-btn:active {
    filter: brightness(0.96);
  }
  #tool6-page .ai-result {
    background: #e6f7ff;
    border-radius: 10px;
    border: 0.8px dashed rgba(0,0,0,0.4);
    padding: 8px 10px;
    color: #0456a8;
    font-size: 13px;
    line-height: 1.5;
    white-space: pre-line;
    min-height: 56px;
    max-height: 35vh;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }
  @media (max-width: 480px) {
    #tool6-page .ai-row {
      flex-direction: column;
      gap: 6px;
    }
    #tool6-page .ai-eye-line-row {
      flex-direction: row;
      gap: 6px;
    }
    #tool6-page .ai-inline-row {
      flex-direction: row;
      flex-wrap: nowrap;
      gap: 6px;
    }
    #tool6-page .ai-inline-row .ai-input-group {
      flex: 1 1 0;
      min-width: 0;
    }
    #tool6-page .ai-check-grid {
      grid-template-columns: 1fr 1fr;
      gap: 5px 10px;
    }
  }

  /* —— 眼球光学教学：高对比清晰 UI（白卡片 + 深字） —— */
  #price-page {
    --eye-bg: #e8f1f8;
    --eye-surface: #ffffff;
    --eye-surface-elev: #f6fafc;
    --eye-border: rgba(13, 71, 110, 0.22);
    --eye-border-strong: rgba(13, 71, 110, 0.32);
    --eye-text: #0c1929;
    --eye-text-secondary: #3a4f62;
    --eye-text-muted: #5a6b78;
    --eye-text-dim: #3a4f62;
    --eye-accent: #0b6bcb;
    --eye-on-accent: #ffffff;
    --eye-focal-ok: #0d7a52;
    --eye-focal-bad: #c62828;
    --eye-focal-far: #1565c0;
  }
  #price-page.page.active {
    display: flex;
    flex-direction: column;
    align-items: center;
    background: var(--eye-bg) !important;
    color: var(--eye-text);
    font-family: 'Noto Sans SC', system-ui, sans-serif;
    padding: 52px 14px 32px;
    overflow-x: visible;
    -webkit-font-smoothing: antialiased;
  }
  #price-page, #price-page *, #price-page *::before, #price-page *::after {
    box-sizing: border-box;
  }
  #price-page .eye-hdr { text-align: center; margin-bottom: 16px; }
  #price-page .eye-hdr h1 {
    font-family: 'Noto Sans SC', system-ui, sans-serif;
    font-size: clamp(16px, 3.1vw, 22px);
    font-weight: 600;
    color: var(--eye-text);
    letter-spacing: 0.02em;
    line-height: 1.35;
  }
  #price-page .eye-main {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    width: 100%;
    max-width: 820px;
  }
  #price-page .eye-canvas-card {
    width: 100%;
    background: var(--eye-surface);
    border: 1px solid var(--eye-border-strong);
    border-radius: 16px;
    padding: 14px 14px 12px;
    box-shadow: 0 4px 24px rgba(13, 71, 110, 0.08);
    position: relative;
    overflow: visible;
  }
  #price-page .eye-canvas-inner {
    width: 100%;
    overflow: hidden;
    border-radius: 4px;
  }
  #price-page .eye-canvas-card::before { display: none; }
  #price-page #eyeopt-c {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 0;
    background-color: transparent;
    border: none;
  }
  #price-page .eye-status-bar {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-top: 12px;
    padding: 6px 0;
    background: transparent;
    border-radius: 0;
    border: none;
    width: 100%;
    max-width: 100%;
    overflow: visible;
    min-width: 0;
  }
  #price-page .eye-status-label {
    font-size: 12px;
    font-weight: 500;
    color: var(--eye-text-secondary);
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1 1 auto;
    min-width: 0;
    max-width: 100%;
  }
  #price-page .eye-status-main {
    display: flex;
    align-items: center;
    gap: 2ch;
    flex: 1 1 auto;
    min-width: 0;
    flex-wrap: nowrap;
  }
  #price-page .eye-status-main > span {
    white-space: nowrap;
    flex-shrink: 0;
  }
  #price-page .eye-status-detail {
    font-weight: 600;
    line-height: 1.35;
    white-space: nowrap;
  }
  #price-page .eye-status-dot {
    width: 8px; height: 8px;
    border-radius: 50%;
    background: var(--eye-focal-ok);
    box-shadow: 0 0 0 2px rgba(13, 122, 82, 0.25);
    transition: background 0.3s, box-shadow 0.3s;
  }
  #price-page .eye-status-dot.miss {
    background: var(--eye-focal-bad);
    box-shadow: 0 0 0 2px rgba(198, 40, 40, 0.25);
  }
  #price-page .eye-controls-panel {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
  }
  #price-page .eye-ctrl-card {
    background: var(--eye-surface);
    border: 1px solid var(--eye-border);
    border-radius: 14px;
    padding: 14px 12px;
    box-shadow: 0 2px 12px rgba(13, 71, 110, 0.06);
  }
  #price-page .eye-ctrl-card h3 {
    font-size: 10px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--eye-text-muted);
    font-weight: 600;
    margin-bottom: 12px;
  }
  #price-page .eye-slider-row { display: flex; flex-direction: column; gap: 10px; }
  #price-page .eye-slider-label-row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
  }
  #price-page .eye-slider-name { font-size: 13px; color: var(--eye-text); font-weight: 500; }
  #price-page .eye-slider-val {
    font-size: 13px;
    color: var(--eye-accent);
    font-weight: 600;
    min-width: 40px;
    text-align: right;
  }
  #price-page input[type=range].eye-range {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    height: 6px;
    border-radius: 6px;
    background: linear-gradient(90deg, rgba(13, 71, 110, 0.12), rgba(13, 71, 110, 0.22));
    outline: none;
    cursor: pointer;
  }
  #price-page input[type=range].eye-range::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 18px; height: 18px;
    border-radius: 50%;
    background: var(--eye-accent);
    border: 2px solid #fff;
    box-shadow: 0 2px 8px rgba(11, 107, 203, 0.35);
    cursor: pointer;
    transition: transform 0.15s;
  }
  #price-page input[type=range].eye-range::-webkit-slider-thumb:hover { transform: scale(1.08); }
  #price-page .eye-tick-row {
    display: flex;
    justify-content: space-between;
    font-size: 10px;
    font-weight: 500;
    color: var(--eye-text-secondary);
    padding: 0 2px;
  }
  #price-page .eye-play-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    width: 100%;
    padding: 13px;
    border-radius: 12px;
    border: none;
    background: linear-gradient(180deg, #0b6bcb, #0958ad);
    color: var(--eye-on-accent);
    font-family: 'Noto Sans SC', sans-serif;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: transform 0.2s, filter 0.2s, box-shadow 0.2s;
    box-shadow: 0 4px 14px rgba(11, 107, 203, 0.35);
    margin-top: 12px;
  }
  #price-page .eye-play-btn:hover { transform: translateY(-1px); filter: brightness(1.06); }
  #price-page .eye-play-btn:active { transform: translateY(0); filter: brightness(0.98); }
  #price-page .eye-mode-row {
    display: flex;
    gap: 0;
    background: var(--eye-surface-elev);
    border: 1px solid var(--eye-border);
    border-radius: 10px;
    padding: 4px;
  }
  #price-page .eye-mode-btn {
    flex: 1;
    padding: 8px 4px;
    border: none;
    border-radius: 8px;
    background: transparent;
    color: var(--eye-text-secondary);
    font-family: 'Noto Sans SC', sans-serif;
    font-size: 11px;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
  }
  #price-page .eye-mode-btn.active {
    background: var(--eye-accent);
    color: var(--eye-on-accent);
    box-shadow: 0 1px 4px rgba(11, 107, 203, 0.25);
  }
  #price-page .eye-info-row {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
  }
  #price-page .eye-info-chip {
    background: var(--eye-surface);
    border: 1px solid var(--eye-border);
    border-radius: 12px;
    padding: 12px 10px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    box-shadow: 0 1px 6px rgba(13, 71, 110, 0.05);
  }
  #price-page .eye-info-chip .eye-ic-label {
    font-size: 10.5px;
    font-weight: 600;
    color: var(--eye-text-secondary);
    letter-spacing: 0.04em;
  }
  #price-page .eye-info-chip .eye-ic-val {
    font-size: 15px;
    font-weight: 700;
    color: var(--eye-text);
  }
  #price-page .eye-ic-sub {
    font-size: 10px;
    font-weight: 500;
    color: var(--eye-text-muted);
    margin-top: 1px;
    line-height: 1.35;
  }
  @media (max-width: 560px) {
    #price-page .eye-controls-panel { grid-template-columns: 1fr; }
    #price-page .eye-info-row { grid-template-columns: repeat(3, 1fr); gap: 6px; }
    #price-page .eye-info-chip {
      padding: 9px 6px;
      min-width: 0;
      align-items: center;
      text-align: center;
      font-size: 11px;
    }
    #price-page .eye-info-chip .eye-ic-label,
    #price-page .eye-info-chip .eye-ic-val,
    #price-page .eye-info-chip .eye-ic-sub {
      display: inline-block;
      white-space: nowrap;
    }
    #price-page .eye-info-chip .eye-ic-label {
      font-size: 0.864em;
    }
    #price-page .eye-info-chip .eye-ic-val {
      font-size: 1.182em;
    }
    #price-page .eye-info-chip .eye-ic-sub {
      font-size: 0.818em;
    }
    #price-page .eye-status-label {
      font-size: clamp(9px, 2.65vw, 12px);
    }
  }

/* ========== 封面页样式（原内嵌在 #cover-page 内）========== */
    @keyframes bgMove {
      0%{background-position:0% 50%}
      50%{background-position:100% 50%}
      100%{background-position:0% 50%}
    }
    @keyframes float {
      0%{transform:translateY(0)}
      50%{transform:translateY(-10px)}
      100%{transform:translateY(0)}
    }
    @keyframes lightMove {
      0%{transform:translate(0,0)}
      50%{transform:translate(20px,-20px)}
      100%{transform:translate(0,0)}
    }
    .light {
      position:absolute;
      border-radius:50%;
      background:rgba(255,255,255,0.7);
      filter:blur(6px);
      animation: lightMove 8s ease-in-out infinite;
    }
    .logo-img {
      width: 100px;
      height: auto;
      margin-bottom: 2px;
    }
    /* 封面「点击进入」按钮：圆弧形外框 + 半透明毛玻璃 */
    .cover-enter-btn {
      margin-top: 40px;
      font-size: 15px;
      color: #fff;
      font-weight: bold;
      cursor: pointer;
      padding: 12px 32px;
      background: rgba(255, 255, 255, 0.15);
      border: 1px solid rgba(255, 255, 255, 0.6);
      border-radius: 40px;
      backdrop-filter: blur(5px);
      -webkit-backdrop-filter: blur(5px);
      transition: background 0.2s, border-color 0.2s;
    }
    .cover-enter-btn:active {
      background: rgba(255, 255, 255, 0.25);
      border-color: rgba(255, 255, 255, 0.8);
    }
    /* 封面眼镜图标镜片：半透明白色毛玻璃风格 */
    .cover-glasses-lens {
      background: rgba(255, 255, 255, 0.35) !important;
      border: 4px solid rgba(255, 255, 255, 0.8) !important;
      backdrop-filter: blur(4px);
      -webkit-backdrop-filter: blur(4px);
    }