/* Shared layout rhythm and containment for every service and theme. */
:root{--section-gap:1.5rem;--section-gap-compact:1.5rem;--control-height:2.75rem;--accent:var(--primary);--card-bg:var(--surface)}
body{line-height:1.5}
a{color:var(--primary);text-underline-offset:.18em}
a:hover{text-decoration-thickness:2px}
:where(h1,h2,h3,h4,p,li,dt,dd,label,summary,a,strong,small,code){overflow-wrap:anywhere}
:where(h1,h2,h3,h4){line-height:1.25}
:where(.panel,.card,.form-card)>:first-child{margin-top:0}
:where(.panel,.card,.form-card)>:last-child{margin-bottom:0}
:where(.panel,.card,.form-card,.grid,.cards,.hero-grid,.hero-card,.up-project-layout,.section-header,.toolbar,.up-stat,.up-list article,.field,.setting-row,.photo-lightbox-box){min-width:0;max-width:100%}
:where(.grid,.cards,.hero-grid,.hero-card,.section-header,.toolbar,.up-project-layout,.up-detail-grid,.setting-row)>*{min-width:0}
.content>:where(section,.panel,.grid,.up-project-layout,.up-document-search-bar){margin-bottom:0}
.content>:where(section,.panel,.grid,.up-project-layout,.up-document-search-bar)~:where(section,.panel,.grid,.up-project-layout,.up-document-search-bar){margin-top:var(--section-gap)}
.content .up-project-layout main>section+section{margin-top:var(--section-gap)}
.content :where(.grid,.cards,.hero-grid,.up-note-cards,.up-project-layout,.up-stats,.up-detail-grid,.zcell-grid,.zcell-device-list,.traffic-grid,.zamoi-graph-grid){gap:var(--section-gap-compact)}
.content :where(.grid,.cards,.hero-grid)>.panel{margin-block:0}
.content .section-header{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.75rem 1rem}
.content .section-header>:first-child{flex:1 1 13rem;min-width:0}
.content .section-header>:last-child{max-width:100%}
/* Reserve the heading's natural width; descriptions take the flexible space. */
.content .section-header>:is(h1,h2,h3,h4),
.content .section-header>:first-child:has(> :is(h1,h2,h3,h4)){flex:1 0 max-content;max-width:100%}
.content .section-header>p:not(:first-child){flex:1 1 20rem;min-width:0}
.content .section-header :is(h1,h2,h3,h4){overflow-wrap:break-word;word-break:normal}
.content :where(.button-row,.mail-settings-actions){display:flex;flex-wrap:wrap;gap:.75rem;align-items:center}
button,.button{min-width:0;max-width:100%;min-height:var(--control-height);padding:.7rem 1rem;border-radius:var(--radius-sm);line-height:1.35;white-space:normal;overflow-wrap:anywhere;text-align:center;box-shadow:none}
.content .up-actions :is(button,.button){padding:.7rem 1rem;min-height:var(--control-height)}
:where(button,.button):disabled{opacity:.55;cursor:not-allowed}
:where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{outline:3px solid var(--primary);outline-offset:3px}
button.link-button{min-height:0;padding:0;border-radius:0;background:none;color:var(--primary);box-shadow:none;text-align:inherit}
input,select,textarea{min-width:0;max-width:100%;line-height:1.4}
input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select{min-height:var(--control-height)}
input:is([type=checkbox],[type=radio]){width:auto;flex:0 0 auto;accent-color:var(--primary)}
select{overflow:hidden;text-overflow:ellipsis}
option{background:var(--bg-soft);color:var(--text)}
input[type=file]{white-space:normal;padding:.6rem;overflow:hidden}
input[type=file]::file-selector-button{font:inherit;border:1px solid var(--border);background:var(--surface-light);color:var(--text);border-radius:.5rem;padding:.4rem .65rem;margin-right:.6rem;max-width:100%;white-space:normal}
fieldset{min-width:0;max-width:100%;border:1px solid var(--border);border-radius:var(--radius-sm)}
legend{max-width:100%;overflow-wrap:anywhere}
pre{max-width:100%;white-space:pre-wrap;overflow-wrap:anywhere}
img,video,svg,canvas{max-width:100%}
:where(.pill,.up-badge,.todo-status){max-width:100%;white-space:normal;overflow-wrap:anywhere;line-height:1.35}
:where(.simple-list li,.zamoi-card-head,.traffic-state){flex-wrap:wrap}
.content .cards{grid-template-columns:repeat(auto-fit,minmax(min(100%,14rem),1fr))}
.content .up-stats{grid-template-columns:repeat(auto-fit,minmax(min(100%,10.5rem),1fr))}
.content .theme-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,12rem),1fr))}
.content .setting-row{grid-template-columns:minmax(8rem,35%) minmax(0,1fr)}
.content .up-project-nav a.active,.content .up-workflow span.active{color:var(--button-text)}
.content .up-project-nav{height:max-content;max-height:none;overflow:visible}
.content .up-module-bar a{background:var(--surface-light)}
.content .up-project-layout>.up-project-nav{top:6rem}
.content .up-document-search-bar{gap:.75rem;padding:1rem;isolation:isolate;background:var(--surface-strong)}
.content .up-document-search-bar label{margin:0}
.content .up-document-search-bar button{min-width:0}
.content .up-document-related{gap:var(--section-gap)}
.site-table-scroll,.todo-table-scroll,.up-documents-table-wrap,.zcell-scroll{max-width:100%;min-width:0;overflow-x:auto;overscroll-behavior-x:contain}
.site-table-scroll{scrollbar-gutter:stable;border-radius:.5rem}
.site-table-scroll>.table{min-width:var(--table-min-width,40rem);table-layout:fixed}
.table :is(th,td){overflow-wrap:anywhere}
.table td :where(button,.button,select,input){max-width:100%;min-width:0}
.table td :is(button,.button){margin-block:.15rem}
.content .traffic-chart-card{height:auto;min-height:26rem;overflow:visible}
.content .traffic-chart-card canvas{height:18rem;min-height:18rem;flex:none}
.content .zamoi-graph-card{min-height:0;padding:1.25rem}
.content :where(.traffic-legend,.zamoi-legend){max-height:none;overflow:visible;gap:.5rem;margin-top:1rem}
.content :where(.traffic-legend-button,.zamoi-legend-item){min-width:0;max-width:100%;min-height:2rem;white-space:normal;box-shadow:none}
.content :where(.traffic-legend-label,.zamoi-legend-item span:last-child){white-space:normal;overflow-wrap:anywhere;overflow:visible;text-overflow:clip}
.content .traffic-legend-button{padding:.4rem .65rem}
.content .zcell-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,16rem),1fr))}
.content .zcell-device-list{grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr))}
.content .zcell-controls{grid-template-columns:repeat(auto-fit,minmax(min(100%,12rem),1fr))}
.content .zcell-controls :is(input,select){background:var(--field-bg);border-color:var(--field-border);color:var(--text)}
.content .zcell-device-link{background:var(--subtle-bg);border-color:var(--border)}
.content .zcell-device-meta{color:var(--muted)}
.content .zcell-limited-rows thead th{background:var(--surface-strong);color:var(--text)}
.photo-filmstrip .photo-card{min-height:0}
.photo-viewer :is(button,a){line-height:1.2}
@media(max-width:860px){
 .content .up-project-layout>.up-project-nav{position:static}
 .content .up-module-bar{grid-template-columns:minmax(0,1fr)}
 .content .up-document-search-bar{position:static}
 .topbar .nav-links{gap:.65rem 1rem;max-width:100%}
}
@media(max-width:540px){
 :root{--section-gap:1rem;--section-gap-compact:1rem}
 .panel,.form-card,.card{padding:1rem}
 .content .up-project-layout>.up-project-nav{padding:.75rem}
 .content .setting-row,.content .up-mail-filters{grid-template-columns:minmax(0,1fr)}
 .content .up-mail-filters>.field:nth-child(2){grid-column:auto}
 .hero-card{grid-template-columns:minmax(0,1fr)}
 .hero-copy{padding-right:0}
 .brand-mark{max-width:35vw;height:4rem}.brand-mark img{max-width:100%;object-fit:contain}
 .content .up-document-search-bar input{flex-basis:100%}
 .content .up-document-search-bar select{flex:1;max-width:100%;min-width:0}
 .content .up-project-context{flex-wrap:wrap}.content .up-project-number{flex:1 1 100%;text-align:left}
}
@media print{.site-table-scroll{overflow:visible}.site-table-scroll>.table{min-width:0}.up-project-nav,.up-document-search-bar{position:static!important}}
.content .company-task-list{grid-template-columns:repeat(auto-fit,minmax(min(100%,14rem),1fr))}
.content :where(.fd-hero,.fd-controls,.fd-cards,.fd-scroll){min-width:0;max-width:100%}
.content :where(.fd-hero,.fd-cards){gap:var(--section-gap-compact)}
.content .fd-hero>*{min-width:0}
.content .fd-controls{grid-template-columns:repeat(auto-fit,minmax(min(100%,13rem),1fr))}
.content .fd-cards{grid-template-columns:repeat(auto-fit,minmax(min(100%,10rem),1fr))}
.content :where(.fd-controls select,.fd-search){background:var(--field-bg);color:var(--text);border-color:var(--field-border)}
.content .fd-scroll thead th{background:var(--surface-strong);color:var(--text)}
.content .fd-raw{color:var(--muted)}
.content .zcell-grid{display:grid}
.content :where(.zamoi-graph-grid,.traffic-grid){grid-template-columns:repeat(auto-fit,minmax(min(100%,22rem),1fr))}
.content .section-header{margin-bottom:1rem}
.content .section-header:last-child{margin-bottom:0}
.content .grid.columns-2{align-items:start}
.content form.up-actions>select,.content form.up-actions>input:not([type=hidden]):not([type=checkbox]):not([type=radio]){flex:1 1 12rem;width:auto}
.content .up-badge{background:var(--surface-light);color:var(--text);border:1px solid var(--border);border-left:4px solid var(--badge,var(--primary))}
