/* Membership card layout inspired by nastar-shopping. Scoped to pricing only. */
.pricing-plans { max-width:1320px; margin:0 auto; padding:80px 32px 56px; color:#f4f4f8; font-family:system-ui,-apple-system,"Malgun Gothic",sans-serif; }
.pricing-plans * { box-sizing:border-box; }
.pricing-plans .plans-heading { text-align:center; padding:0 0 50px; }
.pricing-plans .plans-kicker { display:inline-block; padding:8px 18px; border:1px solid #ff682d55; background:#ff450012; border-radius:999px; color:#ff9662; letter-spacing:.12em; font-size:12px; font-weight:800; }
.pricing-plans .plans-heading h2 { margin:20px 0 16px; font:800 clamp(26px,3.5vw,44px)/1.3 system-ui,sans-serif; letter-spacing:-.045em; color:#fff; word-break:keep-all; }
.pricing-plans .plans-heading p { color:#bdc8d8; line-height:1.8; margin:0; font-size:15px; }
.pricing-plans .plans-perks { display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin-top:24px; }
.pricing-plans .plans-perks span { border:1px solid #52647d; background:#273345; padding:9px 16px; border-radius:999px; font-size:13px; color:#d4d4df; }
.pricing-plans .plans-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:20px; align-items:stretch; }
.pricing-plans .plan-option { position:relative; display:flex; flex-direction:column; background:#273345; border:1px solid #52647d; border-radius:22px; overflow:hidden; box-shadow:0 12px 30px #0003; transition:transform .2s,border-color .2s; }
.pricing-plans .plan-option:hover { transform:translateY(-5px); border-color:#ff7a4655; }
.pricing-plans .plan-featured { border-color:#ffb800; box-shadow:0 12px 35px #ffb80016; }
.pricing-plans .plan-ribbon { position:absolute; top:0; left:50%; transform:translateX(-50%); background:#ffb800; color:#392700; border-radius:0 0 10px 10px; padding:5px 12px; font-size:10px; font-weight:900; letter-spacing:.06em; white-space:nowrap; }
.pricing-plans .plan-head { padding:36px 15px 24px; text-align:center; color:#182332; background:linear-gradient(#daf5e7,#e8f6ee); }
.pricing-plans .tone-sky .plan-head { background:linear-gradient(#d6ebff,#e9f4ff); }
.pricing-plans .tone-gold .plan-head { background:linear-gradient(#ffe6ae,#fff4d8); }
.pricing-plans .tone-premium .plan-head { background:linear-gradient(135deg,#ffd58c,#f3b4d1 60%,#c3b0ff); }
.pricing-plans .plan-icon { display:block; height:36px; font-size:27px; line-height:1; color:#bd8709; }
.pricing-plans .plan-head h3 { font:900 22px/1.3 system-ui,sans-serif; letter-spacing:-.03em; margin:12px 0 8px; }
.pricing-plans .plan-head p { margin:0; color:#4e596d; font-size:12px; line-height:1.5; word-break:keep-all; }
.pricing-plans .plan-body { padding:24px 20px; display:flex; flex:1; flex-direction:column; }
.pricing-plans .plan-amount small { display:block; font-size:12px; color:#b9c6d8; margin-bottom:6px; }
.pricing-plans .plan-amount strong { font-size:28px; line-height:1.3; font-weight:900; white-space:nowrap; letter-spacing:-.04em; }
.pricing-plans .plan-amount > span { font-size:12px; color:#b9c6d8; margin-left:5px; white-space:nowrap; }
.pricing-plans .plan-rows { list-style:none; margin:24px 0; padding:0; }
.pricing-plans .plan-rows li { display:flex; justify-content:space-between; gap:8px; padding:13px 0; border-bottom:1px dashed #ffffff1c; font-size:13px; }
.pricing-plans .plan-rows li span { color:#bdc8d8; }
.pricing-plans .plan-rows li strong { white-space:nowrap; }
.pricing-plans .plan-hot { color:#ff9a4b; }
.pricing-plans .plan-summary { margin-top:auto; padding:16px 8px; border-radius:14px; background:#ffffff06; text-align:center; }
.pricing-plans .plan-summary small { display:block; color:#b9c6d8; font-size:11px; }
.pricing-plans .plan-summary strong { display:block; color:#ff9a4b; font-size:23px; margin-top:4px; }
.pricing-plans .plan-action { display:block; text-align:center; text-decoration:none; font-size:14px; font-weight:800; margin-top:16px; padding:15px 8px; border-radius:13px; border:1px solid #ffffff20; background:#272732; color:#fff; transition:background .2s; }
.pricing-plans .plan-action:hover { background:#373743; }
.pricing-plans .plan-featured .plan-action, .pricing-plans .tone-premium .plan-action { background:linear-gradient(100deg,#ff6c22,#e63e00); border-color:#ff7a41; }
.pricing-plans .plans-note { margin:24px auto 0; max-width:760px; color:#9494a5; text-align:center; font-size:12px; line-height:1.8; word-break:keep-all; }
@media(max-width:1000px) { .pricing-plans .plans-grid {grid-template-columns:repeat(2,minmax(0,1fr));} }
@media(max-width:560px) { .pricing-plans {padding:48px 16px 32px;} .pricing-plans .plans-grid {grid-template-columns:1fr;} .pricing-plans .plans-heading {padding-bottom:30px;} }
@media(prefers-reduced-motion:reduce) { .pricing-plans .plan-option, .pricing-plans .plan-action {transition:none;} }
/* 업그레이드 화면처럼 카드가 4개보다 적으면 가운데 정렬 */
.pricing-plans .plans-grid.plans-fit { display:flex; flex-wrap:wrap; justify-content:center; }
.pricing-plans .plans-grid.plans-fit > .plan-option { flex:0 1 calc((100% - 60px) / 4); min-width:240px; }
@media(max-width:560px) { .pricing-plans .plans-grid.plans-fit > .plan-option { flex-basis:100%; } }


.pricing-plans .plan-rows .plan-open-event { align-items:center; justify-content:flex-start; gap:8px; }
.pricing-plans .plan-open-event .plan-event-badge { flex-shrink:0; padding:3px 7px; border-radius:5px; background:#ff702e22; border:1px solid #ff975b77; color:#ffc09a; font-size:10px; line-height:1.5; font-weight:800; }
.pricing-plans .plan-open-event strong { font-size:12px; color:#eef2f8; }
.pricing-plans .plan-item-label { display:inline-flex; align-items:center; gap:6px; }
.pricing-plans .plan-help { display:inline-grid; place-items:center; flex:0 0 17px; width:17px; height:17px; padding:0; border:1px solid #aab6c499; border-radius:50%; background:transparent; color:#cbd5e1; font:600 11px/1 system-ui,sans-serif; cursor:help; vertical-align:middle; }
.pricing-plans .plan-help::before { content:'?'; }
.pricing-plans .plan-help:hover,.pricing-plans .plan-help:focus-visible { color:#ffcfb4; border-color:#ffa575; outline:2px solid #ff965533; outline-offset:2px; }
.plan-help-tooltip { box-sizing:border-box; position:fixed; z-index:2000; width:max-content; max-width:min(300px,calc(100vw - 24px)); padding:12px 14px; border:1px solid #6c788c; border-radius:10px; background:#151c28; color:#eef2f8; box-shadow:0 8px 28px #0006; font:13px/1.8 system-ui,sans-serif; text-align:left; word-break:keep-all; overflow-wrap:anywhere; pointer-events:none; }
.plan-help-tooltip[hidden] { display:none; }
/* Member upgrade page follows the selected light appearance; public pricing stays unchanged. */
html[data-appearance="light"] .member-workspace .pricing-plans { color:#24201b; }
html[data-appearance="light"] .member-workspace .pricing-plans .plans-heading h2 { color:#24201b; }
html[data-appearance="light"] .member-workspace .pricing-plans .plans-heading p { color:#675e51; }
html[data-appearance="light"] .member-workspace .pricing-plans .plans-kicker { color:#a13223; background:#b3241c09; border-color:#b3241c44; }
html[data-appearance="light"] .member-workspace .pricing-plans .plans-perks span { background:#f7f2e5; color:#514638; border-color:#cdbd99; }
html[data-appearance="light"] .member-workspace .pricing-plans .plan-option { background:#fbf7ed; border-color:#c5b590; box-shadow:0 10px 26px #65513418; }
html[data-appearance="light"] .member-workspace .pricing-plans .plan-option:hover { border-color:#a8761f; }
html[data-appearance="light"] .member-workspace .pricing-plans .plan-featured { border-color:#b98513; box-shadow:0 10px 28px #a8761f20; }
html[data-appearance="light"] .member-workspace .pricing-plans :is(.plan-amount small,.plan-amount > span,.plan-rows li span,.plan-summary small) { color:#675e51; }
html[data-appearance="light"] .member-workspace .pricing-plans .plan-rows li { border-color:#9c7f4538; }
html[data-appearance="light"] .member-workspace .pricing-plans :is(.plan-hot,.plan-summary strong) { color:#b13b19; }
html[data-appearance="light"] .member-workspace .pricing-plans .plan-summary { background:#ede4d2; }
html[data-appearance="light"] .member-workspace .pricing-plans .plan-action { background:#e7decc; border-color:#cbbd9e; color:#392d22; }
html[data-appearance="light"] .member-workspace .pricing-plans .plan-action:hover { background:#dccdb2; }
html[data-appearance="light"] .member-workspace .pricing-plans :is(.plan-featured,.tone-premium) .plan-action { background:linear-gradient(100deg,#bd3c24,#a82a1d); border-color:#a82a1d; color:#fff; }
html[data-appearance="light"] .member-workspace .pricing-plans :is(.plan-featured,.tone-premium) .plan-action:hover { background:#94261b; }
html[data-appearance="light"] .member-workspace .pricing-plans .plans-note { color:#675e51; }
html[data-appearance="light"] .member-workspace .pricing-plans .plan-open-event .plan-event-badge { background:#b3241c0c; border-color:#b3241c55; color:#9e3222; }
html[data-appearance="light"] .member-workspace .pricing-plans .plan-open-event strong { color:#392d22; }
html[data-appearance="light"] .member-workspace .pricing-plans .plan-help { color:#675e51; border-color:#8d806b; }
html[data-appearance="light"] .member-workspace .pricing-plans .plan-help:hover,
html[data-appearance="light"] .member-workspace .pricing-plans .plan-help:focus-visible { color:#a13223; border-color:#a13223; outline-color:#b3241c33; }
html[data-appearance="light"] .member-workspace .plan-help-tooltip { background:#fffaf0; color:#392d22; border-color:#c5b590; box-shadow:0 8px 28px #65513430; }