:root {
  color-scheme: light;
  --paper: #f5f2ed;
  --ink: #101112;
  --muted: #74736f;
  --blue: #234baf;
  --glass: linear-gradient(138deg, rgba(255,255,255,.53), rgba(255,255,255,.28) 50%, rgba(232,229,223,.27));
  --glass-line: rgba(255,255,255,.88);
  --glass-shadow: 0 2px 3px rgba(87,76,58,.06), 5px 18px 30px -14px rgba(78,67,46,.23), 0 0 0 1px rgba(194,185,173,.13), inset 0 1px 1px #fff;
  --glass-grain: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='grain'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23grain)' opacity='.3' d='M0 0h180v180H0z'/%3E%3C/svg%3E");
  --ui-font: "Helvetica Neue", "PingFang SC", "Microsoft YaHei", Arial, sans-serif;
}
* { box-sizing: border-box; }
html { min-width: 280px; background: var(--paper); }
body.glass-page {
  margin: 0;
  min-height: 100vh;
  color: var(--ink) !important;
  background: var(--paper) !important;
  font-family: var(--ui-font);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
body.glass-page::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  width: auto;
  height: auto;
  border-radius: 0;
  background: var(--glass-grain);
  background-size: 180px 180px;
  opacity: .38;
  filter: none;
  pointer-events: none;
}
body.glass-page::after { content: none; }
.glass-page :is(.mini-page, .idea-page, header.top, .hero, .grid, footer, .beian) { position: relative; z-index: 1; }
.glass-page a { color: inherit; text-decoration: none; }
.glass-page a:focus-visible, .glass-page button:focus-visible { outline: 3px solid var(--blue); outline-offset: 5px; }
.glass-page ::selection { color: #fff; background: var(--blue); }

/* The collection pages share the same paper and frosted surface as the home page. */
.glass-page :is(.card, .brief-card, .result-card, .output-card, .idea-hero-note) {
  border: 1px solid var(--glass-line);
  background: var(--glass);
  box-shadow: var(--glass-shadow);
  -webkit-backdrop-filter: blur(24px) saturate(108%);
  backdrop-filter: blur(24px) saturate(108%);
}
.glass-page :is(.mini-back, .top .tag, .idea-back) {
  display: inline-flex;
  align-items: center;
  padding: 8px 14px;
  border: 1px solid var(--glass-line);
  border-radius: 999px;
  color: var(--muted);
  background: rgba(255,255,255,.4);
  box-shadow: 0 5px 14px -8px rgba(78,67,46,.25), inset 0 1px 0 #fff;
  font-size: 11px;
}
.glass-page :is(.mini-back, .top .tag, .idea-back):hover { color: var(--blue); background: rgba(255,255,255,.72); }

/* Mini-program collection: keep the three photographic tiles. */
.mini-page { width: min(100%, 1280px); margin: 0 auto; padding: 26px 30px 60px; }
.showcase-intro { margin: 26px 0 34px; text-align: center; }
.showcase-intro small { display: block; color: var(--muted); font-size: 10px; letter-spacing: .22em; }
.showcase-intro h1 { margin: 9px 0 0; font-size: clamp(28px, 4vw, 42px); font-weight: 600; letter-spacing: .04em; }
.showcase-intro p { margin: 10px 0 0; color: var(--muted); font-size: 13px; }
.mini-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px; width: 100%; max-width: 900px; margin: 0 auto; }
.mini-card { display: block; height: 154px; padding: 0; border: 0; border-radius: 23px; background: transparent; box-shadow: 0 2px 3px rgba(87,76,58,.06), 5px 18px 30px -14px rgba(78,67,46,.3); transition: transform .25s, box-shadow .25s; }
.mini-visual { position: relative; display: flex; align-items: flex-end; width: 100%; height: 100%; padding: 16px 20px; overflow: hidden; border-radius: inherit; color: #fff; background-size: cover; background-position: center; }
.mini-visual.event { background-image: linear-gradient(180deg, rgba(20,18,16,.06), rgba(17,14,13,.65)), url("event-cover-v2.webp"); }
.mini-visual.food { background-image: linear-gradient(180deg, rgba(42,20,12,.04), rgba(35,17,11,.64)), url("food-cover-v2.webp"); }
.mini-visual.outdoor { background-image: linear-gradient(180deg, rgba(20,55,43,.04), rgba(12,43,35,.64)), url("outdoor-cover-v2.webp"); }
.mini-visual small { display: block; margin-bottom: 4px; font-size: 9px; letter-spacing: .19em; opacity: .9; }
.mini-visual strong { display: block; font-size: 22px; font-weight: 600; letter-spacing: .035em; line-height: 1.3; }
.mini-card-body { display: none; }

/* Six interaction entry cards, without the old dark backdrop or stars. */
.lottery-index .hero { padding: 26px 24px 8px; text-align: center; }
.lottery-index .hero h1 { margin: 0; color: var(--ink); font-size: clamp(30px, 4.2vw, 46px); font-weight: 600; line-height: 1.3; letter-spacing: .045em; }
.lottery-index .hero .sub { margin: 18px auto 0; color: var(--muted); font-size: 13px; line-height: 1.85; }
.lottery-index .grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; width: min(100%, 1040px); margin: 0 auto; padding: 30px 30px 46px; }
.lottery-index .card { display: flex; flex-direction: column; align-items: center; min-width: 0; min-height: 220px; gap: 11px; padding: 28px 24px 24px; border-radius: 24px; color: var(--ink); text-align: center; transition: transform .25s, box-shadow .25s; }
.lottery-index .card .icon { display: grid; place-items: center; flex-shrink: 0; width: 48px; height: 48px; margin-bottom: 4px; border: 1px solid rgba(255,255,255,.85); border-radius: 15px; background: rgba(255,255,255,.5); box-shadow: 0 6px 14px -9px rgba(78,67,46,.3), inset 0 1px 0 #fff; font-size: 27px; }
.lottery-index .card h3 { margin: 0; color: var(--ink); font-size: 17px; font-weight: 600; letter-spacing: .04em; }
.lottery-index .card p { margin: 0; color: var(--muted); font-size: 11.5px; line-height: 1.8; }
.lottery-index .card .go { margin-top: auto; padding-top: 3px; color: var(--blue); font-size: 10px; letter-spacing: .14em; }
.lottery-index footer { padding: 0 20px 6px; color: var(--muted); font-size: 10px; text-align: center; }
.lottery-index .beian { padding: 0 20px 32px; color: var(--muted); font-size: 9px; text-align: center; }

/* Existing AI generator: recolor its surfaces and controls, preserving the form and results. */
body.glass-page.idea-generator-page {
  --idea-ink: #202124;
  --idea-muted: #696a67;
  --idea-soft: #7d7d77;
  --idea-blue: #234baf;
  --idea-blue-dark: #234baf;
  --idea-sky: #e7ecf5;
  --idea-line: rgba(122,120,113,.19);
  --idea-glass: rgba(255,255,255,.4);
  --idea-glass-strong: rgba(255,255,255,.75);
  --idea-shadow: var(--glass-shadow);
  --idea-serif: var(--ui-font);
  --idea-sans: var(--ui-font);
}
.glass-page .idea-hero h1 { font-size: clamp(30px, 4.3vw, 56px); font-weight: 600; line-height: 1.25; letter-spacing: .015em; }
.glass-page .idea-hero h1 em { font-style: normal; }
.glass-page .idea-hero { padding-top: 38px; }
.glass-page .idea-hero-note { border-radius: 20px; }
.glass-page .brief-card, .glass-page .result-card { border-radius: 26px; }
.glass-page .output-card { border-radius: 18px; box-shadow: 0 7px 22px -15px rgba(78,67,46,.23), inset 0 1px 0 #fff; }
.glass-page .idea-field :is(input, textarea, select) { color: var(--idea-ink); border-color: var(--idea-line); background: rgba(255,255,255,.62); }
.glass-page .idea-field :is(input, textarea)::placeholder { color: #92938e; }
.glass-page .idea-field [aria-invalid="true"] { border-color: #c2413b; }
.glass-page .primary-btn { color: #fff; background: var(--blue); box-shadow: 0 10px 24px -13px rgba(35,75,175,.5), inset 0 1px 0 rgba(255,255,255,.25); }
.glass-page .primary-btn:hover { background: #1e429b; box-shadow: 0 14px 24px -13px rgba(35,75,175,.6); }
.glass-page .goal-chip[aria-pressed="true"] { color: #fff; background: var(--blue); }
.glass-page .empty-mark { color: var(--blue); background: var(--glass); box-shadow: var(--glass-shadow); }
.glass-page .prompt-box { color: var(--idea-ink); background: rgba(255,255,255,.45); border-color: var(--idea-line); }
.glass-page .prompt-copy { color: var(--blue); border-color: var(--idea-line); background: rgba(255,255,255,.7); }
.glass-page .idea-footer { color: var(--idea-muted); border-color: var(--idea-line); }

@media (hover: hover) and (pointer: fine) {
  .glass-page .card:hover { transform: translateY(-4px); box-shadow: 0 3px 4px rgba(87,76,58,.05), 5px 25px 38px -14px rgba(78,67,46,.26), inset 0 1px 1px #fff; }
  .glass-page .mini-card:hover { transform: translateY(-4px); box-shadow: 0 3px 4px rgba(87,76,58,.05), 5px 25px 38px -14px rgba(78,67,46,.32); }
}
@media (min-width: 901px) {
  .mini-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; max-width: 1180px; }
  .mini-card { height: auto; min-height: 220px; aspect-ratio: 4 / 3; }
  .mini-visual { padding: 18px; }
}
@media (max-width: 700px) {
  .mini-page { padding: 23px 20px 42px; }
  .showcase-intro { margin: 20px 0 25px; }
  .showcase-intro h1 { font-size: 28px; }
  .showcase-intro p { font-size: 11.5px; }
  .mini-grid { gap: 17px; }
  .mini-visual { padding: 14px; }
  .mini-visual strong { font-size: 19px; }
  .mini-visual small { font-size: 8px; }
  .lottery-index .hero { padding-top: 20px; }
  .lottery-index .hero h1 { font-size: 31px; }
  .lottery-index .hero .sub { margin-top: 14px; font-size: 12px; }
  .lottery-index .grid { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 16px; padding: 24px 20px 36px; }
  .lottery-index .card { min-height: 210px; padding: 20px 16px 18px; align-items: flex-start; text-align: left; gap: 9px; border-radius: 21px; }
  .lottery-index .card .icon { width: 39px; height: 39px; margin-bottom: 3px; border-radius: 12px; font-size: 22px; }
  .lottery-index .card h3 { font-size: 15px; }
  .lottery-index .card p { font-size: 10.5px; line-height: 1.7; }
  .lottery-index .card .go { font-size: 9px; }
  .glass-page .idea-hero h1 { font-size: clamp(29px, 7.4vw, 42px); }
  .glass-page .idea-hero { padding-top: 22px; }
  .glass-page .idea-back { padding: 7px 10px; font-size: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; scroll-behavior: auto !important; }
}