:root{font-family:Hiragino Sans,Yu Gothic UI,Yu Gothic,system-ui,sans-serif;color:#292d31;background:#f3efe5;font-synthesis:none;--ink:#292d31;--muted:#777970;--line:rgba(51,55,55,.14);--paper:#f9f7f0;--accent:#df5b3f;--note-width:236px;--note-height:190px}*{box-sizing:border-box}html,body{min-width:320px;min-height:100%;margin:0}body{min-height:100vh;background:radial-gradient(circle at 14% 3%,rgba(232,190,87,.12),transparent 24rem),#f3efe5}button,input,textarea,select{font:inherit}button,summary{-webkit-tap-highlight-color:transparent}svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.app-shell{min-height:100vh;display:grid;grid-template-rows:auto 1fr auto}.app-header{position:relative;z-index:30;background:#f9f7f0f0;border-bottom:1px solid var(--line);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.header-main{min-height:82px;padding:14px clamp(20px,4vw,64px);display:flex;align-items:center;justify-content:space-between;gap:28px}.brand{display:flex;align-items:center;gap:14px;min-width:0}.brand-mark{width:42px;height:42px;flex:0 0 auto;position:relative;background:#f4c954;border:1px solid rgba(65,52,19,.16);box-shadow:4px 5px #3a331f1f;transform:rotate(-2deg)}.brand-mark:after{content:"";position:absolute;right:0;bottom:0;width:11px;height:11px;background:linear-gradient(135deg,#e2b33c 50%,#f7dd8f 51%)}h1{margin:0;font-family:Yu Mincho,Hiragino Mincho ProN,serif;font-size:24px;letter-spacing:.06em}.brand p{margin:3px 0 0;color:var(--muted);font-size:12px;letter-spacing:.06em}.search-box{width:clamp(240px,30vw,430px);min-height:44px;padding:0 13px;display:flex;align-items:center;gap:9px;border:1px solid rgba(57,61,59,.18);border-radius:7px;background:#ffffffb3;color:var(--muted)}.header-tools{display:flex;align-items:center;gap:10px}.theme-toggle{width:44px;height:44px;flex:none;padding:0;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;background:#ffffffb8;color:#555d5c;cursor:pointer}.theme-toggle:hover{background:#fff;color:#202526}.theme-toggle svg{width:19px;height:19px;grid-area:1/1;transition:transform .2s,opacity .2s}.theme-toggle .sun-icon{opacity:0;transform:rotate(-60deg) scale(.7)}[data-theme=dark] .theme-toggle .moon-icon{opacity:0;transform:rotate(60deg) scale(.7)}[data-theme=dark] .theme-toggle .sun-icon{opacity:1;transform:rotate(0) scale(1)}.search-box:focus-within{border-color:#2d6c7c9e;background:#fff;box-shadow:0 0 0 3px #2d6c7c1c}.search-box svg{width:18px;height:18px;flex:none}.search-box input{width:100%;min-width:0;padding:0;border:0;outline:0;background:transparent;color:var(--ink);font-size:14px}.control-bar{min-height:66px;padding:10px clamp(20px,4vw,64px);display:flex;align-items:center;justify-content:space-between;gap:20px;border-top:1px solid rgba(51,55,55,.08)}.project-controls,.board-actions{display:flex;align-items:center;gap:7px}.control-label{margin-right:3px;color:var(--muted);font-size:11px;font-weight:700;letter-spacing:.08em}.project-controls select{width:clamp(145px,15vw,220px);height:40px;padding:0 32px 0 12px;border:1px solid var(--line);border-radius:6px;background:#fff;color:var(--ink);font-weight:700}.icon-button,.secondary-button{height:40px;border:1px solid var(--line);border-radius:6px;background:#fff;color:#59605f;cursor:pointer}.icon-button{width:40px;padding:0;display:grid;place-items:center}.icon-button svg,.secondary-button svg{width:17px;height:17px}.icon-button:hover,.secondary-button:hover{background:#f2f0e9;color:var(--ink)}.icon-button.danger:hover{color:#a43d30;background:#fff0ec}.icon-button:disabled{opacity:.35;cursor:not-allowed}.status-tabs{padding:3px;display:flex;border:1px solid var(--line);border-radius:8px;background:#eae7df}.status-tabs button{min-width:72px;height:34px;padding:0 14px;border:0;border-radius:6px;background:transparent;color:#6e716c;cursor:pointer;font-size:13px;font-weight:700}.status-tabs button[aria-pressed=true]{background:#fff;color:#323735;box-shadow:0 1px 5px #292c281f}.secondary-button{padding:0 14px;display:flex;align-items:center;gap:7px;font-weight:700}.add-menu,.note-menu{position:relative}summary{list-style:none}summary::-webkit-details-marker{display:none}.add-button{min-height:42px;padding:0 18px;border:0;border-radius:6px;display:flex;align-items:center;justify-content:center;gap:8px;color:#fff;background:var(--accent);cursor:pointer;font-weight:700;box-shadow:0 4px 12px #a23d292e}.add-button svg{width:18px;height:18px;stroke-width:2.2}.add-button:hover{background:#ce4e34}.add-popover,.note-popover{position:absolute;z-index:100;padding:14px;border:1px solid var(--line);border-radius:9px;background:#fff;box-shadow:0 14px 34px #28251c33}.add-popover{top:calc(100% + 8px);right:0;width:220px}.add-popover strong,.note-popover strong{display:block;margin-bottom:10px;font-size:12px;color:#6e716c}.add-color-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}.add-color-grid button{height:40px;padding:0 8px;border:1px solid var(--line);border-radius:6px;display:flex;align-items:center;gap:7px;background:#faf9f5;cursor:pointer;font-size:12px}.add-color-grid i,.note-color-list i{width:18px;height:18px;display:block;border-radius:50%;background:#f7d96c;border:1px solid rgba(45,42,33,.14)}[data-add-color=pink] i,[data-color=pink] i{background:#f2b9c0}[data-add-color=blue] i,[data-color=blue] i{background:#b9d8ef}[data-add-color=green] i,[data-color=green] i{background:#b9dfc8}.board-wrap{min-height:0;padding:clamp(14px,2.4vw,30px)}.board{position:relative;min-height:max(680px,calc(100vh - 230px));overflow:hidden;border:1px solid rgba(64,62,52,.18);border-radius:10px;background-color:#d8c6a6;background-image:linear-gradient(rgba(255,255,255,.11) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.11) 1px,transparent 1px),repeating-linear-gradient(22deg,rgba(99,70,35,.022) 0 1px,transparent 1px 7px);background-size:24px 24px,24px 24px,auto;box-shadow:inset 0 0 45px #4c361c1a,0 12px 28px #3e311e14}.empty-state{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;padding:30px 30px 120px;text-align:center;color:#37342dad;pointer-events:none}.empty-state[hidden]{display:none}.empty-state h2{margin:20px 0 7px;font-family:Yu Mincho,serif;font-size:22px;color:#2f2c26c2}.empty-state p{margin:0;font-size:14px}.empty-icon{position:relative;width:82px;height:58px}.empty-icon span{position:absolute;width:46px;height:42px;background:#fae584a6;box-shadow:2px 3px 5px #362c191a}.empty-icon span:nth-child(1){left:1px;top:10px;transform:rotate(-8deg)}.empty-icon span:nth-child(2){right:1px;top:12px;transform:rotate(9deg);background:#b2dbccb8}.empty-icon span:nth-child(3){left:19px;top:0;transform:rotate(-1deg);background:#facc72d9}.completion-zone{position:absolute;z-index:5;left:20px;right:20px;bottom:20px;min-height:82px;padding:14px 18px;display:flex;align-items:center;gap:12px;border:2px dashed rgba(52,102,79,.42);border-radius:10px;background:#eff5ebbd;color:#456751;transition:.18s}.completion-zone.drag-over{border-style:solid;border-color:#397452;background:#e2f4e0f5;transform:scale(1.008);box-shadow:0 0 0 5px #3974521f}.completion-icon{width:38px;height:38px;flex:none;display:grid;place-items:center;border-radius:50%;background:#5d8e70;color:#fff;font-size:20px;font-weight:800}.completion-zone strong,.completion-zone small{display:block}.completion-zone small{margin-top:3px;color:#718477;font-size:11px}.completion-zone b{margin-left:auto;min-width:34px;height:30px;padding:0 9px;display:grid;place-items:center;border-radius:15px;background:#4e765a1f}.note{position:absolute;width:var(--note-width);height:var(--note-height);padding:12px 13px 15px;display:grid;grid-template-rows:34px 1fr;border:1px solid rgba(72,58,23,.13);background:var(--note-color,#f7d96c);box-shadow:4px 7px 13px #3c2b112b;transform:rotate(var(--tilt,0deg));transform-origin:center;transition:box-shadow .18s,transform .18s,filter .18s,opacity .18s;touch-action:none}.note[hidden]{display:none}.note:after{content:"";position:absolute;right:0;bottom:0;width:17px;height:17px;background:linear-gradient(135deg,#7c601c1f 49%,#ffffff59 51%)}.note.dragging{z-index:1000!important;transform:rotate(0) scale(1.02);box-shadow:8px 13px 22px #2e220f3d;cursor:grabbing}.note.completed{filter:saturate(.48);opacity:.72}.note.completed .note-text{text-decoration:line-through;text-decoration-thickness:1.5px;color:#5d5c54}.completed-stamp{display:none;position:absolute;right:14px;bottom:12px;padding:2px 7px;border:1px solid rgba(55,96,72,.5);border-radius:3px;color:#477157;font-size:10px;font-weight:800;letter-spacing:.12em;transform:rotate(-5deg)}.note.completed .completed-stamp{display:block}.note-header{display:flex;align-items:flex-start;gap:8px;cursor:grab}.drag-grip{flex:1;height:8px;margin-top:5px;border-top:1px solid rgba(65,55,34,.2);border-bottom:1px solid rgba(65,55,34,.2);opacity:.45}.complete-button{width:28px;height:28px;margin:-5px 0 0 -5px;padding:0;border:1.5px solid rgba(58,66,52,.45);border-radius:50%;display:grid;place-items:center;background:#ffffff2e;color:transparent;cursor:pointer}.complete-button:hover{background:#ffffff80;color:#37624573}.complete-button[aria-pressed=true]{border-color:#4d805e;background:#5c9270;color:#fff}.complete-button span{font-weight:900;font-size:15px}.note-menu summary{width:32px;height:30px;margin:-6px -7px 0 0;display:grid;place-items:center;border-radius:50%;cursor:pointer;color:#38301fad;font-weight:800;letter-spacing:1px}.note-menu summary:hover{background:#ffffff4d}.note-popover{top:28px;right:-7px;width:176px}.note-color-list{display:flex;gap:8px;margin-bottom:12px}.note-color-list button{width:28px;height:28px;padding:4px;border:1px solid transparent;border-radius:50%;background:transparent;cursor:pointer}.note-color-list button.selected{border-color:#3f4845;box-shadow:0 0 0 2px #3f48451f}.note-color-list i{width:18px;height:18px}.delete-note{width:100%;height:36px;padding:0 8px;border:0;border-top:1px solid var(--line);display:flex;align-items:center;gap:8px;background:transparent;color:#a24437;cursor:pointer;font-size:12px}.delete-note svg{width:16px}.note-text{width:100%;height:100%;padding:2px 5px 5px;resize:none;border:0;outline:0;color:#373323;background:transparent;font-size:16px;line-height:1.65;letter-spacing:.02em;touch-action:manipulation}.note-text::placeholder{color:#3e37246b}.statusbar{min-height:52px;padding:12px clamp(20px,4vw,64px);display:flex;align-items:center;justify-content:space-between;gap:16px;color:var(--muted);background:var(--paper);border-top:1px solid var(--line);font-size:12px}.statusbar p{margin:0;display:flex;align-items:center;gap:8px}.status-dot{width:7px;height:7px;border-radius:50%;background:#568a6e;box-shadow:0 0 0 3px #568a6e1f}button:focus-visible,summary:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid rgba(45,108,124,.4);outline-offset:3px}html[data-theme=dark]{color-scheme:dark;--ink:#e8e5dd;--muted:#a8aaa4;--line:rgba(230,232,226,.14);--paper:#202324;--accent:#d8654c;background:#17191a}[data-theme=dark] body{background:radial-gradient(circle at 14% 3%,rgba(196,143,54,.08),transparent 24rem),#17191a}[data-theme=dark] .app-header{background:#1e2122f2;border-bottom-color:#ffffff1a}[data-theme=dark] .brand-mark{filter:saturate(.82) brightness(.88);box-shadow:4px 5px #00000047}[data-theme=dark] .search-box,[data-theme=dark] .theme-toggle{background:#292d2e;border-color:#ffffff24;color:#b8bcb9}[data-theme=dark] .search-box:focus-within{background:#303536;border-color:#6d9fac}[data-theme=dark] .project-controls select,[data-theme=dark] .icon-button,[data-theme=dark] .secondary-button{background:#292d2e;color:#d7d9d4;border-color:#ffffff21}[data-theme=dark] .icon-button:hover,[data-theme=dark] .secondary-button:hover,[data-theme=dark] .theme-toggle:hover{background:#353a3b;color:#fff}[data-theme=dark] .status-tabs{background:#17191a;border-color:#ffffff1f}[data-theme=dark] .status-tabs button{color:#a5aaa7}[data-theme=dark] .status-tabs button[aria-pressed=true]{background:#343839;color:#fff;box-shadow:0 1px 5px #0000004d}[data-theme=dark] .add-popover,[data-theme=dark] .note-popover{background:#292d2e;border-color:#ffffff21;box-shadow:0 14px 34px #0000006b}[data-theme=dark] .add-color-grid button{background:#343839;color:#e2e3df;border-color:#ffffff1f}[data-theme=dark] .board{background-color:#504a40;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px),repeating-linear-gradient(22deg,rgba(0,0,0,.045) 0 1px,transparent 1px 7px);border-color:#ffffff17;box-shadow:inset 0 0 60px #0003,0 12px 28px #0000002e}[data-theme=dark] .empty-state{color:#ebe8de99}[data-theme=dark] .empty-state h2{color:#f5f2e9c2}[data-theme=dark] .completion-zone{background:#1f3328c7;border-color:#76b18b7a;color:#b7d8c1}[data-theme=dark] .completion-zone small{color:#8eaa97}[data-theme=dark] .completion-zone.drag-over{background:#264b33f0;border-color:#7fc394}[data-theme=dark] .note{box-shadow:5px 8px 16px #00000057}[data-theme=dark] .statusbar{background:#202324;color:#a8aaa4;border-top-color:#ffffff1a}@media(max-width:1000px){.control-bar{flex-wrap:wrap}.project-controls{order:1}.board-actions{order:2}.status-tabs{order:3;width:100%}.status-tabs button{flex:1}.board{min-height:max(680px,calc(100vh - 270px))}}@media(max-width:767px){:root{--note-width:min(220px, calc(100vw - 64px) );--note-height:176px}.header-main{min-height:122px;padding:12px 16px;flex-wrap:wrap;gap:10px}.brand{gap:10px}.brand-mark{width:36px;height:36px}h1{font-size:18px}.brand p{display:none}.header-tools{width:100%}.search-box{width:100%;min-height:46px}.theme-toggle{width:46px;height:46px}.control-bar{padding:10px 12px;gap:10px}.project-controls{width:100%}.control-label{display:none}.project-controls select{flex:1;width:auto;min-width:0}.icon-button{width:42px;height:42px}.board-actions{width:100%;justify-content:flex-end}.status-tabs{order:2}.board-actions{order:3}.secondary-button,.add-button{min-height:44px}.board-wrap{padding:10px}.board{min-height:max(660px,calc(100vh - 365px));border-radius:7px}.completion-zone{left:10px;right:10px;bottom:10px;min-height:76px}.note{padding:11px;grid-template-rows:38px 1fr}.complete-button{width:38px;height:38px;margin:-6px 0 0 -5px}.note-menu summary{width:42px;height:40px;margin:-7px -7px 0 0}.empty-state{padding:24px 24px 120px}.empty-state h2{font-size:19px}.statusbar{min-height:46px;padding:10px 16px}.statusbar p:first-child{font-size:11px}.add-popover{position:fixed;inset:auto 12px 58px;width:auto}.add-color-grid button{height:48px}}@media(max-width:420px){.secondary-button span,.add-button span{display:none}.secondary-button,.add-button{width:48px;padding:0}.statusbar p:last-child{display:none}.completion-zone small{display:none}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important}}