:root{--bg:#202124;--fg:#e8eaed;--panel:#292b30;--accent:#8ab4f8;--tile:#303134}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:var(--bg);color:var(--fg);font:14px system-ui,Arial,sans-serif}button,input,select{font:inherit}button{cursor:pointer}#backdrop{position:fixed;inset:0;z-index:-1;background-size:cover;background-position:center}header{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:13px 24px;min-height:58px}nav{display:flex;gap:13px;align-items:center;flex-wrap:wrap}a{color:inherit;text-decoration:none}a:hover{text-decoration:underline}nav button,.link{border:0;background:none;color:inherit;padding:6px;border-radius:7px}nav button:hover,.link:hover{background:#8883}main{max-width:820px;margin:clamp(65px,14vh,160px) auto 100px;text-align:center;padding:0 18px}#brand{font-size:clamp(48px,7vw,82px);font-weight:650;letter-spacing:-3px;margin-bottom:32px;text-shadow:0 2px 14px #0003}#search{display:flex;align-items:center;background:var(--tile);border:1px solid #7774;border-radius:30px;min-height:52px;box-shadow:0 2px 12px #0002}#search:focus-within{box-shadow:0 2px 20px #0005}#search input{background:none;border:0;color:var(--fg);flex:1;min-width:0;outline:0;padding:14px}#search select{background:none;color:var(--fg);border:0;max-width:115px;margin-left:15px;outline:0}select option{background:var(--panel);color:var(--fg)}#search button{border:0;background:none;color:var(--fg);font-size:29px;padding:0 18px}#network,#weather{margin-top:13px;color:var(--fg);opacity:.8}#shortcuts{display:flex;flex-wrap:wrap;justify-content:center;gap:18px;margin:35px auto;max-width:730px}.shortcut{width:92px;text-align:center;cursor:pointer;position:relative}.bubble{display:grid;place-items:center;width:58px;height:58px;margin:auto auto 9px;border-radius:50%;background:var(--tile);font-size:24px}.shortcut:hover .bubble{outline:2px solid var(--accent)}.shortcut span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#notes textarea{background:var(--tile);border:1px solid #7774;color:var(--fg);padding:14px;border-radius:14px;width:min(100%,560px);min-height:120px}#settingsButton{position:fixed;bottom:20px;right:22px;background:var(--tile);border:1px solid #7775;color:var(--fg);border-radius:24px;padding:11px 17px;font-size:20px}aside{position:fixed;right:0;top:0;bottom:0;width:min(380px,100%);background:var(--panel);box-shadow:-12px 0 45px #0006;z-index:10;padding:22px}aside[hidden]{display:none}.panelhead{display:flex;align-items:center;justify-content:space-between}.panelhead button{background:none;border:0;color:var(--fg);font-size:20px}.scroll{height:calc(100% - 62px);overflow-y:auto;padding-right:6px}.scroll h3{border-top:1px solid #8884;padding-top:18px;margin-top:24px}.scroll label,dialog label{display:flex;flex-direction:column;align-items:flex-start;gap:7px;margin:14px 0}.scroll label:has(input[type=checkbox]),dialog label:has(input[type=checkbox]){flex-direction:row;align-items:center}.scroll input:not([type=checkbox]),.scroll select,dialog input{max-width:100%;padding:9px;border-radius:8px;border:1px solid #8886;background:var(--tile);color:var(--fg)}.scroll button,dialog button{background:var(--tile);color:var(--fg);border:1px solid #8886;padding:9px 12px;border-radius:8px;margin:4px}.scroll button:hover,dialog button:hover{border-color:var(--accent)}.hint{opacity:.6;line-height:1.5}dialog{border:1px solid #8887;border-radius:16px;background:var(--panel);color:var(--fg);padding:24px;min-width:min(380px,95vw)}dialog::backdrop{background:#0009}dialog menu{display:flex;justify-content:flex-end;padding:0}#toast{position:fixed;bottom:20px;left:20px;max-width:70vw;padding:10px 16px;border-radius:10px;background:var(--panel);box-shadow:0 4px 20px #0005;display:none}.foldermenu{position:absolute;background:var(--panel);padding:12px;box-shadow:0 8px 24px #0006;border-radius:12px;z-index:5;min-width:180px;text-align:left}.foldermenu a{display:block;padding:8px}.foldermenu a:hover{background:#8883}@media(max-width:600px){header{padding:10px;align-items:flex-start}main{margin-top:90px}#brand{letter-spacing:-2px}#shortcuts{gap:10px}.shortcut{width:76px}#search select{max-width:83px;margin-left:8px}}
