/* 플레이픽 메인(포털) 전용 스타일 - 디자인 A: 팝 놀이터 */
body.pp-body{ background:#FFF6EC; color:#1F1A2E; font-family:'Noto Sans KR',-apple-system,'Apple SD Gothic Neo','Malgun Gothic',sans-serif; margin:0; min-height:100vh; overflow-x:hidden; }
.pp-wrap{ position:relative; max-width:560px; margin:0 auto; padding:20px 20px 32px; display:flex; flex-direction:column; gap:18px; box-sizing:border-box; }
.pp-blob{ position:absolute; border-radius:50%; z-index:0; pointer-events:none; }
.pp-blob.b1{ right:-70px; top:-60px; width:240px; height:240px; background:#C9F24B; }
.pp-blob.b2{ left:-90px; top:250px; width:200px; height:200px; background:#DAD8FF; }
.pp-wrap > *:not(.pp-blob){ position:relative; z-index:1; }
.pp-wrap a{ text-decoration:none; color:inherit; }

.pp-top{ display:flex; align-items:center; justify-content:space-between; }
.pp-brand{ display:flex; align-items:center; gap:8px; }
.pp-logo{ width:34px; height:34px; border-radius:11px; background:#1F1A2E; display:flex; align-items:center; justify-content:center; }
.pp-name{ font-family:'Black Han Sans','Noto Sans KR',sans-serif; font-size:22px; letter-spacing:-0.01em; }
.pp-free{ font-size:12px; font-weight:700; background:#fff; border:1.5px solid #1F1A2E; border-radius:999px; padding:6px 12px; }

.pp-hero{ margin-top:14px; }
.pp-eyebrow{ margin:0 0 8px; font-size:13px; font-weight:800; color:#C23217; letter-spacing:0.04em; }
.pp-hero h1{ margin:0; font-family:'Black Han Sans','Noto Sans KR',sans-serif; font-size:44px; line-height:1.12; font-weight:400; letter-spacing:-0.01em; }
.pp-lede{ margin:14px 0 0; font-size:14.5px; line-height:1.7; color:#4A4560; }

.pp-nick{ background:#fff; border:2px solid #1F1A2E; border-radius:22px; padding:14px 14px 12px; box-shadow:4px 4px 0 #1F1A2E; display:flex; flex-direction:column; gap:10px; }
.pp-nick label{ font-size:13px; font-weight:800; }
.pp-nick label span{ font-weight:500; color:#5B5670; }
.pp-nick-row{ display:flex; gap:8px; }
.pp-nick input{ flex:1; min-width:0; height:44px; box-sizing:border-box; border:1.5px solid #CFC8DA; border-radius:14px; padding:0 14px; font-family:inherit; font-size:14px; color:#1F1A2E; background:#fff; }
.pp-nick input:focus{ outline:2px solid #6B5BD2; outline-offset:1px; }
.pp-nick button{ height:44px; padding:0 18px; border:0; border-radius:14px; background:#1F1A2E; color:#fff; font-family:inherit; font-weight:700; font-size:14px; cursor:pointer; }
.pp-nick small{ font-size:12px; color:#5B5670; }
.pp-hello{ display:none; align-items:center; justify-content:space-between; gap:10px; background:#fff; border:2px solid #1F1A2E; border-radius:22px; padding:14px 16px; box-shadow:4px 4px 0 #1F1A2E; font-size:15px; font-weight:800; }
.pp-hello b{ color:#C23217; }
.pp-hello button{ border:1.5px solid #1F1A2E; background:#fff; border-radius:999px; padding:6px 12px; font-family:inherit; font-size:12px; font-weight:700; cursor:pointer; color:#1F1A2E; }

.pp-cards{ display:flex; flex-direction:column; gap:12px; }
.pp-card{ display:flex; align-items:center; gap:14px; border-radius:26px; padding:20px 18px; border:2px solid #1F1A2E; box-shadow:4px 4px 0 #1F1A2E; transition:transform .12s ease, box-shadow .12s ease; }
a.pp-card:hover{ transform:translate(-2px,-2px); box-shadow:6px 6px 0 #1F1A2E; }
.pp-card.test{ background:#fff; color:#1F1A2E; }
.pp-card.game{ background:#fff; color:#1F1A2E; }
.pp-card.psy{ background:#D93A1C; color:#fff; padding:26px 20px; }
.pp-card.psy .pc-t{ font-size:28px; }
.pp-card.psy .pc-s{ font-size:14px; }
.pp-card.psy svg path,.pp-card.psy svg circle,.pp-card.psy svg rect,.pp-card.psy svg ellipse{ stroke:#fff; }
.pp-card.decide{ background:#fff; color:#1F1A2E; }
.pp-card.tool{ background:#fff; color:#1F1A2E; }
.pp-card .pc-body{ flex:1; min-width:0; }
.pp-card .pc-t{ font-family:'Black Han Sans','Noto Sans KR',sans-serif; font-size:24px; line-height:1.2; }
.pp-card .pc-s{ font-size:13px; margin-top:3px; }
.pp-card .pc-arrow{ font-size:22px; font-weight:800; }
.pp-card.soon{ background:transparent; border:2px dashed #8E87A3; box-shadow:none; color:#5B5670; padding:18px; }
.pp-card.soon .pc-t{ font-size:20px; }
.pp-soon-tag{ font-size:12px; font-weight:800; border:1.5px solid #5B5670; border-radius:999px; padding:4px 10px; }

.pp-h{ font-size:15px; font-weight:800; margin:0 0 10px; }
.pp-chips{ display:flex; flex-wrap:wrap; gap:8px; }
.pp-chip{ background:#fff; border:1.5px solid #1F1A2E; border-radius:999px; padding:9px 14px; font-size:13px; font-weight:700; transition:transform .1s ease; }
.pp-chip:hover{ transform:translateY(-2px); background:#FFF; }

.pp-challenge{ background:#DAD8FF; border:2px solid #1F1A2E; border-radius:22px; padding:16px 18px; display:flex; align-items:center; gap:12px; }
.pp-challenge .ch-body{ flex:1; }
.pp-challenge .ch-k{ font-size:12px; font-weight:800; color:#4B3FB0; }
.pp-challenge .ch-t{ font-size:16px; font-weight:800; margin-top:2px; }
.pp-challenge .ch-go{ background:#1F1A2E; color:#fff; border-radius:999px; padding:9px 16px; font-size:13px; font-weight:700; }

.pp-about{ background:rgba(255,255,255,.7); border:1.5px solid #E3DAE9; border-radius:22px; padding:18px; }
.pp-about h2{ font-size:15px; margin:0 0 6px; }
.pp-about p{ font-size:13.5px; line-height:1.75; color:#4A4560; margin:0 0 12px; }
.pp-about p:last-child{ margin-bottom:0; }
.pp-about a{ color:#C23217; text-decoration:underline; }

.pp-foot{ text-align:center; font-size:12px; color:#5B5670; line-height:1.9; }
.pp-foot a:hover{ text-decoration:underline; }

@media (min-width:860px){
  .pp-wrap{ max-width:980px; padding:28px 32px 40px; }
  .pp-hero h1{ font-size:64px; }
  .pp-lede{ font-size:17px; }
  .pp-cards{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
  .pp-card.soon{ grid-column:1 / -1; }
  .pp-cards .pp-card:first-child{ grid-column:1 / -1; }
  .pp-nick, .pp-hello{ max-width:520px; }
}
@media (max-width:380px){ .pp-hero h1{ font-size:38px; } }

.pp-blobs{ position:fixed; inset:0; overflow:hidden; pointer-events:none; z-index:0; }
.pp-blobs .pp-blob{ position:absolute; }
.pp-req{ background:#fff; }
.pp-req .ch-k{ color:#D93A1C; }
.pp-req .ch-go{ background:#C9F24B; color:#1F1A2E; border:2px solid #1F1A2E; }

/* 균등 카드 */
.pp-mini{ display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:4px; }
.pp-card.mini{ position:relative; flex-direction:column; align-items:flex-start; gap:6px; padding:16px 15px 15px; border-radius:22px; background:#fff !important; color:#1F1A2E !important; }
.pp-card.mini .pc-ic{ width:56px; height:56px; border-radius:50%; border:2px solid #1F1A2E; display:flex; align-items:center; justify-content:center; margin-bottom:4px; }
.pp-card.mini .pc-t{ font-size:19px; margin-top:2px; }
.pp-card.mini .pc-s{ font-size:12px; line-height:1.35; color:#4B4560; margin-top:0; }
.pp-card.mini svg path,.pp-card.mini svg circle,.pp-card.mini svg rect{ stroke:#1F1A2E; }
.pc-new{ position:absolute; top:14px; right:14px; background:#C9F24B; color:#1F1A2E; border:2px solid #1F1A2E; border-radius:99px; font-size:11px; font-weight:800; padding:2px 8px; }
.pp-mini + .pp-req{ margin-top:12px; }
@media (min-width:720px){ .pp-mini{ grid-template-columns:repeat(3,1fr); gap:16px; } }
