/* Multi Tool Converter: the layout and the tool's own pieces; colors and parts come from the FileFortress kit (ff-kit/),
   so it follows the visitor's site theme. The page has no background of its own: on FileFortress the site's shows. */

[hidden]{display:none!important}.topbar,.page{max-width:76rem;margin:1.25rem auto;padding:0 1rem}.topbar-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}.toplinks{display:flex;gap:.5rem;flex-wrap:wrap}.intro{display:grid;justify-items:center;gap:1rem;text-align:center;padding:3rem 0}.tabs{margin:1.5rem 0;flex-wrap:wrap}.workspace,.universal-grid,.summary-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,20rem),1fr));gap:1rem}.card,.mat{margin-bottom:1rem}.action-row,.btnrow,.filebar,.chip-row,.badges,.swatch-row{display:flex;gap:.6rem;flex-wrap:wrap;align-items:center}.action-row{margin-top:1rem}.dropzone{position:relative;min-height:12rem}.dropzone input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}.folder-button{position:relative;overflow:hidden}.folder-button input{position:absolute;inset:0;opacity:0;width:100%;height:100%}.wide{width:100%}textarea{width:100%;min-height:8rem}.log-box{white-space:pre-wrap}.footer{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin:2rem 0}.app{padding:0}.hdr,.mat-head,.path-row,.accordion-header{display:flex;align-items:center;gap:1rem;justify-content:space-between;flex-wrap:wrap}.mat-title{min-width:0;flex:1}.mat-title h2,.chain-line,.ppath,.path-text{overflow-wrap:anywhere}.mat-body{padding-top:1rem}.section{overflow:auto;margin-top:1rem}.raw-pre{overflow:auto;max-height:26rem;white-space:pre-wrap}.raw-pre:not(.show),.paste:not(.show),.mat.collapsed .mat-body,.accordion-item:not(.open) .accordion-body{display:none}.accordion-item{margin:.5rem 0}.accordion-header{cursor:pointer}.accordion-body pre{white-space:pre-wrap;overflow-wrap:anywhere}.section-h{margin:1rem 0 .5rem}.bpo-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(11rem,1fr));gap:.5rem}.swatch{width:1.25rem;height:1.25rem;flex-shrink:0}.card-title{margin-bottom:1rem}.drop{display:flex;gap:1rem;align-items:center;flex-wrap:wrap}.drop .txt{flex:1}.drop input[type=file]{display:none}.path-text{flex:1}.path-label{min-width:8rem}.accordion-search{width:100%;margin-bottom:1rem}.chevron{width:1rem;height:1rem}.stat{margin:1rem 0}#materialPage .ico svg{width:1.5rem;height:1.5rem}table{width:100%;border-collapse:collapse}td,th{padding:.5rem;text-align:left;vertical-align:top}td{border-bottom:1px solid var(--ff-line-strong)}.hero-meta,.note{font-size:.8rem}.hero-action{margin-top:1rem}.universal-grid label{min-width:0}.universal-grid label input[type=text],.universal-grid select{width:100%}#bpCopyOutput{min-height:4rem}@media(max-width:600px){.toplinks{gap:.25rem}.workspace{grid-template-columns:1fr}.intro{padding:2rem 0}.footer{flex-direction:column}}

/* Page composition; kit pieces inherit the visitor’s theme. */
:root{--ff-card-radius:1.1rem;--ff-card-pad:1.5rem;--ff-btn-radius:.7rem;--ff-input-radius:.7rem;--ff-btn-height:2.6rem}

