:root{--ink: #1a1d2e;--ink-soft: rgba(26, 29, 46, .6);--card: #ffffff;--card-edge: rgba(26, 29, 46, .08);--shadow: 0 10px 22px rgba(0, 0, 0, .12), 0 3px 6px rgba(0, 0, 0, .06);--card-shadow: 0 12px 32px rgba(20, 40, 80, .12), 0 4px 10px rgba(20, 40, 80, .06);--font: "Hanken Grotesk", "Helvetica Neue", Helvetica, Arial, sans-serif}*{box-sizing:border-box}html,body{margin:0;padding:0;height:100%;overflow:hidden;font-family:var(--font);color:var(--ink)}.viewport{position:fixed;top:0;right:0;bottom:0;left:0;cursor:grab;background-color:#5dcae3;background-image:linear-gradient(rgba(255,255,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.07) 1px,transparent 1px),radial-gradient(rgba(0,0,0,.05) .6px,transparent 1px),url(/wallpaper.svg);background-size:5px 5px,5px 5px,5px 5px,cover;background-repeat:repeat,repeat,repeat,no-repeat;background-position:0 0,0 0,0 0,center;background-attachment:fixed}.viewport.panning{cursor:grabbing}.canvas{position:absolute;left:0;top:0;width:0;height:0;transform-origin:0 0;transform-style:preserve-3d;will-change:transform}.note{--note-color: #fff48c;position:absolute;cursor:grab;-webkit-user-select:text;user-select:text;filter:drop-shadow(0 1px 2px rgba(0,0,0,.18)) drop-shadow(0 6px 12px rgba(0,0,0,.16));transition:filter .2s ease,transform .2s ease}.note-inner{position:relative;width:100%;height:200px;background-color:var(--note-color);border:1px solid #808080;padding:12px 16px 24px;display:flex;flex-direction:column;font-family:var(--font);font-size:15px;line-height:1.35;overflow:hidden;box-sizing:border-box}.note-date,.note-text{position:relative;z-index:1}.note-author{z-index:2}.note:hover{z-index:5;filter:drop-shadow(0 2px 3px rgba(0,0,0,.22)) drop-shadow(0 10px 18px rgba(0,0,0,.2))}.note.is-dragging{cursor:grabbing;z-index:20;transform:scale(1.02);filter:drop-shadow(0 4px 6px rgba(0,0,0,.25)) drop-shadow(0 16px 24px rgba(0,0,0,.25))}.note-texture-grid{background-image:linear-gradient(to right,rgba(0,0,0,.07) 1px,transparent 1px),linear-gradient(to bottom,rgba(0,0,0,.07) 1px,transparent 1px);background-size:18px 18px;background-position:0 12px}.note-texture-lines{background-image:repeating-linear-gradient(to bottom,transparent 0,transparent 23px,rgba(0,0,0,.12) 23px,rgba(0,0,0,.12) 24px);background-position:0 12px}.note-texture-dotted{background-image:radial-gradient(rgba(0,0,0,.22) 1.1px,transparent 1.5px);background-size:14px 14px;background-position:4px 12px}@keyframes paper-fade-in{0%{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}.note.is-new{animation:paper-fade-in .22s ease-out both}.note-date{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font-size:10px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:#0006;margin-bottom:4px}.note-date-time{font-weight:500;opacity:.85}.note-text strong{font-weight:700}.note-text em{font-style:italic}.note-text{flex:1;min-height:0;white-space:pre-wrap;word-break:break-word;overflow:hidden;font-weight:400;cursor:text}.note-emoji .note-text{display:flex;align-items:center;justify-content:center;font-size:96px;line-height:1}.note-author{position:absolute;bottom:4px;left:16px;right:16px;padding-right:4px;text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;font-style:italic;color:#00000073;pointer-events:none;box-sizing:border-box}.intro-card{position:fixed;top:22px;left:22px;z-index:10;width:280px;padding:20px 22px;background:var(--card);border:1px solid var(--card-edge);border-radius:18px;box-shadow:var(--card-shadow);font-family:var(--font);color:var(--ink)}.intro-tagline{margin:0 0 6px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.12em;color:var(--ink-soft)}.intro-title{margin:0 0 12px;font-family:var(--font);font-size:34px;font-weight:900;line-height:.95;letter-spacing:-.035em;color:var(--ink)}.intro-body{margin:0 0 10px;font-size:13px;line-height:1.4;color:#1f1f1fbf}.intro-hint{margin:0 0 10px;padding-top:10px;border-top:1px solid rgba(0,0,0,.08);font-size:11px;line-height:1.4;color:#1f1f1f80}.intro-credit{margin:0;padding-top:10px;border-top:1px solid rgba(0,0,0,.08);text-align:right;font-family:"Jersey 20",monospace;font-size:12px;letter-spacing:.01em;color:#0006}.intro-credit a{color:#0006;text-decoration:underline;text-underline-offset:2px;transition:color .1s ease}.intro-credit a:hover{color:#ec4899}.share-menu{position:absolute;bottom:calc(100% + 6px);left:0;right:0;display:flex;flex-direction:column;background:var(--card);border:1px solid var(--card-edge);border-radius:14px;box-shadow:var(--card-shadow);overflow:hidden;z-index:20;transform-origin:50% 100%;animation:bubble-pop .32s cubic-bezier(.34,1.56,.5,1) both}.share-menu[hidden]{display:none}.share-link{padding:8px 12px;font-size:13px;color:var(--ink);text-decoration:none;font-family:var(--font);transition:background 80ms ease}.share-link:not(:last-child){border-bottom:1px solid rgba(0,0,0,.06)}.share-link:hover{background:#0000000d}.composer{position:fixed;bottom:22px;left:50%;transform:translate(-50%);z-index:10;display:flex;flex-direction:column;gap:10px;padding:14px 16px 16px;background:var(--card);border:1px solid var(--card-edge);border-radius:18px;box-shadow:var(--card-shadow);width:min(640px,calc(100% - 24px))}.composer-chrome{display:flex;gap:6px;align-items:center;margin:-2px 0 4px}.window-dot{width:12px;height:12px;border-radius:50%;border:none;padding:0;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;font-family:-apple-system,BlinkMacSystemFont,SF Pro Text,system-ui,sans-serif;font-size:10px;line-height:1;color:#0000008c;transition:background .1s ease}.window-dot:after{content:"";opacity:0;transition:opacity .1s ease}.composer-chrome:hover .dot-red:after{content:"×";opacity:1}.composer-chrome:hover .dot-yellow:after{content:"−";opacity:1}.composer-chrome:hover .dot-green:after{content:"+";opacity:1;font-size:9px}.dot-red{background:#ff5f57}.dot-yellow{background:#febc2e}.dot-green{background:#28c840}.composer-controls{display:flex;align-items:center;gap:10px}.picker{position:relative}.picker-btn{width:30px;height:30px;border:1px solid rgba(0,0,0,.12);border-radius:8px;padding:0;cursor:pointer;background:#fff;transition:transform 80ms ease,border-color 80ms ease;display:inline-flex;align-items:center;justify-content:center}.picker-btn:hover{transform:translateY(-1px);border-color:#00000040}.color-btn{background:var(--picker-color, #fff48c)}.texture-btn{background-color:#fafaf8;background-image:var(--picker-texture, none);background-size:14px 14px;background-position:0 0}.picker-menu{position:absolute;bottom:calc(100% + 6px);left:0;padding:10px;background:var(--card);border:1px solid var(--card-edge);border-radius:14px;box-shadow:var(--card-shadow);z-index:30;transform-origin:16px 100%;animation:bubble-pop .32s cubic-bezier(.34,1.56,.5,1) both}.picker-menu[hidden]{display:none}@keyframes bubble-pop{0%{opacity:0;transform:scale(.35) translateY(10px)}55%{opacity:1;transform:scale(1.08) translateY(-2px)}78%{transform:scale(.97) translateY(1px)}to{opacity:1;transform:scale(1) translateY(0)}}.color-menu{display:grid;grid-template-columns:repeat(6,26px);gap:6px}.color-swatch{width:26px;height:26px;border-radius:50%;border:2px solid transparent;padding:0;cursor:pointer;transition:transform 80ms ease,border-color 80ms ease}.color-swatch:hover{transform:scale(1.12)}.color-swatch.is-active{border-color:var(--ink)}.texture-menu{display:grid;grid-template-columns:repeat(2,70px);gap:6px}.texture-option{height:50px;border:1px solid rgba(0,0,0,.1);border-radius:6px;background-color:#fafaf8;background-size:12px 12px;cursor:pointer;position:relative;padding:0;transition:border-color 80ms ease,transform 80ms ease}.texture-option:hover{transform:translateY(-1px);border-color:#00000040}.texture-option.is-active{border-color:var(--ink);border-width:2px}.texture-option-plain{background-image:none}.texture-option-grid{background-image:linear-gradient(to right,rgba(0,0,0,.18) 1px,transparent 1px),linear-gradient(to bottom,rgba(0,0,0,.18) 1px,transparent 1px)}.texture-option-lines{background-image:repeating-linear-gradient(to bottom,transparent 0,transparent 9px,rgba(0,0,0,.25) 9px,rgba(0,0,0,.25) 10px)}.texture-option-dotted{background-image:radial-gradient(rgba(0,0,0,.4) 1px,transparent 1.4px);background-size:8px 8px}.composer-text{position:relative;width:100%;display:block;resize:none;border:none;outline:none;padding:12px 14px 24px;font-family:var(--font);font-size:16px;line-height:1.4;font-weight:500;background:transparent;color:transparent;caret-color:var(--ink);min-height:88px;z-index:2;box-sizing:border-box;transition:min-height .18s ease}.composer-text::selection{color:var(--ink);background:#2659db38}.composer-textarea-wrap.is-selecting .composer-overlay{opacity:0}.composer-textarea-wrap.is-selecting .composer-text{color:var(--ink)}.composer.is-expanded .composer-text{min-height:168px}.composer.is-minimized .composer-text,.composer[hidden]{display:none}.composer-textarea-wrap{position:relative;background:#f6f8fa;border:1px solid var(--card-edge);border-radius:12px;overflow:hidden;transition:border-color .1s ease,background .1s ease}.composer-textarea-wrap:focus-within{border-color:#1a1d2e40;background:#fff}.composer.is-minimized .composer-textarea-wrap{display:none}.composer-overlay{position:absolute;top:0;right:0;bottom:0;left:0;padding:12px 14px 24px;font-family:var(--font);font-size:16px;line-height:1.4;font-weight:500;color:var(--ink);white-space:pre-wrap;word-break:break-word;overflow-wrap:break-word;overflow:hidden;pointer-events:none;z-index:1;box-sizing:border-box;border:1px solid transparent;border-radius:12px}.composer-overlay strong{font-weight:700}.composer-overlay em{font-style:italic}.composer-overlay .md-mark{color:#1a1d2e59;font-weight:400;font-style:normal}@keyframes composer-limit-shake{0%,to{transform:translate(0)}15%{transform:translate(-6px)}35%{transform:translate(5px)}55%{transform:translate(-3px)}75%{transform:translate(2px)}}.composer.limit-hit .composer-textarea-wrap{animation:composer-limit-shake .38s ease-out;border-color:#ef4d5a;background:#fff5f5}.composer.is-minimized.limit-hit .composer-controls{animation:composer-limit-shake .38s ease-out}.composer.is-minimized.limit-hit .composer-name{border-color:#ef4d5a;background:#fff5f5}.zoom-controls{position:fixed;top:22px;right:22px;z-index:10;display:flex;flex-direction:column;gap:8px}.zoom-btn{width:42px;height:42px;border-radius:12px;border:1px solid var(--card-edge);background:var(--card);color:var(--ink);box-shadow:var(--card-shadow);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;padding:0;transition:transform .1s ease,box-shadow .14s ease}.zoom-btn:hover{transform:translateY(-1px);box-shadow:0 14px 28px #14285029,0 4px 10px #1428501a}.zoom-btn:active{transform:translateY(0)}.composer-launcher{position:fixed;bottom:22px;left:22px;z-index:10;width:252px;height:50px;padding:0 14px;background:var(--ink);color:#fff;border:none;border-radius:10px;font-family:var(--font);font-size:20px;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;background-size:200% 100%;background-position:0% 50%;transition:background .24s ease}.composer-launcher:hover{color:#fff;background-image:linear-gradient(90deg,#ff4d6d,#ff8c42,#ffd84d,#4ade80,#38bdf8,#a78bfa,#ec4899,#ff4d6d);animation:rainbow-slide 2.4s linear infinite}.composer-launcher[hidden]{display:none}.composer-text::placeholder{color:#1f1f1f66}.composer-name{flex:1;min-width:0;border:1px solid var(--card-edge);background:#f6f8fa;border-radius:10px;padding:8px 12px;font-family:var(--font);font-size:13px;font-weight:500;color:var(--ink);outline:none;transition:border-color .1s ease,background .1s ease}.composer-name::placeholder{color:#1a1d2e66}.composer-name:focus{border-color:#1a1d2e40;background:#fff}.composer-add{border:none;background:var(--ink);color:#fff;font-family:var(--font);font-size:13px;font-weight:600;padding:8px 14px;border-radius:10px;cursor:pointer;background-size:200% 100%;background-position:0% 50%;transition:background .24s ease}.composer-add:hover{background-image:linear-gradient(90deg,#ff4d6d,#ff8c42,#ffd84d,#4ade80,#38bdf8,#a78bfa,#ec4899,#ff4d6d);animation:rainbow-slide 2.4s linear infinite;color:#fff}@keyframes rainbow-slide{0%{background-position:0% 50%}to{background-position:200% 50%}}.emoji-btn{width:30px;height:30px;border:1px solid rgba(0,0,0,.12);background:#fff;border-radius:8px;font-size:16px;cursor:pointer;padding:0;display:inline-flex;align-items:center;justify-content:center;transition:transform 80ms ease,border-color 80ms ease}.emoji-btn:hover{transform:translateY(-1px);border-color:#00000040}.emoji-picker-wrap{position:fixed;z-index:200;border-radius:12px;box-shadow:0 12px 30px #0003,0 2px 6px #00000014;overflow:hidden;transform-origin:50% 100%}.emoji-picker-wrap.is-open{animation:bubble-pop .32s cubic-bezier(.34,1.56,.5,1) both}.emoji-picker-wrap[hidden]{display:none}emoji-picker{--background: #fff;--border-color: rgba(0, 0, 0, .08);--border-radius: 12px;--emoji-size: 1.25rem;--num-columns: 8;width:340px;height:360px}.modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;display:flex;align-items:center;justify-content:center}.modal[hidden]{display:none}.modal-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;background:#14141473;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.modal-card{position:relative;background:var(--card);border:1px solid var(--card-edge);border-radius:22px;padding:30px 30px 22px;width:min(440px,calc(100% - 32px));box-shadow:0 24px 60px #00000040,0 6px 14px #0000001a}.modal-title{margin:0;font-family:var(--font);font-size:40px;font-weight:900;line-height:.95;letter-spacing:-.02em;color:var(--ink);text-transform:uppercase}.modal-subtitle{margin:6px 0 14px;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.14em;color:#1f1f1f8c}.modal-lede{margin:0 0 14px;font-size:14.5px;line-height:1.45;color:#1f1f1fbf}.modal-close{position:absolute;top:14px;right:14px;width:16px;height:16px;border-radius:50%;background:#ff5f57;border:none;padding:0;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:background .1s ease;z-index:1}.modal-close:hover{background:#ff4138}.modal-close-x{font-family:-apple-system,BlinkMacSystemFont,SF Pro Text,system-ui,sans-serif;font-size:14px;line-height:1;color:#0009;opacity:0;transition:opacity .1s ease}.modal-close:hover .modal-close-x{opacity:1}.modal-list{margin:0 0 18px;padding:0 0 0 18px;font-size:14px;line-height:1.55;color:#1f1f1fd9}.modal-list li{margin-bottom:4px}.modal-list li:last-child{margin-bottom:0}.modal-btn{width:100%;border:none;background:var(--ink);color:#fff;font-family:var(--font);font-size:14px;font-weight:700;padding:12px 16px;border-radius:10px;cursor:pointer;box-shadow:0 2px 6px #1a1d2e2e;transition:transform .1s ease,box-shadow .14s ease,background .1s ease}.modal-btn:hover{background:#2c3257;transform:translateY(-1px);box-shadow:0 10px 24px #1a1d2e5c,0 0 0 3px #1a1d2e1f}.modal-btn:active{transform:translateY(0);box-shadow:0 2px 6px #1a1d2e33}
