/* RED 매거진 목록 (10/10) */
:root{--bg:#120809;--ink:#f2ece5;--dim:rgba(242,236,229,.62);--red:#c8273c;--paper:#f3e7da;--wine:#7a0f1e;--sa:env(safe-area-inset-top,0px)}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--bg)}
body{max-width:480px;margin:0 auto;background:var(--bg);color:var(--ink);font-family:"Pretendard Variable",Pretendard,sans-serif;-webkit-font-smoothing:antialiased;word-break:keep-all}
a{color:inherit;text-decoration:none}
.top{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:10px;height:calc(var(--sa) + 54px);padding:var(--sa) 16px 0;background:linear-gradient(var(--bg) 70%,rgba(18,8,9,0))}
.top .lg img{display:block}
.top .tl{font-family:Hahmlet,serif;font-size:16px;font-weight:500;color:var(--dim)}
.top .tr{margin-left:auto;display:flex;align-items:center}
.mast{padding:22px 16px 26px}
.mast h1{font-family:Hahmlet,serif;font-weight:700;font-size:clamp(54px,17vw,76px);line-height:.92;letter-spacing:-.035em}
.mast h1::first-line{color:var(--red)}
.mast p{margin-top:16px;font-size:15px;line-height:1.7;color:var(--dim)}
.cover{position:relative;display:block;margin:0 16px;aspect-ratio:4/5;overflow:hidden;background:#2a1014}
.cover .ci{position:absolute;inset:0;background:50% 40%/cover no-repeat;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.cover:active .ci{transform:scale(1.03)}
.cover:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(18,8,9,0) 30%,rgba(18,8,9,.55) 55%,rgba(18,8,9,.96) 100%)}
.cover .cx{position:absolute;left:0;right:0;bottom:0;z-index:1;display:block;padding:0 20px 20px}
.cover .no{display:flex;align-items:baseline;gap:8px;font-size:13px;font-weight:700;color:var(--paper)}
.cover .no b{font-family:Hahmlet,serif;font-size:30px;font-weight:600;color:var(--red);line-height:1}
.cover .tt{display:block;margin:8px 0 10px;font-family:Hahmlet,serif;font-size:clamp(38px,11vw,48px);font-weight:600;line-height:1.05;letter-spacing:-.02em}
.cover .q{display:block;font-family:Hahmlet,serif;font-size:15.5px;line-height:1.7;color:rgba(242,236,229,.85)}
.cover .by{display:flex;align-items:center;gap:12px;margin-top:16px;font-size:13px;color:var(--dim)}
.av{display:flex}
.av i{width:30px;height:30px;margin-right:-7px;border-radius:50%;border:2px solid var(--bg);background:#2a1014 50% 18%/cover no-repeat}
.cover .go{display:flex;align-items:center;justify-content:space-between;margin-top:16px;padding:14px 16px;background:var(--red);color:#fff;font-size:15.5px;font-weight:700}
.cover .go em{font-style:normal;font-size:13px;font-weight:500;opacity:.85}
.next{padding:44px 16px 8px}
.next h2,.why h2{font-family:Hahmlet,serif;font-size:22px;font-weight:600;margin-bottom:6px}
.next ol{list-style:none}
.next li{display:grid;grid-template-columns:44px 1fr auto;gap:12px;align-items:start;padding:18px 0;border-bottom:1px solid rgba(242,236,229,.12)}
.next .nn{font-family:Hahmlet,serif;font-size:26px;font-weight:600;line-height:1.1;color:rgba(200,39,60,.85)}
.next .nt b{display:block;font-family:Hahmlet,serif;font-size:17.5px;font-weight:600;line-height:1.4}
.next .nt small{display:block;margin-top:4px;font-size:13.5px;line-height:1.5;color:var(--dim)}
.next .who{display:flex;align-items:center;gap:7px;margin-top:10px;font-size:12.5px;color:var(--dim)}
.next .who i{width:22px;height:22px;border-radius:50%;background:#2a1014 50% 18%/cover no-repeat}
.next .dt{padding-top:5px;font-size:12px;color:rgba(242,236,229,.45);white-space:nowrap}
.why{margin:40px 16px 36px;padding:26px 22px 22px;background:var(--paper);color:#3a0d14}
.why .pull{font-family:Hahmlet,serif;font-size:21px;font-weight:600;line-height:1.5;color:var(--wine)}
.why p:not(.pull){margin-top:12px;font-size:14.5px;line-height:1.7;color:#4a1a20}
.why .sh{display:block;width:100%;margin-top:18px;padding:14px;border:0;background:var(--wine);color:var(--paper);font:inherit;font-size:15px;font-weight:700;cursor:pointer}
.toast{position:fixed;left:50%;bottom:calc(env(safe-area-inset-bottom,0px) + 84px);transform:translateX(-50%);padding:10px 16px;background:rgba(242,236,229,.95);color:#120809;font-size:14px;font-weight:600;opacity:0;pointer-events:none;transition:opacity .2s;z-index:95}
.toast.on{opacity:1}
:focus-visible{outline:2px solid var(--paper);outline-offset:3px}
@media (prefers-reduced-motion:reduce){.cover .ci{transition:none}}
/* 10/11 매거진 메인: 이번 호 표지 + 모든 호 목록 */
.kk{margin:0 16px 10px;font-size:12.5px;font-weight:700;letter-spacing:.14em;color:var(--red)}
.cover .no span{letter-spacing:.04em}
.all{padding:44px 16px 8px}
.all h2{display:flex;align-items:baseline;gap:8px;font-family:Hahmlet,serif;font-size:22px;font-weight:600;margin-bottom:6px}
.all h2 span{font-family:"Pretendard Variable",Pretendard,sans-serif;font-size:13px;font-weight:500;color:var(--dim)}
.all ol{list-style:none}
.all li{border-bottom:1px solid rgba(242,236,229,.12)}
.all li a{display:grid;grid-template-columns:96px 1fr;gap:14px;align-items:start;padding:18px 0}
.all .th{position:relative;display:block;aspect-ratio:3/4;background:#2a1014 50% 30%/cover no-repeat;overflow:hidden}
.all .th:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(18,8,9,0) 50%,rgba(18,8,9,.8))}
.all .th b{position:absolute;left:8px;bottom:6px;z-index:1;font-family:Hahmlet,serif;font-size:24px;font-weight:600;line-height:1;color:var(--paper)}
.all .nt{display:block;min-width:0}
.all .nt em{display:inline-block;margin-bottom:6px;padding:3px 7px;background:var(--red);color:#fff;font-style:normal;font-size:11.5px;font-weight:700}
.all .nt>b{display:block;font-family:Hahmlet,serif;font-size:18px;font-weight:600;line-height:1.4}
.all .nt small{display:block;margin-top:4px;font-size:13.5px;line-height:1.5;color:var(--dim)}
.all .who{display:flex;align-items:center;gap:12px;margin-top:10px;font-size:12.5px;color:var(--dim)}
.av.sm i{width:22px;height:22px;margin-right:-6px;border-width:1.5px}
.all .mt{display:block;margin-top:8px;font-size:12px;color:rgba(242,236,229,.45)}
.all li a:active .th{opacity:.85}