*{box-sizing:border-box;margin:0;padding:0}:root{--black-shadow:#0000004d;--white-shadow:#fffc;--pink-background:#faebfa80;--pink-line:#fac8fa;--pink-frost:#ff69b41a;--pink-border:#ff69b433;--pink-shadow:#ff64b44d;--magenta-font:#ff1eff;--yellow-circle:#fafaa0;--yellow-font-inner:#fafa96cc;--yellow-font-outer:#e6fa64e6;--yellow-font-back:#ffff14;--yellow-background:#ffdc8280;--brown-title:#5a4132;--brown-font:#3c1e14;--brown-border:#ffc8c880}body{align-items:center;background:url(/static/media/tune-background.ed7d60042f17258f5c0e.jpg);background-position:50%;background-repeat:repeat-x;background-size:contain;display:flex;font-family:Arial,sans-serif;justify-content:center;max-width:1600px;min-height:100vh}.row-container{flex-direction:row;gap:20px;min-height:400px;transition:all 1s ease}.column-container,.row-container{align-items:center;display:flex;justify-content:center;min-width:400px;padding:40px;width:100%}.column-container{flex-direction:column}.container{align-items:center;display:flex;gap:20px;justify-content:center;max-width:1200px;padding:20px;width:100%}p.beian{margin-top:20px;text-align:center}a.beian{color:gray;text-decoration:none}@media (max-width:960px){body{background-repeat:no-repeat;background-size:cover}.row-container{flex-direction:column;gap:0;padding:10px}.column-container{padding:10px}}.profile-container{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:var(--pink-background);border:5px solid var(--pink-border);border-radius:25px;box-shadow:0 20px 50px var(--pink-shadow);max-width:1200px;min-width:400px;padding:30px;width:100%}.circle-image{animation:float 5s ease-in-out infinite;border:5px solid #fff;border-radius:50%;box-shadow:0 10px 30px var(--black-shadow);height:200px;overflow:hidden;position:relative;transition:all .5s ease;width:200px}.circle-image:hover{border-color:var(--yellow-circle);box-shadow:0 15px 40px var(--black-shadow);transform:scale(1.2)}.circle-image img{height:100%;object-fit:cover;transition:transform .5s ease;width:100%}.circle-image:hover img{transform:scale(1.6)}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.profile-title{animation:bounce 10s ease-in-out infinite;-webkit-background-clip:text;background-clip:text;color:var(--brown-title);display:inline-block;font-family:Comic Sans MS,Marker Felt,Arial Rounded MT Bold,cursive;font-size:36px;font-weight:800;letter-spacing:1px;margin-bottom:10px;padding:5px 15px;position:relative;text-shadow:3px 3px 0 var(--yellow-font-inner),6px 6px 0 var(--yellow-font-outer),0 0 15px var(--yellow-font-back)}.profile-title:before{animation:sparkle 2s ease-in-out infinite;left:-25px}.profile-title:after,.profile-title:before{content:"✨";font-size:24px;position:absolute;top:50%;transform:translateY(-50%)}.profile-title:after{animation:sparkle 2s ease-in-out .5s infinite;right:-25px}@keyframes bounce{0%,to{transform:rotate(1deg) translateY(0)}50%{transform:rotate(-1deg) translateY(20px)}}@keyframes sparkle{0%,to{opacity:.7;transform:translateY(-50%) scale(1)}50%{opacity:1;transform:translateY(-50%) scale(1.2)}}@media (max-width:960px){.circle-image{height:150px;width:150px}}@media (max-width:480px){.circle-image{border-width:3px;height:120px;width:120px}}.pagination{align-items:center;display:flex;justify-content:space-between;margin-top:20px;padding:15px 0}.pagination-info{color:gray;font-size:12px;text-align:center}.pagination-controls{align-items:center;display:flex;gap:5px;justify-content:center}.page-btn{background:var(--yellow-font-inner);border:2px solid var(--yellow-circle);border-radius:4px;cursor:pointer;font-size:14px;margin-top:1px;min-height:20px;min-width:20px;padding:2px 5px;transition:all .3s}.page-btn:hover:not(.active){border-color:var(--brown-title);box-shadow:0 4px 12px var(--black-shadow);color:var(--brown-font);transform:translateY(-1px)}.page-btn.active{background-color:var(--yellow-font-inner);border-color:var(--pink-line);color:var(--magenta-font)}.ellipsis{color:gray;padding:8px 4px}.pagination-btn{align-items:center;background-color:var(--yellow-font-inner);border:2px solid var(--yellow-circle);border-radius:8px;color:#2d3748;cursor:pointer;display:inline-flex;font-size:14px;font-weight:500;gap:6px;justify-content:center;min-height:25px;min-width:30px;transition:all .3s cubic-bezier(.4,0,.2,1)}.pagination-btn:hover:not(:disabled){border-color:var(--brown-title);box-shadow:0 4px 12px var(--black-shadow);color:var(--brown-font);transform:translateY(-1px)}.pagination-btn:active:not(:disabled){box-shadow:0 2px 6px var(--pink-shadow);transform:translateY(0)}.pagination-btn:disabled{background-color:var(--pink-background);border-color:var();box-shadow:none;color:gray;cursor:not-allowed;transform:none}.prev-btn:before{content:"<";font-weight:700}.next-btn:after{content:">";font-weight:700}.login-outer-frame{align-items:center;background-color:var(--black-shadow);bottom:0;display:flex;justify-content:center;left:0;position:fixed;right:0;top:0;z-index:10}.login-inner-frame{background:linear-gradient(-135deg,var(--yellow-font-inner) 0,var(--yellow-font-outer) 100%);border:1px solid var(--yellow-font-back);border-radius:8px;box-shadow:0 0 20px inset var(--pink-shadow);min-width:300px;padding:20px}.login-form{align-items:center;display:flex;flex-direction:column}.login-head{color:#381e15;text-align:center}input.login-input{background-color:var(--yellow-background);margin:5px 0;padding:8px;text-align:center;width:80%}input.login-input:focus{outline:1px solid var(--pink-line)}.login-submit{margin:10px 0}.login-cancel,.login-submit{background-color:var(--yellow-font-outer);border-color:var(--brown-border);text-align:center;width:20%}@keyframes fadeIn{0%{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}.table-container{animation:fadeIn .5s ease-in-out;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background-color:var(--yellow-background);border:3px solid var(--brown-border);border-radius:25px;box-shadow:0 20px 50px var(--pink-shadow),inset 0 0 0 1px var(--white-shadow);flex:1 1;max-width:1200px;min-height:400px;min-width:400px;overflow:hidden;text-align:center;transition:all .5s ease;width:80%}.table-header{background-color:var(--pink-frost);border-bottom:3px solid var(--pink-line);justify-content:space-between;padding:5px 30px}.table-header,.table-title{align-items:center;display:flex}.table-title{color:var(--brown-title);font-size:28px;font-weight:800;gap:12px;text-shadow:2px 2px 4px var(--pink-shadow)}.table-search,.table-title{font-family:Comic Sans MS,cursive}.table-search{border:2px solid #fff;border-radius:8px;font-size:12px;outline:none;padding:4px 6px;transition:all .3s ease;width:40%}@media (max-width:960px){.table-container{border-radius:20px;margin:10px}.table-header{flex-direction:column;gap:15px;text-align:center}}.cute-table{background:#0000;border-collapse:collapse;width:100%}.cute-table thead{background-color:var(--pink-frost)}.cute-table th{border-bottom:3px solid var(--pink-line);color:var(--brown-title);font-family:Comic Sans MS,cursive;font-size:20px;font-weight:700;letter-spacing:.5px;padding:10px 15px;position:relative;text-align:center;text-transform:uppercase}.cute-table th:after{bottom:-3px;content:"";height:3px;left:0;position:absolute;transition:width .2s ease;width:0}.cute-table th:hover:after{width:100%}.cute-table tr{transition:all .4s cubic-bezier(.175,.885,.32,1.275)}.cute-table tr:hover{background:linear-gradient(135deg,var(--brown-border) 0,var(--pink-border) 100%);transform:translateX(1px) scale(1.01)}.cute-table td{border-bottom:1px solid var(--brown-border);color:var(--brown-font);font-size:14px;padding:8px 15px;text-align:center;transition:all .3s ease;white-space:normal}.cute-table tr:hover td{color:var(--magenta-font);transform:translateY(1px)}.song-input{background-color:var(--pink-background);border-color:var(--brown-border);text-align:center;width:100px}.song-input:focus{outline:2px solid var(--pink-line)}.song-submit{background-color:var(--yellow-font-outer)}.song-delete,.song-submit{border-color:var(--brown-border);text-align:center}.song-delete{background-color:var(--yellow-font-inner)}.loading{align-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fff;border-radius:20px;bottom:0;display:flex;flex-direction:column;justify-content:center;left:0;position:absolute;right:0;top:0;z-index:1}.spinner{animation:spin 2s linear infinite;font-size:48px;margin-bottom:20px}@keyframes spin{0%,to{transform:rotate(-30deg)}10%,90%{transform:rotate(-30deg)}40%,60%{transform:rotate(30deg)}50%{transform:rotate(30deg)}}@media(max-width:960px){.cute-table{font-size:13px}.cute-table td,.cute-table th{padding:12px 8px}}
/*# sourceMappingURL=main.c9bd6525.css.map*/