/*OBF*/@font-face{font-family:'OBrush';src:url('../../fonts/obrush_c21.woff2') format('woff2');font-weight:400;font-display:swap;unicode-range:U+C12D,U+C130-C131,U+C139-C140,U+C154-C168,U+C194-C27D,U+C2A8,U+C2B4,U+C2B7-C2B9,U+C2DD,U+C2EB,U+C2ED-C30D,U+C368-C53B,U+C545,U+C549,U+C54C,U+C555-C557,U+C559-C55E,U+C561-C571,U+C57D-C598,U+C5B5-C5BB,U+C5BD-C5C4,U+C5C7,U+C5C9-C5CC,U+C5D1,U+C5E0-C5E3,U+C5ED-C5EE,U+C5FC-C61B,U+C625,U+C62C-C62D,U+C633-C63B,U+C644,U+C655-C6A9,U+C6B1,U+C6C0-C6CC,U+C6DC-C6F9,U+C717-C721,U+C728-C735,U+C751,U+C775,U+C783,U+C787,U+C789-C78E,U+C794-C7A4,U+C7A6,U+C7C1-C800,U+C810,U+C813,U+C81D-C838,U+C871-C881,U+C88B-C8E0,U+C8FD,U+C904-C90D,U+C92C-C99D,U+C9CA-C9F1,U+CA0D-CC3E,U+CC45-CCA8,U+CCAD,U+CCD0-CCE4,U+CD09-CD1B,U+CD5C-CD95,U+CD9C-CE35,U+CE5C-CE6D,U+CE7C-CEA1,U+CEE8,U+CEF7-CF08,U+CF20-CF8C,U+CFFC-D06C,U+D074-D07D,U+D0A8-D0B9,U+D0C1-D0D5,U+D0ED-D0F1,U+D131-D134,U+D145,U+D150-D17C,U+D1A1-D1A4,U+D1F4,U+D230-D30E,U+D31D-D328,U+D380-D398,U+D39C-D3B4,U+D3D0,U+D3ED-D45C,U+D479-D47C,U+D488-D551,U+D559,U+D56B-D56D,U+D575-D588,U+D5C8,U+D5D0-D600,U+D608-D64D,U+D658-D669,U+D68D-D749,U+D754-D790,U+D799-D7A3}@font-face{font-family:'OBrush';src:url('../../fonts/obrush_c11.woff2') format('woff2');font-weight:400;font-display:swap;unicode-range:U+AC04-AC07,U+AC11-AC16,U+AC1A,U+AC1D-AC54,U+AC71-AC77,U+AC81,U+AC89,U+ACA0-ACAC,U+ACBD-ACC1,U+ACE1-ACE4,U+ACE8-ACF1,U+ACF5,U+AD04-AD50,U+AD70-AD73,U+AD76-AD7F,U+AD82-ADC8,U+ADE0,U+ADF9-ADFC,U+AE09-AE0B,U+AE34,U+AE40,U+AE43-AE4A,U+AE4E-AE65,U+AE7C,U+AEBE-AECF,U+AEF4-AFC0,U+AFD4-B04A,U+B053-B08D,U+B0A1,U+B0A9-B0AB,U+B0AD-B0B3,U+B0B8-B0E5,U+B109-B10C,U+B113-B123,U+B128-B141,U+B155,U+B179-B192,U+B194-B1A8,U+B20C-B290,U+B299-B2AC,U+B2CC-B2D0,U+B2DD,U+B2E5,U+B2EB,U+B2ED-B2EE,U+B2FF,U+B304-B313,U+B355-B35C,U+B365-B371,U+B3C5-B3D5,U+B3FC-B410,U+B41C-B429,U+B451-B454,U+B460-B4C8,U+B4DD,U+B4E3,U+B4EC-B545,U+B550-B5A1,U+B5A8-B755,U+B77D-B784,U+B78F-B790,U+B799-B7C9,U+B7F0-B801,U+B808-B818,U+B825-B840,U+B85D-B86D,U+B8B0-B8E1,U+B8EC-B960,U+B975,U+B985,U+B989,U+B9AD,U+B9BD-B9C1,U+B9C9,U+B9CE,U+B9D1-B9D9,U+B9DD,U+B9E1,U+B9E5-B9FA,U+BA3C-BA4D,U+BA58-BA74,U+BA87,U+BAA9-BABB,U+BB36,U+BB47-BBA4,U+BBFC-BBFF,U+BC0C-BC11,U+BC15-BC18,U+BC1C-BC1D,U+BC25,U+BC2D-BC43,U+BC85,U+BC8C-BC94,U+BC97-BCC0,U+BCCD-BCD1,U+BCF8-BD05,U+BD10-BD59,U+BD81,U+BD90-BE14,U+BE4C-BE5A,U+BE60-BF18,U+BFCC-C090,U+C0AD,U+C0B6,U+C0BD-C0BF,U+C0C9-C0D8,U+C11D-C11E,U+C124-C12C}@font-face{font-family:'OBrush';src:url('../../fonts/obrush_s1.woff2') format('woff2');font-weight:400;font-display:swap;unicode-range:U+21-27,U+2A-2B,U+2D,U+2F,U+33-34,U+36,U+38-3E,U+40,U+43-48,U+4A-4C,U+4E-53,U+55-7E,U+FC-314E,U+FF08-FF1F}@font-face{font-family:'OBrush';src:url('../../fonts/obrush_b1.woff2') format('woff2');font-weight:400;font-display:block;unicode-range:U+28-29,U+31,U+35,U+3F,U+41-42,U+49,U+4D,U+54,U+B7,U+AC01,U+AC08,U+AC19,U+AC1C,U+AC70,U+AC78-AC80,U+AC83,U+AC8C,U+ACB9-ACBC,U+ACC4-ACE0,U+ACF3,U+ACFC,U+AD6C-AD6D,U+AD74,U+ADDC,U+AE08,U+AE38,U+AE41,U+AE4C,U+AEBC,U+AED8,U+AFC8,U+B04C,U+B0A0,U+B0A8,U+B0AC,U+B108,U+B110,U+B150,U+B178,U+B193,U+B204-B208,U+B2C8,U+B2D8,U+B2E8,U+B2F5,U+B354,U+B3D9,U+B418,U+B458,U+B4E0,U+B5A4,U+B760-B77C,U+B78D,U+B791-B798,U+B807,U+B824,U+B8E8,U+B974,U+B978-B984,U+B987,U+B9B4-B9BC,U+B9CC,U+B9D0,U+B9DE,U+B9E4,U+BA38,U+BA54,U+BABD,U+BB35,U+BB3B,U+BBF8,U+BC00,U+BC14,U+BC24,U+BC84,U+BC88,U+BC95,U+BCC4,U+BCD5,U+BCF5,U+BD09,U+BD84-BD88,U+BE5B,U+C0B0,U+C0C8,U+C120-C123,U+C148-C14B,U+C190,U+C2A4,U+C2AC,U+C2DC,U+C313,U+C544,U+C548,U+C54A,U+C554,U+C558,U+C57C,U+C5BC,U+C5C5,U+C5D4,U+C628,U+C62E,U+C654,U+C6B8,U+C6D0-C6D4,U+C704,U+C77D,U+C785,U+C791,U+C804-C808,U+C811,U+C81C,U+C84C,U+C885,U+C900,U+C911-C918,U+C9C8,U+C9F8,U+CC44,U+CCAB,U+CCB4,U+CD08,U+CD1D,U+CD98,U+CE58-CE59,U+CEEC,U+CF1C,U+CFE0,U+D070,U+D0A4,U+D0DC,U+D130,U+D138,U+D14C,U+D22C,U+D310,U+D37C,U+D399,U+D3BC,U+D3EC,U+D478,U+D480,U+D589-D5A5,U+D5CC,U+D604,U+D750-D751,U+D798}@font-face{font-family:'OBrush';src:url('../../fonts/obrush_a1.woff2') format('woff2');font-weight:400;font-display:block;unicode-range:U+20,U+2C,U+2E,U+30,U+32,U+37,U+AC00,U+AC10,U+ACB0,U+ACE7,U+AD00,U+AD81,U+ADF8,U+AE00,U+AE30,U+AE68,U+B098-B09C,U+B0B4,U+B124,U+B144,U+B294-B298,U+B2E4,U+B2EC,U+B2F4,U+B2F9,U+B300,U+B35F,U+B3C4,U+B450,U+B4DC,U+B4E4,U+B54C,U+B78C,U+B7EC,U+B85C,U+B871,U+B9AC,U+B9B0,U+B9C8,U+B9DB,U+BA39,U+BA85,U+BAA8,U+BB18-BB34,U+BB38,U+BB3C,U+BC1B,U+BC29,U+BCF4,U+BD80,U+BD89,U+BE44-BE48,U+BF51,U+C0AC,U+C0B4,U+C0BC,U+C0C1,U+C0DD-C11C,U+C12F,U+C138,U+C18C-C18D,U+C2B5,U+C2E0-C2E4,U+C2EC,U+C560,U+C5B4,U+C5C6,U+C5C8,U+C5D0,U+C5EC,U+C5F0-C5F4,U+C624,U+C640,U+C6B0,U+C6B4,U+C724,U+C73C-C74C,U+C758-C774,U+C778-C77C,U+C784,U+C788,U+C790,U+C7A5,U+C7AC,U+C801,U+C815,U+C870,U+C8FC,U+C9C0-C9C4,U+CE74-CE78,U+CEE4,U+CFE8,U+D0C0,U+D0DD,U+D1A0,U+D1B5,U+D314,U+D3B8,U+D3C9,U+D558,U+D55C-D569,U+D574,U+D654-D655,U+D68C}/*OBF*/

/* Layout: one full-height vertical stage (phone frame on desktop). Two stacked <video> layers crossfade; subtitles in large serif at mid-height; interaction sheets rise from the bottom. Single dark look by design. */
:root{
  --brush:'OBrush','Noto Serif KR',serif; --bmj:'Song Myung','Noto Serif KR',serif;
  --bg:#07060a; --stage:#0d0b10; --ink:#f6f1ea; --ink-2:#cfc6ba; --ink-3:#8e867c;
  --glass:rgba(18,14,20,.55); --glass-line:rgba(255,240,220,.22);
  --silver:#c9d3e6; --gold:#e3b866; --gold-2:#f3d79b;
  --wood:#46b47f; --fire:#ec5a43; --earth:#d3a13a; --metal:#c9d1dc; --water:#5b8ce6;
  --sans:'Noto Sans KR',"Apple SD Gothic Neo","Malgun Gothic",system-ui,sans-serif;
  --serif:'Noto Serif KR',"Nanum Myeongjo",serif;
  color-scheme:dark;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{height:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);display:flex;justify-content:center;overflow:hidden;word-break:keep-all;overflow-wrap:break-word}
button{font-family:inherit}
.stage{position:relative;width:100%;max-width:460px;height:100%;background:var(--stage);overflow:hidden}
@media (min-width:700px){.stage{height:min(100%,920px);margin-top:auto;margin-bottom:auto;border-radius:22px;box-shadow:0 30px 80px rgba(0,0,0,.6)}}

/* media layers */
.layer{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .28s ease;will-change:opacity;transform:translateZ(0)}
.layer.on{opacity:1}
.poster{position:absolute;inset:0;background:#000 center/cover no-repeat;opacity:0;transition:opacity .6s ease}
.poster.on{opacity:1}
.poster.kb{animation:kb 9s ease-in-out infinite alternate}
@keyframes kb{from{transform:scale(1)}to{transform:scale(1.05)}}
.shade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(0,0,0,.45) 0%,rgba(0,0,0,0) 18%,rgba(0,0,0,0) 45%,rgba(0,0,0,.55) 72%,rgba(0,0,0,.88) 100%)}

/* top bar */
.top{position:absolute;left:0;right:0;top:0;padding:calc(env(safe-area-inset-top,0px) + 14px) 16px 0;display:flex;justify-content:space-between;align-items:center;z-index:30}
.backB{display:none;align-items:center;gap:4px;height:38px;padding:0 14px 0 8px;border-radius:999px;border:1px solid var(--glass-line);background:var(--glass);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:var(--ink);font-size:14px;font-weight:700;cursor:pointer;font-family:var(--sans)}
.backB svg{width:20px;height:20px}
.stage.subm .brand{display:none}
.stage.subm .backB{display:inline-flex}
.stage.subm .top{z-index:60}
.brand{display:inline-flex;align-items:center;gap:6px;border:0;background:none;padding:4px 2px;cursor:pointer;font-family:var(--brush);font-weight:400;letter-spacing:.02em;font-size:18px;line-height:1;color:var(--gold-2);text-shadow:0 1px 8px rgba(0,0,0,.6)}
.brand i{display:inline-grid;width:15px;height:15px;opacity:.75}
.brand i svg{width:15px;height:15px}
.tbtn{width:38px;height:38px;border-radius:50%;border:1px solid var(--glass-line);background:var(--glass);backdrop-filter:blur(8px);color:var(--ink);display:grid;place-items:center;cursor:pointer}
.tbtn svg{width:18px;height:18px}
.tgroup{display:flex;gap:8px}

