@import "https://fonts.googleapis.com/css2?family=Black+Han+Sans&family=Noto+Sans+KR:wght@300;400;500;700&display=swap";*,:before,:after{box-sizing:border-box}body,html{margin:0;padding:0;overflow:hidden}:root{--primary:#38bdf8;--bright:#7dd3fc;--deep:#0ea5e9;--dark:#060d18;--card:#38bdf80d;--border:#38bdf826;--text:#e0f2fe;--muted:#bae6fd80;--blue-glow:#38bdf84d}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body{scroll-behavior:smooth;height:auto}body{background:var(--dark);color:var(--text);font-family:Noto Sans KR,sans-serif;overflow:hidden auto}.app{min-height:100vh;position:relative;overflow:visible}.sparks{pointer-events:none;z-index:0;position:fixed;inset:0;overflow:hidden}.spark{background:var(--primary);box-shadow:0 0 6px var(--primary);border-radius:50%;animation:linear infinite sparkfall;position:absolute;top:-10px}@keyframes sparkfall{0%{opacity:0;top:-10px}10%{opacity:1}90%{opacity:.3}to{opacity:0;top:110vh}}.hero{z-index:1;justify-content:center;align-items:center;min-height:100vh;display:flex;position:relative;overflow:visible}.hero-bg{background:radial-gradient(at 50% -5%,#38bdf838 0%,#0000 55%),radial-gradient(at 10% 90%,#0ea5e91f 0%,#0000 50%),radial-gradient(at 90% 75%,#7dd3fc14 0%,#0000 50%),linear-gradient(170deg,#060d18 0%,#071525 60%,#04101e 100%);position:absolute;inset:0}.hero-inner{z-index:2;text-align:center;flex-direction:column;align-items:center;gap:clamp(1rem,2.5vh,1.8rem);width:100%;max-width:700px;padding:4rem 1.5rem;display:flex;position:relative}.hero-badge,.hero-title,.hero-date,.countdown,.hero-sub,.scroll-hint{opacity:0;transform:translateY(20px)}.ready .anim-1{animation:.6s cubic-bezier(.22,1,.36,1) .1s forwards fadeUp}.ready .anim-2{animation:.7s cubic-bezier(.22,1,.36,1) .25s forwards fadeUp}.ready .anim-3{animation:.6s cubic-bezier(.22,1,.36,1) .45s forwards fadeUp}.ready .anim-4{animation:.6s cubic-bezier(.22,1,.36,1) .6s forwards fadeUp}.ready .anim-5{animation:.6s cubic-bezier(.22,1,.36,1) .75s forwards fadeUp}.ready .anim-6{animation:.6s cubic-bezier(.22,1,.36,1) .9s forwards fadeUp}@keyframes fadeUp{to{opacity:1;transform:translateY(0)}}.hero-badge{letter-spacing:.25em;color:var(--primary);text-shadow:0 0 10px #38bdf880;background:#38bdf812;border:1px solid #38bdf84d;border-radius:30px;padding:.35rem 1.2rem;font-size:clamp(.6rem,1.5vw,.72rem)}.hero-title{flex-direction:column;align-items:center;gap:.1em;line-height:1;display:flex}.ht-year{color:var(--primary);text-shadow:0 0 40px #38bdf8b3,0 0 80px #0ea5e94d;font-family:Black Han Sans,sans-serif;font-size:clamp(4rem,18vw,20rem);line-height:1}.ht-main{color:#fff;text-shadow:0 4px 20px #00000080;font-family:Black Han Sans,sans-serif;font-size:clamp(4rem,7vw,10rem);font-weight:500;line-height:1.1}.hero-date{color:var(--bright);letter-spacing:.05em;font-size:clamp(.85rem,4vw,2rem);font-weight:400}.countdown{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#38bdf80d;border:1px solid #38bdf82e;border-radius:16px;align-items:center;gap:clamp(.5rem,2vw,1.4rem);padding:clamp(.8rem,2vw,1.2rem) clamp(1.2rem,4vw,2.5rem);display:flex}.digit-box{flex-direction:column;align-items:center;gap:.2rem;display:flex}.digit-num{color:var(--primary);text-shadow:0 0 20px #38bdf88c;text-align:center;min-width:2ch;font-family:Black Han Sans,sans-serif;font-size:clamp(1.8rem,6vw,3.5rem);line-height:1}.digit-label{color:var(--muted);letter-spacing:.06em;font-size:clamp(.58rem,1.2vw,.72rem)}.cd-sep{color:#38bdf84d;margin-bottom:1rem;font-family:Black Han Sans,sans-serif;font-size:clamp(1.5rem,5vw,3rem);line-height:1}.hero-sub{color:var(--muted);font-size:clamp(.8rem,1.8vw,.92rem);font-weight:300}.scroll-hint{cursor:pointer;flex-direction:column;align-items:center;gap:.3rem;margin-top:.5rem;display:flex}.scroll-text{letter-spacing:.15em;color:var(--muted);font-size:.75rem}.scroll-arrow{color:var(--primary);font-size:1.2rem;animation:1.8s ease-in-out infinite bounce}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(7px)}}.hero-bottom-bar{background:linear-gradient(90deg, transparent, var(--primary), var(--bright), var(--primary), transparent);background-size:200% 100%;height:2px;animation:2.5s linear infinite shimmer;position:absolute;bottom:0;left:0;right:0}@keyframes shimmer{to{background-position:200% 0}}.years-section{z-index:1;flex-direction:column;gap:2rem;max-width:960px;margin:0 auto;padding:clamp(3rem,8vw,5rem) clamp(1rem,3vw,2rem) 4rem;display:flex;position:relative}.section-header{flex-direction:column;gap:.3rem;display:flex}.section-eyebrow{letter-spacing:.25em;color:var(--primary);opacity:.7;font-size:.68rem}.section-title{color:#fff;font-family:Black Han Sans,sans-serif;font-size:clamp(1.6rem,4.5vw,2.8rem)}.section-sub{color:var(--muted);font-size:.88rem;font-weight:300}.year-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;display:grid}.year-card{background:var(--card);border:1px solid var(--border);cursor:pointer;text-align:left;border-radius:16px;flex-direction:column;gap:.45rem;padding:1.8rem 1.5rem;transition:transform .22s,box-shadow .25s,border-color .25s,background .25s;animation:.5s cubic-bezier(.22,1,.36,1) both cardIn;display:flex;position:relative;overflow:hidden}@keyframes cardIn{0%{opacity:0;transform:translateY(28px)}to{opacity:1;transform:translateY(0)}}.year-card:hover,.year-card.active{border-color:var(--accent);box-shadow:0 10px 35px var(--glow);background:#38bdf817;transform:translateY(-3px)}.year-card.active{transform:translateY(0)}.yc-year{color:var(--accent);text-shadow:0 0 18px var(--glow);font-family:Black Han Sans,sans-serif;font-size:clamp(2.2rem,5.5vw,3.2rem);line-height:1}.yc-label{color:var(--muted);font-size:.82rem;font-weight:300}.yc-count{color:#ffffff47;font-size:.76rem}.yc-campuses{flex-wrap:wrap;gap:.35rem;margin-top:.2rem;display:flex}.yc-tag{border:1px solid var(--accent);color:var(--accent);letter-spacing:.04em;border-radius:20px;padding:.12rem .55rem;font-size:.68rem}.yc-arrow{color:var(--accent);opacity:.5;font-size:.75rem;transition:opacity .2s,transform .2s;position:absolute;bottom:1rem;right:1rem}.year-card:hover .yc-arrow,.year-card.active .yc-arrow{opacity:1}.videos-panel{opacity:0;border-radius:16px;max-height:0;transition:max-height .55s cubic-bezier(.22,1,.36,1),opacity .4s;overflow:hidden}.videos-panel.open{opacity:1;max-height:2000px}.videos-panel-inner{border:1px solid var(--border);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#38bdf80a;border-radius:16px;flex-direction:column;gap:1.2rem;padding:clamp(1.2rem,3vw,2rem);animation:.4s cubic-bezier(.22,1,.36,1) both fadeUp;display:flex}.vp-header{align-items:baseline;gap:.4rem;display:flex}.vp-year{text-shadow:0 0 14px;font-family:Black Han Sans,sans-serif;font-size:clamp(1.5rem,4vw,2rem)}.vp-title{color:#fff;font-family:Black Han Sans,sans-serif;font-size:clamp(1rem,3vw,1.5rem)}.thumb-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:.9rem;display:grid}.thumb-card{border:1px solid var(--border);cursor:pointer;text-align:left;background:#ffffff08;border-radius:10px;transition:transform .2s,box-shadow .22s,border-color .22s;animation:.4s cubic-bezier(.22,1,.36,1) both cardIn;overflow:hidden}.thumb-card:hover{border-color:#38bdf873;transform:translateY(-3px);box-shadow:0 8px 28px #38bdf82e}.thumb-img-wrap{aspect-ratio:16/9;background:#0a1a2e;position:relative;overflow:hidden}.thumb-img-wrap img{object-fit:cover;width:100%;height:100%;transition:transform .4s;display:block}.thumb-card:hover .thumb-img-wrap img{transform:scale(1.05)}.thumb-overlay{opacity:0;background:#060d1866;justify-content:center;align-items:center;transition:opacity .22s;display:flex;position:absolute;inset:0}.thumb-card:hover .thumb-overlay{opacity:1}.play-btn{color:#fff;border-radius:50%;justify-content:center;align-items:center;width:48px;height:48px;padding-left:3px;font-size:1rem;transition:transform .2s;display:flex;transform:scale(.85);box-shadow:0 4px 18px #00000073}.thumb-card:hover .play-btn{transform:scale(1)}.thumb-info{align-items:center;gap:.55rem;padding:.7rem .9rem;display:flex}.thumb-campus{color:#fff;letter-spacing:.04em;border-radius:20px;flex-shrink:0;padding:.12rem .5rem;font-size:.68rem;font-weight:600}.thumb-label{color:var(--text);font-size:.85rem;font-weight:400}.site-footer{z-index:1;text-align:center;color:var(--muted);border-top:1px solid var(--border);padding:1.5rem;font-size:.8rem;font-weight:300;position:relative}.modal-backdrop{z-index:1000;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#040a14e0;justify-content:center;align-items:center;padding:1rem;animation:.25s both backdropIn;display:flex;position:fixed;inset:0}@keyframes backdropIn{0%{opacity:0}to{opacity:1}}.modal-box{flex-direction:column;gap:.8rem;width:100%;max-width:860px;animation:.3s cubic-bezier(.22,1,.36,1) both modalIn;display:flex}@keyframes modalIn{0%{opacity:0;transform:scale(.95)translateY(20px)}to{opacity:1;transform:scale(1)translateY(0)}}.modal-close{color:#fff;cursor:pointer;background:#ffffff14;border:1px solid #ffffff26;border-radius:50%;justify-content:center;align-self:flex-end;align-items:center;width:36px;height:36px;font-size:.9rem;transition:background .2s,transform .15s;display:flex}.modal-close:hover{background:var(--accent);transform:rotate(90deg)}.modal-title{text-shadow:0 0 12px;font-family:Black Han Sans,sans-serif;font-size:clamp(1rem,3vw,1.4rem)}.modal-frame{background:#000;border:1px solid #38bdf833;border-radius:12px;padding-top:56.25%;position:relative;overflow:hidden;box-shadow:0 0 60px #38bdf833}.modal-frame iframe{border:none;width:100%;height:100%;position:absolute;inset:0}@media (width<=480px){.year-grid{grid-template-columns:1fr 1fr}.thumb-grid{grid-template-columns:1fr}.countdown{gap:.4rem;padding:.8rem}}