/* 워드고 소개 — 레벨 1·2·3 장 보강(2026-10-31, 세션 4). wordgo-story.css 의 색(--wg-*)을 그대로 씀 */
.wg-ref{font-size:.7em;color:var(--wg-gold2);margin-left:1px;font-weight:700}
.wg-dark .wg-ref{color:var(--wg-gold)}

/* 5장 · 두 길 */
.wg-paths{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:40px 0 10px}
.wg-path{position:relative;padding:22px 24px;border-radius:18px;background:#fff;border:1px solid #dcdccf;overflow:hidden;opacity:0;transform:translateY(16px);transition:opacity .7s ease,transform .7s ease}
.wg-path.ai{transition-delay:.25s}
.wg-paths.in .wg-path{opacity:1;transform:none}
.wg-path-tag{font-size:12px;letter-spacing:.12em;color:var(--wg-muted);font-weight:700}
.wg-path-row{display:flex;align-items:center;gap:8px;margin:14px 0;flex-wrap:wrap}
.wg-path-row i{font-style:normal;padding:7px 12px;border-radius:999px;font-size:14px;font-weight:500;background:var(--wg-paper)}
.wg-path-row i.arrow{width:34px;height:2px;padding:0;border-radius:2px;background:linear-gradient(90deg,transparent,var(--wg-l1));position:relative}
.wg-path.ai .wg-path-row i.arrow{background:linear-gradient(90deg,transparent,var(--wg-l2))}
.wg-path-row i.arrow:after{content:"";position:absolute;right:-1px;top:-4px;border:5px solid transparent;border-left-color:var(--wg-l1)}
.wg-path.ai .wg-path-row i.arrow:after{border-left-color:var(--wg-l2)}
.wg-path-row i.me{background:var(--wg-l1);color:#fff}
.wg-path.ai .wg-path-row i.me{background:var(--wg-l2)}
.wg-paths.in .wg-path-row i{animation:wgPop .5s ease both}
.wg-paths.in .wg-path-row i:nth-child(2){animation-delay:.35s}.wg-paths.in .wg-path-row i:nth-child(3){animation-delay:.7s}
.wg-paths.in .wg-path-row i:nth-child(4){animation-delay:1.05s}.wg-paths.in .wg-path-row i:nth-child(5){animation-delay:1.4s}
.wg-path b{display:block;font-size:19px;color:var(--wg-ink)}
.wg-path p{margin:6px 0 0;color:var(--wg-muted);font-size:15px;line-height:1.75}
@keyframes wgPop{from{opacity:0;transform:scale(.85)}to{opacity:1;transform:none}}

/* 5장 · 같은 장면 두 대답 */
.wg-duo{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.wg-duo-col>b{display:block;font-size:14px;margin-bottom:8px}
.wg-duo-col>b.t1{color:#9cc9a8}.wg-duo-col>b.t2{color:#9cc3df}
.wg-duo canvas{width:100%;height:auto;display:block;border-radius:10px}
.wg-duo-steps{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:5px;font-size:12.5px;line-height:1.5;color:#d9d0b899}
.wg-duo-steps li{padding-left:16px;position:relative;transition:color .4s}
.wg-duo-steps li:before{content:"";position:absolute;left:3px;top:.55em;width:6px;height:6px;border-radius:50%;background:#ffffff30;transition:background .4s}
.wg-duo-steps li.on{color:#f3ead2}
.wg-duo-col:first-child .wg-duo-steps li.on:before{background:#7fc49a}
.wg-duo-col:last-child .wg-duo-steps li.on:before{background:#7fb6db}
.wg-duo-steps li b{color:var(--wg-gold)}

/* 10장 · 토큰 조각 */
.wg-tokens{display:flex;flex-wrap:wrap;gap:6px;min-height:150px;align-content:center;justify-content:center;padding:10px}
.wg-tokens span{font-size:20px;padding:6px 10px;border-radius:8px;background:#ffffff10;border:1px solid #ffffff22;color:#efe6cf;font-variant-numeric:tabular-nums;opacity:0;transform:translateY(8px);transition:opacity .4s,transform .4s,background .4s}
.wg-tokens.in span{opacity:1;transform:none}
.wg-tokens span small{display:block;font-size:10px;color:#d9d0b880;text-align:center}
.wg-tokens span.hot{background:#8a6bb855;border-color:#b79be0}

/* 표 */
.wg-tbl{overflow-x:auto;margin:24px 0}
.wg-measure{width:100%;border-collapse:collapse;font-size:14.5px;line-height:1.65;min-width:560px}
.wg-measure th{text-align:left;font-weight:700;padding:10px 12px;border-bottom:2px solid #c9c6b4;color:var(--wg-ink);white-space:nowrap}
.wg-measure td{padding:10px 12px;border-bottom:1px solid #dddacb;vertical-align:top}
.wg-measure td:first-child{color:var(--wg-muted);white-space:nowrap}
.wg-measure tr.hi td{background:#3f7fa60f}
.wg-dark .wg-measure th{color:#f3ead2;border-bottom-color:#ffffff40}
.wg-dark .wg-measure td{border-bottom-color:#ffffff1a;color:#e6dcc3}
.wg-dark .wg-measure td:first-child{color:#d9d0b8a0}
.wg-dark .wg-measure tr.hi td{background:#3f7fa62a}
.wg-measure.dark td:nth-child(3){color:#e3d4ff}
.wg-three th.c1{color:var(--wg-l1)}.wg-three th.c2{color:var(--wg-l2)}.wg-three th.c3{color:var(--wg-l3)}


/* 11장 · 참고 문헌 */
.wg-refs{margin-top:46px;padding-top:28px;border-top:1px solid #d9d6c6}
.wg-refs ol{margin:0;padding-left:22px;display:grid;gap:8px;font-size:14px;line-height:1.7;color:var(--wg-muted)}
.wg-refs i{color:var(--wg-ink)}

@media (max-width:1050px){.wg-duo{grid-template-columns:1fr 1fr}}
@media (max-width:760px){.wg-paths{grid-template-columns:1fr}.wg-duo{grid-template-columns:1fr}.wg-tokens span{font-size:17px}}
@media (prefers-reduced-motion:reduce){.wg-path,.wg-tokens span{opacity:1;transform:none;transition:none}.wg-paths.in .wg-path-row i{animation:none}}
/* 좁은 화면: 표가 든 칸이 표 너비만큼 벌어지지 않게 */
.wg-split>*{min-width:0}
.wg-tbl{max-width:100%}
/* 사람의 방식·AI의 방식 카드 */
.wg-ways{margin-top:34px}
.wg-ways article p{font-size:14.5px;line-height:1.75}
.wg-ways.dark article{background:#ffffff0d;border-color:#ffffff22;box-shadow:none}
.wg-ways.dark article h3{color:#f3ead2}.wg-ways.dark article p{color:#d9d0b8}.wg-ways.dark article b{color:#9cc3df}
.wg-head p+p{margin-top:14px}

/* 표지(2026-10-31 2차): 산수 배경 + AI 두뇌 + 3D 판 + 풍선말 */
.wg-hero{background:#0b1f1a}
.wg-hero:before{display:none}
.wg-hero-bg{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.wg-hero-bg #hero-sansu{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.wg-hero-bg #hero-brain{position:absolute;right:-4%;top:6%;width:min(62vw,880px);height:auto;opacity:.85;mix-blend-mode:screen}
.wg-hero-bg:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#0b1f1acc 0%,#0b1f1a66 40%,transparent 62%),linear-gradient(0deg,#0b1f1a 0%,transparent 22%)}
.wg-hero3d{width:min(620px,100%)}
.wg-hero3d canvas{box-shadow:none!important;border-radius:0!important;filter:drop-shadow(0 30px 40px #0008)}
.wg-balloon{position:absolute;left:0;top:0;transform:translate(-50%,calc(-100% - 26px)) scale(.92);opacity:0;transition:opacity .35s,transform .35s;pointer-events:none;
  width:max-content;max-width:min(300px,70vw);background:#fffaf0;color:#1f3a31;border-radius:16px;padding:10px 14px 11px;box-shadow:0 12px 30px #0007;z-index:2}
.wg-balloon:after{content:"";position:absolute;left:50%;bottom:-9px;transform:translateX(-50%);border:10px solid transparent;border-bottom:0;border-top-color:#fffaf0}
.wg-balloon.on{opacity:1;transform:translate(-50%,calc(-100% - 26px)) scale(1)}
.wg-balloon.below{transform:translate(-50%,30px) scale(.92)}
.wg-balloon.below.on{transform:translate(-50%,30px) scale(1)}
.wg-balloon.below:after{bottom:auto;top:-9px;border-top:0;border-bottom:10px solid #fffaf0}
.wg-balloon b{display:block;font-size:12px;color:#a8823f;margin-bottom:2px}
.wg-balloon span{display:block;font-size:14px;line-height:1.55;font-weight:500}
@media (max-width:1050px){.wg-hero-bg #hero-brain{width:100vw;top:auto;bottom:10%;right:-20%}}

/* 2차(10-31) */
.wg-arena-wrap{margin:70px 0 10px}
.wg-arena-fig canvas,.wg-lomflow-fig canvas{width:100%;height:auto;display:block}
.wg-why3{margin:60px 0 10px;padding:30px 34px;border-radius:18px;background:#ffffff08;border:1px solid #d6b77a33}
.wg-why3 p{max-width:none}
.wg-lomflow{margin:60px 0 0}
.wg-three tr.key td{background:#d6b77a14;font-size:15px}
.wg-l1-steps tr.goal td{color:var(--wg-l1);font-style:italic}
.wg-copyright{margin-top:22px;font-size:13px;color:#8a9184;border-top:1px solid #d6d2c2;padding-top:14px}
@media (max-width:760px){.wg-why3{padding:22px 18px}}