html,body,#root{margin:0;height:100%;overflow:hidden;background:#0e0e10;color-scheme:dark}*{box-sizing:border-box}textarea,input,button{font-family:inherit}textarea::placeholder,input::placeholder{color:#ebebf547}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:#ffffff24;border-radius:4px}::-webkit-scrollbar-track{background:transparent}button{cursor:default}@keyframes cardIn{0%{opacity:0;transform:translateY(28px) scale(.97)}to{opacity:1;transform:none}}@keyframes pop{0%{transform:scale(.55)}60%{transform:scale(1.22)}to{transform:scale(1)}}@keyframes popB{0%{transform:scale(.55)}60%{transform:scale(1.22)}to{transform:scale(1)}}@keyframes fadeUp{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@keyframes toastIn{0%{opacity:0;transform:translate(-50%,14px) scale(.96)}to{opacity:1;transform:translate(-50%)}}@keyframes dash{to{stroke-dashoffset:-38}}.shell{position:fixed;top:0;right:0;bottom:0;left:0;padding:16px;display:flex;font-family:-apple-system,BlinkMacSystemFont,SF Pro Text,Helvetica Neue,Segoe UI,Roboto,Noto Sans Thai,sans-serif;color:#ffffffeb;-webkit-font-smoothing:antialiased}.window{position:relative;flex:1;min-width:0;display:flex;border-radius:16px;overflow:hidden;background:#18181b;box-shadow:0 0 0 .5px #ffffff24,0 0 0 1px #0009,0 24px 70px #0009}.lights{display:flex;gap:8px}.lights i{width:12px;height:12px;border-radius:50%}.lights i:nth-child(1){background:#ff5f57}.lights i:nth-child(2){background:#febc2e}.lights i:nth-child(3){background:#28c840}.sidebar{flex:none;width:304px;display:flex;flex-direction:column;background:#1f1f24;border-right:.5px solid rgba(255,255,255,.08)}.side-top{height:64px;flex:none;display:flex;align-items:center;padding:0 20px}.side-scroll{flex:1;min-height:0;overflow-y:auto;padding:4px 12px 12px;display:flex;flex-direction:column;gap:14px}.side-card{flex:none;background:#26262c;border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:10px;box-shadow:inset 0 0 0 .5px #ffffff0f}.side-card.study{gap:12px}.side-head{display:flex;justify-content:space-between;align-items:baseline}.side-title{font-size:15px;font-weight:600;color:#ebebf5cc}.side-pct{font-size:30px;font-weight:700;letter-spacing:-.6px;font-variant-numeric:tabular-nums}.side-now{font-size:13px;color:#ebebf5ad}.minis{display:flex;gap:3px}.minis div{flex:1;height:8px;border-radius:3px;transition:background .35s ease}.tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.tile{background:#ffffff0d;border-radius:10px;padding:8px 10px;display:flex;flex-direction:column;gap:1px}.tile b{font-size:21px;font-weight:700;font-variant-numeric:tabular-nums}.tile span{font-size:13px;color:#ebebf5ad}.start-row{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:14px;color:#ebebf5bf}.start-row input{background:#ffffff12;border:none;border-radius:6px;padding:7px 10px;font-size:14px;color:#ffffffe6;outline:none;color-scheme:dark}.subject{display:flex;align-items:center;gap:10px}.subject-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}.subject-name{font-size:17px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.subject-sub{font-size:13px;color:#ebebf5ad}.plus-hour{flex:none;height:46px;padding:0 16px;border:none;border-radius:12px;background:#c3baff;background:oklch(.82 .14 290);color:#201642;font-size:18px;font-weight:800;white-space:nowrap;transition:background .2s ease,transform .12s ease}.plus-hour:hover{background:#d0c9ff;background:oklch(.86 .12 290)}.plus-hour:active{transform:scale(.9)}.subject-x{flex:none;width:28px;height:28px;border:none;border-radius:8px;background:transparent;color:#ebebf573;font-size:18px;line-height:1;padding:0}.subject-x:hover{color:#ffffffe6;background:#ffffff14}.subject-add{border:none;border-radius:10px;background:#ffffff0f;outline:none;font-size:15px;padding:11px 12px;color:#ffffffe6;user-select:text;-webkit-user-select:text;width:100%}.month-group{flex:none;display:flex;flex-direction:column;gap:1px}.month-head{display:flex;justify-content:space-between;align-items:center;padding:4px 10px 8px;font-size:13px;font-weight:700;letter-spacing:.3px}.month-head>span:first-child{display:flex;align-items:center;gap:7px}.month-head>span:first-child i{width:8px;height:8px;border-radius:50%;background:currentColor}.month-head>span:last-child{color:#ebebf59e;font-weight:500}.week-row{position:relative;display:flex;align-items:center;gap:9px;height:44px;padding:0 10px;border-radius:10px;transition:background .2s ease}.week-row:hover:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:10px;background:#ffffff0f;pointer-events:none}.week-mark{flex:none;width:20px;height:20px;border-radius:50%;border-width:2px;border-style:solid;color:#111;font-size:12px;font-weight:800;display:grid;place-items:center;line-height:1}.week-title{flex:1;min-width:0;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.week-date{flex:none;font-size:13px;color:#ebebf594;font-variant-numeric:tabular-nums}.side-foot{flex:none;padding:10px 12px 14px;border-top:.5px solid rgba(255,255,255,.08);display:flex;gap:6px}.foot-primary,.foot-btn{height:44px;border:none;border-radius:8px;font-size:15px;white-space:nowrap;transition:background .2s ease,transform .12s ease}.foot-primary{flex:1;background:#c3baff;background:oklch(.82 .14 290);color:#221844;font-weight:600}.foot-primary:hover{background:#d0c9ff;background:oklch(.86 .12 290)}.foot-btn{flex:none;padding:0 12px;background:#ffffff12;color:#ebebf5bf}.foot-btn:hover{background:#ffffff1f}.foot-primary:active,.foot-btn:active{transform:scale(.94)}.main{flex:1;min-width:0;display:flex;flex-direction:column;position:relative}.toolbar{height:64px;flex:none;display:flex;align-items:center;gap:14px;padding:0 18px;background:#1b1b1f;border-bottom:.5px solid rgba(255,255,255,.08);z-index:5}.toolbar .lights{margin:0 4px}.side-toggle{flex:none;width:42px;height:40px;border:none;border-radius:6px;background:transparent;display:grid;place-items:center;padding:0}.side-toggle:hover{background:#ffffff14}.side-toggle>span{width:22px;height:17px;border:1.5px solid rgba(235,235,245,.75);border-radius:3px;display:flex}.side-toggle>span>span{width:6px;height:100%;border-right:1.5px solid rgba(235,235,245,.75)}.tb-title{display:flex;flex-direction:column;min-width:0;flex-shrink:1;overflow:hidden}.tb-title div{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tb-title div:first-child{font-size:18px;font-weight:700}.tb-title div:last-child{font-size:13px;color:#ebebf5ad}.tb-spacer{flex:1}.zoom{flex:none;display:flex;align-items:center;border-radius:10px;background:#ffffff14;overflow:hidden}.zoom button{width:44px;height:40px;border:none;background:transparent;font-size:20px;color:#ebebf5e6}.zoom button:hover{background:#ffffff0f}.zoom button.zoom-pct{width:auto;min-width:68px;border-left:.5px solid rgba(255,255,255,.1);border-right:.5px solid rgba(255,255,255,.1);font-size:15px;font-weight:600;font-variant-numeric:tabular-nums}.canvas{flex:1;min-height:0;position:relative;overflow:hidden;background-color:#131316;touch-action:none;user-select:none;-webkit-user-select:none}.grid{position:absolute;left:0;top:0;pointer-events:none;will-change:transform}.world{position:absolute;left:0;top:0;width:1px;height:1px;transform-origin:0 0;will-change:transform}.moving .card,.moving .sticky{pointer-events:none!important}.moving .arrow{animation-play-state:paused!important}.hero{position:absolute;left:0;top:-200px;width:1600px;display:flex;flex-direction:column;gap:8px;pointer-events:none}.hero div:first-child{font-size:56px;font-weight:800;letter-spacing:-1.4px;line-height:1.05}.hero div:last-child{font-size:21px;color:#ebebf5ad}.month-label{position:absolute;display:flex;align-items:center;gap:12px;white-space:nowrap;pointer-events:none}.month-pill{font-size:26px;font-weight:800;letter-spacing:-.3px;padding:5px 18px;border-radius:999px}.month-sub{font-size:19px;color:#ebebf5b3}.ink-layer{position:absolute;left:0;top:0;overflow:visible;pointer-events:none}.ink-layer.top{z-index:999}.arrow{fill:none;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;transition:stroke .4s ease}.ink{fill:none;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round}.hint{position:absolute;right:18px;top:14px;font-size:13px;color:#ebebf5ad;pointer-events:none;text-align:right;line-height:1.5}.card{position:absolute;width:480px;height:720px;transition:transform .28s cubic-bezier(.2,.8,.2,1),box-shadow .28s ease;border-radius:20px;overflow:hidden;display:flex;flex-direction:column;contain:layout style paint}.band{flex:none;padding:16px 18px;display:flex;flex-direction:column;gap:6px}.band-meta{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:700;letter-spacing:.4px}.band-week{text-transform:uppercase;white-space:nowrap}.band-dates{opacity:.7;font-weight:600;letter-spacing:0;white-space:nowrap}.band-ms{padding:2px 8px;border-radius:999px;background:#00000024;font-size:13px;letter-spacing:.2px;white-space:nowrap}.chip{flex:none;height:36px;padding:0 14px 0 8px;border-radius:999px;border:none;font-size:15px;font-weight:700;display:flex;align-items:center;gap:6px;white-space:nowrap;transition:transform .12s ease}.chip:active{transform:scale(.94)}.chip-mark{width:20px;height:20px;border-radius:50%;border-width:2px;border-style:solid;color:#fff;font-size:12px;display:grid;place-items:center;line-height:1;transition:background .25s ease,border-color .25s ease}.card-title{font-size:29px;font-weight:750;letter-spacing:-.5px;line-height:1.18;text-wrap:pretty}.card-title-input{font-size:29px;font-weight:750;letter-spacing:-.5px;border:none;border-radius:6px;background:#ffffff73;outline:none;padding:1px 6px;margin:0 -6px;width:calc(100% + 12px);user-select:text;-webkit-user-select:text}.stats{flex:none;display:flex;align-items:center;gap:14px;padding:14px 18px 10px}.ring{flex:none;width:62px;height:62px;border-radius:50%;display:grid;place-items:center}.ring div{width:50px;height:50px;border-radius:50%;display:grid;place-items:center;font-size:15px;font-weight:700;font-variant-numeric:tabular-nums}.stat-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.stat-text span:first-child{font-size:19px;font-weight:600}.stat-text span:last-child{font-size:14px;color:#ebebf5ad}.hours{flex:none;display:flex;flex-direction:column;align-items:center;gap:4px}.hours-cap{font-size:12px;font-weight:700;letter-spacing:.4px;color:#ebebf5ad}.stepper{flex:none;display:flex;align-items:center;background:#ffffff14;border-radius:11px;overflow:hidden}.stepper button{width:42px;height:42px;border:none;background:transparent;color:#ffffffe6;font-size:21px;transition:background .2s ease,transform .12s ease}.stepper button:hover{background:#ffffff14}.stepper button:active{transform:scale(.9)}.stepper span{min-width:50px;text-align:center;font-size:17px;font-weight:600;font-variant-numeric:tabular-nums}.study-grid{flex:none;padding:0 18px 12px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.study-chip{min-width:0;display:flex;align-items:center;gap:5px;padding:4px 4px 4px 12px;border-radius:13px;background:#ffffff12}.study-name{flex:1;min-width:0;font-size:15px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.study-hours{flex:none;min-width:36px;text-align:center;font-size:16px;font-weight:700;font-variant-numeric:tabular-nums}.study-chip button{flex:none;width:36px;height:36px;border-radius:10px;border:none;line-height:1;padding:0;transition:background .2s ease,transform .12s ease,filter .2s ease}.study-down{background:#ffffff14;color:#ffffffe6;font-size:20px}.study-down:hover{background:#ffffff24}.study-up{font-size:22px;font-weight:700}.study-up:hover{filter:brightness(1.08)}.study-up:active{transform:scale(.9)}.tabs-wrap{flex:none;padding:0 18px 10px}.tabs{display:flex;padding:4px;border-radius:13px;background:#ffffff12;gap:3px}.tabs button{flex:1;height:42px;border:none;border-radius:10px;transition:background .2s ease,color .2s ease;font-size:16px;font-weight:600;display:flex;align-items:center;justify-content:center;gap:6px}.tabs button span{font-size:13px;font-weight:600;opacity:.7}.tab-body{flex:1;min-height:0;overflow-y:auto;padding:2px 18px 8px;touch-action:pan-y}.task-list{display:flex;flex-direction:column}.task{display:flex;gap:11px;align-items:flex-start;padding:11px 0;border-bottom:.5px solid rgba(255,255,255,.07)}.task-box{flex:none;width:24px;height:24px;border-radius:7px;transition:background .2s ease,box-shadow .2s ease;font-size:15px;font-weight:800;display:grid;place-items:center;line-height:1}.task-text{flex:1;min-width:0;font-size:17px;line-height:1.4;text-wrap:pretty;overflow-wrap:anywhere}.task-star,.task-del{flex:none;border:none;background:transparent;line-height:1;padding:4px}.task-star{font-size:21px}.task-del{color:#ebebf566;font-size:22px}.task-del:hover{color:#ebebf5cc}.task-add{margin-top:6px;border:none;border-radius:8px;background:#ffffff0d;outline:none;font-size:16px;padding:13px 14px;color:#ffffffe6;user-select:text;-webkit-user-select:text}.task-add:focus{box-shadow:0 0 0 2px var(--accent)}.summary{display:flex;flex-direction:column;gap:10px}.summary label{display:flex;flex-direction:column;gap:5px}.summary label>span{font-size:13px;font-weight:700;letter-spacing:.3px}.summary textarea{width:100%;resize:none;border:none;border-radius:9px;background:#ffffff0d;padding:11px 13px;font-size:16px;line-height:1.45;outline:none;color:#ffffffe6;user-select:text;-webkit-user-select:text;touch-action:pan-y}.notes{display:block;width:100%;height:100%;min-height:200px;resize:none;border:none;border-radius:10px;background:#ffffff0d;padding:13px 14px;font-size:16px;line-height:1.5;outline:none;color:#ffffffe6;user-select:text;-webkit-user-select:text;touch-action:pan-y}.card-foot{flex:none;display:flex;align-items:center;gap:10px;padding:12px 18px 16px;border-top:.5px solid rgba(255,255,255,.08)}.rating-label{font-size:15px;color:#ebebf5b3;white-space:nowrap}.rating{display:flex;gap:7px}.rating button{width:24px;height:24px;border-radius:50%;border:none;padding:0;transition:transform .12s ease}.rating button:hover{transform:scale(1.15)}.flex-1{flex:1}.copy-btn{height:42px;padding:0 18px;border:none;border-radius:11px;font-size:15px;font-weight:700;white-space:nowrap;transition:transform .12s ease,filter .2s ease}.copy-btn:hover{filter:brightness(1.06)}.copy-btn:active{transform:scale(.9)}.sticky{position:absolute;width:220px;border-radius:6px;padding:24px 14px 14px;box-shadow:0 2px 6px #0000004d,0 12px 28px #00000059}.sticky-x{position:absolute;right:6px;top:4px;border:none;background:transparent;font-size:16px;line-height:1;color:#00000073;padding:2px}.sticky-x:hover{color:#000000e6}.sticky textarea{display:block;width:100%;resize:none;border:none;background:transparent;outline:none;font-size:15px;line-height:1.45;color:#000000d9;padding:0;user-select:text;-webkit-user-select:text}.sticky textarea::placeholder{color:#0006}.dock{position:absolute;left:50%;bottom:20px;transform:translate(-50%);z-index:20;max-width:calc(100% - 16px);overflow-x:auto;scrollbar-width:none;display:flex;align-items:center;gap:6px;padding:7px;border-radius:22px;background:#26262cf7;box-shadow:0 0 0 .5px #ffffff24,0 14px 40px #0000008c;touch-action:pan-x}.dock::-webkit-scrollbar{display:none}.tool{flex:none;min-width:62px;height:60px;padding:0 8px;border:none;border-radius:15px;transition:background .22s ease,color .22s ease,transform .12s ease;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px}.tool:active{transform:scale(.92)}.tool span:first-child{font-size:22px;line-height:1}.tool span:last-child{font-size:13px;font-weight:600;white-space:nowrap}.tool.plain{background:transparent;color:#ffffffe0}.tool.plain:hover{background:#ffffff14}.dock-div{flex:none;width:1px;height:36px;background:#ffffff1f;margin:0 2px}.swatches{flex:none;display:flex;align-items:center;gap:10px;padding:0 6px}.swatches button{width:30px;height:30px;border-radius:50%;border:none;padding:0}.toast{position:absolute;left:50%;bottom:100px;transform:translate(-50%);background:#28282ef5;color:#fffffff2;font-size:15px;font-weight:500;padding:9px 16px;border-radius:999px;box-shadow:0 0 0 .5px #ffffff1f,0 8px 24px #00000080;pointer-events:none;white-space:nowrap;z-index:21}@media (max-width: 768px){.shell{padding:0}.window{border-radius:0;box-shadow:none}.sidebar{position:absolute;left:0;top:0;bottom:0;z-index:30;width:min(304px,88vw);box-shadow:0 0 40px #0009}.toolbar{gap:8px;padding:0 10px}.toolbar .lights,.hint{display:none}.dock{bottom:max(12px,env(safe-area-inset-bottom))}.tool{min-width:54px}}