@import "https://fonts.googleapis.com/css2?family=Outfit:wght@400;600;800;900&family=Share+Tech+Mono&display=swap";:root{--bg-dark:#090518;--bg-darker:#05030f;--bg-panel:#0d0822d9;--bg-panel-hover:#160e36e6;--neon-cyan:#00f3ff;--neon-cyan-glow:#00f3ff73;--neon-pink:#ff007f;--neon-pink-glow:#ff007f73;--neon-gold:#ffb700;--neon-gold-glow:#ffb70073;--primary:var(--neon-pink);--primary-glow:var(--neon-pink-glow);--secondary:var(--neon-cyan);--secondary-glow:var(--neon-cyan-glow);--accent:var(--neon-pink);--accent-glow:var(--neon-pink-glow);--text-main:#fff;--text-muted:#8c82a6;--border-neon:#00f3ff33;--border-neon-pink:#ff007f33;background-color:var(--bg-darker);color:var(--text-main);margin:0;padding:0;font-family:Outfit,sans-serif}*,:before,:after{box-sizing:border-box}html,body{background-color:var(--bg-darker);background-image:linear-gradient(#ff007f08 1px,#0000 1px),linear-gradient(90deg,#ff007f08 1px,#0000 1px);background-position:50%;background-size:40px 40px;width:100%;height:100vh;margin:0;padding:0;overflow:hidden}body:before{content:"";pointer-events:none;z-index:-1;background:radial-gradient(circle at 50% 20%,#00f3ff1a 0%,#0000 60%),radial-gradient(circle at 80% 80%,#ff007f0f 0%,#0000 50%);position:fixed;inset:0}.app-shell{box-sizing:border-box;flex-direction:column;width:100%;height:100vh;display:flex}.main-content-area{box-sizing:border-box;flex-direction:column;flex:1;width:100%;max-width:1000px;min-height:0;margin:0 auto;padding:0 16px 16px;display:flex}.dashboard-scrollable{flex:1;padding-right:4px;overflow-y:auto}.board-wrapper{flex:1;justify-content:center;align-items:center;width:100%;min-height:0;display:flex;overflow:hidden}.board-container{aspect-ratio:7/5;box-sizing:border-box;grid-template-rows:repeat(5,1fr);grid-template-columns:repeat(7,1fr);gap:10px;width:auto;max-width:100%;height:95%;max-height:100%;padding:8px;display:grid;position:relative}.glass-panel{background:var(--bg-panel);border:2px solid var(--border-neon);border-radius:12px;transition:all .3s cubic-bezier(.25,.8,.25,1);box-shadow:0 10px 30px #00000080,inset 0 0 15px #00f3ff0d}.glass-panel:hover{border-color:var(--neon-cyan);box-shadow:0 15px 35px #00f3ff26,inset 0 0 20px #00f3ff1a}header.glass-panel{border-color:var(--border-neon-pink);box-shadow:0 5px 20px #00000080,inset 0 0 10px #ff007f0d;margin:10px 16px!important;padding:10px 24px!important}header.glass-panel:hover{border-color:var(--neon-pink);box-shadow:0 10px 25px #ff007f26,inset 0 0 15px #ff007f1a}.glow-text-primary{color:#fff;text-transform:uppercase;letter-spacing:2px;text-shadow:0 0 10px var(--neon-pink-glow), 0 0 20px var(--neon-pink-glow)}.board-cell{z-index:2;aspect-ratio:1;-webkit-user-select:none;user-select:none;cursor:pointer;background:#0d0722;border:2px solid #ffffff0d;border-radius:8px;flex-direction:column;justify-content:flex-end;align-items:center;padding:6px;transition:all .2s cubic-bezier(.175,.885,.32,1.275);display:flex;position:relative;overflow:hidden;box-shadow:inset 0 0 12px #0009}.board-cell:hover{border-color:#ffffff40;transform:translateY(-3px)scale(1.02);box-shadow:0 4px 12px #ffffff1a,inset 0 0 6px #ffffff0d}.board-cell.active-path{border-color:var(--neon-cyan);box-shadow:0 0 8px #00f3ff26,inset 0 0 8px #00f3ff0d}.board-cell.start{border-color:var(--neon-cyan);box-shadow:0 0 10px var(--neon-cyan-glow);background:linear-gradient(135deg,#00f3ff26 0%,#0d0722 100%)}.board-cell.finish{border-color:var(--neon-pink);box-shadow:0 0 10px var(--neon-pink-glow);background:linear-gradient(135deg,#ff007f26 0%,#0d0722 100%)}.board-cell.special-trap{background:linear-gradient(135deg,#ff2a2a1f 0%,#0d0722 100%);border-color:#ff2a2a}.board-cell.special-bonus{background:linear-gradient(135deg,#00ff661f 0%,#0d0722 100%);border-color:#0f6}.board-cell.special-challenge{border-color:var(--neon-gold);background:linear-gradient(135deg,#ffb7001f 0%,#0d0722 100%)}.cell-thumbnail-img{object-fit:cover;opacity:.55;z-index:1;width:100%;height:100%;transition:opacity .2s;position:absolute;top:0;left:0}.board-cell:hover .cell-thumbnail-img{opacity:.8}.cell-thumbnail-anecdote{color:#bfb7d6;box-sizing:border-box;z-index:1;text-align:center;-webkit-line-clamp:3;-webkit-box-orient:vertical;width:100%;height:calc(100% - 24px);padding:4px;font-size:8px;font-style:italic;line-height:10px;display:-webkit-box;position:absolute;top:24px;left:0;overflow:hidden}.cell-thumbnail-video-icon{color:var(--neon-cyan);z-index:2;filter:drop-shadow(0 0 4px var(--neon-cyan-glow));position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.cell-overlay-glow{z-index:2;background:linear-gradient(#0d072233 0%,#0d0722d9 100%);position:absolute;inset:0}.cell-number{color:var(--text-muted);z-index:3;background:#0d0722b3;border-radius:4px;padding:0 4px;font-family:Share Tech Mono,monospace;font-size:13px;font-weight:700;position:absolute;top:4px;left:6px}.board-cell.start .cell-number,.board-cell.finish .cell-number{color:#fff;background:0 0}.board-cell.active-path .cell-number{color:var(--neon-cyan)}.board-cell.special-trap .cell-number{color:#ff2a2a}.board-cell.special-bonus .cell-number{color:#0f6}.board-cell.special-challenge .cell-number{color:var(--neon-gold)}.cell-icon{z-index:3;color:var(--text-muted);margin-bottom:4px;transition:all .3s}.board-cell:hover .cell-icon{color:#fff;transform:scale(1.1)}.board-cell.special-trap .cell-icon{color:#ff2a2a}.board-cell.special-bonus .cell-icon{color:#0f6}.board-cell.special-challenge .cell-icon{color:var(--neon-gold)}.player-token{z-index:10;border:3px solid var(--neon-cyan);width:52px;height:52px;box-shadow:0 0 15px var(--neon-cyan), 0 4px 10px #000c;color:#090518;pointer-events:none;background:#090518;border-radius:8px;justify-content:center;align-items:center;font-family:Share Tech Mono,monospace;font-size:13px;font-weight:900;animation:2s ease-in-out infinite floatToken;display:flex;position:absolute}.player-token.viker-token{border-color:var(--neon-pink);box-shadow:0 0 15px var(--neon-pink), 0 4px 10px #000c}@keyframes floatToken{0%{transform:translateY(0)}50%{transform:translateY(-4px)}to{transform:translateY(0)}}.viewport-die-container{z-index:90;border:3px solid var(--neon-cyan);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#090518eb;border-radius:12px;flex-direction:column;align-items:center;gap:8px;padding:12px;display:flex;position:fixed;bottom:20px;right:20px;box-shadow:0 10px 40px #000000b3,0 0 20px #00f3ff40}.viewport-die-container:hover{border-color:var(--neon-pink);box-shadow:0 10px 40px #000000b3,0 0 20px #ff007f40}.die-cube{border:3px solid var(--neon-cyan);color:#fff;cursor:pointer;-webkit-user-select:none;user-select:none;background:linear-gradient(135deg,#180d38 0%,#080314 100%);border-radius:10px;justify-content:center;align-items:center;width:56px;height:56px;font-family:Share Tech Mono,monospace;font-size:28px;font-weight:900;transition:all .2s;display:flex;position:relative}.viewport-die-container:hover .die-cube{border-color:var(--neon-pink)}.die-cube.rolling{animation:.6s ease-out rollAnimation}.die-cube.disabled{opacity:.5;cursor:not-allowed;box-shadow:none!important;border-color:#ffffff1a!important}.glitter-particle{width:var(--size);height:var(--size);background:var(--color);border-radius:var(--shape-radius,50%);pointer-events:none;z-index:200;opacity:1;animation:1.6s cubic-bezier(.1,.8,.25,1) forwards explode;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}@keyframes explode{0%{transform:translate(-50%,-50%)rotate(0)}to{transform:translate(calc(-50% + var(--dx)), calc(-50% + var(--dy))) rotate(var(--rot));opacity:0}}.techno-visualizer-container{justify-content:center;align-items:flex-end;gap:6px;height:80px;margin:24px 0;display:flex}.visualizer-bar{background:linear-gradient(to top, var(--neon-pink) 0%, var(--neon-cyan) 100%);border-radius:4px;width:10px;height:20px;animation:.8s ease-in-out infinite alternate pulseBar;box-shadow:0 0 8px #00f3ff4d}.visualizer-bar:nth-child(2){animation-delay:.15s}.visualizer-bar:nth-child(3){animation-delay:.3s}.visualizer-bar:nth-child(4){animation-delay:.45s}.visualizer-bar:nth-child(5){animation-delay:.2s}.visualizer-bar:nth-child(6){animation-delay:.35s}.visualizer-bar:nth-child(7){animation-delay:.1s}@keyframes pulseBar{0%{filter:brightness(.8);height:15px}to{filter:brightness(1.2);height:75px;box-shadow:0 0 15px #ff007f80}}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--bg-darker)}::-webkit-scrollbar-thumb{background:#ff007f4d;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--neon-pink)}.modal-overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:100;background:#05030fe6;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.modal-content{border:3px solid var(--neon-pink);background:#0d0822;border-radius:16px;width:100%;max-width:580px;max-height:85vh;padding:30px;animation:.25s cubic-bezier(.175,.885,.32,1.275) modalIn;position:relative;overflow-y:auto;box-shadow:0 0 40px #ff007f4d,inset 0 0 20px #ff007f1a}@keyframes modalIn{0%{opacity:0;transform:scale(.9)translateY(20px)}to{opacity:1;transform:scale(1)translateY(0)}}.form-input{border:2px solid var(--border-neon);color:#fff;background:#05030f;border-radius:6px;width:100%;padding:12px 16px;font-family:inherit;font-size:15px;transition:all .3s}.form-input:focus{border-color:var(--neon-cyan);box-shadow:0 0 10px var(--neon-cyan-glow);outline:none}.btn-primary{border:2px solid var(--neon-pink);color:#fff;text-transform:uppercase;letter-spacing:1px;cursor:pointer;box-shadow:0 0 8px var(--neon-pink-glow), inset 0 0 8px var(--neon-pink-glow);background:0 0;border-radius:6px;padding:12px 24px;font-family:Outfit,sans-serif;font-weight:700;transition:all .2s}.btn-primary:hover:not(:disabled){background:var(--neon-pink);box-shadow:0 0 15px var(--neon-pink-glow), 0 4px 10px #0006;transform:translateY(-2px)}.btn-primary:disabled{opacity:.4;cursor:not-allowed}.btn-secondary{border:2px solid var(--border-neon);color:var(--neon-cyan);text-transform:uppercase;letter-spacing:.5px;cursor:pointer;background:0 0;border-radius:6px;padding:10px 20px;font-weight:700;transition:all .2s}.btn-secondary:hover:not(:disabled){border-color:var(--neon-cyan);box-shadow:0 0 10px var(--neon-cyan-glow);background:#00f3ff0d}.uploads-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px;display:grid}.upload-card{border:2px solid var(--border-neon);background:#0d0722;border-radius:8px;transition:all .3s;position:relative;overflow:hidden}.upload-card:hover{border-color:var(--neon-pink);box-shadow:0 5px 15px var(--neon-pink-glow);transform:translateY(-4px)}.upload-card-media{aspect-ratio:16/10;object-fit:cover;border-bottom:2px solid var(--border-neon);background:#05030f;width:100%}.upload-card:hover .upload-card-media{border-color:var(--neon-pink)}.upload-card-text{padding:10px}.upload-card-badge{border:1px solid var(--border-neon);background:#05030f;border-radius:4px;padding:2px 6px;font-size:10px;font-weight:700;position:absolute;top:8px;right:8px}.upload-card-delete{color:#fff;cursor:pointer;opacity:0;background:#ff2a2a;border:none;border-radius:4px;justify-content:center;align-items:center;width:26px;height:26px;transition:all .2s;display:flex;position:absolute;top:8px;left:8px}.upload-card:hover .upload-card-delete{opacity:1}.upload-card-delete:hover{background:red;transform:scale(1.1);box-shadow:0 0 8px #ff2a2a80}.dropzone{border:2px dashed var(--neon-cyan);text-align:center;cursor:pointer;background:#00f3ff05;border-radius:8px;padding:24px;transition:all .3s}.dropzone:hover{border-color:var(--neon-pink);background:#ff007f05}.dropzone-file-info{border:1px dashed var(--neon-cyan);background:#00f3ff14;border-radius:4px;align-items:center;gap:8px;padding:6px 12px;font-size:13px;display:flex}@keyframes rollAnimation{0%{transform:rotate(0)scale(1)}25%{transform:rotate(90deg)scale(1.2)}50%{transform:rotate(180deg)scale(.9)}75%{transform:rotate(270deg)scale(1.1)}to{transform:rotate(360deg)scale(1)}}@media (width<=800px){.board-container{gap:6px;padding:6px}.board-cell{border-radius:4px;padding:2px}.cell-number{font-size:9px;top:2px;left:2px}.player-token{border-width:2px;width:36px;height:36px}.viewport-die-container{padding:8px;bottom:12px;right:12px}.die-cube{width:44px;height:44px;font-size:20px}}