/* /_app/base.css — 사이트 공통 부품 (3-9, 스킨규격 v1.5). 스킨 <style>보다 먼저 → 스킨이 덮어쓸 수 있다. 색은 스킨의 --aml-* 변수(없으면 옛 --aml-modal-* 등). */
body{--_bg:var(--aml-bg,var(--aml-modal-bg,#fff));--_pn:var(--aml-panel,var(--aml-card-bg,var(--aml-modal-bg,#f5f5f7)));--_ink:var(--aml-text,var(--aml-modal-text,#1d1d1f));--_ink2:var(--aml-muted,color-mix(in srgb,var(--_ink) 64%,var(--_pn)));--_ac:var(--aml-accent,var(--aml-viz-color,#6b4eff));--_acf:var(--aml-accent-fill,var(--_ac));--_aci:var(--aml-accent-ink,#fff);--_ln:var(--aml-line,rgb(127 127 127/.22));--_p3:var(--aml-panel-2,color-mix(in srgb,var(--_ink) 9%,var(--_pn)));--_gl:var(--aml-glass,color-mix(in srgb,var(--_pn) 80%,transparent));--_ez:cubic-bezier(.4,0,.2,1)}
.aml-ic{width:20px;height:20px;flex:none;display:inline-block;vertical-align:middle;fill:none}
.aml-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* 곡 줄 */
.aml-play{position:relative;overflow:hidden;padding:0}
.aml-thumb{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:cover;border-radius:inherit;pointer-events:none;z-index:0}
.aml-play::before,.aml-play::after{z-index:1}
.aml-track{position:relative;isolation:isolate}
.aml-track-main{position:relative;min-width:0}
.aml-track.has-tools .aml-track-main{padding-right:var(--aml-tools-w,calc(var(--aml-tools-n,1)*38px))}
.aml-track-tools{position:absolute;right:0;top:50%;transform:translateY(-50%);display:flex;gap:2px;align-items:center}
.aml-tool{display:inline-grid;place-items:center;width:36px;height:36px;padding:0;border:0;border-radius:50%;background:transparent;color:inherit;font:inherit;font-size:11px;cursor:pointer;opacity:.8}
.aml-tool:hover,.aml-tool:focus-visible{opacity:1;background:color-mix(in srgb,currentColor 10%,transparent)}
.aml-tool .aml-ic{width:19px;height:19px}
/* 비주얼라이저: 줄 폭 70% */
.aml-track>.aml-viz{position:absolute;left:15%;right:15%;bottom:0;height:80%;display:flex;align-items:flex-end;gap:var(--aml-viz-gap,3px);z-index:-1;pointer-events:none;color:var(--aml-viz-color,var(--_ac));opacity:var(--aml-viz-opacity,.22)}
.aml-viz-bar{display:block;flex:1;height:100%;background:currentColor;border-radius:3px 3px 0 0;transform-origin:50% 100%;transform:scaleY(.12);will-change:transform}
.aml-viz-mini{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:2px;background:rgb(0 0 0/.42);color:#fff;opacity:0;transition:opacity .2s}
.aml-viz-mini .aml-viz-bar{flex:none;width:3px;height:46%;border-radius:2px;transform-origin:50% 50%}
.is-playing .aml-viz-mini{opacity:1}
/* 재생 바 (#id 로 옛 스킨 배치보다 우선) */
#aml-player.aml-player{position:fixed;z-index:40;top:auto;bottom:calc(16px + env(safe-area-inset-bottom));left:calc(var(--aml-player-left,0px) + 16px);right:16px;width:auto;max-width:760px;height:64px;margin:0 auto;display:flex;align-items:center;gap:12px;padding:0 12px 0 10px;border:0;border-radius:16px;background:var(--_gl);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);box-shadow:0 8px 24px rgb(0 0 0/.14),0 0 0 .5px var(--_ln);color:var(--_ink);font-family:var(--aml-font,inherit);font-size:14px;line-height:1.3;box-sizing:border-box;grid-template:none}
#aml-player.aml-player[hidden],#aml-fullplayer[hidden]{display:none}
#aml-player .aml-player-art{position:relative;flex:none;width:44px;height:44px;padding:0;border:0;border-radius:6px;overflow:hidden;background:var(--_p3);cursor:pointer}
#aml-player .aml-player-art img{width:100%;height:100%;object-fit:cover;display:block}
#aml-player .aml-player-info{flex:1;min-width:0;display:grid;cursor:pointer;grid-area:auto}
#aml-player .aml-player-title{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:inherit}
#aml-player .aml-player-artist{font-size:12px;color:var(--_ink2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#aml-player .aml-player-controls,#aml-player .aml-player-right{display:flex;align-items:center;gap:4px;grid-area:auto}
#aml-player .aml-player-btn,#aml-fullplayer .aml-player-btn{display:grid;place-items:center;width:36px;height:36px;padding:0;margin:0;border:0;border-radius:50%;background:none;color:inherit;font-size:14px;cursor:pointer;box-shadow:none}
#aml-player .aml-player-btn:hover{background:var(--_p3)}
#aml-player .aml-player-btn .aml-ic{width:22px;height:22px;fill:currentColor}
#aml-player .aml-toggle,#aml-fullplayer .aml-toggle{background:var(--_ink);color:var(--_bg)}
#aml-player .aml-toggle{width:32px;height:32px}
#aml-player .aml-toggle .aml-ic{width:16px;height:16px}
#aml-player .aml-player-time{font-size:12px;color:var(--_ink2);font-variant-numeric:tabular-nums;white-space:nowrap;margin:0 4px;grid-area:auto}
#aml-player .aml-player-vol{display:flex;align-items:center}
#aml-player .aml-player-vol input{width:80px}
#aml-player [hidden],#aml-fullplayer [hidden],.aml-tool[hidden]{display:none}
#aml-player .aml-player-seek{position:absolute;left:14px;right:14px;bottom:0;width:auto;height:12px;margin:0;transform:translateY(50%);grid-area:auto}
#aml-player .aml-player-notice{position:absolute;left:12px;right:12px;bottom:calc(100% + 8px);padding:8px 12px;border-radius:10px;background:var(--_ink);color:var(--_bg);font-size:13px;text-align:center}
#aml-player .aml-player-notice:empty{display:none}
.aml-rng{-webkit-appearance:none;appearance:none;background:none;cursor:pointer;padding:0;--p:0%;accent-color:var(--_ac)}
.aml-rng::-webkit-slider-runnable-track{height:3px;border-radius:3px;background:linear-gradient(to right,var(--_ac) var(--p),var(--_p3) var(--p))}
.aml-rng::-moz-range-track{height:3px;border-radius:3px;background:linear-gradient(to right,var(--_ac) var(--p),var(--_p3) var(--p))}
.aml-rng::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;margin-top:-4.5px;border:0;border-radius:50%;background:var(--_ac);opacity:0;transition:opacity .15s}
.aml-rng::-moz-range-thumb{width:12px;height:12px;border:0;border-radius:50%;background:var(--_ac);opacity:0}
.aml-rng:hover::-webkit-slider-thumb,.aml-rng:focus-visible::-webkit-slider-thumb,#aml-fullplayer .aml-rng::-webkit-slider-thumb{opacity:1}
.aml-rng:hover::-moz-range-thumb,.aml-rng:focus-visible::-moz-range-thumb,#aml-fullplayer .aml-rng::-moz-range-thumb{opacity:1}
#aml-player .aml-player-seek::-webkit-slider-runnable-track{height:2px}
#aml-player .aml-player-seek::-moz-range-track{height:2px}
body.aml-has-player{padding-bottom:max(var(--aml-pad-bottom,0px),96px)}
@media (max-width:733px){#aml-player.aml-player{left:8px;right:8px;bottom:calc(8px + env(safe-area-inset-bottom));gap:8px;padding:0 6px 0 8px}
#aml-player .aml-prev,#aml-player .aml-player-right{display:none}#aml-player .aml-player-seek{pointer-events:none;left:12px;right:12px}}
/* 전체 화면 재생 */
#aml-fullplayer{position:fixed;inset:0;z-index:70;display:flex;flex-direction:column;align-items:center;overflow-y:auto;padding:calc(8px + env(safe-area-inset-top)) 24px calc(24px + env(safe-area-inset-bottom));background:linear-gradient(to bottom,color-mix(in srgb,var(--_ac) 18%,var(--_bg)),var(--_bg) 80%);color:var(--_ink);font-family:var(--aml-font,inherit);transform:translateY(100%);visibility:hidden;transition:transform .4s var(--_ez),visibility 0s .4s;box-sizing:border-box}
#aml-fullplayer.is-open{transform:none;visibility:visible;transition:transform .4s var(--_ez)}
.aml-fp-top{width:100%;max-width:420px;display:flex;justify-content:space-between;align-items:center}
.aml-fp-sp{width:36px}.aml-fp-grab{width:40px;height:5px;border-radius:3px;background:var(--_p3)}
.aml-fp-art{width:min(80vw,340px,44vh);aspect-ratio:1;border-radius:12px;overflow:hidden;margin:24px 0 28px;background:var(--_p3);box-shadow:0 16px 40px rgb(0 0 0/.25);transition:transform .4s var(--_ez)}
#aml-fullplayer:not(.is-playing) .aml-fp-art{transform:scale(.88)}
.aml-fp-art img{width:100%;height:100%;object-fit:cover;display:block}
.aml-fp-body{width:100%;max-width:420px;display:grid;gap:18px}
.aml-fp-title{font-size:22px;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.aml-fp-artist{color:var(--_ink2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.aml-fp-seek input{width:100%;height:20px;margin:0}
.aml-fp-times{display:flex;justify-content:space-between;font-size:12px;color:var(--_ink2);font-variant-numeric:tabular-nums}
.aml-fp-ctrl{display:flex;justify-content:center;align-items:center;gap:28px}
#aml-fullplayer .aml-fp-ctrl .aml-player-btn{width:56px;height:56px}
#aml-fullplayer .aml-player-btn .aml-ic{width:30px;height:30px;fill:currentColor}
#aml-fullplayer .aml-fp-ctrl .aml-toggle{width:68px;height:68px}
.aml-fp-more{display:flex;justify-content:center;min-height:44px}
body.aml-lock{overflow:hidden}
/* 창·방명록·SNS·칩 */
.aml-banner{margin:0}.aml-banner-img{display:block;width:100%;height:auto;max-height:400px;object-fit:cover}
.aml-profile{display:block;width:96px;height:96px;border-radius:50%;object-fit:cover}
.aml-footer{color:var(--aml-footer-color,inherit);font-size:12px;opacity:.8;text-align:center;padding:14px 16px;display:flex;gap:6px 14px;justify-content:center;flex-wrap:wrap}
.aml-footer a{color:inherit;text-decoration:none}
.aml-ad{margin:12px auto;max-width:100%;overflow:hidden;text-align:center}
.aml-modal{position:fixed;inset:0;background:rgb(0 0 0/.5);display:flex;align-items:center;justify-content:center;padding:16px;z-index:80}
.aml-modal[hidden]{display:none}
.aml-modal-box{background:var(--aml-modal-bg,var(--_bg));color:var(--aml-modal-text,var(--_ink));width:100%;max-width:520px;max-height:80vh;overflow:auto;border-radius:16px;padding:20px 22px;position:relative;box-shadow:0 10px 40px rgb(0 0 0/.35);font-family:var(--aml-font,inherit)}
.aml-modal-close{position:absolute;right:8px;top:8px;width:36px;height:36px;border:0;border-radius:50%;background:transparent;color:inherit;font-size:24px;line-height:1;cursor:pointer}
.aml-modal-title{margin:0 40px 12px 0;font-size:17px}
.aml-lyrics-text{white-space:pre-wrap;line-height:1.75;margin:0}
.aml-pop{position:fixed;z-index:85;min-width:200px;max-width:calc(100vw - 16px);padding:6px;border-radius:12px;background:var(--_bg);color:var(--_ink);box-shadow:0 10px 32px rgb(0 0 0/.2),0 0 0 .5px var(--_ln);font:14px/1.3 var(--aml-font,inherit)}
.aml-pop[hidden]{display:none}
.aml-pop button{display:flex;align-items:center;gap:10px;width:100%;min-height:38px;padding:6px 10px;border:0;border-radius:8px;background:none;color:inherit;font:inherit;text-align:start;cursor:pointer}
.aml-pop button:hover,.aml-pop button:focus-visible{background:var(--_p3);outline:none}
.aml-pop .aml-ic{color:var(--_ink2)}
.aml-song-card{display:flex;align-items:center;gap:10px;padding:8px;border:1px solid var(--aml-line,rgb(127 127 127/.3));border-radius:10px;background:var(--aml-card-bg,transparent);max-width:420px}
.aml-song-card-img{width:44px;height:44px;border-radius:8px;object-fit:cover;flex:none;background:rgb(127 127 127/.2)}
.aml-song-card-info{display:flex;flex-direction:column;min-width:0;flex:1}
.aml-song-card-title{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.aml-song-card-artist{font-size:13px;opacity:.75}
.aml-song-card-play{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;border:1px solid var(--aml-line,rgb(127 127 127/.45));background:transparent;color:inherit;cursor:pointer;flex:none}
.aml-song-card-play .aml-ic{width:14px;height:14px;fill:currentColor}
.aml-song-card.is-deleted{opacity:.6;font-size:13px}
.aml-song-card.is-playing{border-color:var(--aml-viz-color,currentColor)}
.aml-gb-pageno{font-size:13px;opacity:.75}
.aml-loading{opacity:.6}
.aml-gb-form{display:flex;flex-direction:column;gap:8px;margin:0 0 20px;max-width:640px}
.aml-gb-form input,.aml-gb-form textarea{font:inherit;color:inherit;background:var(--aml-card-bg,transparent);border:1px solid var(--aml-line,rgb(127 127 127/.45));border-radius:8px;padding:8px 10px;width:100%;box-sizing:border-box}
.aml-gb-form textarea{min-height:84px;resize:vertical}
.aml-gb-about{display:flex;align-items:center;gap:8px}
.aml-gb-row{display:flex;align-items:center;gap:10px;justify-content:space-between}
.aml-gb-count{font-size:12px;opacity:.75}
.aml-gb-submit,.aml-gb-pager button,.aml-gb-del{font:inherit;color:inherit;background:transparent;border:1px solid var(--aml-line,rgb(127 127 127/.45));border-radius:999px;padding:6px 16px;cursor:pointer}
.aml-gb-submit{font-weight:600}
.aml-gb-msg{margin:0;font-size:13px;min-height:1em}
.aml-gb-msg.is-err{color:#d70015}
.aml-hp{position:absolute!important;left:-10000px!important;top:auto!important;width:1px!important;height:1px!important;overflow:hidden!important;opacity:0!important}
.aml-gb-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px;max-width:640px}
.aml-gb-post{display:flex;flex-direction:column;gap:6px;padding:12px 0;border-top:1px solid var(--aml-line,rgb(127 127 127/.3))}
.aml-gb-head{display:flex;gap:10px;align-items:baseline}
.aml-gb-time{font-size:12px;opacity:.75}
.aml-gb-body{margin:0;white-space:pre-wrap;word-break:break-word}
.aml-gb-pager{display:flex;gap:10px;align-items:center;margin-top:14px}
.aml-gb-pager button:disabled{opacity:.4;cursor:default}
.aml-socials{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:8px 0;padding:0;list-style:none}
.aml-socials li{margin:0;padding:0}
.aml-social{display:inline-flex;align-items:center;gap:10px;color:var(--aml-social-color,currentColor);text-decoration:none;line-height:1.2}
.aml-social:hover,.aml-social:focus-visible{opacity:.75}
.aml-social-icon{width:22px;height:22px;fill:currentColor;flex:none;display:block}
.aml-socials .aml-social-name{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.aml-view-links .aml-socials{flex-direction:column;align-items:stretch;max-width:480px}
.aml-view-links .aml-social{display:flex;color:inherit;padding:12px 14px;border:1px solid var(--aml-line,rgb(127 127 127/.35));border-radius:10px;background:var(--aml-card-bg,transparent)}
.aml-view-links .aml-social-icon{color:var(--aml-social-color,currentColor)}
.aml-view-links .aml-social-name{position:static;width:auto;height:auto;overflow:visible;clip:auto;font-weight:600}
.aml-social.is-highlight{border-color:var(--aml-social-color,currentColor);box-shadow:0 0 0 1px var(--aml-social-color,currentColor)}
.aml-links-home{display:inline-block;margin-top:8px}
.aml-ext{display:inline-block;font-size:11px;line-height:1.4;padding:1px 7px;border-radius:999px;border:1px solid var(--aml-line,rgb(127 127 127/.35));color:var(--aml-ext-color,inherit);opacity:.8;white-space:nowrap;max-width:14em;overflow:hidden;text-overflow:ellipsis;vertical-align:middle}
.aml-empty-ic{display:none}
.aml-more-link{font-size:15px;font-weight:400;text-decoration:none;color:var(--_ac);white-space:nowrap}
@media (max-width:600px){.aml-lyrics-btn,.aml-gb-btn{display:none!important}.aml-track.has-tools .aml-track-main{padding-right:var(--aml-tools-w,38px)}}
.aml-section-title .aml-more-link{margin-inline-start:12px}
@media (prefers-reduced-motion:reduce){#aml-fullplayer,#aml-player *{transition:none!important;animation:none!important}}
