.notes-page{--note-ink:var(--text-primary);--note-soft:var(--text-secondary);--note-faint:#6f6b62;--note-rule:#ffffff14;--note-accent:#e7cc99;min-height:100svh;color:var(--note-ink);font-family:var(--font-geist), ui-sans-serif, system-ui, sans-serif;padding:140px 20px 120px}.note-page{padding-bottom:160px}.notes-column{width:100%;max-width:640px;margin:0 auto}.notes-title{font:400 clamp(34px, 4vw, 46px)/1.1 var(--font-playfair), Georgia, serif;letter-spacing:-.03em;text-wrap:balance;margin:0 0 22px}.notes-intro{color:var(--note-soft);text-wrap:pretty;margin:0 0 14px;font-size:16px;line-height:1.7}.notes-intro a{color:var(--note-ink);text-underline-offset:4px;-webkit-text-decoration:underline #ffffff40;text-decoration:underline #ffffff40}.notes-intro a:hover{-webkit-text-decoration-color:var(--note-accent);text-decoration-color:var(--note-accent)}.notes-section-title{font:400 24px/1.2 var(--font-playfair), Georgia, serif;letter-spacing:-.02em;margin:64px 0 18px}.note-list{border-top:1px solid var(--note-rule);margin:0;padding:0;list-style:none}.note-list li{border-bottom:1px solid var(--note-rule);justify-content:space-between;align-items:baseline;gap:16px;padding:14px 0;display:flex}.note-list__title{color:var(--note-ink);background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;font-size:16px;line-height:1.45;text-decoration:none;transition:background-size .35s cubic-bezier(.2,.75,.25,1),color .2s}.note-list__title:hover{color:var(--note-accent);background-size:100% 1px}.note-list__meta{flex-shrink:0;align-items:center;gap:10px;display:flex}.note-list__count{color:var(--note-faint);font-variant-numeric:tabular-nums;white-space:nowrap;font-size:12px}.note-tag{color:#e7cc99;font:500 10.5px/1.3 var(--font-geist), sans-serif;letter-spacing:.07em;text-transform:uppercase;white-space:nowrap;background:#e7cc991a;border-radius:999px;padding:3px 8px;display:inline-block}.note-tag[data-category=design]{color:#a9c6e2;background:#9fc0e01a}.note-tag[data-category=craft]{color:#cdb2e6;background:#c7a6e01a}.note-tag[data-category=process]{color:#b3d6a6;background:#a6d0981a}.note-tag[data-category=product]{color:#f1b59a;background:#f0a9881a}.note-tag[data-category=life]{color:#f2d58c;background:#f2d17e1a}.note-tag[data-category=ai]{color:#9fdcd5;background:#8fd6cf1a}.note-back{color:var(--note-soft);align-items:center;gap:7px;margin-bottom:32px;font-size:13px;text-decoration:none;display:inline-flex}.note-back:hover{color:var(--note-ink)}.note-header{margin-bottom:36px}.note-header .notes-title{margin-bottom:14px}.note-meta{color:var(--note-faint);align-items:center;gap:12px;margin:0;font-size:13px;display:flex}.note-body{color:#d8d6cf;font-size:17px;line-height:1.75}.note-body>*{margin:0 0 22px}.note-body h2{font:400 26px/1.25 var(--font-playfair), Georgia, serif;letter-spacing:-.02em;color:var(--note-ink);margin:48px 0 16px}.note-body h3{color:var(--note-ink);margin:36px 0 12px;font-size:18px;font-weight:600}.note-body strong{color:var(--note-ink);font-weight:600}.note-body em{font-family:var(--font-playfair), Georgia, serif;font-size:1.04em}.note-body a{color:var(--note-ink);text-underline-offset:4px;-webkit-text-decoration:underline #e7cc9980;text-decoration:underline #e7cc9980}.note-body a:hover{-webkit-text-decoration-color:var(--note-accent);text-decoration-color:var(--note-accent)}.note-body ul,.note-body ol{padding:0;list-style:none}.note-body li{margin:0 0 10px;padding-left:30px;position:relative}.note-body ul>li:before{content:"→";width:20px;height:20px;color:var(--note-accent);background:#ffffff0f;border-radius:50%;place-items:center;font-size:11px;line-height:1;display:grid;position:absolute;top:.15em;left:0}.note-body ol{counter-reset:note-step}.note-body ol>li{counter-increment:note-step}.note-body ol>li:before{content:counter(note-step);width:20px;height:20px;color:var(--note-accent);background:#e7cc991f;border-radius:50%;place-items:center;font-size:11px;font-weight:600;line-height:1;display:grid;position:absolute;top:.15em;left:0}.note-body blockquote{border-left:2px solid var(--note-accent);font:italic 400 20px/1.6 var(--font-playfair), Georgia, serif;color:var(--note-ink);margin-left:0;padding-left:20px}.note-body code{background:#ffffff10;border-radius:5px;padding:2px 6px;font-size:.88em}.note-body pre{background:#ffffff0a;border-radius:10px;padding:16px 18px;font-size:14px;line-height:1.6;overflow-x:auto}.note-body pre code{background:0 0;padding:0}.note-body img{border-radius:10px;max-width:100%;height:auto}.note-body hr{border:0;border-top:1px solid var(--note-rule);margin:40px 0}.note-more{margin-top:72px}.note-more .notes-section-title{margin-top:40px}.note-divider{color:var(--note-faint);align-items:center;gap:16px;font-size:16px;display:flex}.note-divider:before,.note-divider:after{content:"";background:var(--note-rule);flex:1;height:1px}.note-reactions{left:50%;bottom:max(20px, env(safe-area-inset-bottom));z-index:40;-webkit-backdrop-filter:blur(18px)saturate(140%);scrollbar-width:none;background:#161714f2;border:1px solid #ffffff1c;border-radius:999px;gap:4px;max-width:calc(100vw - 24px);padding:6px;display:flex;position:fixed;overflow-x:auto;transform:translate(-50%);box-shadow:0 12px 40px #0008,inset 0 1px #ffffff12}.note-reactions::-webkit-scrollbar{display:none}.note-reaction{height:38px;color:var(--note-soft);font:500 12.5px var(--font-geist), sans-serif;white-space:nowrap;cursor:pointer;background:0 0;border:1px solid #0000;border-radius:999px;flex-shrink:0;align-items:center;gap:7px;padding:0 13px;transition:background .2s,color .2s,border-color .2s;display:inline-flex}.note-reaction:hover{color:var(--note-ink);background:#ffffff0d}.note-reaction.is-active{color:var(--note-ink);background:#e7cc991a;border-color:#e7cc9955}.note-reaction:focus-visible{outline:2px solid var(--note-accent);outline-offset:2px}.note-reaction__emoji{font-size:16px;line-height:1}.note-reaction.is-popped .note-reaction__emoji{animation:.5s cubic-bezier(.3,1.6,.5,1) note-pop}.note-reaction__count{color:var(--note-faint);font-variant-numeric:tabular-nums}.note-reaction.is-active .note-reaction__count{color:var(--note-accent)}@keyframes note-pop{0%{transform:scale(1)}40%{transform:scale(1.5)rotate(-10deg)}to{transform:scale(1)}}@media (max-width:767px){.notes-page{padding:112px 20px 100px}.note-page{padding-bottom:130px}.note-body{font-size:16.5px}.note-list li{flex-direction:column;gap:6px}.note-reaction{padding:0 12px}.note-reaction__label{display:none}}@media (prefers-reduced-motion:reduce){.note-reaction.is-popped .note-reaction__emoji{animation:none}.note-list__title{transition:none}}
