/* ParkOn 디자인 시스템 — 하늘색+파란색. 시니어 친화 큰 글씨.
   의미 색(언더=남색, 오버=빨강)과 카카오 브랜드 노랑(#FEE500)은 유지. */
:root{
  --brand:#1587dd; --brand-dk:#0b5fa8; --brand-sky:#47b7f8;
  --brand-bg:#e8f4fd; --brand-bg2:#d2eafc; --brand-sel:#f1f8fe;
  --ink:#16222b; --paper:#ffffff;
  --line:#e4ecf3; --gray:#64707a; --card:#ffffff;
  --shadow:0 1px 2px rgba(16,35,50,.04), 0 3px 10px rgba(16,35,50,.05);
  --par:#5b6470; --under:#0b3f86; --under2:#082c5e; --over:#e23b3b; --over2:#b71c1c;
}
*{box-sizing:border-box; -webkit-tap-highlight-color:transparent; font-weight:normal;}
/* 볼드는 사용자가 지정한 곳에만 — 이 클래스로만 적용 */
.strong{font-weight:700;}
body{margin:0; background:#eef1f4; font-family:-apple-system,"Malgun Gothic","Apple SD Gothic Neo",sans-serif; color:var(--ink);}
.wrap{max-width:430px; margin:0 auto; min-height:100vh; background:var(--paper);
  border-left:1px solid #e4e9ee; border-right:1px solid #e4e9ee; box-shadow:0 0 20px rgba(15,30,45,.05);}

header.top{background:var(--brand); padding:13px 18px; box-shadow:0 1px 6px rgba(11,95,168,.25); position:sticky; top:0; z-index:20;
  display:flex; align-items:center; justify-content:space-between;}
header.top .ttl{ font-size:20px; color:#fff;}
header.top .ttl a{color:#fff;}

.center-page{padding:48px 24px; text-align:center;}
.logo{font-size:32px; margin-top:40px;}
h1{font-size:26px; margin:8px 0 6px;}
.sub{color:var(--gray); font-size:17px; line-height:1.5; margin-bottom:32px;}
.notice{color:var(--gray); font-size:14px; margin:20px 0 8px;}
.error{background:#ffecec; border:1px solid #f3b0b0; color:#b71c1c; font-size:16px; border-radius:12px; padding:12px;}

.kakao-btn{display:flex; align-items:center; justify-content:center; gap:8px;
  background:#FEE500; color:#191919; text-decoration:none;
  font-size:20px; padding:18px; border-radius:14px; box-shadow:var(--shadow);}
.kakao-btn:active{transform:scale(.98);}

.primary-btn{width:100%; border:none; background:var(--brand); color:#fff;
  font-size:19px; padding:16px; border-radius:14px; cursor:pointer;
  box-shadow:0 2px 6px rgba(21,135,221,.28);}
.primary-btn:active{transform:scale(.98);}
.ghost-btn{border:1px solid var(--line); background:#fff; color:var(--gray);
  font-size:16px; padding:12px 24px; border-radius:12px; cursor:pointer;}

.phone-form input, .dev-login input{width:100%; font-size:24px; text-align:center;
  padding:16px; border:1px solid var(--line); border-radius:14px; margin-bottom:14px; outline:none; background:#fff;}
.phone-form input:focus{border-color:var(--brand);}
.dev-login{margin-top:40px; border-top:1px dashed var(--line); padding-top:8px;}
.dev-login input{font-size:17px;}
.dev-login button{border:1px solid var(--line); background:#fff; font-size:16px;
  padding:12px 20px; border-radius:12px; cursor:pointer; color:var(--gray);}

/* 공통 페이지 */
.page{padding:16px 18px 40px;}
h2.sec{font-size:16px; color:var(--gray); margin:24px 2px 10px; letter-spacing:.02em;}
.muted{color:var(--gray);}
.back{text-decoration:none; color:inherit; margin-right:6px;}
.primary-btn:disabled{background:#eef1f4; color:#9aa8b3; cursor:default; box-shadow:none;}
.primary-btn.small{width:auto; font-size:17px; padding:14px 18px;}
.ghost-btn.small{font-size:17px; padding:14px 18px;}
.linkbtn{display:block; text-align:center; text-decoration:none; margin-top:14px;}

/* 선택 카드 (구장·코스 등) */
.pick{display:block; width:100%; text-align:left; background:var(--card); border:1px solid var(--line);
  border-radius:14px; padding:15px 16px; margin-bottom:10px; font-size:18px; cursor:pointer;
  box-shadow:var(--shadow);}
.pick .sub{display:block; font-size:15px; color:var(--gray); margin-top:4px;}
.pick input[type=radio]{display:none;}
.pick:has(input:checked){border-color:var(--brand); background:var(--brand-sel);}
.pick.linklike{text-decoration:none; color:inherit;}

/* 팀원 목록 */
.players{display:flex; flex-direction:column; gap:10px; margin:12px 0 4px;}
.prow{display:flex; align-items:center; gap:10px; background:var(--card); border:1px solid var(--line);
  border-radius:14px; padding:12px 14px; box-shadow:var(--shadow);}
.prow .n{width:34px; height:34px; flex:0 0 34px; border-radius:50%; background:var(--brand); color:#fff;
  display:flex; align-items:center; justify-content:center;}
.prow .pname{flex:1; font-size:19px;}
.prow .rm{border:1px solid var(--line); background:#fff; border-radius:10px; font-size:18px; width:38px; height:38px;
  cursor:pointer; color:var(--gray);}
.badge{font-size:13px; padding:4px 10px; border-radius:999px; white-space:nowrap;}
.b-lead{background:var(--brand-bg); color:var(--brand-dk); border:1px solid var(--brand);}
.b-ok{background:#e8f6e8; color:#1b7a2e;}
.b-wait{background:#fff; border:1px solid var(--line); color:var(--gray);}
.b-guest{background:#fff; border:1px solid var(--line); color:#5b6470;}

/* 초대/입력 폼 */
.inline-form{display:flex; gap:8px;}
.inline-form input{flex:1; font-size:19px; padding:14px; border:1px solid var(--line);
  border-radius:14px; outline:none; min-width:0; background:#fff;}
.inline-form input:focus{border-color:var(--brand);}

/* ---- 스코어 기록 ---- */
.syncdot{font-size:13px; padding:5px 11px; border-radius:999px;}
.syncdot.ok{background:#fff; color:var(--brand-dk);}
.syncdot.wait{background:#fff; color:var(--over);}

.holehead{background:#fff; border:1px solid var(--line); border-radius:14px; padding:9px 14px; box-shadow:var(--shadow); margin-bottom:9px;}
.holehead .row{display:flex; align-items:baseline; justify-content:space-between;}
.holehead .hno{font-size:23px;}
.holehead .meta{font-size:16px; color:var(--brand-dk);}
.progress{height:8px; background:#edf0f3; border-radius:999px; margin-top:7px; overflow:hidden;}
.progress > i{display:block; height:100%; background:var(--brand); border-radius:999px; transition:.25s;}

.pcard{background:var(--card); border:1px solid var(--line); border-radius:14px; padding:8px 10px 10px; margin-bottom:9px; box-shadow:var(--shadow);}
.pc-top{display:flex; align-items:center; justify-content:space-between; margin-bottom:6px;}
.pc-top .name{font-size:17px; display:flex; align-items:center; gap:7px; min-width:0;}
.pc-top .name .n{width:26px; height:26px; flex:0 0 26px; border-radius:50%; background:var(--brand); color:#fff;
  display:flex; align-items:center; justify-content:center; font-size:14px;}
.sbadge{font-size:12px; color:#fff; padding:3px 9px; border-radius:999px; background:var(--par); white-space:nowrap;}
.pc-sum{font-size:13px; color:var(--gray); white-space:nowrap; display:flex; align-items:center; gap:6px;}
.pc-sum b{font-size:18px; color:var(--ink);}
.pc-sum .gap{font-size:12px; padding:2px 8px; border-radius:999px; background:#fff; border:1px solid var(--line);}
.pc-ctrl{display:flex; align-items:center; gap:8px;}
.step{width:56px; height:56px; flex:0 0 56px; border-radius:15px; border:none; font-size:30px; cursor:pointer; box-shadow:var(--shadow); display:flex; align-items:center; justify-content:center;}
.step.minus{background:#fff; border:1px solid var(--line); color:#46545f;}
.step.plus{background:var(--brand); color:#fff;}
.step:active{transform:scale(.94);}
.num{flex:1; text-align:center;}
.num .big{font-size:38px; line-height:1;}
.num .pen{font-size:11px; color:var(--over); min-height:13px;}
.ob2{flex:0 0 60px; height:56px; border:2px solid var(--over); color:var(--over); background:#fff; font-size:15px; line-height:1.05; border-radius:14px; cursor:pointer; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1px;}
.ob2:active{background:#ffecec;}
.ob2 .cnt{background:var(--over); color:#fff; border-radius:999px; padding:0 7px; font-size:11px;}
.gaplead{color:var(--brand-dk);} .gapo{color:var(--over);} .gapu{color:var(--under);}

.holenav{display:flex; gap:10px; align-items:stretch; margin-top:4px;}
.navbtn{border:none; border-radius:16px; cursor:pointer; box-shadow:var(--shadow);}
.navbtn.prev{background:#fff; border:1px solid var(--line); color:#46545f; font-size:17px; padding:16px 14px; flex:0 0 96px;}
.navbtn.next{background:var(--brand); color:#fff; font-size:21px; padding:16px; flex:1;}
.navbtn:active{transform:scale(.98);}
.linkbtn2{display:flex; align-items:center; justify-content:center; text-decoration:none;}
.runsum{display:flex; justify-content:space-around; background:#fff; border:1px solid var(--line); border-radius:14px; padding:10px; margin-top:12px; box-shadow:var(--shadow);}
.runsum div{text-align:center;} .runsum .k{font-size:13px; color:var(--gray);} .runsum .v{font-size:22px;}

.stboard{background:#fff; border:1px solid var(--line); border-radius:16px; padding:10px 10px 12px; margin-top:14px; box-shadow:var(--shadow);}
.stbhead{display:flex; justify-content:space-between; align-items:center; gap:8px; margin:2px 2px 8px;}
.stbtitle{font-size:15px;}
.stbtitle span{ color:var(--gray); font-size:13px;}
.standings{display:flex; gap:8px; overflow-x:auto; padding-bottom:2px;}
.stchip{flex:0 0 auto; min-width:96px; text-align:center; border:1px solid var(--line); border-radius:14px; padding:8px 10px; background:#fff;}
.stchip.lead{border-color:var(--brand); background:var(--brand-bg);}
.stchip.mine{box-shadow:0 0 0 2px var(--brand) inset;}
.stchip .rk{font-size:12px; color:var(--gray);}
.stchip .nm{font-size:15px; margin:2px 0 1px; white-space:nowrap;}
.stchip .tm{font-size:11px; color:var(--brand-dk); white-space:nowrap;}
.stchip .tt{font-size:24px; line-height:1.1;}
.stchip .gp{font-size:13px; margin-top:1px;}
.sctoggle{display:flex; gap:4px;}
.scbtn{border:1px solid var(--line); background:#fff; border-radius:999px; font-size:12px; padding:5px 11px; cursor:pointer; color:var(--gray);}
.scbtn.on{border-color:var(--brand); background:var(--brand-bg); color:var(--ink);}

table.sc{width:100%; border-collapse:collapse; font-size:15px; background:#fff; border-radius:14px; overflow:hidden; box-shadow:var(--shadow);}
table.sc th, table.sc td{padding:9px 4px; text-align:center; border-bottom:1px solid var(--line);}
table.sc th{background:#fff; font-size:13px; border-bottom:2px solid var(--line);}
table.sc td.name{text-align:left; padding-left:10px; white-space:nowrap;}
table.sc td.tot{ font-size:17px; background:var(--brand-sel);}
.rank1{color:var(--brand-dk);}
.cellu{color:var(--under);} .cello{color:var(--over);}
.foot{font-size:12px; color:var(--gray); text-align:center; margin-top:14px;}

.toast{position:fixed; bottom:60px; left:50%; transform:translateX(-50%); background:#1d2935; color:#fff; padding:12px 18px; border-radius:14px; font-size:15px; opacity:0; transition:.25s; z-index:50; max-width:90%; pointer-events:none;}
.toast.show{opacity:1;}

/* 홈 승인 카드 */
.invite-card{background:var(--brand-bg); border:1px solid var(--brand);
  border-radius:16px; padding:16px; margin-bottom:16px; box-shadow:var(--shadow);}
.invite-msg{font-size:19px; line-height:1.5; margin:0 0 12px;}
.invite-actions{display:flex; gap:10px;}
.invite-actions form{flex:1;}
.invite-actions .primary-btn, .invite-actions .ghost-btn{width:100%;}

/* ---- 관리자 ---- */
.flabel{font-size:14px; color:var(--gray); display:block; margin:10px 2px 4px;}
.req{color:var(--over);}
.field{width:100%; font-size:17px; padding:12px; border:1px solid var(--line); border-radius:12px;
  background:#fff; outline:none; font-family:inherit; color:var(--ink);}
.field:focus{border-color:var(--brand);}
select.field{appearance:auto;}
textarea.field{resize:vertical;}
.two-col{display:flex; gap:10px;}
.two-col > div{flex:1; min-width:0;}
.cellin{width:72px; font-size:16px; text-align:center; padding:8px 4px; border:1px solid var(--line);
  border-radius:8px; outline:none;}
.cellin:focus{border-color:var(--brand);}
.savedmsg{background:var(--brand-bg); border:1px solid var(--brand); color:var(--brand-dk);
  border-radius:12px; padding:10px 14px; font-size:15px;}
.notice-item{background:#fff; border:1px solid var(--line); border-radius:14px; padding:12px 14px;
  margin-bottom:10px; box-shadow:var(--shadow);}
.notice-item.inactive{opacity:.6;}
.notice-item summary{font-size:16px; cursor:pointer; display:flex; align-items:center; gap:8px; flex-wrap:wrap;}

/* 사용자 화면 공지 · 휴무 */
.unotice{background:#fff; border:1px solid var(--line); border-radius:14px; padding:12px 14px; margin-bottom:10px; box-shadow:var(--shadow);}
.unotice summary{font-size:16px; cursor:pointer; display:flex; align-items:center; gap:8px;}
.unotice p{font-size:15px; color:var(--gray); line-height:1.6; margin:10px 0 2px; white-space:pre-line;}
.b-closed{background:#ffecec; color:#b71c1c; border:1px solid #f3b0b0;}

/* Bootstrap Icons 정렬·순위 색상 */
.bi{vertical-align:-0.125em;}
.rk1{color:#d4a017;} .rk2{color:#8e9aa5;} .rk3{color:#b0793f;}

/* 홈 리디자인 */
.profile{display:flex; align-items:center; gap:12px; margin:6px 0 18px;}
.avatar{width:48px; height:48px; flex:0 0 48px; border-radius:50%; background:var(--brand-bg);
  color:var(--brand); display:flex; align-items:center; justify-content:center; font-size:24px;}
.profile .greet{font-size:21px; line-height:1.3;}
.profile .sub2{font-size:14px; color:var(--gray); margin-top:2px;}
.menu-row{display:flex; align-items:center; gap:12px; background:#fff; border:1px solid var(--line);
  border-radius:14px; padding:15px 16px; margin-bottom:10px; text-decoration:none; color:inherit;
  font-size:18px; box-shadow:var(--shadow);}
.menu-row .mi{width:36px; height:36px; flex:0 0 36px; border-radius:10px; background:var(--brand-bg);
  color:var(--brand); display:flex; align-items:center; justify-content:center; font-size:18px;}
.menu-row .chev{margin-left:auto; color:#b6c3cd; font-size:14px;}
.logout-link{display:block; text-align:center; margin-top:36px; color:var(--gray); font-size:15px;
  background:none; border:none; cursor:pointer; width:100%; text-decoration:underline; text-underline-offset:3px;}