:root{--paper-bg: #f7f3ea;--paper-card: #fffdf6;--paper-aged: #f0ead6;--rule-color: #c8d8e8;--rule-gap: 32px;--margin-line: #f4a7a7;--ink-dark: #1a1a4e;--ink-blue: #2c3e7a;--ink-mid: #4a4a6a;--ink-light: #8888aa;--hi-yellow: #ffe566;--hi-yellow-bg: rgba(255, 229, 102, .45);--hi-coral: #ff6b6b;--hi-coral-bg: rgba(255, 107, 107, .18);--hi-teal: #3bbfb0;--hi-teal-bg: rgba(59, 191, 176, .18);--hi-blue: #6b9eff;--hi-blue-bg: rgba(107, 158, 255, .18);--hi-green: #5cb85c;--hi-green-bg: rgba(92, 184, 92, .18);--font-hand: "Caveat", cursive;--font-print: "Patrick Hand", cursive;--shadow-paper: 2px 4px 12px rgba(90, 75, 40, .15), 4px 8px 24px rgba(90, 75, 40, .08);--shadow-lift: 4px 8px 24px rgba(90, 75, 40, .22), 8px 16px 40px rgba(90, 75, 40, .12);--radius-page: 4px;--radius-sticker: 8px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px}body{font-family:var(--font-print);background-color:var(--paper-bg);color:var(--ink-dark);min-height:100vh;background-image:repeating-linear-gradient(transparent,transparent calc(var(--rule-gap) - 1px),var(--rule-color) calc(var(--rule-gap) - 1px),var(--rule-color) var(--rule-gap));background-attachment:fixed}.notebook-bg{min-height:100vh;position:relative}.notebook-bg:before{content:"";position:fixed;left:72px;top:0;bottom:0;width:2px;background:var(--margin-line);opacity:.6;pointer-events:none;z-index:0}.spiral-binding{position:fixed;top:0;left:0;width:36px;height:100vh;background:#b0b8c8;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding-top:20px;gap:28px;z-index:100;box-shadow:2px 0 8px #00000026}.spiral-ring{width:22px;height:22px;border:3px solid #7a8499;border-radius:50%;background:var(--paper-bg);box-shadow:inset 0 1px 3px #0003}.notebook-page{background:var(--paper-card);border-radius:var(--radius-page);box-shadow:var(--shadow-paper);padding:36px 40px;position:relative}.notebook-page:before{content:"";position:absolute;bottom:-4px;left:4px;right:-4px;height:100%;background:#ede7d4;border-radius:var(--radius-page);z-index:-1}.notebook-page:after{content:"";position:absolute;bottom:-8px;left:8px;right:-8px;height:100%;background:#e4dcca;border-radius:var(--radius-page);z-index:-2}h1,h2,h3,h4{font-family:var(--font-hand);color:var(--ink-dark);line-height:1.2}h1{font-size:3rem;font-weight:700}h2{font-size:2.2rem;font-weight:600}h3{font-size:1.7rem;font-weight:600}.scribble-title{display:inline-block;position:relative;margin-bottom:8px}.scribble-title:after{content:"";position:absolute;bottom:-6px;left:0;right:0;height:4px;background:var(--hi-coral);border-radius:2px;transform:rotate(-.8deg) scaleX(1.02);opacity:.85}.hand-input{font-family:var(--font-hand);font-size:1.25rem;color:var(--ink-dark);background:transparent;border:none;border-bottom:2px solid var(--ink-blue);outline:none;width:100%;padding:6px 4px 4px;margin-bottom:18px;transition:border-color .2s;display:block}.hand-input::placeholder{color:var(--ink-light);font-style:italic}.hand-input:focus{border-bottom-color:var(--hi-coral)}.hand-select{font-family:var(--font-hand);font-size:1.2rem;color:var(--ink-dark);background:var(--hi-yellow-bg);border:none;border-bottom:2px solid var(--ink-blue);outline:none;padding:6px 8px;border-radius:4px 4px 0 0;cursor:pointer;margin-bottom:16px}.ink-btn{font-family:var(--font-hand);font-size:1.25rem;font-weight:600;color:var(--paper-card);background:var(--ink-dark);border:none;border-radius:4px;padding:10px 28px;cursor:pointer;display:inline-block;position:relative;transform:rotate(-.5deg);box-shadow:3px 3px #1a1a4e66;transition:transform .15s,box-shadow .15s;letter-spacing:.5px}.ink-btn:hover{transform:rotate(-1.5deg) scale(1.04);box-shadow:4px 4px #1a1a4e80}.ink-btn:active{transform:rotate(0) scale(.97);box-shadow:1px 1px #1a1a4e4d}.ink-btn:disabled{opacity:.55;cursor:not-allowed;transform:none}.stamp-btn{font-family:var(--font-hand);font-size:1.1rem;font-weight:600;color:var(--ink-dark);background:var(--hi-yellow);border:2px solid var(--ink-dark);border-radius:4px;padding:8px 20px;cursor:pointer;position:relative;transform:rotate(.3deg);box-shadow:3px 3px 0 var(--ink-dark);transition:transform .15s,box-shadow .15s}.stamp-btn:hover{transform:rotate(1.2deg) scale(1.03);box-shadow:4px 4px 0 var(--ink-dark)}.stamp-btn:active{transform:rotate(0) scale(.97);box-shadow:1px 1px 0 var(--ink-dark)}.stamp-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.ghost-btn{font-family:var(--font-hand);font-size:1.1rem;color:var(--hi-blue);background:none;border:none;cursor:pointer;padding:4px 0;text-decoration:underline wavy var(--hi-blue);text-underline-offset:3px;transition:color .15s}.ghost-btn:hover{color:var(--hi-coral);text-decoration-color:var(--hi-coral)}.sticky-note{display:inline-block;font-family:var(--font-hand);font-size:1.4rem;font-weight:600;background:var(--hi-yellow);color:var(--ink-dark);padding:6px 20px 8px;border-radius:2px;transform:rotate(-1deg);box-shadow:2px 3px 8px #5a4b2833;margin-bottom:16px}.sticky-note.teal{background:#a8ece6}.sticky-note.coral{background:#ffb3b3}.sticky-note.blue{background:#b3ccff}.highlight-yellow{background:var(--hi-yellow-bg);padding:0 4px;border-radius:2px}.highlight-coral{background:var(--hi-coral-bg);padding:0 4px;border-radius:2px}.highlight-teal{background:var(--hi-teal-bg);padding:0 4px;border-radius:2px}.highlight-blue{background:var(--hi-blue-bg);padding:0 4px;border-radius:2px}.notebook-nav{position:sticky;top:0;z-index:90;background:var(--paper-aged);border-bottom:3px solid var(--ink-blue);padding:0 100px;display:flex;align-items:flex-end;gap:4px;min-height:56px;box-shadow:0 3px 12px #5a4b2826}.nav-brand{font-family:var(--font-hand);font-size:1.8rem;font-weight:700;color:var(--ink-dark);margin-right:24px;align-self:center;padding-bottom:4px;letter-spacing:-.5px}.nav-brand span{color:var(--hi-coral)}.nav-tab{font-family:var(--font-hand);font-size:1.1rem;color:var(--ink-mid);background:var(--paper-card);border:2px solid var(--ink-blue);border-bottom:none;border-radius:8px 8px 0 0;padding:8px 18px 6px;cursor:pointer;text-decoration:none;transition:background .15s,color .15s,transform .15s;position:relative;top:0;transform:rotate(-.5deg)}.nav-tab:hover{background:var(--hi-yellow-bg);color:var(--ink-dark);transform:rotate(.3deg) translateY(-3px)}.nav-tab.active{background:var(--hi-yellow);color:var(--ink-dark);font-weight:700;transform:rotate(-.3deg) translateY(-3px)}.nav-logout{font-family:var(--font-hand);font-size:1.05rem;color:var(--hi-coral);background:none;border:none;cursor:pointer;margin-left:auto;align-self:center;padding:4px 8px;text-decoration:underline wavy var(--hi-coral);text-underline-offset:3px;transition:color .15s}.nav-logout:hover{color:var(--ink-dark)}.page-content{padding:40px 100px 60px;max-width:1100px;margin:0 auto}.page-content-narrow{max-width:480px;margin:60px auto;padding:0 20px}.page-content-medium{max-width:720px;margin:40px auto;padding:0 100px}.msg-error{font-family:var(--font-hand);font-size:1.1rem;color:var(--hi-coral);background:var(--hi-coral-bg);border-left:3px solid var(--hi-coral);padding:8px 14px;border-radius:0 4px 4px 0;margin:10px 0}.msg-info{font-family:var(--font-hand);font-size:1.1rem;color:#1a7a4c;background:var(--hi-green-bg);border-left:3px solid var(--hi-green);padding:8px 14px;border-radius:0 4px 4px 0;margin:10px 0}.chat-box{background:var(--paper-card);border:2px solid var(--ink-blue);border-radius:4px;min-height:260px;max-height:400px;overflow-y:auto;padding:16px;margin:16px 0;background-image:repeating-linear-gradient(transparent,transparent 31px,var(--rule-color) 31px,var(--rule-color) 32px);background-size:100% 32px;background-attachment:local}.chat-msg{font-family:var(--font-hand);font-size:1.15rem;margin-bottom:12px;display:flex;gap:8px;align-items:flex-start}.chat-label{font-weight:700;min-width:36px;padding:1px 6px;border-radius:4px;font-size:1rem}.chat-label.user{background:var(--hi-coral-bg);color:var(--hi-coral)}.chat-label.ai{background:var(--hi-teal-bg);color:var(--hi-teal)}.chat-text{color:var(--ink-dark);line-height:1.5}.chat-input-row{display:flex;gap:10px;align-items:center;margin-top:8px}.report-output{font-family:var(--font-print);font-size:1rem;white-space:pre-wrap;background:var(--paper-card);border:2px solid var(--ink-blue);border-left:4px solid var(--margin-line);border-radius:0 4px 4px 0;padding:16px 20px 16px 28px;margin-top:16px;line-height:2;background-image:repeating-linear-gradient(transparent,transparent 31px,var(--rule-color) 31px,var(--rule-color) 32px);background-size:100% 32px;background-attachment:local}.client-list{list-style:none;display:flex;flex-direction:column;gap:10px;margin-top:16px}.client-item{display:flex;align-items:center;gap:14px;font-family:var(--font-hand);font-size:1.25rem;color:var(--ink-dark)}.client-item:before{content:"☐";font-size:1.4rem;color:var(--ink-light)}.doodle-star:after{content:" ✦";color:var(--hi-yellow)}.doodle-arrow:before{content:"→ ";color:var(--hi-teal);font-family:var(--font-hand)}@keyframes blink{0%,80%,to{opacity:0}40%{opacity:1}}.thinking-dots span{animation:blink 1.4s infinite both;font-family:var(--font-hand);font-size:1.4rem;color:var(--ink-light)}.thinking-dots span:nth-child(2){animation-delay:.2s}.thinking-dots span:nth-child(3){animation-delay:.4s}.post-list{list-style:none;display:flex;flex-direction:column;gap:6px;margin-top:10px}.post-item{font-family:var(--font-print);font-size:1rem;color:var(--ink-mid);padding:6px 10px;border-bottom:1px dashed var(--rule-color);display:flex;justify-content:space-between;align-items:center}.post-item .post-likes{font-family:var(--font-hand);font-size:1.1rem;color:var(--hi-coral);background:var(--hi-coral-bg);padding:2px 8px;border-radius:12px;white-space:nowrap}@keyframes pageIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.page-animate{animation:pageIn .35s ease both}@keyframes wobble{0%,to{transform:rotate(-.5deg)}25%{transform:rotate(1deg)}75%{transform:rotate(-1deg)}}.hint-text{font-family:var(--font-hand);font-size:.95rem;color:var(--ink-light);font-style:italic;margin-top:-10px;margin-bottom:10px}.nb-divider{border:none;border-top:1px dashed var(--rule-color);margin:24px 0}@media (max-width: 768px){.notebook-bg:before{left:48px}.spiral-binding{width:24px}.spiral-ring{width:16px;height:16px}.notebook-nav{padding:0 12px 0 40px}.page-content{padding:24px 20px 40px}.page-content-medium{padding:0 20px}h1{font-size:2.2rem}h2{font-size:1.8rem}}