:root{--orchid:#d5a8e3;--deep:#714a7c;--ink:#2b2230;--sky:#f5fafc}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--sky);color:var(--ink)}body{font-family:Arial,"Noto Sans KR",sans-serif;overflow:hidden}button,input{font:inherit}button,a{color:inherit}button{border:0;background:none;cursor:pointer}
.siteHeader{position:fixed;z-index:100;inset:0 0 auto;height:88px;display:flex;align-items:center;padding:0 38px;pointer-events:none}.brand,.topNav{pointer-events:auto}.brand{display:block;width:148px;height:58px}.brand img{width:100%;height:100%;object-fit:contain;object-position:left center}.topNav{margin-left:auto;display:flex;align-items:center;gap:22px;color:#60436a;font-size:15px;font-weight:900;letter-spacing:.12em}.topNav span{display:block;white-space:nowrap}
.hero{position:relative;width:100vw;height:100svh;min-height:680px;overflow:hidden;background:var(--sky)}.heroLettering{position:absolute;z-index:0;background:center/contain no-repeat;opacity:.82;pointer-events:none}.heroKy{top:10%;left:3%;width:min(20vw,340px);aspect-ratio:751/748;background-image:url("assets/kyma-hero-ky.png")}.heroMa{right:2.5%;bottom:7%;width:min(22.67vw,394px);aspect-ratio:963/753;background-image:url("assets/kyma-hero-ma.png")}
.carouselScene{position:absolute;z-index:5;left:50%;top:47%;width:min(1000px,78vw);height:490px;transform:translate(-50%,-50%);perspective:1250px;perspective-origin:50% 48%}.carousel{position:absolute;left:50%;top:50%;width:320px;height:180px;aspect-ratio:16/9;margin:-90px 0 0 -160px;transform:translateZ(var(--carousel-depth,-180px)) rotateY(var(--carousel-rotation,0deg));transform-style:preserve-3d;will-change:transform;cursor:grab;touch-action:pan-y;user-select:none}.carouselSpin{position:absolute;inset:0;transform-style:preserve-3d;animation:carouselAutoSpin 30s linear infinite;will-change:transform}.carousel.carouselMotionPaused .carouselSpin,.carousel.dragging .carouselSpin{animation-play-state:paused}@keyframes carouselAutoSpin{to{transform:rotateY(360deg)}}.carousel.dragging{cursor:grabbing}.youtubeCard{position:absolute;inset:0;display:block;transform-style:preserve-3d;text-decoration:none;will-change:transform;-webkit-user-drag:none;pointer-events:none}.cardFace{position:absolute;inset:0;display:block;overflow:hidden;border-radius:2px;backface-visibility:hidden;-webkit-backface-visibility:hidden}.cardFace img{width:100%;height:100%;object-fit:cover;-webkit-user-drag:none;pointer-events:none}.cardFront{border:1px solid #7a4e8838;background:#f0e2f4;box-shadow:0 24px 55px #49295338;pointer-events:auto}.cardFront img{transition:transform .35s ease,filter .35s ease}.cardFront::after{content:"";position:absolute;inset:auto 0 0;height:48%;background:linear-gradient(transparent,#180d1ddb)}.cardBack{transform:rotateY(180deg);border:1px solid #c28ed160;background:#e8ccef70;box-shadow:0 18px 48px #6d42752b;opacity:.56;pointer-events:none}.cardBack img{opacity:.22;filter:blur(5px) saturate(.7);transform:scaleX(-1) scale(1.08)}.cardBack::after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,#f9ecf7b8,#b66bc060);backdrop-filter:blur(3px)}.cardBackMark{position:absolute;z-index:2;left:50%;top:50%;transform:translate(-50%,-50%) rotate(-90deg);color:#fff;font-size:20px;font-weight:900;letter-spacing:.32em;opacity:.65}.youtubeCardCopy{position:absolute;z-index:2;left:18px;right:18px;bottom:17px;color:#fff}.youtubeCardCopy strong{display:block;font-size:18px;line-height:1.18;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.youtubeCardCopy small{display:block;margin-top:5px;color:#ffffffb8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.youtubeCard:hover .cardFront img{transform:scale(1.055);filter:saturate(1.1)}.emptyMessage{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(360px,80vw);margin:0;padding:22px;border:1px solid #915ba159;background:#ffffffd1;backdrop-filter:blur(12px);color:#704c79;text-align:center;font-size:13px;line-height:1.6}
.heroMeta{position:absolute;z-index:8;left:38px;bottom:32px;display:flex;align-items:flex-end;gap:16px;color:#65456d}.heroMeta span{font-size:11px;font-weight:900;letter-spacing:.24em}.heroMeta p{margin:7px 0 0;font-size:10px;letter-spacing:.1em}.footerAdmin{margin-bottom:1px;color:#92739a;font-size:9px;font-weight:900;letter-spacing:.05em;text-decoration:none}.footerAdmin:hover{color:#ad6bc0}
.musicDock{position:absolute;z-index:20;right:28px;top:104px;width:292px;padding:18px;border:1px solid #83529147;background:#ffffffd1;backdrop-filter:blur(16px);box-shadow:0 18px 55px #42274b1a}.trackCopy{min-width:0}.eyebrow{display:block;color:#9c6faa;font-size:9px;font-weight:900;letter-spacing:.19em}.trackCopy strong{display:block;margin-top:6px;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.trackCopy small{display:block;margin-top:4px;color:#8a748e;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.musicControls{display:flex;align-items:center;justify-content:center;gap:17px;margin:15px 0 12px}.musicControls button{width:32px;height:32px;color:#6b4a74;font-size:16px}.musicControls .playBtn{width:42px;height:42px;border-radius:50%;background:#c895d7;color:#fff}.progressWrap{display:grid;grid-template-columns:34px 1fr 34px;align-items:center;gap:6px;color:#8a748e;font-size:9px}.progressWrap span:last-child{text-align:right}input[type=range]{width:100%;height:3px;accent-color:#b97dca}.volumeWrap{display:flex;align-items:center;gap:8px;margin-top:10px}.volumeWrap button{color:#8d6698;font-size:9px;font-weight:900;letter-spacing:.1em}.volumeWrap input{max-width:88px}
.playerMount{position:relative;width:100%;min-width:200px;aspect-ratio:16/9;overflow:hidden;border:1px solid #a977b550;border-radius:14px;background:#17121a;box-shadow:inset 0 1px #ffffff2b,0 12px 30px #3e27451c}
.playerMount>div,.playerMount iframe{display:block;width:100%!important;height:100%!important;border:0}
.musicDockSummary{display:flex;align-items:center;gap:12px;min-height:51px;padding-top:12px}.compactTrack{min-width:0;flex:1}.compactTrack span{display:block;color:#9c6faa;font-size:8px;letter-spacing:.15em}.compactTrack strong{display:block;margin-top:3px;overflow:hidden;color:#604868;font-size:13px;font-weight:400;text-overflow:ellipsis;white-space:nowrap}.musicDrawerToggle{display:inline-flex;flex:0 0 auto;align-items:center;gap:5px;min-height:34px;padding:7px 9px;border:1px solid #cba7d370;border-radius:10px;background:linear-gradient(180deg,#fff,#f7ecfa);box-shadow:inset 0 1px #fff,0 3px 8px #66406f12;color:#76557f;font-size:10px;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}.musicDrawerToggle:hover{border-color:#c58bcf;box-shadow:inset 0 1px #fff,0 7px 15px #66406f1a;transform:translateY(-2px)}.musicDrawerToggle:focus-visible{outline:3px solid #ddb0e6;outline-offset:2px}.musicDrawerToggle svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8;transition:transform .32s ease}.musicDock.expanded .musicDrawerToggle svg{transform:rotate(180deg)}.musicDockDrawer{max-height:0;overflow:hidden;visibility:hidden;opacity:0;transform:translateY(-8px);pointer-events:none;transition:max-height .42s ease,opacity .25s ease,transform .32s ease,visibility 0s linear .42s}.musicDock.expanded .musicDockDrawer{max-height:clamp(240px,calc(100svh - 460px),650px);overflow-x:hidden;overflow-y:auto;visibility:visible;opacity:1;transform:translateY(0);pointer-events:auto;transition:max-height .46s ease,opacity .3s ease .08s,transform .36s ease .04s,visibility 0s}.musicDockDrawer>.trackCopy{margin-top:8px}
.accountArea{display:flex;min-width:0;align-items:center;gap:9px;margin-left:3px}.accountArea>[hidden]{display:none!important}.accountLogin,.accountLogout,.accountAdmin{display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:6px 10px;border:1px solid #c9a9d066;border-radius:10px;color:#76557f;font-size:13px;font-weight:400;line-height:1;text-decoration:none;white-space:nowrap;transition:transform .18s ease,border-color .18s ease,background .18s ease,box-shadow .18s ease}.accountLogin{min-height:38px;padding:7px 12px;background:linear-gradient(180deg,#fff,#fbf5fc);box-shadow:inset 0 1px #fff,0 2px 0 #e2cee6,0 7px 16px #66406f10}.accountAdmin{border-color:#c99bd272;background:#f7ecfa;color:#8b4f9a}.accountLogout{border-color:transparent;background:#ffffffa6;color:#856e8a}.accountLogin:hover,.accountAdmin:hover,.accountLogout:hover{border-color:#c58bcf;background:#f4e4f7;box-shadow:0 7px 16px #66406f16;transform:translateY(-1px)}.accountLogin:focus-visible,.accountAdmin:focus-visible,.accountLogout:focus-visible{outline:3px solid #ddb0e6;outline-offset:2px}.accountName{display:inline-flex;min-width:0;max-width:190px;min-height:34px;align-items:center;overflow:hidden;padding:6px 10px;border:1px solid #d8bddc6b;border-radius:999px;background:#ffffffbd;color:#674a70;font-size:13px;font-weight:400;line-height:1;text-overflow:ellipsis;white-space:nowrap}.accountModal{position:fixed;z-index:300;inset:0;display:grid;place-items:center;padding:20px;background:#2d18355c;backdrop-filter:blur(8px);pointer-events:auto}.accountModal[hidden],.accountForm[hidden]{display:none}.accountPanel{position:relative;width:min(440px,100%);padding:32px;border:1px solid #a574b14d;background:#fbf7fc;box-shadow:0 28px 80px #2c163d4d}.accountPanel>span{color:#a772b5;font-size:9px;font-weight:900;letter-spacing:.2em}.accountPanel h2{margin:8px 0 6px;font-size:36px;letter-spacing:-.05em}.accountPanel>p{margin:0;color:#826e87;font-size:11px;line-height:1.55}.accountClose{position:absolute;right:15px;top:12px;width:34px;height:34px;color:#795582;font-size:25px}.accountTabs{display:grid;grid-template-columns:1fr 1fr;margin-top:24px;border-bottom:1px solid #b995c34d}.accountTabs button{padding:11px;color:#9b859f;font-size:11px;font-weight:900}.accountTabs button.active{border-bottom:2px solid #a56ab5;color:#704779}.accountForm{display:grid;gap:13px;margin-top:20px}.accountForm label{display:grid;gap:6px;color:#725a78;font-size:10px;font-weight:900}.accountForm input{width:100%;padding:12px;border:1px solid #b995c34d;background:#fff;color:#35283a;outline:none}.accountForm input:focus{border-color:#b276c4;box-shadow:0 0 0 3px #c895d71f}.accountForm>button{padding:12px;background:#9863a7;color:#fff;font-size:12px;font-weight:900}.accountForm>button:disabled{opacity:.55;cursor:wait}.accountError{min-height:14px;margin:0;color:#bd4f6e;font-size:10px}.accountToast{position:fixed;z-index:360;left:50%;top:24px;max-width:min(460px,calc(100% - 32px));padding:13px 18px;background:#50315a;color:#fff;font-size:12px;box-shadow:0 14px 42px #2b18363b;opacity:0;transform:translate(-50%,-14px);pointer-events:none;transition:opacity .25s,transform .25s}.accountToast.show{opacity:1;transform:translate(-50%,0)}.accountToast.error{background:#913f5a}
@media(max-width:900px){.siteHeader{height:72px;padding:0 18px}.brand{width:112px;height:46px}.topNav{gap:15px;font-size:13px}.hero{min-height:620px}.heroKy{top:12%;left:2%;width:24vw}.heroMa{right:1%;bottom:24%;width:28vw}.carouselScene{top:43%;width:100vw;height:390px}.carousel{width:224px;height:126px;margin:-63px 0 0 -112px}.youtubeCardCopy{left:12px;right:12px;bottom:12px}.youtubeCardCopy strong{font-size:14px}.musicDock{top:auto;left:16px;right:16px;bottom:58px;width:auto;padding:13px 15px}.trackCopy{padding-right:130px}.musicControls{position:absolute;right:13px;top:7px;margin:0;gap:5px}.musicControls button{width:28px;height:28px}.musicControls .playBtn{width:38px;height:38px}.progressWrap{margin-top:10px}.volumeWrap{display:none}.heroMeta{left:18px;bottom:20px}.heroMeta p{display:block}}
@media(max-width:520px){.carouselScene{top:40%}.carousel{width:192px;height:108px;margin:-54px 0 0 -96px}.heroKy{width:28vw}.heroMa{bottom:29%;width:32vw}.footerAdmin{font-size:8px}.topNav{gap:9px}.topNav>span:not(.accountName){display:none}.accountName{max-width:110px}.accountLogin{padding:7px 9px}.accountPanel{padding:25px 20px}.accountPanel h2{font-size:31px}}

/* KYMA UI typography and soft navigation */
body{font-family:"Jua",sans-serif}button,input,select,textarea{font:inherit}
.topNav{flex-wrap:nowrap;gap:5px;font-weight:400;letter-spacing:.02em;white-space:nowrap}
.navPill{display:inline-flex!important;align-items:center;justify-content:center;min-width:62px;min-height:39px;padding:7px 14px 8px;border:1px solid #cba7d38c;border-radius:11px;background:linear-gradient(180deg,#fff,#f7ecfa);box-shadow:inset 0 1px 0 #fff,0 2px 0 #d7b9dc,0 7px 17px #66406f14;color:#694871;font-family:"Jua",sans-serif;font-size:15px;line-height:1;letter-spacing:0;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background .18s ease}
.navPill>span{display:flex;align-items:center;justify-content:center;height:1em;line-height:1;transform:translateY(1px)}
.navPage:hover,.noticePill:hover{border-color:#c58bcf;background:linear-gradient(180deg,#fff,#f1dcf5);box-shadow:inset 0 1px 0 #fff,0 4px 0 #cda6d4,0 12px 24px #66406f20;transform:translateY(-2px)}.navPage:active{box-shadow:inset 0 2px 4px #895c921f,0 1px 0 #cba7d3,0 5px 12px #66406f15;transform:translateY(2px)}
.navPage.active{border-color:#b978c6;background:linear-gradient(180deg,#edcef2,#dfb5e7);color:#58335f;box-shadow:inset 0 1px 1px #fff,0 3px 0 #bd8dc6,0 9px 22px #73487d20}.navPage:focus-visible{outline:3px solid #ddb0e6;outline-offset:3px}.noticePill{cursor:default}
.youtubeCardCopy{font-family:Arial,"Noto Sans KR",sans-serif}
.heroMeta{font-family:Arial,"Noto Sans KR",sans-serif}.heroMeta span{font-weight:900;letter-spacing:.2em}.heroMeta p{font-weight:600;letter-spacing:.06em}

/* Hide the browsing caret on display text while preserving real form editing. */
body{caret-color:transparent}
input,textarea,[contenteditable="true"]{caret-color:auto}
.musicDock{width:min(392px,calc(100vw - 56px));border-radius:18px;background:#ffffffdf}
.playerMount+.trackCopy{margin-top:15px}
.musicControls button{border-radius:10px;transition:transform .18s ease,background .18s ease,box-shadow .18s ease}.musicControls button:hover{background:#f4e7f6;box-shadow:0 7px 16px #60416c18;transform:translateY(-2px)}.musicControls button:active{transform:scale(.94)}
.playlistPanel{margin-top:15px;padding-top:13px;border-top:1px solid #c8a9cf45}.playlistPanel header{display:flex;align-items:baseline;gap:7px;margin-bottom:9px}.playlistPanel header span{color:#a06dad;font-size:8px;letter-spacing:.14em}.playlistPanel header strong{color:#604868;font-size:12px;font-weight:400}
.playlistPanel,.playlistPanel button,.playlistPanel a{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans KR",Arial,sans-serif}
.playlist{display:grid;gap:5px;max-height:252px;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#cda3d5 transparent}
.playlistItem{display:grid;grid-template-columns:44px minmax(0,1fr) 22px;align-items:center;gap:8px;min-height:52px;padding:4px 6px 4px 4px;border:1px solid transparent;border-radius:11px;background:#fff8;transition:transform .18s ease,border-color .18s ease,background .18s ease,box-shadow .18s ease}.playlistItem:hover{border-color:#d5addc;background:#fff;box-shadow:0 8px 20px #60416c12;transform:translateY(-2px)}.playlistItem.active{border-color:#c58bcf;background:#f7ecfa;box-shadow:inset 0 1px #fff,0 7px 17px #60416c13}
.playlistItem img{width:44px;height:44px;border-radius:8px;object-fit:cover}.playlistItem>button{min-width:0;padding:2px;text-align:left}.playlistItem strong,.playlistItem small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.playlistItem strong{font-size:11px;font-weight:600}.playlistItem small{margin-top:3px;color:#907a95;font-size:9px;font-weight:400}.playlistItem>a{display:grid;width:22px;height:22px;place-items:center;border-radius:7px;color:#9770a0;font-size:9px;text-decoration:none}.playlistItem>a:hover{background:#ead7ee}.playlistNow{display:none;margin-bottom:2px;color:#9b5baa;font-size:7px;font-weight:600;letter-spacing:.06em}.playlistItem.active .playlistNow{display:block}.drawerNote{margin:0;padding:16px 8px;color:#927e96;font-size:10px;text-align:center}
@media(max-width:900px){.topNav{gap:6px;font-size:12px}.navPill{min-width:58px;min-height:37px;padding:6px 11px 7px;border-radius:11px;font-size:14px}.accountArea{gap:8px;margin-left:1px}.accountName{max-width:150px}.accountLogin,.accountLogout,.accountAdmin{font-size:12px}.volumeWrap{display:flex}.playlist{max-height:205px}.playerMount{width:calc(100% + 30px);min-height:200px;margin:-13px -15px 0;border-radius:17px 17px 12px 12px;aspect-ratio:16/9}.musicDockSummary{min-height:48px;padding-top:10px}.musicDock.expanded .musicDockDrawer{max-height:clamp(220px,calc(100svh - 350px),520px)}.musicDockDrawer>.trackCopy{margin-top:7px}.trackCopy{padding-right:0}.musicControls{position:static;margin:12px 0 10px;gap:10px}}
@media(max-width:640px){.siteHeader{align-items:flex-start;min-height:72px}.topNav{max-width:calc(100vw - 142px);flex-wrap:wrap;justify-content:flex-end;padding-top:16px;row-gap:6px}.accountArea.signedIn{width:100%;justify-content:flex-end}.accountArea.signedIn .accountName{max-width:100px}}
@media(max-width:520px){.topNav{gap:4px;max-width:calc(100vw - 126px);padding-top:17px}.navPill{min-width:48px;min-height:35px;padding:5px 9px 6px;font-size:13px}.accountArea{gap:6px}.accountName{max-width:82px;padding-inline:8px}.accountLogin,.accountLogout,.accountAdmin{min-height:32px;padding:5px 8px;font-size:12px}.accountLogin{min-height:35px}.accountArea.signedIn .accountName{max-width:82px}.playlistItem{grid-template-columns:42px minmax(0,1fr) 22px}.playlistItem img{width:42px;height:42px}}
@media(prefers-reduced-motion:reduce){.musicDockDrawer,.musicDrawerToggle,.musicDrawerToggle svg{transition-duration:.01ms!important}}
.accountToast:empty{display:none!important}
