/* ============================================================
   布局抄作业六页新增样式（浅蓝白 #38BDF8 主色，禁紫）
   作用页：index.html / compare.html / login.html / workbench.html / 移动端
   新建于 2026-10-23，不改动现有 rectify_*.css
   ============================================================ */

/* ---------- P0-2 顶部可关闭公告条 ---------- */
.lw2-announce{
  position:relative;background:linear-gradient(90deg,#E3EEFF,#D2E4FF);
  color:#1d2129;font-size:13px;text-align:center;
  padding:8px 40px 8px 16px;border-bottom:1px solid #C5DCF2;
}
.lw2-an-cd{display:inline-block;margin:0 8px;color:#0284C7;font-weight:700;font-variant-numeric:tabular-nums;}
.lw2-an-price{color:#0284C7;font-weight:700;}
.lw2-an-close{position:absolute;right:10px;top:50%;transform:translateY(-50%);cursor:pointer;color:#606266;font-size:14px;padding:2px 6px;}

/* ---------- P1-5 导航五 Tab ---------- */
.lw2-nav5{
  display:flex;justify-content:center;gap:28px;
  padding:12px 16px 0;flex-wrap:wrap;
}
.lw2-nav5 a{
  font-size:14px;color:#1d2129;text-decoration:none;padding:6px 2px;
  border-bottom:2px solid transparent;
}
.lw2-nav5 a.on{color:#0284C7;border-bottom-color:#38BDF8;font-weight:600;}
.lw2-nav5 a:hover{color:#38BDF8;}

/* ---------- P0-1 分镜卡三连预览（300×200 ×3） ---------- */
.lw2-shots{
  display:flex;justify-content:center;gap:16px;flex-wrap:wrap;
  margin:20px auto 16px;max-width:960px;
}
.lw2-shot{
  width:300px;height:200px;background:#fff;border:1px solid #D8E6F5;
  border-radius:12px;overflow:hidden;position:relative;
  box-shadow:0 4px 14px rgba(70,120,190,.10);
}
.lw2-shot-badge{
  position:absolute;top:8px;left:8px;background:#38BDF8;color:#fff;
  font-size:12px;padding:2px 8px;border-radius:8px;z-index:2;
}
.lw2-shot-img{
  height:120px;background:linear-gradient(135deg,#EAF3FC,#D2E4FF);
  position:relative;
}
.lw2-shot-img:after{
  content:"";position:absolute;inset:0;
  background:repeating-linear-gradient(45deg,transparent,transparent 12px,rgba(255,255,255,.5) 12px,rgba(255,255,255,.5) 24px);
}
.lw2-shot-line{font-size:13px;color:#1d2129;padding:6px 12px 0;font-weight:600;}
.lw2-shot-line2{font-size:12px;color:#606266;padding:2px 12px 8px;}

/* ---------- P1-7 参考图上传位 ---------- */
.e2-refup{
  background:transparent;border:0;cursor:pointer;font-size:16px;
  padding:0 6px;color:#606266;
}
.lw2-ref-chips{display:flex;gap:8px;margin-top:8px;flex-wrap:wrap;}
.lw2-ref-chip{
  width:48px;height:48px;border-radius:8px;background:#EAF3FC;
  border:1px solid #C5DCF2;position:relative;overflow:hidden;
  display:flex;align-items:center;justify-content:center;font-size:12px;color:#606266;
}
.lw2-ref-chip img{width:100%;height:100%;object-fit:cover;}
.lw2-ref-chip .x{
  position:absolute;top:0;right:0;background:rgba(30,42,58,.6);color:#fff;
  font-size:12px;width:14px;height:14px;line-height:14px;text-align:center;cursor:pointer;
}

/* ---------- P0-3 作品广场卡片墙 ---------- */
.lw2-wall{
  display:grid;grid-template-columns:repeat(4,1fr);gap:14px;
}
.lw2-wall-card{
  background:#fff;border:1px solid #D8E6F5;border-radius:12px;overflow:hidden;
  cursor:pointer;transition:transform .15s;
}
.lw2-wall-card:hover{transform:translateY(-2px);}
.lw2-wall-cover{height:140px;}
.lw2-wall-cover.c1{background:linear-gradient(135deg,#D2E4FF,#A8C6EF);}
.lw2-wall-cover.c2{background:linear-gradient(135deg,#FFE3EC,#FFC5D5);}
.lw2-wall-cover.c3{background:linear-gradient(135deg,#FFF3D2,#FFDF9A);}
.lw2-wall-cover.c4{background:linear-gradient(135deg,#D8F5E3,#A8E6C1);}
.lw2-wall-cover.c5{background:linear-gradient(135deg,#E3EEFF,#B8D6F5);}
.lw2-wall-cover.c6{background:linear-gradient(135deg,#DCEFFF,#A8D8F0);}
.lw2-wall-info{padding:8px 10px;}
.lw2-wall-info b{display:block;font-size:13px;color:#1d2129;}
.lw2-wall-info span{font-size:12px;color:#606266;}

/* ---------- P1-9 谁在用镜浪五场景卡 ---------- */
.lw2-who{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;}
.lw2-who-card{
  background:#F8FBFF;border:1px solid #D8E6F5;border-radius:12px;
  padding:16px 12px;text-align:center;
}
.lw2-who-ic{font-size:32px;margin-bottom:8px;}
.lw2-who-card b{font-size:13px;color:#1d2129;display:block;margin-bottom:4px;}
.lw2-who-card p{font-size:12px;color:#606266;line-height:1.5;}

/* ---------- P0-4 右下浮动登录卡 ---------- */
.lw2-login-card{
  position:fixed;right:24px;bottom:96px;width:280px;z-index:120;
  background:#fff;border:1px solid #D8E6F5;border-radius:16px;
  padding:18px;box-shadow:0 10px 30px rgba(29,33,41,.18);
}
.lw2-lc-title{font-size:16px;font-weight:700;color:#1d2129;margin-bottom:10px;}
.lw2-lc-list{list-style:none;margin:0 0 12px;}
.lw2-lc-list li{font-size:13px;color:#1d2129;padding:4px 0;}
.lw2-lc-btn{
  display:block;text-align:center;background:#38BDF8;color:#fff;
  text-decoration:none;padding:10px;border-radius:12px;font-size:13px;font-weight:600;
}
.lw2-login-card.hidden{display:none;}

/* ---------- 响应式 ---------- */
@media(max-width:900px){
  .lw2-wall{grid-template-columns:repeat(2,1fr);}
  .lw2-who{grid-template-columns:repeat(2,1fr);}
  .lw2-login-card{right:12px;bottom:16px;width:calc(100vw - 24px);max-width:320px;}
  .lw2-nav5{gap:16px;}
}

/* ============================================================
   移动端底 Tab 5 项 + workbench 拦截告知卡（≤768px）
   ============================================================ */
.lw2-bottombar{display:none;}
@media(max-width:768px){
  .lw2-bottombar{
    display:flex;position:fixed;left:0;right:0;bottom:0;z-index:150;
    background:#fff;border-top:1px solid #d8e6f5;height:56px;
    align-items:center;justify-content:space-around;
    padding-bottom:env(safe-area-inset-bottom);
  }
  .lw2-bb-item{
    flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;
    font-size:10px;color:#5a6b80;text-decoration:none;padding:6px 0;
  }
  .lw2-bb-item .ic{font-size:20px;}
  .lw2-bb-item.on{color:#0284C7;font-weight:600;}
  .lw2-desktop-only{
    display:none;position:fixed;inset:0;z-index:300;background:#f0f6ff;
    align-items:center;justify-content:center;padding:24px;
  }
  .lw2-desktop-only.show{display:flex;}
  .lw2-do-card{
    background:#fff;border:1px solid #d8e6f5;border-radius:16px;
    padding:28px 22px;max-width:340px;text-align:center;
    box-shadow:0 12px 36px rgba(70,110,170,.16);
  }
  .lw2-do-card .ic{font-size:44px;margin-bottom:12px;}
  .lw2-do-card h3{font-size:17px;color:#1e2a3a;margin-bottom:8px;}
  .lw2-do-card p{font-size:12.5px;color:#5a6b80;line-height:1.6;margin-bottom:16px;}
  .lw2-do-card a{
    display:inline-block;background:#38BDF8;color:#fff;text-decoration:none;
    padding:10px 22px;border-radius:10px;font-size:13.5px;font-weight:600;
  }
}

/* ============================================================
   S8 外观改版（2026-10-23）：导航/作品墙/谁在用/浮动登录卡打磨
   ============================================================ */
/* 作品广场墙：圆角加大 + 封面渐入 + hover 抬升 */
.lw2-wall{gap:16px;}
.lw2-wall-card{border-radius:16px;border:1px solid rgba(56,189,248,.10);overflow:hidden;box-shadow:0 4px 16px rgba(56,189,248,.06);}
.lw2-wall-card:hover{transform:translateY(-4px);box-shadow:0 12px 30px rgba(56,189,248,.14);}
.lw2-wall-cover{height:150px;transition:transform .25s cubic-bezier(.22,.61,.36,1);}
.lw2-wall-card:hover .lw2-wall-cover{transform:scale(1.04);}
.lw2-wall-info{padding:10px 12px;}
.lw2-wall-info b{font-size:13.5px;}

/* 谁在用：五场景卡改为白卡 + hover 抬升 */
.lw2-who{gap:14px;}
.lw2-who-card{background:#fff;border:1px solid rgba(56,189,248,.10);border-radius:16px;padding:20px 12px;box-shadow:0 4px 16px rgba(56,189,248,.05);transition:transform .2s,box-shadow .2s;}
.lw2-who-card:hover{transform:translateY(-3px);box-shadow:0 10px 26px rgba(56,189,248,.12);}
.lw2-who-ic{font-size:34px;margin-bottom:10px;}

/* 浮动登录卡：更精致阴影 + 主按钮阴影 */
.lw2-login-card{border-radius:18px;box-shadow:0 16px 44px rgba(19,41,82,.20);border:1px solid rgba(56,189,248,.14);}
.lw2-lc-btn{background:linear-gradient(135deg,#38BDF8,#2f8fff);border-radius:12px;box-shadow:0 4px 14px rgba(56,189,248,.28);transition:transform .15s,box-shadow .2s;}
.lw2-lc-btn:hover{transform:translateY(-1px);box-shadow:0 6px 20px rgba(56,189,248,.36);}

/* 分镜预览卡（hero 三连）封面位更柔和 */
.lw2-shot-img{background:linear-gradient(135deg,#EAF3FC,#D6E8FB);}

/* 作品墙真实数据：img 封面、a 卡片、空态 */
.lw2-wall-card{display:block;text-decoration:none;color:inherit;}
img.lw2-wall-cover{width:100%;object-fit:cover;display:block;}
.lw2-wall-empty{grid-column:1/-1;padding:48px 24px;text-align:center;border:1px dashed rgba(56,189,248,.25);border-radius:16px;background:linear-gradient(160deg,#F5FAFF,#EAF3FC);}
.lw2-wall-empty b{display:block;font-size:16px;color:#1d2129;margin-bottom:6px;}
.lw2-wall-empty span{display:block;font-size:13px;color:#86909c;margin-bottom:16px;}
.lw2-wall-cta{display:inline-block;padding:9px 22px;border-radius:10px;background:linear-gradient(135deg,#38BDF8,#2f8fff);color:#fff;font-size:14px;text-decoration:none;box-shadow:0 4px 14px rgba(56,189,248,.28);}
