.sw-page{max-width:var(--page-max-width);padding:0 var(--page-gutter)}.sw-title{text-align:center;margin-bottom:var(--space-md);font-size:var(--text-2xl);color:var(--color-text-primary)}.sw-widget{background:var(--color-bg-surface);border:1px solid var(--color-border-default);border-radius:var(--card-radius);padding:var(--space-lg) var(--clock-display-inline-padding);margin-bottom:var(--space-3xl)}.sw-storage-warning{max-width:36rem;margin:var(--space-md) auto;padding:var(--space-sm) var(--space-md);border-radius:var(--radius-sm);color:#78350f;font-size:var(--text-sm);text-align:center;background:#fffbeb;border:1px solid #f59e0b;line-height:1.5}body[data-theme=dark] .sw-storage-warning{color:#fef3c7;background:#451a03}.sw-desc{color:var(--color-text-secondary);font-size:var(--text-base);max-width:700px;margin:0 auto var(--space-3xl);text-align:center;line-height:1.6}.sw-article{line-height:1.7}.sw-section{margin-bottom:var(--space-4xl)}.sw-section-heading{color:var(--color-text-primary);margin-bottom:var(--space-lg);padding-bottom:var(--space-sm);font-size:1.5rem}.sw-heading-cyan,.sw-heading-green,.sw-heading-indigo{border-bottom:1px solid var(--color-border-default)}.sw-text{color:var(--color-text-secondary);margin-bottom:var(--space-lg);font-size:var(--text-base)}.sw-feature-box{background:var(--color-bg-base);padding:var(--space-lg) var(--space-xl);border-radius:var(--radius-md);border:1px solid var(--color-border-default)}.sw-feature-list{padding-left:var(--space-xl);color:var(--color-text-secondary);margin:0;font-size:.9rem}.sw-feature-list li{margin-bottom:var(--space-sm)}.sw-howto-grid{gap:var(--space-md);grid-template-columns:repeat(auto-fit,minmax(220px,1fr));display:grid}.sw-howto-card{background:var(--color-bg-surface);padding:var(--space-lg);border-radius:var(--radius-md);border:1px solid var(--color-border-default)}.sw-howto-header{margin-bottom:var(--space-sm);align-items:center;display:flex}.sw-step-badge{background:var(--color-bg-inset);color:var(--color-text-primary);width:24px;height:24px;margin-right:var(--space-md);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:.8rem;font-weight:700;display:flex}.sw-howto-title{font-size:var(--text-md);color:var(--color-text-primary);margin:0}.sw-howto-desc{font-size:var(--text-sm);color:var(--color-text-secondary);margin:0;line-height:1.5}.sw-usecase-grid{gap:var(--space-md);grid-template-columns:repeat(auto-fit,minmax(280px,1fr));display:grid}.sw-usecase-card{background:var(--color-bg-surface);padding:var(--space-lg);border-radius:var(--radius-md);border:1px solid var(--color-border-default)}.sw-usecase-header{margin-bottom:var(--space-sm);align-items:center;display:flex}.sw-usecase-icon{margin-right:var(--space-md);font-size:1.5rem}.sw-usecase-title{font-size:var(--text-md);color:var(--color-text-primary);margin:0}.sw-usecase-desc{font-size:var(--text-sm);color:var(--color-text-secondary);margin:0;line-height:1.5}.sw-faq-section{background:var(--color-bg-surface-alt);padding:var(--space-2xl);border-radius:var(--radius-lg);border:1px solid var(--color-border-default)}.sw-faq-title{font-size:var(--text-2xl);color:var(--color-text-primary);margin-bottom:var(--space-lg);text-align:center}.sw-faq-item{margin-bottom:var(--space-md);padding:var(--space-md) var(--space-lg);background:var(--color-bg-surface);border-radius:var(--radius-sm);border:1px solid var(--color-border-default)}.sw-faq-question{cursor:pointer;min-height:44px;color:var(--color-text-primary);font-weight:600;font-size:var(--text-base);align-items:center;display:flex}.sw-faq-answer{margin-top:var(--space-md);color:var(--color-text-secondary);margin-bottom:0;font-size:.9rem;line-height:1.6}body[data-theme=dark] .sw-feature-box{background:var(--color-bg-surface)}body[data-theme=dark] .sw-howto-card{background:var(--color-bg-surface);border-color:var(--color-border-default)}body[data-theme=dark] .sw-howto-title{color:var(--color-text-primary)}body[data-theme=dark] .sw-faq-section{background:var(--color-bg-surface-alt)}.sw-view-container{text-align:center;padding:var(--space-sm) 0;flex-direction:column;justify-content:center;align-items:center;display:flex}.sw-time-display{width:100%;min-width:0;margin-bottom:var(--space-2xl);padding:var(--space-xl) 0;color:var(--color-primary);position:relative}.sw-running-dot{background:var(--color-success-text);border-radius:50%;width:10px;height:10px;animation:1.2s ease-in-out infinite sw-pulse;position:absolute;top:4px;right:0}@keyframes sw-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.8)}}body[data-theme=dark] .sw-running-dot{background:var(--color-success-text)}.sw-settings{gap:var(--space-sm);margin-bottom:var(--space-lg);flex-wrap:wrap;justify-content:center;display:flex}.sw-setting-btn{align-items:center;gap:var(--space-sm);border-radius:var(--radius-lg);border:1px solid var(--color-border-strong);cursor:pointer;background:var(--color-bg-muted);min-height:44px;color:var(--color-text-secondary);transition:background-color var(--transition-base), border-color var(--transition-base), color var(--transition-base);padding:6px 14px;font-size:.875rem;font-weight:500;display:flex}.sw-setting-btn:hover{border-color:var(--color-primary)}.sw-setting-btn.active{background:var(--color-accent-bg);border-color:var(--color-accent);color:var(--color-accent)}.sw-setting-btn svg{font-size:var(--text-sm)}.sw-vibration-btn{display:none}@media (max-width:768px){.sw-vibration-btn{display:inline-flex}}.sw-shortcuts{gap:var(--space-lg);margin-bottom:var(--space-lg);color:var(--color-text-secondary);flex-wrap:wrap;justify-content:center;font-size:.875rem;display:flex}.sw-kbd{background:var(--color-bg-muted);border:1px solid var(--color-border-strong);font-family:var(--font-time);border-radius:4px;padding:2px 6px;font-size:.7rem}.sw-controls{gap:var(--space-md);margin-bottom:var(--space-lg);flex-wrap:wrap;justify-content:center;display:flex}.sw-btn{border-radius:var(--radius-lg);font-size:var(--text-md);cursor:pointer;min-height:48px;color:var(--color-text-primary);transition:background-color var(--transition-base), border-color var(--transition-base), color var(--transition-base);border:1px solid #0000;padding:14px 36px;font-weight:700}.sw-btn:active,.sw-btn:hover{border-color:currentColor}.sw-btn.sw-btn-start{background:var(--color-primary);color:var(--color-on-primary)}.sw-btn-start-large{font-size:var(--text-lg);padding:14px 48px}.sw-btn.sw-btn-pause{background:var(--color-primary);color:var(--color-on-primary);border-color:var(--color-primary)}.sw-btn.sw-btn-lap{background:var(--color-primary-bg);color:var(--color-primary);border-color:currentColor}.sw-btn.sw-btn-reset{background:var(--color-bg-muted);color:var(--color-text-secondary);border-color:var(--color-border-strong)}.sw-stats-container{width:100%;max-width:360px;margin:var(--space-lg) auto 0;padding:var(--space-md) var(--space-lg);background:var(--color-bg-surface);border-radius:var(--radius-lg);border:1px solid var(--color-border-default)}.sw-stats-row{padding:var(--space-sm) 0;justify-content:space-between;align-items:center;display:flex}.sw-stats-row:not(:last-child){border-bottom:1px solid var(--color-border-default)}.sw-stats-label{font-size:var(--text-sm);color:var(--color-text-secondary);font-weight:500}.sw-stats-value{font-family:var(--font-time);font-size:var(--text-base);color:var(--color-text-secondary);font-weight:600}.sw-stats-best .sw-stats-label,.sw-stats-best .sw-stats-value{color:var(--color-success-text)}.sw-stats-worst .sw-stats-label,.sw-stats-worst .sw-stats-value{color:var(--color-danger-dark)}body[data-theme=dark] .sw-stats-container{background:var(--color-bg-surface)}body[data-theme=dark] .sw-stats-best .sw-stats-label,body[data-theme=dark] .sw-stats-best .sw-stats-value{color:var(--color-success-text)}body[data-theme=dark] .sw-stats-worst .sw-stats-label,body[data-theme=dark] .sw-stats-worst .sw-stats-value{color:#f87171}.sw-lap-container{width:100%;max-width:100%;margin-top:var(--space-md)}.sw-lap-header{margin-bottom:var(--space-sm);justify-content:center;align-items:center;display:flex}.sw-lap-header-text{color:var(--color-text-primary);font-size:.9rem;font-weight:600}.sw-lap-table{border:1px solid var(--color-border-default);border-radius:var(--radius-md);background:var(--color-bg-surface-alt);overflow:hidden}.sw-lap-row{padding:var(--space-md) var(--space-md);border-bottom:1px solid var(--color-border-default);justify-content:space-between;align-items:center;gap:var(--space-sm);transition:background var(--transition-base);background:0 0;display:flex}.sw-lap-row:hover{background:var(--color-bg-muted)}.sw-lap-row.sw-lap-fastest{background:var(--color-success-bg)}.sw-lap-row.sw-lap-slowest{background:#ef44441a}.sw-lap-number{color:var(--color-text-secondary);font-weight:600;font-size:var(--text-sm);background:var(--color-bg-muted);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:32px;min-width:36px;height:32px;display:flex}.sw-lap-time{font-family:var(--font-time);font-size:var(--text-base);color:var(--color-text-primary);text-align:center;flex:1;font-weight:600}.sw-lap-fastest-text{color:var(--color-success-text)!important}.sw-lap-slowest-text{color:var(--color-danger-dark)!important}.sw-lap-total{font-family:var(--font-time);color:var(--color-text-muted);text-align:right;font-size:.8rem}.sw-lap-delete{cursor:pointer;color:var(--color-text-secondary);border-radius:var(--radius-lg);min-width:44px;min-height:44px;transition:background-color var(--transition-base), border-color var(--transition-base), color var(--transition-base);background:0 0;border:none;flex-shrink:0;padding:2px 6px;font-size:.9rem}.sw-lap-delete:hover{color:var(--color-danger)!important}@media (max-width:480px){.sw-lap-row{column-gap:var(--space-sm);row-gap:var(--space-xs);grid-template-columns:36px minmax(0,1fr) 44px;display:grid}.sw-lap-number{grid-area:1/1/3}.sw-lap-time{text-align:start;font-variant-numeric:tabular-nums;grid-area:1/2;min-width:0}.sw-lap-total{text-align:start;font-variant-numeric:tabular-nums;grid-area:2/2}.sw-lap-delete{grid-area:1/3/3}}.sw-lap-actions{gap:var(--space-sm);margin-top:var(--space-md);margin-bottom:var(--space-lg);flex-wrap:wrap;justify-content:center;display:flex}.sw-share-notice{max-width:36rem;margin:var(--space-sm) auto var(--space-lg);color:var(--color-text-muted);font-size:var(--text-xs);text-align:center;line-height:1.5}.sw-btn-export{padding:var(--space-sm) var(--space-lg);border-radius:var(--radius-lg);font-size:var(--text-sm);border:1px solid var(--color-border-strong);cursor:pointer;background:var(--color-bg-surface);color:var(--color-primary);transition:background-color var(--transition-base), border-color var(--transition-base), color var(--transition-base);min-height:44px;font-weight:500}.sw-btn-clear{padding:var(--space-sm) var(--space-lg);border-radius:var(--radius-lg);font-size:var(--text-sm);border:1px solid var(--color-danger-dark);cursor:pointer;background:var(--color-bg-surface);color:var(--color-danger-dark);transition:background-color var(--transition-base), border-color var(--transition-base), color var(--transition-base);min-height:44px;font-weight:500}.sw-btn-clear.sw-btn-clear-confirm,body[data-theme=dark] .sw-btn-clear.sw-btn-clear-confirm{background:var(--color-danger-dark);border-color:var(--color-danger-dark);color:#fff}body[data-theme=dark] .sw-lap-table{background:var(--color-bg-surface-alt)}body[data-theme=dark] .sw-lap-row.sw-lap-fastest{background:var(--color-success-bg)}body[data-theme=dark] .sw-lap-row.sw-lap-slowest{background:#ef444426}body[data-theme=dark] .sw-lap-fastest-text{color:var(--color-success-text)!important}body[data-theme=dark] .sw-lap-slowest-text,body[data-theme=dark] .sw-lap-delete:hover{color:#f87171!important}body[data-theme=dark] .sw-btn-export{background:var(--color-bg-surface);color:var(--color-primary)}body[data-theme=dark] .sw-btn-clear{color:#f87171;background:0 0}body[data-theme=dark] .sw-time-display{color:var(--color-primary)}body[data-theme=dark] .sw-lap-row:hover{background:var(--color-bg-muted)}body[data-theme=dark] .sw-lap-number{background:var(--color-bg-inset)}.sw-view-container :is(button,input):focus-visible{outline:3px solid var(--color-primary);outline-offset:3px}@media (prefers-reduced-motion:reduce){.sw-view-container *,.sw-view-container :before,.sw-view-container :after{transition:none!important;animation:none!important}}.sw-btn.sw-btn-start:hover{background:var(--color-primary-active)}.sw-btn-export:hover,.sw-btn-clear:hover,.sw-lap-delete:hover{background:var(--color-bg-muted);border-color:currentColor}.sw-btn:disabled,.sw-setting-btn:disabled,.sw-btn-export:disabled,.sw-btn-clear:disabled{opacity:.55;cursor:not-allowed}
