.sp-tool .tool-page-shell:has(.sp-card) .tool-page-head,.sp-tool .tool-page-shell:has(.sp-card) .tool-page-head__title,.sp-tool .tool-page-shell:has(.sp-card) .tool-page-head__lead{width:100%;max-width:none}.sp-tool .tool-page-shell:has(.sp-card) .tool-page-head{margin-bottom:.75rem}.sp-card{background:rgb(var(--color-surface-card));border:1px solid rgb(var(--color-hairline-soft));border-radius:2rem;padding:1.25rem 1.5rem;overflow:hidden;transition:border-color .2s ease}@media(hover:hover)and (pointer:fine){.sp-card:hover{border-color:rgb(var(--color-accent) / .35)}}.sp-card__head{display:flex;align-items:flex-start;gap:.5rem;color:rgb(var(--color-accent))}.sp-card__head--hero{justify-content:space-between;align-items:center;gap:.75rem}.sp-card__head-main{display:flex;align-items:flex-start;gap:.5rem;min-width:0}.sp-card__icon{display:inline-flex;align-items:center;justify-content:center;padding:.375rem;border-radius:.5rem;background:rgb(var(--color-accent) / .12);flex-shrink:0}.sp-card__title{font-size:.875rem;font-weight:700;line-height:1.1;color:rgb(var(--color-ink))}.sp-card__sub{font-size:.625rem;font-weight:500;margin-top:.125rem;color:rgb(var(--color-ink-muted))}.sp-hero-status{margin:0;max-width:min(14rem,46%);padding:.3rem .625rem;border-radius:999px;border:1px solid rgb(var(--color-hairline-soft));background:rgb(var(--color-canvas));font-size:.625rem;font-weight:600;line-height:1.35;text-align:right;color:rgb(var(--color-ink-muted));flex-shrink:0}.sp-hero-status.is-live{border-color:rgb(var(--color-accent) / .28);background:rgb(var(--color-accent) / .08);color:rgb(var(--color-accent))}.sp-channel-tile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.65rem;padding:.75rem .5rem;border-radius:1rem;border:2px solid rgb(var(--color-hairline-soft));background:rgb(var(--color-canvas));transition:border-color .3s ease,background .3s ease,transform .15s ease}.sp-channel-tile:active{transform:scale(.97)}@media(hover:hover)and (pointer:fine){.sp-channel-tile:hover:not(.is-active){border-color:rgb(var(--color-accent) / .3);background:rgb(var(--color-accent) / .04)}}.sp-channel-tile.is-active{border-color:rgb(var(--color-accent) / .55);background:rgb(var(--color-accent) / .08)}.sp-channel-tile__icon-wrap{display:flex;align-items:center;justify-content:center;gap:.15rem;width:4.5rem;height:3.75rem;border-radius:1rem;background:rgb(var(--color-ink) / .08);color:rgb(var(--color-ink-muted));transition:background .3s ease,color .3s ease}.sp-channel-tile.is-active .sp-channel-tile__icon-wrap{background:rgb(var(--color-accent) / .18);color:rgb(var(--color-accent))}.sp-channel-tile__letter{font-size:1.875rem;font-weight:900;letter-spacing:-.04em;line-height:1;color:rgb(var(--color-ink-muted) / .45);transition:color .3s ease}.sp-channel-tile.is-active .sp-channel-tile__letter{color:rgb(var(--color-accent))}.sp-channel-tile__bars{display:flex;align-items:flex-end;justify-content:center;gap:3px;height:2rem}.sp-channel-tile__bar{width:4px;height:3px;border-radius:999px;background:rgb(var(--color-ink-muted) / .25);transition:height .12s ease,background .12s ease}.sp-channel-tile.is-active .sp-channel-tile__bar{background:rgb(var(--color-accent) / .75);animation:sp-bar-bounce .55s ease-in-out infinite alternate;animation-delay:calc(var(--bar-i, 0) * 45ms)}.sp-channel-tile.is-active .sp-channel-tile__bar:nth-child(1){--bar-i: 0;height:6px}.sp-channel-tile.is-active .sp-channel-tile__bar:nth-child(2){--bar-i: 1;height:10px}.sp-channel-tile.is-active .sp-channel-tile__bar:nth-child(3){--bar-i: 2;height:14px}.sp-channel-tile.is-active .sp-channel-tile__bar:nth-child(4){--bar-i: 3;height:18px}.sp-channel-tile.is-active .sp-channel-tile__bar:nth-child(5){--bar-i: 4;height:22px}.sp-channel-tile.is-active .sp-channel-tile__bar:nth-child(6){--bar-i: 5;height:18px}.sp-channel-tile.is-active .sp-channel-tile__bar:nth-child(7){--bar-i: 6;height:14px}.sp-channel-tile.is-active .sp-channel-tile__bar:nth-child(8){--bar-i: 7;height:10px}.sp-channel-tile.is-active .sp-channel-tile__bar:nth-child(9){--bar-i: 8;height:8px}.sp-channel-tile.is-active .sp-channel-tile__bar:nth-child(10){--bar-i: 9;height:5px}@keyframes sp-bar-bounce{0%{transform:scaleY(.65)}to{transform:scaleY(1.15)}}.sp-hero-progress{position:relative;height:.5rem;border-radius:999px;background:rgb(var(--color-canvas));overflow:hidden}.sp-hero-progress__fill{position:absolute;inset-block:0;left:0;border-radius:inherit;background:linear-gradient(90deg,rgb(var(--color-accent) / .85),rgb(var(--color-accent)));transition:width .4s ease}.sp-hero-meta{display:flex;flex-wrap:wrap;align-items:center;gap:.35rem .65rem;margin-top:.65rem;padding-top:.5rem;border-top:1px solid rgb(var(--color-hairline-soft))}.sp-hero-meta__vol{display:inline-flex;align-items:center;gap:.35rem;flex:1;min-width:7rem;font-size:.625rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:rgb(var(--color-ink-muted))}.sp-hero-meta__vol input{flex:1;min-width:3.5rem;accent-color:rgb(var(--color-accent))}.sp-hero-meta__status{display:none}.sp-hero-meta__active{font-size:.625rem;font-weight:700;color:rgb(var(--color-accent));white-space:nowrap}.sp-freq-meter{gap:.875rem}.sp-freq-meter__readout{display:flex;align-items:baseline;justify-content:center;gap:.2rem}.sp-freq-meter__hz{font-size:2.5rem;font-weight:900;font-family:var(--font-mono, ui-monospace, monospace);font-variant-numeric:tabular-nums;letter-spacing:-.03em;line-height:1;color:rgb(var(--color-ink));transition:color .2s ease}.sp-freq-meter.is-active .sp-freq-meter__hz{color:rgb(var(--color-accent))}.sp-freq-meter__unit{font-size:1rem;font-weight:700;color:rgb(var(--color-ink-muted))}.sp-freq-meter__track-wrap{padding-inline:.125rem}.sp-freq-meter__track{position:relative;height:.625rem;border-radius:999px;background:rgb(var(--color-canvas));box-shadow:inset 0 1px 2px #0000000f;overflow:visible}.sp-freq-meter__fill{position:absolute;inset-block:0;left:0;border-radius:inherit;background:linear-gradient(90deg,rgb(var(--color-accent) / .55),rgb(var(--color-accent)));transition:width 75ms linear}.sp-freq-meter__head{position:absolute;top:50%;width:.625rem;height:.625rem;margin-left:-.3125rem;border-radius:999px;background:rgb(var(--color-accent));box-shadow:0 0 0 2px rgb(var(--color-surface-card)),0 0 10px rgb(var(--color-accent) / .45);transform:translateY(-50%);transition:left 75ms linear;pointer-events:none}.sp-freq-meter__scale{position:relative;height:1rem;margin-top:.375rem}.sp-freq-meter__scale span{position:absolute;transform:translate(-50%);font-size:.5625rem;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:.02em;text-transform:uppercase;color:rgb(var(--color-ink-muted));white-space:nowrap}.sp-sub-dial{position:relative;width:4rem;height:4rem;flex-shrink:0}.sp-sub-dial__outer{position:absolute;inset:0;border-radius:999px;border:3px solid rgb(var(--color-border));background:rgb(var(--color-canvas))}.sp-sub-dial__inner{position:absolute;inset:18%;border-radius:999px;background:rgb(var(--color-accent) / .14);box-shadow:inset 0 0 0 1px rgb(var(--color-accent) / .28);transition:transform 75ms ease}.sp-sub-dial__icon{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:rgb(var(--color-accent));pointer-events:none;z-index:1}[data-visualizer].is-playing .sp-sub-dial__inner{animation:sp-sub-thump .35s ease-in-out infinite alternate}[data-visualizer].is-playing .sp-sub-dial__icon{color:rgb(var(--color-accent))}@keyframes sp-sub-thump{0%{transform:scale(.88)}to{transform:scale(1.05)}}.sp-range-label{display:flex;justify-content:space-between;font-size:.625rem;font-weight:700;color:rgb(var(--color-ink-muted));margin-bottom:.35rem;font-variant-numeric:tabular-nums}.sp-range-input{display:block;width:100%;height:.375rem;accent-color:rgb(var(--color-accent));cursor:pointer}.sp-phase-opt{display:flex;align-items:center;gap:.625rem;width:100%;padding:.65rem .875rem;border-radius:.75rem;border:1px solid rgb(var(--color-hairline-soft));background:rgb(var(--color-canvas));font-size:.75rem;font-weight:700;text-align:left;color:rgb(var(--color-ink-muted));transition:border-color .2s ease,background .2s ease,color .2s ease}.sp-phase-opt__icon{display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;width:1.75rem;height:1.75rem;border-radius:.5rem;background:rgb(var(--color-accent) / .1);color:rgb(var(--color-accent));transition:background .2s ease,color .2s ease}.sp-phase-opt__label{flex:1;min-width:0}@media(hover:hover)and (pointer:fine){.sp-phase-opt:hover{border-color:rgb(var(--color-accent) / .35)}}.sp-phase-opt.is-playing{border-color:rgb(var(--color-accent) / .55);background:rgb(var(--color-accent) / .12);color:rgb(var(--color-accent));box-shadow:0 0 0 1px rgb(var(--color-accent) / .1)}.sp-phase-opt.is-playing .sp-phase-opt__icon{background:rgb(var(--color-accent) / .2);color:rgb(var(--color-accent))}.sp-phase-info{display:flex;gap:.35rem;align-items:flex-start;margin:.25rem 0 0;padding:.5rem;border-radius:.5rem;border:1px solid rgb(var(--color-hairline-soft));background:rgb(var(--color-canvas) / .6);font-size:.625rem;line-height:1.45;color:rgb(var(--color-ink-muted))}.sp-phase-info strong{color:rgb(var(--color-ink));font-weight:700}.sp-tip-row{display:flex;align-items:center;gap:.5rem;flex:1;padding:.65rem .75rem;border-radius:.75rem;background:rgb(var(--color-canvas));font-size:.625rem;font-weight:500;line-height:1.4;color:rgb(var(--color-body))}.sp-tip-row__icon{display:inline-flex;flex-shrink:0;color:rgb(var(--color-accent))}.sp-play-btn{display:flex;align-items:center;justify-content:center;gap:.4rem;width:100%;height:2.75rem;border-radius:.75rem;border:1px solid transparent;background:rgb(var(--color-ink));color:rgb(var(--color-surface-card));font-size:.875rem;font-weight:700;box-shadow:var(--shadow-sm);transition:filter .15s ease,transform .15s ease,background .15s ease,border-color .15s ease,color .15s ease}.sp-play-btn--sm{height:2.5rem;font-size:.75rem}.sp-play-btn:active{transform:scale(.97)}@media(hover:hover)and (pointer:fine){.sp-play-btn:hover{filter:brightness(1.06)}.sp-play-btn.is-playing:hover{filter:none;border-color:rgb(var(--color-accent) / .45)}}.sp-play-btn.is-playing{background:rgb(var(--color-canvas));border-color:rgb(var(--color-hairline-soft));color:rgb(var(--color-ink));filter:none;box-shadow:none}.sp-play-btn__icon{display:block;width:0;height:0;border-style:solid;border-width:5px 0 5px 8px;border-color:transparent transparent transparent currentColor}.sp-play-btn.is-playing .sp-play-btn__icon{width:.625rem;height:.625rem;border:none;background:currentColor;border-radius:1px}.sp-action-btn{display:flex;align-items:center;justify-content:center;gap:.4rem;width:100%;height:2.5rem;border-radius:.75rem;border:none;background:rgb(var(--color-ink));color:rgb(var(--color-surface-card));font-size:.75rem;font-weight:700;box-shadow:var(--shadow-sm);transition:filter .15s ease,transform .15s ease,background .15s ease,border-color .15s ease,color .15s ease}.sp-action-btn:active{transform:scale(.97)}@media(hover:hover)and (pointer:fine){.sp-action-btn:hover{filter:brightness(1.06)}.sp-action-btn.is-stop:hover{filter:none;border-color:rgb(var(--color-accent) / .45)}}.sp-action-btn.is-stop{background:rgb(var(--color-canvas));border:1px solid rgb(var(--color-hairline-soft));color:rgb(var(--color-ink));filter:none}.sp-action-btn__icon{flex-shrink:0}.sp-action-btn__icon--play{width:0;height:0;border-style:solid;border-width:5px 0 5px 8px;border-color:transparent transparent transparent currentColor}.sp-action-btn__icon--stop{display:none;width:.625rem;height:.625rem;border-radius:1px;background:currentColor}.sp-action-btn.is-stop .sp-action-btn__icon--play{display:none}.sp-action-btn.is-stop .sp-action-btn__icon--stop{display:block}.sp-seo-tips-panel{padding:clamp(1.25rem,2.5vw,1.75rem);background:rgb(var(--color-surface-card));border:1px solid rgb(var(--color-hairline-soft));border-radius:1.25rem}.sp-seo-tips-panel__head{display:flex;align-items:flex-start;gap:.875rem;padding-bottom:1.125rem;margin-bottom:1.125rem;border-bottom:1px solid rgb(var(--color-accent) / .12)}.sp-seo-tips-panel__icon{display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;width:2.75rem;height:2.75rem;border-radius:.875rem;background:rgb(var(--color-accent) / .14);color:rgb(var(--color-accent))}.sp-seo-tips-panel__head-text{min-width:0}.sp-seo-tips-panel__title{font-family:var(--font-display);font-size:clamp(1.0625rem,2vw,1.25rem);font-weight:700;line-height:1.25;color:rgb(var(--color-ink))}.sp-seo-tips-panel__lead{margin-top:.375rem;max-width:52rem;font-size:.875rem;line-height:1.6;color:rgb(var(--color-body))}.sp-seo-tips-grid{display:grid;gap:.875rem}@media(min-width:640px){.sp-seo-tips-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}.sp-seo-tip-card{display:grid;grid-template-columns:auto 1fr;gap:.75rem;align-items:start;padding:1rem 1.125rem;border-radius:1rem;border:1px solid rgb(var(--color-hairline-soft));background:rgb(var(--color-canvas));transition:border-color .18s ease-out}@media(hover:hover)and (pointer:fine){.sp-seo-tip-card:hover{border-color:rgb(var(--color-accent) / .4)}}.sp-seo-tip-card__num{font-family:var(--font-display);font-size:.75rem;font-weight:700;letter-spacing:.04em;color:rgb(var(--color-accent));padding-top:.125rem}.sp-seo-tip-card__head{display:flex;align-items:center;gap:.5rem}.sp-seo-tip-card__head .tool-seo-card-icon{width:1.75rem;height:1.75rem;padding:.25rem}.sp-seo-tip-card__title{font-size:.875rem;font-weight:700;line-height:1.3;color:rgb(var(--color-ink))}.sp-seo-tip-card__text{margin-top:.375rem;font-size:.8125rem;line-height:1.6;color:rgb(var(--color-body))}