@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Thai:wght@400;500;600;700&display=swap');
:root{font-family:'IBM Plex Sans Thai',sans-serif;color:#243c35;background:#f5f6f2;font-synthesis:none;--line:#dce3da;--muted:#7c8981;--panel:#ffffff80}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(ellipse at 80% 28%,#dfebda95,transparent 52%),radial-gradient(ellipse at 9% 70%,#f1e9d980,transparent 50%);padding:0 6vw 125px}button,input,textarea,select{font:inherit}button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer;color:inherit}button:focus-visible,a:focus-visible{outline:3px solid #7b9d8a;outline-offset:5px}button{border:0}header{height:100px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);max-width:1250px;margin:auto}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit;font-weight:700;font-size:24px;letter-spacing:-1px}.brand-icon{background:#304e40;color:#fff;width:36px;height:36px;border-radius:12px;text-align:center;font-size:29px;line-height:32px}.personal{font-size:10px;color:var(--muted);letter-spacing:2px;margin-left:14px;font-weight:500}.avatar{width:38px;height:38px;border:5px solid #fff;border-radius:50%;background:#e1e8d7;font-weight:600;box-shadow:0 2px 8px #1e3c3510}main{max-width:1100px;margin:auto}.welcome{display:flex;justify-content:space-between;align-items:center;padding:61px 0 44px}.eyebrow,.small-label{font-size:10px;letter-spacing:2.3px;color:#82917f;font-weight:600}h1{font-size:48px;line-height:1.35;letter-spacing:-1.5px;margin:13px 0}h1 span{color:#83977b}.welcome p{font-size:14px;color:var(--muted);margin-bottom:0}.clock-widget{padding:25px 33px;border:1px solid #ffffffc0;background:#ffffff55;border-radius:25px;min-width:260px;display:flex;flex-direction:column;align-items:center;box-shadow:0 10px 35px #53634f04}.clock-widget>span:first-child{font-size:12px;color:#6f8072}.clock-widget strong{font:500 66px/1.4 'IBM Plex Sans Thai',sans-serif;letter-spacing:-3px}.clock-caption{font-size:10px;color:#869181}i{display:inline-block;width:5px;height:5px;border-radius:50%;background:#8da27b;margin-right:6px}.workspace{border-top:1px solid var(--line);padding-top:22px}.section-top{display:flex;align-items:center;justify-content:space-between;gap:20px}.tabs{display:flex;gap:25px}.tabs button{background:none;color:#91a092;font-size:13px;padding:8px 0}.tabs button.active{color:#314a3c;font-weight:600}.tabs span{margin-left:7px;color:#a3ae9e}.search{display:flex;align-items:center;gap:9px;border:1px solid #e0e6dc;background:#ffffff80;padding:8px 12px;border-radius:10px}.search>span{font-size:22px;line-height:1}.search input{width:170px;background:none;border:0;outline:none;font-size:11px;color:inherit}.search kbd{border:1px solid #e0e5dc;border-radius:4px;padding:0 5px;font-size:10px;color:#a0aa9b}.app-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:30px 20px;padding:40px 0 43px}.app-tile{position:relative;text-align:center}.app-button{background:none;display:flex;flex-direction:column;align-items:center;width:100%;padding:0;gap:12px}.app-icon{width:76px;height:76px;display:grid;place-items:center;border-radius:23px;font-size:37px;box-shadow:0 7px 12px #23332710,inset 0 1px 1px #ffffff95;transition:transform .2s}.app-button:hover .app-icon{transform:translateY(-5px)}.app-name{font-size:12px;font-weight:500}.app-description{font-size:10px;color:#91a08f;margin-top:3px}.yellow{background:linear-gradient(145deg,#f9dfa0,#edc967);color:#fffaf1}.blue{background:linear-gradient(145deg,#91b6d0,#658da9);color:#fff}.dark{background:linear-gradient(145deg,#6d7f77,#42574f);color:#fff}.green{background:linear-gradient(145deg,#adc6a4,#7f9e73);color:#fff}.purple{background:linear-gradient(145deg,#c1afd1,#9986ac);color:#fff}.gray{background:linear-gradient(145deg,#d9ddd7,#a6b0a7);color:#fff}.add-icon{border:1px dashed #becbbb;background:#ffffff30;color:#94a28e;box-shadow:none}.favorite-toggle{position:absolute;top:-9px;right:20px;background:transparent;color:#81936b;font-size:15px;padding:3px}.bottom-row{display:grid;grid-template-columns:1.05fr 1fr;gap:22px;margin-top:8px}.note-card,.build-card{border:1px solid #e0e6d9;border-radius:18px;padding:25px 28px;position:relative;overflow:hidden}.note-card{background:#eaf0df70}.note-card h2{font-size:17px;margin:12px 0 5px}.note-card p,.build-card p{font-size:11px;color:#84907b;margin:0}.note-card button{background:none;padding:0;margin-top:23px;font-size:11px}.note-card button span{margin-left:20px}.note-art{position:absolute;right:26px;bottom:24px;font-size:90px;color:#bdcba4;line-height:1;transform:rotate(-12deg)}.build-card{display:flex;gap:18px;align-items:center;background:#ffffff30}.build-symbol{background:#e9eee5;border-radius:15px;width:50px;height:50px;display:grid;place-items:center;font-size:28px;color:#87967d;flex-shrink:0}.build-card h2{font-size:14px;font-weight:500;margin:0 0 7px}.build-card button{background:none;margin-left:auto;font-size:20px}footer{display:flex;justify-content:space-between;color:#9aa593;font-size:9px;margin:27px 0;letter-spacing:.3px}.dock{position:fixed;z-index:5;bottom:max(22px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:16px;border-radius:24px;padding:12px 17px;border:1px solid #fff;background:#ffffffb8;backdrop-filter:blur(20px);box-shadow:0 8px 35px #2a423314}.dock button{width:43px;height:43px;border-radius:13px;font-size:26px}.dock-home{background:#e4eadf}.dock-divider{height:26px;width:1px;background:#dde3d8}.dock-add{background:transparent;color:#7b8c73}.dock button:hover{transform:translateY(-3px)}dialog{border:1px solid #e1e8dd;border-radius:24px;width:min(560px,calc(100% - 28px));max-height:85dvh;padding:25px;color:#243c35;background:#fafbf8;box-shadow:0 25px 90px #122a3430}dialog::backdrop{background:#263e3855;backdrop-filter:blur(7px)}.window-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.window-top h2{margin:0;font-size:22px}.window-top button{width:32px;height:32px;border-radius:50%;background:#e9eee5}.field{display:block;width:100%;border:1px solid #d5dfd2;border-radius:10px;background:#fff;padding:12px;color:inherit;margin:8px 0 17px}.primary{background:#355844;color:white;padding:11px 18px;border-radius:10px}.muted{color:#7e8d7b;font-size:12px}.row{display:flex;gap:10px;align-items:center}.row .field{margin:0;min-width:0}.task-row{display:flex;align-items:center;gap:10px;padding:13px 0;border-bottom:1px solid #e3e8df}.task-row span{flex:1;overflow-wrap:anywhere}.task-row.done span{text-decoration:line-through;color:#8c9987}.task-row button{background:none;color:#899280}.task-row input{width:18px;height:18px;accent-color:#507455}textarea{min-height:240px;resize:vertical}#calculator-display{display:block;padding:22px;text-align:right;background:#e9eee5;border-radius:12px;font-size:32px;overflow-wrap:anywhere}.calc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin-top:15px}.calc-grid button{padding:16px;border-radius:11px;background:#e8eee4;font-size:20px}.calc-grid button.operator{background:#cdddc5}.setting-row{display:flex;gap:12px;margin:14px 0;align-items:center}.setting-row button{padding:9px 15px;border-radius:9px;background:#e1e9db}.link-row{display:flex;justify-content:space-between;gap:10px;margin:12px 0}.link-row button{background:none;color:#9c645b}#toast{position:fixed;bottom:105px;left:50%;transform:translateX(-50%);background:#344f40;color:white;border-radius:10px;padding:10px 20px;font-size:12px;z-index:20;display:none}body.sand{background:radial-gradient(ellipse at 80% 25%,#efdfc9,transparent 60%),#f7f3eb}body.blue-theme{background:radial-gradient(ellipse at 80% 25%,#d4e3ef,transparent 60%),#f1f5f8}#empty{padding:50px;text-align:center;color:#7b8975}
@media(min-width:1500px){.welcome{padding-top:85px}.app-grid{padding-top:50px;padding-bottom:60px}}@media(max-width:760px){body{padding:0 24px 120px}header{height:78px}.personal{display:none}.welcome{padding:34px 0;gap:20px}h1{font-size:36px}.clock-widget{min-width:185px;padding:19px 15px}.clock-widget strong{font-size:48px}.clock-caption{font-size:8px}.app-grid{grid-template-columns:repeat(4,1fr);gap:30px 12px}.bottom-row{grid-template-columns:1fr}.build-card{min-height:120px}.favorite-toggle{right:6px}footer span:last-child{display:none}.search input{width:130px}.tabs{gap:15px}.tabs button{font-size:11px}}@media(max-width:480px){body{padding-left:20px;padding-right:20px}.welcome{align-items:flex-start;position:relative;padding:32px 0 30px}h1{font-size:33px}.eyebrow{font-size:8px;letter-spacing:1.4px}.welcome p{font-size:11px}.clock-widget{min-width:0;width:120px;padding:15px 8px;margin-top:20px;border-radius:18px}.clock-widget strong{font-size:36px;letter-spacing:-1.5px}.clock-widget>span:first-child{font-size:9px}.clock-caption{display:none}.section-top{flex-wrap:wrap;gap:13px}.search{width:100%}.search input{flex:1}.app-grid{gap:28px 8px;padding:30px 0}.app-icon{width:59px;height:59px;border-radius:18px;font-size:29px}.app-name{font-size:10px}.app-description{display:none}.favorite-toggle{top:-12px;right:-3px}.note-card{padding:24px}.note-card h2{font-size:16px}.build-card{padding:20px 18px;gap:12px}.build-card p{font-size:10px}footer{gap:15px;font-size:8px}.dock{gap:13px;padding:10px 14px;bottom:18px}.dock button{width:40px;height:40px}.note-art{font-size:75px;right:15px}}
.mortgage-window{width:min(850px,calc(100% - 28px))}.mortgage-fields{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}.mortgage-fields label{font-size:13px}.mortgage-highlight{background:#355844;color:#fff;border-radius:16px;padding:22px;margin:22px 0 14px;display:grid;gap:6px}.mortgage-highlight strong{font-size:30px}.mortgage-highlight small{opacity:.85}.mortgage-savings{display:grid;grid-template-columns:1fr 1fr;gap:12px}.mortgage-savings>div{padding:17px;background:#e8efdf;border-radius:12px;font-size:13px}.mortgage-savings strong{display:block;font-size:20px;margin-top:6px}.mortgage-table-wrap{overflow:auto;margin:20px 0}.mortgage-table-wrap table{border-collapse:collapse;width:100%;font-size:12px;white-space:nowrap}.mortgage-table-wrap caption{text-align:left;font-size:15px;font-weight:600;margin-bottom:10px}.mortgage-table-wrap th,.mortgage-table-wrap td{padding:12px;text-align:right;border-bottom:1px solid #dce3da}.mortgage-table-wrap th:first-child{text-align:left}.mortgage-table-wrap thead{background:#e8eee4}.mortgage-schedule{max-height:360px}.mortgage-schedule thead{position:sticky;top:0}.mortgage-error{color:#aa3737;font-size:13px}.mortgage-window summary{cursor:pointer;padding:12px 0}@media(max-width:480px){.mortgage-fields{grid-template-columns:1fr}.mortgage-savings{grid-template-columns:1fr}.mortgage-highlight strong{font-size:25px}.dock{gap:9px;padding:10px}.mortgage-window{padding:18px}}