:root{font-family:system-ui,-apple-system,'Noto Sans JP',sans-serif;color:#253d37;background:#f8f7f1;font-size:16px}*{box-sizing:border-box}body{margin:0}main{max-width:1000px;margin:auto;padding:24px 20px 50px}header{display:flex;justify-content:space-between;gap:12px;font-size:.88rem}a{color:#275e4d}h1{font-size:clamp(1.7rem,5vw,2.5rem);margin:28px 0 12px}p{line-height:1.7}.muted,small{color:#5b6b61}.filters{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;background:white;border:1px solid #d4ddd3;border-radius:18px;padding:18px;margin:24px 0 16px}label{display:grid;gap:6px;font-size:.88rem;font-weight:650}.search{grid-column:1/-1}select,input,button{font:inherit;min-height:44px;border:1px solid #b6c9bb;border-radius:10px;padding:10px 12px;color:inherit;background:white;max-width:100%}select,input{width:100%}button{cursor:pointer;font-weight:650}button:disabled{opacity:.5;cursor:default}.primary{background:#285f4c;color:white;border-color:#285f4c}.actions{display:flex;flex-wrap:wrap;gap:10px}#cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.card{text-align:left;padding:18px;display:grid;gap:10px;border-radius:15px;min-height:140px}.card small{font-size:.8rem}.badge{font-size:.78rem;color:#42624b}.card .title{font-size:1.05rem}.card[data-state=done]{border-color:#54866a;background:#eff6ee}details{margin-top:30px;border-top:1px solid #d4ddd3;padding-top:18px}details p{font-size:.9rem}details label{display:flex;align-items:center}input[type=checkbox]{width:20px;min-height:20px}#notice{color:#75521c;min-height:1.5em}#more{margin-top:20px;width:100%}#player{position:fixed;inset:0;background:#f8f7f1;z-index:10;display:flex;flex-direction:column}#player[hidden]{display:none}#player nav{display:flex;align-items:center;gap:10px;padding:8px 12px;border-bottom:1px solid #ccd6ca}#playing-title{flex:1;font-size:.85rem;overflow-wrap:anywhere}#player-status{margin:0;padding:5px 12px;font-size:.78rem;min-height:28px}iframe{border:0;width:100%;flex:1;background:white;min-height:0}button:focus-visible,a:focus-visible{outline:3px solid #cb9b27;outline-offset:3px}@media(max-width:680px){main{padding:18px 14px}.filters{grid-template-columns:repeat(2,minmax(0,1fr));padding:12px}#cards{grid-template-columns:repeat(2,minmax(0,1fr))}.card{padding:13px}header span{display:none}.actions button:first-child{width:100%}#player nav{gap:6px;padding:6px}#player nav button{font-size:.8rem;padding:8px}.actions button{flex:1}#playing-title{font-size:.75rem}}@media(max-width:360px){#cards{grid-template-columns:1fr}}
.filter-guide{grid-column:1/-1;margin:0;color:#536452;font-size:.85rem}.choose-prompt{grid-column:1/-1;padding:28px 16px;background:white;border-radius:14px;border:1px dashed #b6c9bb}select:disabled{background:#f0f2ee;color:#69786a}body.collection-focus #player-status{display:none}body.collection-focus #player nav{padding:3px 6px}body.collection-focus #player nav button{min-height:36px;padding:5px 9px}
.last-played{font-size:.78rem;font-weight:400;line-height:1.6;color:#526958;overflow-wrap:anywhere}
.card[data-state=playing]{border-color:#819d90;background:#f4f8f1}
body.collection-compact #player-status{display:none}
body.collection-compact #player nav{padding:4px 6px;gap:6px}
body.collection-compact #player nav button{min-height:40px;padding:5px 8px;font-size:12px}