/* BPD Bali CMS — UI/UX Pro Max enterprise dashboard direction. */
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;450;500;600;700&display=swap');
:root{--ink:#15263f;--nav:#101f36;--teal:#174b79;--muted:#58687b;--line:#dce3ec;--bg:#f5f7fb;--surface:#fff;--soft:#edf2f8;--gold:#b28839;--focus:#2563eb;--radius:12px;--shadow:0 3px 12px #182c4c05;--font-ui:'IBM Plex Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
body[data-mode=cms]{font-family:var(--font-ui);font-size:14px;line-height:1.55;background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased}
body[data-mode=cms] :is(button,input,select,textarea){font-family:var(--font-ui)}
body[data-mode=cms] :is(button,a,input,select,textarea,summary){touch-action:manipulation}
body[data-mode=cms] :is(button,.button){min-height:38px;border-radius:8px;padding:9px 14px;font-weight:500;border-color:var(--line);transition:background-color 180ms,border-color 180ms,box-shadow 180ms;color:var(--ink)}
body[data-mode=cms] button:hover{background:#f0f4f9;border-color:#adbcd0}
body[data-mode=cms] :is(button,.button):active{background:#e6edf6}
body[data-mode=cms] :is(button.primary,.button.primary){background:var(--teal);border-color:var(--teal);color:white;box-shadow:0 2px 4px #174b7915}
body[data-mode=cms] :is(button.primary,.button.primary):hover{background:#123d63;border-color:#123d63}
body[data-mode=cms] button:disabled{opacity:.5;cursor:not-allowed}
body[data-mode=cms] :is(button,a,input,select,textarea,summary,[tabindex]):focus-visible{outline:3px solid var(--focus);outline-offset:3px;scroll-margin:100px}
.skip-link{position:fixed;left:16px;top:-100px;z-index:500;background:white;color:var(--teal);padding:12px 18px;border-radius:8px}.skip-link:focus{top:12px}
body[data-mode=cms]>aside{width:244px;background:var(--nav);padding:28px 16px 18px;border-right:1px solid #ffffff09;color:#c8d3e4;z-index:20}
body[data-mode=cms] aside .brand{font-size:27px;letter-spacing:-.6px;font-weight:700;padding:0 16px 25px;position:relative}
body[data-mode=cms] aside .brand::after{content:'';position:absolute;bottom:9px;left:16px;width:34px;height:3px;background:#c6a15a;border-radius:2px}
body[data-mode=cms] aside .brand small{font-size:9px;font-weight:500;letter-spacing:1.8px;color:#acbdd4;margin:5px 0 0}
body[data-mode=cms] aside nav{padding-top:16px;padding-right:4px!important}
body[data-mode=cms] aside nav button{color:#c4cede;background:transparent;border:1px solid transparent;border-radius:8px;min-height:44px;margin:3px 0;padding:10px 13px;gap:12px;font-size:13px;font-weight:450;align-items:center;position:relative}
body[data-mode=cms] aside nav button:hover{background:#ffffff0b;color:white;border-color:transparent}
body[data-mode=cms] aside nav button.active{background:#253a56;color:white;border-color:#405572;box-shadow:inset 3px 0 #d0af69}
body[data-mode=cms] aside .ui-icon{color:#8fa6c6;flex-shrink:0}
body[data-mode=cms] aside .active .ui-icon{color:#e4c78d}
body[data-mode=cms] aside footer{border-top:1px solid #ffffff14;padding:16px 14px 0;color:#aabbd1;font-size:11px;line-height:1.85}
body[data-mode=cms] aside footer strong{color:#f0f4fa;font-size:12px}
body[data-mode=cms] #sidebarScrollHint{background:#233650;border-color:#465b76;color:#dce5f2;font-size:11px}
body[data-mode=cms] main{margin-left:244px;min-width:0}
body[data-mode=cms] main>header{height:78px;padding:0 32px;background:white;border-bottom:1px solid var(--line);gap:12px;position:relative;z-index:6}
body[data-mode=cms] #title{font-size:14px;font-weight:600;margin-right:auto;display:flex;align-items:center;gap:12px;white-space:nowrap}
body[data-mode=cms] #title::before{content:'Workspace';font-size:12px;color:var(--muted);font-weight:400;border-right:1px solid var(--line);padding-right:13px}
body[data-mode=cms] main>header .user{order:5;gap:14px;border-left:1px solid var(--line);padding-left:20px}
body[data-mode=cms] #user strong{font-size:12px;color:var(--ink)}body[data-mode=cms] #user small{font-size:11px;color:var(--muted)}
body[data-mode=cms] .accountbutton .avatar{background:#edf2f8;border:1px solid #dbe4ef;color:#174b79;width:36px;height:36px;font-size:12px}
body[data-mode=cms] #syncState{font-size:11px;white-space:nowrap;background:#edf7f2;color:#286344;border:1px solid #d6e9df;border-radius:20px;padding:4px 9px;margin:0;order:3}
body[data-mode=cms] #journeyLaunch{font-size:11px;padding:7px 10px;margin:0;min-height:32px;order:1;white-space:nowrap}
body[data-mode=cms] #tourLaunch{font-size:11px;min-height:32px;order:2}
body[data-mode=cms] .content{max-width:1600px;padding:30px 32px 48px;outline:none}
body[data-mode=cms] h1{font-size:29px;font-weight:600;letter-spacing:-.85px;line-height:1.25;margin:7px 0 10px;color:var(--ink);text-wrap:balance}
body[data-mode=cms] h2{font-size:16px;font-weight:600;letter-spacing:-.2px;color:var(--ink)}
body[data-mode=cms] h3{font-size:15px;font-weight:600;letter-spacing:-.15px}
body[data-mode=cms] p{color:var(--muted);font-size:13px;line-height:1.7}
body[data-mode=cms] small{color:var(--muted)}
body[data-mode=cms] .label{font-size:10px;font-weight:600;letter-spacing:1.5px;color:#6c5a30}
body[data-mode=cms] .intro{margin-bottom:26px;align-items:center;gap:20px}.intro .actions{margin-top:0}
body[data-mode=cms] .intro p{margin-bottom:0;max-width:680px}
body[data-mode=cms] :is(.panel,.scaletools,.record,.c360-section){border:1px solid var(--line);background:white;border-radius:var(--radius);box-shadow:var(--shadow)}
body[data-mode=cms] .panel{padding:24px;margin-bottom:20px}
body[data-mode=cms] .split{gap:20px;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr)}
body[data-mode=cms] .metrics{gap:16px;margin-bottom:24px}
body[data-mode=cms] .metric{position:relative;background:white;border:1px solid var(--line);box-shadow:var(--shadow);padding:21px 22px;border-radius:var(--radius);min-width:0;overflow:hidden}
body[data-mode=cms] .metric>span:not(.ui-metric-icon){display:block;font-size:12px;font-weight:500;color:var(--muted);max-width:calc(100% - 32px)}
body[data-mode=cms] .metric>strong{font-size:34px;font-weight:600;letter-spacing:-1px;color:var(--ink);margin:18px 0 8px;line-height:1.15;font-variant-numeric:tabular-nums}
body[data-mode=cms] .metric>small{font-size:11px;color:#536e8c;display:flex;align-items:center;gap:6px}
body[data-mode=cms] .metric>.ui-metric-icon{position:absolute;right:18px;top:18px;width:34px;height:34px;display:grid;place-items:center;background:#edf3fa;border:1px solid #e2eaf5;color:#335e8a;border-radius:9px}
body[data-mode=cms] .metric:nth-child(2)>.ui-metric-icon{background:#fff6e6;border-color:#f4e8cf;color:#88621f}
body[data-mode=cms] .metric:nth-child(3)>.ui-metric-icon{background:#fdf0ed;border-color:#f0ded7;color:#ab4e35}
body[data-mode=cms] .metric:nth-child(4)>.ui-metric-icon{background:#f0effb;border-color:#e4e2f3;color:#655596}
.ui-icon{display:inline-block;width:19px;height:19px;vertical-align:middle;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto;pointer-events:none}
body[data-mode=cms] .scaletools{padding:18px;margin-bottom:20px}
body[data-mode=cms] :is(input,select,textarea){border:1px solid #cbd5e1;min-height:40px;padding:9px 12px;border-radius:8px;font-size:13px;background:white;color:var(--ink)}
body[data-mode=cms] input::placeholder,body[data-mode=cms] textarea::placeholder{color:#6b798b;opacity:1}
body[data-mode=cms] :is(input,select,textarea):focus{outline:2px solid #6490c0;outline-offset:2px}
body[data-mode=cms] .searchbox{margin-bottom:14px}
body[data-mode=cms] .searchbox input{background:#f8fafc;padding-left:42px;min-height:44px;font-size:13px;border-color:#d5dfe9}
body[data-mode=cms] .searchbox>span{left:14px;top:12px;line-height:1;color:var(--muted)}
body[data-mode=cms] .filterline{gap:10px}body[data-mode=cms] .filterline :is(select,input,button){font-size:12px;min-height:38px}
body[data-mode=cms] :is(.rangechips,.customerchips,.leadchips){gap:8px;margin:18px 0;flex-wrap:wrap;overflow:visible;padding:0}
body[data-mode=cms] .rangechips button{font-size:12px;border-radius:8px;padding:8px 12px;min-height:36px;background:white;border-color:var(--line);color:#53647a;gap:8px}
body[data-mode=cms] .rangechips button b{font-size:10px;opacity:1;background:#edf1f6;color:#58687b;border-radius:4px;padding:1px 5px;font-weight:500}
body[data-mode=cms] .rangechips button.active{background:#eaf1f9;color:#173e65;border-color:#9fb6d2;font-weight:600}
body[data-mode=cms] .rangechips button.active b{background:#d8e5f4;color:#173e65}
body[data-mode=cms] .viewtoggle{background:#e9eef5;padding:3px;border:1px solid #dce4ee;border-radius:8px;gap:3px}
body[data-mode=cms] .viewtoggle button{background:transparent;border-color:transparent;font-size:12px;padding:6px 12px;min-height:30px}
body[data-mode=cms] .viewtoggle button.active{background:white;color:var(--ink);border-color:#d4dfec;box-shadow:0 1px 3px #14273d0b}
body[data-mode=cms] .listhead{margin:20px 0 14px}body[data-mode=cms] .listhead strong{font-size:13px;font-weight:500}
body[data-mode=cms] .scrolltable{border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
body[data-mode=cms] .datatable{min-width:780px;font-size:13px}
body[data-mode=cms] .datatable th{background:#f8fafc;color:#58687b;font-size:11px;font-weight:500;padding:14px 17px;border-bottom:1px solid var(--line);letter-spacing:.2px}
body[data-mode=cms] .datatable td{padding:17px;border-color:#e8edf3;font-size:13px;vertical-align:middle;line-height:1.5;color:#34475f}
body[data-mode=cms] .datatable td strong{color:var(--ink);font-size:13px;font-weight:500;margin-bottom:5px}
body[data-mode=cms] .datatable td small{font-size:11px;line-height:1.55;margin-top:5px;color:#617187}
body[data-mode=cms] .datatable tr:hover td{background:#f6f9fd}
body[data-mode=cms] .datatable button{font-size:11px;min-height:32px;padding:6px 11px;color:#264f7b;background:#f9fbfe}
body[data-mode=cms] .datatable th:last-child{width:92px}
body[data-mode=cms] .membertable td{padding:13px 17px}
body[data-mode=cms] .memberrowactions{gap:8px}
body[data-mode=cms] :is(.tag,.customerstatus){font-size:10px;font-weight:500;border-radius:5px;padding:4px 8px;display:inline-flex;align-items:center;gap:5px;line-height:1.5;max-width:100%;color:#256346;background:#edf7f1;white-space:normal}
body[data-mode=cms] .tag.amber{color:#875c16;background:#fff5df}body[data-mode=cms] .tag.danger{color:#a43e32;background:#fdf0ed}
body[data-mode=cms] .ui-neutral,body[data-mode=cms] .customerstatus.inactive{color:#596a80;background:#edf1f6}
body[data-mode=cms] .tag.ui-info{color:#315b8a;background:#ecf2fb}
body[data-mode=cms] .pagination{font-size:12px;padding:16px 2px;margin-top:14px;border-color:var(--line)}
body[data-mode=cms] .pagination button{min-height:34px;min-width:36px;border-radius:7px;font-size:14px}
body[data-mode=cms] .records{gap:16px}
body[data-mode=cms] .record{padding:20px;margin-bottom:14px}
body[data-mode=cms] .record[role=link]:hover{border-color:#9bb4d1;box-shadow:0 4px 14px #123d6310}
body[data-mode=cms] .amount{font-size:23px;font-weight:600;letter-spacing:-.5px;font-variant-numeric:tabular-nums}
body[data-mode=cms] .meta{font-size:12px;color:var(--muted)}
body[data-mode=cms] .textbtn{min-height:24px;padding:0;background:transparent;border:0;color:#174b79;font-weight:500}
body[data-mode=cms] .next{background:#f3f6fa;border:1px solid #e6ecf3;color:#526780;padding:11px;border-radius:7px;font-size:12px}
body[data-mode=cms] .actions{gap:9px}body[data-mode=cms] .actions button{font-size:12px}
body[data-mode=cms] .hint{background:#f5f8fc;border:1px solid #e1e8f1;border-left:3px solid #b8cbe1;border-radius:7px;padding:13px 15px;color:#53667c;font-size:12px}
body[data-mode=cms] .board{gap:16px;grid-template-columns:repeat(4,minmax(230px,1fr));padding-bottom:12px}
body[data-mode=cms] .column{background:#edf1f7;border:1px solid #e1e7ef;border-radius:11px;padding:14px;min-width:0}
body[data-mode=cms] .columnhead{padding:5px 2px 10px;font-size:12px;gap:8px;align-items:center}
body[data-mode=cms] .columnhead b::before{content:'';display:inline-block;background:#7e98b9;width:7px;height:7px;border-radius:50%;margin-right:7px}
body[data-mode=cms] .columnhead span{background:white;border:1px solid #dce4ef;font-size:10px;padding:1px 6px;color:#53667e}
body[data-mode=cms] .stagetotal{font-size:19px;font-weight:600;color:#193c64;padding:0 2px;margin:3px 0 17px;letter-spacing:-.5px}
body[data-mode=cms] .column .record{padding:17px;box-shadow:0 2px 5px #172f4c04}
body[data-mode=cms] .stagebar{border-radius:7px;padding:10px 8px;margin-bottom:7px;background:#f8fafc;gap:12px}
body[data-mode=cms] .stagebar span{font-size:12px;min-width:86px}
body[data-mode=cms] .stagebar i{height:8px;background:#7191b9;border-radius:4px;flex-shrink:1}
body[data-mode=cms] .stagebar b{margin-left:auto;font-size:12px;font-variant-numeric:tabular-nums}
body[data-mode=cms] .summaryrow{font-size:12px;padding:12px 0;border-color:#e7ecf3}
body[data-mode=cms] .summaryrow strong,body[data-mode=cms] .summaryrow b{font-weight:500}
body[data-mode=cms] .empty{font-size:13px;background:#fafbfd;border:1px dashed #d8e1ed;border-radius:8px;margin:8px 0;padding:24px 16px;color:#617187}
body[data-mode=cms] :is(.tabs,.recordtabs){gap:6px}
body[data-mode=cms] .tabs button{font-size:12px;background:transparent;border-color:transparent;color:#566981;padding:9px 13px;white-space:nowrap}
body[data-mode=cms] .tabs button.active{background:#e7eff9;border-color:#d5e1f0;color:#193e69;font-weight:600}
body[data-mode=cms] .recordtabs{top:0;padding:12px 0;background:var(--bg)}
body[data-mode=cms] .facts{gap:24px;margin:24px 0}body[data-mode=cms] .facts small{font-size:11px;color:#617187;margin-bottom:5px}body[data-mode=cms] .facts strong{font-weight:500;font-size:14px}
body[data-mode=cms] .contextpill{background:#eaf0f8;color:#456180;font-size:10px;padding:2px 6px}
body[data-mode=cms] .contextline{font-size:11px;color:#617187;gap:7px}
body[data-mode=cms] .miniitem{border-color:#e7edf4;padding:15px 0}body[data-mode=cms] .miniitem p{font-size:12px}body[data-mode=cms] .miniitem small{font-size:11px}
body[data-mode=cms] .notifrow{padding:17px 10px;border-color:#e6ecf4}body[data-mode=cms] .notifrow small{font-size:12px;color:var(--muted)}body[data-mode=cms] .notifdot{background:#a87c2d}
body[data-mode=cms] .lockednotice{background:#edf4fc;color:#365b80;border-color:#d5e3f3}
body[data-mode=cms] .c360-hero{background:#142e4f;border:1px solid #2a476d;border-radius:14px;padding:28px 30px;box-shadow:none;position:relative;overflow:hidden}
body[data-mode=cms] .c360-hero::after{content:'';position:absolute;width:180px;height:180px;right:-40px;top:-100px;border:28px solid #ffffff04;border-radius:50%;pointer-events:none}
body[data-mode=cms] .c360-hero h1{color:white;font-size:30px;font-weight:500;margin:10px 0}
body[data-mode=cms] .c360-hero>small{color:#e0c489;font-size:10px}
body[data-mode=cms] .c360-hero p{color:#c6d4e6;font-size:13px}
body[data-mode=cms] .c360-hero button{background:#ffffff0b;border-color:#637b99;color:#edf3fa;font-size:12px}
body[data-mode=cms] .c360-hero button:hover{background:#ffffff18}
body[data-mode=cms] .c360-hero button.primary{background:white;color:#193f67;border-color:white}
body[data-mode=cms] .c360-tabs{border-color:var(--line);gap:4px;padding:15px 0!important}
body[data-mode=cms] .c360-tabs button{border:0;border-radius:7px;background:transparent;color:#58687b;font-size:12px;padding:10px 12px}
body[data-mode=cms] .c360-tabs button.active{background:#e4edf8;color:#193f67;font-weight:600}
body[data-mode=cms] .c360-section h2{font-size:16px}
body[data-mode=cms] .c360-card{background:#fafbfd;border-color:#e1e7ef;border-radius:9px;padding:19px}
body[data-mode=cms] .c360-metric{background:white;border-color:var(--line);border-radius:11px;padding:20px}
body[data-mode=cms] .c360-metric strong{font-size:24px;font-weight:600;letter-spacing:-.5px;font-variant-numeric:tabular-nums}
body[data-mode=cms] :is(.c360-metric small,.c360-facts dt,.c360-source){font-size:12px;color:var(--muted)}
body[data-mode=cms] .c360-facts dd{font-size:13px;font-weight:500}
body[data-mode=cms] dialog{border:1px solid #dbe3ee;border-radius:15px;padding:28px;box-shadow:0 24px 90px #0d203b36;max-height:90dvh;width:650px;max-width:calc(100vw - 32px)}
body[data-mode=cms] dialog::backdrop{background:#0c1c32a3;backdrop-filter:blur(3px)}
body[data-mode=cms] .modalhead{border-color:var(--line);padding-bottom:18px;margin-bottom:20px}
body[data-mode=cms] .modalhead h2{font-size:20px;font-weight:600}
body[data-mode=cms] form label{font-size:12px;font-weight:500;margin-top:18px;color:#35475e}
body[data-mode=cms] form :is(input,select,textarea){font-size:14px;margin-top:7px;min-height:43px}
body[data-mode=cms] .accordion{border-color:var(--line);background:#fafbfd;border-radius:8px}
body[data-mode=cms] .accordion summary{font-size:12px;font-weight:500;padding:14px}
body[data-mode=cms] .error{color:#b42318;font-size:12px}
body[data-mode=cms] .toast{top:20px;right:24px;bottom:auto;background:#173550;color:white;border:1px solid #355875;box-shadow:0 8px 30px #0c1c3226;padding:14px 20px;font-size:13px;border-radius:10px;z-index:150}
body[data-mode=cms] #journeyPlayer{margin:20px 32px 0;background:#eef4fb;border-color:#c8d9ed;border-radius:12px;color:var(--ink)}
body[data-mode=cms] #journeyPlayer :is(p,small){font-size:12px}
body[data-mode=cms] .tourcard{border-color:var(--line);box-shadow:0 20px 65px #12253e30;border-radius:14px}
body[data-mode=cms] .tourhighlight{outline-color:#ae873a!important}
body[data-mode=cms] #loginRoot{background:#0d223d url('login-bali.svg') center/cover no-repeat;grid-template-columns:minmax(0,1fr) 430px;gap:8vw;padding:60px max(7vw,24px)}
body[data-mode=cms] #loginRoot::before{background:linear-gradient(100deg,#07182c38,#10213e88)}
body[data-mode=cms] .loginhero{padding-bottom:80px;max-width:600px}
body[data-mode=cms] .loginhero .loginbrand{font-size:34px;font-weight:600;letter-spacing:4px}
body[data-mode=cms] .loginhero h2{font-size:clamp(32px,3.4vw,51px);font-weight:500;letter-spacing:-1.5px;color:white;line-height:1.2}
body[data-mode=cms] .loginhero p{font-size:15px;color:#d0dceb;line-height:1.8}
body[data-mode=cms] #loginRoot .loginpanel{padding:38px;border-radius:16px;border:1px solid #e4e9ef;box-shadow:0 24px 80px #04152940}
body[data-mode=cms] .bankword{color:#193c61;font-size:22px;font-weight:600;letter-spacing:2px}
body[data-mode=cms] .loginpanel h1{font-size:28px;font-weight:500}
body[data-mode=cms] #loginRoot .loginpanel input{background:white;min-height:46px;border-color:#cad6e3;font-size:14px}
body[data-mode=cms] #loginRoot .loginbutton{background:#174b79!important;border-color:#174b79;color:white;min-height:46px;margin-top:22px;font-size:14px}
body[data-mode=cms] .loginpanel small{color:#617187;font-size:10px}.loginfoot{font-size:11px;line-height:1.8}
body[data-mode=cms] .fieldmap{border:1px solid var(--line);border-radius:12px;overflow:hidden}
body[data-mode=cms] .fieldfilters label{font-size:12px;color:var(--muted)}
body[data-mode=cms] .memberlocation{border-color:var(--line);padding:14px;border-radius:9px}
body[data-mode=cms] .memberlocation.selected{background:#edf3fa;border-color:#a5bdd7}
body[data-mode=cms] .memberavatar{background:#e9f0f8;color:#2e567f}
@media(min-width:1600px){body[data-mode=cms] .content{padding-left:40px;padding-right:40px}}
@media(max-width:1200px){body[data-mode=cms]>aside{width:216px;padding-left:12px;padding-right:12px}body[data-mode=cms] main{margin-left:216px}body[data-mode=cms] .content{padding:26px 24px}body[data-mode=cms] main>header{padding:0 24px}body[data-mode=cms] .split{grid-template-columns:1fr}body[data-mode=cms] #title::before{display:none}body[data-mode=cms] #journeyLaunch{font-size:10px}body[data-mode=cms] .metrics{gap:12px}body[data-mode=cms] .metric{padding:19px 16px}body[data-mode=cms] .metric>.ui-metric-icon{right:13px}}
@media(max-width:1000px){body[data-mode=cms] #syncState{display:none}body[data-mode=cms] .metrics{grid-template-columns:repeat(2,minmax(0,1fr))}body[data-mode=cms] .intro{align-items:flex-start}body[data-mode=cms] .intro .actions{flex-shrink:0}body[data-mode=cms] .c360-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){body[data-mode=cms]>aside{position:static;width:100%;height:auto!important;display:block;padding:18px 16px 10px}body[data-mode=cms] aside .brand{padding:0 4px 14px;font-size:23px}body[data-mode=cms] aside .brand small{font-size:8px}body[data-mode=cms] aside .brand::after{display:none}body[data-mode=cms] aside nav{display:flex;overflow-x:auto!important;flex-wrap:nowrap;padding:0!important;gap:4px}body[data-mode=cms] aside nav button{min-width:auto;width:auto;flex-shrink:0;min-height:42px;font-size:12px;padding:9px 12px;gap:7px;white-space:nowrap}body[data-mode=cms] aside nav .ui-icon{width:16px;height:16px}body[data-mode=cms] main{margin-left:0}body[data-mode=cms] main>header{height:auto;min-height:66px;padding:12px 16px;flex-wrap:wrap;gap:8px}body[data-mode=cms] #title{font-size:13px;min-width:110px}body[data-mode=cms] #tourLaunch{display:none}body[data-mode=cms] main>header .user{padding-left:8px}body[data-mode=cms] #journeyLaunch{margin:0;font-size:10px}body[data-mode=cms] .content{padding:23px 16px 40px}body[data-mode=cms] h1{font-size:25px}body[data-mode=cms] .intro{flex-wrap:wrap;gap:14px;margin-bottom:22px}body[data-mode=cms] .intro>.actions{width:100%}body[data-mode=cms] .intro p{font-size:13px}body[data-mode=cms] .panel{padding:20px}body[data-mode=cms] .metrics{gap:10px}body[data-mode=cms] .metric{padding:17px 14px}body[data-mode=cms] .metric>span:not(.ui-metric-icon){font-size:11px;max-width:100%;padding-top:33px}body[data-mode=cms] .metric>strong{font-size:29px;margin-top:13px}body[data-mode=cms] .metric>.ui-metric-icon{top:13px;left:13px;right:auto;width:27px;height:27px}body[data-mode=cms] .metric>.ui-metric-icon .ui-icon{width:16px;height:16px}body[data-mode=cms] .records{grid-template-columns:1fr}body[data-mode=cms] .scaletools{padding:14px}body[data-mode=cms] .filterline>*{min-width:0;flex:1 1 130px}body[data-mode=cms] .rangechips{gap:6px;margin:14px 0}body[data-mode=cms] .rangechips button{font-size:11px;padding:8px 10px;min-height:38px}body[data-mode=cms] :is(input,select,textarea){font-size:16px}body[data-mode=cms] .searchbox input{font-size:16px}body[data-mode=cms] .c360-cardgrid{grid-template-columns:1fr}body[data-mode=cms] .c360-hero{padding:24px 20px}body[data-mode=cms] .c360-hero h1{font-size:26px}body[data-mode=cms] .c360-tabs button{font-size:12px}body[data-mode=cms] .c360-section{padding:20px}body[data-mode=cms] .c360-metric{padding:16px}body[data-mode=cms] .c360-metric strong{font-size:21px}body[data-mode=cms] .facts{gap:18px}body[data-mode=cms] #journeyPlayer{margin:16px}body[data-mode=cms] .toast{right:12px;top:12px;max-width:calc(100vw - 24px)}body[data-mode=cms] #loginRoot{grid-template-columns:1fr;padding:28px 20px;gap:20px}body[data-mode=cms] .loginhero{padding-bottom:0}body[data-mode=cms] #loginRoot .loginpanel{padding:28px;justify-self:center}body[data-mode=cms] .loginhero .loginbrand{font-size:26px}body[data-mode=cms] .datatable.membertable{min-width:640px}}
@media(prefers-reduced-motion:reduce){body[data-mode=cms] *,body[data-mode=cms] *::before,body[data-mode=cms] *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media print{.skip-link{display:none}body[data-mode=cms] main{margin-left:0}body[data-mode=cms] .content{padding:0;max-width:none}body[data-mode=cms] :is(.panel,.record,.metric,.c360-section){box-shadow:none;break-inside:avoid}}
/* ID scope keeps navigation above the global control specificity. */
body[data-mode=cms] #nav>button{color:#c4cede;border:1px solid transparent;background:transparent}
body[data-mode=cms] #nav>button:hover{background:#ffffff0b;color:white;border-color:transparent}
body[data-mode=cms] #nav>button.active{color:white;background:#253a56;border-color:#405572}
body[data-mode=cms] .c360-hero .actions button.primary:not(:first-child){background:#ffffff0b;border-color:#637b99;color:#edf3fa;box-shadow:none}
body[data-mode=cms] .c360-hero .actions button.primary:not(:first-child):hover{background:#ffffff18}