/* 내 AI 가이드 만들기(/tools/ai-guide/) — 빌드 결과(손으로 고치지 않는다). 원본 .codex-work/style-ab/src(page.css · views · site-reset · site) · 빌드 tools/build-site.mjs · 정본 README.
   모두 .aig 아래 · 애니메이션 이름 aig- · 색 · 모양은 검수판 그대로(11/4 대표 「검수판 그대로」 — 사이트 규칙과 다른 점은 .claude/rules/css.md 예외 줄). */
.aig * { box-sizing: border-box; }
.aig button { margin: 0; padding: 0; border: 0; border-radius: 0; background: none; color: inherit; font: inherit; line-height: inherit; letter-spacing: inherit;
  text-transform: none; text-align: inherit; box-shadow: none; text-shadow: none; cursor: pointer; }
.aig :where(button):hover,
.aig :where(button):focus,
.aig :where(button):active { background: none; color: inherit; }
.aig h1,
.aig h2,
.aig h3,
.aig h4 { font-family: inherit; font-weight: 700; line-height: 1.3; text-transform: none; letter-spacing: normal; }
.aig h1 { font-size: 2em; margin: .67em 0; }
.aig h2 { font-size: 1.5em; margin: .83em 0; }
.aig h3 { font-size: 1.17em; margin: 1em 0; }
.aig h4 { font-size: 1em; margin: 1.33em 0; }
.aig p,
.aig blockquote,
.aig figure { margin: 1em 0; }
.aig ul,
.aig ol { margin: 1em 0; padding-left: 40px; }
.aig li { margin: 0; }
.aig table { width: auto; margin: 0; border-collapse: separate; border-spacing: 2px; }
.aig th,
.aig td { padding: 1px; border: 0; }
.aig a { color: inherit; text-decoration: none; }
.aig img { height: auto; }
.aig input,
.aig textarea { margin: 0; box-shadow: none; }
.aig {
  --bg: #FFFFFF; --band: #F9FAFB; --sunk: #F2F4F6; --card: #FFFFFF;
  --ink: #191F28; --text: #333D4B; --sub: #4E5968; --muted: #6B7684; --faint: #8B95A1;
  --line: #E5E8EB; --line-2: #D1D6DB;
  --accent: #3182F6; --accent-deep: #1B64DA; --accent-ink: #FFFFFF; --accent-soft: #E8F3FF; --accent-line: #90C2FF;
  --warn: #B85C00; --warn-soft: #FFF4E5; --no: #E42939; --no-soft: #FFEEEE;
  --key-top: #FFFFFF; --key-edge: #D1D6DB;
  --shadow: 0 1px 2px rgba(0, 23, 51, .04), 0 4px 16px rgba(0, 23, 51, .06);
  --font: "PretendardAB", "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Malgun Gothic", system-ui, sans-serif;
  --seg-on: #FFFFFF; 
  --chart: #9AA7B6; --doc-red: #D92D20; 
  --r-card: 12px; --r-btn: 8px; color-scheme: light;
}
.aig[data-theme="dark"] {
  --bg: #17171C; --band: #1D1D23; --sunk: #2C2C35; --card: #202027;
  --ink: #F2F2F4; --text: #D6D6DB; --sub: #B5B5BC; --muted: #9E9EA6; --faint: #7E7E88;
  --line: #2E2E37; --line-2: #3D3D48;
  --accent: #4593FC; --accent-deep: #72ADFF; --accent-ink: #FFFFFF; --accent-soft: rgba(69, 147, 252, .16); --accent-line: rgba(69, 147, 252, .55);
  --warn: #FFB547; --warn-soft: rgba(255, 181, 71, .14); --no: #FF6B78; --no-soft: rgba(255, 107, 120, .14);
  --key-top: #2C2C35; --key-edge: #45454F; --seg-on: #45454F;
  --chart: #6F7E91; --doc-red: #FF6B6B;
  --shadow: 0 1px 2px rgba(0, 0, 0, .35), 0 6px 20px rgba(0, 0, 0, .3); color-scheme: dark;
}
.aig * { box-sizing: border-box; }
.aig { margin: 0; background: var(--bg); color: var(--text); font: 400 15px/1.6 var(--font); word-break: keep-all; overflow-wrap: anywhere;
  -webkit-font-smoothing: antialiased; font-feature-settings: "tnum" 0; }
.aig button,
.aig input,
.aig textarea { font: inherit; color: inherit; }
.aig button { cursor: pointer; }
.aig :focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.aig h1,
.aig h2,
.aig h3 { color: var(--ink); text-wrap: balance; }
.aig .gut { padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); }
.aig .wrap { max-width: 1280px; margin: 0 auto; }
.aig svg.ic { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.aig .btn[hidden],
.aig .warnbar[hidden] { display: none; }
.aig .top { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 6; background: var(--bg); border-bottom: 1px solid var(--line); padding-block: 10px; }
.aig .top .wrap { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; }
.aig .top h1 { margin: 0; font-size: 15px; font-weight: 700; display: flex; align-items: center; gap: 8px; }
.aig .top h1 small { font-weight: 400; color: var(--muted); font-size: 13px; }
.aig .tabs,
.aig .looks { display: flex; align-items: center; gap: 2px; background: var(--sunk); border-radius: 8px; padding: 3px; }
.aig .tabs button,
.aig .looks button { border: 0; background: transparent; padding: 5px 12px; border-radius: 6px; font-size: 13.5px; font-weight: 700; color: var(--muted); }
.aig .tabs button[aria-selected="true"],
.aig .looks button[aria-pressed="true"] { background: var(--seg-on); color: var(--ink); box-shadow: 0 1px 3px rgba(0, 0, 0, .1); }
.aig .looks > span { padding: 0 6px 0 8px; font-size: 12.5px; color: var(--muted); }
.aig .status { font-size: 12.5px; color: var(--muted); margin-left: auto; }
.aig .status.bad { color: var(--warn); font-weight: 700; }
.aig .warnbar { background: var(--warn-soft); color: var(--warn); border-bottom: 1px solid var(--line); font-weight: 700; font-size: 14px; padding-block: 10px; }
.aig.playing .top,
.aig.playing .warnbar { display: none; }
.aig .btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; border: 0; background: var(--sunk); color: var(--sub); border-radius: var(--r-btn);
  padding: 9px 14px; font-size: 14px; font-weight: 700; transition: background-color .12s; }
.aig .btn:hover { background: var(--line); }
.aig .btn.primary { background: var(--accent); color: var(--accent-ink); }
.aig .btn.primary:hover { background: var(--accent-deep); }
.aig .btn.ghost { background: transparent; color: var(--muted); }
.aig .btn.ghost:hover { background: var(--sunk); color: var(--ink); }
.aig .btn.sm { padding: 6px 10px; font-size: 13px; }
.aig .btn.lg { padding: 13px 24px; font-size: 16px; }
.aig .btn[disabled] { opacity: .4; cursor: default; }
.aig .kc { display: inline-grid; place-items: center; min-width: 26px; height: 26px; padding: 0 7px; border: 1px solid var(--line-2); border-bottom-width: 2px;
  border-radius: 6px; background: var(--key-top); color: var(--sub); font: 700 13px/1 var(--font); font-variant-numeric: tabular-nums; flex: none; }
