/* 최신 미오카 자산을 데스크톱과 모바일 화면에 배치합니다. */
:root{--paper:#f4f0e8;--ink:#302a27;--muted:#70665e;--wine:#713d3e;--line:#d9d0c5;--serif:Georgia,'Yu Mincho','Batang',serif;--sans:'Yu Gothic','Malgun Gothic',sans-serif}*{box-sizing:border-box}html{scroll-behavior:auto;scroll-padding-top:25px}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--serif)}button,input{font:inherit}a{color:inherit;text-decoration:none}button,a{touch-action:manipulation}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #bc824b;outline-offset:5px}img{display:block;max-width:100%}p{line-height:1.9}button{color:inherit}button:disabled{cursor:default}figure{margin:0}header{height:106px;padding:0 5%;display:flex;align-items:center;gap:35px;border-bottom:1px solid var(--line)}.wordmark{font-size:27px;letter-spacing:-.02em;white-space:nowrap}.wordmark span{display:block;font:10px var(--sans);letter-spacing:.18em;margin-top:8px}nav{display:flex;gap:28px;margin-left:auto;font:12px var(--sans)}.channel{font:12px var(--sans);border-left:1px solid var(--line);padding-left:30px}.hero{display:grid;grid-template-columns:45% 55%;min-height:635px;max-width:1680px;margin:auto}.hero-copy{padding:65px 10% 25px 11%;display:flex;flex-direction:column;align-items:flex-start}.eyebrow{font:10px/1.6 var(--sans);letter-spacing:.17em;color:var(--muted);margin:0 0 23px}h1{font-size:clamp(40px,4.4vw,70px);line-height:1.45;font-weight:400;letter-spacing:.05em;margin:6px 0 14px}.french{font-style:italic;font-size:22px;color:var(--wine);margin:0 0 21px}.lede{font-size:14px;margin-bottom:25px;color:var(--muted)}.button{border:1px solid var(--wine);background:var(--wine);color:#fff8ef;padding:16px 24px;display:inline-flex;gap:45px;align-items:center;font:12px/1.5 var(--sans)}.text-link{display:inline-block;font:12px/1.7 var(--sans);border-bottom:1px solid currentColor;padding-bottom:5px;margin-top:19px}.hero-foot{display:flex;gap:20px;justify-content:space-between;border-top:1px solid var(--line);width:100%;padding-top:20px;margin-top:auto;font:9px var(--sans);letter-spacing:.12em}.hero-copy>.text-link{margin-bottom:36px}.hero-image{position:relative;min-height:635px}.hero-image>img{width:100%;height:100%;position:absolute;object-fit:cover;object-position:50% 45%}.hero-image figcaption{position:absolute;bottom:0;left:0;right:0;display:flex;justify-content:space-between;background:linear-gradient(transparent,#151515b5);color:#fff;padding:70px 30px 25px;font-style:italic;font-size:17px}.hero-image figcaption span{font:10px var(--sans);align-self:end}.latest{display:flex;gap:25px;align-items:center;padding:21px 5%;border-block:1px solid var(--line);background:#e9e2d8}.latest .eyebrow{margin:0}.latest img{width:66px;height:66px;object-fit:cover}.latest h2{font-size:20px;font-weight:400;margin:0 0 5px}.latest p{font-size:12px;margin:0;color:var(--muted)}.latest button{margin-left:auto;border:0;background:none;font:12px var(--sans)}.latest>a{font:11px var(--sans);border-bottom:1px solid}.section{padding:90px 7%;max-width:1500px;margin:auto}h2{font-weight:400;font-size:36px;line-height:1.6;margin:0 0 15px}.album{display:grid;grid-template-columns:48% 1fr;gap:12%;align-items:center}.album-art{position:relative;padding-right:12%;padding-bottom:12px}.album-art>img{position:relative;width:100%;box-shadow:0 20px 30px #3223222b}.record{position:absolute;right:0;top:5%;width:85%;aspect-ratio:1;border-radius:50%;background:repeating-radial-gradient(#292523 0 2px,#38312c 3px 4px);box-shadow:4px 12px 18px #0002}.record:after{content:'';position:absolute;inset:35%;border-radius:50%;background:#713d3e}.album .eyebrow{margin-bottom:14px}.pill{font:10px var(--sans);display:inline-block;border:1px solid #9b7e66;padding:7px 12px;letter-spacing:.1em;margin-bottom:15px}.album h2{font-size:clamp(27px,3vw,42px)}.album-copy>p:not(.eyebrow):not(.french){font-size:13px}.album dl{border-block:1px solid var(--line);padding:15px 0;display:flex;gap:40px}.album dl div{display:flex;gap:15px;font:12px var(--sans)}dt{color:var(--muted)}dd{margin:0}.album-note{color:var(--muted)}.music{border-top:1px solid var(--line)}.section-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:28px}.section-head .eyebrow{margin-bottom:10px}.section-head>p,.section-head>span{font:12px var(--sans);color:var(--muted)}.controls{display:flex;gap:25px;align-items:center;justify-content:space-between;border-block:1px solid var(--line);padding:15px 0}.filters{display:flex;gap:8px;flex-wrap:wrap}.filters button{border:1px solid transparent;background:transparent;padding:10px 12px;font:11px var(--sans)}.filters button[aria-pressed=true]{border-color:var(--wine);color:var(--wine);background:#713d3e08}input{width:280px;border:0;border-bottom:1px solid var(--line);padding:10px 0;background:transparent;font:11px var(--sans);color:var(--ink)}.result-count{font:10px var(--sans);color:var(--muted);margin:16px 0 23px}.song-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:38px 24px}.song-card{min-width:0}.cover-button{border:0;padding:0;display:block;position:relative;background:#ded9d1;width:100%}.cover-button img{width:100%;aspect-ratio:4/3;object-fit:contain;transition:filter .2s}.cover-button:hover img{filter:brightness(.9)}.cover-button span{position:absolute;right:10px;bottom:10px;background:#f4f0e8e8;padding:10px 12px;font:10px var(--sans)}.song-meta{display:flex;justify-content:space-between;margin:15px 0 9px;font:9px var(--sans);letter-spacing:.06em;color:var(--muted)}.song-card h3{font-size:17px;line-height:1.6;font-weight:400;margin:0 0 5px}.song-card .translation{font:italic 12px/1.6 var(--serif);color:var(--muted);margin:0;min-height:38px}.song-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:13px;font:10px var(--sans)}.song-actions button{background:none;border:0;padding:0 0 4px;border-bottom:1px solid currentColor;font:inherit}.song-actions a{border-bottom:1px solid currentColor;padding-bottom:4px}.status-label{font:10px/1.6 var(--sans);color:var(--muted)}.indie{background:#37443f;color:#f0ece0;display:grid;grid-template-columns:1fr 1fr;gap:8%;max-width:none;padding-inline:9%;align-items:center}.indie .eyebrow{color:#bdc8bd}.indie p{font-size:13px}.light{background:transparent;border-color:#b5c0b2;margin-top:12px}.indie-stack{display:grid;grid-template-columns:1fr 1fr;gap:18px;transform:rotate(-3deg);padding:20px}.indie-stack img{width:100%;aspect-ratio:4/3;object-fit:cover;border:7px solid #f0ece0;box-shadow:5px 10px 20px #0002}.indie-stack img:nth-child(2){transform:translateY(30px) rotate(6deg)}.compilation{display:grid;grid-template-columns:1fr 1fr;gap:45px;align-items:center;background:#e9e2d8}.compilation>img{width:100%;aspect-ratio:4/3;object-fit:cover}.compilation>div{padding:25px 30px 25px 0}.compilation h3{font-size:26px;font-weight:400;line-height:1.6}.compilation p{font-size:13px}.compilation .text-link{display:block;width:fit-content}.playlist-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:22px;margin-top:40px}.playlist img{aspect-ratio:16/10;object-fit:cover;width:100%;margin-bottom:13px}.playlist h3{font:13px/1.6 var(--serif);margin:0 0 6px}.playlist p{font:10px/1.6 var(--sans);color:var(--muted)}.playlist span{font:10px var(--sans)}.about{display:grid;grid-template-columns:40% 1fr;gap:12%;align-items:center;border-top:1px solid var(--line)}.about>figure{align-self:start;position:sticky;top:35px}.about figure img{width:100%;height:auto;aspect-ratio:1254/1254}.about figcaption{font-size:18px;border-bottom:1px solid var(--line);padding:20px 0}.about figcaption span{display:block;font:10px var(--sans);margin-top:8px;color:var(--muted)}.about h3{font-size:17px;font-weight:400;margin:24px 0 10px}.about .about-intro{color:var(--wine)}.about p{font-size:14px}.about .disclosure{font:11px/1.8 var(--sans);color:var(--muted);max-width:420px}footer{padding:45px 7%;background:#e9e2d8;text-align:center}.footer-brand{font-size:32px}footer p,footer small{font:10px/1.9 var(--sans);color:var(--muted)}dialog{border:1px solid var(--line);background:var(--paper);color:var(--ink);width:min(900px,94vw);max-height:92vh;padding:22px}dialog::backdrop{background:#1c1918b8}.player-head{display:flex;gap:20px;justify-content:space-between;align-items:center;margin-bottom:18px}.player-head h2{font-size:21px;margin:0}.player-head button{border:1px solid var(--line);padding:10px;background:transparent;white-space:nowrap;font:12px var(--sans)}#player-frame iframe{width:100%;aspect-ratio:16/9;border:0;display:block}dialog p,dialog>a{font:12px/1.8 var(--sans)}dialog>a{border-bottom:1px solid}[hidden]{display:none!important}
@media(max-width:1000px){header{gap:20px;padding:0 4%}nav{gap:17px}.channel{display:none}.hero-copy{padding:40px 8%}.hero{min-height:560px}.hero-image{min-height:560px}.hero-foot{flex-direction:column;gap:10px}.latest{gap:18px}.latest .eyebrow{display:none}.song-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.section{padding:65px 5%}.playlist-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.album{gap:6%}.controls{align-items:start;flex-direction:column}.compilation{gap:25px}.compilation h3{font-size:23px}}
@media(max-width:650px){header{height:auto;min-height:105px;align-items:start;padding:20px 5%;gap:20px;flex-direction:column}.wordmark{font-size:24px}nav{margin:0;gap:26px;font-size:11px}.hero{display:flex;flex-direction:column-reverse}.hero-image{min-height:0;height:360px}.hero-image>img{object-position:center 40%}.hero-image figcaption{font-size:14px;padding:40px 20px 15px}.hero-copy{padding:32px 6%}.hero h1{font-size:42px;line-height:1.4;margin-top:0}.hero .eyebrow{font-size:8px;margin-bottom:15px}.french{font-size:19px}.hero-foot{display:none}.hero-copy>.text-link{margin-bottom:0}.latest{display:grid;grid-template-columns:54px 1fr;gap:12px 16px;padding:20px 6%}.latest img{width:54px;height:54px}.latest h2{font-size:18px}.latest button{grid-column:2;margin:0;text-align:left;padding:5px 0}.latest>a{grid-column:2;width:fit-content}.section{padding:45px 6%}.album{grid-template-columns:1fr;gap:35px}.album-art{max-width:380px;margin:0 auto;width:100%}.album-copy h2{font-size:30px}.album dl{gap:25px}.section-head{flex-direction:column;align-items:start;gap:0}h2{font-size:29px}.controls{gap:18px}.filters{gap:2px}.filters button{font-size:10px;padding:9px}.controls input{width:100%}.song-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 15px}.song-card h3{font-size:15px}.song-card .translation{font-size:11px}.song-meta{font-size:8px}.song-actions{font-size:9px;gap:10px}.cover-button span{padding:8px;right:6px;bottom:6px}.indie{grid-template-columns:1fr;gap:20px}.indie-stack{padding:10px 15px 30px}.compilation{grid-template-columns:1fr;gap:0}.compilation>div{padding:24px}.compilation h3{font-size:23px}.playlist-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 18px}.about{grid-template-columns:1fr;gap:30px}.about>figure{position:static;max-width:100%}.player-head h2{font-size:16px}dialog{padding:15px}.player-head button{font-size:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.cover-button img{transition:none}}

/* 디스트로키드 재킷과 통일감을 주는 앤티크 골드 사진 프레임입니다. */
:root{--photo-gold:#b79243;--photo-gold-soft:#d6bf7d;--photo-gold-shadow:#6f54252b}
.hero-image::after{content:'';position:absolute;inset:15px;border:1px solid var(--photo-gold-soft);box-shadow:inset 0 0 0 1px #fff7dc30;pointer-events:none;z-index:2}
.latest img,.about figure img,.album-art>img,.compilation>img{outline:1px solid var(--photo-gold-soft);outline-offset:-9px}
.song-card .cover-button{border:1px solid var(--photo-gold);padding:6px;background:#eee6d8;box-shadow:0 5px 14px var(--photo-gold-shadow)}
.playlist img{border:1px solid var(--photo-gold);padding:5px;background:#eee6d8;box-shadow:0 4px 12px var(--photo-gold-shadow)}
.indie-stack img{outline:1px solid var(--photo-gold-soft);outline-offset:-13px}
@media(max-width:650px){.hero-image::after{inset:10px}.latest img,.about figure img,.album-art>img,.compilation>img{outline-offset:-7px}.song-card .cover-button{padding:4px}.playlist img{padding:4px}.indie-stack img{outline-offset:-11px}}





