:root{font-family:Inter,Hiragino Kaku Gothic ProN,Yu Gothic,Meiryo,sans-serif;color:#17231f;background:#e8eee9;font-synthesis:none;text-rendering:optimizeLegibility;--ink: #17231f;--muted: #66736d;--paper: #f9faf7;--accent: #ffda57;--board-edge: #cbd5cf}*{box-sizing:border-box}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}html,body{min-width:320px;min-height:100%;margin:0}body{background:radial-gradient(circle at 10% 0%,rgba(255,255,255,.8),transparent 26rem),#e8eee9}button,textarea{font:inherit}button{-webkit-tap-highlight-color:transparent}.app-shell{width:min(100% - 48px,1500px);margin:0 auto;padding:30px 0 18px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:24px}.brand{display:flex;align-items:center;gap:14px}.brand-mark{display:grid;width:48px;height:48px;place-items:center;background:var(--ink);border-radius:15px;box-shadow:0 7px 18px #17231f33;transform:rotate(-3deg)}.brand-mark span{position:relative;width:22px;height:22px;background:var(--accent);border-radius:3px 3px 7px}.brand-mark span:after{position:absolute;right:0;bottom:0;width:7px;height:7px;content:"";background:#fff1a7;clip-path:polygon(100% 0,0 100%,100% 100%)}.eyebrow{margin:0 0 1px;color:#78847f;font-size:.7rem;font-weight:800;letter-spacing:.18em}h1{margin:0;font-family:Georgia,Times New Roman,serif;font-size:clamp(1.8rem,3vw,2.45rem);line-height:1;letter-spacing:-.04em}.toolbar{display:flex;align-items:center;gap:20px}.add-control{position:relative}.save-status{display:flex;align-items:center;gap:8px;min-width:7.5rem;margin:0;color:var(--muted);font-size:.82rem;font-weight:700}.status-dot{width:8px;height:8px;background:#38a169;border-radius:50%;box-shadow:0 0 0 4px #38a1691c}.save-status.saving .status-dot{background:#e2a70b;animation:pulse .8s ease-in-out infinite alternate}.save-status.save-error{color:#9f302b}.save-status.save-error .status-dot{background:#c4443c;box-shadow:0 0 0 4px #c4443c1c}@keyframes pulse{to{opacity:.4}}.add-button{display:inline-flex;min-height:48px;align-items:center;justify-content:center;gap:9px;padding:0 20px;color:#fff;background:var(--ink);border:0;border-radius:14px;box-shadow:0 7px 18px #17231f33;cursor:pointer;font-size:.95rem;font-weight:800;transition:transform .16s ease,box-shadow .16s ease,background .16s ease}.add-button:hover{background:#263c34;box-shadow:0 9px 23px #17231f3d;transform:translateY(-2px)}.add-button:active{transform:translateY(0)}.add-button svg{width:20px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-width:2.2}.add-button .chevron{width:16px;margin-left:2px;transition:transform .15s ease}.add-button[aria-expanded=true] .chevron{transform:rotate(180deg)}.project-bar{display:flex;min-height:64px;align-items:center;justify-content:space-between;gap:20px;margin-bottom:14px;padding:9px 11px 9px 16px;background:#ffffffb8;border:1px solid #d3ddd7;border-radius:17px;box-shadow:0 8px 24px #27393112;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.project-picker{display:flex;min-width:0;align-items:center;gap:12px}.project-picker label{color:#77837d;font-size:.7rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.project-picker select{width:clamp(190px,30vw,360px);min-height:42px;padding:0 38px 0 13px;overflow:hidden;color:#24312c;background:#f8faf7;border:1px solid #cbd5cf;border-radius:11px;outline:none;cursor:pointer;font-size:.92rem;font-weight:750;text-overflow:ellipsis}.project-picker select:focus-visible{border-color:#4e78d0;box-shadow:0 0 0 3px #4e78d02e}.status-filter{display:inline-flex;flex:0 0 auto;padding:4px;background:#e8eeea;border:1px solid #d5ddd8;border-radius:12px}.status-filter button{min-height:34px;padding:0 13px;color:#6b7771;background:transparent;border:0;border-radius:8px;cursor:pointer;font-size:.78rem;font-weight:800;white-space:nowrap}.status-filter button[aria-pressed=true]{color:#223029;background:#fff;box-shadow:0 2px 7px #1f30281f}.project-actions{display:flex;align-items:center;gap:7px}.project-button{display:inline-flex;min-height:42px;align-items:center;justify-content:center;gap:7px;padding:0 13px;color:#45524c;background:transparent;border:1px solid transparent;border-radius:10px;cursor:pointer;font-size:.82rem;font-weight:800;transition:background .15s ease,color .15s ease,border-color .15s ease}.project-button:hover{color:#1f2c27;background:#edf2ee;border-color:#dbe2dd}.project-button svg{width:17px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8}.project-button-primary{color:#fff;background:#31463e}.project-button-primary:hover{color:#fff;background:#1f302a;border-color:transparent}.project-button-danger:hover{color:#9f302b;background:#fff0ee;border-color:#f1d5d1}.project-button:disabled{color:#a8b0ac;background:transparent;border-color:transparent;cursor:not-allowed;opacity:.65}.color-menu{z-index:50;width:190px;padding:9px;color:#26312d;background:#fffffffa;border:1px solid #d7ded9;border-radius:15px;box-shadow:0 15px 35px #18272033}.color-menu[hidden]{display:none}.color-menu p{margin:3px 7px 7px;color:#76817c;font-size:.7rem;font-weight:800;letter-spacing:.08em}.creation-color-menu{position:absolute;top:calc(100% + 9px);right:0}.color-option{display:flex;width:100%;min-height:42px;align-items:center;gap:11px;padding:0 9px;color:#26312d;background:transparent;border:0;border-radius:9px;cursor:pointer;font-size:.9rem;font-weight:750}.color-option:hover,.color-option:focus-visible{background:#edf1ee}.color-swatch,.color-choice{background:var(--swatch-color)}[data-color=red]{--swatch-color: #a83c35}[data-color=white]{--swatch-color: #fffdf8}[data-color=black]{--swatch-color: #1d2421}[data-color=gold]{--swatch-color: #d6a527}.color-swatch{width:24px;height:24px;flex:0 0 auto;border:1px solid rgba(20,30,26,.2);border-radius:7px;box-shadow:inset 0 1px #ffffff47}.board-wrap{overflow:hidden;background:#f6f8f4;border:1px solid var(--board-edge);border-radius:22px;box-shadow:0 24px 60px #2739311f,0 2px 5px #2739310f}.board-meta{display:flex;min-height:56px;align-items:center;justify-content:space-between;gap:18px;padding:8px 14px 8px 21px;color:#85918b;background:#ffffffb8;border-bottom:1px solid #d9e0db;font-size:.68rem;font-weight:800;letter-spacing:.16em}.board-tools{display:flex;align-items:center;gap:13px}.search-box{display:flex;width:clamp(210px,25vw,330px);min-height:38px;align-items:center;gap:7px;padding:0 8px 0 11px;color:#7a8780;background:#f5f7f4;border:1px solid #d4dcd7;border-radius:11px;transition:border-color .15s ease,box-shadow .15s ease,background .15s ease}.search-box:focus-within{color:#415149;background:#fff;border-color:#6e8f80;box-shadow:0 0 0 3px #5177651f}.search-box>svg{width:18px;flex:0 0 auto;fill:none;stroke:currentColor;stroke-linecap:round;stroke-width:1.8}.search-box input{width:100%;min-width:0;padding:0;color:#26332d;background:transparent;border:0;outline:0;font-size:.88rem}.search-box input::-webkit-search-cancel-button{display:none}.clear-search{display:grid;width:30px;height:30px;flex:0 0 auto;padding:0;place-items:center;color:#66736d;background:transparent;border:0;border-radius:8px;cursor:pointer}.clear-search[hidden]{display:none}.clear-search:hover{background:#e5ebe7}.clear-search svg{width:16px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-width:2}.note-count{min-width:78px;color:#6f7c76;font-size:.74rem;font-weight:850;letter-spacing:.04em;text-align:right;white-space:nowrap}.completed-drop-zone{display:flex;min-height:68px;align-items:center;gap:11px;margin:10px 14px;padding:9px 14px;color:#65736c;background:repeating-linear-gradient(-45deg,rgba(76,106,91,.025) 0 8px,transparent 8px 16px),#f4f7f3;border:2px dashed #bdcbc3;border-radius:14px;transition:color .15s ease,background .15s ease,border-color .15s ease,transform .15s ease}.completed-drop-icon{display:grid;width:38px;height:38px;flex:0 0 auto;place-items:center;color:#658274;background:#e2ebe6;border-radius:11px}.completed-drop-icon svg{width:22px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:2.2}.completed-drop-copy{display:grid;gap:2px}.completed-drop-copy strong{color:#3d5148;font-size:.88rem}.completed-drop-copy small{font-size:.72rem;font-weight:650}.completed-total{display:grid;min-width:32px;height:32px;margin-left:auto;padding:0 8px;place-items:center;color:#466356;background:#e1ebe5;border-radius:10px;font-size:.8rem;font-weight:900}.completed-drop-zone.is-receiving{border-color:#7f9e8e}.completed-drop-zone.drag-over{color:#244f3a;background:#dff1e7;border-color:#3f8965;border-style:solid;transform:scale(1.005)}.completed-drop-zone.drag-over .completed-drop-icon{color:#fff;background:#3f8965}.board{position:relative;min-height:clamp(440px,calc(100vh - 350px),700px);overflow:hidden;background-color:#edf1ec;background-image:linear-gradient(rgba(89,109,99,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(89,109,99,.055) 1px,transparent 1px),radial-gradient(circle at 50% -20%,rgba(255,255,255,.9),transparent 60%);background-size:28px 28px,28px 28px,100% 100%;transition:min-height .2s ease}.empty-state{position:absolute;inset:0;display:grid;align-content:center;justify-items:center;padding:30px;color:#75817b;text-align:center;pointer-events:none;transition:opacity .18s ease}.empty-state[hidden]{display:none}.empty-icon{display:grid;width:72px;height:72px;margin-bottom:17px;place-items:center;color:#66766e;background:#ffffffbf;border:1px solid #d5ddd8;border-radius:22px;box-shadow:0 8px 24px #2e423914}.empty-icon svg{width:38px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.6}.empty-state p{margin:0 0 6px;color:#3d4d46;font-size:1.03rem;font-weight:800}.empty-state>span:last-child{font-size:.86rem}.note{--note-color: #d6a527;--note-ink: #2d2615;--note-muted: rgba(45, 38, 21, .58);--note-fold: rgba(255, 247, 207, .48);--note-tilt: 0deg;position:absolute;z-index:1;width:clamp(238px,20vw,276px);min-width:210px;max-width:calc(100% - 18px);min-height:118px;height:132px;overflow:visible;background:var(--note-color);border:1px solid rgba(76,66,24,.12);border-radius:5px 5px 16px;box-shadow:1px 2px 2px #232a251f,4px 9px 13px #232a2521,8px 18px 28px #232a2514;transform:rotate(var(--note-tilt));transform-origin:50% 8%;transition:box-shadow .16s ease,transform .16s ease,left .24s cubic-bezier(.2,.8,.2,1),top .24s cubic-bezier(.2,.8,.2,1),width .16s ease,height .16s ease;animation:note-in .23s cubic-bezier(.2,.8,.2,1) both}.note.resizing{z-index:25;transition:box-shadow .1s ease,transform .1s ease,left 0s,top 0s,width 0s,height 0s;-webkit-user-select:none;user-select:none}@keyframes note-in{0%{opacity:0;transform:rotate(var(--note-tilt)) scale(.94) translateY(8px)}}.note[data-color=red]{--note-color: #a83c35;--note-ink: #fffaf6;--note-muted: rgba(255, 250, 246, .7);--note-fold: rgba(255, 226, 217, .26)}.note[data-color=white]{--note-color: #fffdf8;--note-ink: #29312e;--note-muted: rgba(41, 49, 46, .55);--note-fold: rgba(78, 91, 85, .13);border-color:#29312e29}.note[data-color=black]{--note-color: #1d2421;--note-ink: #f7f5ec;--note-muted: rgba(247, 245, 236, .64);--note-fold: rgba(255, 255, 255, .15)}.note[data-completed=true]{opacity:.72;box-shadow:1px 2px 2px #232a2514,3px 7px 11px #232a2514;filter:saturate(.45)}.note[data-completed=true] textarea{text-decoration:line-through;text-decoration-thickness:2px;text-decoration-color:color-mix(in srgb,currentColor 65%,transparent)}.note.dragging{z-index:20;box-shadow:2px 5px 7px #222e2826,10px 26px 42px #222e283d;transform:rotate(var(--note-tilt)) scale(1.015);transition:box-shadow .1s ease,transform .1s ease,left 0s,top 0s}.note.menu-open{z-index:30}.note-handle{display:flex;height:48px;align-items:center;justify-content:space-between;padding:7px 8px 4px 16px;cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none}.note-handle:active{cursor:grabbing}.grip:focus-visible{outline:3px solid #4e78d0;outline-offset:3px;border-radius:2px}.grip{width:28px;height:12px;opacity:.55;background-image:radial-gradient(circle,var(--note-ink) 1.25px,transparent 1.4px);background-size:7px 6px}.note-actions{display:flex;align-items:center}.delete-button,.palette-button,.complete-button{display:grid;width:40px;height:40px;padding:0;place-items:center;color:var(--note-muted);background:transparent;border:0;border-radius:11px;cursor:pointer;transition:color .15s ease,background .15s ease}.delete-button:hover,.delete-button:focus-visible,.palette-button:hover,.palette-button:focus-visible,.complete-button:hover,.complete-button:focus-visible{color:var(--note-ink);background:#ffffff6e}.delete-button svg,.palette-button svg,.complete-button svg{width:19px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.65}.complete-button[aria-pressed=true]{color:#fff;background:#3f8965}.complete-button svg circle{fill:none}.palette-button svg circle{fill:currentColor;stroke:none}.note-color-menu{position:absolute;top:45px;right:8px;width:174px}.note-color-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:5px}.color-choice{position:relative;width:34px;height:34px;padding:0;border:2px solid white;border-radius:10px;box-shadow:0 0 0 1px #1a262138;cursor:pointer}.color-choice[aria-checked=true]:after{position:absolute;inset:8px;content:"";border:solid var(--check-color, white);border-width:0 2px 2px 0;transform:rotate(45deg) translate(-1px,-2px)}.color-choice[data-color=white]{--check-color: #26312d}.note textarea{display:block;width:calc(100% - 28px);height:calc(100% - 54px);margin:0 14px;padding:4px 5px 12px;color:var(--note-ink);background:transparent;border:0;outline:0;resize:none;font-family:Bradley Hand,Comic Sans MS,Klee,Klee One,HanziPen SC,YuKyokasho,Yu Kyokasho,cursive;font-size:1rem;font-weight:500;line-height:1.72;letter-spacing:.025em}.note textarea::placeholder{color:var(--note-muted)}.note textarea:focus-visible{background:#ffffff29;border-radius:8px;box-shadow:inset 0 0 0 2px #28352f52}.note-corner{position:absolute;right:0;bottom:0;width:25px;height:25px;background:var(--note-fold);clip-path:polygon(100% 0,0 100%,100% 100%);pointer-events:none}.resize-handle{position:absolute;right:0;bottom:0;z-index:3;display:grid;width:36px;height:36px;padding:8px 6px 5px 9px;place-items:end;color:var(--note-muted);background:transparent;border:0;border-radius:10px 0 14px;cursor:nwse-resize;touch-action:none}.resize-handle:hover,.resize-handle:focus-visible{color:var(--note-ink)}.resize-handle svg{width:18px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-width:1.6}footer{display:flex;justify-content:center;padding:14px 12px 0;color:#7d8983;font-size:.76rem;font-weight:600;text-align:center}footer p{margin:0}.app-dialog{width:min(calc(100% - 32px),430px);padding:0;color:#26312d;background:#fbfcf9;border:1px solid #d8e0db;border-radius:20px;box-shadow:0 28px 80px #14231c4d}.app-dialog::backdrop{background:#121e1973;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.app-dialog form{padding:24px}.dialog-heading{display:flex;align-items:center;gap:13px;margin-bottom:22px}.dialog-heading p{margin:0 0 2px;color:#7d8983;font-size:.65rem;font-weight:900;letter-spacing:.16em}.dialog-heading h2{margin:0;font-family:Georgia,Times New Roman,serif;font-size:1.38rem;letter-spacing:-.025em}.dialog-icon{display:grid;width:44px;height:44px;flex:0 0 auto;place-items:center;color:#fff;background:#31463e;border-radius:13px}.dialog-icon-danger{background:#a83c35}.dialog-icon svg{width:22px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8}.app-dialog label{display:block;margin:0 0 7px;color:#53615b;font-size:.78rem;font-weight:800}.app-dialog input{width:100%;min-height:48px;padding:0 13px;color:#213029;background:#fff;border:1px solid #cbd5cf;border-radius:11px;outline:none;font-size:1rem}.app-dialog input:focus{border-color:#4e78d0;box-shadow:0 0 0 3px #4e78d029}.dialog-error{margin:7px 2px 0;color:#a83c35;font-size:.78rem;font-weight:700}.delete-message{margin:0;color:#53615b;font-size:.92rem;line-height:1.7}.dialog-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:24px}.dialog-button{min-height:44px;padding:0 16px;color:#425149;background:#edf2ee;border:1px solid #d8e0db;border-radius:11px;cursor:pointer;font-weight:800}.dialog-button-primary{color:#fff;background:#263b33;border-color:#263b33}.dialog-button-danger{color:#fff;background:#a83c35;border-color:#a83c35}button:focus-visible{outline:3px solid #4e78d0;outline-offset:3px}@media(max-width:767px){.app-shell{width:min(100% - 24px,680px);padding-top:18px}.topbar{align-items:flex-end;margin-bottom:16px}.brand{gap:10px}.brand-mark{width:43px;height:43px;border-radius:13px}.brand-mark span{width:20px;height:20px}.eyebrow,.save-status{display:none}h1{font-size:1.75rem}.toolbar{gap:0}.project-bar{min-height:0;align-items:stretch;flex-direction:column;gap:8px;padding:10px}.project-picker{width:100%}.project-picker label{display:none}.project-picker select{width:100%;min-height:46px;font-size:1rem}.project-actions{display:grid;grid-template-columns:repeat(2,1fr)}.status-filter{display:grid;grid-template-columns:repeat(3,1fr);width:100%}.status-filter button{min-height:40px}.project-button{min-height:44px;padding-inline:8px}.add-button{min-height:48px;padding:0 15px;border-radius:13px;font-size:.9rem}.board-wrap{border-radius:17px}.board-meta{min-height:60px;padding:8px 10px}.board-title{display:none}.board-tools{width:100%;gap:8px}.search-box{width:auto;min-height:44px;flex:1}.search-box input{font-size:1rem}.clear-search{width:36px;height:36px}.note-count{min-width:72px;font-size:.73rem}.board{min-height:max(430px,calc(100svh - 355px));background-size:24px 24px,24px 24px,100% 100%}.note{width:min(248px,calc(100% - 28px));min-width:min(210px,calc(100% - 28px));min-height:118px;height:132px}.note-handle{height:50px;padding-left:14px}.delete-button,.palette-button,.complete-button{width:44px;height:44px}.completed-drop-zone{min-height:64px;margin:8px 10px;padding:8px 11px}.completed-drop-copy small{font-size:.68rem}.color-option{min-height:46px}.note-color-menu{width:204px}.color-choice{width:40px;height:40px}.note textarea{height:calc(100% - 56px);font-size:1rem}footer{font-size:.71rem}}@media(min-width:768px)and (max-width:980px){.project-bar{flex-wrap:wrap}.project-actions{width:100%;justify-content:flex-end}}@media(max-width:480px){.topbar{align-items:center}.brand-mark{display:none}.eyebrow{display:block;font-size:.58rem}h1{font-size:1.55rem}.add-button{padding-inline:13px}.add-button svg{width:18px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