.aig .kc.sm { min-width: 22px; height: 22px; padding: 0 5px; font-size: 12px; }
.aig .btn.primary .kc { background: rgba(255, 255, 255, .18); border-color: rgba(255, 255, 255, .45); color: #FFFFFF; }
.aig main { padding-block: 32px 88px; }
.aig .card { background: var(--card); border: 1px solid var(--line); border-radius: var(--r-card); }
.aig .eyebrow { margin: 0; font-size: 14px; font-weight: 700; color: var(--accent); }
.aig .start { min-height: calc(100vh - 220px); min-height: calc(100svh - 220px); display: grid; align-content: center; justify-items: center; text-align: center; padding-block: 16px 40px; }
.aig .start .eyebrow { font-size: 15px; }
.aig .start h2 { margin: 14px 0 0; font-size: clamp(40px, 6vw, 64px); line-height: 1.15; font-weight: 700; letter-spacing: -.035em; }
.aig .st-lead { margin: 20px 0 0; max-width: 32em; font-size: 18px; line-height: 1.65; color: var(--sub); text-wrap: balance; }
.aig .st-facts { list-style: none; margin: 28px 0 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.aig .st-facts li { display: inline-flex; align-items: center; gap: 4px; padding: 7px 14px; border-radius: var(--r-btn); background: var(--sunk); font-size: 14px; color: var(--sub); }
.aig .st-facts b { color: var(--ink); }
.aig .st-facts .kc { min-width: 22px; height: 22px; padding: 0 5px; font-size: 12px; }
.aig .st-go { margin-top: 36px; display: grid; justify-items: center; gap: 8px; }
.aig .btn.xl { min-width: 300px; padding: 17px 32px; font-size: 18px; border-radius: var(--r-card); }
.aig .btn.xl .st-prog { font-weight: 400; opacity: .85; font-variant-numeric: tabular-nums; }
.aig .st-hist { margin-top: 6px; }
.aig .st-facts .on-tap { display: none; }
.aig .st-art { --k: 1; position: relative; width: calc(180px * var(--k)); height: calc(144px * var(--k)); margin-bottom: 24px; }
.aig .st-art img { position: absolute; display: block; max-width: none; }
.aig .st-art .main { left: calc(10px * var(--k)); top: 0; width: calc(128px * var(--k)); height: calc(128px * var(--k)); animation: aig-rest-pop .5s cubic-bezier(.34, 1.56, .64, 1) both; }
.aig .st-art .lens { right: 0; bottom: 0; width: calc(84px * var(--k)); height: calc(84px * var(--k)); transform-origin: 72% 72%;
  animation: aig-rest-pop .5s cubic-bezier(.34, 1.56, .64, 1) .18s both, aig-st-search 4s ease-in-out .9s infinite; }
@keyframes aig-st-search { 0%, 52%, 100% { transform: none; } 14% { transform: translate(-14px, -8px) rotate(-8deg); } 32% { transform: translate(-3px, -18px) rotate(5deg); } }
.aig .st-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.aig .st-top .btn { margin-left: -10px; }
.aig .gate-note { display: flex; align-items: center; gap: 6px; margin: 10px 0 0; font-size: 13.5px; color: var(--sub); }
.aig .gate-note svg.ic { width: 15px; height: 15px; color: var(--accent); }
@media (hover: none) and (pointer: coarse) {
.aig .st-facts .on-key,
.aig .btn.xl .kc { display: none; }
.aig .st-facts .on-tap { display: inline; }
}
.aig .play { max-width: 1280px; margin: 0 auto; overflow-x: clip; overflow-clip-margin: 6px; }
.aig .pbar { height: 4px; background: var(--sunk); border-radius: 2px; overflow: hidden; }
.aig .pbar i { display: block; height: 100%; background: var(--accent); border-radius: 2px; transition: width .3s ease; }
.aig .ptop { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; margin-top: 14px; font-size: 14px; color: var(--muted); }
.aig .pexit { display: inline-flex; align-items: center; gap: 4px; border: 0; background: transparent; color: var(--muted); padding: 4px 6px; margin-left: -6px; border-radius: 6px; font-size: 14px; font-weight: 700; }
.aig .pexit:hover { color: var(--ink); background: var(--sunk); }
.aig .pcount { font-weight: 700; color: var(--ink); font-variant-numeric: tabular-nums; }
.aig .pcount i { font-style: normal; font-weight: 400; color: var(--faint); }
.aig .pcount em { font-style: normal; color: var(--accent); margin-right: 2px; }
.aig .pset { margin-left: auto; display: flex; align-items: center; gap: 8px; }
.aig .seg { display: inline-flex; gap: 2px; background: var(--sunk); border-radius: 8px; padding: 3px; }
.aig .seg button { border: 0; background: transparent; padding: 5px 12px; border-radius: 6px; font-size: 13.5px; font-weight: 700; color: var(--muted); }
.aig .seg button[aria-pressed="true"] { background: var(--seg-on); color: var(--ink); box-shadow: 0 1px 3px rgba(0, 0, 0, .1); }
.aig .seg.sm button { padding: 3px 9px; font-size: 12.5px; }
.aig .qhead { margin: 16px 0 14px; display: grid; gap: 6px; }
.aig .qtop { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; }
.aig .qlb { margin: 0; font-size: 14px; font-weight: 700; color: var(--accent); }
.aig .qt { margin: 0; font-size: clamp(22px, 2.4vw, 28px); line-height: 1.4; font-weight: 700; letter-spacing: -.02em; }
.aig .qfile { display: flex; }
.aig .pdiff { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 8px; margin: 0; padding: 3px 12px; border-radius: var(--r-btn); background: var(--accent-soft); font-size: 14px; line-height: 1.5; color: var(--sub); }
.aig .pdiff-k { font-size: 13px; font-weight: 700; color: var(--accent-deep); }
.aig .pdiff b { font-size: 15px; font-weight: 700; color: var(--ink); }
.aig .pfoot { display: flex; flex-wrap: wrap; gap: 10px 12px; align-items: center; margin-top: 14px; }
.aig .phint { font-size: 13.5px; color: var(--faint); }
.aig .pback { margin-left: auto; }
.aig .ans { font-size: 16px; line-height: 1.75; color: var(--text); }
.aig .md > :first-child { margin-top: 0; }
.aig .md > :last-child { margin-bottom: 0; }
.aig .md p { margin: 0 0 10px; }
.aig .md ul,
.aig .md ol { margin: 0 0 10px; padding-left: 22px; }
.aig .md li { margin: 3px 0; }
.aig .md strong { color: var(--ink); font-weight: 700; }
.aig .md-tw { overflow-x: auto; margin: 0 0 10px; }
.aig .md table { border-collapse: collapse; font-size: .92em; width: 100%; }
.aig .md th,
.aig .md td { border: 1px solid var(--line); padding: 6px 10px; text-align: left; vertical-align: top; }
.aig .md th { background: var(--band); color: var(--ink); font-weight: 700; }
.aig .md-file { display: inline-flex; align-items: center; gap: 6px; margin: 0 0 10px; padding: 6px 10px; border: 1px solid var(--line); border-radius: var(--r-btn); background: var(--band); font-size: 14px; color: var(--sub); }
.aig .md-file svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.aig .opt { position: relative; text-align: left; background: var(--card); border: 1px solid var(--line); border-radius: var(--r-card); cursor: pointer; min-width: 0;
  transition: border-color .12s, box-shadow .12s, background-color .12s, opacity .15s; }
.aig .opt:hover { border-color: var(--accent-line); box-shadow: var(--shadow); }
.aig .opt .oh { display: flex; align-items: center; gap: 10px; }
.aig .opt .olb { font-size: 17px; font-weight: 700; color: var(--ink); letter-spacing: -.01em; line-height: 1.35; }
.aig .opt[data-on="1"] { border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); }
.aig .opt[data-on="1"] .olb { color: var(--accent); }
.aig .opt[data-on="1"] .kc { background: var(--accent); border-color: var(--accent); color: #FFFFFF; }
.aig .opts.chose .opt:not([data-on="1"]) { opacity: .4; }
.aig .opts { display: grid; gap: 16px; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; }
.aig .opts.n2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.aig .opts .opt .oh { padding: 16px 20px; border-bottom: 1px solid var(--line); }
.aig .opts .opt .ans { padding: 18px 20px 22px; }
.aig .opt[data-on="1"] .oh { background: var(--accent-soft); border-radius: var(--r-card) var(--r-card) 0 0; }
.aig .ans.page { font-size: 13.5px; line-height: 1.65; color: var(--text); }
.aig .opts .opt .ans.page { padding: 20px 22px 24px; }
.aig .page .dt { margin: 0; padding-bottom: 8px; border-bottom: 2px solid var(--ink); text-align: center; font-size: 17px; line-height: 1.4; letter-spacing: -.01em; }
.aig .page .dm { margin: 6px 0 12px; text-align: right; font-size: 12px; color: var(--muted); }
.aig .page .ds { margin: 0 0 12px; padding: 9px 12px; border: 1px solid var(--line-2); border-radius: 4px; background: var(--band); }
.aig .page .ds p { margin: 1px 0; }
.aig .page .dh { margin: 12px 0 3px; font-size: 14px; line-height: 1.5; letter-spacing: 0; }
.aig .page .dl { display: flex; gap: 5px; margin: 2px 0; }
.aig .page .dk { flex: none; min-width: 1.5em; }
.aig .page .dp { margin: 2px 0; }
.aig .page .lv2 { padding-left: 12px; }
.aig .page .lv3 { padding-left: 30px; }
.aig .page .dn { margin: 12px 0 0; font-size: 12.5px; color: var(--muted); }
.aig .page .dr { color: var(--doc-red); font-weight: 700; }
.aig .page strong { color: var(--ink); font-weight: 700; }
.aig .page .md-tw { overflow-x: auto; margin: 4px 0 6px; }
.aig .page table { border-collapse: collapse; font-size: 12.5px; }
.aig .page th,
.aig .page td { border: 1px solid var(--line-2); padding: 4px 10px; text-align: center; white-space: nowrap; }
.aig .page th { background: var(--band); color: var(--ink); font-weight: 700; }
.aig .page table:not(:has(thead)) td:first-child { background: var(--band); color: var(--ink); font-weight: 700; }
.aig .page table:not(:has(thead)) td + td { text-align: left; white-space: normal; }
.aig .page .dc { margin: 6px 0 8px; }
.aig .page .dc figcaption { font-size: 12px; color: var(--muted); }
.aig .page .dc svg { display: block; width: 100%; max-width: 340px; height: auto; }
.aig .page .dc .cb { fill: var(--chart); }
.aig .page .dc text { fill: var(--sub); font-size: 11px; font-family: var(--font); }
.aig .page .dc .cv { fill: var(--ink); font-weight: 700; }
.aig .page .dc .cx { stroke: var(--line-2); stroke-width: 1; }
.aig .rest-in { max-width: 540px; margin: clamp(32px, 8vh, 80px) auto 0; display: grid; justify-items: center; gap: 10px; text-align: center; }
.aig .rest-art { position: relative; width: 112px; height: 112px; margin-bottom: 10px; }
.aig .rest-art img { display: block; width: 100%; height: 100%; }
.aig .rest-in h2 { margin: 0; font-size: 26px; line-height: 1.35; letter-spacing: -.02em; }
.aig .rest-sub { margin: 0; color: var(--sub); line-height: 1.7; text-wrap: balance; }
.aig .rest-sub b { color: var(--ink); }
.aig .rest-note { width: 100%; margin-top: 10px; padding: 18px 20px; display: grid; gap: 8px; justify-items: center; background: var(--band); border: 1px solid var(--line); border-radius: var(--r-card); }
.aig .rest-note h3 { margin: 0; display: inline-flex; align-items: center; gap: 6px; font-size: 16px; letter-spacing: -.01em; }
.aig .rest-note h3 svg.ic { width: 18px; height: 18px; color: var(--accent); }
.aig .rest-note p { margin: 0; font-size: 14.5px; line-height: 1.65; color: var(--sub); text-wrap: balance; }
.aig .rest-ax { list-style: none; margin: 4px 0 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; }
.aig .rest-ax li { padding: 4px 10px; border: 1px solid var(--line); border-radius: 6px; background: var(--card); font-size: 13px; font-weight: 700; color: var(--sub); }
.aig .rest-go { position: relative; isolation: isolate; overflow: hidden; margin-top: 18px; min-width: 260px; }
.aig .rest-go .fill { position: absolute; inset: 0; z-index: -1; background: rgba(0, 23, 51, .2); transform: scaleX(0); transform-origin: left center; }
.aig .rest.run .rest-go .fill { animation: aig-rest-fill var(--rest, 5s) linear forwards; }
.aig .rest.hold .rest-go .fill { animation-play-state: paused; }
.aig .rest-left { margin: 0; font-size: 13.5px; color: var(--faint); font-variant-numeric: tabular-nums; }
.aig .rest-left b { color: var(--sub); }
.aig .rest-more { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px; margin-top: 2px; }
.aig .rest-art.clap img { transform-origin: 55% 75%; animation: aig-rest-pop .5s cubic-bezier(.34, 1.56, .64, 1) both, aig-rest-clap .36s ease-in-out .5s 4; }
.aig .rest-art .sp { position: absolute; width: 5px; height: 13px; border-radius: 3px; background: var(--accent); opacity: 0; animation: aig-rest-spark .36s ease-out .6s 4; }
.aig .rest-art .sp:nth-of-type(1) { right: 4px; top: 4px; --r: 38deg; --dx: 5px; --dy: -5px; }
.aig .rest-art .sp:nth-of-type(2) { right: -8px; top: 22px; --r: 68deg; --dx: 7px; --dy: -2px; }
.aig .rest-art .sp:nth-of-type(3) { right: -12px; top: 44px; --r: 96deg; --dx: 8px; --dy: 1px; }
.aig .rest-art.look img { animation: aig-rest-pop .5s cubic-bezier(.34, 1.56, .64, 1) both, aig-rest-look 1.5s ease-in-out .5s 2; }
.aig .rest-note { animation: aig-rise .3s ease-out .45s both; }
@keyframes aig-rest-pop { from { opacity: 0; transform: scale(.5) rotate(-14deg); } to { opacity: 1; transform: none; } }
@keyframes aig-rest-clap { 0%, 100% { transform: none; } 38% { transform: rotate(-8deg) scale(.9); } 68% { transform: rotate(3deg) scale(1.04); } }
@keyframes aig-rest-spark { 0% { opacity: 0; transform: translate(0, 0) rotate(var(--r)) scaleY(.4); } 30% { opacity: 1; } 100% { opacity: 0; transform: translate(var(--dx), var(--dy)) rotate(var(--r)) scaleY(1); } }
@keyframes aig-rest-look { 0%, 100% { transform: none; } 25% { transform: translate(-8px, -2px) rotate(-7deg); } 75% { transform: translate(8px, 2px) rotate(6deg); } }
@keyframes aig-rest-fill { to { transform: scaleX(1); } }
.aig .res-head h2 { margin: 8px 0 8px; font-size: clamp(26px, 3vw, 34px); letter-spacing: -.025em; }
.aig .res-sum { margin: 0; color: var(--muted); font-size: 15px; }
.aig .res-grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 32px; align-items: start; }
.aig .res-l { display: grid; gap: 26px; min-width: 0; }
.aig .lvl { margin: 0 0 10px; font-size: 18px; display: flex; align-items: baseline; gap: 10px; letter-spacing: -.01em; }
.aig .lvl small { font-size: 13px; font-weight: 400; color: var(--muted); }
.aig .rules { display: grid; gap: 26px; }
.aig .rlist { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.aig .rule { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 4px 10px; padding: 13px 15px; border: 1px solid var(--line); border-radius: var(--r-card); background: var(--card); }
.aig .rule input[type="checkbox"] { width: 18px; height: 18px; margin: 3px 0 0; accent-color: var(--accent); }
.aig .rule textarea { width: 100%; min-width: 0; border: 1px solid transparent; border-radius: 6px; background: transparent; padding: 2px 6px; margin: 0 -6px; resize: none; line-height: 1.6; font-size: 15.5px; color: var(--ink); overflow: hidden; }
.aig .rule textarea:hover { border-color: var(--line); }
.aig .rule textarea:focus { border-color: var(--accent); background: var(--card); outline: none; }
.aig .rule .why { grid-column: 2; font-size: 13px; color: var(--muted); }
.aig .rule.off textarea { color: var(--faint); text-decoration: line-through; }
.aig .rule .edited { color: var(--accent); font-weight: 700; }
.aig .loose { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; font-size: 14px; color: var(--muted); }
.aig .loose b { color: var(--text); font-weight: 700; }
.aig .out { position: sticky; top: calc(env(safe-area-inset-top, 0px) + 68px); display: grid; gap: 10px; }
.aig .out .lvl { margin: 0; }
.aig .res-take { display: grid; justify-items: end; gap: 6px; }
.aig .res-take .acts { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; justify-content: flex-end; }
.aig .res-take .gate-note { margin: 0; }
.aig .out-doc { display: grid; gap: 10px; }
.aig .out-doc .cnt { margin-left: auto; font-size: 13px; font-weight: 400; color: var(--muted); }
.aig .outbox { max-height: 56vh; overflow: auto; padding: 22px 24px 26px; background: var(--card); border: 1px solid var(--line); border-radius: var(--r-card);
  font-size: 14.5px; line-height: 1.7; color: var(--text); }
.aig .doc h1 { margin: 0 0 12px; font-size: 22px; line-height: 1.35; letter-spacing: -.02em; }
.aig .doc h2 { margin: 24px 0 10px; padding-top: 16px; border-top: 1px solid var(--line); font-size: 17px; letter-spacing: -.01em; }
.aig .doc h3 { margin: 16px 0 4px; font-size: 15px; }
.aig .doc blockquote { margin: 0 0 4px; padding: 12px 14px; background: var(--band); border-radius: var(--r-btn); color: var(--sub); font-size: 14px; }
.aig .doc li { margin: 2px 0; }
.aig .doc hr { border: 0; border-top: 1px solid var(--line); margin: 18px 0; }
.aig .doc table { font-size: 13.5px; }
.aig .doc td:first-child { white-space: nowrap; }
.aig .out .help { margin: 0; font-size: 13.5px; line-height: 1.6; color: var(--muted); }
.aig .res-acts { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 32px; padding-top: 20px; border-top: 1px solid var(--line); align-items: center; }
.aig .empty { padding: 20px; background: var(--band); border-radius: var(--r-card); color: var(--muted); font-size: 14px; }
.aig .rv-intro { display: grid; gap: 10px; margin-bottom: 20px; }
.aig .rv-intro h2 { margin: 0; font-size: 24px; letter-spacing: -.02em; }
.aig .rv-intro p { margin: 0; color: var(--sub); font-size: 15px; max-width: 90ch; }
.aig .rv-intro textarea { width: 100%; min-height: 66px; border: 1px solid var(--line-2); border-radius: var(--r-btn); background: var(--card); padding: 9px 12px; font-size: 14px; resize: vertical; }
.aig .rv-count { font-size: 13.5px; color: var(--muted); }
.aig .rv-ax { margin-top: 30px; display: grid; gap: 12px; }
.aig .rv-ax > header { display: grid; gap: 8px; padding: 16px 18px; background: var(--band); border: 1px solid var(--line); border-radius: var(--r-card); }
.aig .rv-ax > header h3 { margin: 0; font-size: 18px; display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: baseline; }
.aig .rv-ax > header h3 small { font-size: 13px; color: var(--muted); font-weight: 400; }
.aig .rv-legend { margin: 0; padding: 0; list-style: none; display: grid; gap: 4px; font-size: 14px; color: var(--sub); }
.aig .rv-legend b { color: var(--ink); }
.aig .rv-q { padding: 16px 18px; display: grid; gap: 12px; }
.aig .rv-q .qh { display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: baseline; }
.aig .rv-q .qh b { font-size: 16px; color: var(--ink); }
.aig .rv-q .qh span { font-size: 12.5px; color: var(--faint); }
.aig .rv-q .rv-ask { margin: 0; font-size: 15px; color: var(--sub); }
.aig .rv-by summary { cursor: pointer; font-size: 14px; font-weight: 600; color: var(--sub); }
.aig .rv-by h4 { margin: 16px 0 4px; font-size: 14px; color: var(--ink); }
.aig .rv-by .opts { margin-top: 8px; }
.aig .rv-q .opts { gap: 10px; }
.aig .rv-q .opt { cursor: default; }
.aig .rv-q .opt:hover { border-color: var(--line); box-shadow: none; }
.aig .rv-q .opts .opt .oh { padding: 12px 16px; }
.aig .rv-q .opts .opt .ans { padding: 14px 16px 16px; font-size: 14.5px; }
.aig .rv-q .opt .olb { font-size: 15px; }
.aig .vrow { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.aig .vrow .note { flex: 1 1 260px; min-width: 0; border: 1px solid var(--line-2); border-radius: var(--r-btn); background: var(--card); padding: 7px 11px; font-size: 14px; }
.aig .vb { border: 1px solid var(--line-2); background: var(--card); border-radius: var(--r-btn); padding: 6px 13px; font-size: 13.5px; font-weight: 700; color: var(--sub); }
.aig .vb[aria-pressed="true"] { background: var(--accent); border-color: var(--accent); color: var(--accent-ink); }
.aig .vb.redo[aria-pressed="true"],
.aig .vb.drop[aria-pressed="true"] { background: var(--no-soft); border-color: var(--no); color: var(--no); }
.aig #copyBox { width: 100%; margin-top: 10px; min-height: 160px; font: 12.5px/1.5 ui-monospace, Consolas, monospace; border: 1px solid var(--line-2); border-radius: var(--r-btn); background: var(--card); padding: 8px 10px; }
.aig .play .qhead,
.aig .play .opts { animation: aig-rise .26s ease-out both; }
@keyframes aig-rise { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) {
.aig .play .qhead,
.aig .play .opts { animation: none; }
.aig .btn,
.aig .opt,
.aig .pbar i { transition: none; }
.aig .rest-art.clap img,
.aig .rest-art.look img,
.aig .rest-art .sp,
.aig .rest-note,
.aig .rest.run .rest-go .fill { animation: none; }
.aig .st-art .main,
.aig .st-art .lens { animation: none; }
}
@media (max-width: 960px) {
.aig .res-grid { grid-template-columns: minmax(0, 1fr); gap: 20px; }
.aig .res-l,
.aig .out { display: contents; }
.aig .res-head { order: 1; }
.aig .res-take { order: 2; justify-items: start; }
.aig .res-take .acts { justify-content: flex-start; }
.aig .rules { order: 3; }
.aig .out-doc { order: 4; }
}
@media (max-width: 760px) {
.aig .opts,
.aig .opts.n2 { grid-template-columns: minmax(0, 1fr); }
.aig .top { position: static; }
.aig .status { margin-left: 0; flex-basis: 100%; }
.aig .pset { display: none; }
.aig .phint { flex-basis: 100%; order: 3; }
.aig .qt { font-size: 21px; }
.aig .start h2 { font-size: 40px; }
.aig .st-lead { font-size: 16px; }
.aig .res-take { justify-items: stretch; }
.aig .res-take .acts .btn { flex: 1; }
.aig .st-go { width: 100%; }
.aig .btn.xl { width: 100%; min-width: 0; }
.aig .st-art { --k: .84; margin-bottom: 18px; }
.aig .rest-in { margin-top: 28px; }
.aig .rest-art { width: 96px; height: 96px; }
.aig .rest-in h2 { font-size: 22px; }
.aig .rest-go { width: 100%; min-width: 0; }
}
@media (min-width: 761px) and (max-height: 800px) {
.aig .st-art { --k: .78; margin-bottom: 14px; }
}
.aig .pf-steps { display: flex; flex-wrap: wrap; gap: 2px; margin: 0 0 0 auto; padding: 0; list-style: none; font-size: 13px; color: var(--faint); }
.aig .pf-steps + .pset { margin-left: 0; }
.aig .pf-steps li { padding: 3px 10px; border-radius: 6px; }
.aig .pf-steps li.was { color: var(--sub); }
.aig .pf-steps li.now { background: var(--accent-soft); color: var(--accent-deep); font-weight: 700; }
.aig .me-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 8px; }
.aig .me-grid.c2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.aig .me-c { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 52px; padding: 8px 12px 8px 14px; border: 1px solid var(--line); border-radius: var(--r-card); background: var(--card); color: var(--ink); text-align: left;
  transition: border-color .18s, background-color .18s, box-shadow .18s, transform .18s; }
.aig .me-c:hover { border-color: var(--line-2); box-shadow: 0 6px 16px rgba(0, 27, 55, .08); transform: translateY(-1px); }
.aig .me-c:active { box-shadow: none; transform: scale(.985); }
.aig .me-c:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.aig .me-c[aria-pressed="true"] { border-color: var(--accent-line); background: var(--accent-soft); box-shadow: none; }
.aig .dl-box { display: grid; flex: none; place-items: center; width: 22px; height: 22px; border: 2px solid var(--line-2); border-radius: 6px; color: transparent; }
.aig .dl-box svg.ic { width: 14px; height: 14px; stroke-width: 3; }
.aig .me-c .dl-box { border-width: 1.5px; }
.aig .me-c[aria-pressed="true"] .dl-box { border-color: var(--accent); background: var(--accent); color: #FFFFFF; }
.aig .me-c .kc { min-width: 22px; height: 22px; padding: 0 5px; border: 0; background: transparent; color: var(--faint); font-size: 12px; }
.aig .me-c:hover .kc { color: var(--muted); }
.aig .me-ic { display: grid; flex: none; place-items: center; width: 40px; height: 40px; border-radius: 10px; background: var(--sunk); color: var(--sub); transition: background-color .18s, color .18s; }
.aig .me-ic svg.ic { width: 20px; height: 20px; stroke-width: 1.75; }
.aig .me-c[aria-pressed="true"] .me-ic { background: var(--accent); color: #FFFFFF; }
.aig .me-t { display: grid; flex: 1; gap: 1px; min-width: 0; }
.aig .me-t b { font-size: 15px; font-weight: 600; line-height: 1.35; color: var(--ink); }
.aig .me-t small { font-size: 12.5px; line-height: 1.35; color: var(--muted); }
.aig .me-in { display: block; width: 100%; margin-top: 10px; padding: 12px 14px; border: 1px solid var(--line-2); border-radius: var(--r-card); background: var(--card); color: var(--ink); font: inherit; font-size: 15px; }
.aig .me-in::placeholder { color: var(--faint); }
.aig .me-in:focus { border-color: var(--accent); outline: none; }
.aig .me-no { color: var(--faint); }
.aig .me-line { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 13.5px; color: var(--sub); }
.aig .me-line svg.ic { color: var(--accent); }
.aig .me-line span { flex: 1; min-width: 0; }
.aig .play.me .qhead { margin-top: 26px; }
.aig .play.me .pfoot { margin-top: 18px; }
@keyframes aig-me-up { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.aig .me.go .qhead,
.aig .me.go .me-c,
.aig .me.go .me-in,
.aig .me.go .pfoot { animation: aig-me-up .46s cubic-bezier(.22, 1, .36, 1) backwards; animation-delay: calc(var(--i, 0) * 24ms); }
.aig .play.me .qhead { --i: 2; animation-name: aig-me-up; }
.aig .me .me-in,
.aig .me .pfoot { --i: 10; }
.aig .pf-bars { display: grid; gap: 4px; }
.aig .pf-bar { display: grid; grid-template-columns: 74px minmax(0, 1fr) 44px; align-items: center; gap: 10px; font-size: 14px; color: var(--sub); }
.aig .pf-bar i { display: block; height: 8px; overflow: hidden; border-radius: 4px; background: var(--sunk); }
.aig .pf-bar u { display: block; height: 100%; border-radius: 4px; background: var(--accent); text-decoration: none; }
.aig .pf-bar b { font-weight: 600; color: var(--ink); text-align: right; font-variant-numeric: tabular-nums; }
.aig .pf-miss { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 12px; margin: 0; padding: 10px 14px; border-radius: var(--r-card); background: var(--sunk); font-size: 14.5px; color: var(--sub); }
.aig .pf-miss b { color: var(--ink); }
.aig .pf-miss .btn { padding: 8px 14px; background: var(--card); color: var(--ink); font-size: 14px; font-weight: 600; box-shadow: inset 0 0 0 1px var(--line-2); }
.aig .pf-road { display: grid; gap: 4px; margin: 0; padding: 0 0 0 20px; font-size: 14.5px; color: var(--muted); }
.aig .pf-road li { padding-left: 2px; }
.aig .pf-road b { margin-right: 8px; font-weight: 600; color: var(--ink); }
.aig .pf-ans { border-top: 1px solid var(--line); padding-top: 12px; }
.aig .pf-ans summary { cursor: pointer; font-size: 15px; font-weight: 700; color: var(--ink); }
.aig .pf-ans h4 { margin: 14px 0 2px; font-size: 13.5px; font-weight: 700; color: var(--muted); }
.aig .pf-ans dl { margin: 0; }
.aig .pf-ans dl > div { display: grid; grid-template-columns: 120px minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 4px 0; }
.aig .pf-ans dt { font-size: 13.5px; color: var(--muted); }
.aig .pf-ans dd { margin: 0; font-size: 14.5px; line-height: 1.45; color: var(--ink); }
.aig .pf-ans .btn { padding: 3px 8px; font-size: 13px; }
@media (min-width: 761px) and (max-height: 780px) {
.aig .play.me .qhead { margin-top: 14px; margin-bottom: 8px; }
.aig .me-c { min-height: 44px; padding-block: 4px; }
.aig .me-ic { width: 34px; height: 34px; }
.aig .play.me .pfoot { margin-top: 10px; }
}
@media (max-width: 760px) {
.aig .pf-steps { display: none; }
.aig .me-grid,
.aig .me-grid.c2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.aig .me-c { gap: 9px; min-height: 48px; padding-inline: 10px 8px; }
.aig .me-ic { width: 32px; height: 32px; border-radius: 8px; }
.aig .me-ic svg.ic { width: 17px; height: 17px; }
.aig .pf-ans dl > div { grid-template-columns: minmax(0, 1fr) auto; }
.aig .pf-ans dt { grid-column: 1 / -1; margin-bottom: -6px; }
}
@media (prefers-reduced-motion: reduce) {
.aig .me.go .qhead,
.aig .me.go .me-c,
.aig .me.go .me-in,
.aig .me.go .pfoot { animation: none; }
.aig .me-c,
.aig .me-ic { transition: none; }
.aig .me-c:hover,
.aig .me-c:active { transform: none; }
}
.aig .opts .opt .ans.v-chart { padding: 14px 14px 16px; }
.aig .ans.v-chart { container-type: inline-size; }
.aig .v-chart .cf { background: #FFFFFF; border: 1px solid #DEDDD6; border-radius: 4px; padding: 14px 16px 12px; color: #0B0B0B; font-family: var(--font); word-break: keep-all; }
.aig .v-chart .ct { margin: 0; font-size: 15px; line-height: 1.45; font-weight: 700; color: #0B0B0B; letter-spacing: -.01em; }
.aig .v-chart .cu { margin: 2px 0 0; font-size: 12px; line-height: 1.4; color: #6B6A65; }
.aig .v-chart .lg { display: flex; flex-wrap: wrap; gap: 4px 16px; margin: 10px 0 0; font-size: 12.5px; line-height: 1.4; color: #52514E; }
.aig .v-chart .lg span { display: inline-flex; align-items: center; gap: 6px; }
.aig .v-chart .lg svg { display: block; width: 22px; height: 10px; }
.aig .v-chart svg.cw,
.aig .v-chart svg.cn { display: block; width: 100%; height: auto; margin-top: 6px; overflow: visible; }
.aig .v-chart svg.cn { display: none; }
.aig .v-chart svg text { font-family: var(--font); font-size: 12px; fill: #52514E; }
.aig .v-chart svg .ck { fill: #7A7974; font-variant-numeric: tabular-nums; }
.aig .v-chart svg .cv { fill: #0B0B0B; }
.aig .v-chart svg .cd { fill: #0B0B0B; font-weight: 700; }
.aig .v-chart svg .cp { font-weight: 700; }
.aig .v-chart .cg { stroke: #E1E0D9; stroke-width: 1; }
.aig .v-chart .ca { stroke: #C3C2B7; stroke-width: 1; }
.aig .v-chart .cl { fill: none; stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.aig .v-chart .cm { stroke: #FFFFFF; stroke-width: 2; }
.aig .v-chart .cs { stroke: #FFFFFF; stroke-width: 2; stroke-linejoin: round; }
@container (max-width: 470px) {
.aig .v-chart svg.cw { display: none; }
.aig .v-chart svg.cn { display: block; }
.aig .v-chart .cf { padding: 12px 12px 10px; }
.aig .v-chart .ct { font-size: 14px; }
}
.aig .opts .opt .ans.v-mail { padding: 14px 18px 20px; }
.aig .v-mail .ml-h { display: grid; gap: 5px; padding-bottom: 12px; border-bottom: 1px solid var(--line); font-size: 13px; line-height: 1.5; }
.aig .v-mail .ml-r { display: grid; grid-template-columns: 4.6em minmax(0, 1fr); gap: 8px; align-items: baseline; }
.aig .v-mail .ml-k { color: var(--muted); }
.aig .v-mail .ml-v { min-width: 0; color: var(--text); }
.aig .v-mail .ml-s .ml-v { color: var(--ink); font-size: 15px; font-weight: 700; line-height: 1.45; letter-spacing: -.01em; }
.aig .v-mail .ml-a .ml-v { display: flex; flex-wrap: wrap; gap: 4px 6px; }
.aig .v-mail .ml-file { display: inline-flex; align-items: center; gap: 5px; padding: 2px 8px; border: 1px solid var(--line); border-radius: 6px; background: var(--band); color: var(--sub); font-size: 12.5px; max-width: 100%; }
.aig .v-mail .ml-file span { overflow-wrap: anywhere; }
.aig .v-mail .ml-file svg { width: 13px; height: 13px; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.aig .v-mail .ml-b { padding-top: 14px; font-size: 14.5px; line-height: 1.75; color: var(--text); }
.aig .v-mail .ml-p { margin: 0 0 14px; }
.aig .v-mail .ml-n { display: flex; gap: 4px; }
.aig .v-mail .ml-nk { flex: none; min-width: 1.1em; }
.aig .v-mail .nw { white-space: nowrap; }
.aig .v-mail .ml-sig.ml-blk b { color: var(--ink); font-weight: 700; }
.aig .v-mail .mc-h { display: flex; align-items: center; gap: 8px; padding-bottom: 10px; border-bottom: 1px solid var(--line); font-size: 14px; line-height: 1.4; }
.aig .v-mail .mc-h b { color: var(--ink); font-weight: 700; }
.aig .v-mail .mc-h > span:last-child { color: var(--muted); font-size: 12.5px; }
.aig .v-mail .mc-av { display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--sunk); color: var(--sub); font-size: 12.5px; font-weight: 700; flex: none; }
.aig .v-mail .mc-day { margin: 14px 0 6px; text-align: center; font-size: 12px; color: var(--muted); }
.aig .v-mail .mc-g { display: grid; gap: 5px; }
.aig .v-mail .mc-m { display: flex; justify-content: flex-end; align-items: flex-end; gap: 6px; }
.aig .v-mail .mc-b { max-width: 84%; padding: 8px 12px; border-radius: 12px; background: var(--sunk); color: var(--ink); font-size: 14.5px; line-height: 1.6; white-space: pre-line; }
.aig .v-mail .mc-t { flex: none; padding-bottom: 2px; font-size: 11.5px; color: var(--faint); }
@media (max-width: 760px) {
.aig .opts .opt .ans.v-mail { padding: 12px 14px 16px; }
.aig .v-mail .ml-b,
.aig .v-mail .mc-b { font-size: 14px; }
}
.aig .opts .opt .ans.v-sheet { padding: 14px 14px 16px; }
.aig .ans.v-sheet { container-type: inline-size; }
.aig .v-sheet .xs { background: #FFFFFF; border: 1px solid #C6C6C6; border-radius: 2px; overflow: hidden; color: #1F1F1F;
  font: 400 12.5px/1.2 "Malgun Gothic", "맑은 고딕", "Apple SD Gothic Neo", "Noto Sans KR", sans-serif; letter-spacing: 0; word-break: normal; overflow-wrap: normal; }
.aig .v-sheet .xs { font-size: clamp(10px, calc((100cqw - 4px) / var(--tw, 34)), 12.5px); }
.aig .v-sheet .xw { overflow-x: auto; overscroll-behavior-x: contain; }
.aig .v-sheet table { width: 100%; border-collapse: separate; border-spacing: 0; table-layout: auto; margin: 0; }
.aig .v-sheet col.xn { width: 2.5em; }
.aig .v-sheet th,
.aig .v-sheet td { height: 1.95em; padding: 0 .48em; white-space: nowrap; text-align: left; vertical-align: middle; font-weight: 400;
  border: 0; border-right: 1px solid #E1E1E1; border-bottom: 1px solid #E1E1E1; }
.aig .v-sheet thead th { height: 1.65em; padding: 0 .3em; background: #F3F3F3; color: #4D4D4D; font-size: .84em; text-align: center; border-right-color: #D4D4D4; border-bottom-color: #C6C6C6; }
.aig .v-sheet tbody th { padding: 0 .3em; background: #F3F3F3; color: #4D4D4D; font-size: .84em; text-align: center; border-right-color: #C6C6C6; border-bottom-color: #D4D4D4; }
.aig .v-sheet th.xe span { display: inline-block; min-width: 2.6em; }
.aig .v-sheet .xz { position: relative; }
.aig .v-sheet .xz::after { content: ""; position: absolute; right: 3px; bottom: 3px; width: 0; height: 0; border-style: solid; border-width: 0 0 7px 7px; border-color: transparent transparent #B9B9B9 transparent; }
.aig .v-sheet td.l { text-align: left; }
.aig .v-sheet td.c { text-align: center; }
.aig .v-sheet td.r { text-align: right; }
.aig .v-sheet td.ttl { font-size: 1.1em; font-weight: 700; color: #1A1A1A; }
.aig .v-sheet td.nt { text-align: right; font-size: .92em; color: #404040; }
.aig .v-sheet td.hd { font-weight: 700; color: #1A1A1A; }
.aig .v-sheet .hd-dark td.hd { color: #FFFFFF; }
.aig .v-sheet td.sm { font-weight: 700; }
.aig .v-sheet td.up { color: #C00000; }
.aig .v-sheet td.dn { color: #0070C0; }
.aig .v-sheet td.bad { color: #9C0006; }
.aig .v-sheet .pd { visibility: hidden; }
.aig .v-sheet td.xb { position: relative; }
.aig .v-sheet td.xb i { position: absolute; left: 2px; top: 3px; bottom: 3px; background: #8EA9DB; }
.aig .v-sheet td.xb span { position: relative; }
.aig .v-sheet .xtab { display: flex; align-items: stretch; height: 2.15em; background: #F3F3F3; border-top: 1px solid #C6C6C6; font-size: .9em; color: #4D4D4D; }
.aig .v-sheet .xtab b { display: flex; align-items: center; margin-left: 1.4em; padding: 0 1.1em; background: #FFFFFF; color: #217346; font-weight: 700; box-shadow: inset 0 -2px #217346; }
.aig .v-sheet .xtab i { display: flex; align-items: center; padding: 0 .7em; color: #6E6E6E; }
.aig .v-sheet .xtab svg { width: 1.15em; height: 1.15em; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }
@container (max-width: 400px) {
.aig .v-sheet .xs { font-size: clamp(10px, calc((100cqw - 4px) / var(--tn, 31)), 12.5px); }
.aig .v-sheet .xo { display: none; }
.aig .v-sheet th.xe span { min-width: 1.6em; }
}
.aig .opts .opt .ans.v-slide { padding: 12px; }
.aig .v-slide { container-type: inline-size; }
.aig .v-slide .sl {
  --s-bg: #FFFFFF; --s-ink: #1B2230; --s-sub: #586375; --s-line: #DCE1E8; --s-soft: #EDF2FA; --s-acc: #2563C9;
  --s-a1: var(--s-acc); --s-a2: var(--s-acc); --s-a3: var(--s-acc);
  display: flex; flex-direction: column; aspect-ratio: 16 / 9; overflow: hidden;
  padding: 5.4cqw 6.4cqw 4.8cqw; border: 1px solid #D5DAE1;
  background: var(--s-bg); color: var(--s-ink); font-size: 2.4cqw; line-height: 1.45; letter-spacing: -.01em; text-align: left;
  word-break: keep-all; overflow-wrap: break-word;
}
.aig .v-slide .sl.b-dark { --s-bg: #1C2129; --s-ink: #F3F5F8; --s-sub: #AAB3C0; --s-line: #39414F; --s-soft: #272E39; --s-acc: #7FA8F2; }
.aig .v-slide .sl.b-color { --s-bg: #1F4F94; --s-ink: #FFFFFF; --s-sub: #CCD9EE; --s-line: #4A73AE; --s-soft: #2B5DA5; --s-acc: #A9C7F7; }
.aig .v-slide .sl.c-mono { --s-acc: var(--s-ink); }
.aig .v-slide .sl.b-white.c-mono { --s-soft: #F0F2F5; }
.aig .v-slide .sl.c-multi { --s-a1: #2563C9; --s-a2: #0E8A7D; --s-a3: #D9781A; }
.aig .v-slide .sl-head { flex: none; }
.aig .v-slide .sl-t { margin: 0; font-size: 4.2cqw; line-height: 1.3; font-weight: 700; letter-spacing: -.03em; color: var(--s-ink); text-wrap: balance; }
.aig .v-slide .sl.t-center .sl-t { text-align: center; }
.aig .v-slide .sl.r-line .sl-head { padding-bottom: 1.5cqw; border-bottom: .28cqw solid var(--s-acc); }
.aig .v-slide .sl-body { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; justify-content: center; justify-content: safe center; margin-top: 2.6cqw; }
.aig .v-slide .sl.has-sum .sl-body { margin-bottom: 2.4cqw; }
.aig .v-slide .sl-list { display: grid; gap: 2.8cqw; }
.aig .v-slide .sl-i { display: grid; grid-template-columns: 5.6cqw minmax(0, 1fr); align-items: start; }
.aig .v-slide .sl-m { display: flex; align-items: center; height: 4cqw; color: var(--s-acc); font-size: 2.8cqw; line-height: 1; font-weight: 700; font-variant-numeric: tabular-nums; letter-spacing: 0; }
.aig .v-slide .sl-i.i1 .sl-m { color: var(--s-a1); }
.aig .v-slide .sl-i.i2 .sl-m { color: var(--s-a2); }
.aig .v-slide .sl-i.i3 .sl-m { color: var(--s-a3); }
.aig .v-slide .sl-dot { display: block; width: 1.3cqw; height: 1.3cqw; border-radius: 50%; background: currentColor; }
.aig .v-slide .sl-ic { display: block; width: 3.5cqw; height: 3.5cqw; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.aig .v-slide .sl-k { display: block; font-size: 2.95cqw; line-height: 1.36; font-weight: 700; color: var(--s-ink); }
.aig .v-slide .sl-s { display: block; margin-top: .4cqw; font-size: 2.45cqw; line-height: 1.5; color: var(--s-sub); }
.aig .v-slide .sl.l-cols .sl-list { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 3.4cqw; }
.aig .v-slide .sl.l-cols .sl-i { grid-template-columns: minmax(0, 1fr); row-gap: 1cqw; padding-top: 2.2cqw; border-top: 1px solid var(--s-line); }
.aig .v-slide .sl.l-side { display: grid; grid-template-columns: 30cqw minmax(0, 1fr); grid-template-rows: minmax(0, 1fr) auto; align-items: center; }
.aig .v-slide .sl.l-side .sl-head { align-self: stretch; display: flex; align-items: center; padding-right: 4cqw; border-right: 1px solid var(--s-line); }
.aig .v-slide .sl.l-side .sl-body { margin: 0; padding-left: 4.6cqw; }
.aig .v-slide .sl.l-side .sl-sum { grid-column: 1 / -1; }
.aig .v-slide .sl.k-fill .sl-list,
.aig .v-slide .sl.k-line .sl-list { gap: 2cqw; }
.aig .v-slide .sl.k-fill .sl-i,
.aig .v-slide .sl.k-line .sl-i { padding: 2.2cqw 2.2cqw 2.4cqw; border-radius: .7cqw; }
.aig .v-slide .sl.k-fill .sl-i { border-top: 0; background: var(--s-soft); }
.aig .v-slide .sl.k-line .sl-i { border: 1px solid var(--s-line); }
.aig .v-slide .sl-sum { margin: auto 0 0; padding: 1.5cqw 2.2cqw; border-radius: .5cqw; background: var(--s-soft); color: var(--s-ink); font-size: 2.4cqw; line-height: 1.4; font-weight: 700; }
.aig .v-slide .sl-sum::before { content: "→ "; color: var(--s-acc); }
.aig .opts .opt .ans.v-web { padding: 12px; }
.aig .v-web { container-type: inline-size; }
.aig .v-web .wf {
  --w-bg: #FFFFFF; --w-ink: #111827; --w-sub: #4B5563; --w-mute: #6B7280; --w-line: #E5E7EB; --w-fill: #F3F4F6; --w-band: #F7F8FA; --w-surface: #FFFFFF;
  --w-ph: #D9DEE5; --w-ph2: #ECEFF3; --w-acc: #2F5BD3; --w-on: #FFFFFF;
  --w-a1: var(--w-acc); --w-a2: var(--w-acc); --w-a3: var(--w-acc);
  --rb: .55cqw; --rc: .9cqw;
  --nav-h: 5.6cqw; --px: 5.6cqw; --hero-pt: 4.4cqw; --hero-pb: 4cqw; --g1: 1.2cqw; --g2: 1.7cqw; --g3: 2.6cqw; --cg: 2cqw; --cp: 2.1cqw; --more-pt: 4cqw; --pb: 3cqw;
  display: flex; flex-direction: column; aspect-ratio: 16 / 10; overflow: hidden; border: 1px solid #D5DAE1;
  background: var(--w-bg); color: var(--w-ink); font-size: 1.6cqw; line-height: 1.5; letter-spacing: -.01em; text-align: left;
  word-break: keep-all; overflow-wrap: break-word;
}
.aig .v-web .wf.t-dark { --w-bg: #0F1217; --w-ink: #F2F4F7; --w-sub: #A9B0BB; --w-mute: #8A929E; --w-line: #272D36; --w-fill: #181C23; --w-band: #13161C; --w-surface: #151920;
  --w-ph: #2E343E; --w-ph2: #20252D; --w-acc: #5B8BF7; }
.aig .v-web .wf.o-calm { --w-acc: #5A6F90; }
.aig .v-web .wf.o-vivid { --w-acc: #0B57FF; }
.aig .v-web .wf.t-dark.o-calm { --w-acc: #8FA2C2; }
.aig .v-web .wf.t-dark.o-vivid { --w-acc: #3D7BFF; }
.aig .v-web .wf.c-mono { --w-acc: var(--w-ink); }
.aig .v-web .wf.t-dark.c-mono { --w-on: #111827; }
.aig .v-web .wf.c-multi { --w-a2: #12915A; --w-a3: #E0701A; }
.aig .v-web .wf.r-sharp { --rb: 0px; --rc: 0px; }
.aig .v-web .wf.r-round { --rb: 999px; --rc: 2.2cqw; }
.aig .v-web .wf.s-dense { --nav-h: 4.2cqw; --px: 3.4cqw; --hero-pt: 2.8cqw; --hero-pb: 2.2cqw; --g1: .6cqw; --g2: .9cqw; --g3: 1.5cqw; --cg: 1.1cqw; --cp: 1.3cqw; --more-pt: 2.2cqw; --pb: 0px; }
.aig .v-web .wf-bar { flex: none; display: flex; align-items: center; gap: .7cqw; height: 2.6cqw; padding: 0 1.4cqw; background: #E9ECF0; border-bottom: 1px solid #D5DAE1; }
.aig .v-web .wf-bar i { flex: none; width: .9cqw; height: .9cqw; border-radius: 50%; background: #C4C9D1; }
.aig .v-web .wf-bar span { width: 32cqw; height: 1.5cqw; margin: 0 auto; border-radius: .75cqw; background: #FFFFFF; }
.aig .v-web .wf-page { flex: 1 1 auto; min-height: 0; overflow: hidden; display: grid; grid-template-rows: auto 1fr auto 0; padding: 0 var(--px) var(--pb); background: var(--w-bg); }
.aig .v-web .wf.s-dense .wf-page { grid-template-rows: auto auto auto 1fr; }
.aig .v-web .wf-nav { display: flex; align-items: center; gap: 2.2cqw; height: var(--nav-h); margin: 0 calc(-1 * var(--px)); padding: 0 var(--px); border-bottom: 1px solid var(--w-line); }
.aig .v-web .wf-logo { display: flex; align-items: center; gap: .8cqw; font-size: 1.7cqw; font-weight: 700; color: var(--w-ink); white-space: nowrap; }
.aig .v-web .wf-logo b { display: grid; place-items: center; width: 2.3cqw; height: 2.3cqw; border-radius: .5cqw; background: var(--w-acc); color: var(--w-on); font-size: 1.25cqw; line-height: 1; }
.aig .v-web .wf-menu { display: flex; gap: 2.2cqw; margin-left: auto; font-size: 1.5cqw; color: var(--w-sub); white-space: nowrap; }
.aig .v-web .wf-btn { display: inline-flex; align-items: center; justify-content: center; padding: .95cqw 2.1cqw; border: max(1px, .13cqw) solid var(--w-acc); border-radius: var(--rb);
  background: var(--w-acc); color: var(--w-on); font-size: 1.6cqw; line-height: 1.3; font-weight: 700; white-space: nowrap; }
.aig .v-web .wf-btn.sm { padding: .55cqw 1.2cqw; font-size: 1.4cqw; }
.aig .v-web .wf-hero { display: grid; grid-template-columns: 52cqw minmax(0, 1fr); column-gap: 4cqw; align-items: center; padding: var(--hero-pt) 0 var(--hero-pb); }
.aig .v-web .wf-eye { margin: 0 0 var(--g1); font-size: 1.55cqw; line-height: 1.4; font-weight: 700; color: var(--w-acc); }
.aig .v-web .wf-h { margin: 0 0 var(--g2); font-size: 4cqw; line-height: 1.22; font-weight: 700; letter-spacing: -.035em; color: var(--w-ink); text-wrap: balance; }
.aig .v-web .wf-sub { margin: 0 0 var(--g3); font-size: 1.75cqw; line-height: 1.6; color: var(--w-sub); }
.aig .v-web .wf-art { border: 1px solid var(--w-line); border-radius: var(--rc); background: var(--w-surface); overflow: hidden; }
.aig .v-web .wf-art svg { display: block; width: 100%; height: auto; font-family: inherit; }
.aig .v-web .wf-art .g { fill: var(--w-ph); }
.aig .v-web .wf-art .g2 { fill: var(--w-ph2); }
.aig .v-web .wf-art .tile { fill: var(--w-fill); }
.aig .v-web .wf-art .a { fill: var(--w-acc); }
.aig .v-web .wf-art .at { fill: color-mix(in srgb, var(--w-acc) 15%, var(--w-surface)); }
.aig .v-web .wf-art .ao { fill: color-mix(in srgb, var(--w-acc) 9%, var(--w-surface)); stroke: var(--w-acc); stroke-width: 1.5; }
.aig .v-web .wf-art .tx { fill: var(--w-ink); }
.aig .v-web .wf-art .mu { fill: var(--w-mute); }
.aig .v-web .wf-art .ac { fill: var(--w-acc); }
.aig .v-web .wf-art .on { fill: var(--w-on); }
.aig .v-web .wf-art .b { font-weight: 700; }
.aig .v-web .wf-art .ln { stroke: var(--w-line); stroke-width: 1.5; }
.aig .v-web .wf-art .ar { fill: none; stroke: var(--w-mute); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.aig .v-web .wf-art .as1,
.aig .v-web .wf-art .as2 { fill: none; stroke: var(--w-acc); stroke-linecap: round; stroke-linejoin: round; }
.aig .v-web .wf-art .as1 { stroke-width: 1.4; }
.aig .v-web .wf-art .as2 { stroke-width: 3; }
.aig .v-web .wf-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--cg); }
.aig .v-web .wf-card { display: grid; align-content: start; gap: .45cqw; padding: var(--cp); border: 1px solid var(--w-line); border-radius: var(--rc); background: var(--w-bg); }
.aig .v-web .wf-ic { display: block; width: 2.5cqw; height: 2.5cqw; margin-bottom: .5cqw; fill: none; stroke: var(--w-a1); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.aig .v-web .wf-card.i2 .wf-ic { stroke: var(--w-a2); }
.aig .v-web .wf-card.i3 .wf-ic { stroke: var(--w-a3); }
.aig .v-web .wf-ct { font-size: 1.7cqw; line-height: 1.35; font-weight: 700; color: var(--w-ink); }
.aig .v-web .wf-cd { font-size: 1.5cqw; line-height: 1.45; color: var(--w-sub); }
.aig .v-web .wf.e-shadow .wf-card { border-color: transparent; box-shadow: 0 .3cqw 1.4cqw rgba(15, 23, 42, .11); }
.aig .v-web .wf.t-dark.e-shadow .wf-card { background: var(--w-surface); box-shadow: 0 .3cqw 1.4cqw rgba(0, 0, 0, .6); }
.aig .v-web .wf.e-fill .wf-card { border-color: transparent; background: var(--w-fill); }
.aig .v-web .wf.l-list .wf-cards { grid-template-columns: minmax(0, 1fr); gap: 0; border-top: 1px solid var(--w-line); }
.aig .v-web .wf.l-list .wf-card { display: flex; align-items: center; gap: 1.4cqw; padding: 1cqw 0; border: 0; border-bottom: 1px solid var(--w-line); border-radius: 0; background: none; box-shadow: none; }
.aig .v-web .wf.l-list .wf-ic { flex: none; margin: 0; }
.aig .v-web .wf.l-list .wf-ct { flex: none; width: 15cqw; }
.aig .v-web .wf.l-list .wf-cd { flex: 1 1 auto; min-width: 0; }
.aig .v-web .wf.a-center .wf-hero { grid-template-columns: minmax(0, 1fr); justify-items: center; text-align: center; }
.aig .v-web .wf.a-center .wf-copy { width: 52cqw; }
.aig .v-web .wf.a-center .wf-card { justify-items: center; text-align: center; }
.aig .v-web .wf-more { margin: var(--more-pt) calc(-1 * var(--px)) 0; padding: 2cqw var(--px) 3cqw; border-top: 1px solid var(--w-line); background: var(--w-band); }
.aig .v-web .wf-mt { margin: 0 0 .9cqw; font-size: 1.7cqw; line-height: 1.4; font-weight: 700; color: var(--w-ink); }
.aig .v-web .wf-mr { margin: 0; padding: .7cqw 0; border-top: 1px solid var(--w-line); font-size: 1.5cqw; line-height: 1.45; color: var(--w-sub); }
.aig { min-height: 72vh; }
.aig .aig-app { max-width: 1200px; margin: 0 auto; padding: 24px 30px 88px; }
.aig .aig-loading { margin: 48px 0; text-align: center; color: var(--muted); }
.aig .start { min-height: 0; padding-block: 24px 40px; }
@media (max-width: 760px) {
.aig .aig-app { padding: 16px 16px 64px; }
}
@media (min-width: 1025px) {
body.aig-page.pcf-on .otl-band:not(.otl-band--full) { --otl-band-max: var(--pcf-w); --otl-band-gut: 0px; }
body.aig-page.pcf-on .aig-app { max-width: var(--pcf-w); padding-inline: 0; }
}
body.aig-page .aigt { display: none; }
@media (min-width: 1025px) {
body.aig-page.aig-full.pcf-on .pcf-r1,
body.aig-page.aig-full.pcf-on .pcf-r2,
body.aig-page.aig-full.pcf-on .pcf-sub,
body.aig-page.aig-full.pcf-on #oppadu-top-banner,
body.aig-page.aig-full.pcf-on .otl-band { display: none; }
body.aig-page.aig-full.pcf-on { --pcf-r1-h: 0px; --nav-height: 0px; --pcf-sub-h: 0px; }
body.aig-page.aig-full.pcf-on .aigt { display: block; position: sticky; top: var(--pcf-ab-h, 0px); z-index: 30; box-sizing: border-box; height: 56px;
    border-bottom: 1px solid var(--gray-200, #E9E9E9); background: var(--surface-white, #FFFFFF); }
body.aig-page.aig-full.pcf-on .aigt-in { position: relative; display: flex; align-items: center; gap: 12px; height: 100%; padding: 0 20px 0 12px; }
body.aig-page.aig-full.pcf-on .aigt-back { display: inline-flex; flex: none; align-items: center; gap: 4px; height: 36px; padding: 0 10px 0 4px; border-radius: 6px;
    color: var(--gray-900, #181818); font-size: 15px; font-weight: 600; text-decoration: none; }
body.aig-page.aig-full.pcf-on .aigt-back:hover { background: var(--gray-100, #F4F4F4); color: var(--gray-900, #181818); }
body.aig-page.aig-full.pcf-on .aigt-back:focus-visible { outline: 2px solid var(--primary, #037450); outline-offset: 0; }
body.aig-page.aig-full.pcf-on .aigt-back svg { display: block; width: 20px; height: 20px; }
body.aig-page.aig-full.pcf-on .aigt-sep { flex: none; width: 1px; height: 16px; background: var(--gray-300, #D4D4D4); }
body.aig-page.aig-full.pcf-on .aigt-name { display: flex; align-items: center; gap: 8px; margin: 0; color: var(--gray-600, #555555); font-size: 15px; font-weight: 400; line-height: 1.4; white-space: nowrap; }
body.aig-page.aig-full.pcf-on .aigt-c { color: var(--gray-500, #727272); text-decoration: none; }
body.aig-page.aig-full.pcf-on a.aigt-c:hover { color: var(--gray-900, #181818); text-decoration: underline; }
body.aig-page.aig-full.pcf-on a.aigt-c:focus-visible { outline: 2px solid var(--primary, #037450); outline-offset: 2px; }
body.aig-page.aig-full.pcf-on .aigt-c.on { color: var(--gray-900, #181818); }
body.aig-page.aig-full.pcf-on .aigt-s { color: var(--gray-400, #A2A2A2); }
body.aig-page.aig-full.pcf-on .aigt-sp { flex: 1; }
body.aig-page.aig-full.pcf-on .otl { min-height: calc(100vh - var(--pcf-ab-h, 0px)); }
body.aig-page.aig-full.pcf-on .aig { min-height: calc(100vh - 56px - var(--pcf-ab-h, 0px)); }
body.aig-page.aig-full.pcf-on .aig-shell { display: grid; grid-template-columns: 296px minmax(0, 1fr); align-items: start; }
body.aig-page.aig-full.pcf-on .aig-side { display: block; position: sticky; top: calc(var(--pcf-ab-h, 0px) + 56px); height: calc(100vh - var(--pcf-ab-h, 0px) - 56px - 64px);
    overflow: auto; overscroll-behavior: contain; padding: 14px 12px 16px; border-right: 1px solid var(--line); }
body.aig-page.aig-full.pcf-on .aig-main { min-width: 0; padding: 8px 48px 76px; }
body.aig-page.aig-full.pcf-on .aig .aig-app { max-width: none; margin: 0; padding: 0; }
body.aig-page.aig-full.pcf-on .aig-foot { display: flex; }
body.aig-page.aig-full.pcf-on .aig .st-top,
body.aig-page.aig-full.pcf-on .aig .pset,
body.aig-page.aig-full.pcf-on .aig .home-m { display: none; }
body.aig-page.aig-full.pcf-on .aig .start { min-height: calc(100vh - var(--pcf-ab-h, 0px) - 56px - 64px - 56px); padding-block: 16px 24px; }
body.aig-page.aig-full.pcf-on .aig .play { padding-top: 8px; }
body.aig-page.aig-full.pcf-on .aig .home-what { display: block; }
body.aig-page.aig-full.pcf-on .aig .out { top: calc(var(--pcf-ab-h, 0px) + 68px); display: flex; flex-direction: column; max-height: calc(100vh - var(--pcf-ab-h, 0px) - 144px); }
body.aig-page.aig-full.pcf-on .aig .out-doc { display: flex; flex-direction: column; min-height: 0; }
body.aig-page.aig-full.pcf-on .aig .outbox { min-height: 0; max-height: none; }
body.aig-page.aig-full.pcf-on .ocb { --ocb-b: calc(64px + 16px + env(safe-area-inset-bottom, 0px)); }
}
.aig .aig-side,
.aig .aig-foot { display: none; }
.aig .sd-grp + .sd-grp { margin-top: 2px; }
.aig .sd-grp h3 { margin: 0; font: inherit; }
.aig .sd-hm,
.aig .sd-gh { display: flex; align-items: center; gap: 8px; width: 100%; height: 36px; padding: 0 8px; border-radius: 6px; font-size: 14px; font-weight: 600; color: var(--ink); }
.aig .sd-hm { margin-bottom: 6px; }
.aig .sd-hm:hover,
.aig .sd-hm.is-on,
.aig .sd-gh:hover { background: var(--sunk); color: var(--ink); }
.aig .sd-gh em { font-size: 12.5px; font-style: normal; font-weight: 400; color: var(--muted); font-variant-numeric: tabular-nums; }
.aig .sd-gh svg.ic { width: 16px; height: 16px; margin-left: auto; color: var(--muted); }
.aig .sd-grp.open .sd-gh svg.ic { transform: rotate(180deg); }
.aig .sd-grp ul { display: none; gap: 4px; margin: 0; padding: 0 0 8px 10px; list-style: none; }
.aig .sd-grp.open ul { display: grid; }
.aig .sd-it { display: flex; align-items: center; gap: 8px; height: 40px; padding: 0 8px; border-radius: 6px; font-size: 13.5px; color: var(--sub); text-decoration: none; }
.aig .sd-it.is-done { color: var(--ink); }
.aig .sd-it:hover { background: var(--sunk); }
.aig .sd-it.is-on { background: var(--sunk); font-weight: 600; color: var(--ink); }
.aig .sd-it svg.ic { width: 16px; height: 16px; }
.aig .sd-tx { flex: 1; min-width: 0; overflow: hidden; font-weight: inherit; white-space: nowrap; text-overflow: ellipsis; }
.aig .sd-bar { position: relative; flex: none; width: 36px; height: 3px; overflow: hidden; border-radius: 2px; background: var(--line); }
.aig .sd-bar::before { content: ""; position: absolute; inset: 0 auto 0 0; width: var(--p); border-radius: 2px; background: var(--accent); }
.aig .sd-tag { flex: none; padding: 2px 7px; border-radius: 6px; background: var(--accent-soft); color: var(--accent-deep); font-size: 11.5px; font-style: normal; font-weight: 700; }
.aig .sd-tag.new { background: var(--warn-soft); color: var(--warn); }
@media (min-width: 761px) and (max-height: 790px) {
.aig .sd-hm,
.aig .sd-gh,
.aig .sd-it { height: 32px; }
.aig .sd-grp ul { gap: 2px; padding-bottom: 6px; }
}
.aig .ck-done { color: var(--ink); }
.aig .ck-run { color: var(--accent); }
.aig .ck-todo { color: var(--line-2); }
.aig .aig-foot { position: fixed; left: 0; right: 0; bottom: 0; z-index: 20; align-items: center; justify-content: space-between; gap: 16px; height: 64px;
  padding: 0 24px env(safe-area-inset-bottom, 0px); border-top: 1px solid var(--line); background: var(--bg); }
.aig .ft-prog { display: flex; align-items: center; gap: 12px; font-size: 13px; color: var(--muted); }
.aig .ft-lb { font-size: 11.5px; font-weight: 700; letter-spacing: .08em; }
.aig .ft-bar { position: relative; width: 220px; height: 6px; overflow: hidden; border-radius: 3px; background: var(--sunk); }
.aig .ft-bar i { position: absolute; inset: 0 auto 0 0; border-radius: 3px; background: var(--ink); }
.aig .ft-n { font-variant-numeric: tabular-nums; }
.aig .ft-n b { color: var(--ink); }
.aig .ft-r { display: flex; align-items: center; gap: 10px; }
.aig .ft-all { padding: 10px 16px; font-size: 14.5px; font-weight: 600; background: var(--card); color: var(--ink); box-shadow: inset 0 0 0 1px var(--line-2); }
.aig .ft-all em { font-style: normal; font-weight: 500; color: var(--muted); }
.aig .home h2 { margin-top: 8px; font-size: clamp(30px, 3.2vw, 42px); text-wrap: balance; }
.aig .home .st-art { --k: .66; margin-bottom: 8px; }
.aig .home .st-lead { margin-top: 10px; max-width: none; font-size: 16px; }
.aig .home .st-facts { margin-top: 12px; }
.aig .home-what { display: none; }
.aig .hub-art { width: calc(250px * var(--k)); }
.aig .hub-art .s1,
.aig .hub-art .s2 { top: calc(30px * var(--k)); width: calc(88px * var(--k)); height: calc(88px * var(--k)); animation: aig-rest-pop .5s cubic-bezier(.34, 1.56, .64, 1) .08s both; }
.aig .hub-art .s1 { left: 0; rotate: -12deg; }
.aig .hub-art .s2 { right: calc(14px * var(--k)); rotate: 12deg; }
.aig .hub-art .main { left: calc(61px * var(--k)); }
.aig .hub-art .lens { right: calc(-4px * var(--k)); }
.aig .hr-list { display: grid; gap: 10px; width: min(600px, 100%); margin: 16px 0 0; padding: 0; list-style: none; }
.aig .hr-it { display: flex; align-items: center; gap: 14px; width: 100%; min-height: 64px; padding: 9px 16px 9px 14px; border: 1.5px solid var(--line-2); border-radius: var(--r-card); background: var(--card); color: var(--ink); text-align: left; transition: background .15s; }
.aig .hr-it:hover { background: var(--sunk); }
.aig .hr-it:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.aig .hr-it img { flex: none; width: 36px; height: 36px; }
.aig .hr-tx { display: grid; flex: 1; gap: 1px; min-width: 0; }
.aig .hr-tx b { font-size: 16.5px; font-weight: 600; line-height: 1.4; color: var(--ink); }
.aig .hr-tx small { font-size: 13px; line-height: 1.4; color: var(--muted); font-variant-numeric: tabular-nums; }
.aig .hr-it.is-run { border-color: var(--accent); background: var(--accent-soft); }
.aig .hr-more { min-height: 50px; padding-block: 6px; border-color: var(--line); color: var(--muted); }
.aig .hr-more .hr-tx b { font-size: 15px; color: var(--sub); }
.aig .hr-more svg.ic { width: 18px; height: 18px; }
@media (hover: none) and (pointer: coarse) {
.aig .hr-it .kc { display: none; }
}
.aig .home-m { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px; justify-self: stretch; margin-top: 40px; padding-top: 18px; border-top: 1px solid var(--line);
  font-size: 14px; color: var(--muted); }
.aig .home-m b { color: var(--ink); }
@media (min-width: 761px) and (max-height: 820px) {
.aig .home .st-art { --k: .44; margin-bottom: 2px; }
.aig .home h2 { margin-top: 4px; }
.aig .home .st-lead { margin-top: 6px; font-size: 15px; line-height: 1.5; }
.aig .home .st-facts { margin-top: 8px; }
.aig .home .st-go { margin-top: 14px; }
.aig .hr-list { gap: 6px; margin-top: 10px; }
.aig .hr-it { min-height: 54px; padding-block: 4px; }
.aig .hr-more { min-height: 42px; }
}
.aig .st-new { margin: 16px 0 0; padding: 8px 14px; border-radius: var(--r-btn); background: var(--warn-soft); color: var(--warn); font-size: 14px; }
.aig .st-new b { color: inherit; }
.aig .st-note { margin: 12px 0 0; font-size: 13px; color: var(--muted); }
@media (hover: none) and (pointer: coarse) {
.aig .me-c .kc { display: none; }
}
@media (min-width: 761px) and (max-height: 780px) {
.aig .start:not(.home) .st-art { --k: .6; margin-bottom: 8px; }
.aig .start:not(.home) h2 { margin-top: 6px; font-size: 48px; }
.aig .start:not(.home) .st-lead { margin-top: 10px; font-size: 16px; line-height: 1.5; }
.aig .start:not(.home) .st-facts { margin-top: 14px; }
.aig .start:not(.home) .st-go { margin-top: 18px; }
.aig .st-note { margin-top: 6px; }
body.aig-page.aig-full.pcf-on .aig .start:not(.home) { padding-block: 8px 16px; }
}
.aig .res-next { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-block: 8px 20px; padding: 10px 14px; border-radius: var(--r-card); background: var(--accent-soft); }
.aig .res-next img { flex: none; width: 36px; height: 36px; }
.aig .res-next p { flex: 1 1 200px; margin: 0; font-size: 15.5px; color: var(--text); font-variant-numeric: tabular-nums; }
.aig .res-next b { color: var(--ink); }
.aig .res-next .btn { padding: 10px 16px; font-size: 14.5px; font-weight: 600; }
.aig .aig-dlg-wrap { position: fixed; inset: 0; z-index: 400; display: grid; place-items: center; padding: 24px; background: rgba(0, 12, 30, .45); }
.aig .aig-dlg { position: relative; width: min(620px, 100%); max-height: calc(100vh - 48px); overflow: auto; padding: 28px 28px 24px; border-radius: 16px; background: var(--card); color: var(--text);
  box-shadow: 0 20px 60px rgba(0, 0, 0, .25); }
.aig .aig-dlg h2 { margin: 0; padding-right: 36px; font-size: 21px; line-height: 1.4; letter-spacing: -.02em; }
.aig .aig-dlg > p { margin: 8px 0 0; font-size: 14.5px; line-height: 1.65; color: var(--sub); }
.aig .dl-x { position: absolute; right: 14px; top: 14px; display: grid; place-items: center; width: 34px; height: 34px; border: 0; border-radius: 8px; background: transparent; color: var(--muted); }
.aig .dl-x:hover { background: var(--sunk); color: var(--ink); }
.aig .dl-list { margin: 18px 0 0; padding: 4px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); list-style: none; }
.aig .dl-list li { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; padding: 10px 2px; }
.aig .dl-list li + li { border-top: 1px solid var(--line); }
.aig .dl-list li.off { opacity: .65; }
.aig .dl-ck { display: flex; flex: 1 1 250px; align-items: center; gap: 12px; min-width: 0; cursor: pointer; }
.aig .dl-list li.off .dl-ck { cursor: default; }
.aig .dl-ck input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.aig .dl-ck input:checked + .dl-box { border-color: var(--accent); background: var(--accent); color: #FFFFFF; }
.aig .dl-ck input:focus-visible + .dl-box { outline: 2px solid var(--accent); outline-offset: 2px; }
.aig .dl-ck img { flex: none; width: 30px; height: 30px; }
.aig .dl-tx { display: grid; min-width: 0; }
.aig .dl-tx b { font-size: 15px; color: var(--ink); }
.aig .dl-tx small { font-size: 12.5px; color: var(--muted); }
.aig .dl-row { display: flex; gap: 2px; margin-left: auto; }
.aig .dl-more { margin: 10px 2px 0; font-size: 13px; color: var(--muted); }
.aig .dl-file,
.aig .dl-line { display: flex; align-items: center; gap: 10px; margin-top: 16px; padding: 12px 14px; border-radius: 10px; background: var(--sunk); font-size: 14px; color: var(--sub); }
.aig .dl-line .btn { flex: none; margin-left: auto; }
.aig .dl-file svg.ic { width: 18px; height: 18px; }
.aig .dl-file b { color: var(--ink); }
.aig .dl-file span { margin-left: auto; font-size: 13px; color: var(--muted); }
.aig .dl-acts { display: flex; justify-content: flex-end; gap: 8px; margin-top: 18px; }
.aig .dl-acts .btn { padding: 11px 18px; font-size: 15px; font-weight: 600; }
.aig .aig-dlg .gate-note { justify-content: flex-end; }
@media (max-width: 760px) {
.aig .home h2 { font-size: 26px; }
.aig .hr-list { margin-top: 14px; }
.aig .hr-tx b { font-size: 15.5px; }
.aig .res-next .btn { width: 100%; }
.aig .aig-dlg { padding: 24px 18px 18px; }
.aig .dl-row { margin-left: 34px; }
}
@media (prefers-reduced-motion: reduce) {
.aig .hub-art .s1,
.aig .hub-art .s2 { animation: none; }
}
