.tool-wrap{width:min(100% - 2rem,56rem);margin:0 auto;scroll-margin-top:4.5rem}@media (width>=640px){.tool-wrap{width:min(100% - 2rem,56rem)}}.tool-shell{gap:1rem;display:grid}.size-panel{text-align:center;justify-items:center;gap:.75rem;padding:.25rem 0 .15rem;display:grid}.size-label{color:var(--text);font-size:.82rem;font-weight:600}.size-custom{color:var(--muted);justify-content:center;align-items:center;gap:.55rem;font-size:.82rem;display:flex}.size-input-wrap{border:1px solid var(--hairline);background:var(--input-bg);border-radius:.5rem;display:flex;overflow:hidden}.size-input-wrap:focus-within{border-color:var(--action);box-shadow:0 0 0 3px #0066ff2e}.size-input-wrap input{width:4.6rem;color:var(--text);background:0 0;border:0;outline:none;padding:.55rem .7rem;font-size:.95rem;font-weight:700}.size-unit{color:var(--action);background:#0066ff14;place-items:center;padding:0 .7rem;font-size:.72rem;font-weight:700;display:grid}.dim-fold{text-align:center;justify-items:center;gap:.55rem;padding:0 0 .1rem;display:grid}.dim-toggle{color:var(--muted);cursor:pointer;background:0 0;border:0;align-items:center;gap:.28rem;margin:0;padding:.2rem .15rem;font-size:.82rem;font-weight:600;display:inline-flex}.dim-toggle:hover,.dim-toggle[aria-expanded=true]{color:var(--text)}.dim-toggle.has-value{color:var(--action)}.dim-toggle:active{transform:scale(.97)}.dim-chevron{width:.95rem;height:.95rem;transition:transform .18s cubic-bezier(.23,1,.32,1)}.dim-toggle[aria-expanded=true] .dim-chevron{transform:rotate(180deg)}.dim-panel{justify-items:center;gap:.7rem;width:100%;display:grid}.dim-panel[hidden]{display:none}.dim-panel .size-input-wrap input{width:3.55rem;padding:.55rem .5rem}.dim-times{color:var(--muted);font-weight:700}.size-dim-note{max-width:28rem;color:var(--muted);margin:0;font-size:.75rem;line-height:1.45}.dim-clear{color:var(--muted);cursor:pointer;background:0 0;border:0;margin:0;padding:.15rem .2rem;font-size:.75rem;font-weight:600}.dim-clear:hover{color:var(--text)}@media (prefers-reduced-motion:reduce){.dim-chevron{transition:none}}.preset-row{flex-wrap:wrap;justify-content:center;align-items:center;gap:.4rem;display:flex}.preset{border:1px solid var(--hairline);min-height:2.25rem;color:var(--text);background:var(--chip-bg);cursor:pointer;border-radius:.5rem;padding:.4rem .72rem;font-size:.78rem;font-weight:600;transition:background .16s,border-color .16s,color .16s,transform .12s ease-out}.preset:hover{border-color:#0066ff80}.preset.active{color:#fff;background:var(--action);border-color:#0000}.preset:active{transform:scale(.97)}.local-status,.trust-row,.drop-help,.trust-note,.file-card span,.result-card span{color:var(--muted);margin:0;font-size:.78rem;line-height:1.45}.local-status{text-align:center}.trust-row{color:var(--muted);text-align:center;flex-wrap:wrap;justify-content:center;align-items:center;gap:.45rem 1.15rem;margin:0;padding:.1rem 0 0;font-size:.78rem;line-height:1.35;list-style:none;display:flex}.trust-row li{align-items:center;gap:.35rem;display:inline-flex}.trust-row svg{width:.95rem;height:.95rem;color:var(--action);flex-shrink:0}.dropzone{border:2px dashed var(--dash);background:var(--drop-bg);text-align:center;cursor:pointer;border-radius:.75rem;justify-content:center;align-items:center;min-height:220px;padding:1.25rem 1rem;transition:border-color .2s,background .2s,transform .2s cubic-bezier(.23,1,.32,1),min-height .18s,padding .18s;display:flex;position:relative}@media (width>=1024px){.dropzone{min-height:280px;padding:4rem 2rem}}.dropzone.has-files{min-height:0;padding:.8rem 1rem}@media (width>=1024px){.dropzone.has-files{min-height:0;padding:.85rem 1.1rem}}.dropzone.has-files .drop-inner{flex-flow:wrap;justify-content:center;gap:.65rem 1rem}.dropzone.has-files .drop-icon{width:2.15rem;height:2.15rem}.dropzone.has-files .drop-copy{text-align:left}.dropzone:hover{border-color:#0066ff80}.dropzone.is-over,.dropzone:focus-visible{border-color:var(--action);background:#0066ff0d;outline:none;transform:scale(1.02)}.file-input{display:none}.drop-inner{flex-direction:column;align-items:center;gap:1rem;display:flex}@media (width>=1024px){.drop-inner{gap:1.5rem}}.drop-icon{width:3rem;height:3rem;color:var(--action);background:#0066ff1a;border-radius:999px;place-items:center;display:grid}.drop-icon svg{width:1.5rem;height:1.5rem}.drop-copy{gap:.5rem;display:grid}.drop-title{color:var(--text);margin:0;font-size:1.05rem;font-weight:500}.select-button{color:#fff;background:linear-gradient(135deg,#06f,#5d9dfd);border-radius:.5rem;align-items:center;gap:.45rem;padding:.62rem 1.35rem;font-size:.88rem;font-weight:600;display:inline-flex}.select-button svg{width:1rem;height:1rem}.file-grid,.result-grid{flex-wrap:wrap;justify-content:center;gap:.75rem;margin:0;padding:.1rem;list-style:none;display:flex;overflow-y:auto}.file-grid{max-height:23rem}.result-grid{max-height:34rem}.file-grid[hidden],.results[hidden]{display:none}.file-card,.result-card{border:1px solid var(--hairline);background:var(--surface-strong);border-radius:.6rem;flex:0 0 16rem;width:16rem;min-width:0;padding:.45rem}.thumb-wrap{aspect-ratio:1;background:var(--surface-soft);cursor:zoom-in;border-radius:.45rem;width:100%;position:relative;overflow:hidden}.thumb-wrap img{-o-object-fit:cover;object-fit:cover;width:100%;height:100%;display:block;position:absolute;inset:0}.thumb-wrap.is-file{cursor:default;background:linear-gradient(135deg, color-mix(in srgb, var(--action) 8%, var(--surface-soft)), var(--surface-soft));place-items:center;display:grid}.no-preview-mark{color:var(--muted);font-size:.78rem;font-weight:700}.no-preview-mark[hidden]{display:none}.no-preview-note{color:var(--muted);margin:.4rem 0 0;font-size:.74rem;line-height:1.4}.no-preview-note[hidden]{display:none}.file-card strong,.result-card strong{text-overflow:ellipsis;white-space:nowrap;margin-top:.4rem;font-size:.8rem;display:block;overflow:hidden}.file-card span,.result-card span{-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:.75rem;line-height:1.35;display:-webkit-box;overflow:hidden}.result-card.is-warn{border-color:color-mix(in srgb, #db7706 45%, var(--hairline))}.result-card .result-note:empty{display:none}.result-card .result-note.is-warn{-webkit-line-clamp:6;color:#7b4414}.dark .result-card .result-note.is-warn{color:#f8c477}.result-card .shrink-further{color:#7b4414;border-color:color-mix(in srgb, #db7706 40%, var(--hairline));background:color-mix(in srgb, #db7706 12%, var(--chip-bg))}.dark .result-card .shrink-further{color:#f8c477}.remove-file{color:#fff;cursor:pointer;background:#d31212;border:0;border-radius:999px;width:1.45rem;height:1.45rem;font-size:.95rem;line-height:1;position:absolute;top:.35rem;right:.35rem}.secondary-button{border:1px solid var(--hairline);width:100%;color:var(--text);background:var(--chip-bg);cursor:pointer;border-radius:.35rem;margin-top:.28rem;padding:.28rem .3rem;font-size:.68rem;font-weight:600}.secondary-button.subtle{width:auto;color:var(--muted);margin-top:0}.result-actions .secondary-button{width:auto;margin-top:0}.input-errors{border:1px solid color-mix(in srgb, var(--error) 28%, transparent);color:var(--error);background:color-mix(in srgb, var(--error) 7%, transparent);border-radius:.5rem;padding:.7rem .85rem;font-size:.82rem;line-height:1.45}.input-errors a{color:inherit;font-weight:700;text-decoration:underline}.input-errors p+p,.input-errors p+ul{margin-top:.55rem}.overflow-modal{z-index:95;place-items:center;padding:1rem;display:grid;position:fixed;inset:0}.overflow-modal[hidden]{display:none}.overflow-modal-backdrop{cursor:pointer;background:#14181e73;border:0;position:absolute;inset:0}.overflow-modal-card{z-index:1;aspect-ratio:1;border:1px solid var(--hairline,#d7dee8);text-align:center;background:#fff;border-radius:.85rem;align-content:center;width:min(20.5rem,100vw - 2rem);padding:1.7rem 1.15rem 1.2rem;display:grid;position:relative;box-shadow:0 16px 40px #0f172a29}.overflow-modal-x{color:#888;width:1.8rem;height:1.8rem;font:inherit;cursor:pointer;background:0 0;border:0;border-radius:999px;font-size:1.35rem;line-height:1;position:absolute;top:.4rem;right:.45rem}.overflow-modal-card h3{color:#e10600;margin:0 0 .55rem;font-size:1.15rem;font-weight:800;line-height:1.2}.overflow-modal-body{color:#e10600;justify-items:center;gap:.55rem;font-size:.84rem;line-height:1.45;display:grid}.overflow-modal-body p{max-width:17.5rem;margin:0}.overflow-modal-body a{color:#e10600;font-weight:800;text-decoration:underline}.overflow-handoff-list{justify-content:center;width:100%;margin:.35rem 0 0;padding:0;display:flex}.overflow-modal-card .primary-button{width:auto;min-width:0}.overflow-modal-card .primary-button:disabled{cursor:wait}.form-actions{text-align:center;justify-items:center;gap:.65rem;display:grid}.run-progress{gap:.55rem;width:min(100%,22rem);display:grid}.run-progress[hidden]{display:none}.run-progress-copy{justify-items:center;gap:.2rem;display:grid}.run-progress-pct{color:var(--action);letter-spacing:-.04em;font-variant-numeric:tabular-nums;font-size:1.7rem;font-weight:800;line-height:1}.run-status{color:var(--muted);margin:0;font-size:.82rem;font-weight:600;line-height:1.35}.run-progress-track{background:color-mix(in srgb, var(--action) 12%, var(--chip-bg));border-radius:999px;height:.55rem;overflow:hidden}.run-progress-fill{border-radius:inherit;background:linear-gradient(135deg,#06f,#5d9dfd);width:0;height:100%;transition:width .18s ease-out;position:relative;overflow:hidden}.run-progress-fill:after{content:"";background:linear-gradient(90deg,#0000,#ffffff61,#0000);animation:1.15s ease-in-out infinite run-sheen;position:absolute;inset:0}@keyframes run-sheen{0%{transform:translate(-100%)}to{transform:translate(100%)}}.file-card.is-working{border-color:color-mix(in srgb, var(--action) 55%, var(--hairline));box-shadow:0 0 0 3px color-mix(in srgb, var(--action) 14%, transparent)}.result-card .secondary-button{width:100%;margin-top:.4rem;padding:.42rem .5rem;font-size:.78rem}@media (prefers-reduced-motion:reduce){.run-progress-fill{transition:none}.run-progress-fill:after{animation:none}}.form-actions[hidden]{display:none}.primary-button{color:#fff;cursor:pointer;background:linear-gradient(135deg,#06f,#5d9dfd);border:0;border-radius:.5rem;justify-content:center;align-items:center;min-width:min(100%,16rem);min-height:2.7rem;padding:.7rem 1.35rem;font-size:.9rem;font-weight:700;transition:transform .12s ease-out,filter .16s;display:inline-flex}.primary-button:hover:not(:disabled){filter:brightness(.96)}.primary-button:active:not(:disabled){transform:scale(.97)}.primary-button:disabled{cursor:not-allowed;opacity:.45}.primary-button[hidden]{display:none}.results{gap:.85rem;padding-top:.25rem;display:grid}.results-heading{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;display:flex}.results-heading h3{margin:0;font-size:1.05rem;font-weight:600}.result-actions{gap:.4rem;display:flex}.result-actions [hidden]{display:none}.card-savings{border:1px solid color-mix(in srgb, var(--action) 16%, transparent);background:color-mix(in srgb, var(--action) 6%, var(--chip-bg));border-radius:.7rem;align-items:center;gap:.65rem;margin-top:.45rem;padding:.55rem .55rem .55rem .45rem;display:flex}.result-card .savings-meter{flex:none;width:3.35rem;height:3.35rem;position:relative}.result-card .savings-meter svg{width:100%;height:100%;transform:rotate(-90deg)}.result-card .savings-ring,.result-card .savings-segment{fill:none;stroke-width:3px}.result-card .savings-ring{stroke:color-mix(in srgb, var(--action) 16%, var(--chip-bg))}.result-card .savings-segment{stroke:var(--action);stroke-linecap:round}.result-card .savings-meter b{letter-spacing:-.03em;font-variant-numeric:tabular-nums;place-items:center;font-size:.72rem;font-weight:800;display:grid;position:absolute;inset:0}.result-card .savings-copy{gap:.12rem;min-width:0;display:grid}.result-card .savings-title,.result-card .savings-sizes{-webkit-line-clamp:unset;margin:0;display:block}.result-card .savings-title{font-size:.78rem;font-weight:700;line-height:1.3}.result-card .savings-sizes{color:var(--muted);font-size:.72rem;font-weight:600;line-height:1.35}.share-block{text-align:center;justify-items:center;gap:.4rem;padding:1rem 0 .2rem;display:grid}.share-block[hidden]{display:none}.share-block h4{margin:0;font-size:1.12rem;font-weight:800}.share-block>p{max-width:28rem;color:var(--muted);margin:0;font-size:.92rem;line-height:1.45}.share-list{flex-wrap:wrap;justify-content:center;gap:.2rem 1.15rem;margin:.35rem 0 0;padding:0;list-style:none;display:flex}.share-link{color:var(--text);font:inherit;cursor:pointer;background:0 0;border:0;align-items:center;gap:.4rem;padding:.35rem 0;font-size:.92rem;font-weight:600;display:inline-flex}.share-link svg{flex:none;width:1.05rem;height:1rem}.share-link:hover,.share-link:focus-visible{text-decoration:underline}.dark .overflow-modal-card{background:#fff;border-color:#e5e7eb}.dark .share-link svg path[fill=\#161616]{fill:#f3f4f6}.dark .share-link svg path[stroke=\#334155]{stroke:#e2e8f0}@media (width<=720px){.form-actions .primary-button{width:100%}}.lightbox{z-index:80;place-items:center;padding:4.75rem 4.2rem 2rem;display:grid;position:fixed;inset:0}.lightbox[hidden]{display:none}.lightbox-backdrop{cursor:zoom-out;background:#07090dd6;border:0;position:absolute;inset:0}.lightbox-chrome{z-index:2;justify-content:space-between;align-items:center;gap:1rem;padding:.85rem 1rem;display:flex;position:absolute;top:0;left:0;right:0}.lightbox-meta{color:#fff;gap:.15rem;min-width:0;margin:0;display:grid}.lightbox-meta strong{text-overflow:ellipsis;white-space:nowrap;font-size:.92rem;overflow:hidden}.lightbox-meta span{color:#ffffffb3;font-size:.78rem}.lightbox-actions{flex-shrink:0;align-items:center;gap:.45rem;display:flex}.lightbox-action,.lightbox-close,.lightbox-nav{color:#fff;cursor:pointer;background:#ffffff1f;border:0}.lightbox-action{border-radius:.45rem;padding:.42rem .75rem;font-size:.8rem;font-weight:700}.lightbox-action:hover,.lightbox-close:hover,.lightbox-nav:hover{background:#fff3}.lightbox-action:active,.lightbox-close:active{transform:scale(.97)}.lightbox-close{border-radius:999px;width:2.2rem;height:2.2rem;font-size:1.4rem;line-height:1}.lightbox-nav{z-index:2;border-radius:999px;width:2.6rem;height:2.6rem;font-size:1.7rem;line-height:1;position:absolute;top:50%;transform:translateY(-50%)}.lightbox-nav:active{transform:translateY(-50%)scale(.97)}.lightbox-nav.prev{left:.75rem}.lightbox-nav.next{right:.75rem}.lightbox-nav[hidden],.lightbox-action[hidden]{display:none}.lightbox-image{z-index:1;-o-object-fit:contain;object-fit:contain;border-radius:.55rem;max-width:min(92vw,56rem);max-height:min(76vh,44rem);position:relative;box-shadow:0 18px 50px #00000059}@media (width<=640px){.lightbox{padding:4.6rem .75rem 1.25rem}.lightbox-nav{width:2.2rem;height:2.2rem}.lightbox-nav.prev{left:.35rem}.lightbox-nav.next{right:.35rem}}@media (prefers-reduced-motion:reduce){.lightbox-action:active,.lightbox-close:active{transform:none}.lightbox-nav:active{transform:translateY(-50%)}}.bpm-tool{gap:1rem}.bpm-tool .secondary-button,.bpm-tool .primary-button{width:auto;min-height:2.1rem;margin-top:0;padding:.35rem .8rem;font-size:.8rem}.sr-copy{opacity:0;position:fixed;top:0;left:-9999px}.bpm-tabs{border:1px solid var(--hairline);background:var(--surface-soft);border-radius:.85rem;grid-template-columns:repeat(2,minmax(0,1fr));gap:.4rem;padding:.3rem;display:grid}@media (width>=640px){.bpm-tabs{grid-template-columns:repeat(4,minmax(0,1fr))}}.bpm-tab{min-height:2.6rem;color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:.6rem;justify-content:center;align-items:center;gap:.45rem;padding:.45rem .6rem;font-size:.88rem;font-weight:600;transition:background .16s,color .16s,transform .12s ease-out;display:inline-flex}.bpm-tab svg{flex-shrink:0;width:1.1rem;height:1.1rem}.bpm-tab:hover{color:var(--text);background:var(--surface-hover)}.bpm-tab[aria-selected=true]{color:#fff;background:var(--action)}.bpm-tab:active{transform:scale(.97)}.bpm-tab:focus-visible,.tap-pad:focus-visible,.link-button:focus-visible{outline:2px solid var(--action);outline-offset:2px}.bpm-panel[hidden]{display:none}.bpm-demo-row{color:var(--muted);text-align:center;margin:.75rem 0 0;font-size:.82rem}.link-button{color:var(--action);font:inherit;text-underline-offset:3px;cursor:pointer;background:0 0;border:0;margin:0;padding:.1rem .15rem;font-weight:600;text-decoration:underline}.link-button:disabled{opacity:.5;cursor:wait}.tap-wrap,.live-wrap{border:1px solid var(--hairline);background:var(--drop-bg);text-align:center;border-radius:.75rem;justify-items:center;gap:1rem;padding:1.5rem 1rem;display:grid}.tap-pad{color:#fff;background:var(--action);cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;touch-action:manipulation;-webkit-tap-highlight-color:transparent;border:0;border-radius:999px;place-content:center;gap:.15rem;width:11rem;height:11rem;display:grid;box-shadow:0 10px 30px #0066ff47}.tap-pad-label{letter-spacing:-.02em;font-size:2rem;font-weight:800}.tap-pad-hint{opacity:.85;font-size:.75rem}.tap-pad.is-hit{animation:.16s ease-out tap-hit}@keyframes tap-hit{0%{transform:scale(.94)}to{transform:scale(1)}}.tap-bpm,.live-bpm{color:var(--text);font-variant-numeric:tabular-nums;letter-spacing:-.03em;justify-content:center;align-items:baseline;gap:.4rem;margin:0;font-size:3.4rem;font-weight:800;line-height:1;display:flex}.tap-bpm small,.live-bpm small{color:var(--muted);letter-spacing:0;font-size:.9rem;font-weight:700}.tap-meta,.live-status,.live-intro,.live-key,.live-note{max-width:34rem;color:var(--muted);margin:0;font-size:.82rem;line-height:1.5}.live-key{color:var(--text);font-weight:600}.tap-actions,.live-actions{flex-wrap:wrap;justify-content:center;align-items:center;gap:.5rem;display:flex}.live-readout{justify-items:center;gap:.5rem;display:grid}.live-badge{color:var(--success);background:color-mix(in srgb, var(--success) 14%, transparent);border-radius:999px;margin:0;padding:.2rem .65rem;font-size:.75rem;font-weight:700}.live-meter{background:var(--hairline);border-radius:999px;width:min(100%,22rem);height:.5rem;overflow:hidden}.live-meter span{width:var(--level,0%);border-radius:inherit;background:var(--action);height:100%;transition:width 90ms linear;display:block}.bpm-list{gap:.65rem;margin:0;padding:0;list-style:none;display:grid}.bpm-card{border:1px solid var(--hairline);background:var(--surface-strong);border-radius:.75rem;gap:.75rem;padding:.85rem .95rem;display:grid}@media (width>=720px){.bpm-card{grid-template-columns:minmax(0,1fr) auto;align-items:center}}.bpm-card-main{align-items:center;gap:.95rem;min-width:0;display:flex}.bpm-readout{min-width:4.8rem;color:var(--action);background:#0066ff14;border-radius:.6rem;justify-items:center;padding:.45rem .6rem;display:grid}.bpm-value{font-variant-numeric:tabular-nums;letter-spacing:-.03em;font-size:2rem;font-weight:800;line-height:1.05}.bpm-unit{letter-spacing:.08em;font-size:.68rem;font-weight:700}.bpm-info{min-width:0}.bpm-name{color:var(--text);text-overflow:ellipsis;white-space:nowrap;margin:0;font-size:.92rem;font-weight:650;overflow:hidden}.bpm-meta,.bpm-flag{color:var(--muted);margin:.15rem 0 0;font-size:.78rem;line-height:1.45}.bpm-meta.is-error{color:var(--error)}.bpm-flag{color:var(--text)}.bpm-progress{background:var(--hairline);border-radius:999px;height:.35rem;margin-top:.45rem;overflow:hidden}.bpm-progress span{width:var(--p,0%);border-radius:inherit;background:var(--action);height:100%;transition:width .12s linear;display:block}.bpm-actions{flex-wrap:wrap;gap:.4rem;display:flex}.bpm-card.is-queued,.bpm-card.is-decoding{opacity:.85}.verify{border:1px solid var(--hairline-strong);background:var(--surface-strong);border-radius:.75rem;gap:.8rem;padding:1rem;display:grid}.verify[hidden]{display:none}.verify-head{justify-content:space-between;align-items:flex-start;gap:1rem;display:flex}.verify-head h3{margin:0;font-size:1rem}.verify-file{overflow-wrap:anywhere;color:var(--muted);margin:.15rem 0 0;font-size:.78rem}.verify-wave{border:1px solid var(--hairline);border-radius:.5rem;width:100%;height:150px;display:block}.verify-seek{width:100%;accent-color:var(--action)}.verify-controls,.verify-tune{flex-wrap:wrap;align-items:center;gap:.6rem 1rem;display:flex}.verify-play{min-width:5.5rem}.verify-click{color:var(--text);cursor:pointer;align-items:center;gap:.4rem;font-size:.85rem;display:inline-flex}.verify-time{color:var(--muted);font-variant-numeric:tabular-nums;margin-left:auto;font-size:.82rem}.verify-bpm{color:var(--muted);font-size:.85rem}.verify-bpm strong{color:var(--text);font-variant-numeric:tabular-nums;font-size:1.4rem}.verify-tune-buttons{flex-wrap:wrap;gap:.4rem;display:flex}.verify-hint{color:var(--muted);margin:0;font-size:.78rem;line-height:1.5}@media (prefers-reduced-motion:reduce){.tap-pad.is-hit{animation:none}.bpm-progress span,.live-meter span{transition:none}}.step-grid .step-visual{aspect-ratio:16/9}.step-visual picture,.feature-visual picture{width:100%;height:100%;display:block}figure.feature-visual img{aspect-ratio:16/9;height:auto}.tip-list{padding-left:1.25rem;list-style:outside}.genre-table-wrap{border:1px solid var(--hairline);background:var(--surface-strong);border-radius:.75rem;overflow-x:auto}.genre-table{border-collapse:collapse;text-align:left;width:100%;min-width:34rem;font-size:.9rem}.genre-table th,.genre-table td{border-bottom:1px solid var(--hairline);vertical-align:top;padding:.7rem .95rem}.genre-table thead th{color:var(--muted);background:var(--surface-soft);letter-spacing:.05em;text-transform:uppercase;font-size:.75rem;font-weight:700}.genre-table tbody th{color:var(--text);font-weight:650}.genre-table td:nth-child(2){color:var(--action);font-variant-numeric:tabular-nums;white-space:nowrap;font-weight:700}.genre-table td:last-child{color:var(--muted)}.genre-table tbody tr:last-child th,.genre-table tbody tr:last-child td{border-bottom:0}.hero-section{isolation:isolate;position:relative}.hero-section:before{content:"";z-index:-1;pointer-events:none;background-image:linear-gradient(#52627a12 1px,#0000 1px),linear-gradient(90deg,#52627a12 1px,#0000 1px);background-size:44px 44px;position:absolute;inset:0;-webkit-mask-image:radial-gradient(70% 80% at 50% 35%,#000 25%,#0000 78%);mask-image:radial-gradient(70% 80% at 50% 35%,#000 25%,#0000 78%)}.dark .hero-section:before{background-image:linear-gradient(#bdc9db0f 1px,#0000 1px),linear-gradient(90deg,#bdc9db0f 1px,#0000 1px)}.bpm-tab-text{text-align:left;gap:.05rem;line-height:1.2;display:grid}.bpm-tab-hint{color:var(--muted);font-size:.7rem;font-weight:500;display:none}.bpm-tab[aria-selected=true] .bpm-tab-hint{color:inherit;opacity:.85}@media (width>=640px){.bpm-tab{justify-content:flex-start;gap:.6rem;padding:.5rem .8rem}.bpm-tab-hint{display:block}}.drop-art{justify-items:center;gap:.6rem;display:grid}.dropzone.has-files .drop-art,.dropzone:not(.has-files) .drop-icon{display:none}.metronome{width:3.6rem;height:auto;overflow:visible}@media (width>=1024px){.metronome{width:4.4rem}}.metronome-body{fill:color-mix(in srgb, var(--text) 88%, transparent)}.metronome-window{fill:var(--drop-bg)}.metronome-rod,.metronome-weight,.metronome-pivot{fill:var(--action)}.metronome-arm{transform-box:view-box;transform-origin:32px 62px;animation:1.6s ease-in-out infinite metronome-swing}.dropzone.is-over .metronome-arm{animation-duration:.7s}@keyframes metronome-swing{0%,to{transform:rotate(-26deg)}50%{transform:rotate(26deg)}}.eq{align-items:flex-end;gap:4px;height:1.5rem;display:flex}.eq i{background:var(--action);opacity:.55;transform-origin:bottom;border-radius:2px;width:4px;height:100%;animation:1.2s ease-in-out infinite eq-bar;transform:scaleY(.3)}.eq i:nth-child(2n){animation-duration:.95s}.eq i:nth-child(3n){animation-duration:1.4s}.eq i:first-child{animation-delay:-.1s}.eq i:nth-child(2){animation-delay:-.5s}.eq i:nth-child(3){animation-delay:-.9s}.eq i:nth-child(4){animation-delay:-.3s}.eq i:nth-child(5){animation-delay:-.7s}.eq i:nth-child(6){animation-delay:-1.1s}.eq i:nth-child(7){animation-delay:-.2s}.eq i:nth-child(8){animation-delay:-.6s}.eq i:nth-child(9){animation-delay:-1s}@keyframes eq-bar{0%,to{opacity:.45;transform:scaleY(.25)}50%{opacity:1;transform:scaleY(1)}}.eq-live{justify-self:center}.eq-live i{animation-play-state:paused}[data-live].is-active .eq-live i{animation-play-state:running}.tap-stage{place-items:center;width:13rem;height:13rem;display:grid;position:relative}.tap-stage:before,.tap-stage:after{content:"";border:2px solid var(--action);opacity:0;pointer-events:none;border-radius:999px;position:absolute;inset:.5rem}.tap-stage:has(.tap-pad.is-hit):before,.tap-stage:has(.tap-pad.is-beat):before{animation:.62s ease-out tap-ring}.tap-stage:has(.tap-pad.is-beat):after{animation:.62s ease-out 90ms tap-ring}@keyframes tap-ring{0%{opacity:.55;transform:scale(.88)}to{opacity:0;transform:scale(1.2)}}.tap-pad.is-beat{animation:.16s ease-out tap-hit}.tap-dots{gap:.45rem;margin:0;display:flex}.tap-dots i{background:var(--hairline);border-radius:999px;width:.6rem;height:.6rem;transition:background .16s,transform .16s ease-out}.tap-dots i.is-on{background:var(--action);transform:scale(1.2)}.tap-sound{flex-wrap:wrap;justify-content:center;gap:.5rem;display:flex}.sound-toggle{border:1px solid var(--hairline);min-height:2.25rem;color:var(--muted);background:var(--surface-strong);cursor:pointer;border-radius:999px;align-items:center;gap:.4rem;padding:.35rem .9rem;font-size:.82rem;font-weight:600;transition:color .16s,border-color .16s,background .16s,transform .12s ease-out;display:inline-flex}.sound-toggle svg{width:1.1rem;height:1.1rem}.sound-toggle:hover:not(:disabled){color:var(--text)}.sound-toggle:active:not(:disabled){transform:scale(.97)}.sound-toggle:focus-visible{outline:2px solid var(--action);outline-offset:2px}.sound-toggle:disabled{opacity:.5;cursor:not-allowed}.sound-toggle[aria-pressed=true]{color:var(--action);border-color:var(--action);background:#0066ff14}.sound-toggle[aria-pressed=true] .sound-mute,.sound-toggle[aria-pressed=false] .sound-waves{display:none}.bpm-card{animation:.32s cubic-bezier(.23,1,.32,1) both card-in}.bpm-card.is-done{animation:.9s ease-out card-done}@keyframes card-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@keyframes card-done{0%{border-color:var(--action);box-shadow:0 0 0 4px #0066ff29}to{border-color:var(--hairline);box-shadow:0 0 #0000}}.bpm-progress span{background-image:linear-gradient(90deg, var(--action), color-mix(in srgb, var(--action) 55%, #fff), var(--action));background-size:200% 100%;animation:1.4s linear infinite bar-shimmer}@keyframes bar-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.bpm-stages{flex-wrap:wrap;gap:.35rem;margin:.45rem 0 0;padding:0;list-style:none;display:flex}.bpm-stages li{border:1px solid var(--hairline);color:var(--muted);border-radius:999px;padding:.12rem .55rem;font-size:.68rem;font-weight:600;transition:color .16s,border-color .16s,background .16s}.bpm-stages li.is-done{color:var(--text)}.bpm-stages li.is-active{color:var(--action);border-color:var(--action);background:#0066ff14}.bpm-wave-frame{border-radius:.5rem;grid-column:1/-1;position:relative;overflow:hidden}.bpm-wave-frame.is-seekable{cursor:pointer}.bpm-scan{pointer-events:none;background:linear-gradient(90deg,#0000,#0066ff38,#0000);animation:1.6s ease-in-out infinite wave-scan;position:absolute;inset:0}@keyframes wave-scan{0%{transform:translate(-100%)}to{transform:translate(100%)}}.bpm-wave{border:0 solid var(--hairline);outline:0 solid var(--text);width:100%;height:2.75rem;color:var(--action);display:block}.bpm-value.is-counting{opacity:.9}.play-button{border:1px solid var(--action);color:#fff;background:var(--action);border-radius:999px;align-items:center;gap:.4rem;min-height:2.25rem;padding:0 .95rem;font-size:.85rem;font-weight:700;transition:transform .14s,background .14s,box-shadow .14s;display:inline-flex}.play-button:hover:not(:disabled){box-shadow:0 6px 16px -6px var(--action)}.play-button:active:not(:disabled){transform:scale(.96)}.play-button:disabled{opacity:.6}.play-button.is-on{color:var(--action);background:#0066ff1a}.bpm-card.is-playing{border-color:var(--action);box-shadow:0 0 0 3px #0066ff1f}.bpm-readout{position:relative}.bpm-readout.is-beat:after{content:"";border:2px solid var(--action);border-radius:inherit;pointer-events:none;animation:.48s ease-out forwards readout-ping;position:absolute;inset:0}.bpm-readout.is-beat .bpm-value{animation:.2s ease-out readout-bump}@keyframes readout-ping{0%{opacity:.7;transform:scale(1)}to{opacity:0;transform:scale(1.22)}}@keyframes readout-bump{40%{transform:scale(1.1)}}@media (prefers-reduced-motion:reduce){.bpm-scan,.bpm-readout.is-beat:after,.bpm-readout.is-beat .bpm-value,.metronome-arm,.eq i,.bpm-card,.bpm-card.is-done,.bpm-progress span,.tap-stage:before,.tap-stage:after,.tap-pad.is-beat{animation:none!important}.eq i{transform:scaleY(.6)}}.bpm-stage{border:1px solid var(--hairline);background:radial-gradient(circle at 50% 0%, #0066ff1a, transparent 60%), var(--surface-soft);border-radius:1rem;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:1.5rem;margin:1.25rem 0 0;padding:1.25rem 1.5rem;animation:.38s cubic-bezier(.23,1,.32,1) both card-in;display:grid;position:relative;overflow:hidden}.bpm-stage[hidden]{display:none}.bpm-stage.is-reveal{animation:1.1s ease-out stage-reveal}.bpm-stage.is-playing{border-color:var(--action);box-shadow:0 0 0 3px #0066ff1f}@keyframes stage-reveal{0%{border-color:var(--action);box-shadow:0 0 0 6px #0066ff38}to{border-color:var(--hairline);box-shadow:0 0 #0000}}.stage-meter svg{display:block;overflow:visible}.meter-body{fill:var(--surface-strong);stroke:var(--hairline-strong);stroke-width:1.5px}.meter-slot{fill:var(--hairline)}.meter-ticks line{stroke:var(--muted);stroke-width:1.2px;opacity:.6}.meter-rod{fill:var(--text)}.meter-weight,.meter-tip,.meter-pivot{fill:var(--action)}.meter-pivot{stroke:var(--surface-strong);stroke-width:2px}.stage-arm{transform-origin:60px 150px;transform-box:view-box;transition:transform .42s cubic-bezier(.23,1,.32,1)}.bpm-stage.is-playing .stage-arm{transition:none}.bpm-stage.is-busy .stage-arm{animation:1.1s cubic-bezier(.37,0,.63,1) infinite alternate arm-busy}@keyframes arm-busy{0%{transform:rotate(-24deg)}to{transform:rotate(24deg)}}.stage-main{text-align:center;justify-items:center;gap:.5rem;min-width:0;display:grid}.stage-file{max-width:100%;color:var(--muted);text-overflow:ellipsis;white-space:nowrap;margin:0;font-size:.8rem;overflow:hidden}.stage-number{color:var(--action);align-items:baseline;gap:.4rem;display:flex;position:relative}.stage-number strong{letter-spacing:-.02em;font-variant-numeric:tabular-nums;text-shadow:0 0 28px #0066ff59;font-size:clamp(3.4rem,9vw,5.2rem);font-weight:800;line-height:1}.bpm-stage.is-busy .stage-number strong{animation:1.1s ease-in-out infinite alternate stage-breathe}@keyframes stage-breathe{0%{opacity:.35}to{opacity:.9}}.stage-number span{letter-spacing:.2em;font-size:.8rem;font-weight:700}.stage-number.is-beat:after{content:"";border:2px solid var(--action);pointer-events:none;border-radius:999px;animation:.52s ease-out forwards readout-ping;position:absolute;inset:-.4rem -1rem}.stage-number.is-beat strong{animation:.22s ease-out readout-bump}.stage-number.is-bump strong{animation:.26s ease-out readout-bump}.stage-chips{border:1px solid var(--hairline);border-radius:999px;gap:.2rem;padding:.2rem;display:inline-flex}.stage-chips button{min-width:2.7rem;color:var(--muted);background:0 0;border:0;border-radius:999px;padding:.3rem .8rem;font-size:.78rem;font-weight:700;transition:color .16s,background .16s}.stage-chips button:hover{color:var(--text)}.stage-chips button.is-on{color:#fff;background:var(--action)}.bpm-stage.is-busy .stage-chips{opacity:.4;pointer-events:none}.stage-meta{color:var(--muted);margin:0;font-size:.85rem}.stage-side{justify-items:center;gap:.35rem;display:grid}.stage-ring{place-items:center;display:grid;position:relative}.stage-ring svg{transform:rotate(-90deg)}.ring-track,.ring-fill{fill:none;stroke-width:7px}.ring-track{stroke:var(--hairline)}.ring-fill{stroke:var(--action);stroke-linecap:round;transition:stroke-dashoffset .9s cubic-bezier(.23,1,.32,1)}.stage-ring strong{font-variant-numeric:tabular-nums;font-size:1.35rem;font-weight:800;position:absolute}.stage-ring-label{color:var(--muted);letter-spacing:.14em;text-transform:uppercase;margin:0 0 .35rem;font-size:.68rem;font-weight:700}.stage-time{color:var(--muted);font-variant-numeric:tabular-nums;margin:0;font-size:.72rem}@media (width<=719px){.bpm-stage{grid-template-columns:1fr;justify-items:center;gap:1rem;padding:1.1rem 1rem}.stage-meter svg{width:76px;height:107px}}@media (prefers-reduced-motion:reduce){.bpm-stage,.bpm-stage.is-reveal,.bpm-stage.is-busy .stage-arm,.bpm-stage.is-busy .stage-number strong,.stage-number.is-beat:after,.stage-number.is-beat strong,.stage-number.is-bump strong{animation:none!important}.ring-fill,.stage-arm{transition:none}}.stage-key{color:var(--action);background:#0066ff1a;border-radius:999px;margin:0;padding:.25rem .85rem;font-size:.95rem;font-weight:700}.stage-mix{max-width:100%;color:var(--muted);margin:0;font-size:.78rem}.stage-key[hidden],.stage-mix[hidden]{display:none}.bpm-tool[data-focus=key] .stage-main{grid-template-columns:minmax(0,1fr)}.bpm-tool[data-focus=key] .stage-key{order:-1;padding:.35rem 1.2rem;font-size:clamp(1.7rem,5vw,2.6rem);line-height:1.15}.bpm-tool[data-focus=key] .stage-number strong{text-shadow:none;font-size:clamp(2rem,5.5vw,3rem)}.bpm-tool[data-focus=key] .stage-file{order:-2}.calc-panel{margin-top:1rem}.calc-help{color:var(--muted);margin:0 0 .85rem;font-size:.9rem}.calc-fields{grid-template-columns:repeat(auto-fit,minmax(11rem,1fr));gap:.85rem;display:grid}.calc-field{gap:.3rem;display:grid}.calc-field span{color:var(--muted);letter-spacing:.04em;text-transform:uppercase;font-size:.78rem;font-weight:700}.calc-field input,.calc-field select{border:1px solid var(--hairline-strong);min-height:2.9rem;color:var(--text);background:var(--surface-strong);font:inherit;font-variant-numeric:tabular-nums;border-radius:.6rem;padding:0 .85rem;font-size:1.1rem;font-weight:600}.calc-field input:focus-visible,.calc-field select:focus-visible{outline:2px solid var(--action);outline-offset:1px}.calc-speed{min-height:1.4rem;color:var(--text);margin:.85rem 0 0;font-size:.9rem}.calc-result{border:1px solid var(--hairline);background:radial-gradient(circle at 50% 0%, #0066ff1a, transparent 60%), var(--surface-soft);border-radius:1rem;justify-items:center;gap:.35rem;margin-top:1.25rem;padding:1.25rem 1rem;display:grid}.calc-label{color:var(--muted);letter-spacing:.14em;text-transform:uppercase;margin:0;font-size:.75rem;font-weight:700}.calc-bpm{color:var(--action);align-items:baseline;gap:.4rem;margin:0;display:flex}.calc-bpm strong{font-variant-numeric:tabular-nums;text-shadow:0 0 28px #0066ff4d;font-size:clamp(3rem,9vw,4.6rem);font-weight:800;line-height:1}.calc-bpm span{letter-spacing:.2em;font-size:.8rem;font-weight:700}.calc-detail{color:var(--muted);text-align:center;margin:0;font-size:.85rem}.calc-actions{flex-wrap:wrap;justify-content:center;gap:.5rem;margin-top:.4rem;display:flex}.calc-notes{margin-top:1.25rem}.calc-notes h3{margin:0 0 .6rem;font-size:1rem}.calc-hint{color:var(--muted);margin:.6rem 0 0;font-size:.8rem}.calc-cell{color:inherit;font:inherit;font-variant-numeric:tabular-nums;cursor:pointer;background:0 0;border:0;border-radius:.4rem;padding:.15rem .45rem;transition:background .14s}.calc-cell:hover{background:#0066ff1f}.calc-cell.is-copied{color:#fff;background:var(--action)}:root{color-scheme:light;--canvas:#fff;--surface-strong:#fff;--surface-soft:#edf4fe8c;--surface-hover:#edf4fe;--input-bg:#fff;--results-bg:#edf4fe66;--text:#020817;--muted:#212225;--placeholder:#5c6470;--hairline:#e2e8f0;--hairline-strong:#c9d4e3;--action:#06f;--success:#188038;--error:#d31212;--drop-bg:linear-gradient(135deg, #fff, #edf4fe73);--dash:#1d222840;--chip-bg:#fff}.dark{color-scheme:dark;--canvas:#000;--surface-strong:#0a0a0a;--surface-soft:#1a1a1a;--surface-hover:#1f1f1f;--input-bg:#141414;--results-bg:#0f0f0f;--text:#fafafa;--muted:#a6a6a6;--placeholder:gray;--hairline:#262626;--hairline-strong:#383838;--action:#3385ff;--success:#30d158;--error:#ff6961;--drop-bg:transparent;--dash:#a6a6a640;--chip-bg:transparent}html{scroll-behavior:smooth;scroll-padding-top:4.5rem}body{color:var(--text);background:var(--canvas);margin:0;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji}.skip-link{z-index:100;color:#fff;background:var(--action);border-radius:999px;padding:.65rem .9rem;position:fixed;top:.75rem;left:.75rem;transform:translateY(-150%)}.skip-link:focus{transform:translateY(0)}#header{background:color-mix(in srgb, var(--canvas) 78%, transparent);backdrop-filter:blur(20px)saturate(160%);border-bottom:1px solid #0000}#header.scroll{border-bottom-color:var(--hairline)}#header a,#header button{color:var(--text)}#header [data-header-actions] a,#header [data-header-actions] button{color:var(--muted)}.home-page,.tool-page{--page-max:56rem;--page-gutter:1rem;background:var(--canvas);overflow:hidden}@media (width>=640px){.home-page,.tool-page{--page-gutter:1.5rem}}.hero-section{padding:clamp(.85rem,1.6vw,1.25rem) 0 clamp(1.5rem,2.5vw,2.25rem)}.hero-copy{width:min(100% - (var(--page-gutter) * 2), var(--page-max));text-align:center;margin:0 auto 1.25rem}.hero-badge{color:var(--action);background:#0066ff14;border:1px solid #0066ff2e;border-radius:999px;margin:0 0 .85rem;padding:.3rem .75rem;font-size:.75rem;font-weight:600;display:inline-flex}.hero-copy h1{letter-spacing:-.025em;color:var(--text);margin:0 0 1.5rem;font-size:1.875rem;font-weight:700;line-height:2.25rem}.hero-copy h1 span{color:var(--action)}@media (width>=768px){.hero-copy h1{font-size:3rem;line-height:1}}.hero-intro{max-width:42rem;color:var(--muted);margin:0 auto;font-size:1.125rem;line-height:1.75rem}@media (width>=768px){.hero-intro{font-size:1.25rem;line-height:1.75rem}}.hub-note a,.final-section a{color:var(--action);font-weight:600}.size-intent-grid{grid-template-columns:1fr;gap:1rem;margin:0 0 1.5rem;display:grid}@media (width>=640px){.size-intent-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width>=960px){.size-intent-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}.size-intent-grid article{border:1px solid var(--hairline);background:#fff;border-radius:.75rem;padding:1rem 1.1rem}.dark .size-intent-grid article{background:var(--surface-strong)}.size-intent-grid h3{margin:0 0 .45rem;font-size:1rem;font-weight:650}.size-intent-grid p{color:var(--muted);margin:0;font-size:.95rem;line-height:1.55}.size-intent-grid a,.related-sizes a,.prose-block a{color:var(--action);font-weight:600}.feature-visual{background:var(--surface-soft);border-radius:.75rem;width:100%;margin:1.5rem 0 0;overflow:hidden}.feature-visual img{aspect-ratio:4/3;-o-object-fit:cover;object-fit:cover;width:100%;height:auto;display:block}.feature-visual figcaption{color:var(--muted);padding:.65rem .85rem .85rem;font-size:.82rem;line-height:1.45}.related-sizes{flex-wrap:wrap;justify-content:center;gap:.65rem 1rem;margin:1rem 0 0;display:flex}.sibling-tool{border:1px solid var(--hairline);background:#fff;border-radius:.85rem;margin-top:1.25rem;padding:1.25rem 1.3rem 1.35rem}.dark .sibling-tool{background:var(--surface-strong)}.sibling-tool h2{letter-spacing:-.02em;margin:0 0 .65rem;font-size:1.25rem;font-weight:700}.sibling-tool h2 a{color:var(--action);text-decoration:none}.sibling-tool h2 a:hover{text-decoration:underline}.sibling-tool p{color:var(--muted);margin:0 0 .85rem;font-size:1rem;line-height:1.65}.sibling-tool .sibling-action{color:var(--action);font-weight:700;text-decoration:none}.sibling-tool .sibling-action:hover{text-decoration:underline}.page-crumbs{width:min(100% - (var(--page-gutter) * 2), var(--page-max));margin:.85rem auto 0}.section-kicker{color:var(--muted);letter-spacing:.04em;text-transform:uppercase;margin:0 0 .8rem;font-size:.75rem;font-weight:600}.content-section{width:min(100% - (var(--page-gutter) * 2), var(--page-max));border-top:1px solid var(--hairline);margin:0 auto;padding:clamp(3rem,6vw,5rem) 0}.section-heading{max-width:46rem;margin-bottom:2rem}.section-heading h2,.final-section h2{letter-spacing:-.025em;color:var(--text);margin:0 0 1rem;font-size:1.875rem;font-weight:700;line-height:2.25rem}.section-heading>p,.prose-block p,.final-section>p{color:var(--muted);font-size:1rem;line-height:1.625}.prose-block p+p{margin-top:1rem}.fact-list{grid-template-columns:repeat(auto-fit,minmax(11rem,1fr));gap:.85rem;margin:1.75rem 0 0;display:grid}.fact-list div{border:1px solid var(--hairline);background:#fff;border-radius:.75rem;padding:.85rem .95rem}.dark .fact-list div{background:var(--surface-strong)}.fact-list dt{color:var(--muted);letter-spacing:.04em;text-transform:uppercase;margin:0 0 .25rem;font-size:.75rem;font-weight:600}.fact-list dd{margin:0;font-size:.875rem;font-weight:600;line-height:1.25rem}.feature-grid,.use-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;display:grid}.feature-grid article,.use-grid article{border:1px solid var(--hairline);background:var(--surface-strong);box-shadow:none;text-align:center;border-radius:.75rem;padding:1.5rem 1.25rem 1.6rem}.step-grid article{border:1px solid var(--hairline);background:var(--surface-strong);box-shadow:none;text-align:left;border-radius:.75rem;padding:0 0 1.25rem;overflow:hidden}@media (hover:hover) and (pointer:fine){.feature-grid article:hover,.use-grid article:hover,.step-grid article:hover{box-shadow:0 10px 24px -16px #0066ff59}}.icon-bubble{width:3rem;height:3rem;color:var(--action);background:#0066ff1a;border-radius:.5rem;place-items:center;margin:0 auto 1rem;display:grid}.icon-bubble svg{width:1.35rem;height:1.35rem}.feature-grid h3,.use-grid h3,.step-grid h3{color:var(--text);margin:0 0 .5rem;font-size:1.125rem;font-weight:600;line-height:1.75rem}.feature-grid p,.use-grid p,.step-grid p{color:var(--muted);margin:0;font-size:.875rem;line-height:1.25rem}.use-grid p+p{margin-top:.35rem}.use-grid .caveat{color:var(--text)}.step-grid{grid-template-columns:repeat(3,1fr);gap:2rem 1rem;display:grid}.step-visual{aspect-ratio:4/3;background:var(--surface-soft);margin:0 0 1rem;overflow:hidden}.step-visual img{-o-object-fit:cover;object-fit:cover;width:100%;height:100%;display:block}.step-copy{padding:0 1.1rem}.step-icon{color:#fff;background:var(--action);border-radius:999px;place-items:center;width:3rem;height:3rem;margin:0 auto .85rem;display:grid}.step-icon svg{width:1.35rem;height:1.35rem}.step-num{color:var(--action);letter-spacing:.04em;text-transform:uppercase;margin:0 0 .35rem;font-size:.75rem;font-weight:600}.tip-list{color:var(--muted);margin:0;padding-left:1.15rem;font-size:1rem;line-height:1.625}.tip-list li+li{margin-top:.55rem}.faq-section{width:min(100% - (var(--page-gutter) * 2), 56rem)}.faq-list{border-top:1px solid var(--hairline)}.faq-list details{border-bottom:1px solid var(--hairline)}.faq-list summary{color:var(--text);cursor:pointer;justify-content:space-between;gap:1rem;padding:1.15rem 0;font-size:1rem;font-weight:600;line-height:1.5rem;list-style:none;display:flex}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary svg{width:1.1rem;height:1.1rem;color:var(--muted);flex:none}.faq-list details p{color:var(--muted);margin:-.2rem 0 1.25rem;font-size:.875rem;line-height:1.625}.final-section{width:min(100% - (var(--page-gutter) * 2), var(--page-max));border:1px solid var(--hairline);background:var(--surface-strong);text-align:center;border-radius:.75rem;margin:1.5rem auto 4rem;padding:clamp(2.5rem,5vw,4rem) 1.5rem}.final-section>a{color:#fff;background:linear-gradient(135deg,#06f,#5d9dfd);border-radius:.5rem;padding:.85rem 1.15rem;font-size:.88rem;font-weight:700;text-decoration:none;display:inline-flex}.final-section .related-sizes a{color:var(--action);background:0 0;padding:0;font-size:.9rem;font-weight:650;display:inline}footer{border-color:var(--hairline)!important;background:var(--canvas)!important}@media (width<=800px){.step-grid,.feature-grid,.use-grid{grid-template-columns:1fr}}