@charset "UTF-8";.pop-over{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:999}.pop-over .contents{position:absolute;top:0;left:0;width:100vw;height:100vh;z-index:10}.pop-over .background{position:absolute;top:0;left:0;width:100vw;height:100vh;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:1}.rating-stars{display:flex;flex-direction:row;justify-content:center;align-items:center}.rating-stars .star svg{width:var(--rating-star-size);height:var(--rating-star-size);padding-right:var(--rating-star-between);stroke:#ed8a19;stroke-width:var(--rating-star-stroke-width)}.rating-stars .star.star-input svg{fill:transparent}.rating-stars .star.star-input.is-rated svg{fill:#ed8a19}.rating-stars .star.star-output svg{fill:var(--fill-value)}.input-element{outline:0px solid transparent;cursor:text;white-space:pre-line}.input-element:empty:before{content:attr(placeholder);color:#aaa}.contents .symphony{position:relative;max-height:100%;display:flex;flex-direction:column;container-type:inline-size}.contents .symphony .symphony-header{position:relative;padding:10px 10px 0;height:fit-content}.contents .symphony .symphony-header .composer{text-align:left}.contents .symphony .symphony-header .composer .composer-text{font-weight:700;font-size:15px;cursor:default}.contents .symphony .symphony-header .composer .composer-text:hover{text-decoration:underline}.contents .symphony .symphony-header .header-text{display:flex;flex-direction:row;align-items:baseline;border-bottom:1px solid #aaaaaa}.contents .symphony .symphony-header .header-text .name-wrapper{flex:1;padding:5px 10px 0;display:flex;flex-direction:row;align-items:baseline}.contents .symphony .symphony-header .header-text .name-wrapper .name{font-size:20px}.contents .symphony .symphony-header .header-text .name-wrapper .title{padding:0 10px;font-weight:700}.contents .symphony .symphony-header .header-text .name-wrapper .key{padding:0 10px;font-size:15px;opacity:.7}.contents .symphony .symphony-header .header-text .year{width:fit-content;padding-right:10px;font-size:18px}.contents .symphony .symphony-header .header-text .title,.contents .symphony .symphony-header .header-text .key{padding-left:10px}.contents .symphony .symphony-body{position:relative;flex:1;padding:10px 20px;display:flex;flex-direction:column;overflow-y:scroll}.contents .symphony .symphony-body::-webkit-scrollbar{display:none}.contents .symphony .symphony-body .info-section{display:flex;flex-direction:column}.contents .symphony .symphony-body .info-section .info-list .info-title{border-bottom:1px solid #aaaaaa}.contents .symphony .symphony-body .info-section .movements-section{padding:10px;font-size:15px;--left-border-colour: #aaaaaa}.contents .symphony .symphony-body .info-section .movements-section.editing{--left-border-colour: #ffc0c0}.contents .symphony .symphony-body .info-section .movements-section .movements-number{min-width:20px}.contents .symphony .symphony-body .info-section .movements-section .movements-content{border-left:2px solid var(--left-border-colour);margin:5px;padding-left:10px}.contents .symphony .symphony-body .info-section .movements-section .movements-content .movements{padding:5px;font-size:14px;white-space:pre-line}.contents .symphony .symphony-body .media-section{display:flex;flex-direction:column}.contents .symphony .symphony-body .media-section .media{display:flex;flex-direction:column;gap:20px;padding:10px}.contents .symphony .symphony-body .media-section .media .media-block{display:flex;flex-direction:column;gap:10px}.contents .symphony .symphony-body .media-section .media .media-block .media-input-group{display:flex;align-items:center;gap:10px;position:relative}.contents .symphony .symphony-body .media-section .media .media-block .media-input-group label{width:30px;height:30px;display:flex;align-items:center;justify-content:center}.contents .symphony .symphony-body .media-section .media .media-block .media-input-group input,.contents .symphony .symphony-body .media-section .media .media-block .media-input-group .media-input{flex:1;padding:8px 12px;border:1px solid #ccc;border-radius:8px;font-size:14px;transition:border-color .2s ease}.contents .symphony .symphony-body .media-section .media .media-block .media-input-group input:focus,.contents .symphony .symphony-body .media-section .media .media-block .media-input-group .media-input:focus{border-color:#666;outline:none}.contents .symphony .symphony-body .media-section .media .media-block .media-input-group.invalid input{border-color:#e63946;background-color:#ffecec}.contents .symphony .symphony-body .media-section .media .media-block .media-input-group .clear-button{background:transparent;border:none;font-size:18px;color:#999;cursor:pointer;margin-left:-5px;padding:0 6px;transition:color .2s ease}.contents .symphony .symphony-body .media-section .media .media-block .media-input-group .clear-button:hover{color:#333}.contents .symphony .symphony-body .media-section .media .media-block .media-embedding{width:100%;height:300px;border-radius:12px;border:none}@container (width > 720px){.contents .symphony .symphony-body{display:flex;flex-direction:row}.contents .symphony .symphony-body .media-section{width:480px;height:fit-content}}.contents .item{position:fixed;width:100%;height:100%;z-index:500;display:flex;align-items:center;flex-direction:row;--view-width: 65vw}.contents .item .view{position:relative;width:var(--view-width);min-width:var(--view-width);height:85vh;max-height:85vh;margin:30px;border-radius:10px;border:3px solid #aaaaaa;background-color:#fff;display:flex;flex-direction:column}.contents .item .view .body{position:relative;flex:1;overflow:hidden}.contents .item .view .body .buttons{position:absolute;top:10px;right:10px;padding:5px;display:flex;justify-content:center;align-items:center;cursor:default;z-index:100}.contents .item .view .body .buttons .button{font-size:12px;color:#666}.contents .item .view .body .buttons .button:hover{text-decoration:underline}.contents .item .view .body .buttons .save{padding-right:10px}.contents .item .view .body .symphony{z-index:1}.contents .item .view .footer{height:50px;min-height:50px;display:flex;justify-content:center;align-items:center}.contents .item .view .footer .close-button{width:80px;height:30px;color:#aaa;cursor:default;display:flex;justify-content:center;align-items:center}.contents .item .view .footer .close-button:hover{border:2px solid #dddddd;border-radius:15px}.contents .item .reviews-container{flex:1;height:100%;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-left:1px solid #aaaaaa;display:flex;flex-direction:column}.contents .item .reviews-container .comment-container{height:fit-content;padding:10px}.contents .item .reviews-container .comment-container .comment{background-color:#fff;border-radius:10px;padding:10px;display:flex;flex-direction:column}.contents .item .reviews-container .comment-container .comment .comment-content{min-width:100%;display:flex;flex-direction:row}.contents .item .reviews-container .comment-container .comment .comment-content .picture{width:fit-content;padding-left:5px;padding-right:5px}.contents .item .reviews-container .comment-container .comment .comment-content .picture img{width:30px;height:30px;border-radius:15px}.contents .item .reviews-container .comment-container .comment .comment-content .input{flex:1;display:flex;flex-direction:column;padding-left:5px}.contents .item .reviews-container .comment-container .comment .comment-content .input .input-header{padding:5px;display:flex;flex-direction:row;align-items:center}.contents .item .reviews-container .comment-container .comment .comment-content .input .input-header .rating-stars{width:fit-content;--rating-star-size: 18px;--rating-star-between: 5px;--rating-star-stroke-width: 3px}.contents .item .reviews-container .comment-container .comment .comment-content .input .input-header .post-container{flex:1;display:flex;flex-direction:row-reverse;justify-content:right}.contents .item .reviews-container .comment-container .comment .comment-content .input .input-header .post-container .post-button{padding:2px 7px;transform:translateY(-3px);opacity:1;cursor:default;border-radius:5px;background-color:#4169e1;display:flex;justify-content:center;align-items:center}.contents .item .reviews-container .comment-container .comment .comment-content .input .input-header .post-container .post-button:hover{opacity:.7}.contents .item .reviews-container .comment-container .comment .comment-content .input .input-header .post-container .post-button .post-button-text{font-size:14px;color:#fff}.contents .item .reviews-container .comment-container .comment .comment-content .input .text{transform:translateY(2px);font-size:15px}.contents .item .reviews-container .comment-container .login{text-align:center;font-weight:700;cursor:default}.contents .item .reviews-container .comment-container .login:hover{text-decoration:underline}.contents .item .reviews-container .reviews{flex:1;box-sizing:border-box;padding:5px 20px 20px;overflow:hidden scroll;display:flex;flex-direction:column}.contents .item .reviews-container .review{background-color:#fff;border-radius:10px;overflow-wrap:break-word;word-break:break-word;white-space:normal;box-sizing:border-box;padding:10px 5px 5px}.contents .item .reviews-container .review .header{display:flex;flex-direction:row}.contents .item .reviews-container .review .header .header-left{display:flex;justify-content:center;align-items:center}.contents .item .reviews-container .review .header .header-left .picture{width:fit-content;padding-left:5px;padding-right:10px}.contents .item .reviews-container .review .header .header-left .picture img{width:24px;height:24px;border-radius:12px}.contents .item .reviews-container .review .header .header-right{display:flex;flex-direction:column}.contents .item .reviews-container .review .header .header-right .username{font-weight:700;font-size:13px}.contents .item .reviews-container .review .header .header-right .rating-date-container{display:flex;flex-direction:row}.contents .item .reviews-container .review .header .header-right .rating-date-container .rating-stars{--rating-star-size: 10px;transform:translateY(-5px)}.contents .item .reviews-container .review .header .header-right .rating-date-container .review-date{padding-left:10px;font-size:11px;opacity:.6}.contents .item .reviews-container .message{text-align:center}.contents .item .stats{display:flex;flex-direction:row;padding:10px}.contents .item .stats .total{width:fit-content;display:flex;flex-direction:column;text-align:center;justify-content:center;align-items:center}.contents .item .stats .total .average{font-size:20px}.contents .item .stats .total .number{font-size:15px;color:#666}.contents .item .stats .distribution{flex:1;padding:5px;display:flex;flex-direction:column-reverse}.contents .item .stats .distribution .rate{height:15px;display:flex;flex-direction:row}.contents .item .stats .distribution .rate .number{width:20px;text-align:right;font-size:12px}.contents .item .stats .distribution .rate .rating-bar-container{flex:1;padding:0 5px;display:flex;justify-content:center;align-items:center}.contents .item .stats .distribution .rate .rating-bar-container .rating-bar{position:relative;width:100%}.contents .item .stats .distribution .rate .rating-bar-container .rating-bar .bar{position:absolute;left:0;height:5px;border-radius:3px}.contents .item .stats .distribution .rate .rating-bar-container .rating-bar .default{width:100%;background-color:#ccc;z-index:1}.contents .item .stats .distribution .rate .rating-bar-container .rating-bar .rating{background-color:var(--rating-colour);z-index:10}.view-container{position:absolute;top:50%;left:50%;z-index:1000;transform:translate(-50%,-50%);width:80%;min-width:80%;height:80vh;border-radius:10px;border:3px solid #aaaaaa;background-color:#fff;display:flex;flex-direction:column}.view-container .header{font-size:25px}.view-container .body{height:calc(100% - 50px);max-height:calc(100% - 50px);overflow-y:scroll;display:flex;flex-direction:column;justify-content:center}.view-container .body .method{display:flex;flex-direction:column;justify-content:center;align-items:center;cursor:default}.view-container .body .method:hover{border:1px solid black}.view-container .footer{height:50px;min-height:50px;display:flex;justify-content:center;align-items:center}.view-container .footer .close-button{width:80px;height:30px;color:#aaa;cursor:default;display:flex;justify-content:center;align-items:center}.view-container .footer .close-button:hover{border:2px solid #dddddd;border-radius:15px}.login{display:flex;flex-direction:column;align-items:center;gap:2rem;padding:2rem}.login-header{text-align:center}.login-header .logo{width:60px;height:60px;margin-bottom:1rem}.login-header .title{font-size:1.8rem;font-weight:700;margin:0}.login-header .subtitle{font-size:1rem;color:#666;margin-top:.5rem}.login-options{display:flex;flex-direction:column;gap:1rem;width:100%;max-width:320px}.login-options button{width:100%}.login .divider{display:flex;align-items:center;width:100%;max-width:320px;margin:1.5rem 0;color:#aaa;font-size:.85rem}.login .divider:before,.login .divider:after{content:"";flex:1;height:1px;background:#ddd;margin:0 .75rem}.login-footer{font-size:.9rem;color:#444}.login-footer a{color:#0070f3;text-decoration:none}.login-footer a:hover{text-decoration:underline}.login .method.google{display:flex;flex-direction:row;align-items:center;gap:12px;background-color:#fff;color:#444;border:1px solid #ccc;padding:.75rem 1rem;border-radius:8px;cursor:pointer;transition:box-shadow .2s ease,transform .1s ease;font-weight:500;font-size:1rem}.login .method.google img{width:20px;height:20px}.login .method.google:hover{box-shadow:0 2px 8px #00000014;transform:translateY(-2px)}.login .method.google:active{transform:scale(.98)}.media{display:flex;justify-content:center;padding-top:5px}.media .icons{width:50px;display:flex;flex-direction:row;justify-content:space-between}.media .icons .icon{opacity:.2;cursor:pointer}.media .icons .icon svg{width:20px;height:20px}.media .icons .icon.is-active{opacity:1}.badge-button{display:flex;align-items:center;gap:4px;background-color:#fff;border:none;border-radius:9999px;padding:3px 8px;box-shadow:0 1px 3px #0003;cursor:pointer;transition:box-shadow .2s ease-in-out,background-color .2s ease-in-out}.like-button{position:absolute;bottom:7px;right:5px}.bookmark-button{position:absolute;bottom:7px;left:5px}.badge-button:hover{box-shadow:0 2px 4px #0000004d}.like-icon{color:#ec4899;transition:fill .2s ease-in-out,color .2s ease-in-out;font-size:14px}.like-icon.active{fill:#ec4899;color:#ec4899}.bookmark-icon{color:#ffc107;transition:fill .2s ease-in-out,color .2s ease-in-out;font-size:14px}.bookmark-icon.active{fill:#ffc107;color:#ffc107}.badge-count{min-width:10px;font-size:12px;font-weight:600;color:#4a4a4a}.container{position:fixed;top:0;left:0;width:100vw;height:100vh;display:flex;flex-direction:row;overflow:hidden}.container.expanded{--tr-height: 160px}.container.shrinked{--tr-height: 25px}.container{--rating-colour: #ed8a19}.table{position:relative;width:100vw;height:100vh;border-collapse:separate;border-spacing:0}.table thead{z-index:100}.table thead tr{height:25px;max-height:25px;font-size:12px;z-index:50}.table thead .theme{position:sticky;z-index:1000}.table tbody{z-index:10}.table tbody tr{height:var(--tr-height);max-height:var(--tr-height);min-height:var(--tr-height);font-size:12px;background-color:transparent}.table tbody .left{z-index:1}.table td{padding:0}.table .sticky{position:sticky}.table .item{height:var(--tr-height);min-height:var(--tr-height)}.table .theme{top:0;left:0;width:229px;min-width:229px;border-right:2px solid black;border-bottom:2px solid black;box-sizing:border-box;text-align:center;z-index:100;position:relative;background-color:#fff;overflow:hidden;cursor:default}.table .theme .theme-content{position:relative;height:100%;display:flex;flex-direction:row-reverse}.table .theme .theme-content .title{position:absolute;top:0;left:0%;transform:translateY(-18px);font-size:40px;opacity:.2;font-family:Arial,Helvetica,sans-serif;z-index:200}.table .theme .theme-content .title:hover{opacity:.6}.table .theme .theme-content .account-button{height:100%;padding-left:10px;padding-right:10px;z-index:300}.table .theme .theme-content .account-button:hover .text{text-decoration:underline}.table .left{border-bottom:1px solid #999999;box-sizing:border-box;cursor:default}.table .left.is-hovered{background-color:#eee}.table .composer{left:0;width:200px;min-width:200px;background-color:#fff;border-right:1px solid #aaaaaa;text-align:center}.table .composer .composer-content{position:relative;padding:0;height:var(--tr-height);display:flex;flex-direction:column;justify-content:center;align-items:center}.table .composer .composer-content .list{padding:0}.table .composer .name{font-weight:700}.table .composer .info{transition:opacity .5s ease-in}.table .composer .composer-total-badges{display:flex;flex-direction:row}.table .composer .composer-total-badges .badge-total{padding:5px;display:flex;flex-direction:row;align-items:center;gap:4px;color:#666}.table .number{left:202.5px;width:26px;min-width:26px;background-color:#fff;border-right:2px solid black;text-align:center}.table .column{top:0;width:240px;min-width:240px;border-right:1px solid #aaaaaa;border-bottom:2px solid black;box-sizing:border-box;background-color:#fff}.table .cell{position:relative;width:240px;min-width:240px;height:var(--tr-height);text-align:center;border-bottom:1px solid #999999;border-right:1px solid #aaaaaa}.table .cell .cell-content-wrapper{position:relative;height:100%}.table .cell .cell-content-background{height:100%;display:flex;justify-content:center;align-content:center}.table .cell .cell-content-background.unordered{background-color:#f6f6f6}.table .cell .cell-content-background:hover{background-color:#eee;cursor:default}.table .cell .cell-content{height:fit-content;margin:auto}.table .cell .cell-content .name{font-weight:700}.table .cell .cell-content .rating-stars{padding-top:5px;--rating-star-size: 12px;--rating-star-between: 0px;--rating-star-stroke-width: 1px}.table .cell .cell-unordered:hover{background-color:#eee}.table .cell .dummy{color:#aaa;display:flex;justify-content:center}.table .cell .dummy:hover{background-color:#eee;cursor:default}.table .rest{background-color:#eee}.table .symphony{background-color:#fff}.table .symphony.is-blurred{color:#aaa}.table .symphony.is-unnumbered:hover{background-color:#eee}.table .header{border-bottom:2px solid black}.profile{display:flex;flex-direction:column;gap:2rem;padding:1rem 2rem}.profile-header{display:flex;align-items:center;gap:1rem}.profile-header .avatar{width:80px;height:80px;border-radius:50%;overflow:hidden;background-color:#f0f0f0;display:flex;align-items:center;justify-content:center;border:2px solid #ddd}.profile-header .avatar img{width:100%;height:100%;object-fit:cover;display:block}.profile-header .avatar svg{width:40px;height:40px;color:#888}.profile-header .info .name{margin:0;font-size:1.4rem;font-weight:600}.profile-header .info .email{display:flex;align-items:center;gap:.3rem;color:#666;font-size:.9rem;margin-top:.2rem}.profile-actions{display:flex;flex-direction:column;gap:.5rem}.profile-actions .action{display:flex;align-items:center;gap:.5rem;background:#f9f9f9;border:1px solid #ddd;padding:.75rem 1rem;border-radius:8px;cursor:pointer;font-size:.95rem;transition:background .2s ease}.profile-actions .action:hover{background:#f0f0f0}.profile .logout{display:flex;align-items:center;gap:.5rem;color:#e74c3c;cursor:pointer;font-weight:500;margin-top:auto;padding:.75rem 1rem;border:1px solid #e74c3c;border-radius:8px;transition:background .2s ease}.profile .logout:hover{background:#e74c3c1a}.search-container{position:fixed;bottom:16px;right:16px;z-index:100}.search-button{width:40px;height:40px;border-radius:50%;background-color:transparent;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);border:none;box-shadow:0 2px 5px #0003;transition:all .3s ease;cursor:default;box-sizing:border-box}.search-button .search-icon svg{position:absolute;top:50%;left:50%;width:20px;color:#aaa;transform:translate(-50%,-50%);transform-origin:center;transition:all .3s ease}.search-button:hover{box-shadow:0 2px 10px #0000004d}.search-button.active{background-color:#fff;box-shadow:0 2px 10px #0000004d}.search-button.active .search-icon svg{transform:translate(-50%,-50%) rotate(90deg);color:#666}.search-button.searching{border:2px solid #000000;background-color:#fff}.search-button.searching .search-icon svg{color:#000}.search-modal{position:absolute;bottom:0;right:64px;background-color:#fff;border-radius:8px;box-shadow:0 4px 15px #0000004d;width:calc(100vw - 340px);max-height:40px;display:flex;align-items:center;opacity:0;transform:translateY(10px);pointer-events:none;transition:opacity .3s ease,transform .3s ease}.search-modal.opening{opacity:1;transform:translateY(0);pointer-events:auto}.search-modal.closing{opacity:0;transform:translateY(10px);pointer-events:none}.search-input{width:100%;padding:8px 16px;font-size:18px}@keyframes slideIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.app{position:fixed;top:0;left:0;width:100vw;height:100vh;overflow:hidden}.elevation-4{transition:box-shadow .3s cubic-bezier(.4,0,.2,1) 0ms;border-radius:4px;box-shadow:0 2.5px 2.5px -1.5px #0000001a,0 4px 5px .5px #00000012,0 1.5px 7px 1px #0000000f}.elevation-8{transition:box-shadow .3s cubic-bezier(.4,0,.2,1) 0ms;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.editable{outline:0px solid transparent;cursor:text}.editable:empty:before{content:attr(placeholder);color:#aaa}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}
