:root{color:#e4dfed;background:#09090e;color-scheme:dark}
body{min-height:100vh;background:radial-gradient(ellipse at 50% 15%,#291b4138,transparent 58%),radial-gradient(ellipse at 90% 90%,#15243430,transparent 45%),#09090e}
body:before{content:"";position:fixed;inset:0;pointer-events:none;background-image:radial-gradient(circle,#bcb0d840 .7px,transparent 1px);background-size:91px 107px;opacity:.22;z-index:0}
header,main{position:relative}
.brand{color:#e6e0f1;letter-spacing:1px;font-size:29px}
.brand:before{content:"";display:inline-block;width:20px;height:20px;border:1px solid #a08cc9;border-radius:50%;margin-right:12px;box-shadow:0 0 20px #8d65bb30,inset 5px 0 9px #9b79c92b;vertical-align:middle}
.brand span{color:#a196ae;letter-spacing:2.4px;margin-top:10px}
button{color:#ded5eb;border-color:#483b55;background:#1a1722;transition:background .15s,border-color .15s}
button:hover{background:#2a2235;border-color:#9b7db7}
button:focus-visible,[contenteditable]:focus-visible{outline-color:#b29bd8}
.card{background:linear-gradient(145deg,#17131ef5,#101016fa);border-color:#36303f;box-shadow:0 28px 90px #0006,0 0 70px #75509508}
.welcome{position:relative;overflow:hidden;max-width:760px;padding:76px 60px}
.welcome:after{content:"";position:absolute;right:-55px;top:-80px;width:230px;height:230px;border-radius:50%;border:1px solid #9275b32b;box-shadow:0 0 70px #74558b10,inset 0 0 70px #74558b0a;pointer-events:none}
.eyebrow{color:#b299c9;letter-spacing:3px}
h1{color:#eee8f5;line-height:1.14;font-size:54px}
p{color:#b2a7be}
.primary{background:#b6a1d2;color:#18101f;border-color:#b6a1d2;box-shadow:0 0 28px #aa7fd417}
.primary:hover{background:#c8b4e3;border-color:#c8b4e3}
.small{color:#a195af}
#status{color:#bfacd6}
#toolbar{border-color:#302936;background:#ffffff02;border-radius:14px 14px 0 0}
#toolbar button{color:#c6b9d4}
#toolbar button:hover{background:#a180c319;color:#f1e8ff}
#editor{color:#ded7e7;caret-color:#c1a6e0;line-height:1.8}
#editor:empty:before{color:#a394b5}
#editor td,#editor th{border-color:#665574}
#editor pre{background:#08070c;padding:15px;border-radius:5px}
#editor blockquote{border-left:2px solid #82669c;padding-left:20px;color:#c4b3d5}
#editor a{color:#c8a7ed}
footer{border-color:#292330;color:#a195af}
aside{background:#29202d;border-color:#765771;color:#e0c5dd}
aside p{color:#c2aec4}
#message{color:#e8a4b0}
@media(max-width:650px){.brand{font-size:23px}.brand span{font-size:8px;letter-spacing:1.8px}.welcome{padding:45px 26px}h1{font-size:39px}}
@media(prefers-reduced-motion:reduce){button{transition:none}}
