*{margin:0;padding:0;box-sizing:border-box}body{font-family:Courier New,Courier,monospace,-apple-system,BlinkMacSystemFont,Segoe UI;line-height:1.6;color:#c5d9c5;min-height:100vh;overflow-y:auto;position:relative}.background-layer{content:"";position:fixed;top:0;left:0;width:100%;height:100%;background:radial-gradient(ellipse at 15% 0%,rgba(80,20,20,.15) 0%,transparent 4%),radial-gradient(ellipse at 85% 0%,rgba(90,25,25,.12) 0%,transparent 4%),radial-gradient(ellipse at 25% 40%,rgba(120,20,20,.1) 0%,transparent 20%),radial-gradient(ellipse at 75% 65%,rgba(100,15,15,.08) 0%,transparent 18%),url(https://cdnb.artstation.com/p/assets/images/images/032/645/733/large/luciano-tringhitelli-room.jpg?1607034051);background-size:cover;background-position:center;background-repeat:no-repeat;background-attachment:fixed;filter:blur(3px) brightness(.5);z-index:-1;pointer-events:none}body:before{content:"";position:fixed;top:0;left:0;width:100%;height:100%;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100'%3E%3Cline x1='10' y1='0' x2='12' y2='100' stroke='rgba(255,255,255,0.015)' stroke-width='0.5'/%3E%3Cline x1='45' y1='0' x2='43' y2='100' stroke='rgba(255,255,255,0.01)' stroke-width='0.3'/%3E%3Cline x1='78' y1='0' x2='80' y2='100' stroke='rgba(255,255,255,0.02)' stroke-width='0.4'/%3E%3C/svg%3E"),repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(0,0,0,.1) 2px,rgba(0,0,0,.1) 4px),repeating-linear-gradient(90deg,transparent,transparent 2px,rgba(0,0,0,.1) 2px,rgba(0,0,0,.1) 4px);opacity:.05;pointer-events:none;z-index:100;animation:filmGrain .5s steps(4) infinite}@keyframes filmGrain{0%,to{transform:translate(0)}25%{transform:translate(-2px,2px)}50%{transform:translate(2px,-2px)}75%{transform:translate(-2px,-2px)}}.container{max-width:1400px;margin:0 auto;padding:12px;display:flex;flex-direction:column}header{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='rust'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.5' numOctaves='3' seed='5'/%3E%3CfeColorMatrix values='0.5 0 0 0 0.3, 0 0.2 0 0 0.1, 0 0 0.1 0 0.05, 0 0 0 0.15 0'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23rust)'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='100'%3E%3Cline x1='0' y1='20' x2='300' y2='22' stroke='rgba(150,50,50,0.2)' stroke-width='1'/%3E%3Cline x1='0' y1='60' x2='300' y2='58' stroke='rgba(120,40,40,0.15)' stroke-width='0.8'/%3E%3Cline x1='50' y1='0' x2='52' y2='100' stroke='rgba(150,50,50,0.1)' stroke-width='0.5'/%3E%3C/svg%3E"),linear-gradient(180deg,rgba(15,30,25,.95) 0%,rgba(10,20,15,.98) 100%);backdrop-filter:blur(10px);border-radius:4px;padding:10px 16px;margin-bottom:6px;display:flex;justify-content:space-between;align-items:center;box-shadow:0 10px 30px #78140ab3,0 5px 15px #961e0f99,0 6px 20px #000000e6,inset 0 1px #9632324d,0 0 30px #9632324d,0 0 50px #64140a33;gap:20px;flex-shrink:0;border:1px solid rgba(150,50,50,.3);position:relative;overflow:hidden;background-size:200px 200px,300px 100px,cover}header:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent 0%,rgba(180,60,60,.6) 20%,rgba(220,80,80,.8) 50%,rgba(180,60,60,.6) 80%,transparent 100%);box-shadow:0 0 10px #dc505080}.header-left{display:flex;align-items:center;flex-shrink:0}.header-center{display:flex;flex-direction:column;gap:4px;flex:1}.header-connection{display:flex;align-items:center;gap:8px}.rpc-input-header{width:280px;padding:6px 10px;border:1px solid rgba(100,140,100,.3);border-radius:2px;font-size:.85rem;font-family:Monaco,Menlo,monospace;background:rgba(10,20,15,.8);color:#a8c8a8;box-shadow:inset 0 1px 4px #0009}.rpc-input-header:focus{outline:none;border-color:#b43c3c99;box-shadow:inset 0 1px 4px #0009,0 0 10px #b43c3c4d;background:rgba(15,25,20,.9)}.chain-info-header{font-size:.75rem;color:#8aa88a;text-align:left;text-shadow:0 1px 2px rgba(0,0,0,.6)}.header-right{display:flex;align-items:center;gap:20px}.header-settings{display:flex;flex-direction:column;gap:4px;align-items:flex-end}.update-controls-header .toggle-label{gap:6px}.update-controls-header .toggle-slider{width:40px;height:20px}.update-controls-header .toggle-slider:before{width:16px;height:16px}.update-controls-header .toggle-label input[type=checkbox]:checked+.toggle-slider:before{transform:translate(20px)}.update-controls-header .toggle-text{font-size:.8rem;gap:6px}.account-type-header{font-size:.75rem;color:#8aa88a;text-align:right;text-shadow:0 1px 2px rgba(0,0,0,.6)}h1{font-size:1.5rem;font-weight:700;color:#c44d4d;margin:0;text-shadow:0 0 10px rgba(200,80,80,.8),0 0 20px rgba(200,80,80,.4),2px 2px 4px rgba(0,0,0,.9);letter-spacing:1px;font-family:Courier New,Courier,monospace}.connection-status{display:flex;align-items:center;gap:8px;font-weight:500;font-size:.9rem;color:#a8c8a8;text-shadow:0 1px 2px rgba(0,0,0,.6)}.header-account{display:flex;flex-direction:column;gap:8px;align-items:flex-end}.account-options-header{display:flex;gap:8px}.account-info-header{display:flex;flex-direction:column;gap:4px;align-items:flex-end;background:rgba(10,20,15,.8);padding:8px 12px;border-radius:2px;border:1px solid rgba(100,140,100,.3);box-shadow:inset 0 2px 6px #0009}.account-address-header{font-family:Monaco,Menlo,monospace;font-size:.85rem;color:#a8c8a8;font-weight:600;text-shadow:0 1px 2px rgba(0,0,0,.6)}.account-balance-header{font-size:.8rem;color:#8aa88a;text-shadow:0 1px 2px rgba(0,0,0,.6)}.status-indicator{width:12px;height:12px;border-radius:50%;background:#c44d4d;animation:pulse 2s infinite;box-shadow:0 0 10px #c85050cc,inset 0 1px 2px #000c}.status-indicator.connected{background:#6a9f6a;box-shadow:0 0 10px #6a9f6acc,inset 0 1px 2px #000c}@keyframes pulse{0%,to{opacity:1;box-shadow:0 0 10px #c85050cc,inset 0 1px 2px #000c}50%{opacity:.5;box-shadow:0 0 5px #c8505066,inset 0 1px 2px #000c}}.block-banner{background:linear-gradient(180deg,rgba(15,25,20,.95) 0%,rgba(10,18,13,.98) 100%);backdrop-filter:blur(10px);border-radius:4px;padding:8px 12px;margin-bottom:8px;display:flex;flex-direction:column;box-shadow:0 2px 8px #000000e6,inset 0 1px #648c641a;border:1px solid rgba(100,140,100,.2);overflow:hidden;flex-shrink:0;min-height:80px}.block-window{display:flex;gap:4px;flex:1;overflow:hidden;padding:4px 0;align-items:center}.block-timeline{display:flex;gap:4px;flex:1;overflow:hidden;margin-top:6px;padding-top:6px;border-top:1px solid #e2e8f0}.timeline-tick{display:flex;flex-direction:column;align-items:center;min-width:42px;flex-shrink:0}.timeline-tick .tick-mark{width:1px;height:4px;background:#cbd5e0;margin-bottom:2px}.timeline-tick .tick-time{font-size:.7rem;color:#667eea;font-family:Monaco,Menlo,monospace;line-height:1;font-weight:500}.timeline-tick.major .tick-mark{height:6px;background:#764ba2}.timeline-tick.major .tick-time{font-weight:700;color:#764ba2}.block-item{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4px 6px;background:rgba(30,45,35,.8);border:1px solid rgba(100,140,100,.4);border-radius:2px;min-width:42px;height:38px;flex-shrink:0;transition:all .3s ease;box-shadow:inset 0 1px 4px #0009,0 0 8px #0006}.block-item.finalized{background:rgba(180,60,60,.6);border-color:#dc5050cc;box-shadow:inset 0 1px 4px #000c,0 0 15px #dc505066}.block-item.new-block{animation:blockAppear .4s ease}@keyframes blockAppear{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.block-item .block-number{font-size:.8rem;font-weight:700;color:#2d3748;line-height:1}.block-item.finalized .block-number{color:#fff}.block-item .block-hash-short{font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:.65rem;color:#64748b;margin-top:2px;line-height:1}.block-item.finalized .block-hash-short{color:#fffc}main{display:flex;flex-direction:column}.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}@media (min-width: 900px){.grid{grid-template-columns:1fr 1fr 1fr 1.8fr;grid-template-rows:auto auto}.game-card{grid-column:1 / 4;grid-row:1 / 2;width:100%;max-width:100%}.transaction-history-card{grid-column:4 / 5;grid-row:1 / 2}.timing-chart-card{grid-column:1 / 4;grid-row:2 / 3}.timing-stats-card{grid-column:4 / 5;grid-row:2 / 3}}@media (max-width: 899px){.grid{grid-template-columns:1fr}}.card{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='metal'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='2' numOctaves='4' seed='10'/%3E%3CfeColorMatrix values='0.1 0 0 0 0.05, 0 0.15 0 0 0.08, 0 0 0.12 0 0.06, 0 0 0 0.12 0'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23metal)'/%3E%3C/svg%3E"),radial-gradient(ellipse at 10% 15%,rgba(40,30,20,.4) 0%,transparent 15%),radial-gradient(ellipse at 80% 60%,rgba(35,25,15,.3) 0%,transparent 12%),radial-gradient(ellipse at 40% 85%,rgba(45,30,20,.35) 0%,transparent 18%),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='400' height='400'%3E%3Cline x1='50' y1='0' x2='55' y2='400' stroke='rgba(100,140,100,0.08)' stroke-width='0.5'/%3E%3Cline x1='150' y1='0' x2='148' y2='400' stroke='rgba(100,140,100,0.06)' stroke-width='0.3'/%3E%3Cline x1='280' y1='0' x2='285' y2='400' stroke='rgba(100,140,100,0.07)' stroke-width='0.4'/%3E%3Cline x1='0' y1='100' x2='400' y2='102' stroke='rgba(100,140,100,0.05)' stroke-width='0.3'/%3E%3Cline x1='0' y1='250' x2='400' y2='248' stroke='rgba(100,140,100,0.06)' stroke-width='0.4'/%3E%3C/svg%3E"),linear-gradient(180deg,rgba(18,28,23,.95) 0%,rgba(10,18,13,.98) 100%);backdrop-filter:blur(10px);border-radius:4px;padding:12px;box-shadow:0 8px 24px #78140a99,0 4px 12px #961e0f80,0 2px 6px #640f0ab3,0 6px 20px #000000f2,inset 0 1px #648c641a,0 0 40px #64140a4d,0 0 60px #5078500d;border:1px solid rgba(100,140,100,.2);transition:transform .2s ease,box-shadow .2s ease;overflow:visible;display:flex;flex-direction:column;position:relative;background-size:300px 300px,cover,cover,cover,400px 400px,cover}.card:after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent,transparent 1px,rgba(0,0,0,.03) 1px,rgba(0,0,0,.03) 2px);pointer-events:none;border-radius:4px}.card:hover{transform:translateY(-2px);box-shadow:0 6px 20px #000000f2,0 0 40px #b43c3c26;border-color:#b43c3c66}.card h2{font-size:1rem;font-weight:600;color:#a8c8a8;margin-bottom:8px;display:flex;align-items:center;gap:6px;flex-shrink:0;text-shadow:0 0 10px rgba(168,200,168,.3);font-family:Courier New,Courier,monospace;letter-spacing:.5px}.game-card,.transaction-history-card,.timing-chart-card{padding:12px}.form-group{margin-bottom:12px}.form-group label{display:block;margin-bottom:4px;font-weight:500;color:#a8c8a8;font-size:.9rem;font-family:Courier New,Courier,monospace;text-shadow:0 1px 2px rgba(0,0,0,.6)}input[type=text],input[type=number]{width:100%;padding:8px 12px;border:1px solid rgba(100,140,100,.3);border-radius:2px;font-size:14px;transition:border-color .2s ease,box-shadow .2s ease;background:rgba(10,20,15,.8);color:#a8c8a8;font-family:Courier New,Courier,monospace;box-shadow:inset 0 2px 6px #0009,0 0 10px #0006}input[type=text]:focus,input[type=number]:focus{outline:none;border-color:#b43c3c99;box-shadow:inset 0 2px 6px #0009,0 0 15px #b43c3c4d;background:rgba(15,25,20,.9)}.btn{padding:8px 16px;border:none;border-radius:2px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease;text-decoration:none;display:inline-block;text-align:center;font-family:Courier New,Courier,monospace;letter-spacing:.5px;position:relative;overflow:hidden}.btn.primary{background:repeating-linear-gradient(-45deg,rgba(180,60,60,.9),rgba(180,60,60,.9) 10px,rgba(140,40,40,.95) 10px,rgba(140,40,40,.95) 20px),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100'%3E%3Cfilter id='btn-texture'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='4' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 0, 0 0 0 0 0, 0 0 0 0 0, 0 0 0 0.05 0'/%3E%3C/filter%3E%3Crect width='100' height='100' filter='url(%23btn-texture)'/%3E%3C/svg%3E");color:#ffd5d5;border:1px solid rgba(220,80,80,.6);box-shadow:0 2px 8px #0009,inset 0 1px #ff646433,0 0 15px #b43c3c4d;text-shadow:0 1px 2px rgba(0,0,0,.8);background-size:100% 100%,100px 100px}.btn.primary:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 12px #000c,0 0 25px #dc505080;background:repeating-linear-gradient(-45deg,rgba(200,70,70,.95),rgba(200,70,70,.95) 10px,rgba(160,50,50,1) 10px,rgba(160,50,50,1) 20px),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100'%3E%3Cfilter id='btn-texture'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='4' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 0, 0 0 0 0 0, 0 0 0 0 0, 0 0 0 0.05 0'/%3E%3C/filter%3E%3Crect width='100' height='100' filter='url(%23btn-texture)'/%3E%3C/svg%3E");background-size:100% 100%,100px 100px}.btn.secondary{background:linear-gradient(180deg,rgba(30,45,35,.9) 0%,rgba(20,30,25,.95) 100%);color:#a8c8a8;border:1px solid rgba(100,140,100,.4);box-shadow:0 2px 8px #0009,inset 0 1px #78a0781a;text-shadow:0 1px 2px rgba(0,0,0,.8)}.btn.secondary:hover:not(:disabled){background:linear-gradient(180deg,rgba(40,55,45,.95) 0%,rgba(30,40,35,1) 100%);border-color:#78a07899;box-shadow:0 2px 8px #000c,0 0 20px #648c6433}.btn:disabled{opacity:.3;cursor:not-allowed;filter:grayscale(.8)}.btn-icon{padding:8px;min-width:auto;width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(180deg,rgba(30,45,35,.9) 0%,rgba(20,30,25,.95) 100%);color:#a8c8a8;border:1px solid rgba(100,140,100,.4);border-radius:2px;cursor:pointer;transition:all .2s ease;font-size:0;box-shadow:0 2px 8px #0009,inset 0 1px #78a0781a}.btn-icon:hover:not(:disabled){background:linear-gradient(180deg,rgba(40,55,45,.95) 0%,rgba(30,40,35,1) 100%);border-color:#78a07899;color:#c5d9c5;transform:translateY(-1px);box-shadow:0 4px 12px #000c,0 0 20px #648c644d,inset 0 1px #78a07833}.btn-icon:active:not(:disabled){transform:translateY(0);box-shadow:0 1px 4px #000c,inset 0 1px 3px #00000080}.btn-icon svg{width:24px;height:24px;transition:all .2s ease}.btn-icon:hover:not(:disabled) svg{filter:drop-shadow(0 0 8px rgba(100,140,100,.6))}.btn-icon:disabled{opacity:.3;cursor:not-allowed;filter:grayscale(.8)}.wallet-btn{margin-left:8px}.block-info{display:flex;flex-direction:column;gap:10px}.block-item{display:flex;flex-direction:column;gap:6px}.block-item label{font-weight:500;color:#4a5568;font-size:.9rem}.block-details{display:flex;flex-direction:column;gap:2px}.block-number{font-size:1.1rem;font-weight:600;color:#2d3748}.block-hash{font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:11px;color:#718096;word-break:break-all}.chain-info{margin-top:12px;padding:10px 12px;background:#f7fafc;border-radius:8px;border-left:4px solid #667eea;font-size:.9rem}.chain-info p{margin-bottom:8px}.chain-info p:last-child{margin-bottom:0}.account-options{display:flex;align-items:center;gap:12px;margin-bottom:16px;flex-wrap:wrap}.seed-input-modal{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center;z-index:1000}.seed-modal-content{background:linear-gradient(180deg,rgba(18,28,23,.98) 0%,rgba(10,18,13,1) 100%);padding:24px;border-radius:4px;box-shadow:0 20px 60px #000000f2,inset 0 1px #648c6433,0 0 40px #b43c3c4d;max-width:500px;width:90%;border:2px solid rgba(180,60,60,.4)}.seed-modal-content h3{margin:0 0 16px;color:#c44d4d;font-size:1.25rem;font-family:Courier New,Courier,monospace;text-shadow:0 0 10px rgba(200,80,80,.6),0 1px 2px rgba(0,0,0,.8)}.seed-modal-content textarea{width:100%;padding:12px;border:1px solid rgba(100,140,100,.3);border-radius:2px;font-size:14px;font-family:Monaco,Menlo,Ubuntu Mono,monospace;resize:vertical;background:rgba(10,20,15,.8);color:#a8c8a8;box-shadow:inset 0 2px 6px #0009}.seed-modal-content textarea:focus{outline:none;border-color:#b43c3c99;box-shadow:inset 0 2px 6px #0009,0 0 15px #b43c3c4d;background:rgba(15,25,20,.9)}.seed-buttons{display:flex;gap:8px;margin-top:12px}.account-info{margin-top:16px;padding:16px;background:#f0fff4;border-radius:8px;border-left:4px solid #10b981;min-height:200px;position:relative}.account-info p,.account-info div{margin-bottom:8px}.account-info p:last-child,.account-info div:last-child{margin-bottom:0}.balance-details{margin-left:16px;font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:.9rem;line-height:1.4;min-height:120px;display:flex;flex-direction:column;justify-content:flex-start}.balance-details div{margin-bottom:4px;padding:2px 0}.balance-details div:last-child{margin-bottom:0}.loading-indicator{color:#667eea;font-style:italic;animation:pulse 1.5s ease-in-out infinite;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:rgba(240,255,244,.9);padding:8px 16px;border-radius:6px;border:1px solid #10b981;font-size:.9rem;z-index:10}.update-mode{font-size:.8rem;color:#10b981;font-weight:400;font-style:italic;animation:glow 2s ease-in-out infinite alternate}@keyframes glow{0%{opacity:.7}to{opacity:1}}.update-controls{display:flex;flex-direction:column;gap:8px;margin:16px 0;padding:16px;background:#f8fafc;border-radius:8px;border-left:4px solid #667eea}.toggle-container{display:flex;align-items:center;gap:12px;transition:transform .2s ease}.toggle-label{display:flex;align-items:center;gap:8px;cursor:pointer;user-select:none}.toggle-label input[type=checkbox]{display:none}.toggle-slider{position:relative;width:50px;height:24px;background:#cbd5e0;border-radius:24px;transition:background .3s ease}.toggle-slider:before{content:"";position:absolute;top:2px;left:2px;width:20px;height:20px;background:white;border-radius:50%;transition:transform .3s ease;box-shadow:0 2px 4px #0003}.toggle-label input[type=checkbox]:checked+.toggle-slider{background:#10b981}.toggle-label input[type=checkbox]:checked+.toggle-slider:before{transform:translate(26px)}.toggle-text{display:flex;align-items:center;gap:8px;font-size:.9rem;font-weight:500}.mode-best{color:#10b981;opacity:1;transition:opacity .3s ease}.mode-finalized{color:#667eea;opacity:.5;transition:opacity .3s ease}.toggle-label input[type=checkbox]:not(:checked)~.toggle-text .mode-best{opacity:.5}.toggle-label input[type=checkbox]:not(:checked)~.toggle-text .mode-finalized{opacity:1}.toggle-label:hover .toggle-slider{box-shadow:0 0 8px #10b9814d}.fee-estimate{margin:12px 0;padding:12px;background:#fffbeb;border-radius:6px;border-left:3px solid #f59e0b;font-size:.9rem;color:#92400e}.game-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;flex-shrink:0}.game-mode-section{margin-bottom:8px;padding:10px;background:rgba(15,25,20,.6);border-radius:2px;overflow:auto;border:1px solid rgba(100,140,100,.2);box-shadow:inset 0 1px 4px #0009}.mode-toggle{display:flex;gap:16px;margin-bottom:16px}.mode-label{flex:1;display:flex;align-items:center;padding:12px 16px;background:white;border:2px solid #e2e8f0;border-radius:8px;cursor:pointer;transition:all .2s ease}.mode-label:hover{border-color:#667eea;background:#f7fafc}.mode-label input[type=radio]{margin-right:8px}.mode-label input[type=radio]:checked+span{font-weight:700;color:#667eea}.onchain-setup{padding-top:16px;border-top:1px solid rgba(100,140,100,.3)}.game-id-display{margin-top:8px;padding:8px;background:linear-gradient(180deg,rgba(30,45,35,.8) 0%,rgba(20,30,25,.9) 100%);border-radius:2px;font-weight:600;color:#a8c8a8;word-wrap:break-word;overflow-wrap:break-word;font-size:.85rem;flex-shrink:0;border:1px solid rgba(100,140,100,.4);box-shadow:inset 0 1px 4px #0009,0 0 10px #648c6433;text-shadow:0 1px 2px rgba(0,0,0,.6);font-family:Courier New,Courier,monospace}.game-id-value{font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:.95rem}.games-dropdown{width:100%;padding:10px 12px;border:1px solid rgba(100,140,100,.3);border-radius:2px;font-size:1rem;background:rgba(10,20,15,.8);color:#a8c8a8;cursor:pointer;transition:all .2s ease;font-family:Courier New,Courier,monospace;box-shadow:inset 0 2px 6px #0009}.games-dropdown:focus{outline:none;border-color:#b43c3c99;box-shadow:inset 0 2px 6px #0009,0 0 15px #b43c3c4d;background:rgba(15,25,20,.9)}.games-dropdown option{padding:10px;background:rgba(10,20,15,.95);color:#a8c8a8}.btn-reset{background:linear-gradient(180deg,rgba(180,60,60,.9) 0%,rgba(140,40,40,.95) 100%);color:#ffd5d5;border:1px solid rgba(220,80,80,.6);padding:8px 16px;border-radius:2px;font-size:.9rem;font-weight:600;cursor:pointer;transition:all .2s ease;font-family:Courier New,Courier,monospace;box-shadow:0 2px 8px #0009,inset 0 1px #ff646433,0 0 15px #b43c3c4d;text-shadow:0 1px 2px rgba(0,0,0,.8)}.btn-reset:hover{background:linear-gradient(180deg,rgba(200,70,70,.95) 0%,rgba(160,50,50,1) 100%);transform:translateY(-1px);box-shadow:0 4px 12px #000c,0 0 25px #dc505080}.game-layout{display:flex;gap:20px;align-items:flex-start;margin-bottom:8px;width:100%}.game-board-section{flex-shrink:0;display:flex;align-items:flex-start;justify-content:center}.game-info-section{flex:1;min-width:0;display:flex;flex-direction:column}.game-info{margin-bottom:12px;flex-shrink:0}.player-turn{text-align:center;margin-top:12px;margin-bottom:12px;display:flex;justify-content:center;align-items:center;min-height:60px}.player-indicator{font-size:1.1rem;font-weight:700;padding:12px 24px;border-radius:2px;display:inline-block;transition:all .3s ease;box-shadow:0 2px 8px #000c,inset 0 1px #ff646433;text-align:center;min-width:200px;font-family:Courier New,Courier,monospace;border:1px solid}.player-indicator.player-x{background:linear-gradient(180deg,rgba(180,60,60,.9) 0%,rgba(140,40,40,.95) 100%);color:#ffd5d5;border-color:#dc505099;text-shadow:0 0 15px rgba(255,100,100,.6),0 1px 2px rgba(0,0,0,.8)}.player-indicator.player-o{background:linear-gradient(180deg,rgba(80,120,80,.9) 0%,rgba(60,90,60,.95) 100%);color:#d5ffd5;border-color:#64a06499;text-shadow:0 0 15px rgba(150,255,150,.6),0 1px 2px rgba(0,0,0,.8)}.game-stats-bottom{display:flex;justify-content:center;gap:30px;padding:12px;background:linear-gradient(180deg,rgba(15,25,20,.8) 0%,rgba(10,18,13,.9) 100%);border-radius:2px;margin-top:auto;border:1px solid rgba(100,140,100,.3);flex-shrink:0;box-shadow:inset 0 1px 4px #0009,0 0 10px #0006}.game-stats-bottom .stat{display:flex;flex-direction:column;align-items:center;gap:4px}.game-stats-bottom .stat-label{font-size:.8rem;color:#8aa88a;font-weight:600;text-transform:uppercase;letter-spacing:.5px;font-family:Courier New,Courier,monospace;text-shadow:0 1px 2px rgba(0,0,0,.6)}.game-stats-bottom .stat-number{font-size:1.5rem;color:#a8c8a8;font-weight:700;font-family:Monaco,Menlo,Ubuntu Mono,monospace;text-shadow:0 0 10px rgba(168,200,168,.4),0 1px 2px rgba(0,0,0,.8)}.game-stats{display:flex;justify-content:space-around;padding:12px;background:#f7fafc;border-radius:8px}.game-stats .stat{display:flex;flex-direction:column;align-items:center;gap:4px}.game-stats .stat-label{font-size:.85rem;color:#718096;font-weight:500}.game-stats .stat-number{font-size:1.4rem;color:#2d3748;font-weight:700;font-family:Monaco,Menlo,Ubuntu Mono,monospace}.game-board{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;width:350px;height:437px}.cell{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='150' height='150'%3E%3Cfilter id='rust-panel'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='3' numOctaves='3' seed='20'/%3E%3CfeColorMatrix values='0.2 0 0 0 0.1, 0 0.15 0 0 0.08, 0 0 0.1 0 0.05, 0 0 0 0.2 0'/%3E%3C/filter%3E%3Crect width='150' height='150' filter='url(%23rust-panel)'/%3E%3C/svg%3E"),radial-gradient(circle at 10% 10%,rgba(0,0,0,.6) 0%,transparent 3%),radial-gradient(circle at 90% 10%,rgba(0,0,0,.6) 0%,transparent 3%),radial-gradient(circle at 10% 90%,rgba(0,0,0,.6) 0%,transparent 3%),radial-gradient(circle at 90% 90%,rgba(0,0,0,.6) 0%,transparent 3%),radial-gradient(ellipse at 30% 40%,rgba(80,30,20,.15) 0%,transparent 25%),radial-gradient(ellipse at 70% 65%,rgba(70,25,15,.12) 0%,transparent 20%),linear-gradient(145deg,transparent 49%,rgba(100,140,100,.08) 49.5%,rgba(100,140,100,.08) 50%,transparent 50.5%),linear-gradient(145deg,rgba(25,35,30,.9),rgba(15,25,20,.95));border:2px solid rgba(80,100,80,.4);border-radius:2px;display:flex;align-items:center;justify-content:center;font-size:3rem;font-weight:700;cursor:pointer;transition:all .2s ease;position:relative;box-shadow:inset 0 2px 8px #000c,0 2px 8px #0009,0 0 20px #0006;width:100%;height:100%;min-width:0;min-height:0;aspect-ratio:1;line-height:1;background-size:150px 150px,cover,cover,cover,cover,cover,cover,cover,cover}.cell:before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 50%,rgba(0,0,0,.1) 0%,transparent 60%),linear-gradient(180deg,rgba(100,140,100,.05) 0%,transparent 50%,rgba(0,0,0,.2) 100%);pointer-events:none;z-index:-1}.cell:hover:not(.taken){background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='150' height='150'%3E%3Cfilter id='rust-panel'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='3' numOctaves='3' seed='20'/%3E%3CfeColorMatrix values='0.2 0 0 0 0.1, 0 0.15 0 0 0.08, 0 0 0.1 0 0.05, 0 0 0 0.2 0'/%3E%3C/filter%3E%3Crect width='150' height='150' filter='url(%23rust-panel)'/%3E%3C/svg%3E"),radial-gradient(circle at 10% 10%,rgba(0,0,0,.6) 0%,transparent 3%),radial-gradient(circle at 90% 10%,rgba(0,0,0,.6) 0%,transparent 3%),radial-gradient(circle at 10% 90%,rgba(0,0,0,.6) 0%,transparent 3%),radial-gradient(circle at 90% 90%,rgba(0,0,0,.6) 0%,transparent 3%),radial-gradient(ellipse at 30% 40%,rgba(90,35,25,.2) 0%,transparent 25%),radial-gradient(ellipse at 70% 65%,rgba(80,30,20,.17) 0%,transparent 20%),linear-gradient(145deg,transparent 49%,rgba(100,140,100,.08) 49.5%,rgba(100,140,100,.08) 50%,transparent 50.5%),linear-gradient(145deg,rgba(35,50,40,.95),rgba(25,35,30,1));border-color:#b43c3c99;transform:scale(1.03);box-shadow:inset 0 2px 8px #000000e6,0 6px 16px #000c,0 0 30px #b43c3c4d;background-size:150px 150px,cover,cover,cover,cover,cover,cover,cover,cover}.cell.taken{cursor:not-allowed}.cell.x{color:#c44d4d;animation:popIn .3s ease;text-shadow:0 0 20px rgba(200,80,80,.8),0 0 40px rgba(200,80,80,.4),2px 2px 4px rgba(0,0,0,.9)}.cell.o{color:#6a9f6a;animation:popIn .3s ease;text-shadow:0 0 20px rgba(106,159,106,.8),0 0 40px rgba(106,159,106,.4),2px 2px 4px rgba(0,0,0,.9)}.cell.winning{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='blood'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='2' numOctaves='2' seed='30'/%3E%3CfeColorMatrix values='0.8 0 0 0 0.3, 0 0.1 0 0 0.05, 0 0 0.05 0 0, 0 0 0 0.25 0'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23blood)'/%3E%3C/svg%3E"),radial-gradient(ellipse at 25% 30%,rgba(120,20,20,.4) 0%,transparent 20%),radial-gradient(ellipse at 75% 65%,rgba(100,15,15,.35) 0%,transparent 18%),radial-gradient(ellipse at 50% 80%,rgba(110,18,18,.3) 0%,transparent 15%),linear-gradient(145deg,rgba(180,60,60,.3),rgba(140,40,40,.4));border-color:#dc5050cc;animation:winPulse .6s ease-in-out infinite;box-shadow:inset 0 2px 8px #000c,0 0 40px #dc505080;background-size:200px 200px,cover,cover,cover,cover}@keyframes popIn{0%{transform:scale(0);opacity:0}50%{transform:scale(1.1)}to{transform:scale(1);opacity:1}}@keyframes winPulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.game-message{margin-top:20px;padding:16px;border-radius:2px;text-align:center;font-size:1.1rem;font-weight:600;animation:slideIn .3s ease;font-family:Courier New,Courier,monospace;border:1px solid;box-shadow:0 4px 12px #000c,inset 0 1px #ff646433}.game-message.winner{background:linear-gradient(180deg,rgba(180,60,60,.8) 0%,rgba(140,40,40,.9) 100%);color:#ffd5d5;border-color:#dc5050cc;text-shadow:0 0 15px rgba(255,100,100,.8),0 1px 2px rgba(0,0,0,.9)}.game-message.draw{background:linear-gradient(180deg,rgba(120,100,60,.8) 0%,rgba(90,70,40,.9) 100%);color:#ffe8c5;border-color:#a0783ccc;text-shadow:0 0 10px rgba(200,150,80,.6),0 1px 2px rgba(0,0,0,.9)}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.game-waiting-overlay{position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(80,20,20,.6) 0%,rgba(40,10,10,.7) 50%,rgba(0,0,0,.85) 100%),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' /%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23noise)' opacity='0.05'/%3E%3C/svg%3E");backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:100;animation:fadeIn .3s ease}.waiting-content{text-align:center;padding:30px;background:linear-gradient(135deg,rgba(30,20,20,.95) 0%,rgba(20,15,15,.98) 100%);border:2px solid rgba(180,60,60,.6);border-radius:4px;box-shadow:0 8px 32px #000000e6,inset 0 1px #ff646426,0 0 40px #b43c3c4d}.waiting-spinner{width:50px;height:50px;margin:0 auto 20px;border:4px solid rgba(180,60,60,.3);border-top:4px solid rgba(220,80,80,.9);border-radius:50%;animation:spin 1s linear infinite;box-shadow:0 0 20px #b43c3c80,inset 0 0 10px #00000080}.waiting-text{font-size:1.2rem;font-weight:600;color:#ffd5d5;font-family:Courier New,Courier,monospace;text-shadow:0 0 15px rgba(255,100,100,.8),0 2px 4px rgba(0,0,0,.9);letter-spacing:1px;animation:pulse 2s ease-in-out infinite}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}#gameBoardContainer{position:relative}#gameBoardContainer:has(.game-waiting-overlay:not(.hidden)) .game-board{pointer-events:none}#gameBoardContainer:has(.game-waiting-overlay:not(.hidden)) .cell{cursor:not-allowed;opacity:.6}.chart-container{position:relative;min-height:300px;height:400px}.stats-content{display:flex;flex-direction:column;gap:16px}.metric-group{display:flex;flex-direction:column;gap:6px}.metric-title{font-size:.85rem;font-weight:700;color:#d4e4d4;margin:0;padding-bottom:4px;border-bottom:2px solid #e2e8f0}.metric-stats{display:flex;flex-direction:column;gap:4px}.metric-row{display:flex;justify-content:space-between;align-items:center}.metric-label{font-size:.7rem;color:#a8c8a8;font-weight:500}.metric-value{font-size:.8rem;color:#d4e4d4;font-weight:600;font-family:Monaco,Menlo,Ubuntu Mono,monospace}.stat-item{display:flex;flex-direction:column;align-items:flex-start;gap:4px}.stat-label{font-size:.75rem;color:#718096;font-weight:500}.stat-value{font-size:.95rem;color:#2d3748;font-weight:600;font-family:Monaco,Menlo,Ubuntu Mono,monospace}.transaction-status{margin-top:16px;padding:16px;border-radius:8px}.transaction-status.success{background:#f0fff4;border-left:4px solid #10b981;color:#065f46}.transaction-status.error{background:#fef2f2;border-left:4px solid #ef4444;color:#991b1b}.transaction-status.pending{background:#fffbeb;border-left:4px solid #f59e0b;color:#92400e}.history-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;flex-shrink:0}.history-controls{display:flex;align-items:center;gap:12px}.pending-count{font-size:.85rem;color:#f59e0b;font-weight:500;padding:4px 8px;background:#fffbeb;border-radius:4px;animation:pulse-pending 2s ease-in-out infinite}@keyframes pulse-pending{0%,to{opacity:1}50%{opacity:.7}}.btn-clear{background:transparent;border:none;font-size:1.2rem;cursor:pointer;padding:4px 8px;border-radius:4px;transition:background .2s ease}.btn-clear:hover{background:rgba(239,68,68,.1)}.transaction-history{overflow-y:auto;padding-right:8px;max-height:600px}.transaction-history::-webkit-scrollbar{width:6px}.transaction-history::-webkit-scrollbar-track{background:#f1f1f1;border-radius:3px}.transaction-history::-webkit-scrollbar-thumb{background:#cbd5e0;border-radius:3px}.transaction-history::-webkit-scrollbar-thumb:hover{background:#a0aec0}.no-transactions{text-align:center;color:#718096;padding:40px 20px;font-style:italic}.tx-item{padding:6px 8px;margin-bottom:6px;border-radius:2px;border-left:3px solid;background:rgba(18,28,23,.6);font-size:.85rem;transition:transform .2s ease,box-shadow .2s ease;box-shadow:inset 0 1px 4px #0009,0 1px 4px #0006}.tx-item:hover{transform:translate(4px);box-shadow:inset 0 1px 4px #000000b3,0 2px 8px #0009,0 0 15px #b43c3c33}.tx-item.success{border-left-color:#6a9f6a;background:rgba(30,50,30,.6);box-shadow:inset 0 1px 4px #0009,0 0 10px #6a9f6a33}.tx-item.pending{border-left-color:#c4a04d;background:rgba(50,45,25,.6);box-shadow:inset 0 1px 4px #0009,0 0 10px #c4a04d33}.tx-item.error{border-left-color:#c44d4d;background:rgba(50,25,25,.6);box-shadow:inset 0 1px 4px #0009,0 0 10px #c850504d}.tx-item.invalid{border-left-color:#c47d4d;background:rgba(50,35,25,.6);box-shadow:inset 0 1px 4px #0009,0 0 10px #c47d4d33}.tx-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:6px}.tx-status{font-weight:600;font-size:.85rem}.tx-time{font-size:.75rem;color:#718096}.tx-details{font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:.75rem;line-height:1.5;color:#4a5568}.tx-details div{margin-bottom:3px}.tx-details strong{display:inline-block;min-width:60px;color:#2d3748}.tx-hash{word-break:break-all;color:#667eea;cursor:pointer;text-decoration:none}.tx-hash:hover{text-decoration:underline}.tx-timing{margin-top:6px;padding:4px 6px;background:rgba(102,126,234,.1);border-radius:4px;font-size:.7rem;color:#667eea;font-weight:500;font-family:Monaco,Menlo,Ubuntu Mono,monospace;line-height:1.4}.hidden{display:none!important}footer{text-align:center;margin-top:40px;padding:20px;color:#a8c8a899;font-size:14px;font-family:Courier New,Courier,monospace;text-shadow:0 1px 2px rgba(0,0,0,.8)}@media (max-width: 768px){.container{padding:16px}header{flex-direction:column;gap:16px;text-align:center}.grid{grid-template-columns:1fr}h1{font-size:1.5rem}}.loading{display:inline-block;width:16px;height:16px;border:2px solid #f3f3f3;border-top:2px solid #667eea;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.modal{position:fixed;top:0;left:0;width:100%;height:100%;z-index:10000;display:flex;align-items:center;justify-content:center}.modal.hidden{display:none}.modal-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.8);backdrop-filter:blur(4px)}.modal-content{position:relative;z-index:10001;background:linear-gradient(180deg,rgba(30,15,15,.98) 0%,rgba(20,10,10,.98) 100%),radial-gradient(ellipse at 20% 30%,rgba(100,0,0,.2) 0%,transparent 50%),radial-gradient(ellipse at 80% 70%,rgba(100,0,0,.2) 0%,transparent 50%),repeating-linear-gradient(90deg,rgba(40,30,20,.3) 0px,rgba(50,40,30,.3) 2px,rgba(30,20,10,.3) 4px);border:2px solid rgba(150,40,40,.8);border-radius:4px;min-width:400px;max-width:600px;box-shadow:0 20px 60px #000000e6,inset 0 1px #96323233,0 0 40px #9600004d;animation:modalSlideIn .3s ease-out}.modal-header{padding:20px 24px;border-bottom:2px solid rgba(150,40,40,.5);background:linear-gradient(180deg,rgba(40,20,20,.5) 0%,transparent 100%),repeating-linear-gradient(0deg,transparent 0px,rgba(150,0,0,.1) 1px,transparent 2px)}.modal-header h3{margin:0;color:#f44;font-size:24px;font-weight:700;text-shadow:0 0 10px rgba(255,68,68,.5),0 2px 4px rgba(0,0,0,.8);font-family:Monaco,Menlo,Ubuntu Mono,monospace}.modal-body{padding:24px;color:#d4d4d4;line-height:1.6;font-size:16px;background:rgba(0,0,0,.2)}.modal-body p{margin:0;text-shadow:0 1px 2px rgba(0,0,0,.8)}.modal-footer{padding:16px 24px;border-top:2px solid rgba(150,40,40,.5);display:flex;justify-content:flex-end;background:linear-gradient(180deg,transparent 0%,rgba(40,20,20,.5) 100%)}.modal-footer .btn{min-width:100px}@keyframes modalSlideIn{0%{opacity:0;transform:translateY(-20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes heartbeat{0%{transform:scale(1)}10%{transform:scale(.9)}20%{transform:scale(1.1)}30%{transform:scale(.95)}40%{transform:scale(1.05)}50%{transform:scale(1)}to{transform:scale(1)}}@keyframes bloodDrip{0%{opacity:0;clip-path:circle(0% at 50% 0%)}50%{opacity:1;clip-path:circle(100% at 50% 0%)}to{opacity:.6;clip-path:circle(150% at 50% 0%)}}@keyframes bloodPulse{0%,to{filter:drop-shadow(0 0 5px rgba(200,0,0,.8)) brightness(1)}50%{filter:drop-shadow(0 0 15px rgba(255,0,0,1)) brightness(1.3)}}.cell.blood-splash{animation:heartbeat 1.5s ease-in-out;will-change:transform}.cell.blood-splash:after{content:"";position:absolute;inset:-20%;background:radial-gradient(circle at center,rgba(150,0,0,.3) 0%,rgba(100,0,0,.2) 30%,transparent 70%);pointer-events:none;animation:bloodDrip .5s ease-out forwards;z-index:-2;will-change:opacity,clip-path}.cell.x.blood-splash,.cell.o.blood-splash{animation:heartbeat 1.5s ease-in-out,bloodPulse 1s ease-in-out 1.5s 1}@keyframes winnerGlow{0%,to{filter:drop-shadow(0 0 8px rgba(255,0,0,1)) brightness(1.2);transform:scale(1.05)}50%{filter:drop-shadow(0 0 20px rgba(255,0,0,1)) brightness(1.4);transform:scale(1.08)}}.cell.winner{animation:winnerGlow 2s ease-in-out infinite;will-change:filter,transform;z-index:10}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}@keyframes boardShake{0%{transform:translate(0)}20%{transform:translate(-5px)}40%{transform:translate(5px)}60%{transform:translate(-3px)}80%{transform:translate(3px)}to{transform:translate(0)}}.game-board.shake{animation:boardShake .25s ease-in-out;will-change:transform}