.srt{--srt-ink:#23333d;--srt-muted:#687b87;--srt-border:#d9e5eb;--srt-blue:#245f86;font-family:Roboto,"Noto Sans KR",sans-serif;color:var(--srt-ink);font-size:15px;box-sizing:border-box}
.srt *{box-sizing:border-box}.srt button{font:inherit;cursor:pointer;transition:background .16s ease,border-color .16s ease,transform .16s ease}.srt button:focus-visible{outline:3px solid #4a94c3;outline-offset:3px}.srt-widget{max-width:660px;margin:0 auto;background:#fafbf9;border:1px solid #e2e9e9;border-radius:24px;padding:25px 29px 30px;box-shadow:0 8px 36px #2944550a}
.srt-header{display:flex;justify-content:space-between;align-items:center;gap:16px;border-bottom:1px solid #e6eeee;padding-bottom:17px}.srt-brand{font-size:13px;letter-spacing:.14em;font-weight:700;color:#285a70}.srt-brand span{color:#819298;font-weight:400}
.srt-switch{display:flex;gap:3px;padding:4px;background:#e9eff1;border-radius:30px}.srt-switch-btn{border:0!important;background:transparent!important;border-radius:25px!important;padding:7px 16px!important;color:#60737a!important;line-height:1.4!important}.srt-switch-btn.is-active{color:#184763!important;background:#fff!important;box-shadow:0 2px 7px #29445517!important}
.srt-clock-view{text-align:center;padding:34px 0 6px}.srt-clock-face{width:min(245px,66vw);height:min(245px,66vw);border-radius:50%;background:#eff5f7;border:9px solid #dae8ed;position:relative;margin:0 auto 22px;box-shadow:inset 0 0 0 2px #fff}.srt-clock-tick{position:absolute;background:#7192a1;border-radius:3px}.srt-tick-12,.srt-tick-6{width:4px;height:15px;left:calc(50% - 2px)}.srt-tick-12{top:12px}.srt-tick-6{bottom:12px}.srt-tick-3,.srt-tick-9{height:4px;width:15px;top:calc(50% - 2px)}.srt-tick-3{right:12px}.srt-tick-9{left:12px}.srt-clock-hour,.srt-clock-minute,.srt-clock-second{position:absolute;left:calc(50% - 3px);bottom:50%;width:6px;transform-origin:center bottom;border-radius:10px;background:#274f67}.srt-clock-hour{height:26%;}.srt-clock-minute{height:37%;width:4px;left:calc(50% - 2px)}.srt-clock-second{height:40%;width:2px;left:calc(50% - 1px);background:#ca796e}.srt-clock-pin{width:12px;height:12px;border-radius:50%;position:absolute;top:calc(50% - 6px);left:calc(50% - 6px);background:#274f67}.srt-now{font-size:32px;font-weight:400;letter-spacing:.04em;font-variant-numeric:tabular-nums}.srt-hint{font-size:14px;color:#75878e;margin:9px 0 11px}.srt-text-link{border:0!important;background:transparent!important;color:#276b92!important;text-decoration:underline!important;text-underline-offset:4px;padding:8px!important}
.srt-menu-view{padding-top:23px}.srt-section-heading{font-size:14px;font-weight:700;margin:0 0 13px;color:#475e69}.srt-routines{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px}.srt-routine,.srt-minute{border:1px solid var(--srt-border)!important;background:#fff!important;color:#486170!important;border-radius:10px!important;padding:12px 4px!important;line-height:1.3!important;min-width:0}.srt-routine:hover,.srt-minute:hover{border-color:#6c9bb5!important}.srt-routine.is-selected,.srt-minute.is-selected{background:#e4f1f8!important;border-color:#3881b0!important;color:#1b5477!important;font-weight:700!important}.srt-time-heading{display:flex;justify-content:space-between;align-items:center;margin:27px 0 12px}.srt-time-heading .srt-section-heading{margin:0}.srt-time-picked{font-weight:700;color:#23658b;font-variant-numeric:tabular-nums}.srt-minutes{max-height:204px;overflow-y:auto;overscroll-behavior:contain;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;padding:3px 3px 7px;scrollbar-color:#b8cad3 transparent;scrollbar-width:thin}.srt-minute{font-size:13px!important;border-radius:7px!important;padding:9px 0!important;font-variant-numeric:tabular-nums}.srt-start{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;margin-top:24px;border:0!important;border-radius:12px!important;background:#245e80!important;color:white!important;padding:15px 18px!important;font-weight:700!important}.srt-start:hover{background:#1b4c69!important}.srt-start-label{font-weight:400;opacity:.85}
.srt-overlay[hidden],.srt-menu-view[hidden],.srt-clock-view[hidden]{display:none!important}.srt-overlay{position:fixed;inset:0;z-index:2147483000;background:#f4f8fa;display:flex;align-items:center;justify-content:center;padding:25px 15px;overflow:auto}.srt-running{text-align:center;width:min(100%,640px);margin:auto}.srt-wheel{--srt-diameter:min(78vw,440px);position:relative;width:var(--srt-diameter);height:var(--srt-diameter);margin:0 auto 25px;border-radius:50%;background:conic-gradient(from 0deg,#e5f3fc 0deg 30deg,#d4eafa 30deg 60deg,#bfddf3 60deg 90deg,#a6d0ed 90deg 120deg,#88bde3 120deg 150deg,#70acda 150deg 180deg,#5697c9 180deg 210deg,#4184b9 210deg 240deg,#3075ab 240deg 270deg,#26689b 270deg 300deg,#1d5988 300deg 330deg,#164a78 330deg 360deg);box-shadow:0 12px 45px #173e5a25,inset 0 0 0 3px #fff}.srt-wheel:before{content:"";position:absolute;inset:0;border-radius:50%;background:repeating-conic-gradient(from 0deg,transparent 0deg 29.5deg,#f6fbff 29.5deg 30deg);opacity:.86;pointer-events:none}.srt-dial-ring{position:absolute;inset:14px;border-radius:50%;border:1px solid #ffffffa6}.srt-wheel-center{position:absolute;inset:22%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#f9fcffed;border-radius:50%;box-shadow:0 2px 30px #15496915;padding:12px;z-index:2}.srt-routine-title{font-size:clamp(18px,4vw,28px);font-weight:700;word-break:keep-all}.srt-session-label{font-size:clamp(14px,3vw,19px);margin:4px 0 12px;color:#4c7b99}.srt-remaining{font-size:clamp(20px,5vw,35px);letter-spacing:.02em;font-variant-numeric:tabular-nums;color:#163f5b}.srt-hand{position:absolute;z-index:3;left:calc(50% - 2px);bottom:50%;width:4px;height:45%;background:#153b5a;transform-origin:center bottom;transform:rotate(0deg);border-radius:6px;box-shadow:0 0 4px #ffffffaa}.srt-needle-dot{position:absolute;z-index:4;left:calc(50% - 7px);top:calc(50% - 7px);width:14px;height:14px;border-radius:50%;background:#153b5a;border:2px solid white}.srt-progress-text{color:#4f7184;font-size:16px;margin:14px 0 20px}.srt-run-actions{display:flex;justify-content:center;gap:12px}.srt-run-actions button{min-width:120px;padding:13px 25px!important;border-radius:13px!important}.srt-finish{background:#245e80!important;color:#fff!important;border:1px solid #245e80!important}.srt-exit{background:#fff!important;color:#2a5d77!important;border:1px solid #c9dce6!important}.srt-exit span{opacity:.66;font-size:12px}
@media(max-width:520px){.srt-widget{padding:20px 15px 22px;border-radius:16px}.srt-routines{grid-template-columns:repeat(5,minmax(0,1fr));gap:5px}.srt-routine{padding:11px 1px!important;font-size:12px!important}.srt-minutes{grid-template-columns:repeat(4,minmax(0,1fr));max-height:225px}.srt-wheel{--srt-diameter:min(89vw,390px)}.srt-brand{font-size:11px}.srt-switch-btn{padding:7px 10px!important}.srt-run-actions button{min-width:110px}}
@media(prefers-reduced-motion:reduce){.srt button{transition:none}}

/* v1.0.3: Landscape = clock on the left, routine/time selection on the right.
   Portrait remains the existing clock/menu toggle. */
@media (orientation: landscape) and (min-width: 560px) {
  .srt-widget {
    width: 100%;
    max-width: 1100px;
    display: grid;
    grid-template-columns: minmax(190px, 0.85fr) minmax(300px, 1.5fr);
    column-gap: clamp(16px, 3vw, 42px);
    align-items: start;
    padding: clamp(14px, 2.1vw, 28px);
  }
  .srt-header { grid-column: 1 / -1; }
  .srt-switch { display: none; }
  .srt-clock-view,
  .srt-clock-view[hidden] {
    grid-column: 1;
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 18px 0 0;
    min-width: 0;
  }
  .srt-menu-view,
  .srt-menu-view[hidden] {
    grid-column: 2;
    display: block !important;
    padding-top: 14px;
    min-width: 0;
  }
  .srt-clock-face {
    width: min(25vw, 220px, 48vh);
    height: min(25vw, 220px, 48vh);
    margin-bottom: 13px;
  }
  .srt-now { font-size: clamp(21px, 2.4vw, 30px); }
  .srt-hint { font-size: 12px; }
  .srt-text-link { display: none; }
  .srt-routines { gap: 6px; }
  .srt-routine { padding: 9px 2px !important; font-size: 12px !important; }
  .srt-time-heading { margin-top: 17px; }
  .srt-minutes {
    max-height: min(34vh, 180px);
    grid-template-columns: repeat(5, minmax(0,1fr));
    gap: 5px;
  }
  .srt-minute { font-size: 12px !important; padding: 8px 1px !important; }
  .srt-start { margin-top: 13px; padding: 12px !important; }
}
@media (orientation: landscape) and (min-width: 560px) and (max-height: 480px) {
  .srt-widget { padding: 10px 14px 12px; column-gap: 17px; }
  .srt-header { padding-bottom: 8px; }
  .srt-clock-face { width: min(25vw, 175px, 43vh); height: min(25vw, 175px, 43vh); }
  .srt-clock-view { padding-top: 9px; }
  .srt-menu-view { padding-top: 7px; }
  .srt-section-heading { margin-bottom: 7px; }
  .srt-routine { padding: 7px 1px !important; }
  .srt-time-heading { margin: 9px 0 5px; }
  .srt-minutes { max-height: 105px; }
  .srt-minute { padding: 6px 0 !important; }
  .srt-start { margin-top: 8px; padding: 9px !important; }
  .srt-hint { margin: 5px 0; }
  .srt-wheel { --srt-diameter: min(60vh, 320px); }
  .srt-running { display: flex; justify-content: center; align-items: center; gap: 18px; width: min(100%, 760px); }
  .srt-wheel { flex: 0 0 auto; margin: 0; }
  .srt-progress-text { margin: 0 0 8px; }
  .srt-run-actions { flex-wrap: wrap; }
}

/* v1.0.4: optional music at timer completion */
.srt-end-sound-setting{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:12px 0 14px;font-size:14px;color:#315971;cursor:pointer}
.srt-end-sound-setting input{accent-color:#245e80;width:17px;height:17px}
.srt-end-sound-hint{font-size:12px;color:#667f8d}
.srt-audio-status{font-size:13px;color:#245e80;margin:4px 0 12px}
.srt-audio-status[hidden],.srt-play-end-music[hidden],.srt-stop-end-music[hidden]{display:none!important}
.srt-play-end-music,.srt-stop-end-music{background:#e1eef5!important;color:#174b6b!important;border:1px solid #b9d5e5!important}
.srt-run-actions{flex-wrap:wrap}
