:root{font-family:Noto Sans JP,sans-serif;color:#252525;background:#f4f2ed;font-synthesis:none;--ink: #282826;--muted: #74726d;--paper: #faf9f6;--line: #d9d6cf;--acid: #d9ff49}*{box-sizing:border-box}.theme-toggle{width:44px;height:44px;flex:0 0 44px;border:1px solid var(--line);border-radius:50%;background:var(--paper);color:var(--ink);cursor:pointer;font-size:25px;line-height:1}.theme-toggle:focus-visible{outline:3px solid #8daa31;outline-offset:3px}html[data-theme=dark]{color-scheme:dark;color:#eeeee8;background:#202321;--ink: #eeeee8;--muted: #b7bcb5;--paper: #292d29;--line: #494e47}[data-theme=dark] body{background:radial-gradient(circle at 14% 0%,#31382e,transparent 30rem),#202321}[data-theme=dark] .app-header{background:#242824ed}[data-theme=dark] .board-wrap{border-color:#51574e}[data-theme=dark] .board-toolbar{background:#30362f;border-color:#494e47}[data-theme=dark] .board-search{background:#272d27;border-color:#494e47}[data-theme=dark] .board{background-color:#242924;background-image:radial-gradient(#4c5549 .75px,transparent .75px)}[data-theme=dark] .search-field{background:#1d221e;border-color:#626b5e}[data-theme=dark] .search-field input{color:#eeeee8}[data-theme=dark] .eyebrow,[data-theme=dark] .note-count,[data-theme=dark] .drag-hint,[data-theme=dark] .style-label,[data-theme=dark] .search-result-status,[data-theme=dark] footer,[data-theme=dark] .empty-state{color:#b7bcb5}[data-theme=dark] .empty-state p{color:#eeeee8}[data-theme=dark] .clear-search{color:#b7bcb5}[data-theme=dark] .clear-search:hover{background:#394236;color:#fff}[data-theme=dark] .style-option.is-selected{border-color:var(--acid);background:#48513f;box-shadow:0 0 0 2px #30362f,0 0 0 3px #a2bb69}[data-theme=dark] .add-button{background:var(--acid);color:#282826;border-color:var(--acid);box-shadow:3px 3px #667b33}[data-theme=dark] .brand-mark span,[data-theme=dark] .brand-mark span:before{background:#282826}[data-theme=dark] .sticky-note{color-scheme:light}[data-theme=dark] .sticky-note:focus-within{outline-color:var(--acid)}@media(max-width:520px){.app-header .header-actions{gap:12px}}html{min-width:320px;background:#f4f2ed}body{margin:0;min-width:320px;min-height:100vh;background:radial-gradient(circle at 14% 0%,rgba(255,255,255,.9),transparent 30rem),#f4f2ed}button,textarea{font:inherit}button{-webkit-tap-highlight-color:transparent}.app-shell{min-height:100vh}.app-header{height:76px;padding:0 clamp(24px,5vw,72px);border-bottom:1px solid var(--line);background:#faf9f6e0;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);display:flex;align-items:center;justify-content:space-between;position:relative;z-index:20}.brand{color:var(--ink);text-decoration:none;display:inline-flex;align-items:center;gap:12px;font-size:16px;font-weight:700;letter-spacing:.03em}.brand-name{white-space:nowrap}.brand-mobile-break{display:none}.brand-mark{width:31px;height:31px;background:var(--acid);border:1.5px solid var(--ink);border-radius:2px;display:grid;place-items:center;transform:rotate(-4deg);box-shadow:3px 3px 0 var(--ink)}.brand-mark span,.brand-mark span:before{content:"";width:13px;height:1.5px;background:var(--ink);display:block}.brand-mark span:before{transform:rotate(90deg)}.header-actions{display:flex;align-items:center;gap:25px}.save-status{color:var(--muted);margin:0;font-size:12px;display:flex;align-items:center;gap:8px}.save-status span{width:7px;height:7px;border-radius:50%;background:#8daa31;box-shadow:0 0 0 3px #8daa311f}.save-status.is-saving span{background:#d09a2f}.add-button{min-height:44px;padding:0 19px;border:1.5px solid var(--ink);border-radius:3px;background:var(--ink);color:#fff;display:inline-flex;align-items:center;gap:10px;cursor:pointer;font-size:13px;font-weight:600;box-shadow:3px 3px 0 var(--acid);transition:transform .14s ease,box-shadow .14s ease,background .14s ease}.add-button:hover{background:#111;transform:translate(-1px,-1px);box-shadow:5px 5px 0 var(--acid)}.add-button:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--acid)}.add-icon,.add-icon:after{width:13px;height:1.5px;background:currentColor;display:block}.add-icon:after{content:"";transform:rotate(90deg)}.workspace{width:min(1180px,calc(100% - 48px));margin:0 auto;padding:72px 0 42px}.intro{display:grid;grid-template-columns:1fr auto;align-items:end;gap:40px;margin-bottom:50px}.eyebrow{margin:0 0 15px;color:#87847d;font-family:DM Sans,sans-serif;font-size:11px;font-weight:700;letter-spacing:.19em}h1{margin:0;max-width:760px;font-size:clamp(38px,4.4vw,62px);line-height:1.22;font-weight:500;letter-spacing:-.045em}.mobile-break{display:none}.intro-copy{margin:0 0 6px;color:var(--muted);font-size:13px;line-height:2;text-align:right}.board-wrap{border:1px solid #c9c6bf;border-radius:6px;background:var(--paper);overflow:hidden;box-shadow:0 18px 45px #2a28230f}.board-toolbar{height:52px;padding:0 19px;border-bottom:1px solid #d4d1ca;background:#eeece7;display:flex;align-items:center;justify-content:space-between}.board-label{font-family:DM Sans,sans-serif;font-size:11px;font-weight:700;letter-spacing:.13em;display:flex;align-items:center;gap:10px}.board-label-icon{width:14px;height:14px;border:1.5px solid #77746e;background:linear-gradient(#77746e,#77746e) 50% 3px / 8px 1px no-repeat,linear-gradient(#77746e,#77746e) 50% 6px / 8px 1px no-repeat,linear-gradient(#77746e,#77746e) 50% 9px / 8px 1px no-repeat}.note-count{color:#89867f;font-size:9px;letter-spacing:.07em;font-weight:600}.drag-hint{margin:0;color:#8d8a84;font-size:10px}.drag-hint span{margin-right:5px;font-size:13px}.toolbar-controls,.style-picker{display:flex;align-items:center}.toolbar-controls{gap:20px}.style-picker{gap:5px}.style-label{margin-right:4px;color:#88857e;font-family:DM Sans,sans-serif;font-size:8px;font-weight:700;letter-spacing:.13em}.style-option{width:30px;height:30px;padding:0;border:1px solid transparent;border-radius:50%;background:transparent;display:grid;place-items:center;cursor:pointer;overflow:hidden;position:relative;transition:border-color .12s ease,background .12s ease,transform .12s ease}.style-option:hover{background:#ffffffb3;transform:translateY(-1px)}.style-option.is-selected{border-color:#373632;background:#fff;box-shadow:0 0 0 2px #eeece7,0 0 0 3px #37363247}.simple-swatch{width:15px;height:15px;border:1px solid rgba(40,38,30,.35);border-radius:2px;background:#f6ef75;transform:rotate(-5deg)}.style-dog-option span,.style-cat-option span{width:27px;height:27px;display:block;background-position:center 35%;background-repeat:no-repeat;background-size:44px auto}.style-dog-option span{background-image:url(/assets/sticky-dog.png)}.style-cat-option span{background-image:url(/assets/sticky-cat.png)}.board-search{min-height:56px;padding:8px 18px;border-bottom:1px solid #dedbd4;background:#f8f7f3;display:flex;align-items:center;gap:14px}.search-field{width:min(380px,100%);height:38px;border:1px solid #d0cdc5;border-radius:4px;background:#fff;display:flex;align-items:center;transition:border-color .12s ease,box-shadow .12s ease}.search-field:focus-within{border-color:#7b786f;box-shadow:0 0 0 3px #d9ff496b}.search-icon{width:13px;height:13px;margin-left:13px;border:1.5px solid #77746e;border-radius:50%;position:relative;flex:0 0 auto}.search-icon:after{content:"";position:absolute;width:6px;height:1.5px;right:-5px;bottom:-3px;border-radius:1px;background:#77746e;transform:rotate(45deg)}.search-field input{min-width:0;flex:1;height:100%;padding:0 10px 0 12px;border:0;outline:0;background:transparent;color:#34332f;font-size:12px;appearance:none}.search-field input::-webkit-search-cancel-button{display:none}.search-field input::placeholder{color:#a09d96}.clear-search{width:34px;height:34px;margin-right:2px;padding:0;border:0;border-radius:50%;background:transparent;color:#77746e;display:grid;place-items:center;cursor:pointer}.clear-search[hidden]{display:none}.clear-search:hover{background:#efede8;color:#252525}.clear-search span,.clear-search span:after{width:12px;height:1.5px;background:currentColor;display:block}.clear-search span{transform:rotate(45deg)}.clear-search span:after{content:"";transform:rotate(90deg)}.search-result-status{margin:0;color:#8d8a84;font-size:10px}.board{position:relative;min-height:570px;overflow:hidden;background-color:#f8f7f3;background-image:radial-gradient(#c9c6be .75px,transparent .75px);background-size:17px 17px;touch-action:none}.empty-state{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#a09d96;pointer-events:none}.empty-state[hidden]{display:none}.empty-state p{margin:18px 0 7px;color:#63615c;font-size:14px;font-weight:600}.empty-state>span:last-child{font-size:11px}.empty-note{width:52px;height:52px;border:1.5px solid #a9a69f;background:#fff6;transform:rotate(-5deg);position:relative}.empty-note:before,.empty-note:after,.empty-note i{content:"";position:absolute;width:19px;height:1px;left:13px;background:#b0ada6}.empty-note:before{top:16px}.empty-note:after{top:23px}.empty-note i{top:30px}.sticky-note{--note-color: #f6ef75;position:absolute;width:220px;height:190px;padding:11px 13px 15px;border:1px solid rgba(58,54,43,.26);background:var(--note-color);box-shadow:4px 5px 11px #221f1624;display:flex;flex-direction:column;transform:rotate(var(--tilt, 0deg));transform-origin:center;transition:box-shadow .14s ease,transform .14s ease;-webkit-user-select:none;user-select:none;touch-action:none}.sticky-note.is-filtered-out{display:none}.sticky-note.is-dragging{box-shadow:9px 13px 23px #221f163b;transform:rotate(0) scale(1.025);z-index:1000!important;cursor:grabbing}.sticky-note:focus-within{outline:2px solid rgba(36,36,34,.65);outline-offset:2px}.note-topbar{min-height:27px;display:flex;align-items:flex-start;justify-content:space-between;cursor:grab}.drag-dots{color:#322f256b;font-size:19px;line-height:1;transform:rotate(90deg)}.delete-note{width:30px;height:30px;margin:-5px -5px 0 0;padding:0;border:0;border-radius:50%;background:transparent;display:grid;place-items:center;cursor:pointer;color:#28261f9e;transition:background .12s ease,color .12s ease}.delete-note:hover{background:#ffffff6b;color:#252525}.delete-note span,.delete-note span:after{width:13px;height:1.5px;background:currentColor;display:block}.delete-note span{transform:rotate(45deg)}.delete-note span:after{content:"";transform:rotate(90deg)}.note-text{width:100%;flex:1;resize:none;border:0;outline:0;padding:3px 5px;background:transparent;color:#343229;font-size:14px;line-height:1.75;-webkit-user-select:text;user-select:text;touch-action:manipulation}.note-text::placeholder{color:#3b382c78}.note-animal{display:none;position:absolute;right:-3px;bottom:-3px;width:126px;height:92px;object-fit:contain;object-position:right bottom;pointer-events:none;-webkit-user-select:none;user-select:none;z-index:0}.sticky-note.has-animal{background-image:linear-gradient(115deg,rgba(255,255,255,.26),transparent 38%),radial-gradient(circle at 18% 14%,rgba(255,255,255,.48) 0 1px,transparent 1.5px);background-size:auto,11px 11px}.sticky-note.has-animal .note-animal{display:block}.sticky-note.has-animal .note-text{padding-bottom:55px;position:relative;z-index:1}.sticky-note.has-animal .note-corner{z-index:2}.note-corner{position:absolute;right:-1px;bottom:-1px;width:0;height:0;border-style:solid;border-width:0 0 17px 17px;border-color:transparent transparent rgba(255,255,255,.5) transparent;filter:drop-shadow(-1px -1px 0 rgba(66,62,50,.17))}footer{width:min(1180px,calc(100% - 48px));min-height:72px;margin:0 auto;border-top:1px solid var(--line);color:#8c8982;display:flex;align-items:center;justify-content:space-between;font-size:9px;letter-spacing:.12em}footer p:last-child{letter-spacing:0;font-size:10px}@media(max-width:820px){.app-header{padding:0 24px}.workspace{width:calc(100% - 40px);padding-top:52px}.intro{grid-template-columns:1fr;gap:19px;margin-bottom:36px}h1{font-size:clamp(37px,7vw,52px)}.intro-copy{text-align:left}.board{min-height:620px}.save-status{display:none}footer{width:calc(100% - 40px)}}@media(max-width:520px){.app-header{height:68px;padding:0 16px}.brand{gap:8px;font-size:11px;line-height:1.42;letter-spacing:0}.brand-name{white-space:normal}.brand-mobile-break{display:initial}.brand-mark{width:27px;height:27px;box-shadow:2px 2px 0 var(--ink)}.add-button{min-width:46px;min-height:46px;padding:0;justify-content:center;box-shadow:3px 3px 0 var(--acid)}.add-button>span:last-child{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.add-icon,.add-icon:after{width:16px;height:2px}.workspace{width:calc(100% - 24px);padding:41px 0 28px}.eyebrow{margin-bottom:11px;font-size:10px}h1{font-size:clamp(32px,10.5vw,42px);line-height:1.3}.mobile-break{display:initial}.intro-copy{font-size:12px;line-height:1.85}.intro{margin-bottom:29px}.board-toolbar{height:50px;padding:0 14px}.board-search{min-height:60px;padding:9px 12px;gap:8px}.search-field{height:42px}.search-field input{font-size:13px}.clear-search{width:40px;height:40px}.search-result-status{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.drag-hint{font-size:0}.drag-hint span{font-size:17px;margin:0}.toolbar-controls{gap:8px}.style-label{display:none}.style-option{width:34px;height:34px}.board{min-height:640px;background-size:15px 15px}.sticky-note{width:178px;height:164px;padding:9px 10px 13px}.note-topbar{min-height:31px}.delete-note{width:38px;height:38px;margin:-7px -5px 0 0}.delete-note span,.delete-note span:after{width:15px;height:2px}.note-text{padding:1px 4px;font-size:14px;line-height:1.65}.note-animal{width:106px;height:78px}.sticky-note.has-animal .note-text{padding-bottom:46px}.empty-state>span:last-child{max-width:220px;text-align:center;line-height:1.7}footer{width:calc(100% - 24px);min-height:85px;flex-direction:column;justify-content:center;gap:8px;text-align:center}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important}}