*{box-sizing:border-box;margin:0;padding:0}body{color:#2c1810;background-color:#0000;background-image:radial-gradient(#ffffff1a 0%,#0000 70%),linear-gradient(135deg,#d4c4a8 0%,#c9b896 50%,#d4c4a8 100%);background-position:0 0;background-repeat:repeat;background-size:auto;background-attachment:scroll;background-origin:padding-box;background-clip:border-box;min-height:100vh;font-family:Georgia,Times New Roman,serif;overflow:hidden}.parchment-panel{background:linear-gradient(135deg,#e8dcc8 0%,#dccfb6 100%);border:3px solid #3c2818;border-radius:4px;position:relative;box-shadow:0 4px 8px #2c18104d,inset 0 1px #ffffff4d,inset 0 -1px #2c181033}.parchment-panel:before{content:"";pointer-events:none;opacity:.1;z-index:0;background:url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"100\" height=\"100\"><rect fill=\"%23e8dcc8\" width=\"100\" height=\"100\"/><rect fill=\"%23dccfb6\" width=\"100\" height=\"100\" opacity=\"0.5\"/><rect fill=\"%23d4c4a8\" width=\"2\" height=\"2\" x=\"10\" y=\"10\" opacity=\"0.3\"/><rect fill=\"%23d4c4a8\" width=\"2\" height=\"2\" x=\"30\" y=\"30\" opacity=\"0.3\"/><rect fill=\"%23d4c4a8\" width=\"2\" height=\"2\" x=\"50\" y=\"50\" opacity=\"0.3\"/><rect fill=\"%23d4c4a8\" width=\"2\" height=\"2\" x=\"70\" y=\"70\" opacity=\"0.3\"/><rect fill=\"%23d4c4a8\" width=\"2\" height=\"2\" x=\"90\" y=\"90\" opacity=\"0.3\"/></svg>");position:absolute;top:0;bottom:0;left:0;right:0}.title{color:#2c1810;text-align:center;text-shadow:1px 1px 2px #2c18104d;z-index:1;letter-spacing:2px;font-family:Georgia,Times New Roman,serif;font-size:3.5rem;font-weight:700;position:relative}.subtitle{color:#5c4033;text-align:center;z-index:1;font-family:Georgia,Times New Roman,serif;font-size:1.2rem;font-style:italic;position:relative}.parchment-button{color:#2c1810;cursor:pointer;text-transform:uppercase;letter-spacing:1px;z-index:1;background:linear-gradient(135deg,#e8dcc8 0%,#dccfb6 100%);border:2px solid #3c2818;border-radius:4px;margin:8px;padding:12px 24px;font-family:Georgia,Times New Roman,serif;font-size:1.1rem;font-weight:700;transition:all .2s;position:relative;box-shadow:0 2px 4px #2c18104d,inset 0 1px #ffffff4d}.parchment-button:hover{background:linear-gradient(135deg,#f0e4d0 0%,#e8dcc8 100%);transform:translateY(-2px);box-shadow:0 4px 8px #2c181066,inset 0 1px #fff6}.parchment-button:active{transform:translateY(0);box-shadow:0 2px 4px #2c18104d,inset 0 1px #fff3}#app{flex-direction:column;justify-content:center;align-items:center;width:100vw;height:100vh;display:flex}#game-container{z-index:1;width:100%;height:100%;position:absolute;top:0;left:0}.loading-screen,.menu-screen,.training-screen{z-index:10;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:absolute;top:0;left:0}.hidden{display:none!important}.loading-indicator{background:#dccfb6;border:2px solid #3c2818;border-radius:2px;width:200px;height:4px;margin-top:20px;position:relative;overflow:hidden}.loading-bar{z-index:1;background:linear-gradient(90deg,#8b7355 0%,#a0826d 100%);width:0%;height:100%;animation:2s ease-in-out infinite loading;position:relative}@keyframes loading{0%{width:0%}50%{width:70%}to{width:100%}}.menu-panel{width:90%;max-width:400px;padding:40px}.menu-nav{z-index:1;flex-direction:column;align-items:center;margin-top:30px;display:flex;position:relative}.training-ui{z-index:20;padding:20px}.training-ui .parchment-panel{max-width:300px;padding:20px}.training-ui h2{color:#2c1810;z-index:1;margin-bottom:10px;font-family:Georgia,Times New Roman,serif;position:relative}.training-ui p{color:#5c4033;z-index:1;margin-bottom:20px;position:relative}.back-button-overlay{z-index:100;pointer-events:auto;position:fixed;top:20px;left:20px}.back-button-overlay .parchment-button{color:#2c1810;cursor:pointer;text-transform:uppercase;letter-spacing:1px;background:linear-gradient(135deg,#e8dcc8 0%,#dccfb6 100%);border:2px solid #3c2818;border-radius:4px;margin:8px;padding:12px 24px;font-size:.9rem;font-weight:700;transition:all .2s;box-shadow:0 2px 4px #2c18104d,inset 0 1px #ffffff4d}.back-button-overlay .parchment-button:hover{background:linear-gradient(135deg,#f0e4d0 0%,#e8dcc8 100%);transform:translateY(-2px);box-shadow:0 4px 8px #2c181066,inset 0 1px #fff6}.back-button-overlay .parchment-button:active{transform:translateY(0);box-shadow:0 2px 4px #2c18104d,inset 0 1px #fff3}@media (max-width:768px){.title{font-size:2.5rem}.subtitle{font-size:1rem}.menu-panel{padding:20px}.parchment-button{padding:10px 20px;font-size:1rem}}