:root{color:#231f20;background:#e9e2d4;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}button,input,textarea{font:inherit}button{border:1px solid #73665a;border-radius:6px;background:#fffaf1;color:#231f20;cursor:pointer;min-height:36px;padding:0 12px}button:hover{background:#f3eadb}.app-shell{min-height:100vh;padding:18px}.cover-shell{align-items:center;background:radial-gradient(circle at 50% 20%,rgba(255,250,241,.74),transparent 34%),#d8cfbd;display:grid;min-height:100vh;padding:24px;perspective:1400px;place-items:center}.notebook-cover{aspect-ratio:7 / 9;background:linear-gradient(90deg,rgba(35,31,32,.18) 0 14px,transparent 14px 100%),linear-gradient(135deg,#493f35,#231f20);border:1px solid rgba(35,31,32,.42);border-radius:8px;box-shadow:0 28px 60px #231f2047,inset 18px 0 28px #0000003d;color:#fffaf1;display:grid;justify-items:center;max-height:680px;max-width:430px;padding:56px 40px 40px;transform-origin:left center;transition:box-shadow .18s ease,transform .18s ease;width:min(78vw,430px)}.notebook-cover:hover{background:linear-gradient(90deg,rgba(35,31,32,.18) 0 14px,transparent 14px 100%),linear-gradient(135deg,#54483c,#2c2728);box-shadow:0 34px 72px #231f204d,inset 18px 0 28px #0000003d;transform:translateY(-3px)}.notebook-cover h1{align-self:center;font-size:46px;line-height:1.06;margin:0;text-align:center}.cover-label,.cover-hint{color:#fffaf1b8;font-size:13px;letter-spacing:.08em;text-transform:uppercase}.cover-hint{align-self:end;border-top:1px solid rgba(255,250,241,.35);padding-top:18px;width:100%}.notebook-cover-opening{animation:openNotebook .62s ease-in forwards}@keyframes openNotebook{0%{opacity:1;transform:rotateY(0) scale(1)}68%{opacity:1;transform:rotateY(-64deg) translate(-32px) scale(1.02)}to{opacity:0;transform:rotateY(-78deg) translate(-80px) scale(1.04)}}.app-header{align-items:center;display:flex;gap:16px;justify-content:space-between;margin:0 auto 8px;max-width:1040px;min-height:0}.app-header h1{font-size:28px;line-height:1.15;margin:0}.app-kicker{font-size:13px;margin:0 0 6px;text-transform:uppercase}.header-actions,.editor-toolbar,.mode-toggle{align-items:center;display:flex;flex-wrap:wrap;gap:8px}.editor-toolbar{background:#fffdf8c7;border:1px solid rgba(115,102,90,.22);border-radius:999px;box-shadow:0 10px 26px #231f2014;bottom:72px;left:50%;padding:6px;position:fixed;transform:translate(-50%);z-index:12}.icon-button{align-items:center;background:transparent;border:0;border-radius:999px;display:inline-grid;height:38px;justify-content:center;min-height:38px;padding:0;width:38px}.icon-button:hover{background:#231f2014}.icon-button svg{fill:none;height:21px;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8;width:21px}.heading-button{background:transparent;border:0;border-radius:999px;font-size:12px;font-weight:700;height:38px;min-height:38px;padding:0;width:38px}.heading-button:hover{background:#231f2014}.mode-toggle{border:1px solid #73665a;border-radius:7px;overflow:hidden}.mode-toggle button{border:0;border-radius:0}.mode-toggle .active{background:#231f20;color:#fffaf1}.save-state{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:999px;box-shadow:0 8px 18px #231f2014;font-size:11px;left:10px;line-height:1;max-width:92px;overflow:hidden;padding:5px 7px;position:fixed;text-overflow:ellipsis;top:10px;white-space:nowrap;z-index:20}.save-state-saved{background:#dbead7}.save-state-unsaved,.save-state-saving{background:#fff0c2}.reader-shell{display:grid;margin:0 auto;max-width:1040px;min-height:calc(100vh - 36px);place-items:stretch}.paper-page{border:1px solid #c9bba8;border-radius:8px;box-shadow:0 18px 40px #231f202e;min-height:560px;overflow:hidden;padding:24px;position:relative}.paper-warm{background-color:#fffdf8}.paper-white{background-color:#fff}.paper-blue{background-color:#f4fbff}.paper-body{min-height:470px}.paper-ruled .paper-body{background-image:linear-gradient(180deg,transparent 0 31px,rgba(35,31,32,.08) 31px 32px);background-size:100% 32px}.paper-grid .paper-body{background-image:linear-gradient(180deg,transparent 0 31px,rgba(35,31,32,.06) 31px 32px),linear-gradient(90deg,transparent 0 31px,rgba(35,31,32,.05) 31px 32px);background-size:32px 32px}.paper-plain .paper-body{background-image:none}.floating-pencil{background:#231f20;box-shadow:0 12px 24px #231f2033,-12px 9px 0 -9px #231f2038;color:#fffaf1;position:fixed;right:20px;top:50%;transform:translateY(-50%) rotate(-18deg);z-index:12}.floating-pencil-drawn{border-radius:999px 6px 6px 999px;height:34px;min-height:34px;width:112px}.floating-pencil-drawn:before{background:#f2c45b;border-radius:999px 0 0 999px;content:"";height:100%;inset:0 24px 0 0;position:absolute}.floating-pencil-drawn:after{border-bottom:17px solid transparent;border-left:24px solid #231f20;border-top:17px solid transparent;content:"";position:absolute;right:-22px;top:0}.floating-pencil-drawn svg{color:#231f20;position:relative;z-index:1}.floating-pencil-check{height:42px;width:42px}.floating-pencil:hover{background:#3a3334;transform:translateY(calc(-50% - 2px)) rotate(-12deg)}.page-meta{color:#73665a;display:flex;font-size:13px;justify-content:space-between;margin-bottom:16px}.notebook-editor{background:transparent;border:0;color:#231f20;line-height:32px;min-height:470px;outline:none;resize:vertical;width:100%}.markdown-preview{line-height:32px;min-height:470px;overflow-wrap:anywhere}.markdown-preview>*{margin-block:0 32px}.markdown-preview h1,.markdown-preview h2,.markdown-preview h3{line-height:32px}.markdown-preview a{color:#1d5f8f;position:relative;z-index:4}.markdown-task-list-item{align-items:center;display:flex;gap:10px;list-style:none;margin-left:-24px}.markdown-checkbox{border:1.5px solid #73665a;border-radius:4px;display:inline-block;flex:0 0 auto;height:16px;position:relative;width:16px}.markdown-checkbox.checked:after{border:solid #231f20;border-width:0 2px 2px 0;content:"";height:8px;left:5px;position:absolute;top:1px;transform:rotate(45deg);width:4px}.tap-zones{display:grid;grid-template-columns:32% 36% 32%;inset:0;pointer-events:none;position:absolute;z-index:2}.tap-zone{background:transparent;border:0;border-radius:0;min-height:100%;opacity:0;padding:0;pointer-events:auto}.page-control-bar{align-items:center;background:#231f20eb;border-radius:8px 8px 0 0;bottom:0;color:#fffaf1;display:grid;gap:10px;left:50%;max-width:720px;padding:14px 18px;position:fixed;transform:translate(-50%);width:min(100% - 24px,720px);z-index:10}.page-control-count{font-weight:700;text-align:center}.page-control-actions{align-items:center;display:grid;gap:10px;grid-template-columns:auto 1fr auto auto}.page-control-actions input{width:100%}.settings-panel{background:#fffdf8;border:1px solid #c9bba8;border-radius:8px;box-shadow:0 18px 50px #231f2038;display:grid;gap:18px;padding:18px;position:fixed;right:18px;top:78px;width:min(360px,calc(100vw - 36px));z-index:12}.settings-panel-header{align-items:center;display:flex;justify-content:space-between}.settings-panel h2{font-size:18px;margin:0}.settings-section{border:0;display:grid;gap:10px;margin:0;padding:0}.settings-section legend{color:#73665a;font-size:13px;margin-bottom:8px}.settings-section label{align-items:center;display:flex;gap:8px}.upload-button{border:1px solid #73665a;border-radius:6px;cursor:pointer;justify-content:center;min-height:36px;padding:0 12px}.upload-button input{display:none}@media(min-width:900px){.app-shell{display:grid;grid-template-columns:minmax(0,1fr);padding:28px 112px 34px}.app-header{margin-bottom:0;max-width:980px;width:100%}.reader-shell{align-self:center;max-width:min(980px,calc(100vw - 224px));min-height:min(760px,calc(100vh - 68px));width:100%}.paper-page{min-height:min(760px,calc(100vh - 68px));padding:34px 46px 42px}.paper-body,.markdown-preview,.notebook-editor{min-height:min(630px,calc(100vh - 196px))}.floating-pencil{right:max(28px,calc((100vw - min(980px,calc(100vw - 224px)))/2 - 84px));top:50%;transform:translateY(-50%) rotate(-12deg)}.floating-pencil:hover{transform:translateY(calc(-50% - 2px)) rotate(-8deg)}.editor-toolbar{align-content:start;border-radius:999px;bottom:auto;display:grid;gap:8px;left:max(28px,calc((100vw - min(980px,calc(100vw - 224px)))/2 - 84px));padding:8px;top:96px;transform:none}.page-control-bar{border-radius:8px;bottom:28px;max-width:min(620px,calc(100vw - 260px));padding:12px 16px}.settings-panel{right:max(28px,calc((100vw - min(980px,calc(100vw - 224px)))/2 - 92px));top:158px}}@media(max-width:720px){.app-shell{padding:10px}.app-header{align-items:stretch;flex-direction:column}.reader-shell{min-height:calc(100vh - 24px)}.paper-page{min-height:520px;padding:18px}.editor-toolbar{bottom:72px;max-width:calc(100vw - 20px)}.floating-pencil{right:18px;top:50%}}