:root{--bg: oklch(97% .012 80);--surface: oklch(99% .005 80);--fg: oklch(20% .02 60);--muted: oklch(48% .015 60);--border: oklch(89% .012 80);--accent: oklch(58% .16 35);--paper: var(--bg);--paper-tint: color-mix(in oklch, var(--surface) 88%, var(--border) 12%);--ink: var(--fg);--pencil: var(--muted);--grid: var(--border);--rule: color-mix(in oklch, var(--border) 65%, var(--muted) 35%);--highlight: oklch(92% .12 95);--note-yellow: oklch(96% .09 100);--note-pink: oklch(92% .06 15);--note-blue: oklch(91% .055 225);--serif: "Iowan Old Style", "Charter", Georgia, serif;--hand: "Patrick Hand", "Architects Daughter", "Caveat", cursive;--hand-bold: "Caveat", "Patrick Hand", cursive;--mono: "IBM Plex Mono", ui-monospace, monospace}*{box-sizing:border-box}body{margin:0;color:var(--ink);background:radial-gradient(circle,color-mix(in oklch,var(--fg) 14%,transparent) 1px,transparent 1.4px) 0 0 / 22px 22px,var(--paper);font:16px/1.5 var(--hand)}button,input{font:inherit}button{color:inherit;cursor:pointer}.page-shell{max-width:1320px;margin:0 auto;padding:32px 48px 56px}.head{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:end;padding-bottom:14px;border-bottom:2px solid var(--ink);transform:rotate(-.25deg)}.head h1,.login-card h1{display:flex;gap:18px;align-items:center;margin:0;font:800 52px/1 var(--serif)}.head h1 em{font-style:italic}.pin,.pill{display:inline-flex;align-items:center;gap:8px;font:11px/1 var(--mono);letter-spacing:.14em;color:var(--accent);background:var(--surface)}.pin{padding:6px 10px;border:1.5px dashed var(--accent);transform:rotate(-2.2deg)}.pin .x{width:6px;height:6px;background:var(--accent);transform:rotate(45deg)}.pill{padding:5px 9px;border:1.5px solid var(--pencil);border-radius:999px;color:var(--pencil)}.meta{font:11px/1.4 var(--mono);color:var(--pencil);letter-spacing:.14em;text-align:right;text-transform:uppercase}.meta b{color:var(--ink)}.header-actions{display:flex;gap:12px;align-items:center;justify-content:flex-end}.tabs{display:flex;gap:8px;flex-wrap:wrap;padding:18px 0 12px;transform:rotate(.3deg)}.tab{position:relative;display:inline-flex;gap:8px;align-items:center;min-height:38px;padding:10px 14px;border:0;background:transparent;color:var(--pencil);transform:rotate(-.5deg)}.tab.active{color:var(--ink)}.tab.active:before{content:"";position:absolute;z-index:-1;background:var(--highlight);transform:skew(-8deg)}.tab.active:before{top:4px;right:-2px;bottom:6px;left:-2px;opacity:.88}.num{padding:4px 6px;border:1.5px solid currentColor;font:11px/1 var(--mono)}.glyph{display:inline-block;width:14px;height:14px;border:1.5px solid currentColor}.canvas,.login-card,.login-preview{position:relative;border:3px solid var(--ink);border-radius:14px;background:repeating-linear-gradient(0deg,var(--grid) 0 1px,transparent 1px 24px),repeating-linear-gradient(90deg,var(--grid) 0 1px,transparent 1px 24px),var(--paper-tint);box-shadow:6px 8px 0 -4px color-mix(in oklch,var(--fg) 18%,transparent)}.canvas{padding:26px 26px 32px;transform:rotate(-.35deg)}.section-label{display:flex;gap:12px;align-items:center;margin-bottom:12px;flex-wrap:wrap}.section-label h2{margin:0;font:800 30px/1 var(--serif)}.lede{max-width:68ch;margin:0 0 18px;color:var(--pencil);font:17px/1.5 var(--hand)}.browser{display:flex;gap:10px;align-items:center;padding:9px 14px;margin-bottom:16px;border:2px solid var(--pencil);border-radius:999px;background:var(--surface)}.dots{display:flex;gap:6px}.dots span{width:11px;height:11px;border:1.5px solid var(--pencil);border-radius:50%}.url{flex:1;color:var(--pencil)}.user{color:var(--pencil)}.logout{min-height:34px;padding:7px 12px;border:1.5px dashed var(--pencil);border-radius:999px;background:var(--surface);color:var(--pencil);white-space:nowrap}.topbar{display:flex;gap:12px;align-items:flex-end;justify-content:space-between;flex-wrap:wrap}.greeting{color:var(--pencil);font:14px/1.4 var(--hand)}.name{margin:2px 0 4px;font:italic 800 26px/1 var(--serif)}.name span{color:var(--pencil);font:17px/1 var(--hand)}.toggle-row{display:inline-flex;gap:6px;padding:4px;border:1.5px solid var(--pencil);border-radius:999px}.tag{padding:6px 10px;border-radius:999px;color:var(--pencil)}.tag.active{color:var(--ink);background:var(--highlight)}.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:16px 0}.kpi,.panel,.project-card,.day-card{border:2px solid var(--pencil);border-radius:10px;background:var(--surface)}.kpi{padding:14px}.label{color:var(--pencil);font:12px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase}.value{margin-top:8px;color:var(--ink);font:800 44px/1 var(--serif);-webkit-text-stroke:.35px var(--pencil)}.small{margin-top:6px;color:var(--pencil);font-size:12px;font-style:italic}.panels{display:grid;grid-template-columns:1.4fr 1fr;gap:14px;margin-top:28px}.panel{padding:14px}.panel h3{display:flex;gap:8px;align-items:center;margin:0 0 14px;color:var(--pencil);font:700 15px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase}.dot{width:10px;height:10px;border-radius:50%;background:var(--pencil)}.scribble{display:block;width:100%;height:160px}.axis{color:var(--pencil)}.feed{padding:12px 14px;border:2px dashed var(--pencil);border-radius:10px;background:var(--surface)}.lines span{display:block;height:8px;margin:8px 0;border-radius:4px;background:var(--pencil);opacity:.16}.lines span:nth-child(1){width:78%}.lines span:nth-child(2){width:58%}.lines span:nth-child(3){width:68%}.lines span:nth-child(4){width:48%}.kanban-sketch{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:12px;margin-top:14px;border:2px dashed var(--pencil);border-radius:10px;background:color-mix(in oklch,var(--surface) 92%,var(--border) 8%)}.kanban-sketch .col{min-height:120px;padding:8px;border:1.5px solid var(--pencil);border-radius:8px;background:var(--surface)}.kanban-sketch h4{margin:0 0 8px;color:var(--muted);font:12px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase}.card{height:22px;margin-bottom:6px;border:1.5px solid var(--rule);border-radius:6px;background:repeating-linear-gradient(-45deg,transparent,transparent 3px,color-mix(in oklch,var(--pencil) 25%,transparent) 3px,color-mix(in oklch,var(--pencil) 25%,transparent) 4px)}.project-grid,.calendar-grid,.notes-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:18px}.project-card,.day-card{padding:16px}.card-head{display:flex;gap:12px;align-items:flex-start;justify-content:space-between}.card-head h3,.day-card h3{margin:0;font:800 24px/1.1 var(--serif)}.card-head span{padding:4px 8px;border:1.5px solid var(--pencil);border-radius:999px;color:var(--pencil);white-space:nowrap}.project-card p,.day-card p{margin:12px 0;color:var(--pencil)}.progress{height:12px;overflow:hidden;border:1.5px solid var(--ink);border-radius:999px;background:var(--surface)}.progress span{display:block;height:100%;background:var(--highlight)}.task-board{grid-template-columns:repeat(4,minmax(0,1fr))}.task-card{display:grid;gap:6px;padding:9px;margin-bottom:8px;border:1.5px solid var(--rule);border-radius:8px;background:var(--paper-tint)}.task-card strong{line-height:1.2}.task-card span{color:var(--pencil);font-size:13px}.note-card{min-height:150px;padding:18px;box-shadow:4px 6px 0 -2px color-mix(in oklch,var(--fg) 20%,transparent)}.note-card span{color:var(--pencil);font:12px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase}.note-card p{margin:16px 0 0;font-size:22px;line-height:1.25}.tone-1{background:var(--note-yellow);transform:rotate(-1.2deg)}.tone-2{background:var(--note-pink);transform:rotate(1.4deg)}.tone-3{background:var(--note-blue);transform:rotate(-.5deg)}.notion-page{max-width:850px;margin:18px auto 0;padding:0 0 30px;background:var(--surface);border:2px solid var(--pencil)}.notion-cover{height:120px;background:linear-gradient(135deg,color-mix(in oklch,var(--accent) 30%,transparent),transparent),repeating-linear-gradient(90deg,var(--border) 0 1px,transparent 1px 18px);border-bottom:2px solid var(--pencil)}.notion-page h1{margin:24px 42px 18px;font:800 42px/1.1 var(--serif)}.block{margin:10px 42px;padding:10px 12px;border-radius:8px}.block.callout{border:1.5px solid var(--rule);background:var(--note-yellow)}.block.heading{margin-top:24px;font:700 13px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--pencil)}.block.todo{display:flex;gap:10px;align-items:center}.block.todo span{width:16px;height:16px;border:1.5px solid var(--ink)}.block.quote{border-left:3px solid var(--accent);color:var(--pencil);font-style:italic}.sticky{position:absolute;top:18px;right:26px;max-width:250px;padding:10px 12px;background:var(--note-yellow);box-shadow:4px 6px 0 -2px color-mix(in oklch,var(--fg) 20%,transparent);transform:rotate(2.6deg)}.tape{position:absolute;top:-10px;left:28px;width:72px;height:18px;background:color-mix(in oklch,var(--fg) 16%,transparent);transform:rotate(-4deg)}.login-page{display:grid;grid-template-columns:minmax(320px,560px) minmax(280px,440px);gap:28px;align-items:center;min-height:100vh;max-width:1120px;padding:48px;margin:0 auto}.login-card,.login-preview{padding:28px}.login-form{display:grid;gap:14px;margin-top:24px}.login-form label{display:grid;gap:6px;color:var(--pencil)}.login-form input{width:100%;padding:12px 14px;border:2px solid var(--pencil);border-radius:8px;background:var(--surface);color:var(--ink)}.login-form button{min-height:46px;border:2px solid var(--ink);border-radius:8px;background:var(--highlight);color:var(--ink);font-weight:700}.compact{grid-template-columns:repeat(3,minmax(0,1fr))}@media(max-width:1100px){.kpis,.project-grid,.calendar-grid,.notes-grid,.task-board{grid-template-columns:repeat(2,minmax(0,1fr))}.sticky{display:none}}@media(max-width:820px){.page-shell,.login-page{padding:22px}.head,.login-page,.panels{grid-template-columns:1fr}.head h1,.login-card h1{font-size:38px}.meta{text-align:left}.header-actions{justify-content:flex-start}.kpis,.project-grid,.calendar-grid,.notes-grid,.task-board,.compact{grid-template-columns:1fr}.browser{align-items:flex-start;border-radius:14px}.user{display:none}.notion-page h1,.block{margin-right:22px;margin-left:22px}}