@import "https://fonts.googleapis.com/css2?family=Montserrat:wght@700&family=Pacifico&display=swap";
:root{--font-main:Arial,sans-serif;--font-header:"Pacifico","Montserrat","Segoe UI",Arial,sans-serif;--text-color-main:#f0f0f0;--text-color-header:#2ea4ff;--text-color-highlight:#e2ac60cc;--bg-main:#222;--bg-button:linear-gradient(135deg,#333 0%,#444 100%);--bg-small-button:linear-gradient(135deg,#333 0%,#555 100%);--bg-hover:linear-gradient(135deg,#2ea4ff 0%,#333 100%);--bg-active:linear-gradient(135deg,#38ef7dcc 0%,#11998ecc 100%);--bg-inactive:linear-gradient(135deg,#f0f0f0 0%,#888 100%);--bg-board:#2ea4ff5d;--bg-dropdown:linear-gradient(135deg,#232526 0%,#414345 100%);--bg-highlight:#2ea4ff80;--bg-last-move:#38ef7d80;--bg-right1:#fbff0080;--bg-right2:#cc2b5e80;--bg-can-move:#2ea4ff80;--bg-premove:#2ea4ff80;--border-soft:1.5px solid #333;--border-strong:1.5px solid #2ea4ff;--border-muted:1.5px solid #444;--border-danger:1.5px solid #b71c1c;--box-shadow-soft:0 2px 8px #2ea4ff1a;--box-shadow-strong:0 4px 12px #11998ecc;--box-shadow-glow:0 0 0 3px #38ef7d77;--box-shadow-heavy:0 4px 18px #333;--box-shadow-error:#b71c1c 0px 0px 0px 3px;--white-square:#f0d9b5;--black-square:#b58863}*{caret-color:#0000}body{font-family:var(--font-main);background:var(--bg-main);color:var(--text-color-main);margin:0}header{background:var(--bg-button);border-bottom:var(--border-soft);box-shadow:var(--box-shadow-soft);justify-content:space-between;align-items:center;height:3.5rem;min-height:3.5rem;padding:.5rem 1rem;display:flex}.logo-container{align-items:center;gap:.5rem;height:100%;margin:.5rem 0 .5rem -10rem;text-decoration:none;display:flex;overflow:visible}.logo{color:var(--bg-hover);text-align:center;align-items:center;height:100%;font-size:2rem;line-height:1;display:flex}.logo-text{color:var(--text-color-header);font-size:2.5rem;font-family:var(--font-header);text-align:center;align-items:center;height:100%;font-weight:1;line-height:1;text-decoration:none;display:flex}.logo-container img{width:auto;height:3.5rem}.dropdown{z-index:10;display:inline-block;position:relative}.dropbtn{background:var(--bg-button);color:var(--text-color-main);border:var(--border-soft);cursor:pointer;box-shadow:var(--box-shadow-soft);border-radius:8px;padding:.6rem 1.2rem;font-size:1.4rem;transition:all .2s}.dropbtn:hover{background:var(--bg-hover);box-shadow:var(--box-shadow-glow)}.dropdown-content{background:var(--bg-dropdown);min-width:200px;box-shadow:var(--box-shadow-heavy);opacity:0;pointer-events:none;border-radius:8px;margin-top:0;padding:.5rem 0;transition:opacity .2s,transform .2s;position:absolute;top:100%;right:0;transform:translateY(-10px)}.dropdown-content.open{opacity:1;pointer-events:auto;transform:translateY(0)}.dropdown-content a{color:var(--text-color-main);font-family:var(--font-main);padding:.75rem 1.2rem;font-size:1rem;text-decoration:none;transition:background .2s;display:block}.dropdown-content a:hover{background:var(--bg-hover);color:var(--text-color-main)}.play{text-align:center;margin:2rem auto}.play h2,.practice h2{font-size:2.2rem;font-family:var(--font-main);text-align:center;background:linear-gradient(135deg,#fff,#fafafa);-webkit-text-fill-color:transparent;text-shadow:0 2px 6px #2ea4ff40;letter-spacing:1px;-webkit-background-clip:text;background-clip:text;margin:2rem 0 1rem;position:relative}.play h2:after,.practice h2:after{content:"";background:var(--bg-hover);opacity:.7;border-radius:2px;width:60px;height:3px;margin:.5rem auto 0;display:block}.time-grid{grid-template-columns:repeat(4,1fr);justify-content:center;gap:.75rem;max-width:500px;margin:1rem auto;display:grid}.time-grid a{background:var(--bg-button);border:var(--border-muted);box-shadow:var(--box-shadow-soft);color:var(--text-color-main);aspect-ratio:1;border-radius:8px;flex-direction:column;justify-content:center;align-items:center;padding:1rem;font-size:1.5rem;font-weight:700;text-decoration:none;display:flex}.time-grid a small{color:#ccc;margin-top:.2rem;font-size:1rem;font-weight:400}.time-grid a:hover{background:var(--bg-hover)}.time-box{background:var(--bg-small-button)}.time-box:hover{filter:brightness(1.1);box-shadow:var(--box-shadow-glow)}.practice{text-align:center;margin:2rem}.practice-grid{flex-wrap:wrap;justify-content:center;gap:2rem;display:flex}.practice-box{background:var(--bg-button);border:var(--border-soft);text-align:left;width:300px;color:var(--text-color-main);box-shadow:var(--box-shadow-soft);border-radius:10px;flex-direction:column;padding:2rem;text-decoration:none;display:flex}.practice-box:hover{background:var(--bg-hover)}.practice-box h3{color:var(--text-color-main);align-items:center;gap:.4rem;margin-bottom:.6rem;font-size:1.4rem;display:flex}.practice-desc{margin-bottom:auto;font-size:.95rem;line-height:1.3}.emphasis{color:var(--text-color-highlight);font-weight:600}.tiny-note{color:#aaa;margin-top:auto;font-size:.75rem;font-style:italic}@media (max-width:768px){.header{flex-direction:column;gap:1rem}.search{width:100%}.time-grid{grid-template-columns:repeat(2,1fr)}.practice-box{width:100%}}#fullScreenLoadingOverlay{z-index:9999;color:#fff;text-align:center;background:#000000b3;justify-content:center;align-items:center;width:100vw;height:100vh;font-size:2em;display:none;position:fixed;top:0;left:0}#fullScreenLoadingOverlay .loader{margin-bottom:20px}
.info-page{text-align:left;max-width:600px;color:var(--text-color-main);margin:auto;padding:2rem;font-size:1.1rem;line-height:1.6}.info-content p{margin-bottom:1.4rem}.buy-coffee{background:linear-gradient(90deg,var(--bg-button)60%,var(--bg-hover)100%);color:var(--text-color-main);box-shadow:0 2px 8px var(--box-shadow-soft);border:0px solid var(--text-color-header);letter-spacing:.03em;cursor:pointer;border-radius:12px;align-items:center;gap:.7rem;margin-top:.2rem;padding:.7rem 1.6rem;font-weight:700;text-decoration:none;transition:background .2s,box-shadow .2s,transform .1s;display:inline-flex}.buy-coffee:hover{background:linear-gradient(90deg,var(--bg-hover)60%,var(--bg-button)100%);box-shadow:0 4px 16px var(--box-shadow-glow);color:var(--text-color-main);transform:translateY(-2px)scale(1.03)}.coffee-icon{filter:drop-shadow(0 1px 2px var(--box-shadow-soft));font-size:1.4rem}.link{color:var(--text-color-header);text-decoration:none;transition:color .2s}.link:hover{color:var(--text-color-main);text-decoration:underline}.link:visited{color:var(--text-color-header)}
.profile-page{font-family:var(--font-main);background:var(--bg-main);color:var(--text-color-main);padding:2rem}.followlist{flex-direction:column;align-items:center;gap:1rem;width:50%;max-height:16rem;margin-top:1rem;margin-left:auto;margin-right:auto;display:flex;overflow-y:auto}.followlist li{width:90%;color:var(--text-color-highlight);background:var(--bg-small-button);box-shadow:var(--box-shadow-soft);border-radius:.5rem;justify-content:center;align-items:center;padding:.7rem 1rem;font-size:1.1rem;list-style:none;transition:background .2s;display:flex}.followlist li:hover{background:var(--bg-hover)}.followlist li a{color:var(--text-color-highlight);font-weight:500;text-decoration:none;transition:color .2s,-webkit-text-decoration .2s,text-decoration .2s}.followlist li a:hover,.followlist li a:focus{color:var(--text-color-link);text-decoration:underline}.profile-header{flex-direction:column;align-items:center;gap:2rem;margin-top:2rem;display:flex}.profile-picture img{object-fit:cover;border:var(--border-soft);width:8rem;height:8rem;box-shadow:var(--box-shadow-soft);border-radius:50%}.profile-picture{width:8rem;height:8rem;box-shadow:var(--box-shadow-soft);border-radius:50%;position:relative;overflow:hidden}.profile-picture img{object-fit:cover;width:100%;height:100%}.edit-icon{background:var(--bg-button);cursor:pointer;color:var(--text-color-main);box-shadow:var(--box-shadow-heavy);border-radius:50%;padding:.4rem;font-size:1rem;position:absolute;bottom:.3rem;right:.3rem}.profile-info{flex-direction:column;align-items:center;gap:2rem;display:flex}.profile-name-row,.profile-bio-row{flex-direction:column;align-items:center;gap:.5rem;width:26rem;display:flex}.name-input,.name-text{text-align:center;width:100%;font-size:1.5rem;caret-color:auto!important;-webkit-user-select:text!important;user-select:text!important}.bio-box{background:var(--bg-small-button);border:var(--border-muted);color:var(--text-color-main);white-space:pre-wrap;overflow-wrap:break-word;word-break:break-word;border-radius:.5rem;padding:1rem;font-size:1rem;overflow:hidden}.bio-input{width:100%;font-size:1rem;font-family:var(--font-main);color:#000;border:var(--border-muted);resize:none;box-sizing:border-box;background:#fff;border-radius:.5rem;padding:1rem;overflow:hidden;caret-color:auto!important;-webkit-user-select:text!important;user-select:text!important}.bio-text,.bio-edit{box-sizing:border-box;width:100%;max-width:30rem}.profile-tabs{margin-top:3rem}.tab-icons{flex-wrap:wrap;justify-content:center;gap:1rem;margin-bottom:1rem;display:flex}.tab-icons button{font-size:1rem;font-family:var(--font-main);background:var(--bg-button);color:var(--text-color-main);border:var(--border-muted);cursor:pointer;border-radius:.6rem;padding:.6rem 1.2rem;transition:background .2s}.tab-icons button.active{background:var(--bg-active);border:var(--border-strong);box-shadow:var(--box-shadow-glow)}.tab-icons button:hover:not(.active){background:var(--bg-hover)}.tab-content{background:var(--bg-small-button);border:var(--border-soft);box-shadow:var(--box-shadow-soft);border-radius:1rem;padding:1.5rem}.tab-content h3{color:var(--text-color-highlight);margin-bottom:1rem;font-size:1.3rem}.edit-button{all:unset;color:inherit;cursor:pointer;box-shadow:none;background:0 0;border:none;border-radius:0;padding:0;transition:none;display:inline}.edit-button:hover{background:0 0}.separating-line{background:linear-gradient(90deg,var(--bg-highlight)0%,var(--bg-right1)50%,var(--bg-active)100%);width:70%;height:4px;box-shadow:0 2px 12px var(--bg-highlight),0 0 8px var(--bg-right1);opacity:.95;border:none;border-radius:2rem;margin:2.5rem auto;transition:background .3s,box-shadow .3s;display:block}