.tool-hero{background:linear-gradient(135deg,#1d476c,#27766f);color:#fff;text-align:center;padding:2.4rem 0}.tool-area{padding:2rem 0 3rem}.setup,.bracket-panel{background:#fff;border:1px solid #d7e4ed;border-radius:16px;box-shadow:0 12px 28px #0f172a12;padding:1.2rem;margin-bottom:1rem}.setup{max-width:900px;margin:0 auto 1rem}.setup label{display:block;color:#23415a;font-weight:800;margin:.5rem 0}.setup textarea,.setup select{box-sizing:border-box;width:100%;font:inherit;border:1px solid #92a8b8;border-radius:9px;padding:.7rem;color:#162d3e;background:#fff}.setup textarea{min-height:170px;line-height:1.6;resize:vertical}.setup select{max-width:18rem}.actions{display:flex;gap:.7rem;flex-wrap:wrap;align-items:center}.actions button{border:0;border-radius:9px;background:#196c73;color:white;font-weight:800;padding:.75rem 1.2rem;cursor:pointer}.actions button.secondary{background:#e6f2f1;color:#18545a}.actions button:focus-visible,.entrant:focus-visible{outline:3px solid #eab308;outline-offset:2px}.message{min-height:1.4em;color:#45596e}.bracket-panel{overflow-x:auto}.bracket{display:flex;gap:1rem;min-width:max-content;padding-bottom:.5rem}.round{min-width:145px;width:clamp(145px,16vw,220px);display:flex;flex-direction:column;justify-content:space-around;gap:.8rem}.round h3{margin:0 0 .4rem;text-align:center;color:#244864;font-size:1rem}.match{border:1px solid #aac9d3;background:#f7fbfc;border-radius:10px;padding:.35rem;display:grid;gap:.3rem}.entrant{font:inherit;text-align:left;overflow-wrap:anywhere;border:1px solid #c8d6e0;background:#fff;color:#17364a;border-radius:7px;min-height:2.5rem;padding:.35rem .5rem;cursor:pointer}.entrant:disabled{cursor:default;color:#73899a;background:#f0f5f7}.entrant.winner{border-color:#12a185;background:#dff7ef;color:#085946;font-weight:900}.champion{text-align:center;color:#0e7460;font-size:1.3rem;font-weight:900;overflow-wrap:anywhere}.how-to-section,.faq-section,.related-tools{padding:2rem 0}.seo-info-card{line-height:1.8}.setup h2,.how-to-section h2,.faq-section h2,.faq-section summary{word-break:keep-all;overflow-wrap:anywhere}@media(max-width:600px){.tool-area{padding:1rem 0 2rem}.setup,.bracket-panel{padding:.8rem}}@page{size:A4 landscape;margin:8mm}@media print{body{background:#fff!important}.navbar,.tool-breadcrumb,.tool-hero,.setup,.trust-badges,.how-to-section,.faq-section,.related-tools,.site-footer,.ad-slot{display:none!important}.tool-area,.tool-area .container{padding:0!important;margin:0!important;max-width:none!important}.bracket-panel{border:0;box-shadow:none;overflow:visible;padding:0;margin:0}.bracket{gap:2mm;min-width:0;width:100%;padding:0}.round{min-width:0;width:auto;flex:1;gap:1mm}.round h3{font-size:9pt;margin:0}.match{padding:1mm;border-radius:2mm;gap:1mm}.entrant{font-size:8pt;min-height:5mm;padding:1mm;border-radius:1mm}.champion{font-size:12pt;margin:3mm 0}.tool-container{box-shadow:none}}
.tool-hero h1{color:#fff}
.view-toggle{display:flex;justify-content:center;gap:.5rem;margin:.5rem auto 1rem}
.view-toggle button{border:1px solid #8ba5b5;border-radius:999px;background:#fff;color:#23415a;font:inherit;font-weight:800;padding:.5rem .9rem;cursor:pointer}
.view-toggle button[aria-pressed=true]{background:#196c73;border-color:#196c73;color:#fff;box-shadow:0 0 0 2px #196c7340}
.view-toggle button:focus-visible{outline:3px solid #eab308;outline-offset:2px}
.bracket{position:relative}
.bracket--lines{display:grid;grid-template-columns:minmax(5rem,6.5rem) repeat(var(--slot-count),minmax(6.25rem,1fr));grid-template-rows:repeat(var(--round-count),minmax(6rem,auto));gap:2rem .65rem;align-items:center;min-width:max-content;padding:1rem .5rem 1rem 0}
.bracket--lines .round{display:contents}
.bracket--lines .round h3{grid-column:1;justify-self:end;align-self:center;margin:0}
.bracket--lines .match{position:relative;z-index:1;align-self:center;justify-self:center;width:clamp(8rem,14vw,12rem);box-sizing:border-box;border:0;border-radius:0;background:transparent;padding:0}
.bracket--lines .entrant{min-height:3rem;padding:.5rem .35rem;font-weight:700;border:0;border-bottom:1px solid #9ab6c3;border-radius:0;background:transparent}
.bracket--lines .entrant:disabled{background:transparent;border-bottom-color:#c8d6e0}
.bracket--lines .entrant.winner{border:1px solid #12a185;border-bottom-width:2px;border-radius:5px 5px 0 0;background:#dff7ef}
.bracket--lines .entrant:not(:disabled):not(.winner):hover{border-radius:5px 5px 0 0;background:#eef6f8}
.connector-layer{position:absolute;z-index:0;left:0;top:0;display:block;pointer-events:none;overflow:visible}
.connector-layer path{fill:none;stroke:#346f82;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:600px){.bracket--lines{grid-template-columns:minmax(4rem,5rem) repeat(var(--slot-count),minmax(6.5rem,1fr));gap:1.5rem .6rem}}
@media print{.view-toggle{display:none!important}.bracket--lines{display:flex;gap:2mm;min-width:0;width:100%;padding:0}.bracket--lines .round{display:flex;min-width:0;width:auto;flex:1;gap:1mm}.bracket--lines .round h3{grid-column:auto;justify-self:auto;align-self:auto}.bracket--lines .match{position:static;width:auto;justify-self:auto;border:1px solid #aac9d3;border-radius:2mm;background:#f7fbfc;padding:1mm}.bracket--lines .entrant{border:1px solid #c8d6e0;border-radius:1mm;background:#fff;padding:1mm}.bracket--lines .entrant:disabled{background:#f0f5f7}.bracket--lines .entrant.winner{border-color:#12a185;border-radius:1mm;background:#dff7ef}.bracket--lines .connector-layer{display:none}}
.setup{background:#f0f5f8;border-color:#c2d3de}
.setup textarea{border:2px solid #718b9a;background:#fff;box-shadow:inset 0 1px 3px #0f172a12}
.setup textarea::placeholder{color:#607382;opacity:1}
.setup textarea:focus-visible{outline:3px solid #196c7380;outline-offset:2px;border-color:#196c73}
.bracket--lines .match{grid-template-columns:repeat(2,minmax(0,1fr));gap:0;width:clamp(11rem,14vw,13rem)}
.bracket--lines .entrant{display:flex;align-items:center;justify-content:center;min-width:0;min-height:3.5rem;padding:.45rem .3rem;text-align:center;border:1px solid #718b9a;border-bottom:2px solid #536f82;border-radius:4px 4px 0 0;background:#e7f0f4}
.bracket--lines .entrant+.entrant{border-left:1px solid #718b9a}
.bracket--lines .entrant:disabled{color:#566f80;border-color:#9aadb8;background:#f1f5f7}
@media print{.bracket--lines .match{grid-template-columns:1fr;width:auto}.bracket--lines .entrant{display:block;min-height:5mm;padding:1mm;text-align:left}.bracket--lines .entrant+.entrant{border-left-color:#c8d6e0}}