.topbar{max-width:76rem;width:calc(100% - 3rem);margin:1.25rem auto 0;padding:0;--ff-card-pad:.7rem 1.1rem;--ff-card-bg:var(--ff-chrome);--ff-card-radius:1.15rem}
.topbar-inner{display:grid;grid-template-columns:1fr auto 1fr;gap:1rem;min-height:2.1rem;align-items:center}
.tool-brand{display:flex;gap:.65rem;align-items:center;white-space:nowrap;font-size:1rem;font-weight:850;letter-spacing:-.04em}.tool-brand svg{flex:none}.brand-accent{color:var(--ff-brand)}.toplinks{gap:.3rem;justify-content:center;flex-wrap:nowrap}.topbar-inner>.pill{justify-self:end;font-size:.6rem;letter-spacing:.08em}
.page{width:min(69rem,calc(100% - 3rem));padding:0;margin:0 auto;gap:0}
.intro{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:0;padding:4.5rem 0 2.5rem;position:relative}
.hero-logo{margin-bottom:1.5rem}.hero-logo svg{display:block;filter:drop-shadow(0 .7rem 1.7rem color-mix(in srgb,var(--ff-brand) 14%,transparent))}.intro .eyebrow{font-size:.6rem;letter-spacing:.2em;font-weight:600;margin:0 0 1rem;color:var(--ff-text-3)}
.intro h1{font-size:clamp(2.3rem,5vw,3.6rem);font-weight:900;line-height:1.08;letter-spacing:-.05em;margin:0 0 1.1rem}.intro p{max-width:42rem;font-size:1.02rem;line-height:1.8;margin:0;color:var(--ff-text-2)}.hero-action{margin:1.8rem 0 .6rem;min-width:14rem}.hero-meta{font-size:.68rem;color:var(--ff-text-3)}
.tabs{align-self:center;width:max-content;max-width:100%;margin:0 auto 1.8rem;flex-wrap:wrap;justify-content:center}
.workspace{grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);gap:1.4rem;align-items:start}.workspace>*,.card,.ff-win{min-width:0}.card{margin-bottom:1.3rem;gap:.65rem}.card h2{font-size:1.05rem;letter-spacing:-.025em;margin:0}.step{font-size:.6rem;letter-spacing:.15em;margin:0 0 .25rem}.card>p{font-size:.82rem;line-height:1.7}.dropzone{margin:.75rem 0;min-height:13rem;--ff-card-radius:.85rem}.dropzone svg{width:2rem;height:2rem;color:var(--ff-brand-soft)}.dropzone strong{font-size:.85rem}.dropzone small{font-size:.75rem}.output-heading{display:flex;align-items:center;justify-content:space-between;gap:1rem}.output-tag{font-size:.65rem;font-family:var(--ff-mono);color:var(--ff-text-3)}#mdOutput{min-height:22rem;font: .75rem/1.75 var(--ff-mono);--ff-input-bg:transparent;--ff-input-border:transparent;--ff-input-radius:0;resize:vertical}.note{line-height:1.75;font-size:.73rem}.action-row{margin-top:.5rem}.log-box:empty{display:none}.settings-wrap{max-width:53rem;margin:0 auto}.universal-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin-top:.5rem}.universal-grid label{display:flex;align-items:center;justify-content:space-between;gap:.75rem;min-height:3rem;font-size:.82rem}.field{margin-top:.75rem}.footer{border-top:1px solid var(--ff-line);padding-top:1.5rem;margin:2rem 0;font-size:.65rem;color:var(--ff-text-3)}.footer a{color:var(--ff-brand-soft)}#materialPage .hdr{margin-bottom:1.2rem}#materialPage .hdr h2{margin:0 0 .5rem}#materialPage .drop{margin-bottom:1.2rem}#materialPage .mat-head{cursor:pointer}#materialPage .mat-title h2{font-size:.95rem}#materialPage .chain-line{font-size:.75rem;color:var(--ff-text-3)}#materialPage table{font-size:.75rem}#materialPage th{font-size:.65rem;color:var(--ff-text-3);text-transform:uppercase;letter-spacing:.06em}#materialPage .pval{color:var(--ff-brand-soft)}#materialPage .raw-toggle{margin-top:1rem}#blueprintPage .path-row{margin-bottom:.65rem}#blueprintPage .path-text{font:.75rem/1.7 var(--ff-mono)}#blueprintPage .stat-card{--ff-card-pad:1rem}#blueprintPage .stat-label{font-size:.65rem;color:var(--ff-text-3)}#blueprintPage .stat-value{font-size:1rem;font-weight:700}#blueprintPage .badge-flag{margin:.25rem}#blueprintPage .flag-group-title{margin:1rem 0 .5rem;font-size:.75rem;font-weight:650;color:var(--ff-text-3)}
@media(max-width:760px){.topbar{width:calc(100% - 1.5rem);margin-top:.75rem;--ff-card-pad:.65rem .8rem}.topbar-inner{grid-template-columns:1fr auto}.topbar-inner>.pill{display:none}.tool-brand{font-size:.9rem}.toplinks{display:none}.page{width:calc(100% - 1.5rem)}.intro{padding:2.8rem 0 2rem}.intro p{font-size:.86rem}.hero-logo{margin-bottom:1.2rem}.hero-logo svg{width:3.5rem;height:3.5rem}.workspace{grid-template-columns:1fr}.universal-grid{grid-template-columns:1fr}.tabs{width:auto}.hero-action{margin-top:1.3rem}#mdOutput{min-height:18rem}:root{--ff-card-pad:1.15rem}}


/* ---------- added with the merged version ---------- */
.tool-brand .ff-icon{width:1.4rem;height:1.4rem;color:var(--ff-brand)}
.hero-logo{display:grid;place-items:center;width:4.5rem;height:4.5rem;border-radius:1.25rem;background:color-mix(in srgb,var(--ff-brand) 16%,transparent);border:1px solid color-mix(in srgb,var(--ff-brand) 35%,transparent);box-shadow:0 .7rem 1.7rem color-mix(in srgb,var(--ff-brand) 18%,transparent)}
.hero-logo .ff-icon{width:2.2rem;height:2.2rem;color:var(--ff-brand)}
.dropzone .ff-icon{width:2rem;height:2rem;color:var(--ff-brand-soft)}
.file-list{display:flex;flex-wrap:wrap;gap:.45rem}
.file-list:empty{display:none}
.file-chip{display:inline-flex;align-items:center;gap:.45rem;max-width:100%;padding:.3rem .35rem .3rem .7rem;border-radius:999px;border:1px solid var(--ff-line-strong);background:var(--ff-field);font-size:.75rem}
.file-chip b{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:14rem}
.file-chip small{color:var(--ff-text-3)}
.file-chip button{width:1.4rem;height:1.4rem;border-radius:50%;border:0;background:transparent;color:var(--ff-text-2);cursor:pointer;font-size:.95rem;line-height:1}
.file-chip button:hover{background:var(--ff-line);color:#fff}
.level-list{display:grid;gap:.65rem}
.level-row{display:grid;gap:.3rem;padding:.75rem .85rem;border-radius:.85rem;border:1px solid var(--ff-line);background:var(--ff-field)}
.level-row strong{font-size:.85rem}.level-row>small{color:var(--ff-text-3);font-size:.7rem}
.level-path{font:.7rem/1.5 var(--ff-mono);color:var(--ff-text-3);overflow-wrap:anywhere}
.level-fields{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center}
.level-fields input[type=text]{flex:1 1 12rem;min-width:0}
.status-line{font-size:.78rem;min-height:1.2em;margin-top:.4rem;color:var(--ff-text-2)}
.status-ok{color:var(--ff-success-soft)}.status-warn{color:var(--ff-warning-soft)}
.stat-row{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.75rem}
.stat-row:empty{display:none}
.stat-chip{padding:.25rem .6rem;border-radius:999px;border:1px solid var(--ff-line);font-size:.72rem;color:var(--ff-text-2)}
.stat-chip b{color:#fff}
.log-box{margin-top:.75rem;max-height:14rem;overflow:auto;font:.72rem/1.6 var(--ff-mono)}
.set-title{margin:1.25rem 0 .1rem;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ff-text-3)}
.universal-grid label.setting{justify-content:flex-start;align-items:flex-start;gap:.7rem;padding:.7rem .8rem;border-radius:.8rem;border:1px solid var(--ff-line);background:var(--ff-field);cursor:pointer}
.setting input{margin-top:.15rem;flex:none}
.setting span{display:grid;gap:.15rem}.setting b{font-weight:600}.setting small{font-size:.72rem;color:var(--ff-text-3)}
.setting:has(input:disabled){opacity:.5;cursor:default}
.universal-grid label.field{flex-direction:column;align-items:stretch;justify-content:flex-start;gap:.35rem;margin-top:0}
.field-row{display:flex;align-items:center;gap:.6rem}
.rules{display:grid;gap:.5rem}
.rules:empty{display:none}
.rule{display:grid;grid-template-columns:minmax(8rem,10rem) minmax(0,1fr) minmax(0,1fr) auto;gap:.5rem;align-items:center}
#excludes .rule{grid-template-columns:minmax(8rem,10rem) minmax(0,1fr) auto}
.rule-del{width:2.4rem;padding:0;justify-content:center}
.rules-gap{margin-top:1.5rem!important}
.folder-button{position:relative;overflow:hidden;cursor:pointer}
.folder-button input{position:absolute;inset:0;opacity:0;cursor:pointer}
@media(max-width:760px){.rule,#excludes .rule{grid-template-columns:1fr}}

/* the top bar: the kit's ff-topbar (small), laid out like their original: name left, links in the middle, badge
   right. Only as wide as what's in it (a short pill, centered on the page); both sides get the same width, so the
   links sit exactly in its middle. */
.app-topbar{display:grid;grid-template-columns:1fr auto 1fr;column-gap:.75rem;width:fit-content;max-width:calc(100% - 1.5rem);margin:1.25rem auto 0;--ff-topbar-height:2.6rem;--ff-topbar-pad:.45rem}
.app-topbar-start{display:flex;align-items:center;min-width:0}
.app-topbar .app-toplinks{justify-content:center}
.app-topbar .ff-topbar-link{height:1.8rem}
.app-topbar .ff-topbar-end{justify-self:end;margin-left:0;padding-left:0}
@media(max-width:600px){.app-topbar{grid-template-columns:auto auto;column-gap:.35rem}.app-topbar .ff-topbar-end,.app-topbar .ff-topbar-sep,.app-topbar .ff-topbar-brand .ff-icon{display:none}.app-topbar .ff-topbar-link{padding:0 .55rem}}
.intro{padding-bottom:2.5rem}
