@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@500;600;700&family=Noto+Serif+KR:wght@400;500;700&display=swap');
:root{--bg:#090715;--violet:#8f6cf1;--pink:#d69be9;--ink:#eee8ff;--muted:#a99cc9;--line:#6f59a155}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 50% 0,#261848 0,#0b0819 42%,#05040c 100%);color:var(--ink);font-family:'Noto Serif KR',serif;cursor:crosshair;overflow-x:hidden}body:before{content:"";position:fixed;inset:0;background:radial-gradient(circle at 50% 16%,#8d68d31b 0 1px,transparent 2px),radial-gradient(circle at 22% 34%,#dfb8ff22 0 1px,transparent 2px),radial-gradient(circle at 78% 26%,#c18fff1c 0 1px,transparent 2px),linear-gradient(#05030b33,#05030bcc);background-size:130px 130px,190px 190px,240px 240px,100% 100%;z-index:-3}.mist{position:fixed;inset:0;background:radial-gradient(ellipse at 50% 80%,#b86cff22,transparent 48%);pointer-events:none;z-index:-1}.top{height:78px;position:fixed;z-index:30;top:0;left:0;right:0;display:flex;align-items:center;padding:0 5vw;background:#090715d9;border-bottom:1px solid var(--line);backdrop-filter:blur(16px)}.brand{color:white;text-decoration:none;display:grid;grid-template-columns:36px auto;grid-template-rows:26px 16px;align-items:center}.brand>span{grid-row:1/3;font-size:29px;color:#d4b5ff}.brand b{letter-spacing:7px}.brand small{font:10px 'Cormorant Garamond';letter-spacing:2px;color:var(--muted)}nav{margin-left:auto;display:flex;gap:30px}nav a{color:#cfc5e9;text-decoration:none;font-size:13px;letter-spacing:1px}nav a:hover{color:white;text-shadow:0 0 12px #b693ff}.install{margin-left:24px;background:#8d6bd31c;color:#e9ddff;border:1px solid #9c7ce36b;border-radius:4px;padding:9px 12px}.hero{min-height:100vh;padding-top:78px;display:grid;place-items:center;position:relative}.arch{width:min(850px,88vw);height:min(700px,78vh);border:1px solid #9c82d455;border-radius:390px 390px 18px 18px;position:relative;display:grid;place-items:center;background:radial-gradient(circle at 50% 22%,#6f4db733 0 2px,transparent 3px),radial-gradient(circle at 34% 38%,#d7b0ff22 0 1px,transparent 2px),linear-gradient(180deg,#21164d 0%,#120b2d 46%,#080612 100%);box-shadow:inset 0 0 80px #0a0617,0 0 80px #6d45c318}.arch:before,.arch:after{content:"❧ ❦ ❧ ❦ ❧";position:absolute;top:6%;color:#4e3c72;font-size:28px;writing-mode:vertical-rl;letter-spacing:22px}.arch:before{left:-24px}.arch:after{right:-24px}.moon{position:absolute;top:8%;font-size:90px;color:#f1d7ff;text-shadow:0 0 30px #c878ff}.hero-copy{text-align:center;padding-top:70px;text-shadow:0 2px 20px #05020a}.hero-copy>p:first-child{font:15px 'Cormorant Garamond';letter-spacing:9px;color:#c5aaf0}.hero h1{font-size:clamp(42px,7vw,82px);margin:12px 0 14px;letter-spacing:8px}.sub{color:#d3c9e6}.live{display:inline-flex;gap:9px;align-items:center;border:1px solid #8f78b7;border-radius:20px;padding:7px 14px;font-size:11px;letter-spacing:2px}.live i{width:7px;height:7px;background:#777;border-radius:50%}.live.on{border-color:#e46dbe;box-shadow:0 0 18px #e46dbe55}.live.on i{background:#ff62c3;box-shadow:0 0 12px #ff62c3;animation:pulse 1s infinite}.enter{display:inline-block;margin-top:25px;color:white;text-decoration:none;border:1px solid #8f75c7;padding:13px 24px;background:#261843aa}.lantern{position:absolute;top:20%;font-size:42px;color:#ffe9ff;text-shadow:0 0 25px #eaa9ff}.l1{left:12%}.l2{right:12%;top:30%}.butterfly{position:absolute;color:#d6b4ff;text-shadow:0 0 12px #b48aff;animation:float 4s ease-in-out infinite}.b1{left:24%;top:40%}.b2{right:18%;bottom:24%;animation-delay:-2s}.section{width:min(1120px,90vw);margin:0 auto;padding:110px 0;min-height:75vh}.title{text-align:center;margin-bottom:45px}.title span{font:13px 'Cormorant Garamond';color:#8e74c8;letter-spacing:4px}.title h2{font:600 38px 'Cormorant Garamond','Noto Serif KR';letter-spacing:7px;margin:6px}.title p{font-size:11px;letter-spacing:4px;color:var(--muted)}.glass{background:linear-gradient(135deg,#24173d99,#0d091aaa);border:1px solid var(--line);box-shadow:0 18px 50px #0006,inset 0 0 35px #8b62ce0d;backdrop-filter:blur(14px)}.profile-grid{display:grid;grid-template-columns:360px 1fr;gap:55px;align-items:center}.portrait{position:relative;border:1px solid #765da4;padding:13px}.portrait-art{height:470px;position:relative;overflow:hidden;background:radial-gradient(circle at 50% 22%,#7354c144 0 2px,transparent 3px),linear-gradient(180deg,#20154a 0%,#120b2b 58%,#080611 100%)}.portrait-art:before{content:"☾";position:absolute;top:34px;left:50%;transform:translateX(-50%);font-size:78px;color:#f2d9ff;text-shadow:0 0 28px #c87dff}.portrait-art:after{content:"❦   🦋   ❦\A 𓆩✦𓆪\A ❧   ✧   ❧";white-space:pre;position:absolute;left:0;right:0;bottom:55px;text-align:center;line-height:2.2;font-size:25px;color:#a485d6;text-shadow:0 0 12px #8053c7}.frame-label{position:absolute;bottom:28px;left:0;right:0;text-align:center;letter-spacing:9px;font:24px 'Cormorant Garamond'}.info{padding:38px}.info h3{font-size:32px}.info h3 em{font:15px 'Cormorant Garamond';color:#aa91d6;margin-left:10px}.info dl{display:grid;grid-template-columns:130px 1fr;gap:0}.info dt,.info dd{margin:0;padding:13px;border-bottom:1px solid #5b497544}.info dt{color:#9f87c9}.links button,.song-tools input,.song-tools select{background:#0d091a;color:#ddd;border:1px solid #665188;padding:11px 14px}.cards{display:grid;grid-template-columns:1fr 1fr;gap:20px}.cards article{padding:28px}.cards b,.cards small{color:#a98be0}.notice{overflow:hidden}.notice button{width:100%;display:grid;grid-template-columns:90px 1fr 80px;text-align:left;padding:19px 24px;background:none;border:0;border-bottom:1px solid #5c487244;color:#ddd}.notice b{color:#c29be9}.notice time{text-align:right;color:#83749d}.calendar{padding:30px}.cal-head{display:flex;justify-content:center;gap:30px;align-items:center}.cal-head button{background:none;border:0;color:#c8aef5;font-size:30px}.week,.days{display:grid;grid-template-columns:repeat(7,1fr)}.week b{text-align:center;color:#8e7cab;padding:14px}.day{min-height:92px;border:1px solid #4d3a6544;padding:9px;color:#cfc4df}.day.muted{opacity:.25}.day.today{box-shadow:inset 0 0 0 1px #b784e9;background:#7c54ad18}.day .event{display:block;margin-top:8px;font-size:10px;color:#e6c9ff}.song-tools{display:flex;gap:10px;margin-bottom:20px}.song-tools input{flex:1}.songs{display:grid;gap:10px}.song{display:grid;grid-template-columns:50px 1fr 130px;align-items:center;padding:16px 20px;border-bottom:1px solid #5a456d55;background:#120c20aa}.song strong{font-weight:500}.song small{color:#8d7ba6}.song em{font-style:normal;color:#b28cda;text-align:right}.bgm{position:fixed;z-index:35;left:24px;bottom:22px;display:flex;align-items:center;gap:12px;padding:11px 13px;min-width:290px}.bgm button{border:1px solid #795ca1;background:#1d1231;color:white;width:32px;height:32px}.bgm div{display:flex;flex-direction:column;min-width:110px}.bgm b{font:14px 'Cormorant Garamond'}.bgm small{font-size:8px;color:#89789d;letter-spacing:2px}.bgm input[type=range]{width:70px}footer{text-align:center;padding:50px 20px 110px;color:#5e4f75;font:12px 'Cormorant Garamond';letter-spacing:4px}#particles{position:fixed;inset:0;pointer-events:none;z-index:50}.particle{position:absolute;animation:fade .9s forwards;color:#d6b5ff;text-shadow:0 0 8px #ba7cff}@keyframes fade{to{opacity:0;transform:translateY(-28px) scale(.2) rotate(40deg)}}@keyframes float{50%{transform:translateY(-18px) rotate(8deg)}}@keyframes pulse{50%{opacity:.35}}
@media(max-width:800px){.top{height:64px;padding:0 16px}.brand small{display:none}nav{position:fixed;bottom:0;left:0;right:0;margin:0;background:#090714f2;border-top:1px solid var(--line);padding:13px 8px;justify-content:space-around;gap:4px}nav a{font-size:10px}.install{margin-left:auto;font-size:10px;padding:7px}.hero{padding-top:64px}.arch{height:72vh}.moon{font-size:62px}.profile-grid{grid-template-columns:1fr}.portrait{max-width:390px;margin:auto}.cards{grid-template-columns:1fr}.section{padding:80px 0}.calendar{padding:12px}.day{min-height:64px;font-size:11px}.day .event{font-size:8px}.bgm{left:10px;bottom:65px;min-width:0}.bgm input[type=range]{display:none}.song{grid-template-columns:38px 1fr 75px}.notice button{grid-template-columns:54px 1fr 45px;padding:15px 12px;font-size:11px}}
/* multi-page additions */
.inner-page{padding-top:78px;min-height:100vh}.page-banner{min-height:330px;display:grid;place-items:center;text-align:center;position:relative;background:radial-gradient(circle at 50% 10%,#8e62cf35 0 2px,transparent 3px),radial-gradient(circle at 20% 60%,#d0a9ff18 0 1px,transparent 2px),linear-gradient(180deg,#25184a 0%,#120b29 64%,#090713 100%);border-bottom:1px solid var(--line)}.page-banner:after{content:"☾  ✦  🦋  ✦  ☽";position:absolute;bottom:24px;letter-spacing:18px;color:#b99be9aa}.page-banner h1{font:600 clamp(40px,6vw,72px) 'Cormorant Garamond','Noto Serif KR';letter-spacing:9px;margin:0}.page-banner p{color:#b9a9d0;letter-spacing:4px;font-size:12px}.page-banner .crumb{display:inline-block;margin-bottom:15px;color:#8f77bb;font:12px 'Cormorant Garamond';letter-spacing:3px}.home-menu{width:min(1040px,90vw);margin:-60px auto 80px;position:relative;z-index:5;display:grid;grid-template-columns:repeat(5,1fr);gap:14px}.home-menu a{min-height:150px;padding:24px 12px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#eee6ff;text-decoration:none;background:linear-gradient(160deg,#271845dd,#100b20e8);border:1px solid #71589266;box-shadow:0 16px 40px #0008;transition:.25s}.home-menu a:hover{transform:translateY(-7px);border-color:#b491e4;box-shadow:0 18px 48px #5b39933d}.home-menu b{font:24px 'Cormorant Garamond','Noto Serif KR';letter-spacing:2px}.home-menu span{font-size:28px;margin-bottom:10px}.home-menu small{margin-top:7px;color:#8976a8;font-size:9px;letter-spacing:2px}.top nav a.active{color:white;text-shadow:0 0 14px #c7a5ff;position:relative}.top nav a.active:after{content:"";height:1px;background:#c19bed;position:absolute;left:0;right:0;bottom:-10px}.page-content{min-height:calc(100vh - 330px)}
@media(max-width:800px){.inner-page{padding-top:64px}.page-banner{min-height:260px}.home-menu{grid-template-columns:repeat(2,1fr);margin-top:-30px}.home-menu a:last-child{grid-column:1/3}.page-banner h1{letter-spacing:5px}.top nav a.active:after{bottom:-7px}}

.arch .vine{position:absolute;inset:22px;border:1px solid #745aa34a;border-radius:360px 360px 12px 12px;pointer-events:none}.arch .vine:before,.arch .vine:after{content:'❦  ✿  ❧  ✿  ❦';position:absolute;top:15%;bottom:12%;width:42px;color:#6e568e;font-size:22px;writing-mode:vertical-rl;letter-spacing:18px}.arch .vine:before{left:-9px}.arch .vine:after{right:-9px;transform:scaleX(-1)}.arch .stars{position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 16% 24%,#fff 0 1px,transparent 2px),radial-gradient(circle at 72% 18%,#e8cbff 0 1px,transparent 2px),radial-gradient(circle at 84% 68%,#fff 0 1px,transparent 2px),radial-gradient(circle at 28% 74%,#d9bbff 0 1px,transparent 2px),radial-gradient(circle at 60% 48%,#fff 0 1px,transparent 2px)}

/* v4: reference-inspired moon / butterfly / lantern theme — no rose vines */
.arch:before,.arch:after,.arch .vine{display:none!important}
.arch{overflow:hidden;border-color:#8d72d06b;background:radial-gradient(ellipse at 50% 86%,#8f63d32b 0%,transparent 44%),linear-gradient(180deg,#17113d 0%,#241854 43%,#0b0819 100%);box-shadow:inset 0 0 110px #06030f,0 0 90px #7956c72b}
.moon{font-size:112px;top:7%;filter:drop-shadow(0 0 16px #e4bfff);animation:moonGlow 4s ease-in-out infinite}
.lantern{width:54px;height:82px;border:2px solid #342550;border-radius:8px 8px 15px 15px;background:linear-gradient(90deg,#6f56a5 0 9%,#f4dcff 15% 85%,#6f56a5 91%);box-shadow:0 0 32px #d8a9ff99,inset 0 0 18px #fff;top:17%;font-size:0;transform-origin:50% -40px;animation:lanternSwing 5s ease-in-out infinite}
.lantern:before{content:"";position:absolute;width:2px;height:72px;background:#4c3869;left:50%;bottom:100%}
.lantern:after{content:"✦";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:19px;color:#8d64c5;text-shadow:none}
.l1{left:10%;transform:scale(.9)}.l2{right:9%;top:28%;transform:scale(.68);animation-delay:-2s}
.butterfly{font-size:0;width:32px;height:22px;filter:drop-shadow(0 0 9px #d7b9ff);animation:butterflyFly 5s ease-in-out infinite}
.butterfly:before,.butterfly:after{content:"";position:absolute;top:1px;width:17px;height:20px;background:linear-gradient(135deg,#f4eaff,#a779f1);border-radius:85% 15% 70% 30%;transform-origin:100% 70%}
.butterfly:before{left:0;transform:rotate(28deg)}.butterfly:after{right:0;transform:scaleX(-1) rotate(28deg)}
.b1{left:20%;top:44%}.b2{right:17%;bottom:27%;transform:scale(.72);animation-delay:-2.2s}
.arch .stars{background:radial-gradient(circle at 16% 24%,#fff 0 1px,transparent 2px),radial-gradient(circle at 72% 18%,#e8cbff 0 1px,transparent 2px),radial-gradient(circle at 84% 68%,#fff 0 1px,transparent 2px),radial-gradient(circle at 28% 74%,#d9bbff 0 1px,transparent 2px),radial-gradient(circle at 60% 48%,#fff 0 1px,transparent 2px),radial-gradient(circle at 43% 66%,#f3dcff 0 1px,transparent 2px);animation:starPulse 3s ease-in-out infinite}
.hero-copy{z-index:3}.enter{border-radius:999px;background:#2e2056a8;box-shadow:0 0 20px #8e66ca2c}.enter:hover{border-color:#d6b8ff;box-shadow:0 0 28px #b184ef55}
.home-menu a span{filter:drop-shadow(0 0 9px #b58be9)}
.page-banner:after{content:"☾   ✦   🦋   ✦   ◇";color:#c5a7f0aa}
footer{font-size:0}footer:after{content:"☾  MIMYO'S NIGHT GARDEN · MOONLIGHT & BUTTERFLY  ☽";font-size:12px}
@keyframes moonGlow{50%{text-shadow:0 0 45px #d9a6ff,0 0 80px #8f63e855}}
@keyframes lanternSwing{0%,100%{rotate:-3deg}50%{rotate:3deg}}
@keyframes butterflyFly{0%,100%{translate:0 0;rotate:-5deg}45%{translate:18px -24px;rotate:7deg}70%{translate:-8px -12px;rotate:-2deg}}
@keyframes starPulse{50%{opacity:.65}}
/* v5 generated night-garden artwork */
.hero{background:linear-gradient(180deg,#07051044,#070510cc),url('night-garden-generated.png') center/cover no-repeat fixed}
.arch{background:linear-gradient(180deg,#0b071455,#130b2a88);backdrop-filter:blur(1px);box-shadow:inset 0 0 110px #06030f88,0 0 90px #7956c744}
.arch .vine{display:none}
.page-banner{background:linear-gradient(180deg,#0b071488,#120b29e6),url('night-garden-generated.png') center 35%/cover no-repeat}
@media(max-width:800px){.hero{background-attachment:scroll;background-position:center}.page-banner{background-position:center}}

/* Notice list: clickable cards */
.notice a.notice-row{width:100%;display:grid;grid-template-columns:90px 1fr 80px;text-align:left;padding:19px 24px;background:none;border-bottom:1px solid #5c487244;color:#ddd;text-decoration:none;transition:.2s}
.notice a.notice-row:hover{background:#8f6cf112;box-shadow:inset 3px 0 0 #b991ef}
.notice a.notice-row b{color:#c29be9}.notice a.notice-row time{text-align:right;color:#83749d}
.notice-detail{padding:34px}.notice-detail .meta{display:flex;gap:12px;align-items:center;color:#8f7aa9;font-size:12px;border-bottom:1px solid #5c487244;padding-bottom:18px;margin-bottom:28px}.notice-detail .tag{color:#d2adff}.notice-detail h2{font-size:28px;margin:0 0 14px}.notice-body{white-space:pre-line;line-height:2;color:#d7cee5}.back-notice{display:inline-block;margin-top:30px;color:#d8c4f5;text-decoration:none;border:1px solid #71589266;padding:10px 16px}
@media(max-width:800px){.notice a.notice-row{grid-template-columns:54px 1fr 45px;padding:15px 12px;font-size:11px}}
/* CMS-driven content additions */
.profile-image{width:100%;height:470px;object-fit:cover;display:block;background:#100b20}.links{display:flex;gap:10px;flex-wrap:wrap}.link-btn{display:inline-flex;align-items:center;justify-content:center;padding:10px 14px;border:1px solid #71589266;color:#eee6ff;text-decoration:none;background:#1a112c}.cms-card{overflow:hidden}.cms-card img{width:100%;height:180px;object-fit:cover;margin:-1px -1px 18px;width:calc(100% + 2px)}.notice-image{display:block;max-width:100%;max-height:560px;object-fit:contain;margin:24px auto;border:1px solid #71589266}.song-cover{width:42px;height:42px;object-fit:cover;border-radius:4px}.empty{padding:30px;text-align:center;color:#8f7fa7}.admin-entry{margin-left:18px;color:#6e5c82;text-decoration:none;font-size:9px;letter-spacing:2px}

/* v10 mobile navigation fix */
@media (max-width:800px){
  body{padding-bottom:0}
  .top{height:64px;padding:0 12px;display:flex;flex-wrap:nowrap;gap:8px}
  .brand{grid-template-columns:28px auto;grid-template-rows:24px 0;min-width:0;flex:0 1 auto}
  .brand>span{font-size:24px}
  .brand b{font-size:15px;letter-spacing:3px;white-space:nowrap}
  .brand small{display:none}
  .install{margin-left:auto;flex:0 0 auto;max-width:112px;padding:7px 9px;font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  nav{
    position:fixed;
    top:64px;
    bottom:auto;
    left:0;
    right:0;
    height:48px;
    margin:0;
    padding:0 10px;
    display:flex;
    align-items:center;
    justify-content:flex-start;
    gap:8px;
    overflow-x:auto;
    overflow-y:hidden;
    white-space:nowrap;
    background:#090714f6;
    border-top:0;
    border-bottom:1px solid var(--line);
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
  }
  nav::-webkit-scrollbar{display:none}
  nav a{flex:0 0 auto;font-size:11px;line-height:1;padding:12px 13px;border:1px solid transparent;border-radius:18px}
  nav a.active{background:#27183d;border-color:#6f5596}
  .top nav a.active:after{display:none}
  .hero{padding-top:112px;min-height:calc(100vh - 48px)}
  .inner-page{padding-top:112px}
  .bgm{left:10px;bottom:10px;max-width:calc(100vw - 20px)}
}

@media (max-width:390px){
  .brand b{font-size:14px;letter-spacing:2px}
  .install{max-width:92px;font-size:8px;padding:7px 8px}
  nav a{font-size:10px;padding:11px 11px}
}

/* v11: 업보 상태를 완료/진행중으로 확실하게 구분 */
.karma-card{position:relative;border:1px solid rgba(166,130,214,.28);transition:border-color .2s,box-shadow .2s,transform .2s}
.karma-card.karma-done{border-color:rgba(129,214,191,.48);background:linear-gradient(145deg,rgba(25,52,51,.52),rgba(20,14,38,.82));box-shadow:inset 0 0 0 1px rgba(156,238,213,.06)}
.karma-card.karma-progress{border-color:rgba(193,151,255,.56);background:linear-gradient(145deg,rgba(64,38,103,.58),rgba(20,14,38,.84));box-shadow:0 0 24px rgba(147,91,227,.10),inset 0 0 0 1px rgba(205,171,255,.06)}
.karma-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.karma-top>b{font-size:11px;letter-spacing:.08em;color:#a99abf}
.karma-status{display:inline-flex;align-items:center;justify-content:center;min-width:76px;padding:7px 11px;border-radius:999px;font-size:11px;font-weight:800;letter-spacing:.04em;border:1px solid transparent;white-space:nowrap}
.karma-status.done{color:#c9fff0;background:rgba(45,124,106,.28);border-color:rgba(115,226,193,.48)}
.karma-status.progress{color:#f0dcff;background:rgba(132,72,206,.34);border-color:rgba(194,145,255,.58);box-shadow:0 0 14px rgba(166,103,238,.12)}
.karma-status.etc{color:#ddd2ee;background:rgba(100,82,124,.24);border-color:rgba(167,143,198,.35)}
.karma-card h3{margin-top:4px}
.notice-missing{color:#a99abf;margin:12px 0 22px;line-height:1.7}
@media(max-width:600px){.karma-top{align-items:flex-start}.karma-status{min-width:70px;padding:6px 9px;font-size:10px}}


/* v13: mobile menu centered + compact enough for small screens */
@media (max-width:800px){
  nav{
    justify-content:center;
    gap:5px;
    padding-left:6px;
    padding-right:6px;
  }
  nav a{font-size:10px;padding:11px 9px}
}
@media (max-width:360px){
  nav{gap:2px;padding-left:3px;padding-right:3px}
  nav a{font-size:9px;padding:10px 6px}
}