:root{--emerald:#123c32;--ivory:#f7f4ea;--gold:#c6a45c;--forest:#1b5142;--red:#c85c5c;--card:#fffdf6;--shadow:0 6px 24px #123c3214;--radius:16px;--serif:"Cormorant Garamond", Georgia, serif;--sans:"Inter", system-ui, -apple-system, sans-serif}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--ivory);color:var(--emerald);font-family:var(--sans);-webkit-font-smoothing:antialiased;font-size:16px;line-height:1.55}button{cursor:pointer;font-family:inherit}input,textarea{font-family:inherit}.pattern-light,.pattern-dark{position:relative}.pattern-light:before,.pattern-dark:before{content:"";pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80' viewBox='0 0 80 80'%3E%3Cg fill='none' stroke='%23C6A45C' stroke-width='1'%3E%3Cpath d='M40 0L80 40L40 80L0 40z'/%3E%3Cpath d='M40 22L58 40L40 58L22 40z'/%3E%3Cpath d='M0 0h80v80H0z'/%3E%3Ccircle cx='40' cy='40' r='3'/%3E%3C/g%3E%3C/svg%3E");position:absolute;inset:0}.pattern-light:before{opacity:.07}.pattern-dark:before{opacity:.1}.login{background:var(--emerald);justify-content:center;align-items:center;min-height:100vh;padding:24px;display:flex}.login-box{text-align:center;width:100%;max-width:360px;color:var(--ivory);position:relative}.login-box h1{font-family:var(--serif);letter-spacing:.35em;margin:0 -.35em 4px 0;font-size:3rem;font-weight:600}.gold-line{background:var(--gold);width:64px;height:1px;margin:18px auto}.gold-line.left{margin:0 0 18px}.login-tagline{color:#f7f4eab8;margin:0 0 32px;font-size:.95rem}.login-box input{width:100%;color:var(--ivory);text-align:center;background:0 0;border:none;border-bottom:1px solid #c6a45c80;outline:none;padding:12px;font-size:1.1rem;transition:border-color .25s}.login-box input::placeholder{color:#f7f4ea73}.login-box input:focus{border-bottom-color:var(--gold)}.login-error{color:#e8a3a3;margin:12px 0 0;font-size:.85rem;animation:.35s shake}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-6px)}75%{transform:translate(6px)}}.login-btn{background:var(--gold);color:var(--emerald);letter-spacing:.06em;border:none;border-radius:999px;min-height:48px;margin-top:28px;padding:12px 40px;font-size:.95rem;font-weight:600;transition:background .2s,transform .15s}.login-btn:hover{background:#d4b56f}.login-btn:active{transform:scale(.98)}.header{background:var(--emerald);color:var(--ivory);overflow:hidden}.header-inner{max-width:640px;margin:0 auto;padding:30px 20px 22px;position:relative}.header h1{font-family:var(--serif);letter-spacing:.3em;margin:0 -.3em 0 0;font-size:2.5rem;font-weight:600;line-height:1.1}.header-tagline{color:#f7f4eab3;margin:4px 0 0;font-size:.9rem}.header-date{color:var(--gold);letter-spacing:.14em;margin:10px 0 0;font-size:.85rem}.sync-status{letter-spacing:.1em;color:#f7f4ea80;-webkit-user-select:none;user-select:none;pointer-events:none;align-items:center;gap:6px;font-size:.68rem;display:inline-flex;position:absolute;top:30px;right:20px}.sync-dot{background:var(--gold);opacity:.45;border-radius:50%;width:5px;height:5px;transition:opacity .3s}.sync-dot.saving{opacity:.95}.sync-dot.synced{opacity:.55}.sync-dot.offline{opacity:.6;background:#f7f4ea8c}.nav{flex-wrap:wrap;gap:8px;margin-top:18px;display:flex}.nav button{color:#f7f4eae6;background:0 0;border:1px solid #c6a45c66;border-radius:999px;align-items:center;gap:7px;min-height:42px;padding:9px 15px;font-size:.85rem;transition:background .2s,border-color .2s,color .2s;display:inline-flex}.nav button:hover,.nav button.active{border-color:var(--gold);color:var(--ivory);background:#c6a45c29}.main{max-width:640px;margin:0 auto;padding:24px 16px 72px}.card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);margin-bottom:20px;padding:20px 22px}.list-card{border-top:3px solid var(--forest);padding-top:18px}.list-head{justify-content:space-between;align-items:center;gap:8px;margin-bottom:10px;display:flex}.list-head h2{font-family:var(--serif);margin:0;font-size:1.45rem;font-weight:600;line-height:1.25}.icon-btn{color:var(--gold);background:0 0;border:none;border-radius:10px;justify-content:center;align-items:center;min-width:44px;min-height:44px;padding:8px;transition:background .2s,color .2s,opacity .2s;display:inline-flex}.icon-btn:hover{background:#c6a45c24}.icon-btn:disabled{opacity:.3;cursor:default}.icon-btn.danger{color:var(--red)}.icon-btn.danger:hover{background:#c85c5c1f}.text-btn{background:var(--forest);color:var(--ivory);border:none;border-radius:999px;align-items:center;gap:7px;min-height:44px;padding:9px 18px;font-size:.85rem;font-weight:500;transition:background .2s;display:inline-flex}.text-btn:hover{background:var(--emerald)}.tasks{margin:0;padding:0;list-style:none}.task{cursor:pointer;border-bottom:1px solid #123c3212;border-radius:12px;align-items:center;gap:13px;min-height:54px;padding:13px 10px;transition:background .25s;display:flex}.task:last-child{border-bottom:none}.task.readonly{cursor:default}.task:not(.readonly):hover{background:#c6a45c12}.task .check{color:#0000;border:2px solid #c85c5ca6;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:26px;height:26px;transition:background .25s,border-color .25s,color .25s;display:flex}.task .text{flex:1;font-size:1rem;transition:color .25s}.task:not(.done) .text{color:var(--red)}.task.done .text{color:var(--forest)}.task.done .check{background:var(--forest);border-color:var(--forest);color:#fff}.task.done .check svg{animation:.25s ease-out pop}@keyframes pop{0%{opacity:0;transform:scale(.4)}to{opacity:1;transform:scale(1)}}.edit-row{align-items:center;gap:4px;padding:6px 0;display:flex}.edit-row input{min-width:0;color:var(--emerald);background:#fff;border:1px solid #123c3229;border-radius:12px;flex:1;min-height:48px;padding:12px 14px;font-size:1rem;transition:border-color .2s}.edit-row input:focus{border-color:var(--gold);outline:none}.edit-row .icon-btn{color:var(--emerald)}.edit-row .icon-btn.danger{color:var(--red)}.add-btn{width:100%;color:var(--forest);background:0 0;border:1px dashed #c6a45ca6;border-radius:12px;justify-content:center;align-items:center;gap:8px;min-height:48px;margin-top:12px;padding:13px;font-size:.95rem;transition:background .2s;display:flex}.add-btn:hover{background:#c6a45c14}.tracker-card{border-top:2px solid var(--gold)}.tracker{flex-wrap:wrap;align-items:flex-start;gap:24px;display:flex}.tracker-block{flex-direction:column;flex:240px;gap:8px;display:flex}.tracker-label{letter-spacing:.16em;text-transform:uppercase;color:#123c3299;margin:0;font-size:.8rem}.timer-text{font-family:var(--serif);color:var(--emerald);word-break:break-word;font-variant-numeric:lining-nums tabular-nums;margin:0;font-size:1.8rem}.timer-text.muted{color:#123c3280}.counter-row{flex-wrap:wrap;align-items:center;gap:14px;display:flex}.counter-value{font-family:var(--serif);color:var(--emerald);font-variant-numeric:lining-nums;min-width:72px;margin:0;font-size:2rem}.round-btn{background:var(--forest);color:var(--ivory);width:56px;height:56px;box-shadow:var(--shadow);border:none;border-radius:999px;justify-content:center;align-items:center;transition:background .2s,transform .15s;display:inline-flex}.round-btn:hover{background:var(--emerald)}.round-btn:active{transform:scale(.98)}.round-btn.minus{color:var(--forest);width:48px;height:48px;box-shadow:none;background:0 0;border:1px solid #123c3240}.round-btn.minus:hover{background:#c6a45c14}.tracker-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;margin-bottom:8px;display:flex}.tracker-name{font-family:var(--serif);color:var(--emerald);margin:0;font-size:1.4rem;font-weight:600}.tracker-actions{flex-wrap:wrap;gap:6px;display:flex}.tracker-name-input{min-height:44px;color:var(--emerald);border:1px solid #123c3229;border-radius:10px;flex:200px;padding:10px 12px;font-family:inherit;font-size:1rem}.add-tracker-card{padding-top:16px;padding-bottom:16px}.add-form{flex-direction:column;gap:10px;display:flex}.add-input{min-height:48px;color:var(--emerald);border:1px solid #123c3229;border-radius:10px;padding:12px 14px;font-family:inherit;font-size:1rem}.primary-btn.danger{background:var(--red);color:#fff}.confirm-delete{background:#c85c5c14;border-radius:12px;margin-top:12px;padding:12px 14px}.page-head{margin-bottom:18px}.back-btn{color:var(--forest);background:0 0;border:1px solid #123c322e;border-radius:999px;align-items:center;gap:7px;min-height:44px;margin-bottom:14px;padding:9px 16px;font-size:.85rem;transition:border-color .2s,background .2s;display:inline-flex}.back-btn:hover{border-color:var(--gold);background:#c6a45c14}.page-title{font-family:var(--serif);margin:0;font-size:1.8rem;font-weight:600}.history-card{padding:6px 10px}.history-list{margin:0;padding:0;list-style:none}.history-item{cursor:pointer;border-bottom:1px solid #123c3212;border-radius:10px;justify-content:space-between;align-items:center;gap:12px;min-height:64px;padding:16px 12px;transition:background .2s;display:flex}.history-item:last-child{border-bottom:none}.history-item:hover{background:#c6a45c14}.history-date{font-weight:500}.history-sub{color:#123c3280;font-size:.8rem}.history-count{color:#123c328c;font-size:.9rem}.cigarettes-note{color:#123c32b3;margin:0;font-size:.95rem}.placeholder-card{text-align:center;padding:48px 24px}.placeholder-text{font-family:var(--serif);color:#123c3299;margin:0;font-size:1.6rem}.empty{color:#123c3280;margin:4px 0;font-size:.92rem}.ghost-btn,.primary-btn{border-radius:999px;min-height:46px;padding:11px 22px;font-size:.9rem;transition:background .2s,border-color .2s}.ghost-btn{color:var(--forest);background:0 0;border:1px solid #123c3233}.ghost-btn:hover{border-color:var(--gold)}.primary-btn{background:var(--forest);color:var(--ivory);border:none;font-weight:500}.primary-btn:hover{background:var(--emerald)}.page-sub{color:#123c328c;margin:6px 0 0;font-size:.9rem}.reminder-card{padding:18px 22px}.reminder-card.nearest{background-image:linear-gradient(#c6a45c12,#c6a45c12);box-shadow:0 10px 32px #c6a45c47}.reminder-text{color:var(--emerald);white-space:pre-wrap;margin:0 0 10px;font-size:1.05rem}.reminder-meta{color:var(--gold);font-variant-numeric:lining-nums;flex-wrap:wrap;align-items:center;gap:10px;font-size:.9rem;display:flex}.reminder-rel{align-items:center;gap:10px;display:inline-flex}.reminder-rel:before{content:"";background:#c6a45c99;border-radius:50%;width:5px;height:5px}.reminder-actions{flex-wrap:wrap;gap:8px;margin-top:16px;display:flex}.reminder-actions .ghost-btn{align-items:center;gap:7px;min-height:48px;padding:9px 16px;display:inline-flex}.reminder-form{flex-direction:column;gap:12px;display:flex}.reminder-input,.reminder-date-input{width:100%;min-height:48px;color:var(--emerald);background:#fff;border:1px solid #123c3229;border-radius:12px;padding:12px 14px;font-family:inherit;font-size:1rem;transition:border-color .2s}.reminder-date-input{font-variant-numeric:lining-nums}.reminder-input:focus,.reminder-date-input:focus{border-color:var(--gold);outline:none}.reminder-form-actions{justify-content:flex-end;gap:10px;display:flex}.reminder-form-actions .ghost-btn,.reminder-form-actions .primary-btn,.reminder-confirm .ghost-btn,.reminder-confirm .primary-btn{min-height:48px}.reminder-confirm{background:#123c320d;border-radius:12px;margin-top:14px;padding:12px 14px}.reminder-confirm p{color:var(--emerald);margin:0 0 10px;font-size:.95rem}.reminder-confirm .confirm-row{justify-content:flex-end;gap:10px;display:flex}.past-card{box-shadow:none;background:#123c3209}.past-toggle{color:#123c32b3;background:0 0;border:none;align-items:center;gap:10px;width:100%;min-height:48px;padding:4px 2px;font-size:.95rem;transition:color .2s;display:flex}.past-toggle:hover{color:var(--forest)}.past-count{color:#123c3273;font-variant-numeric:lining-nums;font-size:.85rem}.past-chevron{color:#123c3273;align-items:center;margin-left:auto;display:inline-flex}.past-list{margin:6px 0 0;padding:0;list-style:none}.past-item{border-top:1px solid #123c3212;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;min-height:54px;padding:10px 2px;display:flex}.past-info{min-width:0}.past-text{color:#123c32b8;font-size:.95rem}.past-date{color:#123c3273;font-variant-numeric:lining-nums;font-size:.82rem}.past-item .icon-btn{color:#123c3273;min-width:48px;min-height:48px}.past-item .icon-btn:hover{color:var(--forest);background:#123c320f}.past-confirm{flex-basis:100%;margin-top:6px}@media (width<=520px){.header-inner{padding:24px 16px 18px}.sync-status{top:24px;right:16px}.header h1{font-size:2rem}.main{padding:18px 12px 64px}.card{padding:16px}.nav button{flex:auto;justify-content:center}.edit-row{flex-wrap:wrap}.edit-row input{flex-basis:100%}}
