:root{--background:#0f172a;--foreground:#e2e8f0;--primary:#38bdf8;--secondary:#64748b;--accent:#f472b6;--glass-bg:rgba(30,41,59,0.7);--glass-border:rgba(255,255,255,0.1);--board-bg:#eab308;--board-line:#000}body{margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;background-color:var(--background);color:var(--foreground);overflow-x:hidden}*{box-sizing:border-box}.container{max-width:1200px;margin:0 auto;padding:2rem;min-height:100vh}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-2{gap:.5rem}.gap-4{gap:1rem}.gap-6{gap:1.5rem}.gap-8{gap:2rem}.mb-4{margin-bottom:1rem}.mb-6{margin-bottom:1.5rem}.mb-12{margin-bottom:3rem}.mt-4{margin-top:1rem}.mt-auto{margin-top:auto}.p-4{padding:1rem}.p-6{padding:1.5rem}.p-8{padding:2rem}.w-full{width:100%}.text-center{text-align:center}.text-4xl{font-size:2.5rem;line-height:1}.text-2xl{font-size:1.5rem;line-height:2rem}.text-xl{font-size:1.25rem}.text-lg,.text-xl{line-height:1.75rem}.text-lg{font-size:1.125rem}.text-sm{font-size:.875rem;line-height:1.25rem}.font-bold{font-weight:700}.font-semibold{font-weight:600}.text-primary{color:var(--primary)}.text-secondary{color:var(--secondary)}.text-accent{color:var(--accent)}.text-transparent{color:transparent}.bg-clip-text{-webkit-background-clip:text;background-clip:text}.bg-gradient-title{background-image:linear-gradient(to right,var(--primary),var(--accent))}.glass{background:var(--glass-bg);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--glass-border);border-radius:16px;box-shadow:0 4px 30px rgba(0,0,0,.1)}.btn{padding:.75rem 1.5rem;border-radius:8px;border:none;font-weight:600;cursor:pointer;transition:all .2s ease;font-size:1rem}.btn-primary{background:var(--primary);color:#0f172a}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(56,189,248,.4)}.btn-secondary{background:transparent;border:1px solid var(--secondary);color:var(--foreground)}.btn-secondary:hover{background:rgba(255,255,255,.05)}.input{width:100%;padding:.75rem;border-radius:8px;border:1px solid var(--glass-border);background:rgba(0,0,0,.2);color:white;font-size:1rem;outline:none;transition:border-color .2s}.input:focus{border-color:var(--primary)}.game-layout{display:flex;flex-direction:column;gap:2rem;width:100%;max-width:1200px;margin:0 auto}@media (min-width:768px){.game-layout{flex-direction:row;align-items:flex-start}.game-sidebar{width:300px;flex-shrink:0}}.game-sidebar{order:2}@media (min-width:768px){.game-sidebar{order:1}}.board-wrapper{flex:1 1;display:flex;justify-content:center;order:1}@media (min-width:768px){.board-wrapper{order:2}}.board-grid{background-color:#dcb35c;background-image:url(https://www.transparenttextures.com/patterns/wood-pattern.png);position:relative;box-shadow:0 20px 50px rgba(0,0,0,.5);border-radius:4px;padding:8px}.board-inner{display:grid;grid-template-columns:repeat(19,1fr);grid-template-rows:repeat(19,1fr);width:100%;height:100%;background:transparent}.intersection{position:relative;display:flex;align-items:center;justify-content:center;cursor:pointer}.intersection:before{top:50%;left:0;width:100%;height:1px}.intersection:after,.intersection:before{content:"";position:absolute;background:var(--board-line);z-index:0}.intersection:after{top:0;left:50%;width:1px;height:100%}.intersection.top-edge:after{top:50%;height:50%}.intersection.bottom-edge:after{height:50%}.intersection.left-edge:before{left:50%;width:50%}.intersection.right-edge:before{width:50%}.stone{width:92%;height:92%;border-radius:50%;box-shadow:2px 2px 4px rgba(0,0,0,.4);z-index:10;position:relative}.stone.black{background:radial-gradient(circle at 30% 30%,#444,#000)}.stone.white{background:radial-gradient(circle at 30% 30%,#fff,#ddd)}.star-point{position:absolute;width:20%;height:20%;max-width:8px;max-height:8px;background:#000;border-radius:50%;z-index:1}.games-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));grid-gap:1.5rem;gap:1.5rem}.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;justify-content:center;align-items:center;z-index:100}.modal-content{width:100%;max-width:400px;animation:fadeIn .3s ease-out}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.badge{padding:.25rem .5rem;border-radius:4px;font-size:.75rem}.badge-playing{background:rgba(34,197,94,.2);color:#4ade80}.badge-waiting{background:rgba(234,179,8,.2);color:#facc15}.player-card{padding:.75rem;border-radius:.5rem;border:1px solid transparent}.player-card.active{border-color:var(--primary);background:rgba(56,189,248,.1)}@keyframes heartbeat{0%{transform:translate(-50%,-50%) scale(1);opacity:.8}50%{transform:translate(-50%,-50%) scale(1.5);opacity:.4}to{transform:translate(-50%,-50%) scale(1);opacity:.8}}.last-move-marker{position:absolute;top:50%;left:50%;width:30%;height:30%;background-color:#ef4444;border-radius:50%;transform:translate(-50%,-50%);animation:heartbeat 1.5s ease-in-out infinite;pointer-events:none;z-index:20}