/* 広場の会員（2026-09-29）。名前の色・会員の印・マイページ／花屋の入口・案内ページ。js/community-vip.js と組。 */
[hidden]{display:none!important}

/* ---- 名前の色と会員の印（どの画面でも） ---- */
.vipn.vipn--1{color:#d23a72!important}
.vipn.vipn--2{color:#7a45d8!important}
.vipn.vipn--3{color:#a86a00!important;text-shadow:0 0 .5px rgba(255,214,90,.9)}
.vipm{display:inline-block;width:15px;height:15px;vertical-align:-2px;margin:0 3px 0 1px;line-height:0;font-style:normal;flex:0 0 auto}
.vipm svg{display:block;width:100%;height:100%;overflow:visible}
.vipm--3{filter:drop-shadow(0 0 1.5px rgba(255,200,40,.75))}
.vip-toast{position:fixed;left:50%;bottom:calc(84px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:100000;max-width:calc(100% - 32px);
	background:#3a2a55;color:#fff;font-size:13px;font-weight:700;line-height:1.6;padding:10px 16px;border-radius:14px;box-shadow:0 6px 22px rgba(58,42,85,.3);transition:opacity .5s}
.vip-toast.is-out{opacity:0}

/* ---- マイページ ---- */
.vip-my{display:flex;align-items:center;gap:8px;margin:8px 0 0;padding:9px 11px;border-radius:12px;font-size:12.5px;line-height:1.5;text-decoration:none}
.vip-my .vipm{width:20px;height:20px;margin:0}
.vip-my--on{background:#fff;border:1.5px solid #f0dcea}
.vip-my--on.vip-my--3{border-color:#f1d27a;background:linear-gradient(135deg,#fffdf2,#fff6d8)}
.vip-my--on.vip-my--2{border-color:#dccbff;background:#faf6ff}
.vip-my__b{flex:1;min-width:0}
.vip-my__b b{display:block;color:#3a2a55;font-size:13px}
.vip-my__b small{color:#7a6b8f}
.vip-my--on a{color:#8b6cc1;font-weight:800;white-space:nowrap;text-decoration:none}
.vip-my--ad{background:linear-gradient(135deg,#fff3f8,#f5efff);border:1.5px dashed #e7c6dc;color:#6b4f8f;font-weight:700}
.vip-my--ad .vipm{width:16px;height:16px}
.vip-my--other{color:#6b5f7d;font-weight:700}

/* ---- 花屋の入口 ---- */
.vip-shop{display:flex;align-items:center;gap:10px;margin:0 0 12px;padding:12px 14px;border-radius:16px;text-decoration:none;
	background:linear-gradient(120deg,#fff0f6 0%,#f4ecff 55%,#fff7dc 100%);border:1.5px solid #ecd3ff;box-shadow:0 3px 12px rgba(139,108,193,.12)}
.vip-shop__mk{display:flex;gap:1px}
.vip-shop__mk .vipm{width:19px;height:19px;margin:0}
.vip-shop__t{flex:1;min-width:0}
.vip-shop__t b{display:block;font-size:14px;color:#3a2a55}
.vip-shop__t small{display:block;font-size:11.5px;color:#7a6b8f;line-height:1.5}
.vip-shop__go{font-size:20px;color:#8b6cc1;font-weight:900}

/* ---- 案内ページ ---- */
.vp{max-width:640px;margin:0 auto;padding:18px 16px 70px;color:#3a2a55}
.vp-hero{text-align:center;margin:4px 0 18px}
.vp-eye{font-size:10.5px;font-weight:900;letter-spacing:.24em;color:#c88a10;margin:0 0 4px}
.vp-h{font-size:24px;font-weight:900;margin:0 0 8px;background:linear-gradient(90deg,#d23a72,#7a45d8 55%,#b67a00);-webkit-background-clip:text;background-clip:text;color:transparent}
.vp-lead{font-size:13px;line-height:1.95;color:#6b5f7d;margin:0}
.vp-lead small{color:#8e82a0}
.vp-soon{margin:12px auto 0;display:inline-block;font-size:12.5px;font-weight:800;color:#8a5a00;background:#fff6d8;border:1px solid #f1d27a;border-radius:10px;padding:8px 12px}

.vp-cards{display:grid;grid-template-columns:1fr;gap:12px;margin:0 0 8px}
@media (min-width:600px){.vp-cards{grid-template-columns:repeat(3,1fr)}}
.vp-card{position:relative;background:#fff;border:1.5px solid #f0dcea;border-radius:18px;padding:14px 14px 14px;display:flex;flex-direction:column}
.vp-card--bouquet{border-color:#f7c6d8;background:linear-gradient(180deg,#fff7fa,#fff 60%)}
.vp-card--tiara{border-color:#d9c6ff;background:linear-gradient(180deg,#f7f2ff,#fff 60%);box-shadow:0 4px 16px rgba(122,69,216,.12)}
.vp-card--crown{border-color:#efd07a;background:linear-gradient(180deg,#fffaea,#fff 60%)}
.vp-card__pop{position:absolute;top:-9px;right:12px;font-size:10.5px;font-weight:900;color:#fff;background:#7a45d8;border-radius:999px;padding:3px 10px}
.vp-card__hd{display:flex;align-items:center;gap:10px}
.vp-card__mk{display:block;width:34px;height:34px;flex:0 0 auto}
.vp-card__mk svg{width:100%;height:100%;display:block}
.vp-card__en{font-size:10px;font-weight:900;letter-spacing:.2em;color:#b09bc6;margin:0}
.vp-card__n{font-size:17px;font-weight:900;margin:0;line-height:1.3}
.vp-card--bouquet .vp-card__n{color:#d23a72}.vp-card--tiara .vp-card__n{color:#7a45d8}.vp-card--crown .vp-card__n{color:#a86a00}
.vp-card__yen{margin:8px 0 6px;font-size:13px;color:#6b5f7d}
.vp-card__yen b{font-size:28px;font-weight:900;color:#3a2a55;letter-spacing:.01em}
.vp-card__yen small{font-size:11px;margin-left:3px}
.vp-card__demo{display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.8);border:1px dashed #eadcf2;border-radius:12px;padding:6px 8px;margin:0 0 8px}
.vp-card__av{position:relative;width:38px;height:38px;flex:0 0 auto}
.vp-card__av img{position:absolute;inset:4px;width:30px;height:30px;border-radius:50%;object-fit:cover}
.vp-card__av .vp-card__fr{inset:0;width:38px;height:38px;border-radius:0}
.vp-card__nm{font-size:13.5px;font-weight:900;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vp-card__ul{list-style:none;margin:0 0 12px;padding:0;font-size:12.5px;line-height:1.6;color:#4a3d63;flex:1}
.vp-card__ul li{position:relative;padding:3px 0 3px 18px}
.vp-card__ul li::before{content:"";position:absolute;left:2px;top:9px;width:9px;height:5px;border-left:2px solid #8b6cc1;border-bottom:2px solid #8b6cc1;transform:rotate(-45deg)}
.vp-card__ul small{color:#a08fb5;font-weight:400}

.vp-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;padding:10px 18px;border:0;border-radius:999px;font:inherit;font-size:14px;font-weight:900;color:#fff;cursor:pointer;text-decoration:none;
	background:linear-gradient(135deg,#d65c9a,#8b6cc1);box-shadow:0 3px 10px rgba(139,108,193,.25)}
.vp-card .vp-btn{width:100%}
.vp-btn--bouquet{background:linear-gradient(135deg,#f07aa3,#d23a72)}
.vp-btn--tiara{background:linear-gradient(135deg,#a07af0,#6a3fc4)}
.vp-btn--crown{background:linear-gradient(135deg,#f3c648,#c68500);color:#3a2400}
.vp-btn[disabled]{background:#e7e1ee;color:#9a8fab;box-shadow:none;cursor:default}
.vp-btn--ghost{background:#fff;color:#7a45d8;border:1.5px solid #d9c6ff;box-shadow:none}
.vp-btn--sm{min-height:40px;font-size:12.5px;padding:8px 14px}
.vp-btn--cancel{color:#8b3a4f;border-color:#efc9d3}
.vp-btn--go{width:100%;margin:12px 0 8px;min-height:50px;font-size:15px}

.vp-sec{font-size:12px;font-weight:900;letter-spacing:.14em;color:#c88a10;margin:26px 0 10px;padding-bottom:6px;border-bottom:1px solid #f2dcea}
.vp-tblwrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1.5px solid #f0dcea;border-radius:14px;background:#fff}
.vp-tbl{width:100%;border-collapse:collapse;font-size:12.5px;min-width:330px}
.vp-tbl th,.vp-tbl td{padding:9px 8px;border-bottom:1px solid #f5e8f0;text-align:center}
.vp-tbl thead th{font-size:12.5px;color:#3a2a55;background:#fbf6ff}
.vp-tbl tbody th{text-align:left;color:#6b5f7d;font-weight:700;white-space:nowrap}
.vp-tbl tr:last-child th,.vp-tbl tr:last-child td{border-bottom:0}
.vp-tbl .vipn{font-weight:900}
.vp-note{font-size:11.8px;line-height:1.85;color:#7a6b8f;margin:8px 2px 0}
.vp-note--ng{background:#f7f4fb;border-radius:10px;padding:9px 11px;color:#5c4f73}
.vp-dl{margin:0;font-size:12.8px;line-height:1.85}
.vp-dl dt{font-weight:900;color:#3a2a55;margin:10px 0 2px}
.vp-dl dd{margin:0;color:#6b5f7d}
.vp-steps{margin:0;padding:0 0 0 20px;font-size:13px;line-height:1.9;color:#4a3d63}
.vp-steps b{color:#c0418a}
.vp-faq details{background:#fff;border:1.5px solid #f0dcea;border-radius:12px;margin:0 0 8px;padding:0 12px}
.vp-faq summary{cursor:pointer;font-size:13px;font-weight:800;padding:11px 0;color:#3a2a55;list-style:none}
.vp-faq summary::-webkit-details-marker{display:none}
.vp-faq summary::after{content:"＋";float:right;color:#b09bc6}
.vp-faq details[open] summary::after{content:"－"}
.vp-faq p{margin:0 0 12px;font-size:12.5px;line-height:1.9;color:#6b5f7d}
.vp-legal{text-align:center;font-size:12px;margin:24px 0 0}
.vp-legal a{color:#8b6cc1}

.vp-mine{background:#fff;border:1.5px solid #e6d5ff;border-radius:18px;padding:14px;margin:0 0 16px;box-shadow:0 3px 14px rgba(122,69,216,.08)}
.vp-mine__k{font-size:11px;font-weight:900;letter-spacing:.14em;color:#b09bc6;margin:0 0 6px}
.vp-mine__hd{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.vp-mine__hd .vipm{width:24px;height:24px;margin:0}
.vp-mine__hd b{font-size:17px}
.vp-mine__hd span{font-size:12px;color:#7a6b8f}
.vp-mine__p{font-size:12.8px;line-height:1.8;color:#5c4f73;margin:8px 0 0}
.vp-mine__warn{font-size:12.5px;line-height:1.8;color:#8b3a4f;background:#fff1f4;border:1px solid #f3c9d3;border-radius:10px;padding:8px 10px;margin:10px 0 0}
.vp-mine__tk{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;margin:10px 0 0;padding:9px 10px;background:#fbf6ff;border-radius:12px;font-size:12.5px;font-weight:700;color:#5c4f73}
.vp-mine__btns{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 0}

.vp-sheet{position:fixed;inset:0;z-index:100001;background:rgba(40,28,62,.5);display:flex;align-items:flex-end;justify-content:center}
.vp-sheet__in{background:#fff;width:100%;max-width:560px;max-height:calc(100% - 24px - env(safe-area-inset-top,0px));overflow:auto;border-radius:20px 20px 0 0;padding:16px 16px calc(16px + env(safe-area-inset-bottom,0px));outline:none}
@media (min-width:600px){.vp-sheet{align-items:center}.vp-sheet__in{border-radius:20px}}
.vp-sheet__k{font-size:11px;font-weight:900;letter-spacing:.14em;color:#c88a10;margin:0 0 3px}
.vp-sheet__h{font-size:17px;font-weight:900;margin:0 0 10px;color:#3a2a55}
.vp-conf{width:100%;border-collapse:collapse;font-size:12.3px;line-height:1.7}
.vp-conf th{width:6.2em;text-align:left;vertical-align:top;color:#7a6b8f;font-weight:700;padding:7px 8px 7px 0;border-bottom:1px solid #f3e8f0}
.vp-conf td{padding:7px 0;border-bottom:1px solid #f3e8f0;color:#3a2a55}
.vp-conf b{color:#c0418a}
.vp-agree{display:flex;gap:8px;align-items:flex-start;margin:12px 0 0;font-size:13px;font-weight:800;line-height:1.6;color:#3a2a55;cursor:pointer}
.vp-agree input{width:20px;height:20px;flex:0 0 auto;margin:1px 0 0;accent-color:#7a45d8}
.vp-sheet__in .vp-btn--ghost{width:100%}
.vp-sheet__s{font-size:11.5px;color:#8e82a0;line-height:1.7;margin:10px 0 0}
html.vp-lock,html.vp-lock body{overflow:hidden}

.vp-mock{background:#fff8e1;border:2px dashed #e6b800;border-radius:14px;padding:12px;margin:0 0 16px}
.vp-mock__k{font-size:11.5px;font-weight:900;color:#8a5a00;margin:0 0 8px}
.vp-mock__t{font-size:14px;font-weight:900;margin:0 0 10px}
.vp-mock__g{display:flex;flex-wrap:wrap;gap:6px}
