.timer{display:flex;flex-direction:column;align-items:center;gap:var(--space-md);padding:var(--space-sm) 0;width:100%}.timer__meter-container{position:relative;display:flex;align-items:center;justify-content:center;margin:var(--space-sm) 0;width:200px;height:200px}.timer__ring-container{position:relative;display:flex;align-items:center;justify-content:center;margin:var(--space-sm) 0}.timer__grid{display:grid;grid-template-columns:repeat(10,1fr);grid-template-rows:repeat(10,1fr);gap:3px;width:200px;height:200px;padding:8px;background-color:var(--color-surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-md)}.timer__grid-cell{background-color:var(--color-border);border-radius:2px;transition:background-color .15s ease}.timer__grid-cell--filled{box-shadow:0 0 4px rgba(0,0,0,.2)}[data-theme=dark] .timer__grid{background-color:var(--color-surface);box-shadow:0 4px 8px rgba(0,0,0,.3)}[data-theme=dark] .timer__grid-cell{background-color:var(--color-bg)}[data-theme=dark] .timer__grid-cell--filled{box-shadow:0 0 6px rgba(255,255,255,.1)}@media (max-width:360px){.timer__grid{width:180px;height:180px;gap:2px;padding:6px}.timer__meter-container{width:180px;height:180px}}@media (prefers-reduced-motion:reduce){.timer__grid-cell{transition:none}}.timer__meter-container:has(.timer__grid){flex-direction:column;height:auto}.timer__grid~.timer__center{position:relative;top:auto;left:auto;transform:none;margin-top:var(--space-md)}.timer__ring{display:block;filter:drop-shadow(var(--shadow-md))}.timer__ring-bg{stroke:var(--color-border);transition:stroke var(--transition-base)}.timer__ring-progress{stroke:var(--color-primary);stroke-linecap:round;transition:stroke-dashoffset .5s ease,stroke var(--transition-base);will-change:stroke-dashoffset}.timer__center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;user-select:none}.timer__percent{font-size:var(--font-size-2xl);font-weight:700;color:var(--color-primary);line-height:1;margin-bottom:var(--space-xs);transition:color var(--transition-base)}.timer__time{font-size:var(--font-size-xl);font-weight:600;font-variant-numeric:tabular-nums;color:var(--color-text);line-height:1}.timer__controls{display:flex;flex-direction:row;align-items:stretch;gap:var(--space-sm);width:100%;max-width:320px}.timer__target-btn{flex:0 0 100px;display:flex;align-items:center;justify-content:center;gap:var(--space-xs);padding:var(--space-md);font-size:var(--font-size-lg);font-weight:600;color:var(--color-text);background-color:var(--color-surface);border:2px solid var(--color-border);border-radius:var(--radius-md);transition:all var(--transition-fast);cursor:pointer}.timer__target-btn:hover:not(:disabled){border-color:var(--color-primary);box-shadow:var(--shadow-sm)}.timer__target-btn:focus{outline:0;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-light)}.timer__target-btn:disabled{opacity:.6;cursor:not-allowed;background-color:var(--color-bg)}.timer__target-value{font-variant-numeric:tabular-nums}.timer__target-icon{flex-shrink:0;color:var(--color-text-muted);transition:transform var(--transition-fast)}.timer__target-btn:hover:not(:disabled) .timer__target-icon{transform:translateY(2px)}.timer__btn{flex:1;padding:var(--space-md) var(--space-lg);font-size:var(--font-size-base);font-weight:600;border-radius:var(--radius-md);transition:all var(--transition-fast);text-transform:uppercase;letter-spacing:.05em;box-shadow:var(--shadow-md);position:relative;overflow:hidden;white-space:nowrap}.timer__btn::before{content:'';position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background-color:rgba(255,255,255,.3);transform:translate(-50%,-50%);transition:width .6s,height .6s}.timer__btn:active::before{width:300px;height:300px}.timer__btn--start{background-color:var(--color-success);color:var(--color-text-inverse)}.timer__btn--start:hover{background-color:#3da863;transform:translateY(-2px);box-shadow:var(--shadow-lg)}.timer__btn--start:active{transform:translateY(0)}.timer__btn--stop{background-color:var(--color-warning);color:var(--color-text-inverse)}.timer__btn--stop:hover{background-color:#dd7528;transform:translateY(-2px);box-shadow:var(--shadow-lg)}.timer__btn--stop:active{transform:translateY(0)}.timer__btn.hidden{display:none}@media (max-width:360px){.timer__ring{width:180px;height:180px}.timer__percent{font-size:var(--font-size-xl)}.timer__time{font-size:var(--font-size-lg)}.timer__controls{flex-direction:column;gap:var(--space-sm)}.timer__target-btn{flex:none;width:100%}.timer__btn{width:100%;padding:var(--space-md)}}@media (min-width:400px){.timer{gap:var(--space-lg)}.timer__controls{max-width:320px}}[data-theme=dark] .timer__ring{filter:drop-shadow(0 4px 8px rgba(0, 0, 0, .3))}.timer__ring-progress.loading{animation:pulse 2s ease-in-out infinite}@media (prefers-reduced-motion:reduce){.timer__ring-progress{transition:none}.timer__btn::before{transition:none}.timer__btn:hover{transform:none}.timer__ring-progress.loading{animation:none}}.picker-modal{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity var(--transition-base)}.picker-modal--show{opacity:1}.picker-modal__backdrop{position:absolute;inset:0;background-color:rgba(0,0,0,.5)}.picker-modal__container{position:relative;background-color:var(--color-surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);width:280px;max-width:calc(100% - var(--space-lg) * 2);transform:translateY(20px) scale(.95);transition:transform var(--transition-base)}.picker-modal--show .picker-modal__container{transform:translateY(0) scale(1)}.picker-modal__header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-md) var(--space-lg);border-bottom:1px solid var(--color-border)}.picker-modal__title{font-size:var(--font-size-lg);font-weight:600;color:var(--color-text)}.picker-modal__close{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:var(--radius-sm);color:var(--color-text-muted);transition:background-color var(--transition-fast),color var(--transition-fast)}.picker-modal__close:hover{background-color:var(--color-bg);color:var(--color-text)}.picker-modal__content{display:flex;flex-direction:column;align-items:center;padding:var(--space-lg);gap:var(--space-sm)}.picker-modal__arrow{display:flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:var(--radius-md);color:var(--color-primary);background-color:var(--color-bg);transition:background-color var(--transition-fast),color var(--transition-fast),transform var(--transition-fast)}.picker-modal__arrow:hover:not(:disabled){background-color:var(--color-primary-light);transform:scale(1.05)}.picker-modal__arrow:active:not(:disabled){transform:scale(.95)}.picker-modal__arrow:disabled{opacity:.3;cursor:not-allowed}.picker-modal__wheel{display:flex;flex-direction:column;align-items:center;width:100%;touch-action:pan-y;user-select:none}.picker-modal__option{display:flex;align-items:center;justify-content:center;width:100%;padding:var(--space-md);font-size:var(--font-size-xl);font-weight:500;color:var(--color-text-muted);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast)}.picker-modal__option--empty{min-height:56px;cursor:default}.picker-modal__option--next,.picker-modal__option--prev{font-size:var(--font-size-lg);opacity:.5}.picker-modal__option--next:hover,.picker-modal__option--prev:hover{opacity:.8;background-color:var(--color-bg)}.picker-modal__option--selected{font-size:var(--font-size-3xl);font-weight:700;color:var(--color-text-inverse);background-color:var(--color-primary);cursor:default}.picker-modal__confirm{width:calc(100% - var(--space-lg) * 2);margin:0 var(--space-lg) var(--space-lg);padding:var(--space-md);font-size:var(--font-size-base);font-weight:600;color:var(--color-text-inverse);background-color:var(--color-success);border-radius:var(--radius-md);transition:background-color var(--transition-fast),transform var(--transition-fast)}.picker-modal__confirm:hover{background-color:#3da863}.picker-modal__confirm:active{transform:scale(.98)}@media (prefers-reduced-motion:reduce){.picker-modal,.picker-modal__arrow,.picker-modal__container,.picker-modal__option{transition:none}}.timer__sponsors{display:flex;flex-direction:column;align-items:center;gap:var(--space-xs);margin:var(--space-sm) auto 0;padding:var(--space-sm);width:100%;max-width:280px}.timer__sponsors-label{font-size:var(--font-size-xs);color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.5px}.timer__sponsors-list{display:flex;gap:var(--space-md);justify-content:center}.sponsor-badge{display:flex;align-items:center;justify-content:center;width:36px;height:36px;padding:0;border:1px solid var(--color-border);border-radius:var(--radius-md);background-color:var(--color-surface);cursor:pointer;transition:border-color var(--transition-fast),transform var(--transition-fast),box-shadow var(--transition-fast)}.sponsor-badge:hover{border-color:var(--color-primary);transform:scale(1.05);box-shadow:var(--shadow-sm)}.sponsor-badge:active{transform:scale(.98)}.sponsor-badge__logo{display:flex;align-items:center;justify-content:center;width:100%;height:100%;font-size:var(--font-size-xs);font-weight:600;color:var(--color-text-muted)}.sponsor-badge__logo img{width:28px;height:28px;object-fit:contain;border-radius:var(--radius-sm)}@media print{.timer__controls{display:none}.picker-modal{display:none}.timer__sponsors{display:none}}