:root{font-family:'Noto Sans Thai',Tahoma,sans-serif;color:#172846;background:#f4f7fc;font-size:16px;--blue:#214ad8;--muted:#66748b;--line:#e3e9f3;--surface:#fff;--soft:#edf2ff}*{box-sizing:border-box}body{margin:0}button,input,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:default}button,a,input,textarea{ -webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #829cfa;outline-offset:3px}button{border:0;background:none;color:inherit}button,a{touch-action:manipulation}button{min-height:44px}h1,h2,h3,p{margin:0}h1{font-size:2rem;letter-spacing:-.04em;line-height:1.5}h2{font-size:1.125rem;font-weight:600}small,.small{font-size:.8125rem;line-height:1.7;color:var(--muted)}.muted{color:var(--muted)}[hidden]{display:none!important}.brand{display:flex;gap:12px;align-items:center;font-weight:700;font-size:1.4rem;letter-spacing:-.04em}.mark{display:grid;place-items:center;width:42px;height:42px;border-radius:13px;background:var(--blue);color:white;font-size:1.35rem;font-weight:700;letter-spacing:-.12em;padding-right:3px}.pill{display:inline-flex;align-items:center;border-radius:8px;background:var(--soft);color:#3553ae;font-size:.75rem;padding:5px 10px;letter-spacing:0;font-weight:500}.primary{background:var(--blue);color:white;border-radius:12px;padding:13px 22px;font-weight:600;transition:background .15s,transform .15s}.primary:hover{background:#1839ac}.secondary{border:1px solid var(--line);background:white;border-radius:12px;padding:10px 18px}.icon{width:20px;height:20px;display:inline-block;vertical-align:middle;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.login-shell{min-height:100svh;display:grid;grid-template-columns:1fr 1fr;max-width:1500px;margin:auto}.intro{padding:48px clamp(24px,5vw,86px);background:#eaf0ff;display:flex;flex-direction:column;justify-content:space-between;gap:50px}.intro-content{max-width:450px;margin:15px 0}.eyebrow{font-size:.8125rem;font-weight:600;letter-spacing:.16em;color:#516dab}.intro h1{font-size:clamp(2rem,3.5vw,3rem);line-height:1.5;margin:18px 0 22px;letter-spacing:-.045em}.intro h1 span{color:var(--blue)}.intro-copy{line-height:1.9;color:#526582}.journal-index{margin-top:40px;border-top:1px solid #cbd8f4}.index-row{padding:19px 0;border-bottom:1px solid #cbd8f4;display:flex;gap:20px;align-items:center}.index-row span{font-size:.8125rem;color:#5771ae;letter-spacing:.08em}.index-row p{font-weight:500}.intro footer{font-size:.75rem;letter-spacing:.15em;color:#5771ae}.login-side{padding:40px 32px;display:flex;align-items:center;justify-content:center;background:#fff}.login-box{width:100%;max-width:360px}.login-icon{width:64px;height:64px;display:grid;place-items:center;background:var(--soft);border-radius:20px;color:var(--blue);margin-bottom:26px}.login-icon .icon{width:32px;height:32px}.login-box h2{font-size:1.75rem;letter-spacing:-.03em;margin-bottom:10px}.login-box>p{line-height:1.8;color:var(--muted);margin-bottom:30px}.passkey{width:100%;display:flex;align-items:center;justify-content:center;gap:10px;background:#f1f4f9;border:1px solid #e4e9f2;color:#617087;border-radius:12px;padding:15px}.passkey-note{text-align:center;margin:9px 0 28px}.prototype-info{border-top:1px solid var(--line);padding-top:24px}.prototype-info p{font-size:.875rem;line-height:1.9;color:var(--muted);margin:12px 0 20px}.prototype-info .primary{width:100%}.login-foot{display:flex;align-items:center;gap:7px;justify-content:center;margin-top:24px}.login-foot .icon{width:15px;height:15px}.app-shell{display:grid;grid-template-columns:230px 1fr;min-height:100svh}.sidebar{padding:34px 24px;border-right:1px solid var(--line);background:white;display:flex;flex-direction:column;gap:36px}.sidebar .brand{font-size:1.3rem}.sidebar .mark{width:36px;height:36px;border-radius:11px}.nav-label{font-size:.75rem;letter-spacing:.08em;color:#8390a3;margin:0 12px 12px}.nav-current{display:flex;align-items:center;gap:12px;background:var(--soft);color:var(--blue);padding:12px 16px;border-radius:12px;font-weight:600;width:100%}.sidebar-bottom{margin-top:auto;padding-top:35px}.private-label{display:flex;align-items:center;gap:8px;font-size:.8125rem;color:var(--muted);padding:0 10px 14px}.back-login{width:100%;text-align:left;display:flex;gap:9px;align-items:center;padding:10px;color:var(--muted);font-size:.875rem;border-top:1px solid var(--line)}.main{min-width:0;padding:30px clamp(22px,4.5vw,76px) 45px;max-width:1300px;width:100%;margin:auto}.topline{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:34px}.topline .small{font-size:.75rem}.mobile-brand{display:none}.intro-day{display:flex;justify-content:space-between;align-items:flex-end;gap:18px}.date-text{font-size:.875rem;color:var(--muted);margin-top:4px}.date-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.date-input{width:153px;font-size:.875rem;padding:8px;border:1px solid var(--line);border-radius:9px;background:white;color:#465773;min-height:44px}.today-button{font-size:.875rem;padding:8px 14px;border:1px solid var(--line);background:white;border-radius:9px}.week{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:9px;margin:26px 0}.day{padding:10px 3px;border-radius:13px;color:#5b6b86;display:flex;flex-direction:column;align-items:center;gap:4px}.day:hover{background:#e9effb}.day .number{font-size:1.25rem;font-weight:600;line-height:1.4}.day .weekday{font-size:.8125rem}.day .day-dot{height:4px;width:4px;border-radius:100%;background:transparent}.day.has-entry .day-dot{background:#667aaf}.day[aria-pressed=true]{background:var(--blue);color:#fff;box-shadow:0 5px 12px #214ad81a}.day[aria-pressed=true] .day-dot{background:currentColor}.panel{background:white;border:1px solid var(--line);border-radius:18px;padding:25px 28px}.panel-head{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:14px}.title-icon{display:flex;align-items:center;gap:10px}.title-icon>.icon{color:var(--blue)}.count{font-size:.8125rem;color:var(--muted);white-space:nowrap}.task-progress{height:4px;border-radius:4px;background:#edf1f8;margin-bottom:15px;overflow:hidden}.task-progress>div{height:100%;background:var(--blue);transition:width .2s;border-radius:4px}.task-list{list-style:none;padding:0;margin:0}.task-row{display:flex;align-items:center;gap:12px;border-bottom:1px solid #edf1f7;min-height:60px;padding:7px 0}.task-check{appearance:none;width:22px;height:22px;min-width:22px;border:1.5px solid #bfcae0;border-radius:7px;margin:11px 0;cursor:pointer;display:grid;place-content:center}.task-check:checked{background:var(--blue);border-color:var(--blue)}.task-check:checked:after{content:'✓';color:white;font-size:15px}.task-title{border:0;background:transparent;min-width:0;flex:1;width:100%;color:#253856;padding:10px 0}.task-row.done .task-title{text-decoration:line-through;color:#8290a5}.task-actions{display:flex;align-items:center;gap:1px}.task-action{color:#64738b;padding:8px;min-width:36px;border-radius:8px;font-size:.75rem}.task-action:hover{background:var(--soft);color:var(--blue)}.task-action .icon{height:17px;width:17px}.task-add{display:flex;gap:9px;margin-top:18px}.task-add input{flex:1;min-width:0;border:1px solid var(--line);border-radius:11px;padding:11px 14px;background:#fafbfe;color:#253856}.task-add button{padding:10px 17px;border-radius:11px}.empty{padding:22px 8px 14px;text-align:center;color:#7a879c;font-size:.875rem;line-height:1.8}.mood-panel{display:flex;justify-content:space-between;align-items:center;gap:20px;margin:18px 0}.mood-intro p{font-size:.8125rem;color:var(--muted);margin-top:5px}.moods{display:flex;gap:6px}.mood{min-width:64px;padding:6px;border:1px solid transparent;border-radius:12px;display:flex;flex-direction:column;align-items:center;gap:3px}.mood .emoji{font-size:1.6rem;line-height:1.5}.mood .mood-name{font-size:.75rem;color:#64738b}.mood:hover{background:#f4f7ff}.mood[aria-pressed=true]{background:var(--soft);border-color:#adc0ff}.mood[aria-pressed=true] .mood-name{color:var(--blue)}.reflection-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.reflection-grid .panel{padding-bottom:18px}.section-num{font-family:Georgia,serif;font-style:italic;color:#7f96c6;font-size:1.125rem}.reflection-head{display:flex;align-items:center;gap:10px;margin-bottom:15px}.reflection textarea{width:100%;border:0;resize:vertical;min-height:116px;padding:3px 0;line-height:1.95;color:#253856;background:repeating-linear-gradient(transparent,transparent calc(1.95em - 1px),#edf1f7 calc(1.95em - 1px),#edf1f7 1.95em)}textarea::placeholder,input::placeholder{color:#8290a6;opacity:1}.tomorrow{margin-top:18px;display:flex;align-items:flex-start;gap:20px}.tomorrow .title-icon{padding-top:12px;flex-shrink:0}.tomorrow input{min-width:0;flex:1;padding:12px 0;border:0;border-bottom:1px solid var(--line);color:#253856;background:transparent}.page-foot{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:25px 2px 0;font-size:.75rem;color:var(--muted)}.mobile-back{display:none}.notice{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#172846;color:white;border-radius:12px;padding:12px 20px;box-shadow:0 6px 20px #17284633;max-width:calc(100vw - 32px);font-size:.875rem;z-index:10}.prototype-banner{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.demo-state{color:#65738a;font-size:.75rem}
@media(min-width:1500px){.login-shell{min-height:850px;margin:40px auto;border:1px solid var(--line);border-radius:24px;overflow:hidden}}
@media(max-width:1100px){.app-shell{grid-template-columns:190px 1fr}.sidebar{padding:30px 18px}.main{padding-left:26px;padding-right:26px}.panel{padding:22px}.mood-panel{align-items:flex-start;flex-direction:column;gap:14px}.moods{justify-content:space-between;width:100%}.mood{flex:1}}
@media(max-width:760px){.login-shell{display:block}.intro{padding:26px 24px 30px;gap:0}.intro-content{margin:32px 0 0}.intro h1{font-size:1.8rem;margin:0 0 10px}.intro h1 br{display:none}.intro h1 span:before{content:' '}.intro-copy{font-size:.875rem}.eyebrow,.journal-index,.intro footer{display:none}.login-side{padding:32px 24px 42px}.login-box{max-width:440px}.login-icon{display:none}.login-box h2{font-size:1.5rem}.login-box>p{margin-bottom:23px}.app-shell{display:block}.sidebar{display:none}.main{padding:21px 20px 28px;margin:0}.mobile-brand{display:flex;font-size:1.125rem;gap:9px}.mobile-brand .mark{width:32px;height:32px;font-size:1.1rem;border-radius:10px}.topline{margin-bottom:25px;flex-wrap:wrap;gap:16px}.topline>.small{display:none}.prototype-banner{margin-left:auto}.prototype-banner .demo-state{display:none}.intro-day{align-items:flex-start;flex-wrap:wrap;gap:16px}h1{font-size:1.75rem}.date-actions{margin-top:0}.week{gap:4px;margin:20px 0}.day{border-radius:10px;padding:8px 2px}.day .number{font-size:1.125rem}.day .weekday{font-size:.75rem}.panel{padding:20px;border-radius:15px}.panel-head{gap:8px}.reflection-grid{grid-template-columns:1fr;gap:14px}.mood-panel{margin:14px 0}.moods{gap:2px}.mood{min-width:0;padding:5px 2px}.mood .mood-name{font-size:.6875rem}.mood .emoji{font-size:1.4rem}.tomorrow{margin-top:14px;display:block}.tomorrow .title-icon{padding:0}.tomorrow input{width:100%;margin-top:8px}.page-foot{display:block;line-height:1.9;padding-top:18px}.page-foot>span{display:block}.mobile-back{display:block;color:var(--muted);text-align:center;width:100%;margin-top:14px;font-size:.875rem}.task-action{min-width:30px;padding:6px}.task-row{gap:9px}.task-action.move{font-size:0}.task-action.move:after{content:'พรุ่งนี้';font-size:.6875rem}.task-add input{padding:10px;max-width:100%}.task-add button{padding:10px 13px}.count{font-size:.75rem}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}