@import url("https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;550;600;650;700&family=IBM+Plex+Mono:wght@400;500;600&display=swap");:root{--green:#154326;--orange:#e77d43;--muted:#598269;--line:#dbe8e0;--pale:#f6faf8;--mono:"IBM Plex Mono",Consolas,monospace}*{box-sizing:border-box}body{margin:0;background:white;color:var(--green);font:18px/1.5 DM Sans,Arial,sans-serif}button,input{font:inherit;color:inherit}button{cursor:pointer}button:disabled{cursor:default}a{color:inherit;text-decoration:none}a,button,input,summary{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible,svg g:focus-visible{outline:3px solid var(--orange);outline-offset:3px}::selection{background:#f4bc98}.orange,h1>span{color:var(--orange)}.header{max-width:1280px;margin:auto;height:96px;padding:0 48px;border-bottom:1px solid var(--line);justify-content:space-between}.header,.logo{display:flex;align-items:center}.logo{font-size:36px;letter-spacing:-1.3px;font-weight:700}.logo-mark{font-size:43px;color:var(--orange);margin-right:11px}.logo-dot{color:var(--green)}.header-note{font-size:15px;color:var(--muted);display:flex;align-items:center;gap:8px}i{display:inline-block;width:6px;height:6px;background:var(--orange);border-radius:50%}main{max-width:1200px;padding:0 40px;margin:auto}.hero{text-align:center;padding:49px 0 37px}.eyebrow{display:flex;align-items:center;justify-content:center;gap:9px;font-size:14px;font-weight:700;letter-spacing:2px}.hero h1{font-size:clamp(36px,4vw,54px);letter-spacing:-1.8px;font-weight:550;line-height:1.2;margin:17px 0 13px}.hero p{color:var(--muted);font-size:19px;margin:0}.workspace{background:var(--pale);border:1px solid var(--line);border-radius:18px;padding:22px 32px 0;box-shadow:0 5px 22px #15432604;scroll-margin:20px}.workspace-top{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);padding-bottom:18px;margin-bottom:24px}.workspace-top>span{display:flex;gap:10px;align-items:center;font-weight:600;font-size:15px}.calendar-symbol{display:grid;place-items:center;width:32px;height:32px;background:#e7f0ea;border:1px solid #d3e3d9;border-radius:8px;color:#4d805e;font-size:29px}.workspace-top small{font:14px var(--mono);letter-spacing:.6px;display:flex;gap:8px;align-items:center;color:var(--muted)}.workspace-top i{width:5px;height:5px;background:#7ba78b}.calculator-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(210px,.86fr) minmax(0,1fr);grid-gap:32px;gap:32px;align-items:start}.section-title{display:flex;align-items:center;gap:8px;margin-bottom:13px;min-height:25px}.section-title>span{font:14px var(--mono);color:#79a68a}.section-title h2{font-size:20px;letter-spacing:-.4px;font-weight:600;margin:0}.section-title small{margin-left:auto;font:14px var(--mono);letter-spacing:.3px;color:#6b977b}.box{background:#fff;border:1px solid var(--line);border-radius:10px;padding:12px;margin-bottom:12px}.box-caption{font:14px var(--mono);letter-spacing:.9px;color:#62816c;display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.box-caption span{letter-spacing:0;color:#73957e}.grid{display:grid;grid-gap:4px;gap:4px}.four{grid-template-columns:repeat(4,minmax(0,1fr))}.seven{grid-template-columns:repeat(7,minmax(0,1fr))}.grid button{border:0;border-radius:6px;background:transparent;min-width:0;min-height:32px;font-size:15px;transition:background .12s}.grid button:hover:not(:disabled){background:#edf4ef}.grid button[aria-pressed=true]{background:var(--green);color:white}.year-box .grid button{font-family:var(--mono);font-size:14px}.year-wrap{position:relative}.year-arrow{position:absolute;top:53px;background:#eaf2ed;border:1px solid #d2e2d8;color:#5b8b6c;width:22px;height:28px;border-radius:5px;padding:0;font-size:20px}.year-arrow:hover{background:#dbe8e0}.year-arrow:disabled{opacity:.35}.year-arrow.previous{left:-25px}.year-arrow.next{right:-25px}.calendar .grid button{min-height:30px;font:14px var(--mono)}.weekdays{margin-bottom:7px}.weekdays span{text-align:center;font-size:14px;color:#75947e;padding:3px 0}.readonly .grid button[aria-pressed=true]{background:#e9b18b;color:#154326}.readonly .grid button{color:#60826a}.date-input-label{display:block;font-size:14px;font-weight:600;margin:16px 0 7px}.date-input{width:100%;border:1px solid #cddfd3;background:white;border-radius:7px;padding:12px 10px;font:14px var(--mono);height:43px}.date-input[readonly]{background:#eaf2ed}.input-hint{color:#6b8e77;margin:7px 0 0;min-height:29px}.error,.input-hint{font-size:14px;line-height:1.6}.error{color:#a04623}.interval-card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:20px 18px 14px}.mode-control{display:flex;gap:7px;justify-content:center;align-items:center;white-space:nowrap;font-size:14px;color:#769482}.mode-active{color:var(--green);font-weight:650}.switch{padding:3px;border:0;background:#bed4c5;border-radius:20px;width:34px;height:20px;flex-shrink:0;display:flex;align-items:center}.switch>span{height:14px;width:14px;background:white;border-radius:100%;box-shadow:0 1px 3px #15432633;transition:transform .15s}.switch[aria-checked=true]{background:var(--green)}.show-time{display:flex;align-items:center;gap:7px;font-size:14px;border-top:1px solid #e6eee8;border-bottom:1px solid #e6eee8;margin:18px 0;padding:13px 0;cursor:pointer}.show-time input{accent-color:var(--green);height:14px;width:14px;margin:0}.show-time>span{margin-left:auto;color:#84a48e;font-size:21px}.operation{display:flex;gap:6px;margin-bottom:20px}.operation button{flex:1 1;border:1px solid var(--line);background:#fff;border-radius:6px;padding:8px 2px;font-size:14px}.operation button[aria-pressed=true]{background:var(--green);color:white;border-color:var(--green)}.interval-caption{font:14px var(--mono);letter-spacing:1px;color:#72917b;margin:0 0 12px}.interval-fields>label{display:flex;justify-content:space-between;align-items:center;margin:0 0 9px;gap:8px;font-size:15px}.interval-fields input{width:86px;min-width:0;border:1px solid #dbe8e0;border-radius:6px;background:#f8fbf9;padding:8px 7px;text-align:right;font:18px var(--mono);height:37px}.interval-fields input[readonly]{border-color:transparent;background:#f4f8f5}.interval-fields input::-webkit-inner-spin-button{-webkit-appearance:none;appearance:none}.interval-fields .total-field{padding-top:11px;margin:11px 0 17px;border-top:1px dashed #dbe8e0;font-weight:600}.interval-fields .total-field input{color:#ba6236;background:#fff7f0;border-color:#f0dfd1;font-size:16px}.reset{width:100%;background:#edf4ef;color:#376b48;border:1px solid #d5e4da;border-radius:7px;padding:10px;font-size:14px;margin-top:6px}.reset:hover{background:#dfebe3}.reset>span{font-size:20px;margin-right:6px}.interval-note{font-size:14px;line-height:1.8;text-align:center;color:#7b9583;margin:12px 0 0}.result-strip{display:flex;align-items:center;justify-content:space-between;gap:18px;border-top:1px solid var(--line);margin-top:22px;padding:18px 0}.result-strip>div{display:flex;gap:12px;align-items:center}.result-icon{width:36px;height:36px;background:#e7f0ea;border:1px solid #d4e4d9;border-radius:8px;display:grid;place-items:center;color:#4f8560;font-size:28px}.result-strip>div>span:last-child{font-size:14px;color:#769580}.result-strip strong{display:block;color:var(--green);font-size:18px;font-weight:600;margin-top:2px}.result-strip>small{font-size:14px;color:#7c9a85}.result-strip>small>span{padding:0 5px}.under-workspace{display:flex;justify-content:space-between;gap:14px;padding:15px 4px;color:#769b82;font-size:14px}.guide{padding:40px 0 0}.guide>.eyebrow{color:#73977e;font-size:14px;letter-spacing:1.6px}.guide h2{text-align:center;font-size:35px;font-weight:550;letter-spacing:-.9px;margin:12px 0 30px}.guide-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:35px;gap:35px;border-bottom:1px solid var(--line);padding-bottom:32px}.guide-grid article>span{font:14px var(--mono);letter-spacing:.5px;color:#bb7048}.guide h3{font-size:19px;font-weight:600;letter-spacing:-.2px;margin:12px 0 8px}.guide p{color:var(--muted);font-size:15px;line-height:1.9;margin:0}.faq{padding:24px 0 42px}.faq h2{font-size:24px;font-weight:550;letter-spacing:-.5px;margin:6px 0 12px}.faq details{border-bottom:1px solid #e6eee8;padding:13px 0}.faq summary{cursor:pointer;font-size:15px;font-weight:500}.faq p{font-size:15px;line-height:1.9;color:var(--muted);max-width:850px;margin-bottom:0}footer{max-width:1184px;margin:auto;padding:24px 8px;border-top:1px solid var(--line);display:flex;align-items:center;gap:24px;font-size:14px;color:#7b9a84}.footer-logo{font-size:24px;font-weight:650;letter-spacing:-.7px;color:var(--green)}footer>span:last-child{margin-left:auto}.time-box{padding-bottom:12px}.clock{display:block;width:100%;max-width:240px;margin:0 auto;touch-action:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.clock text{fill:var(--green);font:18px DM Sans,Arial,sans-serif;pointer-events:none}.clock .clock-brand{font:14px var(--mono);letter-spacing:2px;fill:#83a38e}.clock g{cursor:-webkit-grab;cursor:grab}.readonly .clock g{cursor:default}.digital-row{display:flex;justify-content:center;align-items:center;gap:8px;margin-top:7px}.digital-row>input{width:107px;border:1px solid var(--line);background:#f8fbf9;border-radius:5px;padding:6px;font:15px var(--mono)}.ampm{display:flex;gap:3px}.ampm button{font:14px var(--mono);border:0;padding:7px 6px;border-radius:4px;background:#f0f5f1;color:#6e8f79}.ampm button[aria-pressed=true]{background:#154326;color:white}.clock-time{text-align:center;font:14px var(--mono);color:#6b9179;margin-top:8px}.loading{padding:100px 0;text-align:center;color:var(--muted)}.skip{position:absolute;left:20px;top:-100px;background:#fff;padding:12px;z-index:10}.skip:focus{top:10px}@media(min-width:1300px){.hero{padding-top:56px}.workspace{padding:24px 36px 0}.calculator-grid{gap:40px}}@media(max-width:950px){main{padding:0 26px}.header{padding:0 30px}.workspace{padding:20px 28px 0}.calculator-grid{gap:25px;grid-template-columns:minmax(0,1fr) 210px minmax(0,1fr)}.interval-card{padding:18px 12px 12px}.section-title small{font-size:14px}.section-title{gap:5px}.section-title h2{font-size:18px}.box{padding:10px 7px}.grid{gap:2px}.grid button,.year-box .grid button{font-size:14px}.result-strip>small{max-width:140px;text-align:right;line-height:1.8}.date-input{font-size:14px;padding:10px 6px}}@media(max-width:760px){.header{height:76px;padding:0 22px}.header-note{display:none}.logo{font-size:31px}.hero{padding:35px 0 28px}.hero h1{font-size:43px;max-width:420px;margin:16px auto 12px}.hero p{font-size:16px;max-width:340px;margin:auto;line-height:1.8}main{padding:0 16px}.workspace{max-width:460px;margin:auto;padding:18px 30px 0;border-radius:13px}.workspace-top{margin-bottom:20px}.workspace-top small,.workspace-top>span{font-size:14px}.calculator-grid{grid-template-columns:minmax(0,1fr);gap:22px}.section-title h2{font-size:21px}.section-title small{font-size:14px}.box{padding:13px}.grid{gap:5px}.grid button{min-height:36px;font-size:16px}.year-box .grid button{font-size:15px}.calendar .grid button{min-height:34px;font-size:15px}.year-arrow.previous{left:-26px}.year-arrow.next{right:-26px}.year-arrow{width:23px}.interval-card{padding:20px}.mode-control{gap:12px}.mode-control,.show-time{font-size:15px}.interval-fields>label{font-size:16px}.interval-fields input{width:112px}.date-input{font-size:15px;padding:12px}.input-hint{font-size:14px;min-height:0}.result-strip{align-items:flex-start;flex-direction:column;gap:12px}.result-strip>small{max-width:none;text-align:left;font-size:14px}.result-strip strong{font-size:16px}.under-workspace{max-width:460px;margin:auto;font-size:14px;flex-wrap:wrap}.guide{padding-top:32px}.guide h2{font-size:31px}.guide-grid{grid-template-columns:1fr;gap:25px;max-width:430px;margin:auto;padding:0 6px 28px}.guide h3{margin:8px 0 6px}.faq{max-width:430px;margin:auto;padding-top:24px}.faq summary{font-size:15px;line-height:1.8}footer{padding:20px;flex-wrap:wrap;gap:10px;font-size:14px}footer>span:nth-child(2){margin-left:auto}footer>span:last-child{display:none}.clock{max-width:230px}}@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}main{max-width:1340px}.header{max-width:1380px}.calculator-grid{grid-template-columns:minmax(0,1fr) minmax(260px,.9fr) minmax(0,1fr);gap:38px}.box,.interval-card,.workspace{border:1.5px solid var(--green)}.date-input,.digital-row>input,.interval-fields .total-field input,.interval-fields input,.interval-fields input[readonly],.operation button,.reset,.year-arrow{border-color:var(--green)}.box-caption{gap:5px;flex-wrap:wrap;line-height:1.6}.box-caption span{font-size:14px}.grid button{min-height:40px}.calendar .grid button{min-height:36px}.year-arrow{height:34px;top:64px}.section-title{flex-wrap:wrap;min-height:32px}.section-title small{font-size:12px}.mode-control{gap:8px;white-space:normal;text-align:center}.switch{width:38px;height:24px;padding:4px}.switch>span{width:16px;height:16px}.switch[aria-checked=true]>span{transform:translateX(14px)}.interval-fields input{width:110px;height:44px}.date-input{height:49px}.input-hint,.interval-note{font-size:14px}.digital-row{flex-wrap:wrap}.digital-row>input{width:140px}.ampm button{padding:8px}.clock text{font-size:17px}.clock .clock-brand{font-size:8px}.live-date{display:flex;align-items:center;gap:7px;background:transparent;border:0;padding:8px 0 0;font-size:14px;text-align:left;color:var(--green);text-decoration:underline;text-underline-offset:3px}.live-date i{background:#7d9484;flex-shrink:0}.live-date.is-live i{background:var(--orange)}.result-strip>small{line-height:1.8}.result-strip strong{font-size:19px}.workspace-top small{font-size:12px}@media(max-width:1080px) and (min-width:761px){main{padding:0 20px}.workspace{padding:20px 28px 0}.calculator-grid{grid-template-columns:minmax(0,1fr) 244px minmax(0,1fr);gap:28px}.interval-card{padding:18px 12px}.section-title small{margin-left:0;width:100%}.year-box .grid button{font-size:14px}.four{gap:2px}.box{padding:10px 6px}.date-input,.mode-control{font-size:14px}.result-strip{flex-wrap:wrap}.result-strip>small{max-width:none;text-align:left}.box-caption span{font-size:12px}.live-date{font-size:14px}}@media(max-width:760px){.calculator-grid{grid-template-columns:minmax(0,1fr);gap:26px}.workspace-top{gap:12px;flex-wrap:wrap}.section-title small{font-size:12px}.workspace{padding-left:30px;padding-right:30px}.grid button{min-height:42px}.calendar .grid button{min-height:38px}.year-arrow{top:65px}.result-strip strong{font-size:18px}.result-strip>small,.under-workspace{font-size:14px}.hero .eyebrow{font-size:13px}.header .logo{font-size:31px}.guide>.eyebrow{font-size:12px}.guide-grid{gap:28px}.interval-card{padding:20px 18px}.interval-fields input{width:125px}.box-caption span,.live-date,footer{font-size:14px}}.section-title small{max-width:100%;line-height:1.5;white-space:normal}