:root{
  --ink:#fff7fa; --panel:#ffffff; --panel2:#fdeff5; --line:#f2d8e3;
  --paper:#33222c; --muted:#96707f; --dim:#bd9aa9;
  --wood:#2e9e63; --fire:#e0524a; --earth:#c9911c; --metal:#7d8aa0; --water:#3f6fd8;
  --pos:#2e9e63; --neg:#e0524a; --gold:#c9911c;
  --serif:'Noto Sans KR',sans-serif;
  --sans:'Noto Sans KR',sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{background:var(--ink);color:var(--paper);font-family:var(--sans);font-weight:400;font-size:15px;line-height:1.6}
body::before{content:'';position:fixed;inset:0;pointer-events:none;z-index:0;background:
 radial-gradient(1000px 640px at 88% -12%,rgba(236,72,153,.10),transparent 62%),
 radial-gradient(820px 620px at -12% 18%,rgba(236,72,153,.06),transparent 60%),
 radial-gradient(900px 560px at 55% 112%,rgba(236,72,153,.08),transparent 62%)}
.wrap{position:relative;z-index:1;max-width:1120px;margin:0 auto;padding:28px 16px 72px}
@media(min-width:880px){.wrap{padding:44px 24px 88px}}
header{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin-bottom:24px}
.logo{font-family:var(--serif);font-weight:900;font-size:34px;letter-spacing:.16em;line-height:1}
.logo em{font-style:normal;color:#e84393}
.tag{font-size:13px;color:var(--muted)}
.ver{margin-left:auto;font-size:11px;font-weight:700;letter-spacing:.1em;color:#fff;background:#e84393;border-radius:50px;padding:3px 12px}
.cols{display:grid;grid-template-columns:1fr;gap:20px;align-items:start}
@media(min-width:880px){.cols{grid-template-columns:350px 1fr;gap:28px}}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:20px;box-shadow:0 3px 24px rgba(232,67,147,.06)}
.panel h2{font-family:var(--serif);font-weight:900;font-size:13px;letter-spacing:.16em;margin:0 0 16px;color:var(--paper)}
label{display:block;font-size:12px;font-weight:500;color:var(--muted);margin:14px 0 6px}
label:first-of-type{margin-top:0}
input,select{width:100%;background:#fdf3f7;border:1px solid var(--line);color:var(--paper);font-family:var(--sans);font-size:14px;padding:10px 12px;border-radius:12px;outline:none}
input:focus,select:focus{border-color:#e84393;box-shadow:0 0 0 3px rgba(232,67,147,.18)}
input:disabled{opacity:.45}
.row{display:flex;gap:8px}.row>*{flex:1}
.chk{display:flex;align-items:center;gap:8px;margin-top:12px;font-size:13px;color:var(--muted);cursor:pointer}
.chk input{width:17px;height:17px;flex:none;accent-color:#e84393}
button.go{width:100%;margin-top:20px;background:#e84393;color:#fff;border:none;font-family:var(--sans);font-weight:700;font-size:15px;padding:14px;border-radius:12px;cursor:pointer;transition:filter .15s}
button.go:hover{filter:brightness(1.08)}
button.go:disabled{opacity:.5;cursor:default}
.hint{font-size:11px;color:var(--dim);line-height:1.6;margin-top:12px}
.note{font-size:11.5px;color:#c9911c;margin-top:8px;display:none}
.plate{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:22px 18px 18px;box-shadow:0 3px 24px rgba(232,67,147,.06)}
.plate-head{display:flex;align-items:baseline;gap:12px;margin-bottom:16px;flex-wrap:wrap}
.plate-head .who{font-family:var(--serif);font-weight:900;font-size:16px;letter-spacing:.06em}
.plate-head .when{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
.pillars{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
@media(min-width:880px){.pillars{gap:12px}}
.pil{border:1px solid var(--line);background:var(--panel2);border-radius:14px;padding:12px 4px 10px;text-align:center}
.pil .lab{font-size:10px;font-weight:700;letter-spacing:.24em;color:var(--dim);margin-bottom:8px}
.glyph{font-family:var(--serif);font-weight:900;font-size:38px;line-height:1.12;display:block}
.rd{font-size:11px;color:var(--muted);margin-top:1px}
.pil .sep{height:1px;background:var(--line);margin:8px 12px}
.el-0{color:var(--wood)}.el-1{color:var(--fire)}.el-2{color:var(--earth)}.el-3{color:var(--metal)}.el-4{color:var(--water)}
.meta{margin-top:12px;font-size:11px;color:var(--dim);text-align:center;line-height:1.7}
.tabs{display:flex;gap:8px;margin:28px 0 0;flex-wrap:wrap;border-bottom:none}
.tabbtn{background:var(--panel);border:1px solid var(--line);color:var(--muted);font-family:var(--sans);font-weight:700;font-size:13px;padding:10px 18px;border-radius:50px;cursor:pointer;transition:background .15s,color .15s}
.tabbtn:hover{color:var(--paper)}
.tabbtn.on{background:#e84393;border-color:#e84393;color:#fff}
.res-head{display:flex;align-items:baseline;gap:12px;margin:18px 0 12px}
.res-head .cnt{font-size:12px;color:var(--muted);margin-left:auto;font-variant-numeric:tabular-nums}
.card{background:var(--panel);border:1px solid var(--line);border-radius:16px;margin-bottom:10px;padding:14px 16px;cursor:pointer;transition:border-color .15s,background .15s,box-shadow .15s}
.card:hover{border-color:#e84393;background:#fff}
.card.open{border-color:#e84393;box-shadow:0 3px 30px rgba(232,67,147,.14)}
.ctop{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.rank{font-family:var(--serif);font-weight:900;font-size:15px;color:var(--dim);width:26px;flex:none;font-variant-numeric:tabular-nums}
.mini{display:flex;gap:6px;flex:none}
.mg{width:38px;text-align:center;border:1px solid var(--line);background:var(--panel2);padding:5px 0 6px;border-radius:10px}
.mg .ml{font-size:9px;letter-spacing:.18em;color:var(--dim);margin-bottom:3px}
.mg .g{font-family:var(--serif);font-weight:900;font-size:18px;line-height:1.2;display:block}
.mg.blank .g{visibility:hidden}
.dt{font-size:12.5px;color:var(--muted);font-variant-numeric:tabular-nums}
.score{margin-left:auto;display:flex;align-items:baseline;gap:5px;flex:none;white-space:nowrap}
.score b{font-family:var(--serif);font-weight:900;font-size:22px;font-variant-numeric:tabular-nums}
.score span{font-size:11px;color:var(--dim)}
.badges{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.tier{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.04em;padding:3px 12px;border-radius:50px;border:1px solid transparent}
.tier.tS{color:#fff;border-color:#c9911c;background:linear-gradient(135deg,#e2a92c,#c9911c);box-shadow:0 2px 14px rgba(201,145,28,.35)}
.tier.t1{color:var(--pos);border-color:var(--pos);background:rgba(46,158,99,.10)}
.tier.t2{color:#3f6fd8;border-color:#3f6fd8;background:rgba(63,111,216,.10)}
.tier.t3{color:var(--muted);border-color:var(--line);background:var(--panel2)}
.chip{display:inline-block;font-size:11px;font-weight:500;color:var(--muted);border:1px solid var(--line);padding:3px 10px;border-radius:50px}
.chip.pre{color:#a97812;border-color:rgba(201,145,28,.5);background:rgba(201,145,28,.08)}
.chip.tam{color:#d63384;border-color:rgba(232,67,147,.5);background:rgba(232,67,147,.08)}
.detail{display:none;margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}
.card.open .detail{display:block}
.dgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
@media(min-width:880px){.dgrid{gap:8px}}
.dcell{border:1px solid var(--line);padding:10px 6px;text-align:center;background:var(--panel2);border-radius:12px}
.dcell .dlab{font-size:10px;letter-spacing:.14em;color:var(--dim)}
.dcell .dpair{font-family:var(--serif);font-weight:700;font-size:16px;margin:6px 0 4px;white-space:nowrap}
.dcell .drel{font-size:11px;line-height:1.5;color:var(--muted)}
.dcell .dsc{font-family:var(--serif);font-weight:900;font-size:15px;margin-top:5px}
.tag-p{color:var(--pos)}.tag-n{color:var(--neg)}.tag-o{color:var(--dim)}
.xrel{margin-top:12px}
.xrel .xr{font-size:12.5px;color:var(--muted);line-height:1.7;padding:8px 12px;border:1px solid var(--line);border-radius:12px;margin-bottom:6px;background:var(--panel2)}
.xrel .xr b{color:var(--paper);font-weight:700}
.dnote{font-size:11.5px;color:var(--dim);margin-top:10px;line-height:1.6}
.empty{color:var(--dim);font-size:13px;padding:24px 0;text-align:center}
.sextab{width:100%;border-collapse:collapse;margin-top:6px}
.sextab th{font-size:11px;color:var(--dim);letter-spacing:.12em;text-align:left;padding:8px 10px;border-bottom:1px solid var(--line);font-weight:700;white-space:nowrap}
.sextab th:first-child{min-width:86px}
.sextab td{padding:10px;border-bottom:1px solid var(--line);vertical-align:top}
.sextab tr.sexrow:hover td{background:rgba(232,67,147,.06)}
.sextab .zh{font-family:var(--serif);font-weight:900;font-size:24px}
.sextab .rk{font-family:var(--serif);font-weight:700;font-size:13px;white-space:nowrap}
.sextab .ds{font-size:12.5px;color:var(--muted);line-height:1.6}
.r1{color:#a97812}.r2{color:var(--pos)}.r3{color:#d63384}.r4{color:var(--water)}.r5{color:var(--muted)}.r6{color:var(--dim)}
.foot{margin-top:44px;border-top:1px solid var(--line);padding-top:16px;font-size:11px;color:var(--dim);line-height:1.75}
.foot b{color:var(--muted);font-weight:500}
.cta{display:inline-flex;align-items:center;gap:8px;background:var(--panel);border:1.5px solid var(--gold);
  color:var(--gold);font-family:var(--sans);font-weight:600;font-size:13.5px;letter-spacing:.02em;
  padding:10px 20px;border-radius:999px;text-decoration:none;transition:background .15s,color .15s}
.cta:hover{background:var(--gold);color:#fff}
.cta .ar{font-size:15px;line-height:1}
.ctabox{margin-top:14px;padding:16px;border:1px solid var(--line);border-radius:12px;background:var(--panel2);text-align:center}
.ctabox .t{font-size:13px;color:var(--muted);line-height:1.75;margin-bottom:12px}
.ctabox .t b{color:var(--paper);font-weight:600}
.privacy{margin-top:12px;padding:9px 11px;border:1px solid var(--line);border-radius:8px;
  background:var(--panel2);font-size:11px;line-height:1.65;color:var(--muted)}
.warn{color:#a97812}
a{color:#d63384}a:hover{color:#e84393}