:root{--color-bg: rgb(17, 24, 39)}*{box-sizing:border-box}body{margin:0;padding:0;font-family:ui-rounded,SF Pro Rounded,-apple-system,system-ui,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;background-attachment:fixed;background-color:#010328;background-image:linear-gradient(45deg,#2e1259,#291254,#23114b,#1f1047,#1a1042 44%,#150f3e 56%,#0f0d36,#0c0a33,#07062d,#010328);min-height:100vh}a{color:inherit;text-decoration:none}.layout{margin:0 auto;min-height:100vh;max-width:56rem;padding:2rem 3rem}.title{white-space:nowrap;font-size:2.25rem;font-weight:700;color:#ffffffe6;filter:drop-shadow(0 4px 3px rgba(0,0,0,.07));margin:0}@media (min-width: 768px){.title{font-size:3.75rem}}.home-container{display:flex;flex-direction:column;gap:2rem}.title-with-nav{display:flex;align-items:center;justify-content:space-between;gap:1rem}.bio-text{font-size:1.125rem;color:#ffffffb3;line-height:1.75}.bio-text .highlight{font-weight:700;color:#fff}.bio-text a{font-weight:700;color:#c4b5fd;transition:color .2s}.bio-text a:hover{color:#ddd6fe}.nav-image-button{border-radius:9999px;border:2px solid transparent;background:none;padding:0;cursor:pointer;outline:none}.nav-image-button:focus{border-color:#ffffffe6}.nav-avatar{height:2rem;width:2rem;border-radius:9999px;background-size:cover;background-position:center}@media (min-width: 768px){.nav-avatar{height:3rem;width:3rem}}.dropdown-content{display:flex;flex-direction:column;gap:.5rem;border-radius:.5rem;background-color:#111827cc;padding:1rem;box-shadow:0 10px 15px -3px #0000001a;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);z-index:50}.dropdown-label{font-size:.875rem;font-weight:300;color:#d1d5db;margin:0}.dropdown-link{color:#fff9;font-weight:700;position:relative;outline:none;padding:.25rem 0;transition:color .2s}.dropdown-link:hover,.dropdown-link:focus{color:#ffffffe6}.dropdown-link.indent{padding-left:1rem}.dropdown-link.active:after{content:"";position:absolute;top:0;bottom:0;right:-1rem;width:.25rem;border-radius:.125rem;background:linear-gradient(to bottom,#9333ea,#60a5fa)}.nav{margin:2rem}.nav ul{display:flex;list-style:none;flex-direction:column;gap:.5rem;padding:0;margin:0}.nav-link{font-size:1.5rem;display:flex;gap:1rem;align-items:center;font-weight:700;position:relative;cursor:pointer;transition:color .2s;filter:drop-shadow(0 4px 3px rgba(0,0,0,.07));padding:.25rem 0}.nav-link.active{color:#fff}.nav-link.inactive{color:#9ca3af}.nav-link.inactive:hover{color:#e5e7eb}.nav-link .active-indicator{position:absolute;top:0;bottom:0;left:-1rem;width:.25rem;border-radius:.125rem;background:linear-gradient(to bottom,#9333ea,#60a5fa)}.nav-group-header{font-size:1.25rem;margin-top:1rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;line-height:1.25;filter:drop-shadow(0 4px 3px rgba(0,0,0,.07));color:#ffffff4d;margin-bottom:0}.nav li.indent{margin-left:1rem;margin-top:.5rem}.loading-route:after{content:"";display:block;position:absolute;bottom:-.5rem;left:0;width:.5rem;height:.5rem;border-radius:50%;border:1px solid rgba(255,255,255,.5);background-color:#9333ea;background-image:radial-gradient(circle at bottom left,rgba(96,165,250,.9),transparent),radial-gradient(circle at top right,rgb(249,168,212,.9),transparent);animation:loadingRoute 1s infinite ease-in-out;animation-delay:.3s;opacity:0}@keyframes loadingRoute{0%{transform:translate(0) rotate(0);opacity:1}50%{transform:translate(300%) rotate(360deg);opacity:1}to{transform:translate(0) rotate(720deg);opacity:1}}.checkerboard{background-color:#fff;background-image:linear-gradient(45deg,#ccc 25%,transparent 25%),linear-gradient(135deg,#ccc 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#ccc 75%),linear-gradient(135deg,transparent 75%,#ccc 75%);background-size:25px 25px;background-position:0 0,12.5px 0,12.5px -12.5px,0px 12.5px}.color-input{display:block;width:100%;border-radius:.5rem;border:none;background-color:#ffffffb3;padding:.75rem;box-shadow:0 10px 15px -3px #0000001a;font-size:.875rem}.color-input::-moz-placeholder{color:#00000080}.color-input::placeholder{color:#00000080}.color-input:focus{outline:2px solid rgb(236,72,153);outline-offset:2px}.color-results{margin:0 -3rem;display:grid;grid-template-columns:auto 1fr;justify-content:space-between;gap:1rem;background-color:#ffffffb3;padding:1rem;box-shadow:0 10px 15px -3px #0000001a}@media (min-width: 768px){.color-results{margin:0;grid-template-columns:repeat(2,1fr);border-radius:.5rem}}.color-result-label{font-size:1.25rem;font-weight:700;color:#111827;margin:0}.color-result-value{font-size:1.25rem;color:#111827;margin:0}.copy-text-container{display:flex;flex-direction:row;align-items:center;gap:.5rem}.copy-text-button{margin:0;cursor:pointer;padding:0;font-size:1.125rem;color:#111827;transition:color .2s;background:none;border:none}.copy-text-button:hover{color:#6b21a8}.copy-badge{border-radius:9999px;background-color:#581c87;padding:.125rem .5rem;font-size:.875rem;color:#ede9fee6;transition:opacity .3s ease-in-out}.copy-badge-visible{visibility:visible;opacity:1}.copy-badge-hidden{visibility:hidden;opacity:0;-webkit-user-select:none;-moz-user-select:none;user-select:none}.color-preview{margin:0 -3rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;padding:2rem}@media (min-width: 768px){.color-preview{margin:0;border-radius:.5rem}}.color-circle{height:20rem;width:20rem;min-width:0;border-radius:9999px;box-shadow:0 10px 15px -3px #0000001a}.color-demo-text{flex:1;font-size:3rem;font-weight:900;filter:drop-shadow(0 10px 8px rgba(0,0,0,.04))}.tools-container{display:flex;flex-direction:column;gap:.75rem}.tools-content{display:flex;flex-direction:column;gap:1rem;min-height:calc(100vh - 3rem)}.tools-section-title{font-size:1.5rem;font-weight:700;color:#f3f4f6;margin:0}.intersection-container{display:flex;flex:1;flex-direction:column;align-items:stretch;gap:1rem;border-radius:.75rem;background-color:#1118274d}@media (min-width: 768px){.intersection-container{flex-direction:row;align-items:flex-start}}.intersection-controls{display:flex;flex-direction:column;gap:.75rem;border-radius:.5rem;padding:1rem}@media (min-width: 768px){.intersection-controls{width:16rem;justify-content:flex-start}}.control-label{font-size:1rem;display:flex;justify-content:space-between;color:#f3f4f6;margin:0}.control-value{font-weight:700}.intersection-demo{display:flex;flex:1;align-items:center;align-self:stretch;border-radius:.5rem;padding:3rem}.intersection-relative{position:relative;width:100%}.intersection-boundary{position:absolute;border-radius:.375rem;background-color:#93c5fd;opacity:.6;left:0;right:0}.intersection-boundary-top{top:0}.intersection-boundary-bottom{bottom:0}.intersection-scroll-root{display:flex;height:24rem;width:100%;flex-direction:column;align-items:center;gap:1rem;overflow:auto;border-radius:.375rem;background-color:#f3f4f6}.intersection-item{display:flex;align-items:center;justify-content:center;border-radius:.375rem;background-color:#e5e7eb}.intersection-item-active{background-color:#bbf7d0}.movies-layout{display:grid;height:100%;max-height:100vh;grid-template-columns:1fr;grid-template-rows:min-content min-content 1fr;gap:1.5rem}.movie-search-input{margin-top:.25rem;display:block;width:100%;border-radius:.375rem;border:1px solid rgb(209,213,219);padding:.75rem;box-shadow:0 1px 2px #0000000d;font-size:.875rem}.movie-search-input:focus{outline:2px solid rgb(236,72,153);outline-offset:2px}.movies-content{display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:1fr;align-items:stretch;gap:1rem;overflow:auto}.movies-list{display:flex;flex-direction:column;overflow:auto;border-radius:.5rem}.movie-item{display:flex;flex-direction:row;align-items:center;border-radius:.375rem;padding:1rem;cursor:pointer;transition:background-color .2s}.movie-item:hover{background-color:#111827b3}.movie-item-active{background-color:#11182780}.movie-poster{height:4rem;width:4rem;border-radius:.5rem;-o-object-fit:cover;object-fit:cover}.movie-poster-placeholder{display:flex;height:4rem;width:4rem;min-width:0;align-items:center;justify-content:center;border-radius:.5rem;background-color:#374151}.movie-info{margin-left:1rem;display:flex;min-width:0;flex:1;flex-direction:column}.movie-title{font-size:1.125rem;font-weight:700;color:#f3f4f6;margin:0}.movie-title:hover{text-decoration:underline}.movie-year{font-size:.875rem;color:#e5e7eb;margin:0}.movie-detail{overflow:auto;border-radius:.5rem}.movie-detail-content{display:flex;flex-direction:column;gap:1rem;border-radius:.375rem;background-color:#f3f4f6;padding:2.5rem;box-shadow:0 4px 6px -1px #0000001a}.movie-detail-header{display:flex;flex-direction:row;justify-content:space-between}.movie-detail-title{font-size:1.875rem;font-weight:700;color:#1f2937;margin:0}.movie-detail-year{font-size:.875rem;font-weight:700;color:#9ca3af;margin:.25rem 0 0}.movie-detail-plot{font-size:.875rem;color:#4b5563;margin:.5rem 0 0}.movie-detail-grid{grid-column:span 2;display:grid;grid-template-columns:repeat(2,1fr);font-size:.875rem;gap:.5rem}.movie-detail-label{font-weight:700}.movie-detail-value{margin:0}.movie-detail-ratings{list-style:none;padding:0;margin:0}.movie-detail-link{color:#ec4899;transition:color .2s}.movie-detail-link:hover{color:#db2777}.bookmarklet-container{display:flex;flex-direction:column;gap:.75rem}.bookmarklet-grid{margin-top:3rem;display:grid;flex:1;grid-template-columns:1fr;gap:1rem}.bookmarklet-output{min-width:0;border-radius:.5rem .5rem 0 0;background-color:#0003;padding:1rem;color:#fff;overflow-x:auto;margin:0}.bookmarklet-textarea{width:100%;border-radius:.5rem .5rem 0 0;background-color:#ffffff1a;padding:1rem;color:#fff;font-family:monospace;border:none;resize:vertical}.bookmarklet-textarea:focus{outline:2px solid rgb(236,72,153);outline-offset:2px}.bookmarklet-button-row{display:flex;flex-direction:row;justify-content:flex-end;border-radius:0 0 .5rem .5rem;background-color:#0006;padding:1rem}.bookmarklet-button{border-radius:.25rem;background-color:#d1d5db;padding:.5rem 1rem;font-weight:700;color:#111827;border:none;cursor:pointer;transition:background-color .2s}.bookmarklet-button:hover:not(:disabled){background-color:#6b7280}.bookmarklet-button:disabled{background-color:#6b7280;cursor:not-allowed;opacity:.5}.bookmarklet-button-disabled{background-color:#6b7280}