
/* 시안 v3 — "큰 책을 넘기면, 조선의 다이닝이 열린다" (docs/시안v3_지시서.md)
   어둠(먹)과 한지가 번갈아 오는 리듬 · 한자 Yuji Syuku · 한글 Song Myung · 테두리 상자 없음 */
:root{
  --night:#151311; --night2:#1E1B18; --hanji:#F6F2EA; --ink:#24221F; --ink2:#6E675D; --mist:#CFC6B6; --inju:#8C2F25; --line:#D8D0C1;
  --han:"Yuji Syuku","Song Myung",serif;
  --ko:"Song Myung","Nanum Myeongjo","AppleMyungjo","Batang",serif;
  --g:20px; --bar:64px;
  color-scheme:light;
}
@media (min-width:900px){:root{--g:56px}}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--night);color:var(--hanji);font-family:var(--ko);font-size:17px;line-height:1.85;word-break:keep-all;overflow-x:hidden;padding-bottom:calc(var(--bar) + env(safe-area-inset-bottom,0px))}
@media (min-width:900px){body{font-size:18px;padding-bottom:0}}
img,video{display:block;max-width:100%}
img{height:auto}
a{color:inherit}
:focus-visible{outline:2px solid var(--inju);outline-offset:3px}
p{margin:0}
h1,h2,h3{font-family:var(--ko);font-weight:400;margin:0;text-wrap:balance;line-height:1.45}
.han{font-family:var(--han)}
.dark{background:var(--night);color:var(--hanji)}
.light{background:var(--hanji);color:var(--ink)}
.wrap{max-width:1200px;margin:0 auto;padding-left:var(--g);padding-right:var(--g)}
.sec{padding-block:96px}
@media (min-width:900px){.sec{padding-block:160px}}
.eyebrow{font-size:13px;letter-spacing:.32em;opacity:.7}
.lead{font-size:24px;line-height:1.6}
@media (min-width:900px){.lead{font-size:34px}}
.body p+p{margin-top:1.1em}
.dot{border:0;border-top:1px dotted currentColor;opacity:.35;margin:0}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 30px;font:400 17px var(--ko);letter-spacing:.08em;text-decoration:none;border:0;cursor:pointer;border-radius:0}
.btn-r{background:var(--inju);color:var(--hanji)}
.btn-r:hover{background:#7a281f}
.link{background:none;color:inherit;padding:0;min-height:44px;border-bottom:1px solid currentColor;letter-spacing:.06em}

/* ── 머리: 가운데 공식 로고 + 얇은 글자 메뉴 ── */
.hd{position:fixed;top:0;left:0;right:0;z-index:50;height:64px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:env(safe-area-inset-top,0px) var(--g) 0;color:var(--hanji);transition:background .4s ease}
.hd.solid{background:rgba(21,19,17,.94)}
.hd .logo img{height:40px;width:auto}
.hd nav.main{display:none;gap:28px;font-size:15px;letter-spacing:.12em}
.hd nav.main a{text-decoration:none;opacity:.85}
.hd nav.main a:hover{opacity:1}
.hd .right{justify-self:end;display:flex;align-items:center;gap:20px;font-size:13px;letter-spacing:.12em}
.hd .right a{text-decoration:none;opacity:.85}
.hd .r-btn{display:none}
.burger{justify-self:start;width:44px;height:44px;background:none;border:0;color:inherit;cursor:pointer;display:grid;place-content:center;gap:7px;padding:0}
.burger i{display:block;width:24px;height:1px;background:currentColor}
@media (min-width:900px){.hd{height:84px}.hd .logo img{height:52px}.hd nav.main{display:flex;justify-self:start}.burger{display:none}.hd .r-btn{display:inline-flex;min-height:44px;padding:0 22px;font-size:15px}}
.drawer{position:fixed;inset:0;z-index:60;background:var(--night);color:var(--hanji);display:grid;align-content:center;justify-items:center;gap:22px;font-size:22px;letter-spacing:.14em}
.drawer[hidden]{display:none}
.drawer a{text-decoration:none}
.drawer .x{position:absolute;top:calc(12px + env(safe-area-inset-top,0px));left:var(--g);width:44px;height:44px;background:none;border:0;color:inherit;font-size:26px;cursor:pointer}

/* ── 휴대폰 하단 예약 ── */
.mbar{position:fixed;left:0;right:0;bottom:0;z-index:130;display:flex;align-items:center;gap:12px;padding:8px var(--g) calc(8px + env(safe-area-inset-bottom,0px));background:rgba(21,19,17,.96);color:var(--hanji)}
.mbar span{font-size:13px;line-height:1.35;white-space:nowrap;opacity:.9}
.mbar .btn{flex:1;min-height:48px}
@media (min-width:900px){.mbar{display:none}}

/* ── 1. 첫 화면 ── */
.hero{position:relative;height:100svh;min-height:560px;overflow:hidden}
.hero .ph{position:absolute;inset:0}
.slides{position:absolute;inset:0}
.slides.pc{display:none}
.sl{position:absolute;inset:0;opacity:0;transition:opacity 1.8s ease;display:grid;grid-template-columns:1fr;overflow:hidden}
.sl.on{opacity:1}
.sl img{width:100%;height:100%;object-fit:cover;transform:scale(1.06);transition:transform 8s cubic-bezier(.2,.6,.2,1)}
.sl.on img{transform:scale(1)}
.sl.pair{grid-template-columns:1fr 1fr}
.prog{position:absolute;left:var(--g);right:var(--g);top:calc(64px + env(safe-area-inset-top,0px) + 10px);z-index:3;display:flex;gap:6px}
.prog i{flex:1;height:2px;background:rgba(246,242,234,.25);position:relative;overflow:hidden}
.prog i b{position:absolute;inset:0;background:rgba(246,242,234,.85);transform:scaleX(0);transform-origin:left}
.prog i.done b{transform:scaleX(1)}
.prog i.run b{animation:fill 6.5s linear forwards}
.hero.paused .prog i.run b{animation-play-state:paused}
@keyframes fill{to{transform:scaleX(1)}}
.hero .pause{top:calc(64px + env(safe-area-inset-top,0px) + 22px)}
@media (min-width:900px){.hero{height:100vh}.slides.m{display:none}.slides.pc{display:block}.prog{top:100px;left:auto;right:var(--g);width:280px}.hero .pause{top:auto;bottom:72px;right:var(--g)}}
.hero::after{content:"";position:absolute;inset:auto 0 0 0;height:55%;background:linear-gradient(to bottom,rgba(21,19,17,0),rgba(21,19,17,.78));pointer-events:none}
.hero .copy{position:absolute;left:0;right:0;bottom:calc(var(--bar) - 32px);z-index:2;padding:0 var(--g) 40px;display:grid;gap:14px}
.hero h1{font-size:31px;line-height:1.45}
.hero .sub{font-size:15px;opacity:.85}
.hero .price{font-size:14px;letter-spacing:.06em;opacity:.8}
@media (min-width:900px){.hero .copy{bottom:0;padding:0 var(--g) 72px;max-width:900px}.hero h1{font-size:52px}.hero .sub{font-size:18px}.hero .price{font-size:15px}}
.home-in{animation:zoomout 2.4s cubic-bezier(.2,.6,.2,1) both}
@keyframes zoomout{from{transform:scale(1.02)}to{transform:scale(1)}}

/* ── 2. 시의전서란 ── */
.what{display:grid;gap:48px}
.what .book{display:grid;grid-template-columns:1.15fr .55fr;gap:14px;align-items:start}
.what .book img{width:100%;height:auto;box-shadow:0 30px 60px -36px rgba(36,34,31,.55)}
.what .book figcaption{grid-column:1/-1;font-size:13px;color:#9C927F;letter-spacing:.06em}
.what-sec{background:#100F0D;color:#E9E1D2}
.what-sec .four .t{color:#EFE7D8}
.what-sec .four .k{color:#D9CFBC}
.what-sec .eyebrow{color:#A8987C;opacity:1}
.what-sec .dot{border-top-color:#6E604B;opacity:.7}
.what-sec .body{color:#CFC6B5}
.what-sec .book img{box-shadow:0 40px 80px -40px rgba(0,0,0,.9),0 0 0 1px rgba(255,255,255,.04)}
.what-sec .book .wm{filter:invert(.9) sepia(.3) contrast(1.05);mix-blend-mode:screen;box-shadow:none}
.what .book .wm{max-height:520px;width:auto;margin:0 auto}
.four{display:grid;gap:10px}
.four .t{font-family:var(--han);font-size:64px;line-height:1.05;letter-spacing:.08em}
.four .k{font-size:18px;line-height:1.7}
@media (min-width:900px){.what{grid-template-columns:.9fr 1fr;gap:96px;align-items:center}.four .t{font-size:104px}.four .k{font-size:22px}}

/* ── 3. 왜 시작했나 (한지 → 어둠) ── */
.why-top{padding-bottom:64px}
.why-lead{font-size:26px;line-height:1.55}
@media (min-width:900px){.why-lead{font-size:40px}}
.why-photos{display:grid;grid-template-columns:1fr;gap:0}
.why-photos img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/5}
@media (min-width:900px){.why-photos{grid-template-columns:1fr 1fr}.why-photos img{aspect-ratio:auto;height:92vh}}

/* ── 4. 건너가는 곳 ── */
.cross{display:grid;gap:48px}
.cross .pics{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.cross .pics img{width:100%;aspect-ratio:3/4;object-fit:cover}
.cross .pics img:first-child{grid-column:1/-1;aspect-ratio:4/5}
.cross .last{font-size:24px;line-height:1.6;margin-top:1.4em}
@media (min-width:900px){.cross{grid-template-columns:1fr 1fr;gap:96px;align-items:center}.cross .pics img:first-child{grid-column:auto;aspect-ratio:3/4}.cross .last{font-size:30px}}

/* ── 5. 돌다리 ── */
.pond{position:relative;display:grid}
.pond .v{position:relative;height:100svh;max-height:1000px;overflow:hidden;background:#0d0c0b}
.pond video,.pond .v>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.pond .v::after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,rgba(21,19,17,.35),rgba(21,19,17,0) 35%,rgba(21,19,17,0) 55%,rgba(21,19,17,.75));pointer-events:none}
.pond .txt{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:0 var(--g) 48px;display:grid;gap:16px}
.pond .txt h2{font-size:25px}
.pond .night{display:none}
.fade-slow{opacity:0;transform:translateY(12px);transition:opacity 1.5s ease,transform 1.5s ease}
.fade-slow.in{opacity:1;transform:none}
.pause{position:absolute;right:16px;top:80px;z-index:3;width:40px;height:40px;background:rgba(21,19,17,.45);color:var(--hanji);border:1px solid rgba(246,242,234,.5);cursor:pointer;font-size:12px}
@media (min-width:900px){
  .pond{grid-template-columns:1fr 1fr;min-height:100vh}
  .pond .v{order:2;height:100vh;max-height:none}
  .pond .v video,.pond .v>img{object-fit:contain;background:#0d0c0b}
  .pond .txt{position:static;order:1;align-content:center;padding:96px var(--g)}
  .pond .txt h2{font-size:38px}
  .pond .night{display:block;width:62%;margin-top:24px;opacity:.9}
  .pause{top:auto;bottom:20px}
}

/* ── 6. 이웃 이야기 ── */
.nb{max-width:720px;margin:0 auto;text-align:center;display:grid;gap:24px;justify-items:center}
.nb h2{font-size:23px;line-height:1.65}
.nb .seal{width:58px;opacity:.9}
@media (min-width:900px){.nb h2{font-size:30px}}

/* ── 7. 코스 一~四 ── */
.course-hd{text-align:center;display:grid;gap:12px;justify-items:center;margin-bottom:72px}
.course-hd .t{font-family:var(--han);font-size:44px;letter-spacing:.2em}
.dish{display:grid;gap:28px;padding-block:72px}
.dish + .dish{border-top:1px dotted rgba(36,34,31,.3)}
.dish .art-wrap{max-width:720px;width:100%;margin:0 auto}
.dish .meta{display:grid;gap:10px;justify-items:center;text-align:center;max-width:560px;margin:0 auto}
.dish .hj{font-family:var(--han);font-size:84px;line-height:1}
.dish .hj small{font-family:var(--ko);font-size:22px;color:var(--ink2);margin-left:6px;vertical-align:40px}
.dish .no{font-size:14px;letter-spacing:.4em;color:var(--ink2)}
.dish .motto{font-size:17px;color:var(--ink2)}
.dish .name{font-size:25px;line-height:1.5;margin-top:6px}
.dish .en{font-size:15px;color:var(--ink2);font-style:italic;letter-spacing:.02em}
.dish .desc{font-size:16px;line-height:1.85}
.dish ul{list-style:none;padding:0;margin:6px 0 0;width:100%;font-size:15px}
.dish li{display:flex;justify-content:space-between;gap:12px;padding:6px 0;border-bottom:1px dotted rgba(36,34,31,.25)}
.dish li span+span{color:var(--ink2);font-style:italic;text-align:right}
.dish .real{width:100%;max-width:420px;margin:8px auto 0}
.dish .real img{width:100%;aspect-ratio:4/5;object-fit:cover}
.dish .real span{display:block;font-size:12px;letter-spacing:.2em;color:var(--ink2);margin-top:8px}
@media (min-width:900px){
  .dish{grid-template-columns:minmax(0,720px) minmax(0,1fr);gap:72px;align-items:center}
  .dish.rev{grid-template-columns:minmax(0,1fr) minmax(0,720px)}
  .dish.rev .art-wrap{order:2}
  .dish .hj{font-size:112px}.dish .hj small{font-size:26px;vertical-align:56px}
  .dish .name{font-size:30px}
}
.price-row{display:flex;flex-wrap:wrap;justify-content:center;align-items:baseline;gap:8px 28px;padding-top:56px;border-top:1px solid rgba(36,34,31,.6);text-align:center}
.price-row strong{font-weight:400;font-size:28px}

/* 움직이는 그림: 원본 880px 무대를 그대로 두고 화면 폭에 맞춰 축소 (값 변경 없음) */
.art{position:relative;width:100%;overflow:hidden;background:var(--hanji)}
.art .st{position:absolute;left:0;top:0;transform-origin:0 0;transform:scale(var(--k,1))}
.dish>*,.what>*,.cross>*,.rare>*{min-width:0}
.art:not(.on) .st *{animation-play-state:paused!important}
.art .still{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:none}
.reduce .art .still{display:block}.reduce .art .st{display:none}

/* 是 (자료/움직이는그림/是/index.html 그대로, 키프레임 이름만 앞에 si-) */
.st-si{position:relative;width:880px;height:733px;overflow:hidden}
.st-si>*{position:absolute;inset:0;width:100%;height:100%}
.st-si .bg{background:url(/assets/v3/art/si/bg.webp) center/100% 100%;animation:si-kb 16s ease-in-out infinite alternate}
@keyframes si-kb{to{transform:scale(1.025)}}
.st-si .branch{background:url(/assets/v3/art/si/branch.webp) center/100% 100%;transform-origin:100% 18%;animation:si-sway 7s ease-in-out infinite}
@keyframes si-sway{0%,100%{transform:rotate(0deg)}50%{transform:rotate(-.7deg)}}
.st-si .handg{transform-origin:108% 32%;animation:si-lift 8s ease-in-out infinite}.st-si .hand{position:absolute;inset:0;background:url(/assets/v3/art/si/hand.webp) center/100% 100%}
.st-si .stream{inset:auto;position:absolute;left:calc(840/1320*100%);top:calc(655/1100*100%);width:calc(60/1320*100%);height:calc(160/1100*100%);animation:si-shim 1.1s ease-in-out infinite}
@keyframes si-shim{50%{filter:brightness(1.1) saturate(1.08)}}
.st-si .glint{position:absolute;left:calc(840/1320*100%);top:calc(655/1100*100%);width:calc(60/1320*100%);height:calc(160/1100*100%);-webkit-mask:url(/assets/v3/art/si/stream.webp) center/100% 100%;mask:url(/assets/v3/art/si/stream.webp) center/100% 100%;background:linear-gradient(180deg,transparent 0%,rgba(255,235,220,.55) 8%,transparent 16%) 0 0/100% 300% repeat-y;animation:si-glint .9s linear infinite}
@keyframes si-glint{to{background-position:0 100%}}
@keyframes si-lift{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-6px) rotate(-1deg)}}
.st-si .ripple{inset:auto;left:calc(830/1320*100%);top:calc(818/1100*100%);width:calc(70/1320*100%);height:12px;border-radius:50%;border:1.5px solid rgba(240,210,190,.55);animation:si-rip 2.2s ease-out infinite;opacity:0}
@keyframes si-rip{0%{opacity:.75;transform:scale(.35)}100%{opacity:0;transform:scale(1.15)}}
.st-si .petal{inset:auto;width:var(--s);height:calc(var(--s)*.7);border-radius:60% 40% 60% 40%;background:radial-gradient(circle at 40% 40%,#fdf7ef 0%,#f1dccf 60%,#e2bfae 100%);box-shadow:0 0 1px rgba(120,80,60,.25);opacity:0;animation:si-fall var(--d) linear infinite;animation-delay:var(--dl)}
.st-si .petal.pk{background:radial-gradient(circle at 40% 40%,#f6d9d2,#d99a8e)}
@keyframes si-fall{0%{opacity:0;transform:translate(0,0) rotate(0)}6%{opacity:.95}25%{transform:translate(calc(var(--x)*.2 + 14px),calc(var(--y)*.25)) rotate(80deg)}50%{transform:translate(calc(var(--x)*.5 - 10px),calc(var(--y)*.5)) rotate(170deg)}75%{transform:translate(calc(var(--x)*.78 + 12px),calc(var(--y)*.75)) rotate(250deg)}88%{opacity:.85}100%{opacity:0;transform:translate(var(--x),var(--y)) rotate(330deg)}}

/* 議 · 全 · 書 공통 (각 폴더 index.html 그대로) */
.st-x{position:relative;width:880px;overflow:hidden}
.st-ui{aspect-ratio:1340/1116}.st-jeon{aspect-ratio:1336/1112}.st-seo{aspect-ratio:1170/878}
.st-x>*{position:absolute}
.st-x .full{inset:0;width:100%;height:100%}
.st-x .bg{background-position:center;background-size:100% 100%;animation:x-kb 16s ease-in-out infinite alternate}
@keyframes x-kb{to{transform:scale(1.025)}}
.st-x .branch{background-position:center;background-size:100% 100%;transform-origin:100% 0%;animation:x-sway 7s ease-in-out infinite}
@keyframes x-sway{0%,100%{transform:rotate(0deg)}50%{transform:rotate(-.6deg)}}
.st-x .steam{width:0;height:0}
.st-x .steam i{position:absolute;left:calc(var(--w)/-2);bottom:0;width:var(--w);height:calc(var(--w)*1.6);border-radius:50%;background:radial-gradient(ellipse at 50% 60%,rgba(255,252,246,.75),rgba(255,252,246,0) 68%);filter:blur(5px);opacity:0;animation:x-rise var(--d) ease-out infinite;animation-delay:var(--dl)}
@keyframes x-rise{0%{opacity:0;transform:translate(0,0) scale(.5,.6)}18%{opacity:var(--o)}50%{transform:translate(var(--x1),calc(var(--h)*-.5)) scale(.9,1)}100%{opacity:0;transform:translate(var(--x2),calc(var(--h)*-1)) scale(1.4,1.3)}}
.st-x .petal{width:var(--s);height:calc(var(--s)*.7);border-radius:60% 40% 60% 40%;background:radial-gradient(circle at 40% 40%,#fffdf8 0%,#f3e9dc 60%,#e2d2bf 100%);box-shadow:0 0 1px rgba(120,90,60,.3);opacity:0;animation:x-fall var(--d) linear infinite;animation-delay:var(--dl)}
@keyframes x-fall{0%{opacity:0;transform:translate(0,0) rotate(0)}6%{opacity:.95}25%{transform:translate(calc(var(--x)*.2 + 14px),calc(var(--y)*.25)) rotate(80deg)}50%{transform:translate(calc(var(--x)*.5 - 10px),calc(var(--y)*.5)) rotate(170deg)}75%{transform:translate(calc(var(--x)*.78 + 12px),calc(var(--y)*.75)) rotate(250deg)}88%{opacity:.85}100%{opacity:0;transform:translate(var(--x),var(--y)) rotate(330deg)}}
.st-jeon .mist{left:-5%;top:0;width:45%;height:30%;background:radial-gradient(ellipse at 50% 55%,rgba(250,246,238,.75),rgba(250,246,238,0) 65%);animation:jeon-drift 18s ease-in-out infinite alternate;opacity:.55}
@keyframes jeon-drift{from{transform:translateX(-30px)}to{transform:translateX(40px);opacity:.8}}
.st-seo .moon{left:calc(642/1170*100%);top:calc(0/878*100%);width:calc(120/1170*100%);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(255,244,215,.55) 0%,rgba(255,244,215,0) 62%);animation:seo-glow 6s ease-in-out infinite;mix-blend-mode:screen}
@keyframes seo-glow{50%{opacity:.35;transform:scale(1.08)}}
.st-seo .gl{left:calc(546/1170*100%);top:calc(182/878*100%);width:calc(403/1170*100%);height:calc(97/878*100%);background:url(/assets/v3/art/seo/glint.webp) center/100% 100%;mix-blend-mode:screen}
.st-seo .g1{animation:seo-tw 2.6s ease-in-out infinite}.st-seo .g2{animation:seo-tw 3.4s ease-in-out infinite -1.3s;transform:translateX(4px) scaleX(1.02)}
@keyframes seo-tw{0%,100%{opacity:.15}50%{opacity:.85}}

/* ── 8. 어교순대 ── */
.rare{display:grid;gap:56px}
.rare .orig{display:grid;grid-template-columns:auto 1fr;gap:24px;align-items:start}
.rare .orig img{width:110px;height:auto;filter:invert(.92) sepia(.25) contrast(1.05);mix-blend-mode:screen}
.rare .orig .t{font-family:var(--han);font-size:44px;line-height:1.2}
.rare .orig h2{font-size:26px}
.rare ol{list-style:none;padding:0;margin:20px 0 0}
.rare ol li{display:grid;grid-template-columns:32px 1fr;gap:10px;padding:12px 0;border-top:1px dotted rgba(246,242,234,.3);font-size:16px}
.rare ol li b{font-family:var(--han);font-weight:400;color:#C9705F}
.rare .tag{display:inline-block;margin-top:20px;font-size:13px;letter-spacing:.3em;opacity:.8}
.rare .media{display:grid;gap:10px}
.rare .media img.paint{width:100%;aspect-ratio:1324/1030;object-fit:cover;object-position:top;opacity:.92}
.rare .vid{position:relative;aspect-ratio:4/3;overflow:hidden;background:#0d0c0b}
.rare .vid img,.rare .vid video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.rare .cost{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-size:15px;opacity:.85;margin-top:6px}
.rare .cost strong{font-weight:400;font-size:24px;opacity:1}
@media (min-width:900px){.rare{grid-template-columns:1fr 1.05fr;gap:96px;align-items:center}.rare .orig img{width:150px}.rare .orig .t{font-size:60px}.rare .orig h2{font-size:32px}}

/* ── 9·10. 오픈기 · 언론보도 카드 ── */
.reel-hd{display:grid;gap:12px;margin-bottom:40px}
.reel-hd h2{font-size:27px}
@media (min-width:900px){.reel-hd h2{font-size:40px}}
.reel{display:grid;grid-auto-flow:column;grid-auto-columns:62%;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:12px;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
@media (min-width:900px){.reel{grid-auto-columns:calc((100% - 64px)/5)}}
.card{scroll-snap-align:start;background:none;border:0;padding:0;text-align:left;color:inherit;font:inherit;cursor:pointer;display:grid;gap:10px}
.card .th{position:relative;aspect-ratio:9/16;overflow:hidden;background:#2a2622}
.card .th img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.card:hover .th img{transform:scale(1.03)}
.card .no{position:absolute;left:12px;top:10px;font-size:15px;letter-spacing:.08em;color:#F6F2EA;text-shadow:0 1px 8px rgba(0,0,0,.6)}
.card .no b{font-weight:400;font-size:34px;margin-right:2px}
.card .play{position:absolute;right:10px;bottom:10px;width:38px;height:38px;border-radius:50%;background:rgba(21,19,17,.55);display:grid;place-items:center;color:#F6F2EA;font-size:12px}
.card .ep{font-size:14px;letter-spacing:.08em;opacity:.75;margin-top:2px}.card .ep b{font-weight:400;font-size:30px;margin:0 2px;opacity:1}
.card .tt{font-size:16px;line-height:1.5}
.card .src{font-size:13px;opacity:.7;letter-spacing:.04em}
.reel-note{font-size:13px;opacity:.65;margin-top:20px}
dialog.player{border:0;padding:0;background:var(--night);color:var(--hanji);width:min(94vw,460px);max-height:94svh;overflow:auto}
dialog.player::backdrop{background:rgba(10,9,8,.86)}
dialog.player video{width:100%;max-height:72svh;background:#000}
dialog.player .info{padding:16px 18px 22px;display:grid;gap:8px}
dialog.player .info h3{font-size:20px}
dialog.player .info p{font-size:15px;line-height:1.8;opacity:.9}
dialog.player .close{position:absolute;right:8px;top:8px;width:44px;height:44px;background:rgba(21,19,17,.6);color:#fff;border:0;font-size:22px;cursor:pointer;z-index:2}

/* ── 11. 예약 ── */
.rsv-hd{text-align:center;display:grid;gap:14px;justify-items:center;margin-bottom:48px}
.rsv-hd h2{font-size:30px}
.hours{display:grid;grid-template-columns:1fr 1fr;gap:16px;max-width:720px;margin:0 auto 48px;font-size:15px;line-height:1.8;text-align:center}
.two{display:grid;gap:14px;max-width:880px;margin:0 auto}
.two button{min-height:120px;display:grid;align-content:center;gap:6px;font:400 24px var(--ko);letter-spacing:.06em;cursor:pointer;border:0}
.two button small{font-size:14px;letter-spacing:.04em;opacity:.85}
.two .ko{background:var(--inju);color:var(--hanji)}
.two .en{background:var(--ink);color:var(--hanji)}
.two button[aria-expanded="true"]{outline:2px solid var(--ink);outline-offset:3px}
@media (min-width:900px){.two{grid-template-columns:1fr 1fr}.two button{min-height:160px;font-size:28px}}
form.rf{max-width:640px;margin:40px auto 0;display:grid;gap:14px}
form.rf[hidden]{display:none}
.r2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
form.rf label{display:grid;gap:4px;font-size:14px;color:var(--ink2)}
form.rf input,form.rf select,form.rf textarea{font:16px var(--ko);color:var(--ink);background:#fff;border:0;border-bottom:1px solid var(--ink2);border-radius:0;padding:10px 4px;min-height:46px;width:100%}
form.rf textarea{min-height:84px;resize:vertical}
.agree{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--ink);line-height:1.7}
.agree input{width:20px;min-height:20px;height:20px;margin-top:4px;accent-color:var(--inju);flex:none}
.agree small{display:block;color:var(--ink2);font-size:13px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.msg{font-size:14px;padding:10px 0;border-top:1px dotted var(--ink2)}
.msg[hidden]{display:none}

/* ── 바닥 ── */
.ft{padding:72px var(--g) 48px;text-align:center;display:grid;gap:14px;justify-items:center;font-size:14px;opacity:.85}
.ft img{height:64px;width:auto;opacity:.9}
.ft a{color:inherit}

/* ── 책장 넘김 (WebGL, book.js) — 어두운 탁자 위의 책 ── */
#intro{position:fixed;inset:0;z-index:110;cursor:pointer;background:#0b0a09;transition:opacity 1s ease;--sp:1}
#intro .bg{position:absolute;inset:0;background:url(/assets/v3/photo/intro-bg-m.jpg) center/cover no-repeat;transform-origin:50% 55%;animation:bgzoom calc(10.4s*var(--sp)) linear both,bgdim calc(3s*var(--sp)) ease calc(6.6s*var(--sp)) both}
@media (min-width:900px){#intro .bg{background-image:url(/assets/v3/photo/intro-bg-pc.jpg)}}
@keyframes bgzoom{from{transform:scale(1.0)}to{transform:scale(1.035)}}
@keyframes bgdim{to{opacity:.18}}
#intro .bg::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 52%,rgba(0,0,0,0) 28%,rgba(0,0,0,.55) 100%)}
#intro.out{opacity:0;pointer-events:none}
#bookgl{position:absolute;inset:0;width:100%;height:100%;display:block}
#intro .fb{display:none}
#intro.nogl .fb{display:block;position:absolute;inset:0}
#intro.nogl .fb img{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);height:60%;width:auto;opacity:0;transition:opacity 1.4s ease}
#intro.nogl .fb img.on{opacity:1}
#intro.nogl .fb .lg{height:auto;width:min(62vw,420px)}
#intro .tap{position:absolute;left:50%;transform:translateX(-50%);bottom:calc(var(--bar) + 18px + env(safe-area-inset-bottom,0px));z-index:5;margin:0;padding:6px 14px;font-size:12px;letter-spacing:.2em;white-space:nowrap;color:#F6F2EA;background:rgba(21,19,17,.42)}
#intro .rb{display:none}
@media (min-width:900px){#intro .tap{bottom:96px}#intro .rb{display:inline-flex;position:absolute;left:50%;transform:translateX(-50%);bottom:28px;z-index:6}}

/* ── 페이지 나누기 뒤 추가 규칙 (site-extra.css, site.css 뒤에 붙음) ── */
.page[hidden]{display:none}
.nav-cur{opacity:1!important;border-bottom:1px solid currentColor;padding-bottom:2px}
.hd .logo.nav-cur{border:0}
.hd .right a[aria-current="true"]{opacity:1;border-bottom:1px solid currentColor;padding-bottom:2px}
.hd.solid{background:rgba(21,19,17,.94)}
body.sub{padding-top:0}
.more{display:inline-flex;align-items:center;gap:8px;margin-top:28px;font-size:15px;letter-spacing:.08em;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:3px;opacity:.85}
.more:hover{opacity:1}
.more::after{content:"→"}
.center{text-align:center;display:grid;justify-items:center}

/* 하위 페이지 머리 */
.ph-hd{padding:calc(84px + 72px) var(--g) 64px;display:grid;gap:14px;max-width:1200px;margin:0 auto}
.ph-hd .han{font-size:52px;line-height:1;letter-spacing:.14em}
.ph-hd h1{font-size:30px}
.ph-hd p{max-width:34em;opacity:.85}
@media (min-width:900px){.ph-hd{padding-top:calc(84px + 120px);padding-bottom:96px}.ph-hd .han{font-size:84px}.ph-hd h1{font-size:44px}}

/* 홈 요약 블록 */
.what-short{display:grid;gap:28px;max-width:860px;margin:0 auto;text-align:center;justify-items:center}
.what-short .t{font-family:var(--han);font-size:56px;letter-spacing:.12em;line-height:1.05;color:#EFE7D8}
.what-short .book-sm{width:min(44vw,180px);box-shadow:0 30px 60px -30px rgba(0,0,0,.9)}
@media (min-width:900px){.what-short .t{font-size:96px}}
.course-sum{display:grid;gap:40px}
.course-sum .row{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;align-items:center}
.course-sum .row .art{max-width:520px;width:100%;margin:0 auto}
.course-sum .cap{display:grid;gap:4px;text-align:center;justify-items:center}
.course-sum .cap .hj{font-family:var(--han);font-size:56px;line-height:1}
.course-sum .cap .hj small{font-family:var(--ko);font-size:18px;color:var(--ink2);margin-left:6px;vertical-align:26px}
.course-sum .cap .name{font-size:21px}
.course-sum .cap .en{font-size:14px;color:var(--ink2);font-style:italic}
@media (min-width:900px){.course-sum{grid-template-columns:1fr 1fr;gap:56px 48px}.course-sum .row .art{max-width:none}}
.rare-short{display:grid;gap:28px;align-items:center}
.rare-short img{width:100%;aspect-ratio:4/3;object-fit:cover}
@media (min-width:900px){.rare-short{grid-template-columns:1.1fr 1fr;gap:72px}}
.journal-pre .reel{grid-auto-columns:62%}
@media (min-width:900px){.journal-pre .reel{grid-auto-columns:calc((100% - 48px)/4)}}
.rsv-cta{display:grid;gap:14px;max-width:880px;margin:0 auto}
.rsv-cta a{min-height:120px;display:grid;align-content:center;justify-items:center;gap:6px;font:400 24px var(--ko);letter-spacing:.06em;text-decoration:none;text-align:center}
.rsv-cta a small{font-size:14px;letter-spacing:.04em;opacity:.85}
.rsv-cta .ko{background:var(--inju);color:var(--hanji)}
.rsv-cta .en{background:var(--ink);color:var(--hanji)}
@media (min-width:900px){.rsv-cta{grid-template-columns:1fr 1fr}.rsv-cta a{min-height:160px;font-size:28px}}

/* 이야기 페이지 */
.letter{max-width:640px;margin:0 auto;display:grid;gap:18px;font-size:17px;line-height:2}
.letter .sign{display:flex;align-items:center;gap:12px;justify-content:flex-end;margin-top:12px}
.letter .sign img{width:44px}
.journey{display:grid;gap:12px;max-width:720px;margin:36px auto 0}
.journey li{display:grid;grid-template-columns:72px 1fr;gap:14px;padding:14px 0;border-top:1px dotted rgba(36,34,31,.3);list-style:none}
.journey b{font-weight:400;font-family:var(--han);font-size:22px}
.story-photos{display:grid;grid-template-columns:1fr 1fr;gap:8px;max-width:1100px;margin:0 auto}
.story-photos img{width:100%;aspect-ratio:4/5;object-fit:cover}
@media (min-width:900px){.story-photos{grid-template-columns:repeat(4,1fr)}}

/* 코스 페이지 */
.choose{display:grid;gap:14px;max-width:900px;margin:0 auto}
.choose div{display:grid;gap:8px;padding:24px;background:rgba(36,34,31,.04)}
.choose h3{font-size:22px}
.choose .spicy{font-size:13px;color:var(--ink2);letter-spacing:.06em}
@media (min-width:900px){.choose{grid-template-columns:1fr 1fr}}
.drinks{list-style:none;padding:0;margin:0;max-width:720px;margin-inline:auto}
.drinks li{display:grid;grid-template-columns:1fr auto;gap:12px;padding:14px 0;border-top:1px dotted rgba(246,242,234,.3)}
.drinks li small{display:block;opacity:.7;font-size:14px}
.drinks li b{font-weight:400;white-space:nowrap}

/* 기록 페이지 */
.tabs{display:flex;gap:28px;justify-content:center;margin-bottom:40px}
.tabs button{background:none;border:0;color:inherit;font:400 18px var(--ko);letter-spacing:.1em;padding:10px 2px;cursor:pointer;opacity:.6;border-bottom:1px solid transparent}
.tabs button[aria-selected="true"]{opacity:1;border-bottom-color:currentColor}
.grid-cards{display:grid;grid-template-columns:1fr 1fr;gap:16px 12px}
.grid-cards .card{scroll-snap-align:none}
@media (min-width:900px){.grid-cards{grid-template-columns:repeat(5,1fr);gap:28px 20px}}

/* 오시는 길 */
.visit{display:grid;gap:48px}
.visit dl{display:grid;grid-template-columns:auto 1fr;gap:10px 20px;margin:0;font-size:16px}
.visit dt{opacity:.7;letter-spacing:.06em;white-space:nowrap}
.visit dd{margin:0}
.visit .maps{display:flex;gap:12px;flex-wrap:wrap;margin-top:8px}
.visit .maps .btn{border:1px solid currentColor;background:none;color:inherit;font-weight:400;font-size:15px}
.way-tip{font-size:14px;color:var(--ink2);margin:0 0 14px}
.visit .way{display:grid;gap:10px;padding-left:1.1em}
@media (min-width:900px){.visit{grid-template-columns:1fr 1fr;gap:96px;align-items:start}}

/* 단체·기념일 */
.occ{display:grid;gap:28px}
.occ article{display:grid;gap:10px;padding:28px 0;border-top:1px dotted rgba(36,34,31,.3)}
.occ h3{font-size:22px}
@media (min-width:900px){.occ{grid-template-columns:repeat(3,1fr);gap:48px}.occ article{border-top:0;border-left:1px dotted rgba(36,34,31,.3);padding:8px 0 8px 28px}}

/* FAQ */
.faq{max-width:760px;margin:0 auto}
.faq details{border-top:1px dotted rgba(36,34,31,.35)}
.faq details:last-child{border-bottom:1px dotted rgba(36,34,31,.35)}
.faq summary{cursor:pointer;padding:20px 32px 20px 0;font-size:18px;list-style:none;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:4px;top:18px;font-size:22px;opacity:.6}
.faq details[open] summary::after{content:"−"}
.faq .a{padding:0 0 22px;color:#3E3A34;line-height:1.9}

/* 개인정보처리방침 */
.legal{max-width:720px;margin:0 auto;display:grid;gap:28px;font-size:15.5px;line-height:1.9}
.legal h2{font-size:20px;margin-top:8px}
.legal table{border-collapse:collapse;width:100%;font-size:14.5px}
.legal th,.legal td{text-align:left;vertical-align:top;padding:8px 6px;border-top:1px dotted rgba(36,34,31,.35)}
.legal th{white-space:nowrap;font-weight:400;opacity:.75}
.legal ul{padding-left:1.2em;margin:0}

/* 줄바꿈 안 되게 묶는 말 · 휴대폰 첫 화면 예약 단추는 하단 고정 단추만 */
.nw{white-space:nowrap}
@media (max-width:899px){.hero-rsv{display:none}}
.pl-note{margin:0;padding:10px 18px 0;font-size:13px;opacity:.8}
.pl-note[hidden]{display:none}

/* 시크릿 업그레이드 (한지 바탕 + 인주색 얇은 글씨 · 배지·깜빡임 없음) */
.su{display:grid;grid-template-columns:104px minmax(0,1fr);gap:18px;align-items:center;max-width:880px;margin:0 auto 56px;padding:22px 0;border-top:1px solid rgba(140,47,37,.4);border-bottom:1px solid rgba(140,47,37,.4);color:var(--ink)}
.su img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover}
.su-tx{display:grid;gap:8px}
.su-k{font-size:12.5px;letter-spacing:.24em;color:var(--inju)}
.su-h{font-size:20px;line-height:1.55;color:var(--inju);font-weight:400}
.su-b{font-size:15px;line-height:1.85;color:#3E3A34}
.su-en{font-size:13px;line-height:1.7;color:var(--ink2);font-style:italic}
@media (max-width:520px){.su{grid-template-columns:1fr}.su img{width:min(52vw,200px);justify-self:center}.su-tx{text-align:center}}
@media (min-width:900px){.su{grid-template-columns:200px minmax(0,1fr);gap:40px;padding:32px 0;margin-bottom:72px}.su-h{font-size:28px}.su-b{font-size:16px}}
.su-line{flex-basis:100%;margin:6px 0 0;font-size:14px;letter-spacing:.04em;color:var(--inju)}
/* 미리 예약 권유 (숫자·카운트다운 없음) */
.ahead{max-width:720px;margin:36px auto 0;text-align:center;display:grid;gap:8px;font-size:15px;line-height:1.9;color:#3E3A34}
.ahead-en{font-size:13px;color:var(--ink2);font-style:italic}

/* 세계 손님 리뷰 (자료/리뷰/리뷰영역_시안.html 구조·모양 그대로, 이름만 rv- 로) */
.rv-hd{text-align:center;display:grid;gap:12px;justify-items:center;margin-bottom:36px}
.rv-hd .eyebrow{color:var(--ink2);opacity:1}
.rv-hd h2{font-size:28px;line-height:1.45}
.rv-sum{font-size:15px;color:var(--ink2)}.rv-sum b{font-weight:400;color:var(--inju);font-size:22px}
.rv-tabs{display:flex;gap:8px 18px;overflow-x:auto;padding:4px 2px 14px;margin:0 calc(var(--g) * -1) 28px;padding-left:var(--g);scrollbar-width:none;border-bottom:1px dotted rgba(36,34,31,.3)}
.rv-tabs[hidden]{display:none}
.rv-tabs button{flex:none;background:none;border:0;font:400 15px var(--ko);color:var(--ink);opacity:.55;padding:6px 0;cursor:pointer;border-bottom:1px solid transparent;letter-spacing:.04em;min-height:36px}
.rv-tabs button[aria-selected="true"]{opacity:1;border-bottom-color:var(--ink)}
.rv-tabs small{font-size:12px;margin-left:3px;opacity:.7}
.rv-grid{columns:1;column-gap:20px}
@media (min-width:900px){.rv-hd h2{font-size:40px}.rv-grid{columns:3}.rv-tabs{justify-content:center;margin:0 0 40px;padding-left:0}}
.rv-card[hidden]{display:none}
.rv-card{break-inside:avoid;margin:0 0 20px;padding:26px 24px 22px;background:#fff;box-shadow:0 18px 40px -30px rgba(36,34,31,.45);display:grid;gap:12px}
.rv-top{display:flex;justify-content:space-between;align-items:baseline;font-size:13px;color:var(--ink2);letter-spacing:.06em}
.rv-st{color:#B08A3E;letter-spacing:2px;font-size:14px}
.rv-orig{font-size:16px;line-height:1.8;white-space:pre-line;overflow-wrap:anywhere}
.rv-orig:lang(zh-Hant),.rv-orig:lang(zh-Hans),.rv-orig:lang(ja){word-break:normal}
.rv-ko{font-size:14.5px;line-height:1.85;color:#4A453E;white-space:pre-line;border-top:1px dotted rgba(36,34,31,.3);padding-top:12px}
.rv-ko::before{content:"한국어 번역";display:block;font-size:11.5px;letter-spacing:.2em;color:var(--ink2);margin-bottom:4px}
.rv-clip{display:-webkit-box;-webkit-line-clamp:7;-webkit-box-orient:vertical;overflow:hidden}
.rv-more{justify-self:start;background:none;border:0;padding:0;font:400 13px var(--ko);color:var(--inju);cursor:pointer;border-bottom:1px solid currentColor;min-height:32px}
.rv-more[hidden]{display:none}
.rv-who{font-size:13px;color:var(--ink2);display:flex;justify-content:space-between;gap:12px}
.rv-note{text-align:center;font-size:12.5px;color:var(--ink2);margin-top:20px}
.rv-note a{color:inherit}

/* 이웃 이야기 작은 설명 (영어) */
.nb-note{font-size:13px;font-style:italic;color:var(--ink2);max-width:36em}

/* 유튜브·공식 채널 */
.yt-more{display:inline-flex;align-items:center;gap:8px;margin-top:18px;font-size:14px;letter-spacing:.04em;color:inherit;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:2px;opacity:.85}
.yt-more svg{color:#C4302B}
.chans{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px}
.chans a{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 14px;border:1px solid rgba(246,242,234,.4);color:inherit;text-decoration:none;font-size:14px;letter-spacing:.04em}
.chans svg{color:#C4302B}
.chans b{display:inline-grid;place-items:center;width:18px;height:18px;font:700 12px/1 sans-serif;color:#fff;background:#03C75A;border-radius:3px}
.chans a:last-child b{background:#4285F4}

/* 예약 완료 화면 */
.rsv-done{max-width:640px;margin:40px auto 0;padding:28px 0;border-top:1px solid rgba(140,47,37,.4);border-bottom:1px solid rgba(140,47,37,.4);display:grid;gap:12px;text-align:center;outline:none}
.rsv-done h3{font-size:24px;color:var(--inju)}
.rsv-done .when{font-size:18px}
.rsv-done .idea{display:grid;gap:10px;text-align:left;margin-top:16px;padding-top:20px;border-top:1px dotted rgba(36,34,31,.3)}
.rsv-done .idea h4{margin:0;font-weight:400;font-size:18px}
.rsv-done textarea{font:16px var(--ko);padding:10px;border:0;border-bottom:1px solid var(--ink2);background:#fff;width:100%}
.rsv-done .imsg{font-size:14px;color:var(--ink2);margin:0}
button[disabled]{opacity:.6;cursor:wait}

/* 띠 배너 (관리자에서 켬) */
.band{position:fixed;left:0;right:0;top:0;z-index:56;height:34px;display:flex;align-items:center;justify-content:center;padding:0 var(--g);background:var(--inju);color:var(--hanji);font-size:13px;letter-spacing:.06em;text-align:center}
.band[hidden]{display:none}
.band a{color:inherit;text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.has-band .hd{top:34px}
.has-band .drawer{padding-top:34px}

/* 바닥 메뉴 */
.ft-nav{display:flex;flex-wrap:wrap;gap:8px 18px;justify-content:center;font-size:13px;letter-spacing:.06em}
.ft-nav a{text-decoration:none;opacity:.85}

/* 개발용 의견 남기기 */
.fbk{position:fixed;right:12px;top:calc(136px + env(safe-area-inset-top,0px));z-index:140;font-family:var(--ko)}
@media (min-width:900px){.fbk{top:124px}}
.fbk-btn{width:48px;height:48px;border-radius:50%;border:1px solid rgba(246,242,234,.5);background:rgba(21,19,17,.78);color:#F6F2EA;font:400 13px var(--ko);cursor:pointer;box-shadow:0 6px 18px -8px rgba(0,0,0,.8)}
.fbk-panel{position:absolute;right:0;top:58px;max-height:calc(100svh - 220px);overflow:auto;width:min(86vw,340px);background:#1E1B18;color:#F6F2EA;padding:14px 16px 16px;display:grid;gap:10px;box-shadow:0 20px 40px -20px rgba(0,0,0,.9);font-size:14px}
.fbk-panel[hidden]{display:none}
.fbk-hd{display:flex;justify-content:space-between;align-items:center;font-size:13px;letter-spacing:.08em}
.fbk-x{background:none;border:0;color:inherit;font-size:22px;cursor:pointer;width:32px;height:32px}
.fbk-page{margin:0;font-size:12px;opacity:.7}
.fbk-panel textarea{width:100%;font:15px var(--ko);background:#F6F2EA;color:#24221F;border:0;padding:10px;resize:vertical;min-height:84px}
.fbk-tools{display:flex;flex-wrap:wrap;gap:6px}
.fbk-tool{font:400 13px var(--ko);color:inherit;background:none;border:1px solid rgba(246,242,234,.45);padding:7px 10px;cursor:pointer;min-height:36px;display:inline-flex;align-items:center}
.fbk-tool[hidden]{display:none}
.fbk-hint{margin:0;font-size:11.5px;opacity:.6;line-height:1.5}
.fbk-rm{margin-top:4px;background:none;border:0;color:inherit;opacity:.7;font-size:12px;cursor:pointer;padding:0;text-decoration:underline}
.fbk-prev img{max-width:100%;max-height:120px;display:block}
.fbk-panel .btn{min-height:44px;font-size:15px}
.fbk-msg{margin:0;font-size:12.5px;opacity:.85;min-height:1.2em}
.fbk-list summary{cursor:pointer;font-size:13px;opacity:.85}
.fbk-list ul{list-style:none;padding:0;margin:8px 0;max-height:160px;overflow:auto;display:grid;gap:8px}
.fbk-list li{font-size:12.5px;display:grid;gap:2px;border-top:1px dotted rgba(246,242,234,.25);padding-top:6px}
.fbk-list li span{opacity:.6}
.fbk-list li p{margin:0}
.fbk-list li button{justify-self:start;background:none;border:0;color:inherit;opacity:.6;font-size:12px;cursor:pointer;padding:0}
.fbk-list .link{font:400 13px var(--ko);background:none;border:0;border-bottom:1px solid currentColor;color:inherit;cursor:pointer;padding:0;min-height:auto}
