/* AIVELI Space OS 0.10 | refined touch and responsive layout */
html{scrollbar-gutter:stable}
html,body,#app{width:100%;max-width:100%;min-width:0;overflow-x:hidden}
.shell,.app-main,.content,.page,.panel,.project-card,.welcome-empty,.editorial-card{min-width:0!important;max-width:100%}
.rail-navigation,.rail-footer{min-width:0}
.page{overflow-wrap:anywhere}
.page .toolbar-line,.page .page-actions,.project-toolbar{min-width:0;max-width:100%;flex-wrap:wrap}
button,input,select,textarea{touch-action:manipulation}
input[type=range],canvas{touch-action:auto}
input,select,textarea{font-size:max(14px,1em)}
.projects-grid,.overview-grid,.metrics,.core-metrics,.core-split,.core-aside{min-width:0}
.projects-grid>*,.overview-grid>*,.metrics>*,.core-metrics>*,.core-split>*{min-width:0}
.project-card{overflow:hidden!important}
.project-card .project-art,.project-card img{max-width:100%}
.page-head{min-width:0;max-width:100%}
.modal-box,.modal-content,.dialog,.project-modal .profile-box{max-width:min(96vw,880px);max-height:90dvh;overflow-y:auto;overscroll-behavior:contain}
.aiv-table-scroll{max-width:100%;overflow-x:auto;scrollbar-width:thin;-webkit-overflow-scrolling:touch}
.topbar .crumb-logo{white-space:nowrap;text-overflow:ellipsis}
.topbar .breadcrumbs{flex:1;overflow:hidden}
.topbar .top-actions{flex:0 0 auto}
@media (min-width:1500px){
 .page{max-width:1700px!important}
 .projects-grid{gap:18px}
 .project-card{border-radius:18px!important}
}
@media(max-width:1024px){
 .page{padding:clamp(16px,2vw,24px)!important}
 .topbar{padding-inline:20px!important}
 .page .page-actions button{min-height:39px}
 .metrics{gap:12px}
 .overview-grid{gap:12px}
}
@media(max-width:790px){
 .page{padding:16px 15px!important}
 .topbar{padding-inline:14px!important;gap:8px}
 .page-actions button,.outline,.primary{min-height:40px}
 .page-actions{gap:8px!important}
 .page-head{gap:14px;margin-bottom:20px}
 .project-toolbar{row-gap:10px}
 .projects-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px}
 .project-card .project-art{height:140px}
 .metric{padding:18px!important}
 .core-split{grid-template-columns:minmax(0,1fr)}
 .core-aside{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:630px){
 html{scrollbar-gutter:auto}
 .shell:not(.shell-design){height:100dvh!important;grid-template-rows:minmax(0,1fr) auto!important}
 .shell:not(.shell-design) .app-main{min-height:0;overflow:hidden}
 .shell:not(.shell-design) .content{flex:1;min-height:0;overflow:auto}
 .shell:not(.shell-design) .rail{
   height:calc(62px + env(safe-area-inset-bottom,0px))!important;min-height:62px!important;
   padding:6px 5px env(safe-area-inset-bottom,0px)!important;border-right:0!important;
   border-top:1px solid #e3e9ef;background:rgba(251,252,254,.96)!important;backdrop-filter:blur(18px);
   overflow:hidden;z-index:30
 }
 .shell:not(.shell-design) .rail-navigation{width:100%;display:flex;flex:1;justify-content:space-evenly;gap:3px;overflow:hidden}
 .shell:not(.shell-design) .rail .logo,.shell:not(.shell-design) .rail-divider,.shell:not(.shell-design) .rail-footer{display:none!important}
 .shell:not(.shell-design) .rail-btn{flex:1 1 0!important;min-width:0!important;max-width:72px!important;min-height:46px!important;max-height:52px!important;padding:5px 2px!important}
 .shell:not(.shell-design) .rail-btn svg{width:20px;height:20px}
 .shell:not(.shell-design) .rail-label{font-size:10px;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .topbar{height:60px!important;min-height:60px!important;padding-inline:12px!important}
 .topbar .breadcrumbs strong{max-width:120px}
 .topbar .crumb-logo{font-size:12px}
 .topbar .top-actions{gap:3px;max-width:fit-content}
 .topbar .top-actions .iconbtn{width:38px;height:38px;flex:0 0 38px}
 .page{padding:15px 13px 26px!important}
 .h1{font-size:clamp(26px,6vw,33px)!important}
 .sub{font-size:12px;line-height:1.55}
 .projects-grid,.overview-grid{grid-template-columns:minmax(0,1fr)!important;gap:11px}
 .project-card{width:100%;border-radius:14px!important}
 .project-card .project-art{height:145px}
 .panel{padding:15px!important}
 .metric{padding:13px!important}
 .metrics,.core-metrics{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px}
 .metric strong{font-size:21px}
 .page-head .toolbar-line{width:100%;flex-wrap:wrap;gap:7px}
 .page-head .toolbar-line button{max-width:100%;font-size:12px}
 .integrated-editor,.native-frame-wrap{min-height:0;overflow:hidden}
 .shell-design .integrated-shortcuts{
   top:max(6px,env(safe-area-inset-top,0px))!important;
   left:8px!important;max-width:calc(100% - 16px)!important;
   overflow-x:auto!important;overflow-y:hidden!important;white-space:nowrap;overscroll-behavior-x:contain;scrollbar-width:none
 }
 .shell-design .integrated-shortcuts::-webkit-scrollbar{display:none}
 .shell-design .integrated-shortcuts button{flex:0 0 auto}
 .shell-design .integrated-shortcuts strong{max-width:80px!important}
 .core-aside{grid-template-columns:minmax(0,1fr)!important}
 .core-table{min-width:620px}
 .welcome-empty{min-height:0!important}
 .welcome-copy{padding:24px 18px!important}
}
@media(max-width:380px){
 .page{padding:12px 10px 22px!important}
 .topbar{padding-inline:9px!important}
 .topbar .breadcrumbs strong{max-width:88px}
 .topbar .top-actions .iconbtn{width:35px;height:35px;flex-basis:35px}
 .rail-label{font-size:9px!important}
 .page-head{gap:10px}
 .metric{padding:11px!important}
}
@media(max-height:540px) and (orientation:landscape) {
 .shell:not(.shell-design) .rail{height:48px!important;min-height:48px!important}
 .rail-btn{max-height:39px!important}
 .rail-label{display:none!important}
 .topbar{min-height:49px!important;height:49px!important}
 .page{padding-top:12px!important}
}
@media(prefers-reduced-motion:reduce){.project-card,.rail-btn,.page>*{animation:none!important;transition:none!important}}
