@import url("https://unpkg.com/tailwindcss@3.0.23/src/css/preflight.css");:root{--color-grey:#747474;--color-blue-dark:#1b31ff;--color-blue-dark-rgb:27,49,255;--color-blue-lighter:#f3f5ff;--color-blue-light:#d1d9ff;--hPaddingPage:20px;--wordFontSize:18px;--canvasWidth:600px;--canvasHeight:315px;--containerWidth:1067px;--dynamicCanvasWidth:min(600px,100vw - (2 * var(--hPaddingPage)))}@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:300;src:url(/fonts/JetBrainsMono-Light.woff2) format("woff2")}@font-face{font-family:JetBrains Mono;font-style:italic;font-weight:300;src:url(/fonts/JetBrainsMono-LightItalic.woff2) format("woff2")}@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:800;src:url(/fonts/JetBrainsMono-ExtraBold.woff2) format("woff2")}html{font-family:JetBrains Mono,monospace;font-weight:300;font-size:15px;line-height:140.5%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{overflow-x:hidden;min-height:100vh}body.scroll-lock,body.scroll-lock .page,body.scroll-lock .page>div{overflow:hidden;-webkit-touch-callout:"none";-webkit-user-select:none;-moz-user-select:none;user-select:none}strong{font-weight:800}.container{max-width:100vw;width:var(--containerWidth);margin:0 auto}@media (min-height:813px) and (min-width:768px){.container{height:100vh}}section{display:grid;grid-gap:7px;gap:7px}section.canvas{justify-self:start}header{display:grid;grid-gap:10px;gap:10px;align-content:start;-webkit-smoothing:subpixel-antialiased;-moz-smoothing:subpixel-antialiased}header a{text-decoration:underline;color:inherit}header,main{padding:20px}h1{font-weight:800;font-size:36px;line-height:38px;color:var(--color-blue-dark)}h1,header h2{letter-spacing:-.015em;display:grid;justify-self:start}header h2{font-size:20px;line-height:24px;color:#2c2c2c}.suggestion{font-style:italic;font-weight:300;font-size:12px;line-height:159.5%;color:#747474}.suggestion.warning{background-color:#ffefef;border:1px solid red;color:red;padding:10px;border-radius:5px}.scroll{position:absolute;bottom:-5px;left:0}.word{--fs:var(--dynamicCanvasWidth) * 18 /600;--lh:var(--fs) * (20/18);--pt:var(--fs) * (5/18);--pr:var(--fs) * (9/18);--pb:var(--fs) * (6/18);--pl:var(--fs) * (7/18);padding:calc(var(--pt)) calc(var(--pr)) calc(var(--pb)) calc(var(--pl));font-size:calc(var(--fs));line-height:calc(var(--lh));font-family:Georgia,Times New Roman,Times,serif;font-weight:400;color:#000;cursor:-webkit-grab;cursor:grab}.drag-overlay,.word{-webkit-user-select:none;-moz-user-select:none;user-select:none}.drag-overlay button{transform:scale(1) rotate(0deg);box-shadow:0 3px 1px rgba(0,0,0,.19);animation:liftAndTwist .1s linear forwards;border:1px solid #000;cursor:-webkit-grabbing;cursor:grabbing}@keyframes liftAndTwist{to{box-shadow:2px 6px 2px 1px rgba(0,0,0,.19);transform:scale(1.1) rotate(var(--random-rotation,3deg))}}.word-list__outer{overflow:hidden;width:calc(100% + 2 * var(--hPaddingPage));margin-left:calc(-1 * var(--hPaddingPage));-webkit-user-select:none;-moz-user-select:none;user-select:none}.word-list__inner{display:flex;flex-wrap:wrap;justify-content:flex-start;margin:0 auto;max-height:300px;gap:10px;--w:7300px;width:var(--w);min-width:var(--w);padding-bottom:41px;padding-left:var(--hPaddingPage)}.canvas__canvas button,.drag-overlay button,.word-list__inner button{background:#fff;border:1px solid #000;border-radius:2px;box-shadow:0 1px 1px rgba(0,0,0,.3)}.word-list__inner button:hover{box-shadow:0 1px 1px .5px rgba(0,0,0,.3)}.word-list__inner [aria-pressed=true]{opacity:.25;border-style:dashed;box-shadow:none}.canvas__canvas{width:calc(var(--dynamicCanvasWidth));aspect-ratio:1.904762;max-width:var(--canvasWidth);border:1px solid #333;box-shadow:4px 4px 0 #333;position:relative}.canvas__canvas.over{border-color:#000}.canvas__canvas button{position:absolute;box-shadow:1px 1px 0 0 #000}.canvas__canvas button[aria-pressed=true]{opacity:0}.page-main{display:grid;grid-gap:26px;gap:26px;align-content:center}section.words{position:relative}.drag-words{justify-self:center;display:grid;grid-auto-flow:column;grid-gap:21px;gap:21px;align-items:center}.drag-words svg{margin-top:-1px}.share-btn,.share-btns{display:grid;justify-content:center;grid-auto-flow:column;grid-gap:7px;gap:7px}.share-btn{align-items:center;padding:10px 10px 9px;border-radius:2px;background-color:#fff;border:1px solid #000;box-shadow:0 2px 1px rgba(0,0,0,.19);font-weight:400;font-size:20px;color:#000;transform:scale(1) rotate(0deg);transform-origin:center;transition:transform .1s ease-in-out,box-shadow .1s ease-in-out}.share-btn path{fill:#000;stroke:#000}.share-btn:hover{color:var(--color-blue-dark);fill:var(--color-blue-dark);border-color:var(--color-blue-dark);box-shadow:0 2px 2px rgba(var(--color-blue-dark-rgb),.25);transform:scale(1.05) rotate(1deg);z-index:1}.share-btn:hover path{fill:var(--color-blue-dark);stroke:var(--color-blue-dark)}.share-btn:active{transform:scale(1.1) rotate(2.5deg);box-shadow:0 1px 3px 2px rgba(var(--color-blue-dark-rgb),.25)}.share-btn.twitter{padding:11px;place-content:center}.squigglies{z-index:-1;position:absolute;top:0;right:0;height:100%;width:100%;opacity:.5}.squigglies path{fill:none;stroke:rgba(var(--color-blue-dark-rgb),.5);mix-blend-mode:color;stroke-width:1px;stroke-dasharray:10px 8px}@media (min-width:768px){:root{--dynamicCanvasWidth:min(600px,(3/5) * (min(100vw,var(--containerWidth))) - 2 * var(--hPaddingPage))}section.canvas{justify-self:stretch}.container{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr)}header{position:relative;padding-top:60px;gap:20px;border-right:1px solid var(--color-blue-dark)}h1{color:var(--color-blue-dark)}header h3{margin-top:20px}header:after{display:block;width:100vw;height:100%;position:absolute;top:0;right:0;z-index:-2}.word-list__outer{width:calc(100% + 2 * var(--hPaddingPage) + max(0px, calc((100vw - var(--containerWidth)) / 2)))}.squigglies{width:calc(100% + max(0px, calc((100vw - var(--containerWidth)) / 2)))}h1{font-size:44px;line-height:44px}}[data-backdrop]{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:rgba(0,0,0,.125);z-index:100;-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px)}[data-dialog]{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;max-width:500px;max-height:400px;overflow:auto;padding:20px;background-color:#fff;border-radius:4px;box-shadow:0 3px 1px rgba(0,0,0,.19);z-index:101}.word-info h2{margin-top:0;font-size:150%;line-height:120%}.word-info{display:grid;grid-gap:20px;gap:20px}.word-info .close-btn{justify-self:end}.word-info .sources-list{display:grid;grid-gap:5px;gap:5px}.word-info .sources-list a{display:grid;padding:5px;margin-left:-5px}.word-info .sources-list a:hover{background-color:#f3f5ff;outline:1px solid #d1d9ff}.word-info .source-title{font-weight:800;font-size:120%;line-height:120%}.word-info .source-url{font-size:70%;opacity:.6;white-space:nowrap;width:100%;text-overflow:ellipsis;overflow:hidden}.canvas-controls{display:grid;grid-gap:5px;gap:5px;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;font-size:80%;line-height:1}label{display:block;opacity:.6}input[type=text]{padding:5px;border:1px solid rgba(0,0,0,.1);border-radius:4px;font-size:16px;width:100%}.sidebar-icon-link{display:grid;grid-auto-flow:column;text-decoration:none;justify-content:start;grid-gap:10px;gap:10px;align-items:center}.sidebar-icon-link:hover{color:var(--color-blue-dark)}.sidebar-icon-link:hover g:not([mask="url(#c)"]):not([mask="url(#d)"]) path{stroke:var(--color-blue-dark)}.sidebar-icon-link:hover g[mask="url(#c)"] path,.sidebar-icon-link:hover g[mask="url(#d)"] path{fill:var(--color-blue-dark)}.tone-row:hover svg{animation:rotating 2s linear infinite}@keyframes rotating{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}::selection{background-color:var(--color-blue-dark);color:#fff}.dialog-heading{display:grid;grid-gap:10px;gap:10px}.clear-btn{border:1px solid rgba(0,0,0,.1);border-radius:4px;padding:5px;line-height:1;cursor:pointer}.clear-btn:hover{background-color:rgba(0,0,0,.1)}.clear-btn:active{background-color:rgba(0,0,0,.2)}#Instructions .suggestion a,#Instructions .suggestion button{color:var(--color-blue-dark)}