*{box-sizing:border-box}:root{font-family:Segoe UI,Noto Sans JP,sans-serif;color:#303846;background:#f6f7f9;font-synthesis:none}body{margin:0}button,textarea{font:inherit}button{cursor:pointer}button:focus-visible,textarea:focus-visible{outline:3px solid #5479d2;outline-offset:3px}.header{padding:30px 40px;display:flex;justify-content:space-between;align-items:center;gap:20px;background:#fff;border-bottom:1px solid #e6e9ee}.brand{display:flex;align-items:center;gap:15px}.brand-icon{display:grid;place-items:center;background:#eef0ff;color:#6366c8;width:48px;height:48px;border-radius:14px;font-size:31px}h1{font-size:22px;letter-spacing:.04em;margin:0;display:flex;align-items:center;gap:12px}.badge{font-size:9px;letter-spacing:.13em;color:#9299a7;border:1px solid #e3e6ec;border-radius:5px;padding:4px 6px}.brand p{font-size:12px;color:#9299a7;margin:7px 0 0}.actions{display:flex;align-items:center;gap:24px}#save-status{font-size:12px;color:#89928f}#save-status:before{content:"";display:inline-block;width:6px;height:6px;background:#80b59d;border-radius:50%;margin-right:7px}.add-button{border:0;border-radius:10px;background:#555ac3;color:#fff;padding:12px 19px;display:flex;align-items:center;gap:10px;box-shadow:0 3px 7px #555ac320;font-weight:600;min-height:46px}.add-button:hover{background:#464bb0}.add-button span{font-size:23px;font-weight:400}main{padding:0 40px}.board-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:25px 0 20px;font-size:13px;font-weight:600}.board-dot{display:inline-block;width:7px;height:7px;background:#777bcf;border-radius:50%;margin-right:9px}#note-count{display:inline-block;background:#e9ebf0;color:#8b93a1;padding:3px 9px;border-radius:6px;font-size:11px;margin-left:10px}.hint{font-size:11px;color:#969eac;font-weight:400}#board{position:relative;min-height:calc(100dvh - 249px);border:1px solid #e2e5ec;border-radius:14px;background-color:#fcfcfd;background-image:radial-gradient(#daddE5 1px,transparent 1px);background-size:20px 20px;overflow:hidden}#empty-state{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;text-align:center}#empty-state[hidden]{display:none}.empty-icon{display:grid;place-items:center;width:65px;height:65px;background:#f0f0fb;color:#999bd2;border:1px solid #e0e1f2;border-radius:17px;font-size:30px;transform:rotate(-7deg);margin-bottom:13px}h2{font-size:19px;font-weight:600;letter-spacing:.06em}#empty-state p{font-size:12px;color:#9299a6;line-height:2;margin:0 0 24px}#first-note{border:1px solid #dedfeb;background:#fff;color:#6668b1;padding:12px 17px;border-radius:8px;min-height:44px}#first-note span{margin-left:16px}footer{display:flex;justify-content:space-between;gap:12px;color:#a0a6b0;font-size:10px;padding:17px 2px 24px}.footer-dot{display:inline-block;background:#aeb5c2;width:5px;height:5px;border-radius:50%;margin-right:7px}.note{position:absolute;width:240px;height:232px;border-radius:4px 4px 14px;box-shadow:1px 5px 12px #36405b12;border:1px solid #00000005;display:flex;flex-direction:column}.note[data-color=yellow]{background:#fff2b7}.note[data-color=pink]{background:#f9dfe5}.note[data-color=blue]{background:#dcecfb}.note[data-color=green]{background:#dfedda}.note-head{min-height:46px;display:flex;align-items:center;justify-content:space-between;padding:0 9px 0 16px;cursor:grab;touch-action:none;border-bottom:1px solid #00000006}.note-head:active{cursor:grabbing}.grip{letter-spacing:2px;color:#0003;font-size:16px}.delete-note{border:0;background:transparent;color:#0006;width:44px;height:44px;font-size:21px;border-radius:8px}.delete-note:hover{background:#00000009;color:#7f3442}.note textarea{width:100%;flex:1;min-height:0;resize:none;background:transparent;border:0;padding:15px 18px;color:#4d4a42;font-size:15px;line-height:1.8;outline-offset:-4px}.note textarea::placeholder{color:#0005}.note-foot{display:flex;justify-content:space-between;align-items:center;padding:9px 15px 12px;font-size:10px;color:#0006}.palette{display:flex;gap:2px}.color-button{width:22px;height:24px;border:0;border-radius:50%;background:transparent;padding:4px}.color-button:after{content:"";display:block;width:14px;height:14px;border-radius:50%;background:var(--swatch);border:1px solid #0002}.color-button[aria-pressed=true]:after{outline:1px solid #0006;outline-offset:2px}.note.dragging{box-shadow:0 12px 24px #36405b26;z-index:10}@media(max-width:800px){.header{padding:24px;gap:12px}.actions{gap:12px}#save-status{font-size:10px}main{padding:0 24px}.badge{display:none}footer span:last-child{display:none}}@media(max-width:520px){.header{padding:20px 16px;flex-wrap:wrap}.brand-icon{width:40px;height:40px;font-size:26px}.brand{gap:11px}h1{font-size:20px}.brand p{font-size:11px}.actions{width:100%;justify-content:space-between;flex-direction:row-reverse;margin-top:8px}.add-button{font-size:13px;padding:9px 15px;min-height:46px}main{padding:0 16px}.board-bar{padding:20px 0 16px}.hint{font-size:9px}#board{min-height:calc(100dvh - 300px)}footer{font-size:9px}.color-button{width:30px;height:32px;padding:8px}.note-foot{padding-top:3px}}.creation-options{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding-top:20px;font-size:12px;color:#657083}.creation-options select{font:inherit;min-height:44px;min-width:120px;border:1px solid #d9dce6;border-radius:8px;background:#fff;color:#303846;padding:8px 12px}.creation-options select:focus-visible{outline:3px solid #5479d2;outline-offset:3px}.creation-options>span{font-size:11px;color:#9299a7}.note-foot .color-button{width:44px;height:44px;padding:14px}.note-foot .color-button:after{width:16px;height:16px}.note-foot>span{display:none}.note-foot{padding:0 14px 8px}@media(max-width:520px){.creation-options{gap:8px}.creation-options>span{flex-basis:100%}}.note{border-radius:2px 2px 9px;background-image:linear-gradient(180deg,#ffffff18 0%,transparent 22%,#00000004 100%);box-shadow:0 2px 3px #35302412,2px 8px 12px -4px #35302430,5px 15px 20px -12px #35302440;transform-origin:center;transform:rotate(var(--note-tilt, -1deg)) scale(.97);transition:box-shadow .16s ease}.note-head{background:linear-gradient(180deg,#00000005,transparent)}.note.dragging{box-shadow:0 4px 7px #35302418,3px 16px 25px -5px #35302438;z-index:10}@media(prefers-reduced-motion:reduce){.note{transition:none}}@font-face{font-family:Zen Maru Gothic;src:url(/fonts/ZenMaruGothic-Regular.ttf) format("truetype");font-style:normal;font-weight:400;font-display:swap}.note textarea{font-family:Zen Maru Gothic,Segoe UI,sans-serif;font-size:18px;font-weight:400;line-height:1.8}.search-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:20px;font-size:12px;color:#657083}.search-bar input{font:inherit;min-width:0;width:280px;max-width:100%;min-height:44px;border:1px solid #d9dce6;border-radius:8px;padding:10px 12px;background:#fff;color:#303846}.search-bar button{font:inherit;min-height:44px;padding:10px 14px;background:#fff;border:1px solid #d9dce6;border-radius:8px;color:#555ac3}.search-bar button:disabled{color:#a0a6b0;cursor:default;background:#f6f7f9}.search-bar input:focus-visible{outline:3px solid #5479d2;outline-offset:3px}.note[hidden],#no-results[hidden]{display:none}#no-results{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;text-align:center;color:#657083}#no-results p{font-size:12px;color:#9299a6}@media(max-width:520px){.search-bar{gap:8px}.search-bar label{flex-basis:100%}.search-bar input{flex:1;width:auto}}.status-filters{display:flex;gap:6px;margin:20px 0 16px;flex-wrap:wrap}.status-filters button{font:inherit;font-size:13px;min-height:44px;min-width:88px;padding:10px 18px;border:1px solid #d9dce6;border-radius:9px;background:#fff;color:#657083}.status-filters button[aria-pressed=true]{background:#555ac3;border-color:#555ac3;color:#fff}.note.dragging{z-index:40;pointer-events:none;transform:rotate(var(--note-tilt)) scale(.97)}.complete-note{display:flex;align-items:center;gap:6px;min-height:44px;background:transparent;border:0;padding:0 4px;color:#605e51;font-size:11px;cursor:pointer}.complete-icon{display:grid;place-items:center;width:22px;height:22px;border:1px solid #8a8879;border-radius:50%;color:transparent;background:#ffffff50;font-size:14px}.note.completed{background-image:linear-gradient(#fff5,#fff5);border:1px solid #7a9e8880}.note.completed textarea{color:#657469;text-decoration:line-through;text-decoration-color:#65746980}.note.completed .complete-note{color:#326445;font-weight:600}.note.completed .complete-icon{background:#4d7d5c;border-color:#4d7d5c;color:#fff}.project-panel{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:24px;padding:16px;background:#fff;border:1px solid #e2e5ec;border-radius:12px;font-size:13px;color:#657083}.project-panel select{font:inherit;min-height:44px;width:280px;max-width:100%;min-width:0;border:1px solid #d9dce6;border-radius:8px;background:#fff;color:#303846;padding:8px 12px;text-overflow:ellipsis}.project-actions{display:flex;gap:8px;flex-wrap:wrap}.project-panel button,dialog button{font:inherit;min-height:44px;padding:10px 14px;border:1px solid #d9dce6;border-radius:8px;background:#fff;color:#555ac3}#delete-project{color:#a34c59}.project-feedback{font-size:12px;color:#657083;margin:10px 2px 0;overflow-wrap:anywhere}.project-feedback:empty{display:none}.board-bar{flex-wrap:wrap}.board-heading{display:flex;align-items:center;min-width:0;max-width:100%;gap:8px;flex-wrap:wrap}.board-heading .board-dot{flex-shrink:0;margin-right:0}#board-title{min-width:0;overflow-wrap:anywhere}#note-count{white-space:nowrap;margin-left:0}dialog{width:min(440px,calc(100% - 32px));max-height:calc(100dvh - 32px);padding:24px;border:1px solid #e2e5ec;border-radius:14px;color:#303846;box-shadow:0 20px 60px #30384630}dialog::backdrop{background:#30384660}dialog h2{margin:0 0 20px;font-size:18px}dialog label{display:block;margin-bottom:8px;font-size:13px}dialog input{font:inherit;width:100%;min-height:44px;border:1px solid #d9dce6;border-radius:8px;padding:10px;color:#303846}dialog p{font-size:14px;line-height:1.8;overflow-wrap:anywhere}.dialog-actions{display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap;margin-top:24px}dialog .primary-button{background:#555ac3;border-color:#555ac3;color:#fff}dialog .danger-button{background:#ae4657;border-color:#ae4657;color:#fff}.project-panel select:focus-visible,dialog input:focus-visible{outline:3px solid #5479d2;outline-offset:3px}@media(max-width:520px){.project-panel{gap:10px;padding:12px}.project-panel>label{flex-basis:100%}.project-panel select,.project-actions{width:100%}.project-actions button{flex:1;white-space:nowrap;padding:10px 8px}dialog{padding:20px}}.board-tools{display:flex;align-items:center;gap:12px;flex-wrap:wrap}#arrange-notes{font:inherit;font-size:12px;min-height:44px;min-width:64px;padding:10px 16px;border:1px solid #d9dce6;border-radius:8px;background:#fff;color:#555ac3}#arrange-notes:hover:enabled{background:#eef0ff;border-color:#b9bbe0}#arrange-notes:disabled{color:#a0a6b0;cursor:default;background:#f6f7f9}@media(max-width:520px){.board-tools{justify-content:space-between;width:100%;gap:8px}}:root{color-scheme:light}.header{flex-wrap:wrap}.actions{flex-wrap:wrap;gap:12px}#theme-toggle{font:inherit;font-size:12px;min-height:46px;padding:10px 14px;border:1px solid #d9dce6;border-radius:9px;background:#fff;color:#555ac3;white-space:nowrap}:root[data-theme=dark]{color-scheme:dark;background:#171c28;color:#e6ebf4}[data-theme=dark] .header,[data-theme=dark] .project-panel,[data-theme=dark] dialog{background:#222a3a;border-color:#3b465c;color:#e6ebf4}[data-theme=dark] #board{background-color:#1c2331;background-image:radial-gradient(#394358 1px,transparent 1px);border-color:#3b465c}[data-theme=dark] .brand-icon,[data-theme=dark] .empty-icon{background:#343452;color:#c7c4ff;border-color:#535477}[data-theme=dark] .badge{border-color:#525e74;color:#b2bdd0}[data-theme=dark] .brand p,[data-theme=dark] .hint,[data-theme=dark] footer,[data-theme=dark] .creation-options>span,[data-theme=dark] #empty-state p,[data-theme=dark] #no-results p{color:#b2bdd0}[data-theme=dark] .creation-options,[data-theme=dark] .search-bar,[data-theme=dark] .project-feedback,[data-theme=dark] #no-results{color:#c4cede}[data-theme=dark] #save-status{color:#afcbbd}[data-theme=dark] #note-count{background:#343e52;color:#d2daea}[data-theme=dark] .project-panel select,[data-theme=dark] .creation-options select,[data-theme=dark] .search-bar input,[data-theme=dark] dialog input{background:#171e2c;color:#e6ebf4;border-color:#53617a}[data-theme=dark] .search-bar input::placeholder{color:#a5b1c5}[data-theme=dark] .project-panel button,[data-theme=dark] .search-bar button,[data-theme=dark] #arrange-notes,[data-theme=dark] #theme-toggle,[data-theme=dark] #first-note,[data-theme=dark] dialog button{background:#2c3549;color:#d0cdff;border-color:#53617a}[data-theme=dark] .status-filters button{background:#222a3a;color:#c4cede;border-color:#53617a}[data-theme=dark] .status-filters button[aria-pressed=true],[data-theme=dark] dialog .primary-button{background:#555ac3;color:#fff;border-color:#797ddd}[data-theme=dark] #delete-project{color:#ffb7c2}[data-theme=dark] dialog .danger-button{background:#ae4657;color:#fff;border-color:#cf7b89}[data-theme=dark] .search-bar button:disabled,[data-theme=dark] #arrange-notes:disabled{background:#222a3a;color:#8e9bb1;border-color:#3b465c}[data-theme=dark] #arrange-notes:hover:enabled,[data-theme=dark] #theme-toggle:hover{background:#3b4560}[data-theme=dark] dialog::backdrop{background:#080c16b3}.note{color-scheme:light}[data-theme=dark] .note{box-shadow:0 2px 4px #0004,3px 10px 20px -5px #0008}[data-theme=dark] .note.dragging{box-shadow:0 6px 12px #0005,4px 18px 30px -5px #000a}@media(max-width:520px){.actions{flex-direction:row;justify-content:space-between}.actions #save-status{width:100%;order:3}}