/* 크링몰 로그인 뒤 화면(브랜드 콘솔·크리에이터 마이·운영) 공통 틀 */
body.console{background:#F6F3F5}
.app{display:grid;grid-template-columns:248px minmax(0,1fr);min-height:100vh}
.side{position:sticky;top:0;height:100vh;background:#000;color:#fff;display:flex;flex-direction:column;padding:20px 16px;gap:18px;overflow-y:auto}
.side .logo{color:#fff;font-size:1rem}
.side .role{display:inline-flex;align-self:flex-start;font-size:.72rem;font-weight:900;font-family:var(--latin);letter-spacing:.02em;border-radius:999px;padding:.25rem .6rem;background:var(--pink)}
.side .role.c{background:#fff;color:#000}.side .role.a{background:#3a3340}
.side nav{display:grid;gap:2px}
.side nav .grp{font-size:.72rem;color:var(--dim);font-weight:800;margin:14px 10px 6px}
.side nav a{display:flex;align-items:center;gap:.65rem;padding:.62rem .7rem;border-radius:12px;font-weight:700;font-size:.92rem;color:#d9d2dd}
.side nav a i{width:8px;height:8px;border-radius:2px;background:#3a3340;flex:none}
.side nav a:hover{background:#16121a;color:#fff}
.side nav a[aria-current="page"]{background:#16121a;color:#fff}
.side nav a[aria-current="page"] i{background:var(--pink)}
.side .me{margin-top:auto;display:flex;gap:.6rem;align-items:center;padding:.7rem;border-radius:14px;background:#16121a}
.side .me .av{width:34px;height:34px;border-radius:50%;background:var(--pink);display:grid;place-items:center;font-weight:900;font-size:.8rem;overflow:hidden}
.side .me .av img{width:100%;height:100%;object-fit:cover}
.side .me b{display:block;font-size:.86rem}.side .me span{font-size:.74rem;color:var(--dim)}
.cmain{min-width:0;display:flex;flex-direction:column}
.cbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:14px clamp(16px,2.4vw,36px);background:rgba(246,243,245,.85);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.cbar .ttl{display:flex;flex-direction:column}
.cbar .ttl small{font-size:.76rem;color:var(--gray);font-weight:700}
.cbar .ttl h1{font-size:1.35rem;font-weight:900;letter-spacing:-.03em}
.cbar .r{display:flex;align-items:center;gap:.6rem}
.cbar .demo{font-size:.74rem;font-weight:800;color:var(--pink);background:var(--blush);border-radius:999px;padding:.3rem .7rem}
.cbar .srch{display:flex;align-items:center;gap:.5rem;border:1.5px solid var(--line);background:#fff;border-radius:999px;padding:.45rem .9rem;font-size:.86rem;color:var(--gray);min-width:220px}
.cbar .bell{width:38px;height:38px;border-radius:50%;background:#fff;border:1.5px solid var(--line);display:grid;place-items:center;position:relative}
.cbar .bell::after{content:"";position:absolute;top:8px;right:9px;width:7px;height:7px;border-radius:50%;background:var(--pink)}
.cbody{padding:clamp(16px,2.4vw,36px);display:grid;gap:clamp(14px,1.6vw,22px)}
.panel2{background:#fff;border:1px solid var(--line);border-radius:20px;padding:clamp(16px,1.8vw,26px);min-width:0}
.panel2 h2{font-size:1.1rem;font-weight:900;display:flex;justify-content:space-between;align-items:center;gap:1rem}
.panel2 h2 a,.panel2 h2 .sub{font-size:.82rem;font-weight:800;color:var(--gray)}
.panel2 .desc{color:var(--gray);font-size:.9rem;margin-top:.3rem;line-height:1.6}
.row2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(14px,1.6vw,22px)}
.row3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.6vw,22px)}
.row21{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:clamp(14px,1.6vw,22px)}
.kpis2{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.kpi2{background:#fff;border:1px solid var(--line);border-radius:18px;padding:16px 18px}
.kpi2 span{font-size:.8rem;color:var(--gray);font-weight:700}
.kpi2 b{display:block;font-family:var(--latin);font-size:1.6rem;margin-top:.35rem;font-variant-numeric:tabular-nums}
.kpi2 em{font-style:normal;font-size:.76rem;font-weight:800;color:var(--pink)}
.kpi2.dark{background:#000;color:#fff;border-color:#000}.kpi2.dark span{color:var(--dim)}
.tbl2wrap{overflow-x:auto;margin-top:.9rem}
.tbl2{width:100%;border-collapse:collapse;font-size:.9rem;min-width:640px;font-variant-numeric:tabular-nums}
.tbl2 th{text-align:left;font-size:.78rem;color:var(--gray);font-weight:800;padding:.7rem .6rem;border-bottom:1.5px solid #000;white-space:nowrap}
.tbl2 td{padding:.8rem .6rem;border-bottom:1px solid var(--line);vertical-align:middle}
.tbl2 tr:hover td{background:#FFF8FA}
.who2{display:flex;align-items:center;gap:.6rem;font-weight:800}
.who2 img,.who2 .ph{width:36px;height:36px;border-radius:50%;object-fit:cover;background:var(--blush);flex:none}
.who2 small{display:block;font-weight:600;color:var(--gray);font-size:.76rem}
.st2{display:inline-flex;align-items:center;gap:.3rem;font-size:.76rem;font-weight:800;border-radius:999px;padding:.2rem .6rem;white-space:nowrap}
.st2::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.st2.ok{background:#E8F7EE;color:#15803d}.st2.wait{background:#FFF4E5;color:#b45309}.st2.pk{background:var(--blush);color:var(--pink)}.st2.no{background:#F1EDF0;color:var(--gray)}.st2.dk{background:#000;color:#fff}
.mini{font-size:.8rem;font-weight:800;border-radius:999px;padding:.35rem .8rem;border:1.5px solid #000;background:#fff;white-space:nowrap;cursor:pointer;font-family:inherit}
.mini.p{background:var(--pink);border-color:var(--pink);color:#fff}
.mini.g{border-color:var(--line);color:var(--gray)}
.tabs2{display:flex;gap:.3rem;border-bottom:1.5px solid var(--line);overflow-x:auto}
.tabs2 button{font:inherit;font-weight:800;font-size:.92rem;color:var(--gray);padding:.8rem 1rem;border:0;background:none;border-bottom:3px solid transparent;cursor:pointer;white-space:nowrap}
.tabs2 button[aria-selected="true"]{color:#000;border-bottom-color:var(--pink)}
.tabs2 button em{font-style:normal;font-size:.72rem;background:#F1EDF0;border-radius:999px;padding:.1rem .45rem;margin-left:.3rem}
[data-panel][hidden]{display:none!important}
.todo{list-style:none;display:grid;gap:.5rem;margin-top:.8rem}
.todo li{display:grid;grid-template-columns:auto 1fr auto;gap:.7rem;align-items:center;padding:.75rem .9rem;border-radius:14px;background:#F8F5F7;font-size:.92rem}
.todo li b{font-weight:800}.todo li small{display:block;color:var(--gray);font-size:.78rem}
.dot{width:10px;height:10px;border-radius:50%;background:var(--pink)}
.dot.g{background:#c8c0c6}
.bars{display:flex;align-items:flex-end;gap:10px;height:160px;margin-top:1rem;padding-bottom:22px;position:relative}
.bars div{flex:1;background:#E9E2E6;border-radius:8px 8px 3px 3px;position:relative}
.bars div.p{background:var(--pink)}
.bars div span{position:absolute;bottom:-20px;left:50%;transform:translateX(-50%);font-size:.72rem;color:var(--gray);white-space:nowrap}
.bars div em{position:absolute;top:-18px;left:50%;transform:translateX(-50%);font-style:normal;font-size:.7rem;font-weight:800}
.form2{display:grid;gap:1rem;margin-top:1rem}
.f{display:grid;gap:.4rem}
.f label{font-size:.85rem;font-weight:800}
.f label small{font-weight:600;color:var(--gray);margin-left:.3rem}
.f input,.f select,.f textarea{font:inherit;font-size:.95rem;border:1.5px solid var(--line);border-radius:12px;padding:.7rem .9rem;background:#fff;width:100%}
.f textarea{min-height:96px;resize:vertical}
.f input:focus,.f select:focus,.f textarea:focus{outline:2px solid var(--pink);outline-offset:1px;border-color:transparent}
.f .hint{font-size:.78rem;color:var(--gray)}
.f2{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.chips2{display:flex;flex-wrap:wrap;gap:.45rem}
.chips2 label{display:inline-flex;align-items:center;gap:.35rem;border:1.5px solid var(--line);border-radius:999px;padding:.4rem .8rem;font-size:.86rem;font-weight:700;cursor:pointer;background:#fff}
.chips2 input{accent-color:var(--pink)}
.wiz{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;margin-bottom:1rem}
.wiz span{font-size:.78rem;font-weight:800;color:var(--gray);border-top:4px solid var(--line);padding-top:.5rem}
.wiz span.on{color:#000;border-top-color:var(--pink)}
.wiz span.done{color:var(--pink);border-top-color:var(--pink)}
.analysis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:1rem}
.analysis div{background:#F8F5F7;border-radius:14px;padding:12px 14px}
.analysis span{font-size:.76rem;color:var(--gray);font-weight:700}
.analysis b{display:block;font-size:1.15rem;margin-top:.2rem}
.prof{display:grid;grid-template-columns:auto 1fr auto;gap:1.2rem;align-items:center}
.prof .bigav{width:84px;height:84px;border-radius:50%;object-fit:cover;border:3px solid var(--pink)}
.prof h2{font-size:1.5rem}
.grade{display:inline-flex;align-items:center;gap:.4rem;font-family:var(--latin);font-weight:900;font-size:.78rem;padding:.3rem .7rem;border-radius:999px;background:#000;color:#fff}
.grade.gold{background:linear-gradient(90deg,#c9a24a,#f2d27a);color:#000}
.pst{display:grid;grid-template-columns:72px 1fr auto;gap:.9rem;align-items:center;padding:.7rem 0;border-bottom:1px solid var(--line)}
.pst img{width:72px;aspect-ratio:9/12;object-fit:cover;border-radius:10px}
.pst b{font-size:.92rem}.pst small{display:block;color:var(--gray);font-size:.78rem;margin-top:.15rem}
.crcard{display:grid;gap:.7rem;background:#fff;border:1px solid var(--line);border-radius:20px;padding:16px}
.crcard .top{display:flex;gap:.7rem;align-items:center}
.crcard .top img{width:52px;height:52px;border-radius:50%;object-fit:cover}
.crcard .top b{display:block;font-weight:900}.crcard .top small{color:var(--gray);font-size:.8rem}
.crcard .nums{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;text-align:center}
.crcard .nums div{background:#F8F5F7;border-radius:10px;padding:8px 4px}
.crcard .nums span{display:block;font-size:.7rem;color:var(--gray)}.crcard .nums b{font-size:.98rem}
.crcard .fit{font-size:.8rem;font-weight:800;color:var(--pink)}
.crcard .act{display:flex;gap:.4rem}
.ai{background:#000;color:#fff;border-radius:20px;padding:20px 22px;display:grid;grid-template-columns:auto 1fr auto;gap:1rem;align-items:center}
.ai .lk{width:2.4rem;height:1.2rem;color:var(--pink)}
.ai b{font-weight:900}.ai p{color:var(--dim);font-size:.88rem;margin-top:.2rem}
.trk{list-style:none;display:grid;gap:0;margin-top:1rem}
.trk li{display:grid;grid-template-columns:1.6rem 1fr auto;gap:.6rem;padding:.55rem 0;font-size:.9rem;align-items:center}
.trk li i{width:.9rem;height:.9rem;border-radius:50%;border:2px solid var(--line);justify-self:center;background:#fff}
.trk li.done i{background:var(--pink);border-color:var(--pink)}
.trk li span{color:var(--gray);font-size:.82rem}
.stars{color:var(--pink);letter-spacing:2px}
.tag2{display:inline-block;font-size:.74rem;font-weight:800;border-radius:6px;padding:.15rem .45rem;background:#F1EDF0;color:var(--gray);margin:0 .2rem .2rem 0}
.empty2{padding:2rem;text-align:center;color:var(--gray);font-size:.92rem}
/* 쇼핑(공개 머리글 사용) */
.shopnav{display:flex;gap:.4rem;flex-wrap:wrap;margin-bottom:1.4rem}
.shopnav button{font:inherit;font-weight:800;font-size:.9rem;border:1.5px solid var(--line);background:#fff;border-radius:999px;padding:.5rem 1rem;cursor:pointer}
.shopnav button[aria-pressed="true"]{background:#000;color:#fff;border-color:#000}
.pcard2{display:grid;gap:.5rem}
.pcard2 .vid{position:relative;border-radius:18px;overflow:hidden;background:#211b25}
.pcard2 .vid img{width:100%;aspect-ratio:3/4;object-fit:cover}
.pcard2 .vid .play{position:absolute;left:10px;bottom:10px;display:flex;align-items:center;gap:.4rem;background:rgba(0,0,0,.55);color:#fff;border-radius:999px;padding:.3rem .7rem .3rem .4rem;font-size:.74rem;font-weight:800}
.pcard2 .vid .play i{width:20px;height:20px;border-radius:50%;background:#fff;display:grid;place-items:center}
.pcard2 .vid .play i::after{content:"";border-left:6px solid #000;border-top:4px solid transparent;border-bottom:4px solid transparent;margin-left:2px}
.pcard2 b{font-weight:900}.pcard2 small{color:var(--gray);font-size:.84rem}
.pcard2 .pr{font-family:var(--latin);font-weight:900}
.cartrow{display:grid;grid-template-columns:90px 1fr auto;gap:1rem;align-items:center;padding:1rem 0;border-bottom:1px solid var(--line)}
.cartrow img{width:90px;aspect-ratio:1;object-fit:cover;border-radius:14px}
/* 리포트 단독 페이지 */
.rep2{max-width:980px;margin:0 auto;padding:clamp(24px,4vw,64px) 16px}
.rep2 .head{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;border-bottom:2px solid #000;padding-bottom:1rem}
@media (max-width:1180px){.row21,.row3{grid-template-columns:1fr}.kpis2,.analysis{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:860px){.app{grid-template-columns:1fr}.side{position:static;height:auto;flex-direction:row;flex-wrap:wrap;align-items:center;gap:10px}.side nav{display:flex;overflow-x:auto;width:100%;gap:4px}.side nav .grp{display:none}.side nav a{white-space:nowrap}.side .me{display:none}.cbar .srch{display:none}.row2,.f2{grid-template-columns:1fr}.wiz{grid-template-columns:repeat(3,1fr)}.prof{grid-template-columns:auto 1fr}.prof>:last-child{grid-column:1/-1}}
[data-step][hidden]{display:none!important}
.ai .mini{color:#000}
