/* Enshorly visual polish — shared UI consistency and responsive refinements */
:root{
  --radius-card:16px;
  --radius-control:10px;
  --ease-ui:cubic-bezier(.2,.7,.2,1);
}
html{scroll-behavior:smooth}
body{overflow-x:hidden;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.workspace,main,#app{min-width:0}
#topbar{position:sticky;top:0;z-index:15;backdrop-filter:blur(14px);box-shadow:0 1px 0 var(--line)}
#sidebar{overscroll-behavior:contain;scrollbar-gutter:stable}
.brand{letter-spacing:-.5px}
.navitem{transition:background .18s var(--ease-ui),color .18s var(--ease-ui),transform .18s var(--ease-ui)}
.navitem:active{transform:scale(.985)}
.heading,.dash-heading{min-width:0}
.heading h1,.dash-heading h1{overflow-wrap:anywhere}
.card,.stat,.inbox,.plan,.deal{border-radius:var(--radius-card)}
.card{min-width:0;box-shadow:var(--shadow)}
.card-head{min-width:0}
.card-head>div{min-width:0}
.stat{transition:transform .2s var(--ease-ui),box-shadow .2s var(--ease-ui),border-color .2s}
.stat:hover{border-color:color-mix(in srgb,var(--green) 24%,var(--line))}
.btn,.iconbtn,.theme-toggle{transition:background .18s var(--ease-ui),border-color .18s var(--ease-ui),box-shadow .18s var(--ease-ui),transform .18s var(--ease-ui)}
.btn:active,.iconbtn:active{transform:translateY(1px)}
input,select,textarea{min-width:0;border-radius:var(--radius-control)}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid color-mix(in srgb,var(--ring) 55%,transparent);outline-offset:1px}
.tablewrap{max-width:100%;overflow-x:auto;overscroll-behavior-x:contain}
.tablewrap table{min-width:580px}
.product-grid{align-items:stretch}
.product-grid>.card{display:flex;flex-direction:column}
.product-grid>.card>.row:last-child{margin-top:auto;padding-top:16px;flex-wrap:wrap}
.product-art{border:1px solid var(--line)}
.preview{box-shadow:none}
.toolbar{align-items:center}
.tabs{max-width:100%;overflow-x:auto;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tabs button{white-space:nowrap}
.inbox{min-width:0;box-shadow:var(--shadow)}
.conversation-list,.chat,.contact-info{min-width:0}
.conversation{transition:background .18s,border-color .18s}
.conversation:focus-visible{outline:3px solid var(--ring);outline-offset:-3px}
.chat-body{overflow-y:auto;overscroll-behavior:contain}
.bubble{overflow-wrap:anywhere}
.chat-compose .row{min-width:0}
.chat-compose .row input{flex:1;width:1%;min-width:0}
.chat-compose .row .btn{flex-shrink:0}
.column{min-width:0}
.deal{overflow-wrap:anywhere}
.wizard-content,.wizard-layout>*,.ad-review-grid>*{min-width:0}
.wizard-foot{position:sticky;bottom:10px;z-index:5;box-shadow:var(--shadow);backdrop-filter:blur(12px)}
.empty{line-height:1.9}
#toast{max-width:min(440px,calc(100vw - 32px));overflow-wrap:anywhere}
dialog{max-width:calc(100vw - 24px);overscroll-behavior:contain}
@media(max-width:900px){
  #topbar{min-height:68px}
  #sidebar{box-shadow:0 12px 35px #071d2c20}
  main{width:100%}
  .inbox{grid-template-columns:minmax(0,1fr)}
  .contact-info{display:none}
}
@media(max-width:600px){
  main{padding:18px 14px 28px}
  #topbar{min-height:64px}
  .topactions{max-width:calc(100vw - 58px);overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none}
  .topactions::-webkit-scrollbar{display:none}
  .role-switch{flex-shrink:0}
  .heading{gap:12px;margin-bottom:19px}
  .heading>.row{width:100%}
  .heading>.row .btn{flex:1}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .stat{min-width:0}
  .grid,.dashboard-grid,.dashboard-bottom{grid-template-columns:minmax(0,1fr)}
  .card{padding:17px;border-radius:14px}
  .card-head{gap:8px}
  .card-head h2{overflow-wrap:anywhere}
  .inbox{display:grid;grid-template-columns:minmax(0,1fr);overflow:hidden}
  .conversation-list{
    display:grid;
    grid-template-columns:repeat(3,minmax(158px,1fr));
    overflow-x:auto;
    overflow-y:hidden;
    border-left:0;
    border-bottom:1px solid var(--line);
    scroll-snap-type:x mandatory;
    overscroll-behavior-x:contain;
    scrollbar-width:thin;
    padding:0 8px 8px;
  }
  .conversation-list h3{
    grid-column:1/-1;
    display:flex;
    align-items:center;
    justify-content:flex-start;
    gap:9px;
    padding:13px 10px 8px;
    border:0;
    font-size:14px;
  }
  .conversation{
    min-width:0;
    padding:12px 11px;
    border:1px solid var(--line);
    border-radius:11px;
    scroll-snap-align:start;
    background:var(--panel);
  }
  .conversation.active{border-color:var(--green);border-right-width:1px}
  .conversation p{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .chat{min-height:430px}
  .chat-head{padding:14px}
  .chat-body{padding:15px;min-height:260px;max-height:48vh}
  .chat-compose{padding:11px}
  .chat-compose .tabs{width:100%}
  .chat-compose .tabs button{flex:1}
  .chat-compose .row{gap:7px}
  .chat-compose .row .btn{padding-inline:13px}
  .toolbar{align-items:stretch}
  .toolbar>.tabs{width:100%}
  .toolbar>.btn{align-self:flex-start}
  .product-grid,.rules,.form-grid,.kanban,.plans{grid-template-columns:minmax(0,1fr)}
  .objective-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .wizard-foot{position:static}
  .day{min-width:0;overflow:hidden}
  .dialog-actions{flex-wrap:wrap}
  .dialog-actions .btn{flex:1}
}
@media(max-width:380px){
  main{padding-inline:11px}
  .stats{gap:8px}
  .stat{padding:13px}
  .stat .number{font-size:26px}
  .conversation-list{grid-template-columns:repeat(3,minmax(145px,1fr))}
  .objective-grid{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*:before,*:after{transition:none!important;animation:none!important}
}