/* JX Ledger V6.1 — production UX layer
   Keeps the V6 business/database logic intact and only normalizes layout, mobile density and control clarity. */
:root{
  --ux-radius:14px;
  --ux-radius-sm:10px;
  --ux-shadow:0 6px 20px rgba(35,51,75,.055);
  --ux-control:40px;
}
html{background:#f5f7fa}
body{background:#f5f7fa}
.card{border:1px solid #e8edf3;box-shadow:var(--ux-shadow);border-radius:var(--ux-radius)}
.btn,.icon-btn,.lang-switch{white-space:nowrap;line-height:1.15}
.btn{border-radius:10px;padding:8px 11px}
.btn.compact{min-height:32px;padding:6px 9px;font-size:11px}
.btn.primary{background:#0a84ff;box-shadow:none}
.create-action{flex:0 0 auto;white-space:nowrap;max-width:max-content}
.card-head{align-items:center;margin-bottom:11px}
.card-head>div:first-child{min-width:0}
.card-head p{max-width:760px;line-height:1.5}
.field{min-width:0}.field input,.field select,.field textarea{max-width:100%;min-width:0;border-radius:10px;min-height:var(--ux-control);padding:8px 10px;background:#fff}
.field select{padding-right:28px}
.field label{font-size:10px;margin-bottom:5px}
.filters{gap:8px}
.filters .field{flex:1 1 150px;max-width:250px}
.smart-filters{align-items:end}
.smart-filters .btn{min-width:70px}
.empty{padding:22px 12px}
.empty-icon{font-size:20px}
.table-hint{color:#8a95a5}
.mobile-stack .btn{white-space:nowrap}
.topbar{height:72px;padding:12px 20px;background:rgba(245,247,250,.92)}
.topbar h1{font-size:20px}
.top-entry{white-space:nowrap}
.content{padding-top:14px}

/* Month switcher: avoid native Android/iOS month input clipping. */
.dashboard-period,.report-period-row{margin-bottom:12px}
.period-switcher{display:flex;align-items:end;gap:10px;max-width:520px}
.period-label{font-size:10px;color:#738095;font-weight:750;padding-bottom:10px;white-space:nowrap}
.period-controls{display:grid;grid-template-columns:116px 106px auto;gap:8px;align-items:end;min-width:0}
.period-field{display:block;min-width:0}
.period-field span{display:block;font-size:9px;color:#8893a4;font-weight:700;margin:0 0 4px}
.period-field select{width:100%;height:38px;border:1px solid #dce3ec;border-radius:10px;background:#fff;color:#172033;padding:0 28px 0 10px;font:inherit;outline:none}
.period-submit{height:38px;min-width:84px}
.report-period-row{display:flex;align-items:end;gap:10px;justify-content:space-between}
.report-export{margin-left:auto}

/* Dashboard: keep the three related numbers together instead of stacking them into a very tall card. */
.operating-card{padding:13px}
.operating-stats{border-radius:10px}
.operating-stats>div{padding:10px 9px}
.operating-stats span,.operating-stats small{line-height:1.35}
.operating-stats b{font-variant-numeric:tabular-nums}
.todo-grid a{border-radius:10px}

/* Form rhythm */
.entry-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px}
.entry-head h2{margin:0;font-size:15px}
.entry-head p{margin:3px 0 0;color:#7b8799;font-size:10px;line-height:1.5}
.entry-card{padding-top:13px}
.entry-section-title{display:flex;justify-content:space-between;gap:12px;align-items:baseline;padding-bottom:10px;margin-bottom:11px;border-bottom:1px solid #edf0f4}
.entry-section-title b{font-size:12px}
.entry-section-title span{font-size:9px;color:#8a95a5;text-align:right}
.money-input-large{font-weight:800;font-variant-numeric:tabular-nums}
.entry-note textarea{min-height:72px}

/* Denser archive/project filters */
.archive-summary>div,.page-summary-row>div{border-radius:10px}
.archive-head .card-head{margin-bottom:10px}

@media(max-width:760px){
  :root{--ux-control:40px}
  body{font-size:12px}
  .topbar{height:58px;min-height:58px;padding:8px 10px;align-items:center}
  .top-title{min-width:0}
  .top-title .eyebrow{display:none}
  .topbar h1{font-size:19px;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:52vw}
  .top-actions{gap:5px;flex:0 0 auto}
  .lang-switch{height:32px;min-width:36px;border-radius:9px}
  .top-actions .btn.compact{height:32px;min-height:32px;padding:5px 9px;border-radius:9px;font-size:11px}
  .content{padding:10px 10px calc(76px + var(--safe-bottom))}
  .section-gap{height:9px}
  .card{padding:12px;border-radius:13px;box-shadow:0 4px 16px rgba(35,51,75,.045)}
  .card.flush{padding:0}
  .card-head{margin-bottom:9px;align-items:flex-start}
  .card-head h2{font-size:13px}
  .card-head p{font-size:9px;line-height:1.45;margin-top:3px}
  .create-action{font-size:10.5px!important;min-height:31px!important;padding:5px 8px!important}
  .field label{font-size:10px}
  .field input,.field select,.field textarea{font-size:16px;min-height:40px;border-radius:10px;padding-top:7px;padding-bottom:7px}
  .field textarea{min-height:76px}

  /* Dashboard month selector: year / month / apply have a deliberate, balanced width. */
  .dashboard-period{margin-bottom:9px}
  .period-switcher{display:block;max-width:none}
  .period-label{padding:0 0 6px;font-size:10px}
  .period-controls{grid-template-columns:1fr 1fr 1fr;gap:7px;width:100%}
  .period-field span{font-size:8.5px;margin-bottom:3px}
  .period-field select,.period-submit{height:40px;min-width:0;width:100%;font-size:14px}
  .period-submit{padding-left:5px;padding-right:5px}
  .report-period-row{display:block}
  .report-export{width:100%;margin-top:8px}

  /* Keep summary cards compact: don't stack each metric vertically on narrow phones. */
  .dashboard-operating-grid{gap:9px}
  .operating-card{padding:11px}
  .operating-stats{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .operating-stats>div{padding:9px 7px}
  .operating-stats span,.operating-stats small{font-size:8px}
  .operating-stats b{font-size:12px!important;margin-top:4px;letter-spacing:-.2px}
  .todo-grid{grid-template-columns:1fr 1fr;gap:7px}
  .todo-grid a{padding:9px}
  .todo-grid b{font-size:16px}
  .todo-grid span{font-size:8.5px}

  /* Filter panels: search gets the full row; structured filters stay two-column. */
  .smart-filters{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px;width:100%}
  .smart-filters .field{width:100%;max-width:none!important;min-width:0!important;flex:none!important}
  .smart-filters .field:first-child{grid-column:1/-1}
  .smart-filters .btn{width:100%;min-width:0}
  .smart-filters>a.btn:last-child:nth-of-type(3){grid-column:1/-1}

  /* Transaction entry: two-column for short fields, full width for project/contract/notes. */
  .entry-head{padding:10px 11px;align-items:flex-start}
  .entry-head h2{font-size:14px}
  .entry-head p{font-size:9px}
  .entry-card{padding:11px}
  .entry-section-title{display:block;margin-bottom:9px;padding-bottom:8px}
  .entry-section-title span{display:block;text-align:left;margin-top:3px;line-height:1.45}
  .entry-grid{grid-template-columns:1fr 1fr!important;gap:9px 8px!important}
  .entry-grid>.span-2,.entry-grid>.span-4,.entry-grid>.entry-related-start,.entry-grid>.entry-note{grid-column:1/-1!important}
  .entry-grid .field{min-width:0}
  .entry-grid>.field:nth-child(1){order:1}
  .entry-grid>.field:nth-child(2){order:2}
  .entry-grid>.field:nth-child(10){order:3}
  .entry-grid>.field:nth-child(11){order:4}
  .entry-grid>.field:nth-child(13){order:5}
  .entry-grid>.field:nth-child(12){order:6}
  .entry-grid>.field:nth-child(3){order:7}
  .entry-grid>.field:nth-child(4){order:8}
  .entry-grid>.field:nth-child(5){order:9}
  .entry-grid>.field:nth-child(6){order:10}
  .entry-grid>.field:nth-child(7){order:11}
  .entry-grid>.field:nth-child(8),.entry-grid>.field:nth-child(9){order:12}
  .entry-grid>.field:nth-child(14){order:13}
  .entry-grid>.field:nth-child(15){order:14}
  .entry-grid>.field:nth-child(16){order:15}
  .entry-grid>.field:nth-child(17),.entry-grid>.field:nth-child(18){order:16}
  .entry-grid>.field:nth-child(19){order:17}
  .entry-grid>.field:nth-child(20){order:18}
  .entry-grid .helper{line-height:1.35}
  .form-actions{position:sticky;bottom:calc(64px + var(--safe-bottom));z-index:18;margin:12px -2px -2px;padding:8px;background:rgba(255,255,255,.96);border:1px solid #e5eaf0;border-radius:11px;box-shadow:0 8px 24px rgba(25,42,65,.10)}
  .form-actions .btn{flex:1;min-height:40px}

  /* Lists/tables as clean record cards, with less dead space. */
  .table-hint{padding:7px 10px;font-size:9px}
  .mobile-stack tbody{gap:7px;padding:0 8px 8px}
  .mobile-stack tr{padding:8px 9px;border-radius:11px;background:#fff}
  .mobile-stack td{grid-template-columns:76px minmax(0,1fr);gap:7px;padding:4px 0;font-size:10.5px}
  .mobile-stack td::before{font-size:8.5px}
  .empty{padding:24px 10px}
  .empty p{line-height:1.5}

  /* Bottom nav: app-like but not a large floating white block. */
  .mobile-nav{left:8px;right:8px;bottom:calc(7px + var(--safe-bottom));height:56px;padding:4px;border-radius:16px;box-shadow:0 8px 24px rgba(24,41,67,.12)}
  .mobile-nav a{border-radius:12px}
  .mobile-nav i{font-size:16px}
  .mobile-nav span{font-size:8px}
}

@media(max-width:430px){
  .topbar h1{max-width:48vw;font-size:18px}
  .smart-filters{grid-template-columns:1fr 1fr!important}
  .smart-filters .field:first-child{grid-column:1/-1}
  .operating-stats{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .operating-stats b{font-size:11px!important}
  .entry-grid{grid-template-columns:1fr 1fr!important}
  .entry-grid>.span-2,.entry-grid>.span-4,.entry-grid>.entry-related-start,.entry-grid>.entry-note{grid-column:1/-1!important}
  .archive-summary{grid-template-columns:repeat(3,minmax(0,1fr))}
  .archive-summary>div{padding:8px 7px}
  .archive-summary span{font-size:8px;line-height:1.3}
  .archive-summary b{font-size:12px}
}

@media(max-width:350px){
  .period-controls{grid-template-columns:1fr 1fr}
  .period-submit{grid-column:1/-1}
  .topbar h1{max-width:44vw}
  .entry-grid{grid-template-columns:1fr!important}
  .entry-grid>*{grid-column:1!important}
  .operating-stats{grid-template-columns:1fr 1fr!important}
  .operating-stats>div:first-child{grid-column:1/-1}
}

@media(max-width:760px){.mobile-stack tr:has(.empty){display:block;padding:0;background:transparent;border:0}.mobile-stack tr:has(.empty) td{display:block;padding:0}.mobile-stack tr:has(.empty) td::before{display:none}.mobile-stack tr:has(.empty) .empty{background:#fff;border:1px solid #edf0f4;border-radius:11px;padding:24px 10px}.card-head p{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}}

/* V6.2 contract archive: compact, operational mobile layout */
.desktop-only{display:block}.mobile-only{display:none}
.contract-archive-shell{overflow:visible}
.contract-create-btn{word-break:keep-all;white-space:nowrap!important;flex-shrink:0}
.contract-mobile-list{display:none}

@media(max-width:760px){
  .desktop-only{display:none!important}.mobile-only{display:block!important}
  .contract-archive-shell{padding:11px!important}
  .contract-archive-titlebar{align-items:center!important;margin-bottom:8px!important}
  .contract-archive-titlebar>div:first-child{min-width:0;flex:1}
  .contract-archive-titlebar h2{font-size:14px!important;line-height:1.2}
  .contract-archive-titlebar p{display:none!important}
  .contract-create-btn{font-size:10px!important;min-height:30px!important;padding:5px 9px!important;border-radius:9px!important}

  .contract-summary-strip{gap:5px;margin:0 0 9px!important}
  .contract-summary-strip>div{padding:7px 7px!important;background:#f7f9fc!important;border:1px solid #eef1f4;border-radius:9px!important;min-width:0}
  .contract-summary-strip span{font-size:8px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .contract-summary-strip b{font-size:clamp(10px,3.2vw,13px)!important;letter-spacing:-.25px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-variant-numeric:tabular-nums}

  .contract-mobile-filter{display:grid!important;gap:7px}
  .contract-search-line{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px}
  .contract-search-line input{width:100%;height:36px;min-width:0;border:1px solid #dce3ec;border-radius:9px;background:#fff;padding:0 10px;font-size:14px;color:var(--ink);outline:none}
  .contract-search-line input:focus{border-color:#8fc9ff;box-shadow:0 0 0 3px rgba(10,132,255,.07)}
  .contract-search-line .btn{height:36px;min-width:58px;padding:5px 9px}
  .contract-filter-more{border-top:1px solid #edf0f4;padding-top:6px}
  .contract-filter-more summary{display:flex;align-items:center;justify-content:space-between;gap:8px;list-style:none;cursor:pointer;color:#566477;font-size:9.5px;font-weight:750;padding:2px 1px}
  .contract-filter-more summary::-webkit-details-marker{display:none}
  .contract-filter-more summary:after{content:'⌄';font-size:13px;color:#95a0af;margin-left:auto}
  .contract-filter-more[open] summary:after{content:'⌃'}
  .contract-filter-more summary em{font-style:normal;font-weight:500;color:#98a2b0;font-size:8.5px;max-width:58%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .contract-filter-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:7px}
  .contract-filter-grid>.field:first-child{grid-column:1/-1}
  .contract-filter-grid .field label{font-size:8.5px;margin-bottom:3px}
  .contract-filter-grid .field select{height:36px;min-height:36px;font-size:14px;padding:5px 28px 5px 8px}
  .contract-filter-actions{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:7px}
  .contract-filter-actions .btn{height:34px}

  .contract-mobile-list{display:grid!important;gap:7px;padding-bottom:2px}
  .contract-mobile-card{position:relative;display:block;text-decoration:none;color:var(--ink);background:#fff;border:1px solid #e8edf3;border-radius:12px;padding:10px 11px 8px;box-shadow:0 3px 12px rgba(35,51,75,.035);overflow:hidden}
  .contract-mobile-card:before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:#aab5c3}
  .contract-mobile-card.side-income:before{background:#33a876}
  .contract-mobile-card.side-cost:before{background:#d59a43}
  .contract-mobile-card.side-neutral:before{background:#7890aa}
  .contract-mobile-main{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:9px;align-items:start}
  .contract-mobile-title{font-size:12px;font-weight:800;color:#14365d;line-height:1.42;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;word-break:break-word}
  .contract-mobile-amount{font-size:12px;font-weight:850;white-space:nowrap;font-variant-numeric:tabular-nums;color:#182536;letter-spacing:-.2px}
  .contract-mobile-subline{display:flex;align-items:center;gap:4px;margin-top:4px;min-width:0;color:#8995a5;font-size:8.5px;line-height:1.35}
  .contract-mobile-subline>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
  .contract-mobile-subline .dot-sep{flex:0 0 auto;overflow:visible}
  .contract-mobile-project{flex:1}
  .contract-mobile-badges{display:flex;align-items:center;gap:4px;flex-wrap:wrap;margin-top:7px}
  .contract-mobile-badges .badge{min-height:20px;padding:2px 7px;font-size:8px}
  .contract-mobile-counterparty{display:grid;grid-template-columns:38px minmax(0,1fr);gap:6px;align-items:baseline;margin-top:7px;padding-top:7px;border-top:1px solid #f0f2f5}
  .contract-mobile-counterparty span{font-size:8px;color:#929dac}
  .contract-mobile-counterparty b{font-size:9.5px;font-weight:650;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .contract-mobile-footer{display:flex;align-items:center;gap:10px;margin-top:7px;color:#8c97a6;font-size:8.5px}
  .contract-mobile-footer strong{margin-left:auto;color:#3679b8;font-size:9px;font-weight:750}
  .contract-mobile-list .pager-shell{margin-top:2px}

  /* Generic mobile list density: don't let label/value tables occupy the whole screen. */
  .mobile-stack tr{padding:7px 9px!important;border-radius:10px!important}
  .mobile-stack td{padding:3px 0!important;grid-template-columns:68px minmax(0,1fr)!important;gap:6px!important}
  .mobile-stack td::before{font-size:8px!important}
}

@media(max-width:390px){
  .contract-summary-strip b{font-size:10px!important}
  .contract-mobile-main{grid-template-columns:1fr}
  .contract-mobile-amount{margin-top:1px;color:#16283e}
  .contract-mobile-title{-webkit-line-clamp:2}
}


/* V6.3 — compact auto month switcher
   Year/month are separate native selects to avoid Android type=month clipping.
   Selecting either value submits immediately; no visible Apply button is needed. */
.period-switcher.auto-period-switcher{
  display:flex;
  align-items:center;
  gap:8px;
  max-width:330px;
  margin:0;
}
.auto-period-switcher .period-label{
  padding:0;
  margin:0;
  flex:0 0 auto;
  font-size:10px;
  line-height:36px;
  color:#738095;
  font-weight:750;
}
.auto-period-switcher .period-controls{
  display:grid;
  grid-template-columns:92px 82px;
  gap:6px;
  width:auto;
  min-width:0;
  align-items:center;
}
.auto-period-switcher .period-field{min-width:0;margin:0}
.auto-period-switcher .period-sr-label{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
  border:0!important;
}
.auto-period-switcher .period-field select{
  width:100%;
  height:36px;
  min-height:36px;
  margin:0;
  border:1px solid #dce3ec;
  border-radius:10px;
  background:#fff;
  color:#172033;
  padding:0 26px 0 10px;
  font-size:13px;
  font-weight:650;
  line-height:36px;
  outline:none;
  box-shadow:none;
}
.auto-period-switcher .period-field select:focus{
  border-color:#8fc9ff;
  box-shadow:0 0 0 3px rgba(10,132,255,.07);
}
.auto-period-switcher .period-submit{display:none}

@media(max-width:760px){
  .dashboard-period{margin:0 0 8px!important}
  .dashboard-period .auto-period-switcher{
    display:flex!important;
    align-items:center!important;
    gap:7px!important;
    max-width:none!important;
    width:max-content!important;
  }
  .dashboard-period .auto-period-switcher .period-label{
    padding:0!important;
    font-size:9.5px!important;
    line-height:34px!important;
    white-space:nowrap!important;
  }
  .dashboard-period .auto-period-switcher .period-controls{
    display:grid!important;
    grid-template-columns:88px 76px!important;
    gap:6px!important;
    width:auto!important;
  }
  .dashboard-period .auto-period-switcher .period-field select{
    height:34px!important;
    min-height:34px!important;
    padding:0 23px 0 9px!important;
    font-size:15px!important;
    border-radius:9px!important;
  }

  /* reports use the same auto-switcher but can wrap around the export action */
  .report-period-row .auto-period-switcher{
    display:flex!important;
    width:max-content!important;
    max-width:100%!important;
    align-items:center!important;
  }
  .report-period-row .auto-period-switcher .period-controls{
    grid-template-columns:88px 76px!important;
  }
}

@media(max-width:360px){
  .dashboard-period .auto-period-switcher{gap:5px!important}
  .dashboard-period .auto-period-switcher .period-label{font-size:9px!important}
  .dashboard-period .auto-period-switcher .period-controls{grid-template-columns:82px 70px!important;gap:5px!important}
  .dashboard-period .auto-period-switcher .period-field select{font-size:14px!important;padding-left:8px!important;padding-right:20px!important}
}

/* V6.4 — reliable single month dropdown, no apply button */
.dashboard-period.compact-month-nav,
.compact-month-nav{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  margin:0 0 10px!important;
  width:max-content!important;
  max-width:100%!important;
}
.compact-month-label{
  margin:0!important;
  padding:0!important;
  color:#738095!important;
  font-size:10px!important;
  font-weight:750!important;
  white-space:nowrap!important;
  line-height:34px!important;
}
.compact-month-control{width:144px!important;min-width:0!important}
.compact-month-control select{
  appearance:auto!important;
  -webkit-appearance:auto!important;
  display:block!important;
  width:100%!important;
  height:36px!important;
  min-height:36px!important;
  margin:0!important;
  padding:0 8px!important;
  border:1px solid #dce3ec!important;
  border-radius:10px!important;
  background:#fff!important;
  color:#172033!important;
  font-size:13px!important;
  font-weight:650!important;
  line-height:36px!important;
  box-shadow:none!important;
  outline:none!important;
}
.compact-month-control select:focus{border-color:#8fc9ff!important;box-shadow:0 0 0 3px rgba(10,132,255,.07)!important}
.compact-report-period{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:10px!important}
.compact-report-period .compact-month-nav{margin-bottom:0!important}

@media(max-width:760px){
  .dashboard-period.compact-month-nav{margin:0 0 8px!important}
  .compact-month-label{font-size:9.5px!important;line-height:34px!important}
  .compact-month-control{width:138px!important}
  .compact-month-control select{height:34px!important;min-height:34px!important;font-size:13px!important;border-radius:9px!important}
  .compact-report-period{align-items:center!important;flex-wrap:wrap!important}
  .compact-report-period .report-export{margin-left:auto!important}
}
@media(max-width:360px){
  .compact-month-nav{gap:6px!important}
  .compact-month-control{width:128px!important}
  .compact-month-control select{font-size:12.5px!important}
}


/* V6.5 operational mobile project cards + payment-plan clarity */
.project-mobile-list{display:none}
.project-desktop-table{display:block}
.contract-plan-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0 0 10px}
.contract-plan-strip>div{min-width:0;padding:10px 12px;border:1px solid #e7ebf1;border-radius:12px;background:#f8fafc}
.contract-plan-strip span{display:block;font-size:10px;color:#7f8b9b;margin-bottom:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.contract-plan-strip b{display:block;font-size:15px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-variant-numeric:tabular-nums}
.contract-plan-strip .plan-over{background:#fff5f5;border-color:#ffd9dc}
.contract-plan-strip .plan-over b{color:#d93045}
.contract-plan-strip .plan-ok b{color:#1477d4}
.compact-operating-tip{display:flex;gap:10px;align-items:flex-start;padding:10px 12px!important}
.compact-operating-tip b{flex:0 0 auto}
.compact-operating-tip span{min-width:0}
.compact-gap{height:6px!important;margin:0!important}

@media(max-width:760px){
  .project-ledger-card{padding:8px!important;background:transparent!important;border:0!important;box-shadow:none!important}
  .project-desktop-table{display:none!important}
  .project-mobile-list{display:grid!important;gap:7px}
  .project-mobile-card{display:block;text-decoration:none;color:var(--ink);background:#fff;border:1px solid #e7ecf2;border-radius:12px;padding:10px 11px 9px;box-shadow:0 2px 10px rgba(29,48,75,.035);min-width:0}
  .project-mobile-head{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:7px;min-width:0}
  .project-mobile-head>b{min-width:0;font-size:12.5px;line-height:1.35;color:#12375f;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;word-break:break-word}
  .project-mobile-head>.badge{flex:0 0 auto;white-space:nowrap;font-size:8px;min-height:20px;padding:2px 7px}
  .project-mobile-meta{margin-top:4px;font-size:8.6px;line-height:1.35;color:#8a96a6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
  .project-mobile-finance{display:grid;grid-template-columns:1fr 1fr .8fr;gap:5px;margin-top:8px;padding-top:7px;border-top:1px solid #f0f2f5}
  .project-mobile-finance>span{min-width:0}
  .project-mobile-finance small{display:block;font-size:7.7px;color:#8b96a5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:2px}
  .project-mobile-finance b{display:block;font-size:10.5px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-variant-numeric:tabular-nums}
  .project-mobile-empty .empty{padding:22px 10px!important}
  .contract-plan-strip{gap:5px;margin-bottom:7px}
  .contract-plan-strip>div{padding:7px 7px;border-radius:9px}
  .contract-plan-strip span{font-size:7.8px;margin-bottom:2px}
  .contract-plan-strip b{font-size:10.5px}
  .compact-operating-tip{display:block;padding:8px 9px!important;font-size:9px;line-height:1.45}
  .compact-operating-tip b{display:block;margin-bottom:2px;font-size:9px}
  .compact-operating-tip span{display:block;color:#6f7c8d}
}

/* V6.6 — project list mobile layout, actually replaces stacked field/value rows */
@media(max-width:760px){
  .project-filter-card{padding:11px 12px!important}
  .project-filter-card .card-head{margin-bottom:8px!important}
  .project-filter-card .card-head p{font-size:8.8px!important;line-height:1.35!important;margin-top:2px!important}
  .project-filter-card .create-action{padding:8px 11px!important;min-height:34px!important;font-size:10px!important}
  .project-filter-form{gap:6px!important}
  .project-ledger-card{padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important}
  .project-desktop-table{display:none!important}
  .project-mobile-list{display:grid!important;gap:7px!important}
  .project-mobile-card-v66{display:block!important;text-decoration:none!important;color:var(--ink)!important;background:#fff!important;border:1px solid #e6ebf1!important;border-radius:12px!important;padding:10px 11px 9px!important;box-shadow:0 2px 10px rgba(29,48,75,.035)!important;min-width:0!important;overflow:hidden!important}
  .project-mobile-title-row{display:flex!important;align-items:flex-start!important;gap:7px!important;min-width:0!important}
  .project-mobile-title-v66{flex:1 1 auto!important;min-width:0!important;font-size:12.5px!important;line-height:1.32!important;color:#0d5fae!important;font-weight:820!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  .project-mobile-status-v66{flex:0 0 auto!important;display:block!important}
  .project-mobile-status-v66 .badge{min-height:19px!important;padding:2px 7px!important;font-size:8px!important;white-space:nowrap!important}
  .project-mobile-meta-v66{margin-top:3px!important;min-width:0!important;font-size:8.6px!important;line-height:1.35!important;color:#8693a4!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  .project-mobile-numbers-v66{display:grid!important;grid-template-columns:minmax(0,1.1fr) minmax(0,1.1fr) minmax(66px,.7fr)!important;gap:6px!important;margin-top:7px!important;padding-top:7px!important;border-top:1px solid #f0f2f5!important;min-width:0!important}
  .project-mobile-numbers-v66>span{min-width:0!important;display:block!important}
  .project-mobile-numbers-v66 i{display:block!important;font-style:normal!important;font-size:7.7px!important;line-height:1.1!important;color:#8b96a5!important;margin-bottom:2px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  .project-mobile-numbers-v66 b{display:block!important;min-width:0!important;font-size:10.4px!important;line-height:1.2!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;font-variant-numeric:tabular-nums!important}
  .project-count-v66{text-align:right!important}
  .project-mobile-empty .empty{padding:22px 10px!important}
}
@media(max-width:390px){
  .project-mobile-card-v66{padding:9px 10px 8px!important}
  .project-mobile-title-v66{font-size:12px!important}
  .project-mobile-meta-v66{font-size:8.2px!important}
  .project-mobile-numbers-v66{grid-template-columns:minmax(0,1fr) minmax(0,1fr) 62px!important;gap:5px!important}
  .project-mobile-numbers-v66 b{font-size:9.8px!important}
}


/* V6.7 — bounded month chooser.
   Replaces the OS-native select dropdown with a small in-app popover.
   About 7 rows are visible; the selected month is centered automatically. */
.smart-month-nav{position:relative!important;overflow:visible!important}
.smart-month-picker{position:relative;width:146px;min-width:0}
.smart-month-trigger{
  width:100%;height:36px;min-height:36px;border:1px solid #d9e0e8;border-radius:10px;
  background:#fff;color:#122238;padding:0 11px;display:flex;align-items:center;justify-content:space-between;
  gap:8px;font:650 13px/1.2 inherit;box-shadow:none;cursor:pointer;text-align:left;
}
.smart-month-trigger:focus{outline:none;border-color:#8fc9ff;box-shadow:0 0 0 3px rgba(10,132,255,.08)}
.smart-month-trigger i{font-style:normal;color:#6f7e91;font-size:14px;line-height:1;transform:translateY(-1px)}
.smart-month-popover{
  position:absolute;z-index:1200;left:0;top:calc(100% + 6px);width:100%;
  background:#fff;border:1px solid #dbe2ea;border-radius:12px;padding:4px;
  box-shadow:0 12px 34px rgba(31,43,58,.16);
}
.smart-month-list{
  max-height:266px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;
  -webkit-overflow-scrolling:touch;border-radius:9px;
}
.smart-month-option{
  display:flex;align-items:center;height:38px;padding:0 10px;border-radius:8px;
  color:#1c2b3f;text-decoration:none;font-size:13px;font-weight:560;white-space:nowrap;
}
.smart-month-option:hover{background:#f2f6fa}
.smart-month-option.selected{background:#eaf4ff;color:#0877df;font-weight:750}
.smart-month-option.selected::after{content:'✓';margin-left:auto;font-size:12px}
.smart-month-popover[hidden]{display:none!important}
@media(max-width:760px){
  .smart-month-picker{width:142px}
  .smart-month-trigger{height:34px;min-height:34px;border-radius:9px;font-size:13px;padding:0 10px}
  .smart-month-popover{top:calc(100% + 5px);border-radius:11px}
  .smart-month-list{max-height:250px}
  .smart-month-option{height:36px;font-size:13px;padding:0 9px}
}
@media(max-width:360px){.smart-month-picker{width:134px}.smart-month-trigger{font-size:12.5px}}

/* ===== V6.8 audit-safe delete + obligation attachments ===== */
.inline-delete-form{display:inline-flex;margin:0}.inline-delete-form .btn{white-space:nowrap}
.danger-zone{border-color:#ffd9dc;background:#fffafb}.danger-zone .card-head{align-items:center}
.obligation-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}
.obligation-kpis .mini-kpi{min-height:88px}
@media (max-width:760px){
  .obligation-kpis{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  .obligation-kpis .mini-kpi{padding:12px 10px;min-height:76px}
  .obligation-kpis .mini-kpi span{font-size:12px}.obligation-kpis .mini-kpi b{font-size:16px}
  .inline-actions{gap:6px;flex-wrap:wrap}.inline-delete-form{max-width:100%}
  .entry-grid input[type=file],.form-grid input[type=file]{max-width:100%;font-size:14px}
}

/* V7.6 company entity / sharing permissions */
.company-profile-entry{padding:16px 18px}.company-profile-entry-head{display:flex;justify-content:space-between;gap:14px;align-items:flex-start}.company-profile-entry-head h2{margin:3px 0 4px;font-size:18px}.company-profile-entry-head p{margin:0;color:#748196;font-size:12px;line-height:1.55}.company-profile-mini{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:13px}.company-profile-mini>span{background:#f7f9fc;border:1px solid #e7ecf2;border-radius:12px;padding:9px 11px;min-width:0}.company-profile-mini small,.company-profile-mini b{display:block}.company-profile-mini small{font-size:10px;color:#8190a5;margin-bottom:3px}.company-profile-mini b{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.company-profile-entry-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.company-entity-hero{padding:18px}.company-entity-title{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}.company-entity-title h2{margin:3px 0 4px;font-size:21px}.company-entity-title p{margin:0;color:#748196;font-size:12px;line-height:1.6}.company-entity-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.company-info-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:14px}.company-fact-list{display:grid;grid-template-columns:1fr}.company-fact{display:grid;grid-template-columns:155px 1fr;gap:14px;padding:10px 0;border-bottom:1px solid #edf1f5;align-items:start}.company-fact:last-child{border-bottom:0}.company-fact span{font-size:11px;color:#7e8ba0}.company-fact b{font-size:12px;line-height:1.55;overflow-wrap:anywhere}.company-doc-list .simple-list-row{align-items:flex-start}.company-doc-list .simple-list-row>div:first-child{min-width:0}.company-doc-list small{max-width:430px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.company-doc-upload{border-top:1px solid #edf1f5;padding-top:14px}.company-share-row{display:flex;align-items:center;justify-content:space-between;gap:16px;background:#f7f9fc;border:1px solid #e7ecf2;border-radius:14px;padding:13px}.company-share-row b,.company-share-row small{display:block}.company-share-row small{color:#7c899d;margin-top:3px}.company-share-once{margin-bottom:12px}.share-link-line{display:flex;gap:8px;margin:9px 0 5px}.share-link-line input{flex:1;min-width:0}.company-edit-card{max-width:1180px}.company-edit-grid .full{grid-column:1/-1}
@media(max-width:760px){.company-profile-entry{padding:14px}.company-profile-entry-head h2{font-size:16px}.company-profile-entry-head p{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.company-profile-mini{grid-template-columns:1fr 1fr 1fr;gap:6px}.company-profile-mini>span{padding:8px}.company-profile-mini b{font-size:11px}.company-profile-entry-actions .btn{flex:1;min-width:0}.company-entity-hero{padding:15px}.company-entity-title h2{font-size:18px}.company-info-grid{grid-template-columns:1fr}.company-fact{grid-template-columns:112px 1fr;gap:9px;padding:9px 0}.company-doc-list .simple-list-row{display:block}.company-doc-list .inline-actions{margin-top:8px}.company-doc-list small{max-width:100%}.company-share-row{display:block}.company-share-row .inline-actions{margin-top:10px;flex-wrap:wrap}.share-link-line{display:block}.share-link-line input{width:100%;margin-bottom:7px}.share-link-line .btn{width:100%}.company-edit-grid{grid-template-columns:1fr!important}.company-edit-grid .full{grid-column:auto}}
.company-edit-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
