/* ======================================================================
   JustiX Production Build 0.6.1 — Precision Layout & Elegance Refinement
   Goal: finer visual rhythm, consistent icon/text alignment and zero overlap.
   Corporate palette remains unchanged.
   ====================================================================== */
:root{
  --jx-gap-1:6px;
  --jx-gap-2:8px;
  --jx-gap-3:12px;
  --jx-gap-4:16px;
  --jx-gap-5:20px;
  --jx-radius-control:12px;
  --jx-radius-card:18px;
  --jx-radius-panel:22px;
  --display:clamp(38px,3.05vw,52px);
}

/* Structural resilience ------------------------------------------------ */
.workspace,main,.view,.hero,.hero>div,.hero-visual,.card,.metric,.panel,.sheet,
.page-head,.page-head>div,.section-title,.section-title>div,.case-main,.case-main>div,
.activity-item>div,.sim-body,.builder-main,.builder-panel,.choice-card,.talent-card,
.passport-card,.legal-card,.learning-session,.court-side,.court-toolbar,.topbar,.search-wrap{
  min-width:0;
}
img,svg{max-width:100%}
button{line-height:1.2}
.primary-btn,.ghost-btn,.danger-btn,.icon-btn,.link-btn{
  align-items:center;
}
.primary-btn,.ghost-btn,.danger-btn{
  display:inline-flex;
  justify-content:center;
  gap:8px;
  white-space:nowrap;
  font-weight:680;
}
.primary-btn svg,.ghost-btn svg,.danger-btn svg,.icon-btn svg,.link-btn svg{
  flex:0 0 auto;
}
.primary-btn svg,.ghost-btn svg,.danger-btn svg{width:16px!important;height:16px!important;margin:0!important;vertical-align:0!important}
.link-btn{display:inline-flex;gap:6px;white-space:nowrap}

/* Overall rhythm ------------------------------------------------------- */
.app{gap:12px;padding:12px}
.sidebar{border-radius:22px;padding:16px 11px 11px}
.workspace{max-width:none}
.view{padding-inline:1px}

