/* 법도 진행관리 — 공통 스타일 (다크 네이비 + 골드, 목업 v0.7 이식) */
@property --ang{ syntax:'<angle>'; initial-value:0deg; inherits:false; }
.rbl, .rbl *{ box-sizing:border-box; }
.rbl{
  padding:48px 16px 90px; color:#ECE7DA;
  font-family:'Pretendard Variable',-apple-system,sans-serif; letter-spacing:-.01em;
  background:
    radial-gradient(900px 520px at 12% -6%, rgba(201,169,97,.16), transparent 56%),
    radial-gradient(760px 520px at 108% 6%, rgba(30,58,138,.38), transparent 54%),
    linear-gradient(164deg,#0A1830,#0b1426 44%,#0c1220);
}
body.rbl{ margin:0; min-height:100vh; background-attachment:fixed; }
/* 사이트 헤더/푸터 안에 임베드될 때(진행조회 마이페이지) */
.rbl-embed{ padding:36px 16px 64px; }
.rbl .wrap{ max-width:760px; margin:0 auto; }
.rbl .serif{ font-family:'Playfair Display',serif; }
.rbl .gold{ background:linear-gradient(92deg,#F5E6B8,#C9A961 44%,#D4AF37); -webkit-background-clip:text; background-clip:text; color:transparent; }
.rbl .muted{ color:rgba(236,231,218,.55); }
.rbl .small{ font-size:12px; }
.rbl a{ color:#F5E6B8; }

@keyframes fadeUp{ from{ opacity:0; transform:translateY(26px);} }
@keyframes boxIn{ from{ opacity:0; transform:translateY(20px) scale(.97);} }
@keyframes rot{ to{ --ang:360deg; } }
@keyframes pulse{ 0%{box-shadow:0 0 0 0 rgba(212,175,55,.5);} 70%{box-shadow:0 0 0 13px rgba(212,175,55,0);} 100%{box-shadow:0 0 0 0 rgba(212,175,55,0);} }
@keyframes sheen{ from{ transform:translateX(-130%) skewX(-12deg);} to{ transform:translateX(360%) skewX(-12deg);} }
@keyframes float{ 0%,100%{transform:translateY(0);} 50%{transform:translateY(-5px);} }
.rbl .reveal{ animation:fadeUp .8s cubic-bezier(.2,.7,.2,1) both; }

.rbl .page-head{ text-align:center; margin-bottom:30px; }
.rbl .brand-sub{ font-size:14px; letter-spacing:.1em; color:#C9A961; font-weight:500; margin:0 0 5px; }
.rbl .page-head h1{ font-size:40px; margin:0; font-weight:700; line-height:1.05; }
.rbl .page-head .sub{ margin:9px 0 0; color:rgba(236,231,218,.6); font-size:14px; }
.rbl .backlink{ display:inline-block; margin-bottom:16px; color:#C9A961; text-decoration:none; font-size:13px; }

.rbl .glass{ position:relative; background:rgba(255,255,255,.04); border:1px solid rgba(201,169,97,.22); border-radius:20px;
  padding:24px 24px; margin-bottom:20px; box-shadow:0 22px 60px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.06); }
.rbl .glass::after{ content:''; position:absolute; inset:0 0 auto; height:1px; background:linear-gradient(90deg,transparent,rgba(245,230,184,.5),transparent); }
.rbl .sec{ font-size:16px; font-weight:600; margin:0 0 16px; color:#F5E6B8; }

.rbl .flabel{ display:block; font-size:12px; color:rgba(236,231,218,.6); margin-bottom:6px; }
.rbl .field{ width:100%; font:inherit; color:#ECE7DA; background:rgba(255,255,255,.05); border:1px solid rgba(201,169,97,.28); border-radius:11px; padding:11px 13px; font-size:14px; }
.rbl .field::placeholder{ color:rgba(236,231,218,.34); }
.rbl textarea.field{ resize:vertical; min-height:44px; line-height:1.5; }
.rbl .frow{ display:flex; gap:12px; flex-wrap:wrap; margin-bottom:14px; }
.rbl .frow>div{ flex:1; min-width:180px; }

.rbl .btn{ font:inherit; cursor:pointer; border-radius:11px; padding:11px 22px; font-size:14px; border:1px solid transparent; display:inline-flex; align-items:center; gap:7px; text-decoration:none; transition:transform .2s, box-shadow .3s; }
.rbl .btn:hover{ transform:translateY(-2px); }
.rbl .btn-gold{ background:linear-gradient(135deg,#D4AF37,#C9A961); color:#241a03; font-weight:600; box-shadow:0 8px 22px rgba(201,169,97,.3); }
.rbl .btn-ghost{ background:rgba(255,255,255,.04); border-color:rgba(201,169,97,.4); color:#F5E6B8; }
.rbl .btn-ghost:hover{ background:rgba(201,169,97,.12); box-shadow:0 8px 22px rgba(201,169,97,.2); }
.rbl .case-actions{ display:flex; gap:10px; flex-wrap:wrap; margin-top:18px; }

/* 원형 진행률 */
.rbl .cust-top{ display:flex; gap:22px; align-items:center; flex-wrap:wrap; }
.rbl .ring-wrap{ position:relative; width:132px; height:132px; flex:0 0 132px; animation:float 5s ease-in-out infinite; }
.rbl .ring-wrap svg{ width:132px; height:132px; transform:rotate(-90deg); }
.rbl .ring-bg{ fill:none; stroke:rgba(255,255,255,.09); stroke-width:9; }
.rbl .ring-fg{ fill:none; stroke:url(#rg); stroke-width:9; stroke-linecap:round; stroke-dasharray:327; stroke-dashoffset:327; transition:stroke-dashoffset 1.5s cubic-bezier(.3,.8,.3,1) .2s; filter:drop-shadow(0 0 6px rgba(212,175,55,.6)); }
.rbl .ring-center{ position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.rbl .ring-center b{ font-size:32px; font-weight:600; line-height:1; }
.rbl .ring-center span{ font-size:12px; color:rgba(236,231,218,.6); margin-top:3px; }
.rbl .case-info{ flex:1; min-width:220px; }
.rbl .prog-line{ margin-top:14px; font-size:15px; padding:12px 16px; border-radius:13px; background:rgba(201,169,97,.1); border:1px solid rgba(201,169,97,.26); }
.rbl .prog-line b{ font-weight:600; }

/* 사건 목록 (manage.php) */
.rbl .clist{ display:flex; flex-direction:column; gap:10px; }
.rbl .crow{ display:flex; align-items:center; gap:14px; padding:14px 16px; border-radius:14px; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.09); text-decoration:none; color:#ECE7DA; transition:transform .25s, border-color .25s, box-shadow .25s; }
.rbl .crow:hover{ transform:translateX(4px); border-color:rgba(201,169,97,.4); box-shadow:0 8px 24px rgba(0,0,0,.3); }
.rbl .cstatus{ font-size:12px; padding:4px 11px; border-radius:999px; flex:0 0 auto; }
.rbl .cstatus.run{ background:rgba(201,169,97,.18); color:#F5E6B8; }
.rbl .cstatus.done{ background:rgba(120,180,120,.2); color:#bfe6bf; }
.rbl .cmain{ flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; }
.rbl .cmain b{ font-size:15px; }
.rbl .cmain .muted{ font-size:12.5px; }
.rbl .cstep{ font-size:13px; color:#F5E6B8; flex:0 0 auto; }
.rbl .carrow{ color:rgba(201,169,97,.6); flex:0 0 auto; font-size:18px; }

/* 사건 상세: 단계 박스 */
.rbl .vtrack{ margin-top:4px; }
.rbl .vstep{ border-radius:16px; padding:14px 16px; background:rgba(255,255,255,.045); border:1px solid rgba(255,255,255,.09); transition:transform .3s, box-shadow .3s, border-color .3s; animation:boxIn .65s cubic-bezier(.2,.7,.2,1) both; animation-delay:var(--d,0s); }
.rbl .vstep:hover{ transform:translateX(4px); border-color:rgba(201,169,97,.4); box-shadow:0 10px 28px rgba(0,0,0,.34); }
.rbl .vstep.done{ background:linear-gradient(100deg,rgba(201,169,97,.11),rgba(201,169,97,.03)); border-color:rgba(201,169,97,.24); }
.rbl .vstep-top{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.rbl .sbadge{ position:relative; width:44px; height:44px; border-radius:14px; display:flex; align-items:center; justify-content:center; font-size:16px; font-weight:700; flex:0 0 44px; }
.rbl .sbadge.done{ background:linear-gradient(135deg,#D4AF37,#C9A961); color:#241a03; box-shadow:0 6px 16px rgba(201,169,97,.4); }
.rbl .sbadge.cur{ color:#F5E6B8; background:radial-gradient(circle at 30% 30%,rgba(212,175,55,.35),rgba(212,175,55,.08)); border:2px solid #D4AF37; animation:pulse 2.2s infinite; }
.rbl .sbadge.wait{ background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.16); color:rgba(236,231,218,.45); }
.rbl .tick{ position:absolute; top:-5px; right:-5px; width:19px; height:19px; }
.rbl .tick circle{ fill:#0A1830; stroke:#D4AF37; stroke-width:1.3; }
.rbl .tick path{ stroke:#F5E6B8; stroke-width:2.7; fill:none; stroke-linecap:round; stroke-linejoin:round; }
.rbl .vstep-title{ flex:1; min-width:120px; font-size:15.5px; font-weight:500; }
.rbl .vstep-title.big{ font-size:18px; font-weight:600; }
.rbl .vstep.wait .vstep-title{ color:rgba(236,231,218,.5); }
.rbl .vstep-date{ font-size:12px; color:rgba(236,231,218,.5); margin-left:6px; font-weight:400; }
.rbl .segform{ display:inline-flex; border:1px solid rgba(255,255,255,.14); border-radius:11px; overflow:hidden; flex:0 0 auto; margin:0; }
.rbl .seg-btn{ font:inherit; cursor:pointer; padding:7px 12px; font-size:12.5px; background:transparent; color:rgba(236,231,218,.45); border:0; border-left:1px solid rgba(255,255,255,.1); }
.rbl .seg-btn:first-child{ border-left:0; }
.rbl .seg-btn:hover{ color:#F5E6B8; }
.rbl .seg-btn.on-wait{ background:rgba(255,255,255,.12); color:#ECE7DA; }
.rbl .seg-btn.on-cur{ background:linear-gradient(135deg,rgba(212,175,55,.92),rgba(201,169,97,.92)); color:#241a03; font-weight:600; }
.rbl .seg-btn.on-done{ background:linear-gradient(135deg,#D4AF37,#C9A961); color:#241a03; font-weight:600; }
.rbl .memo-edit{ margin-top:12px; }
.rbl .memo-edit>summary{ cursor:pointer; font-size:12.5px; color:#C9A961; list-style:none; }
.rbl .memo-edit>summary::-webkit-details-marker{ display:none; }
.rbl .memo-edit>summary::before{ content:'✎ '; }
.rbl .mlabel{ display:block; font-size:11px; margin:9px 0 4px; }
.rbl .mlabel.pub{ color:#F5E6B8; }
.rbl .mlabel.pri{ color:rgba(236,231,218,.55); }

/* 현재 단계 — 회전 골드 테두리 + 샤인 */
.rbl .cur-wrap{ position:relative; border-radius:20px; padding:2px; margin:0; background:conic-gradient(from var(--ang),#7a5f28,#D4AF37,#F5E6B8,#D4AF37,#7a5f28);
  animation:rot 6s linear infinite, boxIn .65s cubic-bezier(.2,.7,.2,1) both; animation-delay:0s,var(--d,0s); box-shadow:0 0 48px rgba(212,175,55,.42); }
.rbl .cur-card{ position:relative; border-radius:18px; background:linear-gradient(158deg,#17243f,#0f1a30); padding:16px 18px; overflow:hidden; }
.rbl .cur-card .sheen{ position:absolute; top:0; bottom:0; left:0; width:42%; pointer-events:none; will-change:transform;
  background:linear-gradient(90deg,transparent,rgba(245,230,184,.16),transparent); transform:translateX(-130%) skewX(-12deg); animation:sheen 7s linear infinite; }
.rbl .cur-card .vstep-top, .rbl .cur-card .memo-edit{ position:relative; }
.rbl .nowtag{ position:relative; display:inline-flex; align-items:center; gap:6px; font-size:11px; letter-spacing:.06em; color:#241a03; font-weight:600; background:linear-gradient(135deg,#F5E6B8,#D4AF37); padding:4px 12px; border-radius:999px; margin-bottom:12px; }
.rbl .nowtag i{ width:6px; height:6px; border-radius:50%; background:#241a03; animation:pulse 1.8s infinite; }

.rbl .arrow{ display:flex; justify-content:center; width:44px; margin-left:16px; padding:2px 0; }
.rbl .arrow svg path{ stroke:url(#ag); stroke-width:2.4; fill:none; stroke-linecap:round; stroke-linejoin:round; }
.rbl .arrow.dim svg path{ stroke:rgba(255,255,255,.17); }

/* 고객 진행조회: 읽기전용 상태 태그 · 공개 메모 · 사건 선택 */
.rbl .stag{ font-size:12px; padding:5px 12px; border-radius:999px; flex:0 0 auto; }
.rbl .stag.done{ background:linear-gradient(135deg,#D4AF37,#C9A961); color:#241a03; font-weight:600; }
.rbl .stag.run{ background:rgba(201,169,97,.18); color:#F5E6B8; }
.rbl .stag.wait{ background:rgba(255,255,255,.06); color:rgba(236,231,218,.5); }
.rbl .memo-read{ position:relative; margin-top:11px; border-radius:12px; padding:12px 14px; font-size:13.5px; line-height:1.62; background:rgba(201,169,97,.12); border:1px solid rgba(201,169,97,.3); color:#F3E9CE; }
.rbl .memo-read .lbl{ display:block; font-size:11px; color:#F5E6B8; margin-bottom:5px; font-weight:500; }
.rbl .caselist-sel{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:16px; }
.rbl .caselist-sel a{ font-size:13px; padding:8px 14px; border-radius:10px; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.12); text-decoration:none; color:#ECE7DA; }
.rbl .caselist-sel a.on{ border-color:#D4AF37; background:rgba(201,169,97,.15); color:#F5E6B8; }