/* 小L工具箱 · 浅色主题，结构仿照考试时钟(topbar/footer) */

/* ---------- topbar (examclock structure, light) ---------- */
.ll-topbar{
  position:sticky;top:0;z-index:100;
  border-bottom:1px solid var(--line-soft);
  background:rgba(251,251,253,.75);
  backdrop-filter:blur(20px) saturate(150%);
  -webkit-backdrop-filter:blur(20px) saturate(150%);
}
.ll-topbar-inner{height:66px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.ll-brand{display:flex;align-items:center;gap:12px;min-width:0}
.ll-brand img{width:38px;height:38px;border-radius:11px}
.ll-brand-title{font-weight:800;font-size:1.02rem;line-height:1.1;letter-spacing:-.02em;color:var(--ink)}
.ll-brand-sub{font-size:.78rem;color:var(--text-muted);line-height:1.2;margin-top:2px;font-family:var(--mono);letter-spacing:.02em}
.ll-nav{display:flex;align-items:center;gap:4px}
.ll-nav a{
  font-size:.9rem;color:var(--text-secondary);padding:8px 14px;border-radius:999px;font-weight:600;
  transition:background .18s var(--ease),color .18s var(--ease);
}
.ll-nav a:hover{color:var(--text-main);background:rgba(16,19,25,.05)}
.ll-nav a.active{color:var(--ink);background:rgba(16,19,25,.06)}
.ll-nav a.download{color:#fff;background:var(--ink);font-weight:700}
.ll-nav a.download:hover{background:var(--accent-strong);color:#fff}

/* ---------- hero ---------- */
.ll-hero{padding:72px 0 24px;display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:52px;align-items:center}
.ll-hero .eyebrow{display:block;margin-bottom:18px}
.ll-hero h1{font-size:clamp(2.3rem,5vw,3.4rem);font-weight:800;letter-spacing:-.04em;line-height:1.07;color:var(--ink)}
.ll-hero .lead{margin-top:20px;font-size:1.08rem;color:var(--text-secondary);line-height:1.72;max-width:46ch}
.ll-hero-actions{margin-top:30px;display:flex;gap:12px;flex-wrap:wrap}
.ll-release{display:flex;flex-wrap:wrap;gap:0;margin-top:28px;border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;background:var(--surface)}
.ll-release>div{flex:1;min-width:110px;padding:14px 18px;border-right:1px solid var(--line)}
.ll-release>div:last-child{border-right:0}
.ll-release dt{font-size:.74rem;color:var(--text-muted);font-family:var(--mono);letter-spacing:.06em}
.ll-release dd{margin:5px 0 0;font-size:.98rem;font-weight:700;color:var(--ink);letter-spacing:-.01em}
.ll-note{margin-top:14px;font-size:.88rem;color:var(--text-muted)}

/* hero right: brand showcase panel (no screenshot) */
.ll-showcase{
  position:relative;height:320px;border-radius:var(--r-lg);overflow:hidden;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;
  background:radial-gradient(120% 120% at 50% 22%,#f4f7fd,#e6ebf7);
  border:1px solid var(--line);box-shadow:var(--shadow-2);
}
.ll-showcase img{width:104px;height:104px;object-fit:contain;filter:drop-shadow(0 16px 34px rgba(47,87,230,.24))}
.ll-showcase .sc-name{font-size:1.24rem;font-weight:800;color:var(--ink);letter-spacing:-.02em}
.ll-showcase .sc-slogan{font-size:.9rem;color:var(--text-muted);margin-top:-6px}
.ll-showcase .sc-dots{position:absolute;inset:0;background:radial-gradient(circle at 1px 1px,rgba(16,19,25,.05) 1px,transparent 0);background-size:22px 22px;opacity:.6;pointer-events:none}

/* ---------- tools ---------- */
.ll-section{padding:52px 0 0}
.ll-cat{margin-bottom:42px}
.ll-cat-head{display:flex;align-items:baseline;gap:12px;margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid var(--line)}
.ll-cat-head h2{font-size:1.24rem;font-weight:760;letter-spacing:-.025em;color:var(--ink)}
.ll-cat-head span{font-family:var(--mono);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted)}
.ll-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px}
.ll-tool{
  display:flex;align-items:center;gap:14px;padding:17px 20px;
  border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface);box-shadow:var(--shadow-1);
  transition:transform .2s var(--ease),border-color .2s var(--ease),box-shadow .2s var(--ease);
}
.ll-tool:hover{transform:translateY(-2px);border-color:var(--line-strong);box-shadow:var(--shadow-2)}
.ll-ic{width:42px;height:42px;border-radius:11px;flex:0 0 auto;display:grid;place-items:center}
.ll-ic svg{width:21px;height:21px;stroke-width:2;fill:none}
.ll-ic.blue{background:rgba(47,111,230,.10);color:#2f6fe6}
.ll-ic.green{background:rgba(34,178,110,.12);color:#1fa564}
.ll-ic.orange{background:rgba(240,138,40,.12);color:#e07a17}
.ll-ic.purple{background:rgba(130,90,230,.12);color:#7a53e6}
.ll-tool b{font-size:1rem;font-weight:700;color:var(--ink);letter-spacing:-.01em}

/* ---------- footer (examclock structure, light) ---------- */
.ll-footer{border-top:1px solid var(--line);background:var(--surface);padding:44px 0 26px;margin-top:64px;color:var(--text-secondary);font-size:.9rem}
.ll-footer-inner{display:flex;align-items:flex-start;justify-content:space-between;gap:28px;flex-wrap:wrap}
.ll-footer-brand{display:flex;align-items:center;gap:11px;color:var(--ink);font-weight:780;font-size:1.02rem}
.ll-footer-brand img{width:32px;height:32px;border-radius:9px}
.ll-footer-meta{color:var(--text-muted);margin-top:6px}
.ll-footer-links{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.ll-footer-links a{color:var(--text-secondary)}
.ll-footer-links a:hover{color:var(--accent)}
.ll-footer .footer-bottom{margin-top:26px;padding-top:18px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;color:var(--text-muted);font-size:.8rem}

/* ---------- history page ---------- */
.ll-hist-hero{padding:64px 0 22px}
.ll-hist-hero h1{font-size:clamp(2.1rem,5vw,3.2rem);font-weight:800;letter-spacing:-.04em;color:var(--ink)}
.ll-hist-hero p{margin-top:12px;color:var(--text-secondary);font-size:1.02rem}
.ll-hist{display:grid;grid-template-columns:1fr;gap:14px;padding-bottom:20px}
.ll-log{border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface);box-shadow:var(--shadow-1);overflow:hidden}
.ll-log-head{padding:18px 24px;border-bottom:1px solid var(--line);display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.ll-log-head h2{font-size:1.06rem;font-weight:740;color:var(--ink);letter-spacing:-.01em}
.ll-log-head .date{font-family:var(--mono);font-size:.8rem;color:var(--text-muted)}
.ll-log-body{padding:18px 24px}
.ll-log-body ul{margin:0;padding-left:20px;display:grid;gap:8px}
.ll-log-body li{color:var(--text-secondary);font-size:.95rem;line-height:1.6}
.ll-log-body li::marker{color:var(--accent)}

@media (max-width:860px){
  .ll-hero{grid-template-columns:1fr;gap:30px;padding:48px 0 8px}
  .ll-showcase{order:-1;height:240px}
  .ll-release>div{min-width:calc(50% - 1px)}
  .ll-topbar-inner{height:auto;min-height:60px;padding:10px 0;flex-wrap:wrap;gap:12px}
  .ll-footer-inner{flex-direction:column}
}
@media (max-width:520px){
  .ll-nav a:not(.download){display:none}
}