/* subtitles */
.sub{position:absolute;left:18px;right:18px;top:56%;transform:translateY(-50%);text-align:center;z-index:20;pointer-events:none}
.sub p{margin:0;font-family:var(--serif);font-weight:900;font-size:clamp(26px,7.6vw,34px);line-height:1.32;letter-spacing:-.01em;color:#fff;text-shadow:0 2px 3px rgba(0,0,0,.7),0 0 22px rgba(0,0,0,.65);text-wrap:balance;opacity:0;transform:translateY(8px);transition:opacity .35s ease,transform .35s ease}
.sub p.on{opacity:1;transform:none}
.sub .who{display:block;font-family:var(--sans);font-size:12px;font-weight:700;letter-spacing:.2em;color:var(--gold-2);margin-bottom:10px;text-shadow:0 1px 6px rgba(0,0,0,.8);opacity:0;transition:opacity .3s}
.sub .who.on{opacity:1}

/* bottom panels */
.panel{position:absolute;left:0;right:0;bottom:0;padding:0 16px calc(env(safe-area-inset-bottom,0px) + 22px);z-index:25;display:flex;flex-direction:column;gap:10px;transform:translateY(30px);opacity:0;pointer-events:none;transition:opacity .35s ease,transform .35s ease}
.panel.on{transform:none;opacity:1;pointer-events:auto}
.choice{width:100%;min-height:58px;border-radius:18px;border:1px solid var(--glass-line);background:var(--glass);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);color:var(--ink);font-size:17px;font-weight:500;cursor:pointer;padding:14px 18px}
.choice:active{transform:scale(.985)}
.choice.primary{background:linear-gradient(180deg,rgba(227,184,102,.95),rgba(196,146,64,.95));color:#1a1206;border-color:transparent;font-weight:900}
.link{background:none;border:0;color:var(--ink-2);font-size:14px;padding:8px;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.sheet{border-radius:22px;border:1px solid var(--glass-line);background:rgba(16,12,18,.72);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);padding:18px 16px 16px}
.sheet h3{margin:0 0 12px;font-size:15px;font-weight:700;color:var(--gold-2);letter-spacing:.04em}
.row{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:8px}
.row2{display:grid;grid-template-columns:1fr auto;gap:8px;margin-top:8px}
select,input[type=text]{width:100%;height:50px;border-radius:12px;border:1px solid var(--glass-line);background:rgba(0,0,0,.35);color:var(--ink);font-size:16px;font-family:var(--sans);padding:0 12px;appearance:none;-webkit-appearance:none}
select{background-image:linear-gradient(45deg,transparent 50%,var(--ink-2) 50%),linear-gradient(135deg,var(--ink-2) 50%,transparent 50%);background-position:calc(100% - 16px) 22px,calc(100% - 11px) 22px;background-size:5px 5px;background-repeat:no-repeat;padding-right:26px}
select:focus,input:focus,.choice:focus-visible,.chip:focus-visible,.tbtn:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.seg{display:flex;border:1px solid var(--glass-line);border-radius:12px;overflow:hidden;height:50px}
.seg button{flex:1;border:0;background:transparent;color:var(--ink-2);font-size:15px;padding:0 14px;cursor:pointer}
.seg button[aria-pressed=true]{background:rgba(227,184,102,.22);color:var(--gold-2);font-weight:700}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{border:1px solid var(--glass-line);background:rgba(0,0,0,.3);color:var(--ink);border-radius:999px;padding:11px 16px;font-size:15px;cursor:pointer}
.chip[aria-pressed=true]{background:rgba(227,184,102,.25);border-color:var(--gold);color:var(--gold-2);font-weight:700}
.gseg{margin-top:8px}
#gX{font-size:13px;padding:0 6px;flex:1.35}
.gcalc{margin-top:8px;display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px}
.gcalc[hidden]{display:none}
.gcalc>span{font-size:13px;color:var(--ink-2)}
.gcalc .seg{flex:1;height:40px}
.gcalc .seg button{font-size:13.5px}
.gcalc small{width:100%;font-size:11.5px;color:var(--ink-3,#8f8579)}
.gseg.need{border-color:var(--gold);animation:gNeed .5s 2}
@keyframes gNeed{50%{border-color:rgba(227,184,102,.2)}}
.hint{font-size:12px;color:var(--ink-3);margin-top:8px;line-height:1.5}


/* ---------- 오프닝 v2: 한 명씩 크게 → 검은 화면에 다섯 점 → 한 칸이 빈다 → 태어난 해 ---------- */
.op{position:absolute;inset:0;z-index:48;background:#050407;overflow:hidden;display:none}
.op.on{display:block}
.op.bye{opacity:0;transition:opacity .6s;pointer-events:none}
.opSl{position:absolute;inset:0;background:#000 center 16%/cover no-repeat;opacity:0;transform:scale(1.08);transition:opacity .45s ease,transform 1.6s ease-out}
.opSl.on{opacity:1;transform:scale(1)}
.opSl:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,4,7,.25),rgba(5,4,7,0) 30%,rgba(5,4,7,.15) 55%,rgba(5,4,7,.85) 88%)}
.opSl span{position:absolute;left:0;right:0;bottom:calc(env(safe-area-inset-bottom,0px) + 70px);z-index:1;text-align:center;font-family:var(--serif);font-weight:700;font-size:13px;letter-spacing:.5em;color:#fff;opacity:.9}
.opSl span b{display:block;font-size:44px;font-weight:900;letter-spacing:0;color:var(--c);margin-bottom:10px;text-shadow:0 0 24px var(--c)}
.opMark{position:absolute;left:50%;top:44%;width:96px;height:96px;transform:translate(-50%,-50%);z-index:5;transition:opacity .5s}
.opMark *{fill:none;stroke:#D9B46A;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:290;stroke-dashoffset:290}
.op.s1 .opMark *{animation:opDraw .9s cubic-bezier(.5,0,.2,1) forwards}
.op.s1 .opMark path:nth-of-type(1){animation-delay:.2s}.op.s1 .opMark path:nth-of-type(2){animation-delay:.32s}.op.s1 .opMark path:nth-of-type(3){animation-delay:.44s}.op.s1 .opMark path:nth-of-type(4){animation-delay:.56s}
@keyframes opDraw{to{stroke-dashoffset:0}}
.op.s2 .opMark{opacity:0}
.opTake{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:3;opacity:0;transition:opacity .7s;pointer-events:none;background:#050407}
.op.take .opTake{opacity:1}
.opEnd{position:absolute;inset:0;z-index:6;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:calc(env(safe-area-inset-top,0px) + 24px) 24px calc(env(safe-area-inset-bottom,0px) + 230px);opacity:0;pointer-events:none;transition:opacity .8s;background:#050407;overflow:hidden}
.opEnd .bgS{position:absolute;inset:-4%;background:url('../../img/op_take_end.jpg') center 55%/cover no-repeat;filter:saturate(1.1) contrast(1.05);transform:scale(1.12);transition:transform 9s ease-out}
.op.s3 .opEnd .bgS{transform:scale(1)}
.opEnd .bgF{position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,4,7,.55) 0%,rgba(5,4,7,.62) 30%,rgba(5,4,7,.78) 60%,rgba(5,4,7,.95) 85%),radial-gradient(ellipse at 50% 38%,rgba(5,4,7,0),rgba(5,4,7,.55) 70%)}
.opEnd .bgG{position:absolute;left:10%;right:10%;top:18%;height:40%;background:radial-gradient(ellipse at 50% 50%,rgba(255,170,90,.22),transparent 65%);mix-blend-mode:screen;animation:flick 3.2s ease-in-out infinite}
@keyframes flick{0%,100%{opacity:.75}20%{opacity:1}45%{opacity:.6}70%{opacity:.95}}
.opEnd .emb{position:absolute;inset:0;pointer-events:none}
.opEnd .emb i{position:absolute;bottom:-10px;width:3px;height:3px;border-radius:50%;background:#ffc27a;box-shadow:0 0 6px 2px rgba(255,160,70,.6);opacity:0;animation:ember linear infinite}
@keyframes ember{0%{transform:translate(0,0);opacity:0}10%{opacity:.9}80%{opacity:.5}100%{transform:translate(var(--dx),-90vh);opacity:0}}
.opEnd>*:not(.bgS):not(.bgF):not(.bgG):not(.emb){position:relative;z-index:1}
.op.s3 .opEnd{opacity:1;pointer-events:auto}
.opDots{display:flex;gap:12px}
.opDots i{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-family:var(--serif);font-weight:900;font-size:17px;color:#0b0a0d;background:var(--c);box-shadow:0 0 18px color-mix(in srgb,var(--c) 45%,transparent);transition:all .6s}
.opDots i.gone{background:transparent;font-size:0;box-shadow:none;border:1.5px dashed rgba(233,211,164,.55)}
.opDots i.gone:after{content:"?";color:#E9D3A4;font-size:19px;line-height:1}
.opDots i.cand{background:transparent;color:rgba(233,211,164,.9);box-shadow:none;border:1.5px dashed rgba(233,211,164,.5);animation:qPulse 1.8s ease-in-out infinite}
.opDots i.cand:after{content:""}
@keyframes qPulse{50%{opacity:.4}}
/* 10/6 마지막 화면: 신당 안쪽 캐릭터 몽타주(이미 있는 클립 34컷) · 위에 회색 필터 그대로 */
.opEnd>.bgV{position:absolute!important;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 55%;opacity:0;transition:opacity 1.2s;z-index:0!important;filter:saturate(.9) contrast(1.04)}
.opEnd>.bgV.on{opacity:1}
.opPick .opYr{display:none!important}
.opPick .opGo{margin-top:0}

.opEnd h2{margin:34px 0 0;text-align:center;font-family:var(--serif);font-weight:900;font-size:clamp(26px,7.4vw,32px);line-height:1.3;opacity:0;transform:translateY(10px);transition:all .6s}
.opEnd p{margin:10px 0 0;text-align:center;font-family:var(--serif);font-weight:700;font-size:clamp(18px,5vw,21px);color:#E9D3A4;opacity:0;transform:translateY(10px);transition:all .6s}
.op.s4 .opEnd h2,.op.s5 .opEnd p{opacity:1;transform:none}
.opRes{margin:18px 0 0;min-height:44px;text-align:center;font-size:13.5px;line-height:1.65;color:var(--ink-2)}
.opRes em{font-style:normal;color:#E9D3A4;font-weight:700}
.opPick{position:absolute;left:0;right:0;bottom:0;z-index:7;padding:0 20px calc(env(safe-area-inset-bottom,0px) + 22px);opacity:0;transform:translateY(16px);transition:all .6s;pointer-events:none}
.op.s6 .opPick{opacity:1;transform:none;pointer-events:auto}
.opYr{display:block;width:100%;height:54px;border-radius:16px;border:1px solid rgba(233,211,164,.35);background:rgba(255,255,255,.04);color:var(--ink);font-size:16.5px;font-weight:700;text-align:center;text-align-last:center;font-family:var(--sans);appearance:none;-webkit-appearance:none;cursor:pointer}
.opGo{width:100%;height:54px;margin-top:10px;border:0;border-radius:16px;background:#D9B46A;color:#15110a;font-size:16px;font-weight:800;cursor:pointer;font-family:var(--sans);transition:opacity .3s}
.opGo:disabled{opacity:.3}
.opHome{display:block;margin:14px auto 0;padding:6px 10px;border:0;background:none;color:rgba(255,255,255,.82);font-size:15px;font-weight:600;cursor:pointer;font-family:var(--sans)}
/* 10/12 건너뛰기: 어두운 영상 위에서도 보이게(대비 · 44px 누름 영역) */
.opX{position:absolute;right:12px;top:calc(env(safe-area-inset-top,0px) + 10px);z-index:8;min-height:44px;padding:0 16px;border:1px solid rgba(255,255,255,.28);border-radius:22px;background:rgba(10,8,12,.55);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:#f6ecdf;font-size:14px;font-weight:600;letter-spacing:.02em;cursor:pointer;font-family:var(--sans);transition:opacity .3s}
.opX::after{content:" ›";opacity:.7}
.opBar{position:absolute;left:0;right:0;top:0;z-index:8;height:3px;background:linear-gradient(90deg,#D9B46A,#ffe3a8);transform-origin:left;transform:scaleX(0);transition-property:transform;transition-timing-function:linear;pointer-events:none}
.opBar.go{transform:scaleX(1)}
.op.s6 .opX{opacity:0;pointer-events:none}

/* start screen */
.start{position:absolute;inset:0;z-index:40;display:flex;flex-direction:column;justify-content:flex-end;padding:0 16px calc(env(safe-area-inset-bottom,0px) + 26px);background:linear-gradient(180deg,rgba(7,6,10,.2),rgba(7,6,10,.15) 40%,rgba(7,6,10,.92) 78%);transition:opacity .6s}
.sLogo{position:absolute;left:0;right:0;top:calc(env(safe-area-inset-top,0px) + 84px);display:flex;align-items:center;justify-content:center;gap:10px;pointer-events:none}
.sLogo img{width:40px;height:40px;filter:drop-shadow(0 2px 10px rgba(0,0,0,.6))}
.sLogo b{display:block;font-family:var(--serif);font-size:22px;font-weight:700;letter-spacing:.03em;line-height:1;color:#E9D3A4;text-shadow:0 2px 10px rgba(0,0,0,.75)}
.sLogo small{display:block;font-size:9.5px;letter-spacing:.42em;color:var(--gold-2);font-weight:700;margin-top:5px;text-shadow:0 1px 6px rgba(0,0,0,.8)}
.start.off{opacity:0;pointer-events:none}
.start .kicker{font-size:12px;letter-spacing:.3em;color:var(--gold-2);font-weight:700}
.start h1{font-family:var(--serif);font-weight:900;font-size:clamp(26px,7.6vw,34px);line-height:1.18;margin:10px 0 10px;letter-spacing:-.01em}
.start p{margin:0 0 22px;color:var(--ink-2);font-size:15px;line-height:1.6}
.load{margin-top:14px;display:flex;flex-direction:column;align-items:center;gap:6px;font-size:11px;color:var(--ink-3);letter-spacing:.04em}.load .lb{width:120px;height:2px;background:rgba(255,255,255,.12);border-radius:2px;overflow:hidden}.load .lb i{display:block;height:100%;width:0;background:var(--gold-2);transition:width .3s}
.choice:disabled{opacity:.55}
.start .snd{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--ink-3);margin-top:12px;justify-content:center}

/* reveal */
.reveal{position:absolute;inset:0;z-index:28;pointer-events:none}
.flash{position:absolute;inset:0;background:radial-gradient(circle at 50% 45%,rgba(255,236,190,.95),rgba(255,236,190,0) 60%);opacity:0}
.flash.go{animation:flash 1.1s ease-out forwards}
@keyframes flash{0%{opacity:0}25%{opacity:1}100%{opacity:0}}
.namecard{position:absolute;left:16px;right:16px;bottom:calc(env(safe-area-inset-bottom,0px) + 26px);border-radius:22px;padding:18px 18px 16px;background:rgba(10,8,12,.62);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--glass-line);transform:translateY(30px);opacity:0;transition:all .6s ease;pointer-events:none}
.namecard.on{transform:none;opacity:1}
.namecard .k{font-size:12px;letter-spacing:.25em;color:var(--gold-2);font-weight:700}
.namecard .n{display:flex;align-items:baseline;gap:10px;margin-top:8px}
.namecard .n b{font-family:var(--serif);font-size:34px;font-weight:900;color:var(--c)}
.namecard .n span{font-size:22px;font-weight:900}
.namecard .d{font-size:14px;color:var(--ink-2);margin-top:4px}

/* partner reading (Sion): webtoon report + paywall */
.report{position:absolute;inset:0;z-index:36;overflow-y:auto;background:#0b0d12;opacity:0;pointer-events:none;transition:opacity .6s;padding:calc(env(safe-area-inset-top,0px) + 62px) 0 calc(env(safe-area-inset-bottom,0px) + 36px)}
.report.on{opacity:1;pointer-events:auto}
.rh{padding:0 18px 16px}
.rh small{display:block;font-size:11px;letter-spacing:.24em;color:var(--silver);font-weight:700}
.rh b{display:block;font-family:var(--serif);font-size:25px;font-weight:900;line-height:1.3;margin-top:6px}
.rh span{display:block;font-size:13px;color:var(--ink-3);margin-top:6px}
.wt{position:relative}
.wt img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;background:#111}
.bub{position:relative;z-index:1;margin:-44px 16px 26px;background:rgba(248,249,252,.97);color:#14161c;border-radius:18px;padding:14px 16px 15px;font-size:16px;line-height:1.6;font-weight:500;box-shadow:0 12px 30px rgba(0,0,0,.45)}
.bub .by{display:block;font-size:11px;font-weight:700;letter-spacing:.18em;color:#5b6475;margin-bottom:4px}
.bub.narr{background:rgba(14,16,22,.9);color:#e8ecf3;border:1px solid rgba(201,211,230,.28)}
.bub b{font-weight:900}
.more{margin:4px 16px 0}
.paywrap{display:none}
.paywrap.on{display:block}
.wt.lock img{filter:blur(16px) brightness(.55)}
.pay{position:relative;z-index:2;margin:-150px 16px 0;border-radius:22px;border:1px solid rgba(201,211,230,.35);background:rgba(14,16,22,.93);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);padding:20px 18px 18px}
.pay .k{font-size:11px;letter-spacing:.22em;color:var(--silver);font-weight:700}
.pay h4{margin:6px 0 12px;font-family:var(--serif);font-size:22px;font-weight:900;line-height:1.35}
.pay ol{list-style:none;margin:0 0 16px;padding:0;display:grid;gap:8px}
.pay li{display:flex;gap:10px;align-items:center;font-size:15px;color:var(--ink);padding:11px 12px;border-radius:12px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08)}
.pay li i{font-style:normal;opacity:.8}
.pay .price{display:flex;align-items:baseline;gap:8px;margin:0 0 12px}
.pay .price s{color:var(--ink-3);font-size:14px}
.pay .price b{font-size:26px;font-weight:900}
.choice.silver{background:linear-gradient(180deg,#e9edf5,#b9c3d6);color:#10131a;border:0;font-weight:800}
/* membership demo: permission, next-morning, lock screen push, mission, gauge, subscribe */
.ov{position:absolute;inset:0;z-index:50;opacity:0;pointer-events:none;transition:opacity .5s}
.ov.on{opacity:1;pointer-events:auto}
.prePerm{display:flex;flex-direction:column;justify-content:flex-end;padding:0 16px calc(env(safe-area-inset-bottom,0px) + 22px);background:rgba(0,0,0,.55)}
.prePerm .sheet{text-align:center}
.prePerm .av{width:72px;height:72px;border-radius:50%;margin:0 auto 12px;background:#000 center 20%/cover;border:2px solid var(--gold)}
.prePerm p{margin:0 0 14px;font-family:var(--serif);font-size:19px;font-weight:700;line-height:1.5}
.sysA{display:grid;place-items:center;background:rgba(0,0,0,.35)}
.sysA .box{width:272px;border-radius:14px;background:rgba(242,242,247,.96);color:#111;text-align:center;overflow:hidden;font-family:-apple-system,BlinkMacSystemFont,var(--sans)}
.sysA .box b{display:block;padding:18px 16px 4px;font-size:16.5px;line-height:1.3}
.sysA .box span{display:block;padding:0 16px 16px;font-size:13px;line-height:1.4;color:#333}
.sysA .btns{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid rgba(0,0,0,.15)}
.sysA .btns button{border:0;background:none;height:44px;font-size:16.5px;color:#0a64d8;cursor:pointer}
.sysA .btns button+button{border-left:1px solid rgba(0,0,0,.15);font-weight:600}
.night{display:grid;place-items:center;background:#000;text-align:center}
.night small{display:block;font-size:12px;letter-spacing:.3em;color:var(--ink-3)}
.night b{display:block;font-family:var(--serif);font-size:40px;font-weight:900;margin-top:8px}
.lockS{background:#0c0c10 center/cover no-repeat;color:#fff;font-family:-apple-system,BlinkMacSystemFont,var(--sans)}
.lockS::before{content:"";position:absolute;inset:0;backdrop-filter:blur(18px) brightness(.7);-webkit-backdrop-filter:blur(18px) brightness(.7)}
.lockS .in{position:relative;padding:calc(env(safe-area-inset-top,0px) + 70px) 12px 0;text-align:center}
.lockS .dt{font-size:17px;font-weight:600;opacity:.9}
.lockS .tm{font-size:84px;font-weight:700;line-height:1;margin:4px 0 26px;letter-spacing:-.02em}
.noti{display:flex;gap:11px;align-items:center;text-align:left;padding:12px 13px;border-radius:20px;background:rgba(245,245,250,.2);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);cursor:pointer;transform:translateY(-14px);opacity:0;transition:all .5s cubic-bezier(.2,.8,.2,1)}
.noti.on{transform:none;opacity:1}
.noti .pic{position:relative;flex:none;width:42px;height:42px;border-radius:50%;background:#000 center 20%/cover}
.noti .pic i{position:absolute;right:-3px;bottom:-3px;width:18px;height:18px;border-radius:5px;background:#16121a;border:1.5px solid rgba(255,255,255,.9);display:grid;place-items:center;font-style:normal;font-family:var(--serif);font-size:10px;font-weight:900;color:var(--gold)}
.noti .tx{flex:1;min-width:0}
.noti .tx .r1{display:flex;justify-content:space-between;font-size:14.5px}
.noti .tx .r1 b{font-weight:700}
.noti .tx .r1 span{opacity:.7;font-size:13px}
.noti .tx p{margin:2px 0 0;font-size:14.5px;line-height:1.35;opacity:.95}
.lockS .hint2{position:absolute;left:0;right:0;bottom:calc(env(safe-area-inset-bottom,0px) + 30px);text-align:center;font-size:13px;opacity:.75}
.mcard .k{font-size:12px;color:var(--gold-2);font-weight:700;letter-spacing:.08em}
.mcard p{margin:8px 0 14px;font-family:var(--serif);font-size:21px;font-weight:900;line-height:1.5}
.gaugeS,.subS{overflow-y:auto;background:linear-gradient(180deg,#120e14,#09070b);padding:calc(env(safe-area-inset-top,0px) + 64px) 16px calc(env(safe-area-inset-bottom,0px) + 28px)}
.gH small{display:block;font-size:11px;letter-spacing:.24em;color:var(--gold-2);font-weight:700}
.gH b{display:block;font-family:var(--serif);font-size:26px;font-weight:900;line-height:1.35;margin-top:6px}
.gBox{margin-top:16px;border-radius:20px;border:1px solid var(--glass-line);background:#141016;padding:16px}
.gBox h4{margin:0 0 12px;font-size:12px;letter-spacing:.2em;color:var(--ink-3);font-weight:700}
.gBars .bar i{transition:width 1.4s cubic-bezier(.2,.8,.2,1)}
.gUp{display:inline-block;margin-left:6px;font-size:12px;font-weight:800;color:var(--gold-2);opacity:0;transform:translateY(4px);transition:all .5s .9s}
.gUp.on{opacity:1;transform:none}
.streak{display:flex;gap:6px;margin-top:4px}
.streak span{flex:1;height:34px;border-radius:10px;border:1px solid var(--glass-line);display:grid;place-items:center;font-size:12px;color:var(--ink-3)}
.streak span.on{background:rgba(227,184,102,.22);border-color:var(--gold);color:var(--gold-2);font-weight:800}
.cal{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px;font-size:12px;text-align:center}
.cal .w{color:var(--ink-3);font-size:11px}
.cal .d{aspect-ratio:1;border-radius:9px;display:grid;place-items:center;background:rgba(255,255,255,.04);color:var(--ink-2)}
.cal .d.t{border:1px solid var(--gold);color:var(--gold-2);font-weight:800}
.cal .d.k{background:rgba(227,184,102,.2);color:var(--gold-2);font-weight:800;position:relative}
.cal .d.k::after{content:"";position:absolute;right:-1px;top:-4px;width:8px;height:10px;background:currentColor;-webkit-mask:var(--oblk) center/contain no-repeat;mask:var(--oblk) center/contain no-repeat}
.keyday{margin-top:12px;display:grid;gap:8px}
.keyday div{display:flex;justify-content:space-between;align-items:center;padding:11px 12px;border-radius:12px;background:rgba(255,255,255,.05);font-size:14px}
.keyday div em{font-style:normal;filter:blur(4px);color:var(--ink-2)}
.subList{list-style:none;margin:14px 0 18px;padding:0;display:grid;gap:9px}
.subList li{display:flex;gap:10px;align-items:flex-start;font-size:15px;line-height:1.45;padding:12px;border-radius:14px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08)}
.subList li i{font-style:normal;flex:none}
.subPrice{display:flex;align-items:baseline;gap:8px;margin-bottom:12px}
.subPrice b{font-size:28px;font-weight:900}.subPrice span{color:var(--ink-3);font-size:14px}
/* main home (poster-led, black) */
.stage.homeMode .top{display:none}
.home:not(.on):not(.vis){display:none}
.home{position:absolute;inset:0;z-index:44;overflow-y:auto;background:#000;opacity:0;pointer-events:none;transition:opacity .5s;padding-bottom:calc(env(safe-area-inset-bottom,0px) + 110px);scrollbar-width:none}
.home::-webkit-scrollbar{display:none}
.home.on{opacity:1;pointer-events:auto}
.hHead{position:sticky;top:0;z-index:5;background:#000;padding:calc(env(safe-area-inset-top,0px) + 12px) 16px 4px}
.hHead::after{content:"";position:absolute;left:0;right:0;top:100%;height:18px;background:linear-gradient(180deg,#000,rgba(0,0,0,0));pointer-events:none}
.hBar{display:flex;justify-content:space-between;align-items:center;height:40px}
.logo{display:flex;align-items:center;gap:8px}
.logo img{width:26px;height:26px;display:block}
.logo b{font-family:var(--serif);font-size:19px;font-weight:700;letter-spacing:.02em;color:#E9D3A4}
.logo i{font-style:normal;display:flex;gap:3px}
.logo i u{width:6px;height:6px;border-radius:50%;background:var(--c)}
.hIc{display:flex;gap:6px}
.hIc button{width:38px;height:38px;border:0;background:none;color:#fff;display:grid;place-items:center;cursor:pointer}
.hIc svg{width:23px;height:23px}
.pills{display:flex;gap:4px;overflow-x:auto;padding:8px 0 6px;scrollbar-width:none}
.pills::-webkit-scrollbar{display:none}
.pills button{flex:none;border:0;background:none;color:#8e8e96;font-size:14px;font-weight:500;padding:7px 13px;border-radius:999px;cursor:pointer;font-family:var(--sans)}
.pills button.on{color:#fff;font-weight:700;background:rgba(255,255,255,.1);box-shadow:inset 0 0 0 1px rgba(255,255,255,.16)}
.cRow{display:flex;gap:12px;overflow-x:auto;padding:2px 16px 4px;scrollbar-width:none}
.cRow::-webkit-scrollbar{display:none}
.cRow button{flex:none;width:66px;text-align:center;cursor:pointer;background:none;border:0;color:#fff;padding:0}
.cRow button span{display:block;width:60px;height:60px;margin:3px auto 0;border-radius:50%;background:#000 center 16%/cover;box-shadow:0 0 0 2px #000,0 0 0 3.5px var(--c)}
.cRow button b{display:block;font-size:12.5px;font-weight:700;margin-top:8px}
.cRow button small{display:block;font-size:10px;color:#8a8a92;margin-top:1px;white-space:nowrap}
.gl{margin:0 16px;display:flex;align-items:center;gap:14px;border-radius:20px;overflow:hidden;cursor:pointer;background:linear-gradient(110deg,#1c1116,#121014);border:1px solid rgba(255,185,166,.3);padding:0 14px 0 0}
.gl .im{flex:none;width:96px;height:120px;background:#000 center 18%/cover}
.gl small{display:block;font-size:11px;letter-spacing:.14em;color:#ffb9a6;font-weight:700}
.gl b{display:block;font-family:'Cormorant Garamond',serif;font-style:italic;font-size:25px;line-height:1.05;margin-top:4px;color:#fff}
.gl span{display:block;font-size:12px;color:#a9a0a5;margin-top:5px;line-height:1.45}
.myChar{position:relative;display:block;margin:34px 16px 0;height:168px;border-radius:20px;overflow:hidden;background:#000 url('../../img/avatar/fire_f.jpg') 50% 16%/cover no-repeat;border:1px solid rgba(227,184,102,.4);cursor:pointer;box-shadow:0 10px 30px rgba(0,0,0,.4)}
.myChar::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,6,10,.95) 0%,rgba(8,6,10,.75) 42%,rgba(8,6,10,0) 75%)}
.myChar .t{position:absolute;left:16px;top:50%;transform:translateY(-50%);max-width:62%}
.myChar small{display:block;font-size:10.5px;font-weight:800;letter-spacing:.2em;color:var(--gold-2)}
.myChar b{display:block;font-family:var(--brush);font-weight:400;font-size:29px;line-height:1.15;color:#fff;margin:6px 0 5px}
.myChar span{display:block;font-size:12px;color:rgba(255,255,255,.75);line-height:1.5}
.myChar .chip{position:absolute;right:12px;top:12px;font-size:10px;font-weight:800;border-radius:999px;padding:5px 8px;background:var(--gold);color:#15110a}
.back2salon{display:flex;align-items:center;gap:12px;margin:10px 16px 0;padding:10px 12px;border-radius:18px;background:linear-gradient(110deg,#1a1510,#111013 70%);border:1px solid rgba(227,184,102,.22);cursor:pointer}
.back2salon .av{flex:none;width:44px;height:44px;border-radius:12px;background:#000 center 20%/cover}
.back2salon small{display:block;font-size:11px;color:#8e8e96}
.back2salon b{display:block;font-size:14px;font-weight:700;color:#f2f2f4;margin-top:2px}
.back2salon i{margin-left:auto;font-style:normal;font-size:12px;font-weight:700;color:var(--gold-2);white-space:nowrap}
.logo{cursor:pointer}
.hMenuS{position:absolute;inset:0;z-index:60;background:rgba(0,0,0,.55);display:flex;justify-content:flex-end;opacity:0;pointer-events:none;transition:opacity .25s}
.hMenuS.on{opacity:1;pointer-events:auto}
.hMenuS .in{width:min(78%,300px);height:100%;background:#111013;border-left:1px solid rgba(227,184,102,.2);padding:calc(env(safe-area-inset-top,0px) + 20px) 18px 20px;transform:translateX(20px);transition:transform .25s}
.hMenuS.on .in{transform:none}
/* 10/4 메뉴 아래가 잘림 → 메뉴 안을 스크롤, 아래 탭바 · 홈 표시줄만큼 여백 */
.hMenuS .in{overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding-bottom:calc(env(safe-area-inset-bottom,0px) + 96px)!important;scrollbar-width:none}.hMenuS .in::-webkit-scrollbar{display:none}
.hMenuS .hd{display:flex;align-items:center;gap:8px;margin-bottom:18px}
.hMenuS .hd img{width:26px;height:26px}
.hMenuS .hd b{font-family:var(--serif);font-size:18px;color:#E9D3A4;font-weight:700}
.hMenuS button.it[hidden]{display:none!important}
.hMenuS button.it{display:flex;align-items:center;gap:10px;width:100%;border:0;background:none;color:#f2f2f4;font-size:15px;padding:13px 4px;border-bottom:1px solid rgba(255,255,255,.06);cursor:pointer;text-align:left;font-family:var(--sans)}
.hMenuS button.it small{margin-left:auto;font-size:11.5px;color:#8e8e96}
.hMenuS button.it.hi{color:var(--gold-2);font-weight:700}
/* 보관함 */
.arch{position:absolute;inset:0;z-index:58;background:#0b0a0e;display:flex;flex-direction:column;opacity:0;pointer-events:none;transform:translateY(18px);transition:opacity .35s,transform .35s cubic-bezier(.2,.8,.2,1)}
.arch.on{opacity:1;pointer-events:auto;transform:none}
.arch .ah{display:flex;align-items:center;gap:10px;padding:calc(env(safe-area-inset-top,0px) + 14px) 16px 8px}
.arch .ah button.bk{width:36px;height:36px;border-radius:50%;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.04);color:#fff;display:grid;place-items:center;cursor:pointer}
.arch .ah h2{margin:0;font-family:var(--brush);font-size:30px;font-weight:400;line-height:1;color:#fff}
.arch .ah small{margin-left:auto;font-size:12px;color:var(--ink-3)}
.arch .ah small b{color:var(--gold-2)}
.arch .lead{padding:0 18px 10px;font-family:var(--bmj);font-size:14.5px;color:var(--ink-2)}
.arch .fl{display:flex;gap:6px;padding:0 16px 10px;overflow-x:auto;scrollbar-width:none}
.arch .fl::-webkit-scrollbar{display:none}
.arch .fl button{flex:none;height:32px;padding:0 13px;border-radius:999px;border:1px solid rgba(255,255,255,.12);background:none;color:var(--ink-2);font-size:13px;cursor:pointer}
.arch .fl button.on{background:rgba(227,184,102,.16);border-color:rgba(227,184,102,.55);color:var(--gold-2);font-weight:700}
.arch .ls{flex:1;overflow-y:auto;padding:0 16px calc(env(safe-area-inset-bottom,0px) + 110px);scrollbar-width:none}
.arch .ls::-webkit-scrollbar{display:none}
.arch .dh{font-size:11.5px;letter-spacing:.14em;color:var(--gold);font-weight:800;margin:16px 2px 8px}
.arch .it{display:grid;grid-template-columns:58px 1fr auto;gap:12px;align-items:center;width:100%;text-align:left;padding:10px;border-radius:16px;border:1px solid rgba(255,240,220,.08);background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.015));color:var(--ink);cursor:pointer;margin-bottom:8px;font-family:var(--sans);animation:aIn .45s both}
@keyframes aIn{from{opacity:0;transform:translateY(8px)}}
.arch .it .th{width:58px;height:58px;border-radius:12px;background:#222 center 18%/cover no-repeat;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.arch .it .mn{display:block;font-size:11px;font-weight:800;letter-spacing:.06em;color:var(--gold-2);margin-bottom:3px}
.arch .it b{display:block;font-size:15px;line-height:1.35;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical}
.arch .it .sb{display:block;font-size:12px;color:var(--ink-3);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.arch .it .sc{min-width:44px;height:44px;border-radius:50%;display:grid;place-items:center;font-family:var(--serif);font-weight:900;font-size:16px;color:var(--gold-2);border:1.5px solid rgba(227,184,102,.5);background:radial-gradient(circle,rgba(227,184,102,.14),transparent 70%)}
.arch .it .tm{font-size:11px;color:var(--ink-3);text-align:right}
.arch .emp{text-align:center;padding:60px 10px 0;color:var(--ink-2)}
.arch .emp img{width:64px;opacity:.5;margin-bottom:14px}
.arch .emp b{display:block;font-family:var(--bmj);font-size:18px;color:var(--ink);margin-bottom:6px}
.arch .emp p{margin:0 0 18px;font-size:13.5px;line-height:1.6}
.arch .emp .q{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.arch .emp .q button{height:40px;padding:0 16px;border-radius:999px;border:1px solid rgba(227,184,102,.45);background:rgba(227,184,102,.08);color:var(--gold-2);font-weight:700;font-size:13.5px;cursor:pointer}
.arch .det{position:absolute;inset:0;z-index:2;background:rgba(0,0,0,.6);display:flex;align-items:flex-end;opacity:0;pointer-events:none;transition:opacity .3s}
.arch .det.on{opacity:1;pointer-events:auto}
.arch .det .pn{width:100%;background:#141217;border-radius:22px 22px 0 0;border-top:1px solid rgba(227,184,102,.3);overflow:hidden;transform:translateY(30px);transition:transform .35s cubic-bezier(.2,.8,.2,1);padding-bottom:calc(env(safe-area-inset-bottom,0px) + 16px)}
.arch .det.on .pn{transform:none}
.arch .det .hv{position:relative;height:190px;background:#000 center 18%/cover no-repeat}
.arch .det .hv:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,18,23,.1),#141217 96%)}
.arch .det .hv .t{position:absolute;left:18px;right:18px;bottom:6px;z-index:1}
.arch .det .hv small{font-size:11.5px;font-weight:800;letter-spacing:.14em;color:var(--gold-2)}
.arch .det .hv h3{margin:4px 0 0;font-family:var(--brush);font-weight:400;font-size:30px;line-height:1.15}
.arch .det .bd{padding:6px 18px 0}
.arch .det .bd .sb{font-size:12.5px;color:var(--ink-3);margin-bottom:10px}
.arch .det .bd p{margin:0 0 10px;font-family:var(--bmj);font-size:15.5px;line-height:1.65;color:var(--ink)}
.arch .det .bt{display:flex;gap:8px;padding:8px 18px 0}
.arch .det .bt button{flex:1;height:48px;border-radius:14px;border:1px solid rgba(255,240,220,.16);background:rgba(255,255,255,.04);color:var(--ink);font-weight:800;font-size:14.5px;cursor:pointer}
.arch .det .bt button.pr{flex:2;border:0;background:linear-gradient(180deg,#f0cf85,#d6a64f);color:#17120a}
.tabs button .bd{position:absolute;top:2px;right:calc(50% - 20px);min-width:16px;height:16px;padding:0 4px;border-radius:8px;background:var(--fire);color:#fff;font-size:10px;font-weight:800;line-height:16px;text-align:center;display:none}
.tabs button .bd.on{display:block}
.fort{position:relative;display:flex;align-items:center;gap:12px;margin:8px 16px 0;border-radius:20px;padding:14px 14px 14px 16px;cursor:pointer;overflow:hidden;background:linear-gradient(120deg,#1d1810,#121014 60%);border:1px solid rgba(227,184,102,.34)}
.fort .gz{position:absolute;right:-6px;top:-14px;font-family:var(--serif);font-weight:900;font-size:64px;color:rgba(227,184,102,.07);letter-spacing:.02em;pointer-events:none}
.fort .fl{flex:1;min-width:0;position:relative}
.fort .fl small{display:block;font-size:11.5px;color:var(--gold-2);font-weight:700;letter-spacing:.02em}
.fort .fl b{display:block;font-size:16px;font-weight:700;margin-top:4px;color:#fff}
.fort .fl span{display:block;font-size:11.5px;color:#9a948c;margin-top:4px}
.fort .fr{flex:none;position:relative;width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--gold) calc(var(--p)*1%),rgba(255,255,255,.08) 0)}
.fort .fr:before{content:"";position:absolute;inset:4px;border-radius:50%;background:#16130f}
.fort .fr em{position:relative;font-style:normal;font-family:'Cormorant Garamond',serif;font-weight:700;font-size:24px;line-height:1;color:var(--gold-2);text-align:center}
.fort .fr em small{display:block;font-family:var(--sans);font-size:9px;color:#9a948c;font-weight:500}
.today{margin:10px 16px 0;border-radius:20px;background:#111013;border:1px solid rgba(227,184,102,.24);padding:14px 14px 13px;cursor:pointer}
.today .r{display:flex;gap:13px;align-items:center}
.today .av{flex:none;width:46px;height:46px;border-radius:50%;background:#000 center 20%/cover;box-shadow:0 0 0 2px #111013,0 0 0 4px var(--c)}
.today small{display:block;font-size:11.5px;color:#8e8e96}
.today small em{font-style:normal;color:var(--c);font-weight:700}
.today p{margin:3px 0 0;font-size:14px;font-weight:600;line-height:1.45;color:#f2f2f4}
.today .go{flex:none;align-self:center;font-size:11.5px;font-weight:700;color:#15110a;background:var(--gold);border-radius:999px;padding:7px 11px}
.hG{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin-top:12px}
.hG div{text-align:center}
.hG div b{display:block;font-family:var(--serif);font-size:13px;color:var(--c);font-weight:900}
.hG div i{display:block;height:4px;border-radius:2px;background:rgba(255,255,255,.08);margin-top:5px;overflow:hidden}
.hG div i::after{content:"";display:block;height:100%;width:var(--w);background:var(--c)}
.hG div.low b::after{content:" 채울 차례";font-family:var(--sans);font-size:9px;font-weight:700;color:#9a9aa2;display:block}
.hSec{margin-top:34px}
.hSec[hidden]{display:none}
.sh{padding:0 16px 12px}
.sh small{display:block;font-size:12px;color:#7d7d85;font-weight:500}
.sh b{display:block;font-size:18px;font-weight:700;letter-spacing:-.025em;color:#fff;margin-top:3px}
.hRow{display:flex;gap:10px;overflow-x:auto;padding:0 16px;scroll-snap-type:x mandatory;scrollbar-width:none;scroll-padding:0 16px}
.hRow::-webkit-scrollbar{display:none}
.pc{flex:none;width:68%;max-width:290px;aspect-ratio:2/3;border-radius:18px;overflow:hidden;position:relative;scroll-snap-align:start;background:#111 center 22%/cover no-repeat;cursor:pointer}
.pc::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 38%,rgba(0,0,0,.35) 58%,rgba(0,0,0,.88) 100%)}
.pc .ct{position:absolute;left:0;right:0;bottom:20px;text-align:center;padding:0 14px}
.pc .yr{display:block;font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:700;font-size:25px;line-height:.8;color:#fff;letter-spacing:-.02em;text-shadow:0 2px 12px rgba(0,0,0,.5)}
.pc .tt{display:block;font-family:var(--serif);font-weight:900;font-size:27px;line-height:1.2;color:#fff;letter-spacing:-.03em;text-shadow:0 2px 16px rgba(0,0,0,.55)}
.pc .st{display:block;font-family:var(--sans);font-weight:500;font-size:12.5px;color:rgba(255,255,255,.86);margin-top:7px;letter-spacing:-.01em;text-shadow:0 1px 8px rgba(0,0,0,.6)}
.pc .chip{position:absolute;top:12px;left:12px;font-size:10px;font-weight:700;border-radius:999px;padding:5px 8px;letter-spacing:.01em;background:rgba(0,0,0,.45);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:#fff;border:1px solid rgba(255,255,255,.18)}
.pc .chip.open{background:var(--gold);color:#15110a;border:0}
.pc .play{position:absolute;top:12px;right:12px;width:28px;height:28px;border-radius:50%;background:rgba(0,0,0,.45);backdrop-filter:blur(8px);display:grid;place-items:center;border:1px solid rgba(255,255,255,.2)}
.pc .play::after{content:"";margin-left:2px;border-left:8px solid #fff;border-top:5px solid transparent;border-bottom:5px solid transparent}
.oRow{display:flex;gap:14px;overflow-x:auto;padding:0 16px;scrollbar-width:none}
.oRow::-webkit-scrollbar{display:none}
.om{flex:none;width:62px;text-align:center;cursor:pointer;background:none;border:0;color:#fff;padding:0}
.om span{display:block;width:56px;height:56px;margin:3px auto 0;border-radius:50%;background:#000 center 18%/cover;box-shadow:0 0 0 2px #000,0 0 0 4px var(--c)}
.om b{display:block;font-size:12.5px;font-weight:700;margin-top:8px}
.om small{display:block;font-size:10px;color:#7d7d85;margin-top:1px}
.om.mine b::after{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--gold);margin-left:4px;vertical-align:middle}
.tool{margin:0 16px 10px;border-radius:18px;background:#141414;padding:17px 18px;display:flex;justify-content:space-between;align-items:center;gap:12px;cursor:pointer}
.tool b{display:block;font-size:16px;font-weight:700;letter-spacing:-.02em}
.tool small{display:block;font-size:12px;color:#7d7d85;margin-top:5px;line-height:1.5}
.tool small em{font-style:normal;color:var(--gold-2)}
.tiles{flex:none;display:grid;grid-template-columns:repeat(2,36px);gap:6px}
.tiles span{width:36px;height:36px;border-radius:10px;background:#1f1f22;display:grid;place-items:center;font-family:var(--serif);font-weight:900;font-size:15px;color:var(--c)}
.ring{flex:none;width:62px;height:62px;border-radius:50%;border:1.5px dashed rgba(227,184,102,.45);display:grid;place-items:center;font-family:var(--serif);font-size:23px;font-weight:900;color:var(--gold-2)}
.rank{padding:0 16px;display:grid;gap:14px}
.rk{display:grid;grid-template-columns:104px 20px 1fr;gap:10px;align-items:center;cursor:pointer}
.rk span.th{width:104px;height:68px;border-radius:12px;background:#111 center 25%/cover}
.rk em{font-style:normal;font-size:16px;font-weight:700;text-align:center}
.rk b{display:block;font-size:14.5px;font-weight:700;letter-spacing:-.02em}
.rk small{display:block;font-size:12px;color:#7d7d85;margin-top:3px}
.rv{padding:0 16px;display:grid;gap:22px}
.rv .h{display:flex;align-items:center;gap:12px}
.rv .h .a{flex:none;width:38px;height:38px;border-radius:50%;background:#1a1a1d;display:grid;place-items:center;font-family:var(--serif);font-weight:900;font-size:15px;color:var(--c)}
.rv .h b{font-size:13px;font-weight:700}
.rv .h small{display:block;color:#f5c542;font-size:11px;letter-spacing:1px;margin-top:1px}
.rv .h time{margin-left:auto;font-size:11px;color:#6e6e76}
.rv p{margin:10px 0 10px;font-size:13.5px;line-height:1.65;color:#d9d9de}
.rv .lk{display:flex;align-items:center;gap:10px;border:1px solid #242428;border-radius:14px;padding:10px 12px;cursor:pointer}
.rv .lk span{flex:none;width:42px;height:42px;border-radius:10px;background:#111 center 25%/cover}
.rv .lk b{display:block;font-size:13px;font-weight:700}
.rv .lk small{display:block;font-size:11px;color:#7d7d85;margin-top:1px}
.rv .lk::after{content:"›";margin-left:auto;font-size:22px;color:#8a8a92}
.hFoot{margin:44px 16px 0;padding-top:18px;border-top:1px solid #1d1d20;font-size:11.5px;line-height:1.8;color:#5d5d63}
.tabs{position:absolute;left:50%;transform:translateX(-50%);bottom:calc(env(safe-area-inset-bottom,0px) + 14px);z-index:46;width:min(92%,380px);display:grid;grid-template-columns:repeat(5,1fr);padding:6px;border-radius:999px;background:rgba(28,28,32,.72);backdrop-filter:blur(18px) saturate(1.4);-webkit-backdrop-filter:blur(18px) saturate(1.4);border:1px solid rgba(255,255,255,.1);opacity:0;pointer-events:none;transition:opacity .5s}
.tabs.on{opacity:1;pointer-events:auto}
.tabs button{position:relative;border:0;background:none;color:#8a8a92;font-size:10px;display:flex;flex-direction:column;align-items:center;gap:2px;cursor:pointer;padding:7px 0 6px;border-radius:999px;font-family:var(--sans)}
.tabs button svg{width:20px;height:20px}
.tabs button.on{color:#fff;font-weight:700;background:rgba(255,255,255,.12)}
.toTop{position:absolute;right:18px;bottom:calc(env(safe-area-inset-bottom,0px) + 90px);z-index:46;width:46px;height:46px;border-radius:50%;border:0;background:#fff;color:#000;display:grid;place-items:center;box-shadow:0 6px 20px rgba(0,0,0,.5);opacity:0;pointer-events:none;transition:opacity .3s;cursor:pointer}
.toTop.on{opacity:1;pointer-events:auto}
.kvm{display:flex;flex-direction:column;justify-content:flex-end;background:rgba(0,0,0,.6);z-index:52}
.kvm .box{border-radius:26px 26px 0 0;background:#111013;border-top:1px solid rgba(227,184,102,.3);max-height:88%;overflow-y:auto;padding-bottom:calc(env(safe-area-inset-bottom,0px) + 18px)}
.kvm img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;object-position:center 25%}
.kvm .in{padding:18px 18px 0}
.kvm small{font-size:11px;letter-spacing:.2em;color:var(--gold-2);font-weight:700}
.kvm b{display:block;font-family:var(--serif);font-size:26px;font-weight:900;line-height:1.3;margin:6px 0 8px}
.kvm p{margin:0 0 16px;font-size:14.5px;line-height:1.7;color:var(--ink-2)}
.homeLink{display:block;margin:10px auto 0}
.card .hero .heroShare{position:absolute;right:14px;top:12px;z-index:2;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:rgba(10,8,12,.55);color:#f3e6c8;border:1px solid rgba(243,214,168,.55);cursor:pointer;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
/* result */
.result{position:absolute;inset:0;z-index:35;overflow-y:auto;background:linear-gradient(180deg,#120e14,#09070b);opacity:0;pointer-events:none;transition:opacity .6s;padding:calc(env(safe-area-inset-top,0px) + 64px) 16px calc(env(safe-area-inset-bottom,0px) + 28px)}
.result.on{opacity:1;pointer-events:auto}
.card{border-radius:24px;overflow:hidden;border:1px solid rgba(227,184,102,.35);background:#141016;box-shadow:0 20px 60px rgba(0,0,0,.5)}
.card .hero{position:relative;aspect-ratio:4/5;background:#000 center 18%/cover no-repeat;transition:background-image .6s}
.card .hero .fv{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 18%;opacity:0;transition:opacity .8s;z-index:0}
.card .hero .fv.on{opacity:1}
.card .hero .fsub{position:absolute;left:18px;right:18px;bottom:96px;z-index:1;text-align:center;font-family:var(--serif);font-size:18px;line-height:1.5;color:#fff;text-shadow:0 2px 12px rgba(0,0,0,.9);opacity:0;transition:opacity .5s}
.card .hero .fsub.on{opacity:1}
.card .hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 45%,rgba(20,16,22,1) 100%)}
.card .hero .tag{position:absolute;left:16px;top:16px;z-index:1;font-size:11px;letter-spacing:.24em;font-weight:700;color:#1a1206;background:var(--gold);padding:5px 10px;border-radius:999px}
.card .hero .nm{position:absolute;left:18px;bottom:14px;z-index:1}
.card .hero .nm small{display:block;font-size:12px;color:var(--gold-2);letter-spacing:.2em;font-weight:700}
.card .hero .nm b{font-family:var(--serif);font-size:30px;font-weight:900}
.card .body{padding:6px 18px 20px}
.sec{margin-top:18px}
.gwhy>div{display:grid;grid-template-columns:108px 1fr;gap:10px;padding:10px 0;border-top:1px solid rgba(255,255,255,.08);font-size:13.5px;line-height:1.55}
.gwhy>div:last-child{border-bottom:1px solid rgba(255,255,255,.08)}
.gwhy b{font-weight:700;color:var(--gold-2);font-size:13px}
.gwhy span{color:var(--ink-2)}
.sec h4{margin:0 0 10px;font-size:12px;letter-spacing:.2em;color:var(--ink-3);font-weight:700}
.pillars{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;text-align:center}
.pillars div{border-radius:12px;background:rgba(255,255,255,.04);padding:8px 0 6px}
.pillars .l{font-size:11px;color:var(--ink-3)}
.pillars .c{font-family:var(--serif);font-size:24px;font-weight:900;line-height:1.25}
.bars{display:grid;gap:8px}
.bar{display:grid;grid-template-columns:44px 1fr 22px;gap:10px;align-items:center;font-size:13px}
.bar .t{height:10px;border-radius:6px;background:rgba(255,255,255,.07);overflow:hidden}
.bar .t i{display:block;height:100%;border-radius:6px;background:var(--c);width:0;transition:width 1s ease .3s}
.bar .v{text-align:right;color:var(--ink-2);font-variant-numeric:tabular-nums}
.bar.low .lbl{color:var(--c);font-weight:900}
.mission{border-radius:16px;padding:14px 16px;background:rgba(227,184,102,.1);border:1px solid rgba(227,184,102,.3)}
.mission .k{font-size:12px;color:var(--gold-2);font-weight:700;letter-spacing:.06em}
.mission p{margin:6px 0 0;font-family:var(--serif);font-size:18px;font-weight:700;line-height:1.5;filter:blur(4px);user-select:none}
.mission .lock{font-size:12px;color:var(--ink-3);margin-top:8px}
.actions{display:grid;gap:10px;margin-top:18px}
/* 10/6 결과 끝: 홈으로 가는 큰 안내 + 자잘한 메뉴는 아래로 작게 */
.goHome{margin-top:22px;padding:22px 18px 18px;border:1px solid rgba(227,184,102,.55);background:linear-gradient(160deg,rgba(227,184,102,.16),rgba(227,184,102,.04));text-align:center}
.goHome small{display:block;font-size:12.5px;color:var(--gold-2);letter-spacing:.04em}
.goHome b{display:block;margin-top:8px;font-family:var(--serif,'Noto Serif KR',serif);font-size:22px;line-height:1.4;color:var(--ink);font-weight:900}
.goHome span{display:block;margin-top:8px;font-size:12.5px;color:var(--ink-3);line-height:1.6}
.goHome button{margin-top:16px;width:100%;min-height:56px;display:flex;align-items:center;justify-content:center;gap:8px;border:0;background:linear-gradient(180deg,rgba(227,184,102,.98),rgba(196,146,64,.98));color:#1a1206;font-family:inherit;font-size:17px;font-weight:900;cursor:pointer}
.actions.mini{display:flex;flex-wrap:wrap;gap:6px;margin-top:16px;align-items:center}
.actions.mini em{flex:1 0 100%;font-style:normal;font-size:11.5px;color:var(--ink-3);margin-bottom:2px}
.actions.mini .choice{width:auto;min-height:0;flex:1 1 auto;padding:9px 10px;border-radius:0;font-size:12.5px;font-weight:500;background:none;border:1px solid var(--glass-line);color:var(--ink-2,#cfc6bd)}
.resHome{position:sticky;bottom:calc(env(safe-area-inset-bottom,0px) + 12px);z-index:5;display:flex;justify-content:flex-end;margin:18px 0 0;pointer-events:none;opacity:0;transform:translateY(8px);transition:opacity .35s,transform .35s}
.resHome.on{opacity:1;transform:none}
.resHome button{pointer-events:auto;display:inline-flex;align-items:center;gap:7px;height:38px;padding:0 15px 0 12px;border-radius:999px;border:1px solid rgba(227,184,102,.45);background:rgba(14,11,16,.82);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:var(--gold-2);font-family:inherit;font-size:13px;font-weight:700;letter-spacing:.02em;cursor:pointer;box-shadow:0 6px 18px rgba(0,0,0,.4)}
.resHome button svg{flex:none}
.twin{display:flex;align-items:center;gap:12px;width:100%;margin:14px 0 2px;padding:12px 12px 12px 12px;border:1px solid rgba(227,184,102,.28);background:linear-gradient(90deg,rgba(227,184,102,.08),rgba(227,184,102,0));color:var(--ink);font-family:inherit;text-align:left;cursor:pointer}
.twin i{flex:none;width:44px;height:44px;border-radius:50%;background:#000 center 18%/cover no-repeat;border:1px solid rgba(227,184,102,.5)}
.twin span{flex:1;min-width:0}
.twin b{display:block;font-size:14px;font-weight:700;line-height:1.35}
.twin em{display:block;margin-top:2px;font-style:normal;font-size:12px;color:var(--ink-3);letter-spacing:.02em}
.twin svg{flex:none;color:var(--gold-2)}
.twinS{position:absolute;inset:0;z-index:62;display:flex;align-items:flex-end;background:rgba(5,4,7,.6);opacity:0;pointer-events:none;transition:opacity .35s}
.twinS.on{opacity:1;pointer-events:auto}
.twinS .in{width:100%;max-height:92%;overflow-y:auto;background:linear-gradient(180deg,#19131b,#0d0a0f);border-top:1px solid rgba(227,184,102,.35);padding:22px 18px calc(env(safe-area-inset-bottom,0px) + 18px);transform:translateY(24px);transition:transform .4s cubic-bezier(.2,.8,.2,1)}
.twinS.on .in{transform:none}
.twinS .k{font-size:11px;letter-spacing:.22em;color:var(--gold-2);font-weight:700}
.twinS h3{margin:8px 0 10px;font-family:var(--serif);font-size:24px;font-weight:900;line-height:1.3}
.twinS p{margin:0;font-size:14px;line-height:1.7;color:var(--ink-2)}
.twinS .pair{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:18px 0 14px}
.twinS .pair button{position:relative;aspect-ratio:3/4;border:1px solid rgba(255,255,255,.14);background:#000 center 18%/cover no-repeat;padding:0;cursor:pointer;font-family:inherit;color:#fff;text-align:left;overflow:hidden}
.twinS .pair button::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 42%,rgba(8,6,10,.94) 100%)}
.twinS .pair button.on{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold) inset}
.twinS .pair .cap{position:absolute;left:10px;right:10px;bottom:10px;z-index:1}
.twinS .pair .cap small{display:block;font-size:10.5px;letter-spacing:.12em;color:var(--gold-2);font-weight:700}
.twinS .pair .cap b{display:block;margin-top:2px;font-family:var(--serif);font-size:21px;font-weight:900}
.twinS .pair .cap em{display:block;margin-top:3px;font-style:normal;font-size:12px;line-height:1.45;color:rgba(255,255,255,.82)}
.twinS .pair .now{position:absolute;left:8px;top:8px;z-index:1;font-size:10.5px;font-weight:700;letter-spacing:.06em;color:#1a1206;background:var(--gold);padding:3px 8px;display:none}
.twinS .pair button.cur .now{display:block}
.twinS .nt{font-size:12px;color:var(--ink-3);line-height:1.6;margin:0 0 14px}
.twinS .go{width:100%}
.twinS .x{display:block;width:100%;margin-top:8px;padding:12px;border:0;background:none;color:var(--ink-3);font-family:inherit;font-size:14px;cursor:pointer}
.note{font-size:11.5px;color:var(--ink-3);text-align:center;margin-top:14px;line-height:1.5}
.toast{position:absolute;left:50%;bottom:calc(env(safe-area-inset-bottom,0px) + 90px);transform:translateX(-50%);z-index:60;background:rgba(0,0,0,.8);color:#fff;font-size:14px;padding:10px 16px;border-radius:999px;opacity:0;transition:opacity .3s;pointer-events:none;white-space:nowrap}
.toast.on{opacity:1}
@media (prefers-reduced-motion:reduce){.poster.kb{animation:none}.layer,.poster,.panel,.sub p{transition:none}}
/* 붓글씨 헤드라인 (East Sea Dokdo) + 붓 명조 보조 (Song Myung) */

.opEnd h2{font-family:var(--brush)!important;font-weight:400!important;text-shadow:0 2px 6px rgba(0,0,0,.9),0 0 30px rgba(0,0,0,.8)!important;font-size:clamp(38px,10.6vw,46px)!important;line-height:1.18!important;letter-spacing:0!important;text-shadow:0 3px 24px rgba(0,0,0,.7)}
.opEnd p{font-family:var(--bmj)!important;font-weight:400!important;font-size:clamp(20px,5.6vw,24px)!important}
.start h1{font-family:var(--brush)!important;font-weight:400!important;font-size:clamp(34px,9.6vw,42px)!important;line-height:1.18!important;letter-spacing:0!important}
.start h1 span{display:block;font-family:var(--bmj);font-size:.5em;color:var(--gold-2);margin-top:8px;line-height:1.3}
.pc .tt{font-family:var(--brush)!important;font-weight:400!important;font-size:33px!important;line-height:1.12!important;letter-spacing:0!important}
.pc .yr{margin-bottom:2px}
.opSl span{font-family:var(--bmj)!important}
/* ---- 오프닝 v3: 탭 게이트 + 다섯 수호신 영상 컷 ---- */
.opSl{transform:scale(1.14);filter:brightness(2.2) blur(8px) saturate(.6);transition:opacity .5s ease,transform 1.8s cubic-bezier(.2,.7,.2,1),filter .7s ease}
.opSl.on{transform:scale(1.02);filter:none}
.opSl.out{opacity:0;filter:brightness(.4) blur(6px);transition:opacity .45s ease,filter .45s ease}
.opSl video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 16%}
.opSl:after{z-index:1}
.opSl span{z-index:2;bottom:calc(env(safe-area-inset-bottom,0px) + 64px)}
.opSl span b{font-family:var(--bmj);font-weight:400;font-size:92px;line-height:1;margin-bottom:6px;opacity:0;transform:scale(1.5);filter:blur(10px);transition:all .7s cubic-bezier(.2,.7,.2,1) .15s;text-shadow:0 0 18px var(--c),0 0 46px var(--c),0 0 90px var(--c)}
.opSl.on span b{opacity:1;transform:none;filter:none}
.opSl span em{display:block;font-style:normal;letter-spacing:.6em;opacity:0;transform:translateY(8px);transition:all .6s .35s}
.opSl.on span em{opacity:.92;transform:none}
.opSmoke{position:absolute;inset:-30%;z-index:4;pointer-events:none;opacity:.55;background:radial-gradient(40% 30% at 30% 60%,rgba(190,170,230,.16),transparent 70%),radial-gradient(35% 28% at 70% 40%,rgba(233,211,164,.12),transparent 70%),radial-gradient(30% 25% at 50% 80%,rgba(150,190,220,.12),transparent 70%);filter:blur(20px);animation:opSmk 14s ease-in-out infinite alternate;mix-blend-mode:screen}
@keyframes opSmk{0%{transform:translate(-4%,2%) rotate(0)}100%{transform:translate(5%,-3%) rotate(8deg)}}
.opFl{position:absolute;inset:0;z-index:4;pointer-events:none;opacity:0;background:radial-gradient(ellipse at 50% 42%,var(--c,#D9B46A),transparent 62%);mix-blend-mode:screen}
.opFl.go{animation:opFlash .75s ease-out}
@keyframes opFlash{0%{opacity:0}18%{opacity:.85}100%{opacity:0}}
.opRing{position:absolute;left:50%;top:42%;width:120px;height:120px;margin:-60px 0 0 -60px;border-radius:50%;z-index:4;pointer-events:none;border:2px solid var(--c,#D9B46A);box-shadow:0 0 30px var(--c,#D9B46A),inset 0 0 30px var(--c,#D9B46A);opacity:0}
.opRing.go{animation:opRng 1.1s cubic-bezier(.2,.7,.2,1)}
@keyframes opRng{0%{opacity:.9;transform:scale(.2)}100%{opacity:0;transform:scale(5)}}
.opVig{position:absolute;inset:0;z-index:3;pointer-events:none;background:radial-gradient(ellipse at 50% 45%,transparent 45%,rgba(0,0,0,.75) 100%)}
.opMark{filter:drop-shadow(0 0 10px rgba(217,180,106,.55));transition:opacity .9s ease,transform 1.2s cubic-bezier(.2,.7,.2,1),filter .6s}
.op.gate .opMark{animation:opBreath 2.6s ease-in-out 1.2s infinite}
@keyframes opBreath{50%{filter:drop-shadow(0 0 22px rgba(217,180,106,.95))}}
.op.tap .opMark{animation:none;transform:translate(-50%,-50%) scale(1.35);filter:drop-shadow(0 0 30px #ffd98a) drop-shadow(0 0 70px #D9B46A) brightness(1.6)}
.op.s2 .opMark{opacity:0;transform:translate(-50%,-50%) scale(2.2);filter:blur(6px) drop-shadow(0 0 40px #D9B46A)}
.opGate{position:absolute;left:0;right:0;top:calc(44% + 78px);z-index:5;text-align:center;opacity:0;transition:opacity .9s ease .9s;pointer-events:none}
.op.gate .opGate{opacity:1}
.op.tap .opGate{opacity:0;transition:opacity .3s}
.opGate b{display:block;font-family:var(--brush);font-weight:400;font-size:40px;color:#F3E6C8;text-shadow:0 0 20px rgba(217,180,106,.5)}
.opGate small{display:inline-block;margin-top:14px;font-size:12.5px;letter-spacing:.08em;color:rgba(233,211,164,.7);animation:opHint 2s ease-in-out infinite}
@keyframes opHint{50%{opacity:.35}}
.op.gate{cursor:pointer}
.opCap{position:absolute;left:0;right:0;top:calc(44% + 70px);z-index:5;text-align:center;font-family:var(--brush);font-size:34px;color:#F3E6C8;text-shadow:0 0 24px rgba(217,180,106,.7);opacity:0;filter:blur(6px);transition:all .7s;pointer-events:none}
.opCap.on{opacity:1;filter:none}
/* ===== 2026-09-30 밤 정돈: 배경 그라데이션 · 차분한 칩 · 섹션 제목 · 개운 미션 · 무료 존(부적 카드) ===== */
.home{background:radial-gradient(120% 55% at 50% -8%,#2a1d17 0%,rgba(42,29,23,0) 60%),radial-gradient(90% 40% at 100% 38%,rgba(58,34,52,.35),rgba(0,0,0,0) 70%),linear-gradient(180deg,#110e12 0%,#0c0a0e 45%,#0a090c 100%)}
.hHead{background:rgba(17,14,18,.86);backdrop-filter:blur(14px) saturate(1.2);-webkit-backdrop-filter:blur(14px) saturate(1.2)}
.hHead::after{background:linear-gradient(180deg,rgba(17,14,18,.86),rgba(17,14,18,0))}
.sh{padding:0 18px 12px}
.sh small{font-size:11px;letter-spacing:.08em;color:#a08d6c;font-weight:600}
.sh b{font-size:17.5px;font-weight:700;letter-spacing:-.02em;color:#f4efe8;margin-top:5px}
.pc .chip,.pc .chip.open{background:rgba(12,10,14,.55);color:#f0dcae;border:1px solid rgba(227,184,102,.38);font-weight:600;letter-spacing:.02em}
.pc{box-shadow:0 12px 30px rgba(0,0,0,.35),inset 0 0 0 1px rgba(255,240,220,.06)}
.fort{background:linear-gradient(120deg,rgba(40,31,20,.9),rgba(20,17,21,.9) 60%);border-color:rgba(227,184,102,.26)}
.today{background:rgba(22,19,24,.72);border:1px solid rgba(255,240,220,.08);padding:14px 16px 14px}
.today .av{width:42px;height:42px;box-shadow:0 0 0 1.5px #161318,0 0 0 3px color-mix(in srgb,var(--c) 70%,transparent)}
.today p{font-weight:500;font-size:13.5px;color:#e9e3da}
.today .go{background:none;color:var(--gold-2);border:1px solid rgba(227,184,102,.5);font-weight:600;padding:7px 12px}
.hG{margin-top:14px;padding-top:12px;border-top:1px solid rgba(255,255,255,.06)}
.hG div b{font-size:12px;font-weight:700;opacity:.85}
.hG div i{height:3px;margin-top:6px}
.hG div i::after{opacity:.75}
.hG div.low b::after{font-size:8.5px;font-weight:600;color:#a08d6c;margin-top:2px}
.fz{margin-top:34px}
.fzH{position:relative}
.fzAll{position:absolute;right:18px;bottom:14px;border:0;background:none;color:#8f8990;font-size:12.5px;cursor:pointer;font-family:var(--sans);padding:4px 0}
.fzRow[hidden]{display:none!important}
.fzRow{display:flex;gap:8px;overflow-x:auto;padding:2px 18px 4px;scrollbar-width:none;scroll-padding:0 18px}
.fzRow::-webkit-scrollbar{display:none}
.fzc{flex:none;width:94px;display:flex;flex-direction:column;justify-content:flex-start;border:0;padding:0;background:none;text-align:center;cursor:pointer;color:#f4efe8;font-family:var(--sans)}
.fzc .fr{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;height:112px;border-radius:13px;overflow:hidden;background:radial-gradient(90% 60% at 50% 18%,color-mix(in srgb,var(--ec) 16%,transparent),transparent 70%),linear-gradient(180deg,#1c171d,#131015);box-shadow:inset 0 0 0 1px rgba(227,184,102,.28),0 10px 24px rgba(0,0,0,.35);transition:transform .25s}
.fzc .fr::before{content:"";position:absolute;inset:5px;border-radius:9px;border:1px solid rgba(227,184,102,.16);pointer-events:none}
.fzc .fr::after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,236,200,.12),transparent);transform:skewX(-18deg);animation:fzSh 6s ease-in-out infinite;animation-delay:var(--d,0s)}
@keyframes fzSh{0%,70%{left:-60%}100%{left:130%}}
.fzc .gg{font-family:var(--serif);font-weight:900;font-size:44px;line-height:1;background:linear-gradient(180deg,#f7e3b4,#c9994b);-webkit-background-clip:text;background-clip:text;color:transparent}
.fzc .ic{width:40px;height:40px;filter:drop-shadow(0 0 6px color-mix(in srgb,var(--ec) 35%,transparent))}
.fzc .nm{font-size:12.5px;font-weight:700;letter-spacing:-.01em;color:#f4efe8}
.fzc .ds{display:block;margin-top:7px;font-size:11px;color:#8f8990;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fzc:active .fr{transform:scale(.97)}
.fzc .fr.hasImg{justify-content:flex-end;padding-bottom:9px;background-size:cover!important;background-position:center 40%!important}
.fzc .fr.hasImg .ic{display:none}
.fzc .fr.hasImg .nm{position:relative;z-index:1;text-shadow:0 1px 6px rgba(0,0,0,.9)}
.fzc .fr.hasImg::before{background:linear-gradient(180deg,rgba(0,0,0,0) 45%,rgba(10,8,12,.85));border-color:rgba(227,184,102,.2)}
/* ===== 2026-09-30 22시: 라운딩 제거(원형 요소만 유지) · 배경을 먹빛 차콜로 ===== */
.home,.home *,.home *::before,.home *::after{border-radius:0!important}
.home .fort .fr,.home .fort .fr:before,.home .today .av,.home .pc .play,.home .cRow button span,.home .om span,.home .om.mine b::after,.home .ring,.home .tbtn,.home .toTop,.home .logo i u,.home .noti .pic,.home .prePerm .av,.home .logo img{border-radius:50%!important}
.home{background:radial-gradient(120% 50% at 50% -10%,#3a2b22 0%,rgba(58,43,34,0) 62%),radial-gradient(80% 40% at 100% 42%,rgba(82,48,70,.28),rgba(0,0,0,0) 70%),radial-gradient(80% 40% at 0% 78%,rgba(40,52,70,.22),rgba(0,0,0,0) 70%),linear-gradient(180deg,#1b171c 0%,#17141a 45%,#141117 100%)}
.hHead{background:rgba(27,23,28,.9)}
.hHead::after{background:linear-gradient(180deg,rgba(27,23,28,.9),rgba(27,23,28,0))}
.today{background:rgba(35,30,37,.78);border-color:rgba(255,240,220,.1)}
.fort{background:linear-gradient(120deg,rgba(52,40,26,.92),rgba(30,26,32,.92) 60%)}
.fzc .fr{background:radial-gradient(90% 60% at 50% 18%,color-mix(in srgb,var(--ec) 16%,transparent),transparent 70%),linear-gradient(180deg,#262028,#1c181f)}
.fzc .fr::before{inset:4px}
.pills button.on{background:none;box-shadow:inset 0 -2px 0 var(--gold-2);color:#fff}
.pc .chip,.pc .chip.open{padding:5px 8px 4px}
/* 하단 탭: 떠 있는 알약 → 화면 아래에 붙은 막대 */
.tabs{left:0;transform:none;width:100%;bottom:0;border-radius:0;padding:6px 6px calc(env(safe-area-inset-bottom,0px) + 8px);background:rgba(24,20,25,.92);border:0;border-top:1px solid rgba(255,240,220,.1)}
.tabs button{border-radius:0}
.tabs button.on{background:none;color:var(--gold-2)}
.pc>video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 18%;opacity:0;transition:opacity .8s;z-index:0;pointer-events:none}
.pc.vOn>video{opacity:1}
.pc::before{z-index:1}
.pc>.chip,.pc>.play,.pc>.ct{z-index:2}
.toTop{bottom:calc(env(safe-area-inset-bottom,0px) + 84px)!important;background:rgba(24,20,25,.85)!important;color:var(--gold-2)!important;border:1px solid rgba(227,184,102,.4)!important;width:42px!important;height:42px!important}

/* ===== 2026-09-30 23시 밝은 띠 섹션 (v59: 군더더기 제거 — 완전 흰 바탕, 선·점무늬·카드 테두리 없음) ===== */
.home .band{position:relative;margin-top:36px;padding:28px 0 30px;color:#15120f;background:#fff}
.home .band+.hSec{margin-top:40px}
.home .band .sh small{color:#a2702a;letter-spacing:.1em;font-weight:700}
.home .band .sh b{color:#15120f}
.home .band .fzAll{color:#8a8178}
.home .band .fzc{color:#15120f}
.home .band .fzc .fr:not(.hasImg) .nm{color:#f4efe8}
.home .band .fzc .ds{color:#8a8178}
.home .band .om{color:#15120f}
.home .band .om span{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--c)}
.home .band .om small{color:#8a8178}
.home .band .tool{background:#f5f3f0;border:0;box-shadow:none;color:#15120f}
.home .band .tool small{color:#8a8178}
.home .band .tool small em{color:#a2702a;font-weight:700}
.home .band .tiles span{background:#15120f}
.home .band .ring{border-color:rgba(162,112,42,.5);color:#a2702a}
/* 이용 후기: 글자 한 단계 작게, 아바타 옆 한 줄 정렬, 후기 사이 가는 구분선 */
.home .rv{gap:0}
.home .rv>div{padding:16px 0;border-top:1px solid rgba(255,255,255,.07)}
.home .rv>div:first-child{border-top:0;padding-top:2px}
.home .rv .h{gap:12px}
.home .rv .h .a{width:32px;height:32px;font-size:13px;background:rgba(255,255,255,.06)}
.home .rv .h b{font-size:12.5px;color:#eeeae4}
.home .rv .h small{font-size:9.5px;letter-spacing:.5px;margin-top:2px}
.home .rv .h time{font-size:10.5px}
.home .rv p{margin:8px 0 10px 44px;font-size:13px;line-height:1.62;color:#c9c5bf}
.home .rv .lk{margin-left:44px;padding:8px 10px;gap:10px;border-color:rgba(255,255,255,.08)}
.home .rv .lk span{width:34px;height:34px}
.home .rv .lk b{font-size:12.5px}
.home .rv .lk small{font-size:10.5px}
.home .rv .lk::after{font-size:18px}

/* ===== v60 정돈 — 뱃지는 NEW·무료·준비 중만 작게, 가운데 카드들은 한 가지 모양(옅은 면 + 가는 선, 그라데이션·금테 없음) ===== */
.home .pc .chip{top:12px;left:12px;font-size:9.5px;font-weight:800;letter-spacing:.1em;padding:4px 7px 3px;background:rgba(12,10,14,.55);border:1px solid rgba(255,255,255,.16);color:rgba(255,255,255,.72)}
.home .pc .chip.new{background:#e3b866;border-color:#e3b866;color:#15110a}
.home .pc .chip.free{background:rgba(12,10,14,.55);border-color:rgba(227,184,102,.7);color:#f3d79b}
.home .fort,.home .today,.home .back2salon,.home .gl,.home .myChar,.home .rv .lk{background:rgba(255,244,230,.035);border:1px solid rgba(255,236,210,.09);box-shadow:none}
.home .myChar{background:#000 url('../../img/avatar/fire_f.jpg') 50% 16%/cover no-repeat}
.home .fort .gz{display:none}
.home .fort,.home .today{margin-left:16px;margin-right:16px}
.home .today .go{background:none;border:1px solid rgba(227,184,102,.55);color:#f3d79b;font-weight:700}
.home .back2salon i,.home .gl small{letter-spacing:.06em}
.home .rank .rk span.th{box-shadow:none}

/* 무료 카드: 이중 테두리 없이 그림 한 장짜리 단순한 상자 */
.home .fzc .fr{border:0!important;box-shadow:none!important}
.home .fzc .fr::before{border:0!important;inset:0!important}

/* ===== v63 첫 화면 — 큰 글씨 한 줄 + 벤토(총운 · 행운 · 오늘의 개운). 박스 속 박스 없이 면 하나씩 ===== */
.home .tday{position:relative;padding:22px 16px 6px;background:radial-gradient(90% 70% at 88% -10%,color-mix(in srgb,var(--c,#e3b866) 20%,transparent),transparent 65%)}
.home .tdH{cursor:pointer;padding:0 2px}
.home .tdH small{display:block;font-size:12.5px;font-weight:600;letter-spacing:.02em;color:#c9ad7a}
.home .tdH h2{margin:8px 0 0;font-size:27px;line-height:1.3;font-weight:800;letter-spacing:-.035em;color:#f7f2ea;word-break:keep-all}
.home .tdH p{margin:8px 0 0;font-size:13px;color:#9d958b;letter-spacing:.01em}
.home .bento{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:18px}
.home .bt{position:relative;background:rgba(255,244,230,.045);padding:14px;min-height:118px;overflow:hidden}
.home .bScore{display:flex;flex-direction:column;justify-content:space-between;cursor:pointer}
.home .bScore .fr{position:relative;width:64px;height:64px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--gold) calc(var(--p)*1%),rgba(255,255,255,.09) 0)}
.home .bScore .fr:before{content:"";position:absolute;inset:3px;border-radius:50%;background:#1d191f}
.home .bScore .fr em{position:relative;font-style:normal;font-family:'Cormorant Garamond',serif;font-weight:700;font-size:27px;line-height:1;color:#f3d79b;text-align:center}
.home .bScore .fr em small{display:block;font-family:var(--sans);font-size:9px;color:#9a948c;font-weight:500;margin-top:1px}
.home .bScore .bl,.home .bMis .go{font-size:12px;color:#c9ad7a;font-weight:600}
.home .bScore .bl::after,.home .bMis .go::after{content:" ›"}
.home .bLuck small{display:block;font-size:11.5px;color:#9d958b}
.home .bLuck .lk{display:flex;align-items:center;gap:8px;margin-top:10px}
.home .bLuck .lk i{width:18px;height:18px;border-radius:50%;box-shadow:0 0 0 1px rgba(255,255,255,.2)}
.home .bLuck .lk b{font-size:17px;font-weight:700;color:#f4efe8}
.home .bLuck dl{display:flex;gap:16px;margin:12px 0 0}
.home .bLuck dl div{display:flex;flex-direction:column;gap:2px}
.home .bLuck dt{font-size:11px;color:#8a8279}
.home .bLuck dd{margin:0;font-size:13.5px;font-weight:600;color:#e9e3da}
.home .bMis{grid-column:1/-1;display:flex;align-items:center;gap:14px;min-height:0;padding:12px 14px 12px 12px;cursor:pointer}
.home .bMis .av{flex:none;width:58px;height:58px;border-radius:50%;background:#f3ede3 50% 16%/170% no-repeat}
.home .bMis .tx{flex:1;min-width:0}
.home .bMis small{display:block;font-size:11.5px;color:#9d958b}
.home .bMis small em{font-style:normal;color:var(--c);font-weight:700}
.home .bMis p{margin:4px 0 0;font-size:14px;line-height:1.5;font-weight:500;color:#f2eee8}
.home .bMis .go{flex:none;align-self:center}
.home .bScore .fr,.home .bScore .fr:before,.home .bMis .av,.home .bLuck .lk i{border-radius:50%!important}
.home .bMis .hG{display:none!important}

/* ===== v64 오방 뽑기 입구 (흰 띠 무료 존 안) ===== */
.home .ppg{display:flex;align-items:center;gap:12px;width:calc(100% - 36px);margin:0 18px 14px;padding:12px 12px 12px 10px;border:0;background:#f5efe5;text-align:left;color:#1f1a15;cursor:pointer;font-family:var(--sans)}
.home .ppg .tg{flex:none;width:62px;height:62px;border-radius:50%!important;background:#fbf8f3 center/125% no-repeat}
.home .ppg .tx{flex:1;min-width:0}
.home .ppg small{display:block;font-size:10.5px;font-weight:800;letter-spacing:.12em;color:#b8862f}
.home .ppg b{display:block;font-family:var(--brush);font-weight:400;font-size:25px;line-height:1.15;margin-top:3px}
.home .ppg em{display:block;font-style:normal;font-size:12px;color:#8a8178;margin-top:2px}
.home .ppg .mm{flex:none;display:flex}
.home .ppg .mm i{width:26px;height:26px;margin-left:-8px;border-radius:50%!important;background:#fff 50% 14%/190% no-repeat;box-shadow:0 0 0 2px #f5efe5}

.home .bjg{margin-top:-6px}
.home #secBook{margin-top:10px}
.home .bookC{position:relative;display:block;width:calc(100% - 36px);height:156px;margin:40px 18px 0;padding:0;border:0;background:#120e0b;color:#fff;text-align:left;cursor:pointer;overflow:visible}
.home .bookC .bg{position:absolute;inset:0;background:#000 center 38%/cover no-repeat;overflow:hidden}
.home .bookC .bg:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,7,5,.92) 0%,rgba(10,7,5,.72) 48%,rgba(10,7,5,.1) 100%)}
.home .bookC .pp{position:absolute;right:0;bottom:0;height:120%;max-width:68%;object-fit:contain;object-position:100% 100%;width:auto;pointer-events:none;filter:drop-shadow(0 14px 18px rgba(0,0,0,.55));transform-origin:50% 100%;animation:bkPop 4.6s ease-in-out infinite}
@keyframes bkPop{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-7px) rotate(-1deg)}}
.home .bookC .tx{position:absolute;left:18px;top:16px;bottom:16px;width:52%;z-index:2;display:flex;flex-direction:column}
.home .bookC small{font-size:12px;font-weight:700;letter-spacing:.06em;color:#e3b866}
.home .bookC b{margin-top:6px;font-family:var(--brush);font-weight:400;font-size:27px;line-height:1.12;color:#fff;text-shadow:0 2px 12px rgba(0,0,0,.5)}
.home .bookC .tx>em{display:none}
.home .bookC .go{margin-top:auto;align-self:flex-start;padding:7px 12px;background:#e3b866;color:#1a130c;font-style:normal;font-size:13.5px;font-weight:800}
.home .myoC{position:relative;display:block;width:calc(100% - 36px);margin:4px 18px 0;aspect-ratio:16/12;border:0;padding:0;background:#000 center 22%/cover no-repeat;overflow:hidden;cursor:pointer;text-align:left;color:#fff}
.home .myoC video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 22%;opacity:0;transition:opacity .6s}
.home .myoC video.on{opacity:1}
.home .myoC::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 45%,rgba(10,8,7,.88) 100%)}
.home .myoC .tg{position:absolute;top:10px;left:10px;z-index:2;font-size:10px;font-weight:800;letter-spacing:.1em;padding:3px 7px 2px;background:#f2a7b8;color:#2a1418}
.home .myoC .tx{position:absolute;left:14px;bottom:12px;z-index:2}
.home .myoC .tx b{display:block;font-family:var(--brush);font-weight:400;font-size:40px;line-height:1}
.home .myoC .tx em{display:block;margin-top:5px;font-style:normal;font-size:12px;color:rgba(255,245,235,.78)}
.home .myoC .av{position:absolute;right:12px;top:10px;z-index:2;display:flex}
.home .myoC .av i{width:30px;height:30px;margin-left:-8px;border-radius:50%!important;background:#222 center 26%/210% no-repeat;box-shadow:0 0 0 2px #15120f}
.home .dbBand .dbx{display:flex;align-items:center;gap:14px;width:calc(100% - 36px);margin:4px 18px 0;padding:14px 14px 14px 12px;border:0;background:#f5efe5;text-align:left;color:#1f1a15;cursor:pointer;font-family:var(--sans)}
.home .dbBand .st{flex:none;width:92px;height:92px;background:center/contain no-repeat;transform:rotate(-5deg);filter:drop-shadow(0 4px 8px rgba(60,40,20,.22))}
.home .dbBand .tx{flex:1;min-width:0}
.home .dbBand .tx small{display:block;font-size:11.5px;font-weight:700;color:#a2702a}
.home .dbBand .tx b{display:block;margin-top:3px;font-family:var(--brush);font-weight:400;font-size:22px;line-height:1.2}
.home .dbBand .wk{display:grid;grid-template-columns:repeat(7,1fr);gap:3px;margin-top:9px}
.home .dbBand .wk i{position:relative;aspect-ratio:1;background:#fff center/86% no-repeat;font-style:normal;font-size:9px;font-weight:700;color:#c2b8a8;display:grid;place-items:center}
.home .dbBand .wk i.has{color:transparent}
.home .dbBand .wk i.to{box-shadow:inset 0 0 0 1.5px #c8372d;color:#c8372d}
.home .dbBand .n{flex:none;align-self:flex-start;font-size:11px;font-weight:700;color:#8a8178}
.home .dbBand .n em{font-style:normal;font-size:15px;color:#1f1a15;margin-right:2px}
.home .bjg .cardT{border-radius:4px!important;width:48px;height:64px;margin:0 7px;background-size:cover;background-position:center;box-shadow:0 6px 14px rgba(60,40,20,.2)}
.home .bjg .mm .st,.home .dbg .mm .st{width:auto;height:auto;margin:0;border-radius:0!important;box-shadow:none;background:linear-gradient(120deg,#ffc6d9,#fff0a8,#b8f5dc,#bcd6ff,#e6c4ff);font-style:normal;font-size:10px;font-weight:800;letter-spacing:.1em;color:#2b2230;padding:4px 7px}

/* v67 첫 화면 세로 폭 줄이기 */
.home .tday{padding:10px 16px 0}
.home .tdH small{font-size:11.5px}
.home .tdH h2{margin-top:4px;font-size:20px;line-height:1.3}
.home .tdH p{display:none}
.home .bento{margin-top:10px;gap:6px}
.home .bt{min-height:0;padding:10px 12px}
/* 총운: 링 옆에 '자세히 보기' 한 줄 */
.home .bScore{flex-direction:row;align-items:center;justify-content:flex-start;gap:10px}
.home .bScore .fr{width:46px;height:46px;flex:none}
.home .bScore .fr em{font-size:20px}
.home .bScore .fr em small{font-size:8px}
/* 행운: 색 · 방향 · 숫자를 두 줄로 */
.home .bLuck small{font-size:11px}
.home .bLuck .lk{margin-top:5px;gap:6px}
.home .bLuck .lk i{width:14px;height:14px}
.home .bLuck .lk b{font-size:15px}
.home .bLuck dl{margin-top:4px;gap:10px}
.home .bLuck dl div{flex-direction:row;align-items:baseline;gap:4px}
.home .bLuck dd{font-size:12.5px}
/* 개운 미션: 한 줄 높이로 */
.home .bMis{padding:8px 12px 8px 8px;gap:10px}
.home .bMis .av{width:40px;height:40px}
.home .bMis small{font-size:11px}
.home .bMis p{margin-top:2px;font-size:13px;line-height:1.45}
.home .tday+.band{margin-top:18px}

/* 멤버십 목록 표시 */
.subList li i{width:6px;height:6px;margin-top:8px;background:var(--gold);border-radius:0}
/* 세로가 짧은 노트북 화면 */
@media (min-width:700px) and (max-height:800px){.opEnd{padding-top:calc(env(safe-area-inset-top,0px) + 17vh)}}
@media (min-width:700px) and (max-height:680px){.opEnd{padding-top:calc(env(safe-area-inset-top,0px) + 9vh)}.opEnd h2{font-size:38px!important}.opEnd p{font-size:18px}.opRes{margin-top:10px}}

/* 서하 소개 시트 */
.hxw{position:absolute;inset:0;z-index:120;display:flex;flex-direction:column;justify-content:flex-end;opacity:0;pointer-events:none;transition:opacity .25s}
.hxw.on{opacity:1;pointer-events:auto}
.hxb{position:absolute;inset:0;background:rgba(0,0,0,.55)}
.hxp{position:relative;background:#141117;border-top:1px solid rgba(227,184,102,.35);padding:20px 20px calc(env(safe-area-inset-bottom,0px) + 18px);transform:translateY(20px);transition:transform .3s;color:var(--ink)}
.hxw.on .hxp{transform:none}
.hxh{display:grid;grid-template-columns:84px 1fr;gap:14px;align-items:start}
.hxh i{display:block;width:84px;height:106px;background:#000 center 18%/cover no-repeat}
.hxh small{display:block;font-size:11.5px;letter-spacing:.06em;color:var(--gold-2)}
.hxh b{display:block;margin-top:4px;font-family:var(--brush);font-weight:400;font-size:30px;line-height:1.1;color:#fff}
.hxh p{margin:8px 0 0;font-size:14px;line-height:1.6;color:var(--ink-2)}
.hxd{margin:16px 0 0}
.hxd div{display:grid;grid-template-columns:92px 1fr;gap:10px;padding:10px 0;border-top:1px solid rgba(255,255,255,.08);font-size:13.5px;line-height:1.55}
.hxd div:last-child{border-bottom:1px solid rgba(255,255,255,.08)}
.hxd dt{font-weight:700;color:var(--gold-2);font-size:13px}
.hxd dd{margin:0;color:var(--ink-2)}
.hxa{display:flex;gap:8px;margin-top:16px}
.hxa button{flex:1;height:48px;border:1px solid rgba(255,255,255,.18);background:transparent;color:var(--ink);font-size:14.5px;font-weight:700;cursor:pointer}
.hxa .hxbook{border-color:var(--gold);color:var(--gold-2)}

/* ---------- 2027 신년 기획전 (맨 위) ---------- */
.home .hSec.ny{margin-top:14px;padding:22px 0 26px;background:linear-gradient(180deg,#2a1311 0%,#1d1210 55%,rgba(20,17,23,0) 100%)}
.home .ny .sh small{color:#e0a46a}
.home .ny .sh b{font-size:19px}
.home .ny .fzAll{color:#e9c9a0;bottom:14px}
.home .nyRow .pc{width:43%;max-width:200px}
.home .nyRow .pc.nyHero{width:58%;max-width:260px}
/* 노을 대표 배너(홈 맨 위) */
.home .ftS{padding-top:6px}
.home .feat{position:relative;margin:0 16px;height:min(62vw,300px);min-height:230px;overflow:hidden;background:#000;cursor:pointer;box-shadow:0 18px 40px rgba(0,0,0,.45)}
.home .feat video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:62% 16%}
.home .feat .fsh{position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,8,14,.92) 0%,rgba(10,8,14,.6) 42%,rgba(10,8,14,0) 72%),linear-gradient(0deg,rgba(10,8,14,.55),rgba(10,8,14,0) 40%)}
.home .feat .fct{position:absolute;left:18px;bottom:18px;right:30%;z-index:1;color:#fff}
.home .feat small{display:block;font-size:10.5px;letter-spacing:.24em;color:#E9C98B;font-weight:700}
.home .feat b{display:block;margin-top:8px;font-family:'OBrush','Noto Serif KR',serif;font-weight:400;font-size:34px;line-height:1.1;text-shadow:0 3px 18px rgba(0,0,0,.7)}
.home .feat p{margin:8px 0 0;font-size:12.5px;line-height:1.6;color:rgba(243,235,222,.85)}
.home .feat .fgo{display:inline-block;margin-top:12px;padding:8px 12px;border:1px solid rgba(233,201,139,.7);font-size:12.5px;font-weight:700;color:#F1DBA4}
.home .nyRow .pc .tt{font-size:26px!important}
.home .nyRow .pc.nyHero .tt{font-size:31px!important}
.home .nyRow .pc .st{font-size:11.5px}
.home .nyRow .pc .chip.nyB{background:#c0392b;border-color:#c0392b;color:#fff3e6}
.home .ny .nyH{position:relative}
.home .pc.nyEnd,.home .pc.nyGo{border:0;padding:0;font-family:inherit;color:#fff;background:linear-gradient(160deg,#7d1c17 0%,#3a1512 55%,#1a1214 100%);text-align:center}
.home .pc.nyEnd .ct,.home .pc.nyGo .ct{bottom:auto;top:50%;transform:translateY(-50%)}
.home .pc.nyEnd .go,.home .pc.nyGo .go{display:inline-block;margin-top:14px;font-size:12px;font-weight:700;color:#f3d6a8;border-bottom:1px solid rgba(243,214,168,.5);padding-bottom:2px}
.home .pc.nyGo .nyS{position:absolute;right:14px;top:14px;display:grid;place-items:center;width:34px;height:34px;background:#c0392b;color:#fff3e6;font-family:var(--serif);font-weight:900;font-size:11px;line-height:1.05;transform:rotate(-4deg)}

/* 오방도감 로고(10/3 시안 적용: 붓글씨 워드마크 + 五 원형 표장). 원본 assets_raw/brand/ */
.opMark.ob{width:min(64vw,250px);height:auto;top:41%;display:flex;flex-direction:column;align-items:center;gap:20px;filter:none}
.opMark.ob img{display:block;stroke:none}
.opMark.ob .obM{width:22%;opacity:0;transform:rotate(-14deg) scale(.86)}
.opMark.ob .obW{width:78%;opacity:0;-webkit-mask-image:linear-gradient(180deg,#000 0,#000 34%,transparent 64%);mask-image:linear-gradient(180deg,#000 0,#000 34%,transparent 64%);-webkit-mask-size:100% 300%;mask-size:100% 300%;-webkit-mask-position:0 100%;mask-position:0 100%;filter:drop-shadow(0 4px 18px rgba(0,0,0,.7))}
.op.on .opMark.ob .obM{animation:obMk 1.1s cubic-bezier(.2,.7,.2,1) .15s forwards}
.op.on .opMark.ob .obW{animation:obInk 1.8s cubic-bezier(.45,.05,.25,1) .55s forwards}
@keyframes obMk{to{opacity:1;transform:none}}
@keyframes obInk{0%{opacity:1}100%{opacity:1;-webkit-mask-position:0 0;mask-position:0 0}}
.op.gate .opMark.ob{animation:obBreath 3.2s ease-in-out 2.6s infinite}
@keyframes obBreath{50%{filter:drop-shadow(0 0 16px rgba(217,180,106,.35))}}
.op.tap .opMark.ob{animation:none;transform:translate(-50%,-50%) scale(1.06);filter:drop-shadow(0 0 24px rgba(255,217,138,.55)) brightness(1.15)}
.op.s2 .opMark.ob{opacity:0;transform:translate(-50%,-50%) scale(1.25);filter:blur(5px)}
.opGate.ob{top:calc(41% + min(48vw,190px) + 36px)}
.opGate.ob b{font-family:var(--serif);font-weight:700;font-size:16px;letter-spacing:.42em;padding-left:.42em;color:rgba(243,230,200,.92);text-shadow:none}
.sLogo.ob{flex-direction:column;gap:10px}
.sLogo.ob .lm{width:34px;height:34px}
.sLogo.ob .lw{width:auto;height:36px;filter:drop-shadow(0 2px 10px rgba(0,0,0,.7))}
.home .logo img.lw,.logo img.lw{width:auto;height:21px;border-radius:0}
.hMenuS .hd img.lw{width:auto;height:20px}

/* 연애 상담소 입구(10/3 v2: 흰 띠 위 크림 카드 + 서하 누끼, 한자 칩 삭제) */
.home .lhubS .sh{margin-bottom:14px}
.lhub{position:relative;display:flex;align-items:center;margin:26px 18px 0;min-height:150px;padding:0 0 0 18px;background:#f5efe5;color:#1f1a15;text-decoration:none;overflow:visible}
.lhub .tx{position:relative;z-index:1;display:flex;flex-direction:column;padding:20px 0;width:58%}
.lhub small{font-size:10.5px;font-weight:800;letter-spacing:.08em;color:#b8862f}
.lhub b{margin-top:8px;font-family:var(--brush);font-weight:400;font-size:40px;line-height:1.05;letter-spacing:.01em;color:#1f1a15}
.lhub em{margin-top:8px;font-style:normal;font-size:13.5px;line-height:1.55;color:#6f665d}
.lhub .go{margin-top:12px;align-self:flex-start;font-size:12.5px;font-weight:800;color:#f5efe5;background:#1f1a15;padding:7px 14px}
.lhub .pp{position:absolute;right:-4px;bottom:0;height:calc(100% + 34px);width:auto;max-width:46%;object-fit:cover;object-position:top;pointer-events:none}
/* lhub-dark: 10/3 녹트서울 — 서하 블라우스(크림)가 베이지 · 와인빛 바탕과 겹쳐 묻힘 → 차가운 남색 판 + 뒤쪽 푸른 빛으로 블라우스를 떼어 냄 */
.home .band.lhubS{background:#0e0b10;color:#f6ecdf}
.home .lhubS .lhub{background:radial-gradient(70% 90% at 84% 38%,rgba(150,175,225,.30) 0%,rgba(70,90,140,.14) 42%,rgba(13,16,24,0) 72%),linear-gradient(135deg,#161c2a 0%,#0f131d 60%,#0b0e15 100%);color:#f6ecdf;box-shadow:inset 0 0 0 1px rgba(232,196,138,.24)}
.home .lhubS .lhub small{color:#e8b77a}
.home .lhubS .lhub b{color:#fff4ea;text-shadow:0 2px 18px rgba(0,0,0,.5)}
.home .lhubS .lhub em{color:rgba(246,236,223,.72)}
.home .lhubS .lhub .go{background:#e8c48a;color:#1a120b}
.home .lhubS .lhub .pp{filter:drop-shadow(0 0 1px rgba(236,210,170,.55)) drop-shadow(0 0 14px rgba(170,190,235,.28)) drop-shadow(0 14px 24px rgba(0,0,0,.6))} /* 10/3 18:05 누끼 윤곽을 또렷하게: 어깨선 직접 그린 seoha_suit2 + 얇은 금빛 테두리 · 뒤 푸른 빛, 흐림 마스크 없음 */ /* 10/3 원인: 예전 누끼(seoha.webp)가 검은 재킷을 배경으로 오인해 지움 → 재킷 자리에 판 색이 비쳐 옷이 배경색처럼 보였음. 재킷까지 살린 새 누끼 seoha_suit.webp(u2net_human_seg + isnet) */
/* 10/3 18:20 lhub v3: 녹트서울 — 누끼 어깨선이 아무렇게나 잘린 듯함 → 누끼 폐기, 서하가 남색 커튼 상담실에 처음부터 앉아 있는 한 장 그림(촛불 · 찻잔 · 붉은 실 편지)을 판 전체에 깔고 왼쪽은 같은 남색으로 이어 글자 자리 확보. 자르는 선 없음 */
.home .lhubS .lhub.v3{min-height:0;height:clamp(208px,60vw,300px);padding:0 0 0 20px;overflow:hidden;background:#020714 url(https://d8j0ntlcm91z4.cloudfront.net/user_39PvKg67WRq5T66HczulEDxUKSm/hf_20261003_092411_d1faf027-f4d0-4acf-afe6-1c17d421f9c5_min.webp) right center/auto 100% no-repeat;box-shadow:inset 0 0 0 1px rgba(232,196,138,.26)}
.home .lhubS .lhub.v3::before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#020714 0%,rgba(2,7,20,.88) 34%,rgba(2,7,20,.35) 52%,rgba(2,7,20,0) 64%),linear-gradient(0deg,rgba(2,7,20,.55) 0%,rgba(2,7,20,0) 30%);pointer-events:none}
.home .lhubS .lhub.v3 .tx{width:60%;padding:18px 0}
.home .lhubS .lhub.v3 b{font-size:36px}
.home .lhubS .lhub.v3 em{font-size:13px}

/* 10/7 잠금 표시: 이모지 대신 선 그림(글자색을 따름) */
:root{--oblk:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 12'%3E%3Cpath d='M2.5 5V3.5a2.5 2.5 0 0 1 5 0V5' fill='none' stroke='%23000' stroke-width='1.3'/%3E%3Crect x='1' y='5' width='8' height='7' fill='%23000'/%3E%3C/svg%3E")}
.oblk{display:inline-block;width:9px;height:11px;margin-right:6px;vertical-align:-1px;font-style:normal;background:currentColor;-webkit-mask:var(--oblk) center/contain no-repeat;mask:var(--oblk) center/contain no-repeat}

/* 10/7 오방도감 RED 입구: 상단 알약 + 연애 구획 위 배너 */
.pills a.pRed{flex:none;display:inline-flex;align-items:center;font-size:13px;font-weight:700;letter-spacing:.14em;padding:7px 13px;color:#fff;background:#c3122f;border-radius:999px;text-decoration:none;font-family:var(--sans)}
.redS{padding-top:6px}
.redB{position:relative;display:block;margin:0 16px;height:236px;overflow:hidden;background:#070405 50% 22%/cover no-repeat;color:#f3e9e4;text-decoration:none;border-bottom:2px solid #c3122f}
.redB:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,4,5,.94) 0,rgba(7,4,5,.72) 46%,rgba(7,4,5,.05) 100%)}
.redB .ln{position:absolute;inset:0;background:repeating-linear-gradient(90deg,rgba(228,58,82,0) 0 37px,rgba(228,58,82,.35) 37px 38px,rgba(228,58,82,0) 38px 61px);mask-image:linear-gradient(180deg,#000,transparent 75%);-webkit-mask-image:linear-gradient(180deg,#000,transparent 75%);animation:redLn 6s ease-in-out infinite alternate}
@keyframes redLn{to{transform:translateX(-12px)}}
.redB .tx{position:absolute;left:18px;top:0;bottom:0;display:flex;flex-direction:column;justify-content:center;max-width:62%}
.redB small{font-size:10.5px;letter-spacing:.2em;color:#e43a52;font-weight:700}
.redB b{margin-top:8px;font-family:"Noto Serif KR",serif;font-size:23px;line-height:1.3;font-weight:700}
.redB em{margin-top:8px;font-style:normal;font-size:12.5px;line-height:1.5;color:#cbb8b1}
.redB .go{align-self:flex-start;margin-top:14px;padding:8px 12px;background:#c3122f;color:#fff;font-size:12.5px;font-weight:700;letter-spacing:.08em}
@media (prefers-reduced-motion:reduce){.redB .ln{animation:none}}