:root{--ink:#27342f;--muted:#718078;--cream:#f3efe7;--paper:#fffdf8;--green:#315c4b;--line:#dfe2d9;--orange:#ee906f;--blue:#88afc9;--yellow:#f6da84;--shadow:0 18px 50px rgba(46,61,51,.09)}
*{box-sizing:border-box}body{margin:0;background:#d8d3ca;color:var(--ink);font-family:"Anuphan",sans-serif}.dashboard{width:min(100%,700px);min-height:100vh;margin:auto;background:var(--cream);overflow:hidden;box-shadow:0 0 70px rgba(30,38,33,.18)}
.topbar{display:flex;justify-content:space-between;align-items:center;padding:44px 38px 26px}.eyebrow,.kicker{margin:0 0 7px;font:700 11px/1 "DM Sans";letter-spacing:.18em;color:#9a6d52}.topbar h1{margin:0;font-size:26px;line-height:1.25}.topbar h1 span{color:#cf6f65}.today{margin:6px 0 0;color:var(--muted);font-size:14px}.weather{display:flex;align-items:center;gap:10px;background:var(--paper);border:1px solid #e5e0d5;border-radius:22px;padding:10px 14px;box-shadow:var(--shadow)}.weather-icon{font-size:26px;color:#eaa84d}.weather strong,.weather small{display:block}.weather strong{font:700 20px "DM Sans"}.weather small{font-size:10px;color:var(--muted)}
.hero-card{margin:0 26px 22px;padding:28px 26px;min-height:168px;border-radius:30px;background:var(--green);color:white;display:flex;align-items:center;justify-content:space-between;box-shadow:0 18px 40px rgba(49,92,75,.2);position:relative;overflow:hidden}.hero-card:after{content:"";position:absolute;width:210px;height:210px;border:35px solid rgba(255,255,255,.04);border-radius:50%;right:-70px;top:-70px}.hero-copy{position:relative;z-index:1}.hero-copy>p{margin:0 0 10px;font-size:12px;color:#cde0d7}.live-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#f8c96d;margin-right:7px;box-shadow:0 0 0 5px rgba(248,201,109,.12)}.hero-copy h2{font-size:23px;margin:0 0 15px}.event-meta{display:flex;gap:17px;font-size:12px;color:#e3eee9}.date-tile{position:relative;z-index:1;min-width:88px;background:#fff;color:var(--ink);border-radius:20px;padding:13px;text-align:center;transform:rotate(2deg)}.date-tile span,.date-tile small{display:block;font:700 10px "DM Sans";letter-spacing:.15em;color:#bd654e}.date-tile strong{display:block;font:700 38px "DM Sans";line-height:1.05}.date-tile small{color:var(--muted)}
.panel{margin:0 26px 22px;padding:28px;border-radius:28px;background:var(--paper);border:1px solid #e5e0d7;box-shadow:var(--shadow)}.section-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.section-heading h2{font-size:22px;margin:0}.outline-button{border:1px solid #b6c3bd;background:transparent;color:var(--green);border-radius:18px;padding:9px 13px;font:600 11px "Anuphan";cursor:pointer}.timeline{position:relative}.timeline:before{content:"";position:absolute;left:55px;top:20px;bottom:20px;border-left:1px dashed #cfd7d1}.event{display:grid;grid-template-columns:44px 5px 1fr 38px;gap:12px;align-items:center;padding:13px 0}.event:after{content:"";grid-column:2;grid-row:1;width:7px;height:7px;border-radius:50%;background:currentColor;margin-left:-1px}.event time{font:600 12px "DM Sans"}.event div{grid-column:3}.event h3{font-size:15px;margin:0 0 3px}.event p{font-size:11px;color:var(--muted);margin:0}.event.amber{color:#d6923d}.event.blue{color:#6596b5}.event.green{color:#69916f}.event h3{color:var(--ink)}.avatar{grid-column:4;grid-row:1;width:34px;height:34px;display:grid;place-items:center;border-radius:50%;font-weight:700;color:white}.coral{background:#df806b}.blue-bg{background:#7fa7c3}.green-bg{background:#71987a}.text-button{border:0;background:transparent;color:var(--green);font:700 12px "Anuphan";margin:10px 0 0 72px;cursor:pointer}.text-button span{font-size:16px;margin-left:5px}
.progress-label{font-size:11px;color:var(--muted)}.progress-label b{color:var(--green)}.progress{height:5px;background:#e7e9e2;border-radius:99px;overflow:hidden;margin:-8px 0 16px}.progress i{display:block;width:40%;height:100%;background:#e8a366;border-radius:inherit;transition:.25s}.tasks{display:grid}.task{display:grid;grid-template-columns:26px 1fr 28px;align-items:center;gap:12px;padding:13px 0;border-bottom:1px solid #ecebe5;cursor:pointer}.task input{position:absolute;opacity:0}.check{width:22px;height:22px;border:1.5px solid #afbab3;border-radius:7px;display:grid;place-items:center}.task input:checked+.check{background:var(--green);border-color:var(--green)}.task input:checked+.check:after{content:"✓";color:#fff;font-size:13px}.task b,.task small{display:block}.task b{font-size:14px}.task small{font-size:10px;color:var(--muted);margin-top:3px}.task em{font-style:normal;font-size:18px}.task.done b{text-decoration:line-through;color:#87928c}.add-button{width:100%;border:0;background:#e9eee9;color:var(--green);border-radius:15px;padding:12px;font:700 12px "Anuphan";margin-top:16px;cursor:pointer}
.notes-section{background:#304d43;color:white;padding:34px 26px 38px}.section-heading.light .kicker{color:#9bc0b0}.circle-button{width:38px;height:38px;border:1px solid #6c857c;border-radius:50%;background:transparent;color:white;font-size:20px;cursor:pointer}.notes-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.note{min-height:150px;padding:19px 18px;color:#3c423f;box-shadow:0 12px 25px rgba(0,0,0,.13);transform:rotate(-1deg);position:relative}.note:nth-child(even){transform:rotate(1.5deg)}.note:before{content:"";position:absolute;width:45px;height:13px;background:rgba(255,255,255,.32);left:calc(50% - 22px);top:-6px;transform:rotate(-3deg)}.note>span{font-size:17px}.note p{font-size:14px;line-height:1.55;margin:12px 0 20px}.note small{position:absolute;bottom:14px;font-size:9px;color:#6d726f}.yellow{background:#f2d983}.pink{background:#eeb8ae}.mint{background:#b8d6c5}.lilac{background:#c9c4dc}
footer{display:flex;align-items:center;gap:12px;background:#243d35;color:white;padding:18px 30px}.home-mark{width:32px;height:32px;border-radius:10px;background:#d28b6f;display:grid;place-items:center}footer p{margin:0;flex:1}footer b,footer small{display:block}footer b{font-size:12px}footer small{font-size:9px;color:#92aaa1}.sync{font-size:10px;color:#a8c0b7}
dialog{border:0;border-radius:24px;padding:0;box-shadow:0 25px 80px rgba(0,0,0,.28);width:min(90vw,420px)}dialog::backdrop{background:rgba(27,40,34,.55)}dialog form{padding:28px;position:relative}dialog h2{margin:0 0 18px;font-size:21px}.close{position:absolute;right:18px;top:15px;border:0;background:none;font-size:24px;color:#718078;cursor:pointer}dialog input{width:100%;border:1px solid #d7ddd8;border-radius:14px;padding:13px;font:500 14px "Anuphan";outline:none}
@media(max-width:520px){.topbar{padding:30px 22px 20px}.topbar h1{font-size:21px}.weather{padding:8px 10px}.hero-card,.panel{margin-left:14px;margin-right:14px}.hero-card{padding:24px 20px}.date-tile{min-width:72px}.event-meta{display:grid;gap:4px}.notes-section{padding-left:18px;padding-right:18px}}

/* App interactions */
button,input,textarea{font-family:inherit}.hidden{display:none!important}.status-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#d69a5b;margin-right:5px}.status-dot.online{background:#61a477}.status-dot.offline{background:#cf7066}.empty-state{border:1px dashed #cfd7d1;border-radius:18px;padding:22px;text-align:center;color:var(--muted)}.empty-state b,.empty-state span{display:block}.empty-state b{color:var(--ink);font-size:14px}.empty-state span{font-size:11px;line-height:1.6;margin-top:5px}.filter-row{display:flex;gap:7px;margin:5px 0 8px}.filter{border:0;border-radius:99px;padding:7px 12px;background:#edf0ea;color:#718078;font-size:10px;font-weight:700;cursor:pointer}.filter.active{background:var(--green);color:white}.task{grid-template-columns:26px 1fr 28px 30px}.task>label{display:grid}.task-menu,.note-menu{border:0;background:transparent;color:#6f7d76;font-size:20px;cursor:pointer;border-radius:9px;min-width:32px;min-height:32px}.task-menu:hover,.task-menu:focus,.note-menu:hover,.note-menu:focus{background:rgba(49,92,75,.1)}.task-empty{padding:24px 10px;text-align:center;color:var(--muted);font-size:12px}.note-menu{position:absolute;right:8px;top:8px;color:#4d5954}.note.pinned:after{content:"●";position:absolute;right:18px;bottom:13px;font-size:8px;color:#cd6c5c}.note{cursor:pointer}.note p{padding-right:15px}.footer-button{border:1px solid #60776f;background:transparent;color:#d7e2dd;border-radius:12px;padding:8px 10px;font-size:10px;cursor:pointer}
dialog form{padding:28px;position:relative}.field{display:block;margin:13px 0}.field>span,.colors legend{display:block;color:#68766f;font-size:11px;font-weight:700;margin-bottom:6px}.field input,.field textarea{width:100%;border:1px solid #d7ddd8;border-radius:13px;padding:11px;font-size:14px;outline:none}.field textarea{min-height:90px;resize:vertical}.colors{border:0;padding:0;margin:14px 0}.colors label{display:inline-block;margin-right:8px}.colors input{position:absolute;opacity:0}.colors i{display:block;width:32px;height:32px;border-radius:50%;border:3px solid white;box-shadow:0 0 0 1px #c9d0cb}.colors input:checked+i{box-shadow:0 0 0 3px var(--green)}.modal-actions{display:flex;gap:10px;margin-top:18px}.save-button,.danger-button{border:0;border-radius:14px;padding:12px 18px;font-weight:700;cursor:pointer}.save-button{background:var(--green);color:white;flex:1}.danger-button{background:#f6e2df;color:#a64f48}.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,120px);background:#223b33;color:white;padding:11px 18px;border-radius:99px;box-shadow:0 12px 35px rgba(0,0,0,.25);font-size:12px;z-index:50;transition:.25s}.toast.show{transform:translate(-50%,0)}
@media(display-mode:standalone){.footer-button{display:none}}@media(max-width:420px){.topbar{align-items:flex-start}.weather small{display:none}.notes-grid{grid-template-columns:1fr}.note{min-height:135px}.panel{padding:23px 20px}.outline-button{max-width:145px}.hero-copy h2{font-size:19px}}
