:root{color-scheme:light;--shade:#82b0d1;--shade-light:#a0c7df;--shade-deep:#679bbc;--case:#e9f1f6;--ink:#384653;--muted:#8a98a3}*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;background:#fff;color:var(--ink)}button,select,input{font:inherit}button{cursor:pointer;touch-action:manipulation}button:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid #69a8db;outline-offset:3px}.app{max-width:920px;margin:auto;min-height:100dvh;min-height:100vh;display:flex;flex-direction:column;overflow:hidden}.topbar{height:75px;padding:18px 29px;display:flex;align-items:center;justify-content:space-between;transition:opacity .32s,transform .32s}.brand{font-size:19px;letter-spacing:.21em;color:#606c79;font-weight:600}.brand span{font-size:9px;letter-spacing:.13em;margin-left:10px;color:#a1adb6;font-weight:400}.subtle{border:0;background:transparent;font-size:25px;color:#9da9b4}.stage{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:530px;position:relative;padding:55px 16px 25px}.controls-top{position:absolute;top:5px;left:50%;transform:translateX(-50%) translateY(5px);display:flex;gap:16px;opacity:0;pointer-events:none;transition:opacity .3s,transform .3s;z-index:2}.glass{border:1px solid rgba(231,237,241,.95);background:linear-gradient(150deg,rgba(255,255,255,.96),rgba(243,247,249,.89));box-shadow:0 9px 21px rgba(69,90,112,.075),inset 1px 1px 2px #fff;border-radius:23px}.action{min-width:104px;padding:10px 10px 9px;display:flex;flex-direction:column;align-items:center;gap:3px;color:#6a7885}.action>span{font-size:21px;line-height:1.2}.action small{font-size:11px}.object-wrap{position:relative;width:min(74vw,390px);flex-shrink:0;aspect-ratio:1/1.10;margin:0 0 5px}.object{position:absolute;z-index:1;top:0;left:0;width:100%;height:auto;aspect-ratio:1/1;border-radius:50%;box-shadow:0 9px 12px rgba(55,72,81,.09),0 2px 2px rgba(56,81,94,.1),inset 1px 3px 3px rgba(255,255,255,.95),inset -3px -3px 7px rgba(105,132,151,.10);background:linear-gradient(128deg,#f7fafc 0%,var(--case) 51%,#ecf0f2 85%,#f7f8f9 100%);border:2px solid #dbe4e9}.rim{position:absolute;inset:3.4%;border-radius:50%;box-shadow:inset 0 5px 5px rgba(96,117,132,.09),inset 0 -4px 3px rgba(255,255,255,.95),0 0 0 1px rgba(255,255,255,.75);display:grid;place-items:center}.rim-inner{position:absolute;inset:11.7%;border-radius:50%;box-shadow:inset 8px 8px 14px rgba(48,77,99,.18),inset -4px -4px 6px rgba(255,255,255,.65),0 1px 1px white;overflow:visible}.face{width:100%;height:100%;border-radius:50%;display:block;filter:drop-shadow(0 2px 1px rgba(85,113,132,.08))}.hub{position:absolute;width:35.5%;height:35.5%;left:50%;top:50%;transform:translate(-50%,-50%);border-radius:50%;border:1px solid rgba(255,255,255,.8);background:linear-gradient(125deg,#f7f9fa,#e0e6eb 75%,#d2dce4);box-shadow:4px 8px 13px rgba(57,84,109,.28),inset 2px 2px 4px rgba(255,255,255,.93),inset -2px -2px 5px rgba(122,143,158,.10);display:grid;place-items:center;z-index:1}.hub:active{transform:translate(-50%,-50%) scale(.97)}.hub-mark{width:49%;height:49%}.dot{position:absolute;left:50%;top:6.5%;transform:translateX(-50%);width:5px;height:5px;background:#3d4964;border-radius:50%;box-shadow:0 0 0 1px rgba(255,255,255,.35)}.ground-shadow{position:absolute;bottom:0.5%;left:16%;width:84%;height:13%;border-radius:50%;background:radial-gradient(ellipse at 50% 48%,rgba(52,65,75,.24) 0%,rgba(62,75,84,.14) 34%,rgba(72,80,88,.045) 61%,transparent 80%);filter:blur(11px);z-index:0}.below{width:min(85vw,360px);min-height:130px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;position:relative}.remaining{opacity:0;transform:translateY(6px);transition:.3s;display:flex;flex-direction:column;align-items:center;pointer-events:none}.remaining strong{font-size:clamp(32px,8vw,45px);font-weight:350;letter-spacing:.075em;font-variant-numeric:tabular-nums;color:#626f7c}.remaining small{color:#a0abb4;font-size:11px;letter-spacing:.17em;margin-top:3px}.idle-panel{display:flex;flex-direction:column;align-items:stretch;gap:12px;width:100%;transition:opacity .3s,transform .3s}.time-set{margin:auto;display:flex;justify-content:space-between;align-items:center;width:220px;height:53px;border-radius:35px;padding:5px;border:1px solid #edf1f4;box-shadow:0 7px 22px rgba(70,90,110,.05),inset 0 0 1px #fff}.step{border:0;border-radius:50%;width:42px;height:42px;background:linear-gradient(145deg,#fff,#ecf1f4);color:#546474;font-size:23px;box-shadow:0 4px 10px rgba(80,100,110,.09)}.minute-label{display:flex;align-items:center;justify-content:center;gap:3px}.minute-label input{width:57px;border:0;background:none;text-align:right;font-size:22px;font-variant-numeric:tabular-nums;color:#4b5b6d;outline:none;appearance:textfield}.minute-label input::-webkit-inner-spin-button,.minute-label input::-webkit-outer-spin-button{appearance:none;margin:0}.minute-label span{font-size:12px;color:#82909b}#presets{height:38px;width:220px;align-self:center;border:1px solid #e8edf1;border-radius:20px;background:#fafcfd;color:#6b7885;padding:0 15px;font-size:12px}.start{height:52px;border:1px solid #b2d1e5;border-radius:28px;background:linear-gradient(120deg,#a1c8df,#78aacb);color:#fff;font-size:17px;letter-spacing:.1em;box-shadow:0 10px 23px rgba(91,146,182,.19),inset 0 1px 2px rgba(255,255,255,.7)}.tip{display:none;font-size:11px;color:#b4bec6;letter-spacing:.02em;text-align:center;margin-top:15px}footer{display:flex;justify-content:center;gap:12px;padding:12px 10px max(20px,env(safe-area-inset-bottom));transition:opacity .3s}.footer-item{background:transparent;border:0;font-size:18px;color:#8395a3;padding:9px 12px;display:flex;align-items:center;gap:5px}.footer-item span{font-size:11px}.app.running .topbar,.app.running footer,.app.running .idle-panel{opacity:0;pointer-events:none;transform:translateY(5px)}.app.running .tip{display:none}.app.running.revealed .controls-top{opacity:1;pointer-events:auto;transform:translateX(-50%) translateY(0)}.app.running.revealed .remaining{opacity:1;transform:translateY(0)}.app.finished .object{animation:doneGlow 1.7s ease-in-out 3}@keyframes doneGlow{50%{box-shadow:0 0 32px rgba(126,185,216,.54),0 7px 12px rgba(55,72,81,.1)}}dialog{border:1px solid #e3e9ec;border-radius:23px;box-shadow:0 24px 100px #4f62702c;max-width:min(92vw,440px);width:440px;padding:0;background:#fff}dialog::backdrop{background:rgba(221,229,236,.45);backdrop-filter:blur(5px)}.dialog-content{padding:23px}.dialog-title{display:flex;justify-content:space-between;align-items:center}.dialog-title h2{font-size:19px;margin:0;font-weight:600}.close{font-size:28px;background:transparent;border:0;color:#86939c}.muted{font-size:12px;color:#8797a3;margin:19px 0 12px}.swatches{display:grid;grid-template-columns:repeat(4,1fr);gap:15px 4px}.swatch{border:0;background:none;color:#7e8b93;font-size:10px;display:flex;flex-direction:column;align-items:center;gap:7px}.swatch i{display:block;width:40px;height:40px;border-radius:50%;border:4px solid white;box-shadow:0 0 0 1px #dce3e9,0 4px 10px #52647315}.swatch.active i{box-shadow:0 0 0 2px #68a8d4,0 4px 12px #52647320}.setting-row{display:flex;justify-content:space-between;align-items:center;margin:26px 0 20px;color:#687986;font-size:13px}.footnote{font-size:11px;line-height:1.8;color:#94a0a9}.ok{width:100%;padding:12px;background:#edf4f8;border:0;border-radius:20px;color:#54758b;margin-top:10px}@media (min-width:680px){.stage{min-height:600px}.object-wrap{width:410px}.below{min-height:135px}}@media (max-height:730px){.topbar{height:54px}.stage{min-height:440px;padding-top:48px}.object-wrap{width:min(59vh,74vw,340px)}.below{min-height:115px}.idle-panel{gap:7px}.start{height:45px}.tip{margin-top:8px}footer{padding-top:0;padding-bottom:12px}}@media (prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}