.vz-panel { margin: 0 0 6mm; padding: 5mm 6mm; border: 1px solid #e3e1d9; border-radius: 3mm; background: #fff; break-inside: avoid; }
.vz-panel > .ttl { display: flex; justify-content: space-between; align-items: baseline; margin: 0 0 3mm; color: #24344b; font-size: 10.5pt; font-weight: 700; }
.vz-panel > .ttl small { color: #7b8691; font-size: 8pt; font-weight: 400; }
.vz-panel > .cap { margin: 2.5mm 0 0; color: #6d7887; font-size: 8.5pt; line-height: 1.55; }
.vz-panel > .cap b { color: #24344b; font-weight: 700; }
.vz-two { display: grid; grid-template-columns: 1fr 1fr; gap: 5mm; break-inside: avoid; }
.vz-two > .vz-panel { margin: 0; }
.vz-radar { display: block; max-width: 86mm; margin: 0 auto; }
.vz-curve { display: block; }

.vz-bars { display: grid; gap: 2.2mm; }
.vz-bar { display: grid; grid-template-columns: 40mm 1fr 22mm; align-items: center; gap: 3mm; padding: 1.6mm 2mm; border-radius: 2mm; }
.vz-bar.hl { background: #f6efdf; }
.vz-bar .lbl b { display: block; color: #24344b; font-size: 9.5pt; font-weight: 700; line-height: 1.3; }
.vz-bar .lbl small { color: #7b8691; font-size: 7.8pt; }
.vz-bar .track { height: 3.4mm; border-radius: 1.7mm; background: #eeeae1; overflow: hidden; }
.vz-bar .track i { display: block; height: 100%; border-radius: 1.7mm; }
.vz-bar .val { text-align: right; line-height: 1.2; }
.vz-bar .val b { color: #24344b; font-size: 12pt; font-weight: 700; }
.vz-bar .val small { display: block; color: #6d7887; font-size: 7.8pt; }

.vz-gauges { display: grid; grid-template-columns: repeat(3, 1fr); gap: 3mm; }
.vz-gauge { padding: 3.2mm 3.5mm; border-radius: 2.5mm; background: #f7f5f0; }
.vz-gauge .top { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: .5mm 2mm; }
.vz-gauge .top b { color: #24344b; font-size: 9.5pt; font-weight: 700; }
.vz-gauge .grade { color: #2f6a5e; font-size: 8pt; font-weight: 700; }
.vz-gauge.empty .grade { color: #b3573f; }
.vz-gauge .track { height: 2.6mm; margin: 2mm 0 1.6mm; border-radius: 1.3mm; background: #e6e1d6; overflow: hidden; }
.vz-gauge .track i { display: block; height: 100%; background: #24344b; }
.vz-gauge.empty .track i { background: #c9674b; }
.vz-gauge .sub { color: #6d7887; font-size: 7.8pt; line-height: 1.45; }

.vz-badges { display: grid; grid-template-columns: repeat(2, 1fr); gap: 2.5mm; margin-top: 3mm; }
.vz-badge { display: flex; gap: 2.5mm; align-items: baseline; padding: 2.5mm 3mm; border: 1px solid #eadfc4; border-radius: 2.5mm; background: #fbf7ec; }
.vz-badge b { flex-shrink: 0; color: #7a5a17; font-size: 9pt; font-weight: 700; }
.vz-badge span { color: #5d6776; font-size: 8pt; line-height: 1.45; }

.vz-cal-head { margin: 0 0 2.5mm; color: #24344b; font-size: 10pt; font-weight: 700; }
.vz-cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 1.4mm; }
.vz-cal .wd { text-align: center; color: #6d7887; font-size: 8pt; font-weight: 700; padding-bottom: 1mm; }
.vz-cal .wd.sun { color: #c0533b; } .vz-cal .wd.sat { color: #3f6d9c; }
.vz-cal .cell { position: relative; min-height: 13mm; padding: 1.4mm 1.8mm; border-radius: 2mm; background: #f3f0e9; }
.vz-cal .cell.blank { background: transparent; }
.vz-cal .cell .d { display: block; color: #24344b; font-size: 9pt; font-weight: 700; }
.vz-cal .cell .s { position: absolute; right: 1.8mm; bottom: 1.2mm; color: rgba(36,52,75,.75); font-size: 7.5pt; }
.vz-cal .cell.t5 { background: #2f7d6b; } .vz-cal .cell.t5 .d, .vz-cal .cell.t5 .s { color: #fff; }
.vz-cal .cell.t4 { background: #cfe5da; } .vz-cal .cell.t3 { background: #f1eee6; }
.vz-cal .cell.t2 { background: #f6ddd1; } .vz-cal .cell.t1 { background: #e9b7a5; }
.vz-cal .cell.rank { outline: 2px solid #c7a13a; outline-offset: -1px; }
.vz-cal .cell.rank1 { outline-width: 3px; }
.vz-cal .cell.avoid { outline: 2px dashed #c0533b; outline-offset: -1px; }
.vz-cal .cell .av { position: absolute; left: 1.6mm; bottom: 1.1mm; padding: .2mm 1.2mm; border-radius: 1mm; background: #fff; border: .3mm solid #c0533b; color: #c0533b; font-size: 6.8pt; font-weight: 700; }
.vz-avoid-list { display: grid; gap: 2.2mm; }
.vz-avoid-list .row { display: grid; grid-template-columns: 24mm 12mm 1fr; gap: 3mm; align-items: baseline; padding: 2.4mm 3mm; border: 1px dashed #d9a79a; border-radius: 2mm; background: #fdf6f3; break-inside: avoid; }
.vz-avoid-list .dt { color: #24344b; font-size: 9.5pt; font-weight: 700; }
.vz-avoid-list .sc { color: #c0533b; font-size: 9.5pt; font-weight: 700; }
.vz-avoid-list .why { color: #55606e; font-size: 8.5pt; line-height: 1.5; }
.vz-avoid-list .why small { display: block; color: #8a929c; font-size: 7.5pt; }
.vz-cal .cell .r { position: absolute; left: 1.6mm; bottom: 1.1mm; padding: .2mm 1.2mm; border-radius: 1mm; background: #c7a13a; color: #fff; font-size: 6.8pt; font-weight: 700; }
.vz-legend { display: flex; flex-wrap: wrap; gap: 1.5mm 4mm; margin-top: 3mm; color: #6d7887; font-size: 7.8pt; }
.vz-legend i { display: inline-block; width: 3mm; height: 3mm; margin-right: 1.2mm; border-radius: .8mm; vertical-align: -.4mm; }

.vz-hours, .vz-months .grid { display: flex; align-items: flex-end; gap: 2.5mm; height: 44mm; padding-top: 2mm; }
.vz-hours .col, .vz-months .col { position: relative; flex: 1; display: flex; flex-direction: column; align-items: center; height: 100%; }
.vz-hours .bar, .vz-months .bar { flex: 1; width: 70%; display: flex; align-items: flex-end; border-radius: 1.5mm; background: #f1eee6; overflow: hidden; }
.vz-hours .bar i, .vz-months .bar i { display: block; width: 100%; border-radius: 1.5mm 1.5mm 0 0; }
.vz-hours .v, .vz-months .v { color: #24344b; font-size: 8.5pt; font-weight: 700; margin-bottom: 1mm; }
.vz-hours .h, .vz-months .h { margin-top: 1.2mm; color: #5d6776; font-size: 8pt; }
.vz-months .d { color: #9aa3ae; font-size: 7pt; }
.vz-hours .col.best .bar, .vz-months .col.best .bar { outline: 2px solid #c7a13a; outline-offset: 1px; }
.vz-hours .col.best .h, .vz-months .col.best .h { color: #24344b; font-weight: 700; }
.vz-hours .tag { position: absolute; top: -4.2mm; padding: .3mm 1.5mm; border-radius: 1mm; background: #c7a13a; color: #fff; font-size: 6.8pt; font-weight: 700; }
.vz-flow .col { position: relative; }
.vz-flow .tag { position: absolute; top: -4.2mm; padding: .3mm 1.2mm; border-radius: 1mm; background: #2f7d6b; color: #fff; font-size: 6.5pt; font-weight: 700; white-space: nowrap; }
.vz-flow .tag.low { background: #c9674b; }
.vz-flow .grid { gap: 1.6mm; }
.vz-months { margin-top: 1mm; }

.vz-heat { width: 100%; border-collapse: separate; border-spacing: 1.2mm; font-size: 8pt; }
.vz-heat th { color: #6d7887; font-weight: 700; font-size: 7.8pt; text-align: center; white-space: nowrap; }
.vz-heat td { height: 7mm; border-radius: 1.4mm; text-align: center; color: #24344b; font-weight: 700; }
.vz-heat td.t5 { background: #2f7d6b; color: #fff; } .vz-heat td.t4 { background: #cfe5da; } .vz-heat td.t3 { background: #f1eee6; }
.vz-heat td.t2 { background: #f6ddd1; } .vz-heat td.t1 { background: #e9b7a5; } .vz-heat td.none { background: transparent; }
.vz-heat td.best { outline: 3px solid #c7a13a; outline-offset: -1px; }

.vz-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 3mm; break-inside: avoid; }
.vz-card { padding: 4mm; border: 1px solid #e3e1d9; border-radius: 3mm; background: #fff; }
.vz-card .ic { font-size: 14pt; line-height: 1; margin-bottom: 2mm; }
.vz-card .t { color: #6d7887; font-size: 8pt; font-weight: 700; letter-spacing: .04em; }
.vz-card .v { margin-top: 1mm; color: #24344b; font-size: 11pt; font-weight: 700; line-height: 1.4; }
.vz-card .n { margin-top: 1.5mm; color: #6d7887; font-size: 8pt; line-height: 1.5; }

.vz-swatches { display: grid; grid-template-columns: 1fr 1fr; gap: 3mm; }
.vz-swatch { display: flex; gap: 3mm; align-items: center; padding: 3mm; border-radius: 2.5mm; background: #f7f5f0; }
.vz-swatch i { width: 11mm; height: 11mm; border-radius: 2mm; flex-shrink: 0; }
.vz-swatch b { display: block; color: #24344b; font-size: 9.5pt; font-weight: 700; }
.vz-swatch span { color: #6d7887; font-size: 8pt; line-height: 1.45; }

.vz-verdict { margin: 0 0 7mm; padding: 6mm 7mm; border-radius: 4mm; background: #fff; border: 1.5px solid #c7a13a; break-inside: avoid; }
.vz-verdict .k { color: #8a6a1f; font-size: 8.5pt; font-weight: 700; letter-spacing: .08em; }
.vz-verdict .h { margin: 2mm 0 4mm; color: #1d2c40; font-family: 'ReportMyeongjo','Batang','바탕',serif; font-size: 15pt; font-weight: 700; line-height: 1.5; }
.vz-verdict .stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 3mm; }
.vz-verdict .stat { padding: 3mm 3.5mm; border-radius: 2.5mm; background: #f7f3e8; }
.vz-verdict .stat small { display: block; color: #6d7887; font-size: 7.8pt; }
.vz-verdict .stat b { display: block; margin-top: .8mm; color: #1d2c40; font-size: 12.5pt; font-weight: 700; }
.vz-verdict .stat span { color: #6d7887; font-size: 8pt; }
.vz-verdict .vd-sub { color: #2f6a5e; font-size: 10pt; font-weight: 700; }
.vz-verdict .vd-alts { display: flex; flex-wrap: wrap; gap: 2mm; margin-top: 4mm; }
.vz-verdict .vd-alts span { padding: 1.5mm 3mm; border-radius: 2mm; background: #f7f3e8; color: #5d6776; font-size: 8.5pt; }

.vz-pair { margin-top: 1mm; }
.vz-pair-legend { display: flex; flex-wrap: wrap; gap: 1.5mm 5mm; margin: 0 0 3mm; color: #5d6776; font-size: 8.5pt; }
.vz-pair-legend i { display: inline-block; width: 3mm; height: 3mm; margin-right: 1.4mm; border-radius: .8mm; vertical-align: -.4mm; }
.vz-pair-legend i.a, .vz-pair .col.a i { background: #24344b; }
.vz-pair-legend i.b, .vz-pair .col.b i { background: #c7a13a; }
.vz-pair-legend i.c { background: #2f7d6b; border-radius: 50%; }
.vz-pair-grid { display: flex; align-items: stretch; gap: 3mm; height: 54mm; padding-top: 1mm; }
.vz-pair .grp { position: relative; flex: 1; display: flex; flex-direction: column; align-items: center; min-width: 0; padding: 0 1mm 1.5mm; border-radius: 2mm; }
.vz-pair .grp.best { background: #eef6f2; outline: 1.5px solid #2f7d6b; outline-offset: 0; }
.vz-pair .pair { flex: 1; display: flex; align-items: stretch; gap: 1.2mm; width: 100%; justify-content: center; padding-top: 7mm; }
.vz-pair .col { flex: 1; max-width: 9mm; display: flex; flex-direction: column; align-items: center; }
.vz-pair .col .v { color: #24344b; font-size: 8pt; font-weight: 700; margin-bottom: .8mm; }
.vz-pair .col .bar { flex: 1; width: 100%; display: flex; align-items: flex-end; border-radius: 1.2mm; background: #f1eee6; overflow: hidden; }
.vz-pair .col .bar i { display: block; width: 100%; border-radius: 1.2mm 1.2mm 0 0; }
.vz-pair .grp .h { margin-top: 1.2mm; color: #5d6776; font-size: 8pt; white-space: nowrap; }
.vz-pair .grp.best .h { color: #24344b; font-weight: 700; }
.vz-pair .grp .avg { margin-top: .6mm; padding: .3mm 2mm; border-radius: 2mm; background: #f1eee6; color: #5d6776; font-size: 7.5pt; white-space: nowrap; }
.vz-pair .grp .avg b { color: #24344b; font-size: 9pt; }
.vz-pair .grp.best .avg { background: #2f7d6b; color: #fff; }
.vz-pair .grp.best .avg b { color: #fff; }
.vz-pair .tag { position: absolute; top: 1mm; left: 50%; transform: translateX(-50%); padding: .3mm 1.6mm; border-radius: 1mm; background: #2f7d6b; color: #fff; font-size: 6.8pt; font-weight: 700; white-space: nowrap; }

.vz-dd-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 5mm; break-inside: avoid; margin-top: 6mm; }
.vz-dd-grid.one { grid-template-columns: 1fr; }
.vz-dd { padding: 5mm 6mm; border-radius: 3mm; background: #fff; border: 1px solid #e3e1d9; }
.vz-dd.do { border-top: 3px solid #438779; }
.vz-dd.dont { border-top: 3px solid #c9674b; }
.vz-dd .ttl { margin-bottom: 3mm; font-size: 10pt; font-weight: 800; }
.vz-dd.do .ttl { color: #2f6a5e; }
.vz-dd.dont .ttl { color: #a3513a; }
.vz-dd ol { margin: 0; padding-left: 5mm; font-size: 9.5pt; line-height: 1.7; color: #354457; }
.vz-dd li { margin-bottom: 1.5mm; }
.vz-dd strong.hl, .vz-dd mark { font-weight: 700; color: #1d2c40; background: linear-gradient(transparent 58%, rgba(199,161,58,.32) 58%); }
.vz-web .vz-pair-grid { gap: 1.5mm; height: 48mm; }
.vz-web .vz-pair .col .v { font-size: 7pt; }
@media (max-width: 560px) {
  .vz-dd-grid { grid-template-columns: 1fr; }
  .vz-web .vz-pair .grp { padding: 0 .3mm 1.5mm; }
  .vz-web .vz-pair .col { max-width: 5mm; }
  .vz-web .vz-pair .grp .avg { padding: .3mm 1mm; font-size: 6.8pt; }
}


.vz-web { margin: 18px 0 6px; font-size: 14px; line-height: 1.6; color: #29394b; }
.vz-web .vz-panel { padding: 16px; border-radius: 14px; }
.vz-web .vz-verdict { padding: 20px; border-radius: 16px; }
.vz-web .vz-verdict .h { font-family: 'Noto Serif KR', serif; font-size: 20px; line-height: 1.5; }
.vz-web .vz-cards { margin: 0 0 6mm; }
@media (max-width: 560px) {
  .vz-web .vz-cards, .vz-web .vz-verdict .stats { grid-template-columns: 1fr; }
  .vz-web .vz-gauges, .vz-web .vz-badges, .vz-web .vz-swatches { grid-template-columns: 1fr 1fr; }
  .vz-web .vz-bar { grid-template-columns: 30mm 1fr 16mm; gap: 2mm; }
  .vz-web .vz-cal .cell { min-height: 11mm; padding: 1mm 1.2mm; }
  .vz-web .vz-cal .cell .r { display: none; }
  .vz-web .vz-cal .cell .av { display: none; }
  .vz-web .vz-hours, .vz-web .vz-months .grid { gap: 1.2mm; }
  .vz-web .vz-months .d { display: none; }
  .vz-web .vz-heat { border-spacing: .6mm; font-size: 7pt; }
}