*{margin:0;padding:0;box-sizing:border-box}:root{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;line-height:1.5;font-weight:300;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;min-width:320px;min-height:100vh;background:#1a1a1a;color:#888;overflow:hidden}#root{width:100%;height:100vh}.cellular-grid{width:100%;height:100vh;display:flex;align-items:center;justify-content:center;background:transparent;position:relative}.grid-canvas{image-rendering:pixelated;image-rendering:crisp-edges;box-shadow:0 0 40px #00000080;background:#1a1a1a}.cell-tooltip{position:fixed;background:#000000bf;color:#fff;padding:4px 8px;font-size:11px;font-weight:300;letter-spacing:.3px;text-transform:lowercase;pointer-events:none;z-index:1000;border-radius:2px}.composition-bar{position:absolute;bottom:40px;left:50%;transform:translate(-50%);width:960px;height:2px;display:flex;background:transparent;overflow:visible}.composition-segment{height:100%;transition:all .3s ease;cursor:pointer;position:relative;z-index:10;opacity:.4}.composition-segment:hover{height:3px;transform:translateY(-2px);opacity:.7}.composition-segment:hover:after{content:attr(data-mood);position:absolute;bottom:6px;left:50%;transform:translate(-50%);background:#000000bf;color:#fff;padding:3px 6px;font-size:10px;font-weight:300;letter-spacing:.3px;text-transform:lowercase;white-space:nowrap;border-radius:2px;pointer-events:none}.memory-canvas{position:fixed;top:0;left:0;width:100%;height:100%;overflow:hidden;background:#1a1a1a}.memory-controls{position:fixed;right:calc(50% - 718px);top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:2px;z-index:100}.question{font-size:13px;font-weight:300;color:#888;text-align:right;padding:4px 0 12px;letter-spacing:.3px;text-transform:lowercase}.word-button{background:none;border:none;font-size:13px;font-weight:300;color:#888;text-align:right;padding:4px 0;cursor:pointer;transition:all .2s ease;text-transform:lowercase;letter-spacing:.3px}.word-button:hover{color:#666;letter-spacing:.5px}.word-button.selected{color:#333;font-weight:400}.app{width:100vw;height:100vh;overflow:hidden;position:relative;background:#1a1a1a}.app-title{position:fixed;top:40px;left:calc(50% - 480px);font-size:13px;font-weight:300;color:#888;letter-spacing:.3px;margin:0;z-index:100}.about-container{position:fixed;top:40px;left:calc(50% - 718px);z-index:100;padding-right:460px}.about-toggle{background:none;border:none;font-size:13px;font-weight:300;color:#888;cursor:pointer;transition:all .2s ease;text-transform:lowercase;letter-spacing:.3px;padding:4px 8px 4px 0}.about-toggle:hover{color:#666;letter-spacing:.5px}.about-tooltip{position:absolute;top:0;left:50px;width:400px;max-height:600px;overflow-y:auto;background:#1a1a1af2;padding:20px;font-size:12px;font-weight:300;color:#888;line-height:1.6;letter-spacing:.3px;animation:fadeIn .3s ease-out;scrollbar-width:thin;scrollbar-color:#666 transparent;box-shadow:0 4px 20px #00000080}.about-tooltip::-webkit-scrollbar{width:4px}.about-tooltip::-webkit-scrollbar-track{background:transparent}.about-tooltip::-webkit-scrollbar-thumb{background:#666;border-radius:2px}.about-tooltip p{margin:0 0 12px}.about-tooltip p:last-child{margin-bottom:0}.about-tooltip a{color:#888;text-decoration:underline;transition:color .2s ease}.about-tooltip a:hover{color:#666}.user-info{position:fixed;top:40px;right:calc(50% - 480px);font-size:13px;font-weight:300;color:#888;letter-spacing:.3px;z-index:100}.user-form{display:inline-flex;align-items:center;gap:4px}.user-input{background:transparent;border:none;border-bottom:1px solid #f0f0f0;padding:2px 0;font-size:13px;font-weight:300;color:#888;outline:none;letter-spacing:.3px;width:auto;min-width:60px}.user-input::placeholder{color:#ddd;font-size:12px}.user-input:focus{border-bottom-color:#888}.user-display{cursor:pointer;transition:color .2s ease}.user-display:hover{color:#666}.loading{width:100vw;height:100vh;display:flex;align-items:center;justify-content:center;background:#1a1a1a}.loading p{font-size:14px;color:#ccc;font-weight:300;letter-spacing:1px;text-transform:lowercase}.archive-toggle{position:fixed;left:calc(50% - 718px);top:calc(50% - 157.5px);background:none;border:none;font-size:13px;font-weight:300;color:#888;cursor:pointer;transition:all .2s ease;text-transform:lowercase;letter-spacing:.3px;padding:4px 0;text-align:left;z-index:100}.archive-toggle:hover{color:#666;letter-spacing:.5px}.vault-list{position:fixed;left:calc(50% - 718px);top:calc(50% - 136.5px);display:flex;flex-direction:column;gap:2px;overflow-y:auto;overflow-x:hidden;animation:fadeIn .5s ease-out;width:200px;max-height:294px;z-index:100;scrollbar-width:thin;scrollbar-color:#ddd transparent}.vault-list::-webkit-scrollbar{width:2px}.vault-list::-webkit-scrollbar-track{background:transparent}.vault-list::-webkit-scrollbar-thumb{background:#ddd;border-radius:1px}.vault-list::-webkit-scrollbar-thumb:hover{background:#888}.vault-item{text-align:left;padding:4px 0;cursor:default;transition:all .2s ease;position:relative;background:transparent}.vault-item:hover .vault-mood{letter-spacing:.5px}.vault-mood{font-size:13px;font-weight:300;letter-spacing:.3px;text-transform:lowercase;transition:all .2s ease}.vault-date{font-size:10px;color:#ddd;font-weight:300;letter-spacing:.2px;margin-top:1px}.vault-note{display:inline;margin-left:8px;font-size:10px;color:#ddd;font-style:italic;font-weight:300;opacity:0;transition:opacity .3s ease;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:120px}.vault-item:hover .vault-note{opacity:1}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.creator-credit{position:fixed;bottom:40px;left:calc(50% - 480px);font-size:11px;font-weight:300;color:#888;letter-spacing:.3px;text-transform:lowercase;z-index:100}.creator-credit a{color:#888;text-decoration:none;transition:color .2s ease}.creator-credit a:hover{color:#666}.mobile-message{display:none}@media(max-width:1024px){.app-title,.about-toggle,.about-tooltip,.user-info,.memory-canvas,.archive-toggle,.vault-list,.creator-credit{display:none!important}.mobile-message{display:flex;align-items:center;justify-content:center;width:100vw;height:100vh;background:#1a1a1a;padding:40px;text-align:center}.mobile-message p{font-size:14px;font-weight:300;color:#888;letter-spacing:.3px;line-height:1.6;text-transform:lowercase;max-width:300px}}
