html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}@font-face{font-family:JetBrainsMono;src:url(/assets/JetBrainsMono-Dh36KTnx.ttf) format("truetype");font-weight:400;font-style:normal}:root{--base-font-size: 16px;--font-main: "JetBrainsMono", monospace;--font-size-sm: .8rem;--font-size-md: 1rem;--color-bg: #222;--color-btn-bg: #333;--color-text: #eee;--color-text-dark: #111;--color-text-muted: #aaa;--color-text-dim: #888;--color-border: #666;--color-disabled: #555;--color-accent: goldenrod;--color-danger: firebrick;--color-danger-border: #c00}*,*:before,*:after{box-sizing:border-box}html,body{margin:0;padding:0}body{font-size:var(--base-font-size);font-family:var(--font-main);color:var(--color-text);background-color:var(--color-bg)}button{cursor:pointer;font-family:var(--font-main);font-size:var(--base-font-size);border-radius:0}input,textarea{font-family:var(--font-main);font-size:var(--base-font-size)}#app .scroll-btn{position:fixed;right:0;width:2rem;height:2rem;font-size:var(--font-size-md);background-color:var(--color-btn-bg);padding:0}#app .scroll-btn.top{top:0}#app .scroll-btn.bottom{bottom:0}#app .app-main{width:100%;max-width:700px;margin:1rem auto 10rem;padding:0 1rem}#app .notes{list-style:none;padding:0;margin:0}#loading{height:100vh;width:100vw;display:flex;justify-content:center;align-items:center;padding:0 1rem}#loading .logo{max-width:6rem}#loading .logo img{width:100%;height:100%}#login{text-align:center;margin-top:4rem}#header{display:flex;justify-content:space-between;align-items:center;width:100%;border:1px solid var(--color-text);padding:.5rem 1rem;margin-bottom:1rem}#header .logo{display:flex;align-items:center}#header .logo .sphere{max-width:3rem;max-height:3rem;margin-right:.2rem}#header .logo .sphere img{width:100%;height:100%}#header .logo h1{font-size:3.5em;font-weight:lighter;letter-spacing:-.1em;line-height:0;margin:0;padding-bottom:.6rem}#header .btn-logout{color:var(--color-text);background-color:var(--color-btn-bg);border:1px solid var(--color-border);padding:.25rem .5rem}#create-note-workspace{display:flex;justify-content:center;border:1px solid var(--color-text);padding:1.5rem 0;margin-bottom:1rem}#create-note-workspace .inner{flex:1 1 auto;max-width:375px;text-align:center;padding:0 .75rem}#create-note-workspace .inner textarea{width:100%;min-height:8rem;font-size:var(--font-size-sm);color:var(--color-text-dark);background-color:var(--color-text);padding:.5rem;border:1px solid var(--color-disabled);resize:vertical;margin-bottom:.5rem}#create-note-workspace .inner .btn-clear{color:gray;background-color:transparent;margin-right:.5rem;border:none}#create-note-workspace .inner .btn-clear:disabled{cursor:not-allowed}#create-note-workspace .inner .btn-create{font-weight:700;background-color:transparent;color:var(--color-text);border:1px solid var(--color-text);padding:.25rem .5rem}#create-note-workspace .inner .btn-create:disabled{color:gray;border-color:var(--color-disabled);cursor:not-allowed}.note-card{border:1px solid var(--color-text);padding:1rem .75rem;margin-bottom:1rem}.note-card .header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}.note-card .header .id{color:var(--color-text-muted);font-size:var(--font-size-sm)}.note-card .header .btn-copy{background:none;border:none}.note-card .content{font-size:var(--font-size-sm);line-height:1.5;padding:.5rem 0;width:100%;display:block}.note-card .content.edit{color:var(--color-text-dark);background-color:var(--color-text);border:1px solid var(--color-text);resize:vertical;min-height:10rem;field-sizing:content;padding:.5rem}.note-card .content.view{color:var(--color-text);background-color:transparent;white-space:pre-wrap;overflow-wrap:break-word}.note-card .date{margin:.5rem 0}.note-card .date small{color:var(--color-text-dim);font-size:var(--font-size-sm)}.note-card .actions{display:flex}.note-card .actions.edit{justify-content:flex-end;gap:.5rem}.note-card .actions.view{justify-content:space-between}.note-card .actions .btn-cancel{padding:.5rem 1rem;color:var(--color-text);background-color:var(--color-btn-bg);border:1px solid var(--color-border)}.note-card .actions .btn-cancel:disabled{cursor:not-allowed}.note-card .actions .btn-save{padding:.5rem 1rem;background-color:var(--color-accent);color:var(--color-text-dark);font-weight:700;border:1px solid var(--color-accent)}.note-card .actions .btn-save:disabled{background-color:var(--color-disabled);border-color:var(--color-disabled);cursor:not-allowed}.note-card .actions .btn-edit{font-size:var(--font-size-sm);color:var(--color-text);background-color:var(--color-btn-bg);border:1px solid var(--color-border);padding:.25rem .5rem}.note-card .actions .btn-delete{font-size:var(--font-size-sm);background-color:var(--color-danger);color:#fff;border:1px solid var(--color-danger-border);padding:.25rem .5rem}