/* ================= ROOT ================= */

:root{
  --ease:cubic-bezier(0.16,1,0.3,1);

  --bg-top:#FFFFFF;
  --bg-bottom:#F5F5F7;
  --text:#1D1D1F;
  --muted:rgba(0,0,0,0.45);
  --hair:rgba(0,0,0,0.06);
  --search:rgba(0,0,0,0.03);

  --glow-opacity:0.06;
  --icon-default-opacity:0.65;
  --icon-brightness:1.0;
  --icon-shadow:rgba(0,0,0,0);
}

body.theme-night{
  --bg-top:#09112A;
  --bg-bottom:#070A12;
  --text:rgba(255,255,255,0.92);
  --muted:rgba(255,255,255,0.55);
  --hair:rgba(255,255,255,0.08);
  --search:rgba(255,255,255,0.08);

  --glow-opacity:0.35;
  --icon-default-opacity:0.90;
  --icon-brightness:1.5;
  --icon-shadow:rgba(255,255,255,0.12);
}

/* ================= BASE ================= */

*{ box-sizing:border-box; }

body{
  margin:0;
  font-family:Inter,-apple-system,sans-serif;
  color:var(--text);
  background:linear-gradient(180deg,var(--bg-top),var(--bg-bottom));
  min-height:100vh;
  transition:background 1.5s var(--ease),color 1.5s var(--ease);
  overflow-x:hidden;
}

/* ================= LAYOUT ================= */

.wrap{
  max-width:1000px;
  margin:auto;
  padding:calc(26px + env(safe-area-inset-top)) 20px 54px;
}

.top{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  margin-bottom:10px;
  opacity:.86;
}

.clock{
  font-family:"JetBrains Mono";
  font-weight:600;
  font-size:24px;
  letter-spacing:-1px;
}

.section{
  margin:16px 0 10px;
  display:flex;
  align-items:center;
  gap:12px;
  color:var(--muted);
  font-size:11px;
  letter-spacing:.2em;
  text-transform:uppercase;
  font-weight:600;
}

.section .line{
  flex:1;
  height:1px;
  background:var(--hair);
}

.grid{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:26px 18px;
}

@media(max-width:900px){
  .grid{ grid-template-columns:repeat(4,1fr); }
}

@media(max-width:600px){
  .grid{ grid-template-columns:repeat(3,1fr); }
}

/* ================= ITEM ================= */

.item{
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:12px;
  text-decoration:none;
  color:var(--muted);
  min-height:86px;
  transition:.25s var(--ease);
  isolation:isolate;
}

.item:active{
  transform:scale(.97);
}

/* ================= ICON ================= */

.icon{
  width:54px;
  height:54px;
  display:grid;
  place-items:center;
  position:relative;
}

.icon img{
  width:36px;
  height:36px;
  object-fit:contain;
  transition:.35s var(--ease);
  backface-visibility:hidden;
}

/* ===== 默认灰态 ===== */

.icon img.single,
.icon img.base,
.icon.gemini img.g0{
  filter:grayscale(100%)
         brightness(var(--icon-brightness))
         opacity(var(--icon-default-opacity))
         drop-shadow(0 2px 4px var(--icon-shadow));
}

/* 双图结构 */
.icon img.active{ opacity:0; }
.icon img.base{ opacity:1; }

/* Gemini 居中 */
.icon.gemini img{
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%) scale(var(--s,1));
}

.icon.gemini img.g1{ opacity:0; }

/* ===== 夜间补光 ===== */

body.theme-night .white-invert .icon img.single,
body.theme-night .white-invert .icon img.base,
body.theme-night .white-invert .icon.gemini img.g0{
  filter:grayscale(100%)
         invert(1)
         brightness(1.8)
         opacity(.92)
         drop-shadow(0 2px 4px var(--icon-shadow));
}

/* ================================================= */
/* ============== 唤醒（不位移版） ================= */
/* ================================================= */

/* ===== iOS 二次点击唤醒 ===== */

.item.awake .icon img.single,
.item.awake .icon img.base{
  filter:grayscale(0%) brightness(1) opacity(1) !important;
}

.item.awake .icon img.base{ opacity:0; }

.item.awake .icon img.active{
  opacity:1;
  filter:none !important;
}

.item.awake .icon.gemini img.g0{ opacity:0; }
.item.awake .icon.gemini img.g1{
  opacity:1;
  filter:none !important;
}

/* 光晕 */
.item.awake .icon::after{
  content:"";
  position:absolute;
  inset:-10px;
  border-radius:50%;
  z-index:-1;
  filter:blur(35px);
  opacity:var(--glow-opacity);
  background:radial-gradient(circle,var(--brand-color,#7C5CFF),transparent 75%);
}

/* label */
.item.awake .label{
  color:var(--text);
}

/* ===== 桌面 hover ===== */
@media (hover:hover) and (pointer:fine){

  .item:hover .icon img.single,
  .item:hover .icon img.base{
    filter:grayscale(0%) brightness(1) opacity(1) !important;
  }

  .item:hover .icon img.base{ opacity:0; }
  .item:hover .icon img.active{
    opacity:1;
    filter:none !important;
  }

  .item:hover .icon.gemini img.g0{ opacity:0; }
  .item:hover .icon.gemini img.g1{
    opacity:1;
    filter:none !important;
  }

  .item:hover .icon::after{
    content:"";
    position:absolute;
    inset:-10px;
    border-radius:50%;
    z-index:-1;
    filter:blur(35px);
    opacity:var(--glow-opacity);
    background:radial-gradient(circle,var(--brand-color,#7C5CFF),transparent 75%);
  }

  .item:hover .label{
    color:var(--text);
  }
}

/* ================= MORE ================= */

#moreArea[aria-hidden="true"]{
  display:none;
}

.morebtn{
  background:var(--search);
  border:1px solid var(--hair);
  padding:8px 24px;
  border-radius:999px;
  font-size:13px;
  cursor:pointer;
  margin:28px auto 0;
  display:block;
  opacity:.65;
}