:root{--bg:#f5f7f6;--paper:#fff;--ink:#172d29;--green:#136553;--deep:#133d34;--accent:#f2a36b;--muted:#65736f;--line:#e0e8e4;--shadow:0 8px 28px #153a2d06;color-scheme:light}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:110px}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.6 'Segoe UI',Arial,sans-serif;padding-bottom:140px}button,input,textarea{font:inherit}button,a,input{touch-action:manipulation}button,a{transition:background .16s,box-shadow .16s,transform .16s}button{cursor:pointer}a{color:var(--green)}button,.button{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:44px;padding:11px 20px;border:1px solid transparent;border-radius:10px;background:var(--green);color:#fff;font-weight:600;text-decoration:none}button:hover,.button:hover{filter:brightness(.94)}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #ea935b;outline-offset:4px}[hidden]{display:none!important}h1,h2,h3,p{margin-top:0}h1,h2,h3{line-height:1.22;letter-spacing:-.025em}h1{font-size:clamp(1.8rem,3.1vw,2.7rem);font-weight:650;margin-bottom:14px}h2{font-size:1.8rem;margin-bottom:8px}h3{font-size:1.38rem;margin-bottom:8px}main,footer,.site-header{max-width:1220px;margin:auto;padding-inline:32px}.header-wrap{position:sticky;top:0;z-index:20;background:#fffffff2;border-bottom:1px solid var(--line);backdrop-filter:blur(12px)}.site-header{height:94px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;gap:12px;align-items:center;text-decoration:none;color:var(--deep);font:600 21px/1.2 Cambria,'Times New Roman',serif;white-space:nowrap}.brand-mark{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:var(--deep);color:#f5c796;font:26px Georgia;flex-shrink:0}.brand small{display:block;font:12px/1.4 'Segoe UI',Arial,sans-serif;color:var(--muted);margin-top:6px;letter-spacing:.02em}nav{display:flex;align-items:center;gap:20px}nav .nav-featured{display:flex;align-items:center;gap:10px;min-height:46px;background:var(--green);color:#fff;text-decoration:none;padding:12px 20px;border-radius:30px;font-size:15px;font-weight:650;box-shadow:0 4px 12px #13655318}nav .nav-featured span{font-size:12px}.nav-link{background:none;border:0;color:var(--muted);font-size:14px;font-weight:500;padding:8px 0;text-decoration:none;min-height:44px}.nav-link:hover{color:var(--ink)}.inline{display:inline}.intro{display:grid;grid-template-columns:1fr 235px;gap:50px;margin-top:32px;padding:32px 36px;background:var(--deep);color:#fff;border-radius:20px;overflow:hidden}.eyebrow{font-size:12px;font-weight:700;letter-spacing:.14em;color:var(--green);margin:0 0 12px}.intro .eyebrow{color:#a7d7c4}.intro-copy>p:not(.eyebrow){max-width:700px;color:#d2e3dc;font-size:15px;line-height:1.65;margin-bottom:20px}.intro-links{display:flex;align-items:center;gap:20px}.intro-cta{color:#fff;text-decoration:none;border-bottom:1px solid #ffffff80;padding-bottom:3px;font-weight:600;font-size:14px}.intro-links>span{color:#aac7b9;font-size:12px}.contest-status{align-self:center;border-left:1px solid #ffffff30;padding:10px 0 10px 30px}.contest-status span,.contest-status strong{display:block}.status-label{font-size:13px;color:#dfede5;display:flex!important;align-items:center;gap:8px;margin-bottom:20px}.status-dot{width:7px;height:7px;background:var(--accent);border-radius:50%}.deadline-label{color:#b3c9bd;font-size:12px;margin-bottom:3px}.contest-status strong{font-size:27px;letter-spacing:-.02em}.contest-status>span:last-child{font-size:13px;color:#c2d5ca;margin-top:3px}.collection-head{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:36px 0 22px;scroll-margin-top:100px}.collection-head .eyebrow{margin-bottom:8px;font-size:11px}.collection-head h2{display:flex;align-items:center;gap:12px}.count-badge{display:inline-grid;place-items:center;font:600 14px/1 'Segoe UI',Arial;width:30px;height:30px;background:#e6eee8;color:var(--green);border-radius:9px}.collection-head p:last-child{color:var(--muted);font-size:14px;margin:0}.search{display:flex;align-items:center;gap:5px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:5px;min-width:310px}.search input{border:0;background:transparent;min-width:0;margin:0;font-size:14px;width:100%;padding:8px 12px}.search button{min-height:38px;font-size:14px;padding:7px 14px}.demo-note{display:flex;justify-content:space-between;align-items:center;gap:12px;background:#edf2ef;color:var(--muted);border-radius:10px;padding:10px 16px;margin:0 0 20px;font-size:13px}.demo-note strong{color:var(--ink);font-weight:600}.demo-actions{display:flex;gap:14px}.demo-note button{padding:0;min-height:32px;background:none;color:var(--green);font-size:13px;text-decoration:underline}.auth-unavailable{color:var(--muted);font-size:14px}.song-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.song-row{position:relative;background:var(--paper);border:1px solid var(--line);border-radius:16px;padding:22px;display:grid;grid-template-columns:112px minmax(0,1fr);column-gap:22px;row-gap:18px;box-shadow:var(--shadow);transition:border-color .2s,box-shadow .2s}.song-row:hover{border-color:#b7cbc0;box-shadow:0 10px 26px #133d340a}.song-row.is-playing{border-color:var(--green);box-shadow:0 0 0 1px var(--green)}.track-cover{position:relative;min-height:120px;overflow:hidden;border-radius:10px;display:flex;flex-direction:column;justify-content:space-between;padding:12px 14px;background:linear-gradient(155deg,#315f54,#152f2a);color:#fff}.track-cover:before{content:'';position:absolute;width:170px;height:170px;border:1px solid #ffffff25;border-radius:50%;right:-90px;top:-40px;box-shadow:0 0 0 14px #ffffff08,0 0 0 30px #ffffff09,0 0 0 48px #ffffff06}.cover-1{background:linear-gradient(145deg,#9f5938,#d6a46e)}.cover-2{background:linear-gradient(145deg,#417b85,#173d53)}.cover-3{background:linear-gradient(145deg,#a29773,#51533e)}.cover-code{font-size:11px;letter-spacing:.08em;position:relative;opacity:.85}.cover-type{font-size:22px;font-weight:700;line-height:.95;letter-spacing:-.04em;position:relative}.track-meta{display:flex;justify-content:space-between;gap:10px;font-size:11px;letter-spacing:.06em;font-weight:600;color:var(--muted);margin-bottom:10px}.track-meta time{font-size:12px;letter-spacing:0;font-weight:400}.song-main{min-width:0}.song-main h3{font-size:21px;overflow-wrap:anywhere;margin:0 0 4px}.track-author{font-size:14px;color:var(--muted);margin-bottom:8px}.details,.text-button{min-height:32px;padding:0;background:none;border:0;color:var(--green);font-size:13px;font-weight:500;text-decoration:underline;text-underline-offset:4px}.song-actions{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:16px;border-top:1px solid #edf0ee}.song-actions button{flex:1;min-height:44px;font-size:14px}.play{background:#f1f5f2;color:var(--deep);border:1px solid #e4ece7}.play>span:first-child{font-size:12px}.vote{background:var(--green);color:#fff}.vote>span{font-size:21px;line-height:1}.vote.selected{background:#e6f2ec;color:var(--green);border:1px solid #8fbcaa}.vote-total{font-size:13px;font-weight:650;color:var(--green)}.result-note{display:flex;align-items:center;gap:14px;padding:22px 0;color:var(--muted);font-size:14px}.result-note>span{font-size:28px;color:#8fa99a}.result-note p{margin:0;flex:1}.result-note p span{font-size:13px}.result-note .text-button{flex-shrink:0}.notice{padding:14px 18px;border-radius:12px;background:#e8f3ed;margin:20px 0;border:1px solid #c1d8cc;font-size:15px}.notice.error{background:#fff0e8;border-color:#e9c8b8}.player{position:fixed;bottom:16px;left:50%;transform:translateX(-50%);width:calc(100% - 48px);max-width:1190px;z-index:30;display:grid;grid-template-columns:minmax(170px,1fr) auto minmax(100px,1fr) 92px auto;gap:18px;align-items:center;background:#173f35;color:#fff;padding:16px 24px;border:1px solid #ffffff20;border-radius:18px;box-shadow:0 12px 40px #112f3440}.player strong{display:block;font-size:15px}.player span{display:block;font-size:13px;color:#b9d1c4}.player small{display:block;color:#ffcfaf;font-size:12px}.player button{background:#e8b58b;color:#193d32;padding:10px 18px;border-radius:30px;font-size:14px}.player .player-vote{background:#fff;color:var(--deep)}.player input{padding:0;margin:0;accent-color:var(--accent);width:100%;border:0}.player time{font-size:12px;color:#cddfd4;white-space:nowrap}dialog{border:1px solid var(--line);border-radius:20px;padding:32px;width:calc(100% - 32px);max-width:550px;background:#fff;color:var(--ink);box-shadow:0 24px 90px #102e3a35}dialog::backdrop{background:#102c2870;backdrop-filter:blur(4px)}dialog h2{font-size:26px;margin-top:10px}dialog p{font-size:15px;color:var(--muted)}dialog form{margin-top:16px}.dialog-close{float:right;display:grid;place-items:center;border-radius:50%;width:40px;min-height:40px;padding:0;background:#f0f3f1;color:var(--ink);font-size:24px}.preline{white-space:pre-line}.auth-card,.panel{border:1px solid var(--line);border-radius:16px;background:#fff;padding:28px;box-shadow:var(--shadow)}.auth-card{max-width:460px;margin:60px auto}.auth-card form,.panel form{display:grid;gap:16px;margin-top:18px}label{display:block;font-size:14px;font-weight:600}input,textarea{display:block;width:100%;padding:11px 12px;border:1px solid #ccd9d1;border-radius:8px;background:#fff;color:var(--ink);margin-top:6px}input[type=file]{font-size:13px;max-width:100%}.check{display:flex;align-items:center;gap:10px;font-weight:400}.check input{width:17px;margin:0;accent-color:var(--green)}.secondary{background:#edf2ee;color:var(--deep);border:1px solid var(--line)}.admin-head{margin:36px 0 24px;display:flex;align-items:center;flex-wrap:wrap;gap:20px}.admin-head .eyebrow{width:100%;margin:0}.admin-head h1{flex:1;margin:0;font-size:32px}.admin-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.two-cols{display:grid;grid-template-columns:1fr 1fr;gap:14px}.song-admin{margin-top:24px}.song-admin details{padding:18px 0;border-top:1px solid var(--line)}.song-admin summary{display:flex;align-items:center;justify-content:space-between;gap:20px;cursor:pointer}.song-admin summary strong{flex-shrink:0;color:var(--green);font-size:14px}.hint{font-size:13px;color:var(--muted)}footer{display:flex;justify-content:space-between;gap:20px;margin-top:24px;padding-top:28px;padding-bottom:32px;border-top:1px solid var(--line);font-size:13px;color:var(--muted)}.footer-brand{font:600 18px Cambria,'Times New Roman',serif;color:var(--deep)}.empty-state{padding:100px 0;text-align:center}.empty-state.compact{grid-column:1/-1;padding:60px 20px;border:1px dashed var(--line);border-radius:16px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:fixed;left:12px;top:-100px;z-index:100;background:#fff;padding:12px}.skip-link:focus{top:10px}
@media(max-width:1000px){.brand{font-size:18px}nav{gap:14px}.site-header{gap:16px}.intro{gap:30px}.intro-links{flex-wrap:wrap;gap:10px}.song-row{padding:18px;grid-template-columns:90px minmax(0,1fr);gap:16px}.track-cover{min-height:112px}.song-main h3{font-size:19px}.player{gap:12px;padding:14px 18px}}
@media(max-width:760px){main,footer,.site-header{padding-inline:20px}.site-header{height:auto;min-height:118px;flex-wrap:wrap;padding-top:16px;padding-bottom:12px;gap:12px}.brand{font-size:19px}.brand-mark{width:38px;height:38px;border-radius:12px}.brand small{font-size:11px}.site-header nav{width:100%;justify-content:space-between;gap:12px}nav .nav-featured{min-height:42px;padding:10px 16px;font-size:14px}.nav-link{font-size:13px}.intro{margin-top:20px;padding:24px;grid-template-columns:1fr;gap:24px;border-radius:16px}.intro h1{font-size:28px}.intro-copy>p:not(.eyebrow){font-size:14px;margin-bottom:14px}.intro-links>span{font-size:11px}.contest-status{border-left:0;border-top:1px solid #ffffff25;padding:16px 0 0;display:grid;grid-template-columns:1fr auto;align-items:center;gap:2px 12px}.status-label{grid-column:1;grid-row:1/3;margin:0;font-size:12px}.deadline-label{display:none!important}.contest-status strong{font-size:21px}.contest-status>span:last-child{font-size:11px;grid-column:2;margin:0}.collection-head{display:block;padding:28px 0 18px}.collection-head h2{font-size:25px}.collection-head p:last-child{font-size:13px}.search{min-width:0;margin-top:20px}.demo-note{display:block;padding:12px 14px;font-size:12px}.demo-actions{margin-top:6px;gap:20px}.song-list{grid-template-columns:1fr;gap:16px}.song-row{grid-template-columns:100px minmax(0,1fr);padding:18px;gap:16px}.track-cover{min-height:116px}.song-main h3{font-size:20px}.track-author{font-size:13px}.track-meta{font-size:10px}.details{font-size:12px}.song-actions{padding-top:14px}.result-note{font-size:12px;gap:10px}.result-note p span{font-size:11px}.result-note .text-button{font-size:12px}.player{bottom:10px;width:calc(100% - 24px);padding:14px 16px;grid-template-columns:minmax(0,1fr) auto;gap:10px;border-radius:16px}.player>div{grid-column:1;grid-row:1}.player>[data-player-toggle]{grid-column:2;grid-row:1;min-height:36px}.player input{grid-row:2;grid-column:1}.player time{grid-row:2;grid-column:2;text-align:right;font-size:11px}.player .player-vote{grid-column:1/-1;grid-row:3;min-height:38px;padding:8px}.player strong{font-size:14px}.player span{font-size:12px}body{padding-bottom:190px}.admin-grid,.two-cols{grid-template-columns:1fr}.panel,.auth-card{padding:22px}.admin-head h1{font-size:28px;min-width:100%}.song-admin summary{font-size:14px;align-items:flex-start}.auth-card{margin:32px auto}.result-note>span{font-size:22px}footer{display:block;font-size:12px}.footer-brand{display:block;margin-bottom:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
.nav-google,.google-button{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:10px 18px;border:1px solid #c9d6ce;border-radius:30px;background:#fff;color:var(--ink);font-size:14px;font-weight:600;text-decoration:none;box-shadow:0 1px 3px #13655314}.nav-google:hover,.google-button:hover{background:#f6f9f7;filter:none}.g-logo{width:18px;height:18px;flex-shrink:0}.google-button.wide{display:flex;width:100%;margin-top:16px;min-height:50px;font-size:15px;border-radius:12px}.nav-user{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:600;color:var(--deep);max-width:220px;overflow:hidden;white-space:nowrap}.nav-user>span{color:var(--green);font-size:10px}.vote-banner{display:flex;align-items:center;gap:16px;margin:0 0 20px;padding:16px 20px;border:1px solid #e9c8a8;border-radius:14px;background:#fff6ee}.vote-banner.is-signed-in{border-color:#c1d8cc;background:#e8f3ed}.vote-banner-icon{display:grid;place-items:center;line-height:1;width:40px;height:40px;flex-shrink:0;border-radius:50%;background:#fff;color:var(--green);font-size:20px}.vote-banner p{flex:1;margin:0;font-size:14px;color:var(--muted)}.vote-banner strong{display:block;color:var(--ink);font-size:16px}.vote-banner p>span{display:block}
@media(max-width:760px){.site-header nav{flex-wrap:wrap;row-gap:4px}.nav-google{min-height:40px;padding:8px 12px;font-size:13px}.nav-user{font-size:13px;max-width:140px}.vote-banner{flex-wrap:wrap;padding:14px 16px;gap:12px}.vote-banner p{min-width:calc(100% - 56px)}.vote-banner .google-button{width:100%;justify-content:center}}
.vote-form{display:grid;gap:12px}.vote-form label{font-size:14px}.vote-form input,.vote-form textarea{margin-top:4px;font-weight:400}.vote-form textarea{resize:vertical;min-height:76px}.vote-form .hint{margin:0;font-size:13px}.vote-form button{margin-top:4px;min-height:48px}.req{color:#c0582b}.opt{font-weight:400;color:var(--muted);font-size:13px}dialog{max-height:calc(100dvh - 32px);overflow-y:auto}.vote-admin{margin-top:24px}.vote-admin h2{display:flex;align-items:center;gap:10px}.table-scroll{overflow-x:auto;margin-top:12px}.vote-admin table{width:100%;border-collapse:collapse;font-size:14px;min-width:720px}.vote-admin th,.vote-admin td{text-align:left;vertical-align:top;padding:10px 12px;border-bottom:1px solid var(--line)}.vote-admin th{font-size:12px;color:var(--muted);font-weight:600;white-space:nowrap}.vote-admin td:last-child,.vote-admin td:first-child{white-space:nowrap}.vote-admin td.preline{max-width:360px;overflow-wrap:anywhere}