/* 태권고 앱 소개 페이지 공용 스타일 — apps/*.html 이 함께 쓴다 (원본: student.html 2026-09-05). 페이지마다 다른 것은 각 파일 <style> 에 둔다. */
  :root{--navy-950:#070f24;--navy-900:#0c1c3d;--gold-500:#ffc629;--gold-400:#ffd866;--ink:#e8eefc;--ink-dim:#a9b6d6;--ink-dim2:#7d8db3;--line:rgba(255,255,255,.10);--line-strong:rgba(255,255,255,.18);}
  *{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
  html{scroll-behavior:smooth}
  body{margin:0;background:var(--navy-950);color:var(--ink);font-family:'Pretendard','Apple SD Gothic Neo','Malgun Gothic',sans-serif;line-height:1.7;-webkit-font-smoothing:antialiased;overflow-x:clip}
  a{color:inherit;text-decoration:none}
  .wrap{max-width:980px;margin:0 auto;padding:0 20px}
  .nav{position:sticky;top:0;z-index:20;background:rgba(7,15,36,.85);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
  .nav .wrap{display:flex;align-items:center;gap:14px;height:64px}
  .nav .brand{display:flex;align-items:center;gap:8px;font-weight:900;font-size:17px}
  .nav .brand img.gtk{height:40px;width:auto;border-radius:0}
  @media(max-width:640px){.nav .brand img.gtk{height:32px}}
  .nav .links{display:flex;gap:4px;margin-left:auto;flex-wrap:wrap;justify-content:flex-end}
  .nav .links a{padding:8px 12px;border-radius:10px;font-size:13.5px;font-weight:800;color:var(--ink-dim)}
  .nav .links a.on,.nav .links a:hover{color:#fff;background:rgba(255,255,255,.06)}
  .nav .links a.hot{color:var(--gold-400);border:1px solid rgba(255,198,41,.45)}
  @media(max-width:640px){.nav .links a{padding:7px 9px;font-size:12.5px}}

  /* ── 히어로 ── */
  .hero{position:relative;padding:56px 0 34px;text-align:center;overflow:hidden}
  .hero::before{content:"";position:absolute;inset:0;background:radial-gradient(700px 420px at 50% 0%,rgba(255,198,41,.14),transparent 70%);pointer-events:none}
  .hero .ic{width:110px;height:110px;border-radius:26px;box-shadow:0 14px 40px rgba(0,0,0,.5);margin-bottom:16px}
  .hero .who{display:inline-block;font-size:12.5px;font-weight:900;color:var(--gold-400);border:1px solid rgba(255,198,41,.5);border-radius:999px;padding:5px 14px;margin-bottom:12px}
  .hero .free{display:inline-block;font-size:12.5px;font-weight:900;color:#1a1200;background:linear-gradient(135deg,#f5d16a,#d4af37);border-radius:999px;padding:6px 14px;margin:0 0 12px 6px}
  .hero h1{font-size:clamp(28px,5vw,46px);font-weight:900;line-height:1.3;letter-spacing:-.03em;margin:0 0 8px;word-break:keep-all}
  .hero .tag{font-size:clamp(16px,2.2vw,21px);font-weight:800;color:var(--gold-400);margin:0 0 14px}
  .hero .lead{font-size:15.5px;font-weight:700;color:var(--ink-dim);line-height:1.9;max-width:680px;margin:0 auto;word-break:keep-all}
  .hero .lead b{color:#fff}
  .cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin:26px 0 8px}
  .cta a{display:inline-flex;flex-direction:column;align-items:center;padding:14px 24px;border-radius:14px;font-weight:900;font-size:16px;border:1px solid rgba(255,198,41,.5);color:var(--gold-400)}
  .cta a.main{background:linear-gradient(135deg,#f5d16a,#d4af37);color:#1a1200;border:none;font-size:18px;box-shadow:0 10px 30px rgba(245,197,66,.3)}
  .cta a small{font-size:11.5px;font-weight:800;opacity:.75;margin-top:2px}
  /* 히어로 카드 부채 */
  .fan{position:relative;height:250px;margin:26px auto 0;max-width:620px}
  .fan img{position:absolute;left:50%;bottom:0;width:150px;border-radius:12px;box-shadow:0 18px 40px rgba(0,0,0,.6);transform-origin:50% 115%;transition:transform .3s}
  @media(max-width:640px){.fan{height:190px}.fan img{width:112px}}

  /* ── 여정 띠 ── */
  .journey{display:grid;grid-template-columns:repeat(8,1fr);gap:6px;margin:34px 0 0}
  @media(max-width:760px){.journey{grid-template-columns:repeat(4,1fr)}}
  .journey a{display:flex;flex-direction:column;align-items:center;gap:4px;padding:12px 6px;border-radius:14px;border:1px solid var(--line);background:rgba(255,255,255,.03);text-align:center;font-size:12px;font-weight:800;color:var(--ink-dim);line-height:1.3;word-break:keep-all}
  .journey a:hover{border-color:rgba(255,198,41,.5);color:#fff}
  .journey a .em{font-size:24px;line-height:1}
  .journey a .n{font-size:10px;color:var(--gold-400);letter-spacing:.06em}

  /* ── 공통 섹션 ── */
  section.blk{padding:54px 0 10px}
  .kicker{display:inline-block;font-size:12px;font-weight:900;color:var(--gold-400);letter-spacing:.12em;border:1px solid rgba(255,198,41,.4);border-radius:999px;padding:3px 12px;margin-bottom:10px}
  h2.sec{font-size:clamp(22px,3.4vw,30px);font-weight:900;margin:0 0 6px;letter-spacing:-.02em;line-height:1.3;word-break:keep-all}
  h2.sec b{color:var(--gold-400)}
  p.sub{margin:0 0 22px;font-size:15px;color:var(--ink-dim);font-weight:700;line-height:1.8;max-width:720px;word-break:keep-all}
  p.sub b{color:#fff}
  .two{display:grid;grid-template-columns:1.1fr .9fr;gap:22px;align-items:center}
  @media(max-width:760px){.two{grid-template-columns:1fr}}
  .flow{display:flex;flex-direction:column;gap:0}
  .fs{position:relative;display:flex;gap:14px;padding:12px 0 14px 0}
  .fs::before{content:"";position:absolute;left:17px;top:48px;bottom:-4px;width:2px;background:linear-gradient(180deg,rgba(255,198,41,.6),rgba(255,198,41,.08))}
  .fs:last-child::before{display:none}
  .fs .n{flex-shrink:0;width:36px;height:36px;border-radius:50%;background:var(--gold-500);color:#1a1200;font-weight:900;display:flex;align-items:center;justify-content:center;font-size:15px;box-shadow:0 6px 16px rgba(255,198,41,.35)}
  .fs .n.alt{background:#0f2249;color:var(--gold-400);border:2px solid rgba(255,198,41,.6);box-shadow:none}
  .fs h3{margin:4px 0 2px;font-size:16.5px;font-weight:900;color:#fff;line-height:1.35}
  .fs p{margin:0;font-size:13.8px;color:var(--ink-dim);font-weight:600;line-height:1.7;word-break:keep-all}
  .fs p b{color:#fff}
  .fs p .g{color:var(--gold-400);font-weight:800}
  .fork{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px}
  @media(max-width:480px){.fork{grid-template-columns:1fr}}
  .fork div{border:1px dashed rgba(255,198,41,.45);border-radius:12px;padding:10px 12px;font-size:12.8px;color:var(--ink-dim);font-weight:700;line-height:1.55;word-break:keep-all}
  .fork div b{display:block;color:var(--gold-400);font-size:13px;margin-bottom:2px}
  .note{font-size:12.5px;color:var(--ink-dim2);line-height:1.65;margin:12px 0 0;word-break:keep-all;font-weight:600}
  .note b{color:var(--ink-dim)}

  /* 앱 화면 흉내 */
  .mock{background:linear-gradient(180deg,#0f1c3a,#0a1530);border:1px solid var(--line-strong);border-radius:22px;padding:16px;box-shadow:0 20px 60px rgba(0,0,0,.45)}
  .mock .mt{font-size:13px;font-weight:900;color:var(--gold-400);margin-bottom:10px}
  .gauge{height:16px;border-radius:8px;background:#1b2a48;overflow:hidden;position:relative}
  .gauge i{position:absolute;left:0;top:0;bottom:0;width:100%;background:linear-gradient(90deg,#f5c542,#fb923c);border-radius:8px}
  .nums{display:grid;grid-template-columns:repeat(9,1fr);gap:5px;margin:10px 0}
  .nums span{aspect-ratio:1;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:900;background:#f5c542;color:#1a1200}
  .nums span.off{background:#162341;color:#4b5b7c}
  .mbtn{display:block;text-align:center;border-radius:12px;padding:10px;font-size:14px;font-weight:900;margin-top:8px}
  .mbtn.green{background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff}
  .mbtn.blue{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff}
  .mbtn.gold{background:linear-gradient(135deg,#f5c542,#eab308);color:#1a1200}
  .or{text-align:center;font-size:11.5px;color:var(--ink-dim2);font-weight:800;margin:6px 0 0}
  .mrow{display:flex;justify-content:space-between;align-items:center;background:#0a1120;border-radius:10px;padding:9px 12px;margin-top:6px;font-size:13.5px;font-weight:800}
  .mrow .ok{color:#4ade80;font-size:12.5px}
  .mrow .ico{margin-right:6px}

  /* 강화 사다리 */
  .ladder{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin:8px 0 6px}
  @media(max-width:640px){.ladder{grid-template-columns:repeat(5,1fr);gap:5px}}
  .ladder div{text-align:center}
  .ladder img{width:100%;border-radius:10px;box-shadow:0 10px 26px rgba(0,0,0,.55);border:2px solid transparent}
  .ladder div:last-child img{border-color:#fb7185;box-shadow:0 0 26px rgba(251,113,133,.55)}
  .ladder b{display:block;font-size:12.5px;margin-top:6px;color:#fff}
  .ladder small{display:block;font-size:10.5px;color:var(--ink-dim2);font-weight:800}
  @media(max-width:640px){.ladder b{font-size:10.5px}.ladder small{display:none}}
  .ladder .c1 b{color:#94a3b8}.ladder .c2 b{color:#60a5fa}.ladder .c3 b{color:#c084fc}.ladder .c4 b{color:#f5c542}.ladder .c5 b{color:#fb7185}

  /* 이유 카드 */
  .why{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
  .wc{background:rgba(255,198,41,.06);border:1px solid rgba(255,198,41,.3);border-radius:18px;padding:18px}
  .wc .em{font-size:26px;line-height:1;margin-bottom:8px}
  .wc h3{margin:0 0 6px;font-size:15.5px;font-weight:900;color:#fff;line-height:1.35;word-break:keep-all}
  .wc p{margin:0;font-size:13.3px;color:var(--ink-dim);line-height:1.7;word-break:keep-all;font-weight:600}
  .wc p b{color:#fff}
  .quote{margin:22px 0 0;border-left:4px solid var(--gold-500);padding:8px 0 8px 18px;font-size:15.5px;font-weight:800;color:#fff;line-height:1.7;word-break:keep-all}
  .quote small{display:block;font-size:12.5px;color:var(--ink-dim2);font-weight:700;margin-top:4px}

  /* 수호령 */
  .gal{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin:6px 0 10px}
  @media(max-width:640px){.gal{grid-template-columns:repeat(5,1fr);gap:5px}.gal b{font-size:10px}.gal small{font-size:9px}}
  .gal div{text-align:center}
  .gal img{width:100%;border-radius:12px;box-shadow:0 10px 26px rgba(0,0,0,.55)}
  .gal b{display:block;font-size:12.5px;margin-top:6px;color:#fff}
  .gal small{display:block;font-size:11px;color:var(--ink-dim2);font-weight:800}
  .tiers{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 4px}
  .tiers span{font-size:12px;font-weight:900;border-radius:999px;padding:4px 11px;border:1px solid currentColor}
  .belts{display:flex;gap:6px;margin:10px 0 0;flex-wrap:wrap}
  .belts i{display:inline-block;width:52px;height:14px;border-radius:4px;border:1px solid rgba(255,255,255,.25)}
  .road{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:14px}
  .road img{width:100%;border-radius:10px;box-shadow:0 10px 26px rgba(0,0,0,.5);display:block}
  .road div{text-align:center;font-size:11px;font-weight:800;color:var(--ink-dim);line-height:1.3;padding-top:4px}
  .road div.now{color:var(--gold-400)}.road div.now img{outline:3px solid var(--gold-500);box-shadow:0 0 22px rgba(255,198,41,.7)}
  .road div.lock img{filter:brightness(.4) saturate(.4)}
  .ptrow{display:flex;gap:8px;margin-top:8px;flex-wrap:wrap}
  .ptrow span{flex:1;min-width:120px;text-align:center;font-size:12px;font-weight:800;color:var(--ink-dim);background:rgba(255,198,41,.08);border:1px solid rgba(255,198,41,.35);border-radius:10px;padding:7px 8px}
  .ptrow span b{color:var(--gold-400)}
  .stat{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px}
  .stat div{background:#0a1120;border-radius:12px;padding:10px;text-align:center}
  .stat b{display:block;font-size:20px;color:#6ee7b7;font-weight:900;line-height:1.2}
  .stat span{font-size:11.5px;color:var(--ink-dim);font-weight:800}

  /* 상패 · 진열장 */
  .plaque{position:relative;background:linear-gradient(160deg,#3b2a0a,#1a1204);border:6px solid #b8892b;border-radius:10px;padding:14px;box-shadow:0 20px 50px rgba(0,0,0,.6),inset 0 0 0 2px #f5d16a}
  .plaque .cert{background:#fffbe8;color:#3a2a06;border-radius:6px;padding:12px 12px 10px;text-align:center;font-family:'Batang',serif}
  .plaque .cert b{display:block;font-size:20px;letter-spacing:.3em;margin-bottom:6px}
  .plaque .cert p{margin:0;font-size:11px;line-height:1.6}
  .plaque .cert small{display:block;margin-top:6px;font-size:10px;color:#7a5a12}
  .plaque .medal{position:absolute;right:-8px;top:-14px;width:64px;height:64px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff6c8,#f5c542 55%,#a97a06);box-shadow:0 8px 20px rgba(0,0,0,.6);display:flex;align-items:center;justify-content:center;font-weight:900;color:#5a3d00;font-size:22px;font-family:'Batang',serif}
  .plaque .medal::before{content:"";position:absolute;top:-22px;left:22px;width:20px;height:28px;background:linear-gradient(90deg,#d92d20,#8a1010);clip-path:polygon(0 0,100% 0,100% 100%,50% 75%,0 100%)}
  /* 진열장 — 호두나무 장 + 유리 선반 + 조명 */
  .cab{position:relative;border-radius:18px;padding:14px;background:linear-gradient(180deg,#4a2f14,#2b1a0a 40%,#3a2410);box-shadow:0 30px 70px rgba(0,0,0,.65),inset 0 2px 0 rgba(255,220,150,.25),inset 0 -2px 0 rgba(0,0,0,.6)}
  .cab::before{content:"";position:absolute;inset:6px;border-radius:14px;border:1px solid rgba(255,210,130,.28);pointer-events:none}
  .cab .in{position:relative;border-radius:10px;overflow:hidden;background:radial-gradient(420px 220px at 50% 0%,#1d2f5e 0%,#0b1430 55%,#070d20 100%);padding:14px 12px 10px;box-shadow:inset 0 0 40px rgba(0,0,0,.7)}
  .cab .in::before{content:"";position:absolute;left:8%;right:8%;top:0;height:120px;background:linear-gradient(180deg,rgba(255,225,150,.22),transparent);clip-path:polygon(35% 0,65% 0,100% 100%,0 100%);pointer-events:none}
  .cab .lab{position:relative;font-size:12px;font-weight:900;color:var(--gold-400);letter-spacing:.08em;margin:0 0 4px 4px}
  .cab .tier{position:relative;display:grid;grid-template-columns:repeat(3,1fr);align-items:end;gap:10px;padding:0 6px 6px}
  .cab .tier.two{grid-template-columns:repeat(2,1fr);padding:0 40px 6px}
  @media(max-width:480px){.cab .tier.two{padding:0 12px 6px}}
  .cab .glass{position:relative;height:12px;margin:0 0 14px;border-radius:3px;background:linear-gradient(180deg,rgba(190,225,255,.55),rgba(120,170,230,.25) 50%,rgba(60,90,150,.35));box-shadow:0 6px 14px rgba(0,0,0,.6),0 -1px 0 rgba(255,255,255,.4)}
  .cab .glass::after{content:"";position:absolute;left:0;right:0;top:12px;height:18px;background:linear-gradient(180deg,rgba(120,170,230,.18),transparent)}
  /* 트로피 */
  .tro{display:flex;flex-direction:column;align-items:center}
  .tro .cup{font-size:54px;line-height:1;filter:drop-shadow(0 0 10px rgba(255,200,60,.75)) drop-shadow(0 10px 12px rgba(0,0,0,.6));transform:translateY(6px)}
  .tro .ped{width:78px;height:26px;border-radius:4px 4px 2px 2px;background:linear-gradient(180deg,#f3f0ea,#cfc9bf 45%,#8f877b);box-shadow:0 6px 12px rgba(0,0,0,.55),inset 0 1px 0 #fff}
  .tro .ped::after{content:"";display:block;margin:0 auto;width:92px;height:8px;border-radius:2px;background:linear-gradient(180deg,#7d7468,#4b443c);transform:translateY(26px)}
  .tro .np{margin-top:12px;font-size:9.5px;font-weight:900;color:#3a2a06;background:linear-gradient(180deg,#f7e2a0,#c9a24a);border-radius:2px;padding:1px 6px;letter-spacing:.02em;box-shadow:0 1px 0 rgba(0,0,0,.4)}
  /* 메달 액자 */
  .med{position:relative;display:flex;flex-direction:column;align-items:center;padding:14px 8px 8px;border-radius:6px;background:linear-gradient(160deg,#1b2a55,#0e1a3a);border:4px solid #b8892b;box-shadow:0 0 0 1px #f5d16a inset,0 10px 24px rgba(0,0,0,.6)}
  .med .rib{width:22px;height:34px;background:linear-gradient(90deg,var(--ra),var(--rb));clip-path:polygon(0 0,100% 0,100% 100%,50% 78%,0 100%);margin-bottom:-8px;filter:drop-shadow(0 3px 4px rgba(0,0,0,.5))}
  .med .disc{width:50px;height:50px;border-radius:50%;background:radial-gradient(circle at 35% 30%,var(--f1),var(--f2) 55%,var(--f3));box-shadow:0 0 0 3px var(--edge) inset,0 8px 16px rgba(0,0,0,.6),0 0 18px var(--glow);display:flex;align-items:center;justify-content:center;font-family:'Batang',serif;font-weight:900;font-size:20px;color:var(--tx);text-shadow:0 1px 0 rgba(255,255,255,.5)}
  .med .np{margin-top:8px;font-size:9.5px;font-weight:900;color:#3a2a06;background:linear-gradient(180deg,#f7e2a0,#c9a24a);border-radius:2px;padding:1px 6px;white-space:nowrap}
  .med.g{--f1:#fff6c8;--f2:#f5c542;--f3:#a97a06;--edge:#fff0b0;--ra:#d92d20;--rb:#8a1010;--tx:#5a3d00;--glow:rgba(255,200,60,.55)}
  .med.s{--f1:#ffffff;--f2:#d7dee8;--f3:#8b97a8;--edge:#f1f5f9;--ra:#2563eb;--rb:#12306e;--tx:#2b3542;--glow:rgba(200,220,255,.4)}
  .med.b{--f1:#ffd9b0;--f2:#d08b4a;--f3:#7c4a12;--edge:#ffe4c4;--ra:#16a34a;--rb:#0a4a22;--tx:#4a2a06;--glow:rgba(220,150,80,.4)}
  .cab .foot{font-size:10.5px;color:rgba(255,220,150,.6);font-weight:800;text-align:center;margin-top:8px;letter-spacing:.04em}

  /* 달력 */
  .cal{background:#0f192d;border:1px solid var(--line-strong);border-radius:16px;padding:12px}
  .cal .sum{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:10px}
  .cal .sum div{background:#0a1120;border-radius:10px;padding:8px;text-align:center}
  .cal .sum b{display:block;font-size:20px;color:#6ee7b7;line-height:1.2}
  .cal .sum span{font-size:11px;color:var(--ink-dim);font-weight:800}
  .cal .wk,.cal .days{display:grid;grid-template-columns:repeat(7,1fr);gap:3px;text-align:center}
  .cal .wk span{font-size:10px;color:var(--ink-dim2);font-weight:900}
  .cal .days span{font-size:11px;font-weight:800;border-radius:7px;padding:6px 0;color:#7d8db3;background:#0a1120}
  .cal .days span.on{background:#14532d;color:#86efac}
  .cal .days span.off{background:#3f1d1d;color:#fca5a5}
  .cal .days span.tod{outline:2px solid var(--gold-500);color:#fff}
  .cal .lst{font-size:11.5px;color:#c7d2e5;font-weight:700;margin-top:8px;line-height:1.6}

  /* 명예의 전당 */
  .hof{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
  @media(max-width:640px){.hof{grid-template-columns:1fr}}
  .hc{background:rgba(255,255,255,.045);border:1px solid var(--line-strong);border-radius:16px;padding:16px}
  .hc .em{font-size:24px;line-height:1;margin-bottom:6px}
  .hc h3{margin:0 0 4px;font-size:15px;color:#fff}
  .hc p{margin:0;font-size:12.8px;color:var(--ink-dim);font-weight:600;line-height:1.65;word-break:keep-all}
  .hc p b{color:var(--gold-400)}

  /* 관장님 */
  .pills{display:flex;flex-direction:column;gap:8px}
  .pill{padding:12px 18px;border-radius:999px;background:#fff;color:#111;font-size:15px;font-weight:900;text-align:center;box-shadow:0 10px 30px rgba(0,0,0,.4)}
  .pill.gold{background:linear-gradient(135deg,#f5d16a,#d4af37);color:#1a1200}
  .steps{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
  @media(max-width:640px){.steps{grid-template-columns:1fr}}
  .st{background:rgba(255,198,41,.06);border:1px solid rgba(255,198,41,.3);border-radius:18px;padding:18px}
  .st .n{display:inline-flex;width:28px;height:28px;border-radius:50%;background:var(--gold-500);color:#1a1200;font-weight:900;align-items:center;justify-content:center;margin-bottom:8px}
  .st h3{margin:0 0 4px;font-size:16px;color:#fff}
  .st p{margin:0;font-size:13.5px;color:var(--ink-dim);font-weight:600;word-break:keep-all}
  .others{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
  .oc{display:flex;flex-direction:column;align-items:center;gap:6px;padding:16px 10px;border-radius:16px;border:1px solid var(--line);background:rgba(255,255,255,.03);text-align:center}
  .oc:hover{border-color:rgba(255,198,41,.5)}
  .oc img{width:52px;height:52px;border-radius:14px}
  .oc b{font-size:14px}
  .oc span{font-size:11.5px;color:var(--ink-dim2);font-weight:700}
  h2.plain{font-size:22px;font-weight:900;margin:44px 0 16px;letter-spacing:-.02em}

  /* ══ 사전신청 띠 (중간중간) — 혜택 문구는 signup.html 과 같게 ══ */
  .su{position:relative;margin:46px 0 0;border-radius:22px;padding:2px;background:linear-gradient(120deg,#f5d16a,#d4af37 40%,#7c5a1e 60%,#f5d16a);background-size:200% auto;animation:sushine 6s linear infinite}
  @keyframes sushine{to{background-position:200% center}}
  .su .in{border-radius:20px;background:linear-gradient(135deg,#1a1200 0%,#0c1c3d 55%,#070f24 100%);padding:22px 24px;display:flex;align-items:center;gap:20px;flex-wrap:wrap}
  .su .tx{flex:1;min-width:240px}
  .su .k{display:inline-block;font-size:12px;font-weight:900;color:#1a1200;background:var(--gold-400);border-radius:999px;padding:3px 10px;margin-bottom:8px}
  .su .k.red{background:#f87171;color:#fff}
  .su h3{margin:0 0 6px;font-size:clamp(19px,2.6vw,25px);font-weight:900;line-height:1.3;letter-spacing:-.02em;word-break:keep-all}
  .su h3 b{color:var(--gold-400)}
  .su p{margin:0;font-size:13.5px;color:var(--ink-dim);font-weight:700;line-height:1.7;word-break:keep-all}
  .su p b{color:#fff}
  .su .chips{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
  .su .chips span{font-size:12px;font-weight:900;color:var(--gold-400);border:1px solid rgba(255,198,41,.45);border-radius:999px;padding:4px 10px;background:rgba(255,198,41,.06)}
  .su .chips span b{color:#fff}
  .su a.go{position:relative;overflow:hidden;display:inline-flex;flex-direction:column;align-items:center;justify-content:center;min-width:200px;padding:16px 26px;border-radius:16px;background:linear-gradient(135deg,#f5d16a,#d4af37);color:#1a1200;font-size:19px;font-weight:900;box-shadow:0 12px 34px rgba(245,197,66,.4);transition:transform .15s}
  .su a.go:hover{transform:translateY(-2px)}
  .su a.go small{font-size:11.5px;font-weight:800;opacity:.75;margin-top:2px}
  .su a.go::after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-20deg);animation:sweep 2.8s ease-in-out infinite}
  @keyframes sweep{0%,60%{left:-60%}100%{left:130%}}
  .su .dday{font-size:12.5px;font-weight:900;color:#f87171;margin-top:8px;text-align:center}
  @media(max-width:640px){.su .in{padding:18px 16px}.su .in>div:last-child{width:100%}.su a.go{width:100%}}

  /* ══ 맨 위 선언 장면 (관장님 문구 2026-09-05) ══ */
  .mani{position:relative;overflow:hidden;padding:64px 0 56px;background:#040914;border-bottom:1px solid var(--line)}
  .mani .glow{position:absolute;width:700px;height:700px;border-radius:50%;filter:blur(40px);opacity:.55;pointer-events:none}
  .mani .g1{left:-200px;top:-260px;background:radial-gradient(circle,rgba(255,198,41,.35),transparent 60%);animation:drift 14s ease-in-out infinite alternate}
  .mani .g2{right:-260px;bottom:-320px;background:radial-gradient(circle,rgba(59,130,246,.35),transparent 60%);animation:drift 18s ease-in-out infinite alternate-reverse}
  @keyframes drift{from{transform:translate(0,0) scale(1)}to{transform:translate(80px,60px) scale(1.15)}}
  .mani .grid{position:relative;display:grid;grid-template-columns:1.15fr .85fr;gap:36px;align-items:center}
  @media(max-width:820px){.mani .grid{grid-template-columns:1fr;gap:28px}}
  .mani .l{margin:0 0 14px;font-size:clamp(19px,2.6vw,27px);font-weight:800;line-height:1.5;color:var(--ink-dim);word-break:keep-all;opacity:0;transform:translateY(28px);filter:blur(8px);animation:rise .9s cubic-bezier(.2,.8,.2,1) forwards}
  .mani .l b{color:#fff}
  .mani .l1{animation-delay:.15s}.mani .l2{animation-delay:.95s}.mani .l3{animation-delay:1.75s}.mani .l4{animation-delay:2.7s}.mani .l5{animation-delay:3.4s}
  @keyframes rise{to{opacity:1;transform:none;filter:blur(0)}}
  .mani .ok{display:inline-block;background:linear-gradient(135deg,#22c55e,#15803d);color:#fff;border-radius:12px;padding:2px 16px;font-weight:900;box-shadow:0 0 0 0 rgba(34,197,94,.6);animation:okpulse 1.6s ease-out 2.4s infinite}
  @keyframes okpulse{0%{box-shadow:0 0 0 0 rgba(34,197,94,.65)}70%{box-shadow:0 0 0 18px rgba(34,197,94,0)}100%{box-shadow:0 0 0 0 rgba(34,197,94,0)}}
  .mani .big{font-size:clamp(28px,4.6vw,50px);font-weight:900;line-height:1.25;letter-spacing:-.03em;color:#fff;margin-top:22px}
  .mani .l5{margin-top:6px}
  .mani .l5 em{font-style:normal;background:linear-gradient(90deg,#ffd866 0%,#fff6c8 25%,#ffc629 50%,#fff6c8 75%,#ffd866 100%);background-size:200% auto;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shine 2.6s linear 3.6s infinite}
  @keyframes shine{to{background-position:200% center}}
  .mani .under{display:block;width:0;height:6px;border-radius:3px;background:var(--gold-500);margin-top:14px;animation:grow 1s cubic-bezier(.2,.8,.2,1) 4.2s forwards}
  @keyframes grow{to{width:120px}}
  /* 오른쪽 — 관장님 폰: 4분할 영상 + 수락 */
  .mani .phone{position:relative;width:min(340px,100%);margin:0 auto;border-radius:30px;background:#0b1428;border:1px solid var(--line-strong);padding:14px;box-shadow:0 30px 80px rgba(0,0,0,.7),0 0 0 6px #0f1b36;animation:float 5s ease-in-out infinite}
  @keyframes float{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-12px) rotate(1deg)}}
  .mani .ph{font-size:12px;font-weight:900;color:var(--gold-400);margin-bottom:8px;display:flex;justify-content:space-between}
  .mani .ph span{color:var(--ink-dim2)}
  .mani .quad{display:grid;grid-template-columns:1fr 1fr;gap:6px}
  .mani .v{position:relative;aspect-ratio:3/4;border-radius:10px;overflow:hidden;background:linear-gradient(180deg,#1a2a4f,#0a1226);display:flex;align-items:flex-end;justify-content:center;opacity:0;animation:pop .5s cubic-bezier(.2,.9,.3,1.4) forwards}
  .mani .v:nth-child(1){animation-delay:.9s}.mani .v:nth-child(2){animation-delay:1.1s}.mani .v:nth-child(3){animation-delay:1.3s}.mani .v:nth-child(4){animation-delay:1.5s}
  @keyframes pop{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}
  .mani .v video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;image-rendering:pixelated}
  .mani .v::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.35),transparent 30%,transparent 70%,rgba(0,0,0,.35));pointer-events:none}
  .mani .v .rec,.mani .v .nm,.mani .v .bar{z-index:2}
  .mani .v .rec{position:absolute;left:8px;top:8px;font-size:10px;font-weight:900;color:#fff;display:flex;align-items:center;gap:4px}
  .mani .v .rec i{width:8px;height:8px;border-radius:50%;background:#ef4444;animation:blink 1s steps(2) infinite}
  @keyframes blink{to{opacity:0}}
  .mani .v .nm{position:absolute;right:8px;top:8px;font-size:10px;font-weight:900;color:var(--gold-400)}
  .mani .v .bar{position:absolute;left:0;right:0;bottom:0;height:4px;background:rgba(255,255,255,.12)}
  .mani .v .bar i{display:block;height:100%;background:#f5c542;width:0;animation:play 6s linear 1.6s infinite}
  @keyframes play{to{width:100%}}
  .mani .accept{margin-top:10px;display:flex;gap:8px}
  .mani .accept span{flex:1;text-align:center;border-radius:12px;padding:11px 6px;font-size:14px;font-weight:900}
  .mani .accept .no{background:#1c2540;color:#f87171}
  .mani .accept .yes{position:relative;background:linear-gradient(135deg,#22c55e,#15803d);color:#fff;box-shadow:0 8px 24px rgba(34,197,94,.45);animation:okpulse 1.6s ease-out 2.4s infinite}
  .mani .stamp{position:absolute;right:-14px;top:38%;padding:10px 18px;border:4px solid #4ade80;border-radius:14px;color:#4ade80;font-size:26px;font-weight:900;letter-spacing:.06em;background:rgba(4,9,20,.85);transform:rotate(-14deg) scale(4);opacity:0;animation:slam .45s cubic-bezier(.2,.9,.3,1.3) 2.9s forwards;box-shadow:0 0 30px rgba(74,222,128,.5);white-space:nowrap}
  @keyframes slam{to{transform:rotate(-14deg) scale(1);opacity:1}}
  .mani .burst{position:absolute;left:50%;top:50%;width:6px;height:6px;border-radius:50%;background:var(--gold-400);opacity:0;animation:burst .9s ease-out 3.05s forwards}
  @keyframes burst{0%{opacity:1;transform:translate(-50%,-50%) scale(1)}100%{opacity:0;transform:translate(calc(-50% + var(--dx)),calc(-50% + var(--dy))) scale(0)}}
  .mani .hint{margin:14px 0 0;text-align:center;font-size:12px;color:var(--ink-dim2);font-weight:800;opacity:0;animation:rise .8s ease 3.6s forwards}
  @media(prefers-reduced-motion:reduce){.mani *{animation:none!important;opacity:1!important;transform:none!important;filter:none!important}.mani .under{width:120px}.mani .v .bar i{width:60%}}
  footer{margin-top:60px;padding:30px 0 50px;border-top:1px solid var(--line);text-align:center;font-size:12.5px;color:var(--ink-dim2)}
  footer a{color:var(--ink-dim)}