:root{--bg:#EEEAE2;--paper:#F8F6F1;--ink:#1B2A4A;--sub:#5B6478;--line:#D9D3C7;--lamp:#C9973B;--mem:#2F4A87;--err:#B3402F}
@media (prefers-color-scheme:dark){:root{--bg:#0E1424;--paper:#151C30;--ink:#F1EDE4;--sub:#A3AABB;--line:#2A3350;--mem:#8FA6D8;--err:#F08A78}}
*{box-sizing:border-box;margin:0}
html{height:100%;font-size:calc(100% * var(--fs,1))}
body{min-height:100%;background:var(--bg);color:var(--ink);font:1.125rem/1.6 "Gowun Dodum",system-ui,sans-serif;display:flex;justify-content:center}
.frame{width:100%;max-width:480px;min-height:100vh;min-height:100dvh;background:var(--paper);display:flex;flex-direction:column;box-shadow:0 0 0 1px var(--line);padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
.top{display:flex;justify-content:space-between;align-items:center;padding:16px 24px}
.logo{font:700 1.25rem "Cormorant Garamond","Gowun Batang",serif;cursor:pointer}
.logo span{font-weight:500;color:var(--sub)}
.lang button{background:none;border:0;color:var(--sub);font:500 0.9375rem inherit;padding:6px 4px;cursor:pointer}
.lang button.on{color:var(--ink);font-weight:700;border-bottom:2px solid var(--lamp)}
.screen{display:none;flex:1;padding:24px 24px 96px;flex-direction:column}
.screen.on{display:flex}
.tabs{display:none;position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:100%;max-width:480px;background:var(--paper);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom,0px);z-index:5}
.tabs button{flex:1;min-height:60px;background:none;border:0;border-top:3px solid transparent;color:var(--sub);font:500 0.9375rem inherit;cursor:pointer;padding:8px 4px}
.tabs button.on{color:var(--ink);font-weight:700;border-top-color:var(--lamp)}
.hero{flex:1;display:flex;flex-direction:column;justify-content:center;padding:24px 0}
.echo{font:700 76px/1.05 "Cormorant Garamond","Gowun Batang",serif;letter-spacing:-.02em}
.echo span{display:block}.echo .b{opacity:.5}.echo.en{font-size:64px}
.desc{margin-top:18px;color:var(--sub);font-size:1.1875rem}
.lead{margin-top:32px;padding-top:24px;border-top:1px solid var(--line);font:400 1.3125rem/1.6 "Gowun Batang",serif}
.lamp{width:10px;height:10px;border-radius:50%;background:var(--lamp);margin-bottom:22px;box-shadow:0 0 18px 4px rgba(201,151,59,.45)}
.btn{display:flex;align-items:center;justify-content:center;width:100%;min-height:58px;border-radius:32px;border:1.5px solid var(--btn,var(--ink));background:var(--btn,var(--ink));color:var(--btn-on,var(--paper));font:700 1.125rem inherit;cursor:pointer;margin-top:12px}
.btn.ghost{background:none;color:var(--ink);border-color:var(--ink)}
.btn.kakao{background:#FEE500;border-color:#FEE500;color:#191919}
.knote{font-size:0.8125rem;color:var(--sub);text-align:center;margin:10px 0 0;line-height:1.5}
.btn:disabled{opacity:.5}
h2{font:700 1.625rem/1.35 "Gowun Batang",serif;margin:8px 0 20px}
label{display:block;font-weight:500;font-size:1rem;margin:14px 0 6px}
label small{color:var(--sub);font-weight:400}
input,select{width:100%;min-height:54px;padding:0 16px;border:1.5px solid var(--line);border-radius:14px;background:var(--paper);color:var(--ink);font:1.125rem inherit}
input:focus,select:focus,button:focus-visible{outline:3px solid var(--lamp);outline-offset:2px}
.row{display:flex;gap:8px}.row select{width:110px}
.check{display:flex;gap:12px;align-items:flex-start;margin:20px 0 4px;font-size:1rem;color:var(--sub)}
.check input{width:24px;min-height:24px;margin-top:3px}
.msg{min-height:26px;margin-top:14px;font-size:1rem;color:var(--sub);text-align:center}
.msg.err{color:var(--err)}
.link{color:var(--sub);text-align:center;margin-top:16px;font-size:1rem;cursor:pointer;text-decoration:underline}
.card{border:1.5px solid var(--line);border-radius:22px;padding:20px;margin:8px 0 14px}
.card p{color:var(--sub);font-size:1rem}
.pc{display:flex;gap:12px;align-items:center}.pc .info{flex:1}.pc b{font-size:1.25rem}.pc .dd{font:700 1.875rem "Cormorant Garamond","Gowun Batang",serif;color:var(--lamp);text-align:right;white-space:nowrap}
.pc.bday{border-left:6px solid var(--lamp)}.pc.mem{border-left:6px solid var(--mem)}.pc.mem .dd{color:var(--mem)}
.pc .chip{font-size:0.8125rem;font-weight:700;letter-spacing:.02em;margin-bottom:2px}.pc.bday .chip{color:var(--lamp)}.pc.mem .chip{color:var(--mem)}
.conv{display:none;margin:4px 0 8px;padding:12px 14px;border:1.5px solid var(--line);border-radius:14px;font-size:1rem;line-height:1.5;color:var(--sub)}
.pc .del{color:var(--sub);font-size:0.875rem;text-decoration:underline;cursor:pointer;margin-top:4px;display:inline-block}
.seg{display:flex;gap:8px}
.seg .btn{margin-top:0;min-height:54px;font-size:1.0625rem;flex:1;white-space:pre-line}
.seg .btn.on{background:var(--ink);color:var(--paper)}
.rbox{margin:-6px 0 16px;padding:14px 16px;border:1.5px dashed var(--line);border-radius:18px}
.rbox .t{font-size:0.9375rem;color:var(--sub);margin-bottom:6px}
.rrow{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:4px 12px;padding:6px 0;font-size:1rem}
.rrow>div{flex:1 1 200px;min-width:0;overflow-wrap:anywhere}
.rrow span.x:first-of-type{margin-left:auto}
.rrow small{color:var(--sub);font-size:0.8125rem;display:block}
.rrow .x{color:var(--sub);cursor:pointer;text-decoration:underline;font-size:0.875rem;white-space:nowrap}
.radd{display:flex;gap:8px;margin-top:8px}
@media (max-width:440px){.radd1{flex-direction:column}.radd1>*{flex:none!important;width:100%!important}}.radd input{min-height:46px;font-size:1rem}
.radd button{min-width:72px;border-radius:14px;border:1.5px solid var(--ink);background:none;color:var(--ink);font:700 1rem inherit;cursor:pointer}
.t2{font-size:.9375rem;color:var(--sub);margin:22px 0 4px}
.sbtn{padding:0 16px;min-height:46px}
.hintS{font-size:.875rem;color:var(--sub);margin:10px 0 6px;line-height:1.5}
.rbox input[readonly]{min-height:46px;font-size:.875rem;margin-top:8px}
#jGuest,#jUser{display:none}
.chk{display:flex;align-items:center;gap:8px;margin:12px 0 4px;font-size:1rem;color:var(--ink)}.chk input{width:22px;height:22px;flex:none;margin:0}
.rbox select,.rbox input[type=text]{margin-top:6px}
.back{background:none;border:0;color:var(--sub);font:inherit;font-size:1rem;cursor:pointer;padding:6px 0;text-align:left;width:auto;align-self:flex-start}
textarea{width:100%;min-height:110px;padding:12px 16px;border:1.5px solid var(--line);border-radius:14px;background:var(--paper);color:var(--ink);font:1.125rem/1.6 inherit;resize:vertical}
textarea:focus{outline:3px solid var(--lamp);outline-offset:2px}
.spYT{font:700 1.375rem "Cormorant Garamond","Gowun Batang",serif;color:var(--mem)}
#spYears{margin:6px 0 4px;flex-wrap:wrap}#spYears:empty{display:none}
#spYears .btn{min-height:44px;flex:none;padding:0 18px;font-size:1rem}
.post{margin:10px 0}.post .ph{display:flex;justify-content:space-between;align-items:baseline;gap:8px}.post .ph small{color:var(--sub);font-size:.875rem}
.post .body{white-space:pre-wrap;overflow-wrap:anywhere;margin:8px 0 12px;line-height:1.7}
.pa{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.pbtn{background:none;border:1.5px solid var(--line);border-radius:20px;min-height:42px;padding:0 16px;color:var(--ink);font:inherit;font-size:1rem;cursor:pointer}
.pbtn.on{border-color:var(--lamp);color:var(--lamp);font-weight:700}
.pa .del{color:var(--sub);font-size:.875rem;text-decoration:underline;cursor:pointer;margin-left:auto}
.cm{margin:10px 0 0;padding-top:8px;border-top:1px solid var(--line)}.cm .cl{display:flex;justify-content:space-between;gap:8px;margin:8px 0;font-size:1rem}.cm .cl small{color:var(--sub)}
.cm .radd input{min-height:46px}
.empty2{color:var(--sub);margin:16px 0}
.rbox>.btn{margin-top:6px;margin-bottom:22px}
.prow{cursor:pointer;padding:14px 18px;margin:8px 0}.prow:hover{border-color:var(--mem)}
.prow b{display:block;font-size:1.0625rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.prow small{display:block;margin-top:4px;color:var(--sub);font-size:.875rem}
.dh{font:700 1.25rem/1.5 inherit;margin:0 0 4px;overflow-wrap:anywhere}
#spForm input[type=text]{margin:0 0 10px}
#spForm .radd .btn{flex:1;margin-top:12px}
.pbtn .em{font-size:1.1em;margin-right:2px}
.mrc{border-color:var(--lamp);margin:10px 0 16px}.mrc p{margin:6px 0}.mrc .mr-s{color:var(--sub);font-size:.9375rem;line-height:1.5}
.mrc .mr-w{color:var(--err);font-size:.9375rem;margin:10px 0}.mrc .radd .sbtn{flex:1}
.mrc label.chk{margin:6px 0}
#homeNote:empty,#mrBox:empty{display:none}
.hnote{border:1.5px solid var(--line);border-radius:16px;padding:14px 16px;margin:0 0 14px;line-height:1.5;display:flex;gap:10px;justify-content:space-between;align-items:flex-start}
.hnote .del{color:var(--sub);font-size:.875rem;text-decoration:underline;cursor:pointer;white-space:nowrap}
.mnote{color:var(--sub);font-size:.9375rem;margin:-6px 0 10px;padding:0 4px;line-height:1.5}.mnote .del{margin-left:8px;text-decoration:underline;cursor:pointer}
.qcard{border-color:var(--mem);margin:10px 0 14px;cursor:pointer}.qcard .chip{font-size:.8125rem;font-weight:700;color:var(--mem);margin-bottom:4px}
.qcard b{display:block;font-size:1.0625rem;line-height:1.55;overflow-wrap:anywhere}.qcard small{display:block;margin-top:8px;color:var(--sub);font-size:.875rem}
.qcard p{margin:6px 0 10px;line-height:1.55}.qcard .btn{margin-top:4px}
.qpast{margin:0 0 10px}.qpast .tg{color:var(--sub);font-size:.9375rem;text-decoration:underline;cursor:pointer}
.qset{margin:14px 0 4px}.qset select{margin-top:6px}
.qd textarea{margin-top:8px}.qd .radd .btn{flex:1;margin-top:12px}
.pgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:10px 0}
.pth{position:relative;aspect-ratio:1;border-radius:12px;overflow:hidden;background:var(--line)}
.pth img{width:100%;height:100%;object-fit:cover;display:block}
.pth .x{position:absolute;top:4px;right:4px;width:32px;height:32px;border-radius:16px;background:rgba(0,0,0,.6);color:#fff;border:0;cursor:pointer;font-size:1.125rem;line-height:1}
.pth small{position:absolute;left:0;right:0;bottom:0;background:rgba(0,0,0,.55);color:#fff;font-size:.75rem;padding:3px 6px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
#pdet .card{margin:12px 0}#pdet textarea{margin:8px 0 4px}
#myPhotos:empty{display:none}#myPhotos{margin:0 0 22px}

body[data-theme="warm"]{--bg:#F3E6D0;--paper:#FBF3E6;--ink:#4A2E12;--sub:#7A6246;--line:#E0CDAE;--lamp:#B85F0F;--mem:#8A4308;--err:#B3402F;--btn:#A8540A;--btn-on:#FFFFFF}
body[data-theme="solemn"]{--bg:#101A33;--paper:#1B2A4A;--ink:#F1EDE4;--sub:#A3AABB;--line:#3A4A6E;--lamp:#C9973B;--mem:#C9B27C;--err:#F08A78;--btn:#C9973B;--btn-on:#1B2A4A}
body[data-theme="solemn"] input,body[data-theme="solemn"] select,body[data-theme="solemn"] textarea{background:#223356}
body[data-theme="warm"] input,body[data-theme="warm"] select,body[data-theme="warm"] textarea{background:#FFF9F0}
.choice{display:block;width:100%;text-align:left;font:inherit;color:var(--ink);background:var(--paper);border:1.5px solid var(--line);border-radius:18px;padding:18px 18px;margin:0 0 12px;cursor:pointer}
.choice b{display:block;font-size:1.25rem}.choice span{display:block;margin-top:4px;color:var(--sub);font-size:1rem;line-height:1.5}
.choice.main{border-color:var(--lamp);border-width:2px}.choice.main b{color:var(--lamp)}
.choice.sub{padding:14px 18px}.choice.sub b{font-size:1.0625rem;font-weight:500}.choice.sub span{font-size:.9375rem}
.choice:focus-visible{outline:3px solid var(--lamp);outline-offset:2px}
#pick h2{line-height:1.5;margin:8px 0 28px}
.gprev{display:block;width:100%;max-height:300px;object-fit:contain;border-radius:12px;background:var(--line);margin:8px 0}
.gcard{margin:12px 0;padding:12px}.gcard img{display:block;width:100%;max-height:460px;object-fit:contain;border-radius:12px;background:var(--line)}
.gcard .gcap{margin:10px 0 4px;line-height:1.6;overflow-wrap:anywhere;white-space:pre-wrap}
.gcard .gmeta{display:flex;justify-content:space-between;gap:8px;color:var(--sub);font-size:.875rem;margin-top:6px}
.gcard .gmeta .del{text-decoration:underline;cursor:pointer}
#pdet textarea{margin:8px 0 4px}#pdForm .radd .btn{flex:1;margin-top:12px}
.tipc{border-left:6px solid var(--lamp);margin:8px 0 16px}.tipc .chip{font-size:.8125rem;font-weight:700;color:var(--lamp);margin-bottom:2px}
.tipc h3{font:700 1.1875rem/1.5 inherit;margin:2px 0 8px;overflow-wrap:anywhere}
.tipc ol{margin:0;padding-left:1.4em}.tipc li{margin:6px 0;line-height:1.55;overflow-wrap:anywhere}
.tipc .tg{display:inline-block;margin:6px 0 2px;color:var(--sub);font-size:.9375rem;text-decoration:underline;cursor:pointer}
.tipc .note{color:var(--sub);font-size:.875rem;line-height:1.5;margin:8px 0 0}
.tipc .tmail{margin-top:12px;padding-top:10px;border-top:1px solid var(--line)}.tipc .tmail .chk{margin:0}.tipc .tmail small{display:block;color:var(--sub);font-size:.875rem;margin:4px 0 0 30px}
#tipBox:empty{display:none}
.capsule{display:flex;align-items:center;gap:12px;margin:-6px 0 14px;padding:14px 16px;border:1.5px solid var(--lamp);border-radius:18px;background:var(--paper);cursor:pointer}
.capsule .cb{flex:1;min-width:0}.capsule b{display:block;font-size:1.0625rem}.capsule span{display:block;color:var(--sub);font-size:.9375rem;line-height:1.5;margin-top:2px}
.capsule small{display:block;margin-top:4px;color:var(--lamp);font-size:.875rem;font-weight:700}
.capsule .ch{font-size:1.5rem;color:var(--lamp);line-height:1}.capsule:focus-visible{outline:3px solid var(--lamp);outline-offset:2px}
.pwac{margin:0 0 22px}#pwaBan:empty,#pwaBox:empty{display:none}
.nbar{display:flex;gap:10px;align-items:flex-start;margin:0 0 14px;padding:14px 16px;border:2px solid var(--lamp);border-radius:16px;background:var(--paper)}
.nbar .nb{flex:1;min-width:0}.nbar b{display:block;font-size:1.0625rem;color:var(--lamp);overflow-wrap:anywhere}.nbar p{margin:6px 0 0;line-height:1.55;white-space:pre-wrap;overflow-wrap:anywhere}
.nbar img{display:block;max-width:100%;max-height:220px;object-fit:contain;margin-top:8px;border-radius:10px;cursor:zoom-in}
.nbar .nx{background:none;border:0;color:var(--sub);font-size:1.5rem;line-height:1;cursor:pointer;padding:0 4px}
.crow{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;padding:2px 2px 10px;margin:0 -2px}
.citem{position:relative;flex:0 0 62%;max-width:260px;aspect-ratio:9/16;border-radius:16px;overflow:hidden;background:var(--line);scroll-snap-align:start;cursor:zoom-in}
.citem img{width:100%;height:100%;object-fit:cover;display:block}
.citem .ck{position:absolute;left:8px;top:8px;background:rgba(0,0,0,.62);color:#fff;font-size:.8125rem;padding:2px 9px;border-radius:12px}
#noticeBox:empty,#cardBox:empty{display:none}#cardBox{margin:0 0 10px}
.lb{position:fixed;inset:0;background:rgba(0,0,0,.9);z-index:60;align-items:center;justify-content:center}
.lb img{max-width:96vw;max-height:92vh;object-fit:contain;border-radius:8px}
.lbx{position:absolute;top:calc(12px + env(safe-area-inset-top,0px));right:14px;width:44px;height:44px;border-radius:22px;border:0;background:rgba(255,255,255,.22);color:#fff;font-size:1.75rem;line-height:1;cursor:pointer}
.acard{display:flex;gap:12px;margin:10px 0;padding:12px}.acard>img{width:64px;height:112px;object-fit:cover;border-radius:10px;flex:none;background:var(--line)}
.acard .ai{flex:1;min-width:0}.acard .ai b{display:block;overflow-wrap:anywhere}.acard .ai small{display:block;color:var(--sub);margin:3px 0}
.as{display:inline-block;font-size:.8125rem;font-weight:700;padding:1px 9px;border-radius:10px;border:1.5px solid var(--line);color:var(--sub)}
.as.live{border-color:var(--lamp);color:var(--lamp)}.as.sched{border-color:var(--mem);color:var(--mem)}
.aact{margin-top:8px;display:flex;gap:16px}.aact .del{text-decoration:underline;cursor:pointer;color:var(--sub);font-size:.9375rem}
#admin .card{margin:12px 0}#admin label{display:block;margin:12px 0 4px}#admin select,#admin input[type=text],#admin input[type=date]{width:100%}#admin .radd{margin-top:10px}#admin .radd .sbtn{flex:1}
.faq{border:1.5px solid var(--line);border-radius:14px;padding:12px 14px;margin:8px 0;background:var(--paper)}
.faq summary{cursor:pointer;font-weight:700;line-height:1.5}.faq p{margin:8px 0 0;line-height:1.65;color:var(--sub)}
.icard{margin:10px 0;padding:12px 14px}.icard .ibody{white-space:pre-wrap;overflow-wrap:anywhere;margin:6px 0 8px;line-height:1.55}
.imail{display:inline-block;margin:0 10px 6px 0;color:var(--lamp);text-decoration:underline;overflow-wrap:anywhere}
.fsc{margin:0 0 18px}.fsc .seg .btn{padding:0 4px;font-size:.9375rem}.fss{font-size:1.125rem;margin:10px 0 0}
#tinq .card{margin:12px 0}#tinq label{display:block;margin:12px 0 4px}#tinq select,#tinq input[type=text]{width:100%}#admin .icard .as{margin-top:2px}
.knote.legal a,.legalrow a{color:var(--sub);text-decoration:underline}.knote.co{font-size:.8125rem;line-height:1.6;opacity:.9}
.legalrow{margin:8px 0 10px;line-height:1.8}
#delacct ul{padding-left:1.2em;line-height:1.75;margin:8px 0 14px}#delacct label{display:block;margin:12px 0 6px}#delacct input[type=text]{width:100%}
#delBlock{white-space:pre-wrap;padding:12px 14px;border:2px solid var(--err);border-radius:14px;line-height:1.6;margin:12px 0}
.btn.danger{background:var(--err);border-color:var(--err);color:#fff}.btn.danger:disabled{opacity:.45}