/* Brand + navigation --------------------------------------------------- */
.brand{gap:9px;padding:3px 9px 18px}.brand img{width:40px;height:40px}
.brand-copy{min-width:0}.brand-copy strong{font-size:21px;line-height:1}.brand-copy span{
  font-size:9.5px;letter-spacing:1.7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#8E9EB1
}
.nav{gap:2px}.nav-label{padding:14px 10px 6px;font-size:10px}
.nav-btn{grid-template-columns:22px minmax(0,1fr) auto;gap:9px;padding:9px 10px;min-height:40px;border-radius:12px;font-size:13px;font-weight:640}
.nav-btn svg{width:18px;height:18px;justify-self:center}.nav-btn>span:not(.nav-badge){min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nav-badge{font-size:10px;line-height:1;padding:4px 7px;min-width:24px}
.xp-card{padding:12px;border-radius:16px}.xp-line{gap:8px}.xp-line span,.xp-line b{white-space:nowrap}.account{padding:7px;grid-template-columns:38px minmax(0,1fr) 18px;gap:8px}.account-copy{min-width:0}.account-copy strong,.account-copy span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* Topbar --------------------------------------------------------------- */
.topbar{height:64px;border-radius:17px;padding:0 9px 0 16px;gap:12px}
.breadcrumb{min-width:128px;gap:8px}.search-wrap{flex:1 1 320px;max-width:720px}.search{height:42px;border-radius:12px;padding-right:62px}
.top-actions{display:flex;align-items:center;gap:7px;margin-left:auto;flex:0 0 auto}.top-actions .icon-btn{width:42px;height:42px;border-radius:12px}.top-actions .primary-btn{min-height:44px;padding:0 15px;border-radius:13px}
.shortcut{right:8px}

/* Hero ----------------------------------------------------------------- */
.hero{
  min-height:430px;
  padding:34px 36px;
  grid-template-columns:minmax(0,1.04fr) minmax(360px,.96fr);
  gap:28px;
  border-radius:24px;
  align-items:center;
}
.hero>div:first-child{max-width:650px}
.hero .eyebrow{font-size:10px;letter-spacing:2.35px}
.hero h1{
  font-size:var(--display)!important;
  line-height:1!important;
  letter-spacing:-1.25px!important;
  max-width:545px;
  margin:11px 0 15px;
  font-weight:600;
}
.hero p{max-width:590px;font-size:14.5px!important;line-height:1.62;color:#CDD6E1}
.hero-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px;max-width:620px}
.hero-actions .primary-btn,.hero-actions .ghost-btn{min-height:44px;border-radius:12px;padding-inline:15px;font-size:13.5px}
.hero-actions .ghost-btn[data-view="legal"]{padding-inline:12px}
.hero-visual{justify-content:end;align-self:center}

/* Hearing preview: fixed geometry so labels never collide -------------- */
.court-mini{
  width:min(100%,420px);
  height:278px;
  border-radius:22px;
  padding:24px;
  overflow:hidden;
  position:relative;
}
.court-mini::before{left:20px;top:17px;font-size:9px!important;padding:6px 9px}
.court-mini::after{right:20px;top:17px;font-size:9px!important;padding:6px 9px}
.court-mini .person{min-width:0}
.court-mini .person.judge{margin-top:31px;gap:4px;position:relative;z-index:2}
.court-mini .person.judge .avatar{width:42px;height:42px;border-radius:13px;font-size:11px}
.court-mini .person.judge strong{display:block;font-size:12.5px;line-height:1.25;margin-top:2px;white-space:nowrap}
.court-mini .person.judge>span:last-child{display:block;font-size:11px;line-height:1.25;color:#91A2B7;white-space:nowrap}
.court-mini .bench{top:120px;left:31%;right:31%;height:5px;border-radius:999px;z-index:1}
.mini-lawyers{
  position:absolute;
  left:22px;right:22px;bottom:58px;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:22px;
  margin:0!important;
  align-items:center;
}
.mini-lawyers .person{
  display:grid;
  grid-template-columns:42px minmax(0,1fr);
  align-items:center;
  gap:9px;
}
.mini-lawyers .person .avatar{width:42px;height:42px;border-radius:13px;font-size:10px;flex:none}
.mini-lawyers .person>div{min-width:0}
.mini-lawyers .person strong{display:block;font-size:11.5px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mini-lawyers .person span:not(.avatar){display:block;font-size:10.5px;line-height:1.25;color:#8FA1B6;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.court-mini .wave{left:auto;right:18px;bottom:14px;min-height:34px;padding:7px 9px;border-radius:11px;max-width:170px}
.court-mini .wave small{font-size:10.5px!important;white-space:nowrap}

/* Metric strip --------------------------------------------------------- */
.metrics{border-radius:18px;margin-top:10px}
.metric{min-height:110px;padding:16px 74px 16px 17px;display:block;position:relative}
.metric small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.metric h3{font-size:24px;line-height:1.05;margin:8px 0 5px;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.metric p{font-size:11.5px;line-height:1.4;max-width:100%}
.metric .ring{right:15px;bottom:15px;width:50px;height:50px}.metric .ring::after{width:39px;height:39px}.metric .ring b{font-size:11px}

/* Dashboard cards ------------------------------------------------------ */
.dash-grid{gap:10px;margin-top:10px;grid-template-columns:minmax(0,1.42fr) minmax(285px,.58fr)}
.dash-grid>.card{border-radius:18px;padding:18px}
.section-title{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-bottom:12px}
.section-title>div{min-width:0}.section-title h2{font-size:18px;line-height:1.2;margin-top:3px}.section-title small{font-size:10.5px!important}.section-title>.chip,.section-title>.link-btn{flex:0 0 auto}
.case-row{grid-template-columns:minmax(0,1.7fr) minmax(82px,.62fr) minmax(64px,.45fr) auto 38px;gap:10px;padding:11px 12px}
.case-main{min-width:0}.case-icon{flex:0 0 38px}.case-main b,.case-main span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.case-cell{min-width:0}.case-cell b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.activity{gap:11px}.activity-item{grid-template-columns:32px minmax(0,1fr) auto;gap:10px;align-items:start}.activity-item>div{min-width:0}.activity-item b,.activity-item p{overflow-wrap:anywhere}.activity-item time{white-space:nowrap;padding-top:2px}

/* Generic fine card language ------------------------------------------ */
.card,.panel,.metric,.sheet,.modal-card,.sim-card,.choice-card,.learning-session,.learning-focus,.passport-card,.talent-card,.legal-card,.prod-card,.beta-card{border-radius:var(--jx-radius-card)}
.page-head{align-items:flex-start;margin:8px 3px 16px;gap:18px}.page-head>div{min-width:0}.page-head h1{font-size:clamp(28px,2.45vw,38px);line-height:1.08;letter-spacing:-.85px}.page-head p{max-width:760px}.head-actions{align-items:center;justify-content:flex-end;gap:8px;flex:0 0 auto}
.filters{gap:8px;align-items:center;flex-wrap:wrap}.filter-search{min-width:220px;flex:1 1 260px}.filters .select{flex:0 1 auto;max-width:220px}
.tabs,.segment{padding:3px;border-radius:12px}.tabs button,.segment button{border-radius:10px;padding-inline:11px;white-space:nowrap}
.chip,.pill,.status,.tag,.badge,.rank,.verified,.shortcut-tag{line-height:1.15;white-space:nowrap}

/* Icon + copy discipline across modules ------------------------------- */
.activity-icon,.case-icon,.choice-icon,.backend-icon,.challenge-icon,.privacy-icon,.cert-icon,.provider-logo,.talent-icon,.passport-icon{
  flex:0 0 auto;
}
.agent-head,.persona-preview-head,.provider-head,.talent-section-head,.learning-session-head,.legal-search-head,.court-toolbar,.sim-footer,.meta-line{
  min-width:0;
}
.meta-line,.sim-footer,.passport-tags,.season-meta,.provider-tags,.talent-actions,.learning-actions{flex-wrap:wrap}
.choice-card{overflow:hidden}.choice-card b,.choice-card small{max-width:100%;overflow-wrap:anywhere}
.sim-body h3,.sim-body p{overflow-wrap:anywhere}.sim-footer{gap:8px}.sim-footer .link-btn{margin-left:auto}

/* Tables: preserve column separation and ellipsis ---------------------- */
.table-head,.table-row{column-gap:12px}.table-row>*{min-width:0}.table-row>span,.table-row b,.table-row .title span{overflow:hidden;text-overflow:ellipsis}.table-row>span{white-space:nowrap}.table-row .title{min-width:0}.table-row .title>div{min-width:0}.table-row .title b,.table-row .title span{display:block;white-space:nowrap}

/* Courtroom controls --------------------------------------------------- */
.court-toolbar{gap:10px;align-items:center}.court-toolbar .title{min-width:0;flex:1 1 auto}.court-toolbar .title b,.court-toolbar .title span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.segment{display:flex;flex:0 0 auto}.round-btn{display:inline-grid;place-items:center;flex:0 0 auto}.court-label{overflow:hidden;text-overflow:ellipsis}.chat-form{gap:8px}.chat-form input{min-width:0}

/* Forms / builder ------------------------------------------------------ */
.field{min-width:0}.field>span{line-height:1.3}.field input,.field select,.field textarea{min-width:0;width:100%}.builder-actions{gap:12px;flex-wrap:wrap}.builder-actions>div{flex-wrap:wrap}.builder-progress>*{min-width:0}.builder-progress b,.builder-progress span{overflow-wrap:anywhere}.choice-grid>*{min-width:0}.agent-config{min-width:0}.agent-head{display:grid;grid-template-columns:auto minmax(0,1fr);gap:9px}.agent-head>div{min-width:0}.agent-head b,.agent-head small{overflow-wrap:anywhere}

/* Responsive collision prevention ------------------------------------ */
@media(max-width:1280px){
  :root{--sidebar:222px;--display:clamp(38px,3.4vw,48px)}
  .brand-copy span{font-size:9px;letter-spacing:1.4px}
  .breadcrumb{min-width:auto}.breadcrumb span{display:none}.search-wrap{min-width:180px}.top-actions .primary-btn{padding-inline:12px}
  .hero{grid-template-columns:minmax(0,1fr) minmax(330px,.84fr);padding:30px;min-height:410px;gap:22px}.hero h1{max-width:510px}.court-mini{width:min(100%,390px);height:270px}
  .mini-lawyers{left:18px;right:18px;gap:15px}.mini-lawyers .person{grid-template-columns:38px minmax(0,1fr);gap:7px}.mini-lawyers .person .avatar{width:38px;height:38px}
  .dash-grid{grid-template-columns:minmax(0,1.25fr) minmax(270px,.75fr)}
}
@media(max-width:1100px){
  .topbar{gap:8px}.search{font-size:14px}.top-actions{gap:5px}.top-actions .icon-btn{width:40px;height:40px}.top-actions .primary-btn{font-size:13px;padding-inline:10px}
  .case-row{grid-template-columns:minmax(0,1.65fr) minmax(70px,.52fr) minmax(58px,.42fr) auto 36px}
}
@media(max-width:1024px){
  :root{--display:clamp(36px,4.7vw,44px)}
  .hero{grid-template-columns:1fr;padding:28px;min-height:auto}.hero>div:first-child{max-width:680px}.hero h1{max-width:520px}.hero-visual{justify-content:center}.court-mini{width:min(100%,480px);height:276px}
  .dash-grid{grid-template-columns:1fr}.activity{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:18px}
}
@media(max-width:920px){
  .app{gap:0}.topbar{height:60px;padding-inline:9px}.mobile-logo{min-width:0}.mobile-logo span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.top-actions{margin-left:auto}.top-actions .icon-btn{width:40px;height:40px}
}
@media(max-width:768px){
  :root{--display:clamp(32px,7.8vw,38px)}
  .hero{padding:22px 19px;gap:17px;border-radius:20px}.hero h1{max-width:480px;line-height:1.02!important;letter-spacing:-.75px!important}.hero p{font-size:14px!important}.hero-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px}.hero-actions .primary-btn,.hero-actions .ghost-btn{width:100%;min-height:44px}.hero-actions .ghost-btn[data-view="legal"]{display:none!important}
  .court-mini{height:258px;width:min(100%,440px)}.court-mini .bench{top:112px}.mini-lawyers{bottom:55px}.court-mini .wave{bottom:12px}
  .metrics{grid-template-columns:repeat(2,1fr)}.metric{min-height:104px;padding:15px 68px 15px 15px}.metric h3{font-size:22px}.metric .ring{width:46px;height:46px}.metric .ring::after{width:36px;height:36px}
  .activity{grid-template-columns:1fr}.case-row{grid-template-columns:minmax(0,1fr) auto 36px}.case-cell{display:none}.case-row>.status{display:inline-flex}.section-title{gap:10px}
  .page-head{flex-direction:column}.head-actions{width:100%;justify-content:flex-start}.filters .select{max-width:none;flex:1 1 145px}
  .mobile-tabs button{min-width:0}.mobile-tabs button span{max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:9.5px!important}
}
@media(max-width:480px){
  :root{--display:clamp(30px,8.6vw,34px)}
  .hero{padding:19px 16px}.hero h1{max-width:100%;margin-bottom:12px}.hero p{font-size:13.5px!important}.hero-actions{grid-template-columns:1fr}.court-mini{height:244px;padding:20px}.court-mini::before,.court-mini::after{top:15px}.court-mini .person.judge{margin-top:29px}.court-mini .bench{top:107px;left:30%;right:30%}.mini-lawyers{left:16px;right:16px;bottom:52px;gap:10px}.mini-lawyers .person{grid-template-columns:34px minmax(0,1fr);gap:6px}.mini-lawyers .person .avatar{width:34px;height:34px;border-radius:11px}.mini-lawyers .person strong{font-size:10.5px}.mini-lawyers .person span:not(.avatar){font-size:9.5px}.court-mini .wave small{font-size:9.5px!important}
  .metrics{grid-template-columns:1fr}.metric{border-right:0!important;border-bottom:1px solid rgba(255,255,255,.055)!important}.metric:last-child{border-bottom:0!important}.metric:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.055)!important}
  .top-actions .icon-btn:first-child{display:none}.top-actions .primary-btn{display:none}
  .case-row{grid-template-columns:minmax(0,1fr) auto 36px}.status{font-size:10px}
  .page-head h1{font-size:28px}.page-head p{font-size:13.5px}.head-actions{display:grid;grid-template-columns:1fr 1fr}.head-actions>*{width:100%}
}
@media(min-width:1600px){
  :root{--sidebar:240px;--display:clamp(44px,2.75vw,54px)}
  .hero{min-height:446px;padding:36px 40px}.hero h1{max-width:565px}.hero p{font-size:15.5px!important}.court-mini{width:min(100%,430px);height:282px}
}
@media(min-width:1920px){
  :root{--sidebar:248px;--display:clamp(46px,2.6vw,56px)}
  .app{max-width:2200px;margin-inline:auto}.hero{min-height:460px;padding:38px 42px}.topbar{height:68px}.nav-btn{font-size:14px}.hero p{font-size:16px!important}.court-mini{width:min(100%,440px);height:286px}
}