.brand img.brand-icon { flex-shrink:0; object-fit:contain; }
.footer-brand { display:inline-flex; align-items:center; gap:8px; }
.footer-brand img { width:22px; height:22px; border-radius:6px; }
.studio-tabs { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:24px; }
.studio-tabs button { border:1px solid var(--line); border-radius:9px; padding:12px 18px; color:var(--muted); background:var(--paper); font-size:14px; }
.studio-tabs button[aria-pressed=true] { background:var(--selected); border-color:var(--green); color:var(--accent); }
.storage-summary { padding:15px 18px; margin:0 0 24px; border:1px solid var(--line); border-radius:10px; background:var(--paper); font-size:13px; }
.storage-summary>div { display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; }
.storage-summary strong { font-weight:500; }
.storage-summary span,.storage-summary small { color:var(--muted); }
.storage-summary progress { width:100%; height:8px; margin:12px 0 5px; accent-color:var(--green); }
.board-status { border:1px solid var(--line); border-radius:10px; padding:15px 18px; background:var(--panel); color:var(--accent); }
.board-status.unavailable { color:var(--muted); }
.board-toolbar { display:flex; gap:10px; flex-wrap:wrap; margin:24px 0 18px; }
.board-toolbar .search-box { flex:1; }
.board-toolbar input { width:100%; font-size:14px; }
.board-toolbar select { font-size:14px; }
.sound-filters { display:flex; align-items:end; gap:12px; flex-wrap:wrap; margin-bottom:22px; }
.sound-filters .search-box { flex:1 1 220px; min-width:180px; margin:0; height:46px; }
.sound-filters .search-box input { width:100%; min-width:0; }
.filter-control { display:flex; flex:0 1 auto; flex-direction:column; gap:7px; min-width:130px; max-width:100%; }
.filter-control>span { color:var(--muted); font-size:12px; }
.sound-filters .filter-control select { max-width:none; width:100%; min-width:0; }
.sound-filters .button { min-height:46px; }
.board-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(155px,1fr)); gap:9px; }
.board-sound { display:flex; align-items:center; gap:10px; min-width:0; height:52px; padding:9px 12px; border:1px solid var(--line); border-radius:9px; background:var(--paper); color:var(--ink); text-align:left; }
.board-sound:hover:enabled { border-color:var(--green); background:var(--selected); }
.board-sound>span:first-child { flex:0 0 24px; font-size:22px; }
.board-sound>span:last-child { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:13px; font-weight:500; }
.board-sound:disabled { cursor:default; opacity:.55; }
.board-pagination { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:24px 0; font-size:13px; color:var(--muted); }
.login-page { display:grid; place-items:center; min-height:100dvh; padding:24px; }
.login-card { margin:0; width:min(460px,100%); padding:38px; background:var(--paper); border:1px solid var(--line); border-radius:22px; box-shadow:var(--shadow); }
.login-card .brand { margin-bottom:48px; }
.login-card h1 { font-size:48px; margin:18px 0; }
.login-card p { font-size:15px; line-height:1.7; color:var(--muted); }
.login-card .discord-login { margin:18px 0 12px; width:100%; font-size:15px; padding:16px; }
.login-card .login-detail { font-size:12px; }
@media(max-width:500px) { .login-card { padding:28px; } .board-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .studio-tabs button { padding:10px 12px; font-size:13px; } }
@media(max-width:650px) { .sound-filters .filter-control { flex:1 1 calc(50% - 12px); min-width:0; } .sound-filters .search-box { flex-basis:100%; } }