@font-face{font-family:Manrope Variable;font-style:normal;font-display:swap;font-weight:200 800;src:url(data:font/woff2;base64,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) format("woff2-variations");unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:Manrope Variable;font-style:normal;font-display:swap;font-weight:200 800;src:url(/assets/manrope-cyrillic-wght-normal-Dvxsihut.woff2) format("woff2-variations");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:Manrope Variable;font-style:normal;font-display:swap;font-weight:200 800;src:url(/assets/manrope-greek-wght-normal-DL7QRZyv.woff2) format("woff2-variations");unicode-range:U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF}@font-face{font-family:Manrope Variable;font-style:normal;font-display:swap;font-weight:200 800;src:url(/assets/manrope-vietnamese-wght-normal-usUDDRr7.woff2) format("woff2-variations");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Manrope Variable;font-style:normal;font-display:swap;font-weight:200 800;src:url(/assets/manrope-latin-ext-wght-normal-Ch3YOpNY.woff2) format("woff2-variations");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Manrope Variable;font-style:normal;font-display:swap;font-weight:200 800;src:url(/assets/manrope-latin-wght-normal-DHIcAJRg.woff2) format("woff2-variations");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}:root{--bg: linear-gradient(160deg, #102542 0%, #0f1626 45%, #1a2f4f 100%);--panel: rgba(15, 25, 42, .55);--panel-solid: #17233a;--text: #f4f9ff;--muted: #adbcd0;--accent: #f8b400;--danger: #e35d6a;--success: #4ade80;--border: rgba(255, 255, 255, .14);--focus: #ffd766;--radius-panel: 14px;--radius-control: 10px;--radius-image: 9px;--space-1: 6px;--space-2: 10px;--space-3: 14px;--space-4: 18px;--text-xs: .72rem;--text-sm: .9rem;--text-base: .95rem;--text-lg: 1.08rem;--text-xl: 1.65rem;--text-2xl: 2rem;--bp-md: 920px;--bp-lg: 1120px;--z-card-action: 2;--z-popover: 100;--z-modal: 1001;--tr-fast: .12s;--tr-base: .15s}*{box-sizing:border-box}body{margin:0;min-height:100vh;font-family:Manrope Variable,Manrope,Avenir Next,Segoe UI,sans-serif;color:var(--text);background:url(/bg.jpg) center / cover no-repeat;background-attachment:fixed;line-height:1.35}.page{--page-padding: 18px;max-width:1200px;margin:0 auto;padding:var(--page-padding)}.pageUltrawide{max-width:none}.topbar{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);margin:calc(-1 * var(--page-padding)) calc(-1 * var(--page-padding)) var(--space-2);padding:var(--page-padding) var(--page-padding) var(--space-2);background:var(--panel);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:0 0 var(--radius-panel) var(--radius-panel)}.favoriteBtn,.previewBtn,.cardPips{min-width:26px;height:26px;border:none;border-radius:999px;display:flex;align-items:center;justify-content:center;background:#091321e6;color:#eff7ff;transition:opacity var(--tr-fast) ease,background var(--tr-fast) ease,color var(--tr-fast) ease}.pitchControl{display:flex;align-items:center;gap:8px;background:#0000000d;border:1px solid var(--border);border-radius:var(--radius-control);padding:0 var(--space-2) 0 var(--space-3);height:40px;white-space:nowrap}.pitchLabel{font-size:var(--text-xs);color:var(--muted);text-transform:uppercase;letter-spacing:.04em}.pitchSlider{--pitch-pct: 50%;-webkit-appearance:none;-moz-appearance:none;appearance:none;width:140px;height:20px;border:none;outline:none;cursor:ew-resize;padding:0;background:transparent}.pitchSlider::-webkit-slider-runnable-track{height:4px;border-radius:999px;background:linear-gradient(to right,var(--accent) 0%,var(--accent) var(--pitch-pct),rgba(255,255,255,.22) var(--pitch-pct),rgba(255,255,255,.22) 100%)}.pitchSlider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:0;height:0}.pitchSlider::-moz-range-track{height:4px;border-radius:999px;background:#ffffff38}.pitchSlider::-moz-range-progress{height:4px;border-radius:999px;background:var(--accent)}.pitchSlider::-moz-range-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:0;height:0;border:none}.pitchSlider:focus,.pitchSlider:focus-visible{outline:none;box-shadow:none}.pitchValue{font-size:var(--text-xs);font-variant-numeric:tabular-nums;color:var(--muted);min-width:40px;text-align:center;transition:color var(--tr-fast) ease,transform var(--tr-fast) ease}.pitchValueActive{color:var(--accent);font-weight:600;transform:translateY(-.5px)}.ttsBar{margin-bottom:var(--space-3);border:1px solid var(--border);border-radius:var(--radius-panel);background:var(--panel);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);padding:var(--space-3);display:flex;flex-direction:column;gap:var(--space-3)}.ttsBarLabel{font-size:var(--text-xs);font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}.ttsControls{display:flex;align-items:center;gap:var(--space-3);flex-wrap:wrap}.ttsControl{display:flex;align-items:center;gap:6px;white-space:nowrap}.ttsLabel{font-size:var(--text-xs);color:var(--muted);text-transform:uppercase;letter-spacing:.04em}.ttsSelect{font-size:var(--text-xs);background:var(--panel-solid);border:1px solid var(--border);border-radius:var(--radius-control);color:var(--text);padding:4px 8px;max-width:220px;cursor:pointer}.ttsSelectSmall{max-width:120px}.ttsModeHint{font-size:var(--text-xs);color:var(--muted);opacity:.8}.ttsSlider{--tts-pct: 50%;-webkit-appearance:none;-moz-appearance:none;appearance:none;width:110px;height:20px;outline:none;cursor:ew-resize;padding:0;background:transparent;border:none}.ttsSlider::-webkit-slider-runnable-track{height:4px;border-radius:999px;background:linear-gradient(to right,var(--accent) 0%,var(--accent) var(--tts-pct),rgba(255,255,255,.22) var(--tts-pct),rgba(255,255,255,.22) 100%)}.ttsSlider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:0;height:0}.ttsSlider::-moz-range-track{height:4px;border-radius:999px;background:#ffffff38}.ttsSlider::-moz-range-progress{height:4px;border-radius:999px;background:var(--accent)}.ttsSlider::-moz-range-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:0;height:0;border:none}.ttsSlider:focus,.ttsSlider:focus-visible{outline:none;box-shadow:none}.ttsValue{font-size:var(--text-xs);font-variant-numeric:tabular-nums;color:var(--muted);min-width:36px;text-align:center}.ttsInputRow{display:flex;align-items:center;gap:var(--space-2)}.ttsInputWrap{flex:1;position:relative}.ttsInput{width:100%;font-size:var(--text-sm);background:var(--panel-solid);border:1px solid var(--border);border-radius:var(--radius-control);color:var(--text);padding:9px 60px 9px 12px;outline:none;transition:border-color var(--tr-fast) ease}.ttsInput:focus{border-color:var(--accent)}.ttsInput::placeholder{color:var(--muted);opacity:.6}.ttsCharCount{position:absolute;right:10px;top:50%;transform:translateY(-50%);font-size:var(--text-xs);color:var(--muted);opacity:.5;pointer-events:none}.ttsCharCountWarn{color:var(--danger);opacity:1}.ttsSpeakBtn{flex-shrink:0;white-space:nowrap}.ttsSpeakBtn:disabled{opacity:.45;cursor:not-allowed}.authCard,.uploadPanel,.boardPanel,.soundCard{border:1px solid var(--border);border-radius:var(--radius-panel);background:var(--panel);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.authCard{max-width:440px;margin:96px auto;padding:32px;text-align:center}.authCard h1{font-size:var(--text-2xl);margin:0 0 var(--space-2)}.authCard p{color:var(--muted);margin:0 0 var(--space-4);font-size:var(--text-base)}.authCard .button{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:12px 24px;font-size:1rem}.buttonDiscord{background:#5865f2!important;color:#fff!important}.buttonDiscord:hover{background:#4752c4!important}.discordIcon{flex-shrink:0}.topbar{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2)}.topbarActions{display:flex;align-items:center;gap:var(--space-1)}.ribbon{display:flex;align-items:center;gap:var(--space-2);flex-wrap:wrap;margin-bottom:var(--space-2)}.topbarActions{display:flex;align-items:center;gap:var(--space-2)}.ultrawideToggle{padding:8px 10px;min-width:auto}.ribbon{display:flex;align-items:center;gap:var(--space-3);flex-wrap:wrap;margin-bottom:var(--space-3);padding:var(--space-2) var(--space-3);border:1px solid var(--border);border-radius:var(--radius-panel);background:var(--panel);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.ribbon .searchInputWrap{flex:1;min-width:180px}.ribbon .sortModeToggle{flex-shrink:0}.topbarBrand{display:flex;flex-direction:column;gap:2px}.topbarBrand h1{margin:0;font-family:Henny Penny,serif;font-size:var(--text-2xl);font-weight:600;line-height:1;color:#c9942e}.topbarBrand p{margin:0;color:var(--muted);font-size:var(--text-sm)}.devBadge{display:inline-block;margin-left:8px;padding:2px 6px;border-radius:4px;border:1px solid rgba(248,180,0,.5);background:#f8b4001f;color:#ffd978;font-size:.65rem;font-weight:600;letter-spacing:.04em;vertical-align:middle}.layout{display:grid;grid-template-columns:300px 1fr;gap:var(--space-3)}.pageUltrawide .layout{grid-template-columns:1fr}.uploadPanel,.boardPanel{padding:var(--space-3)}.uploadPanel form{display:grid;gap:var(--space-2);margin-top:var(--space-2)}.fileDropZone{position:relative;min-height:80px;border:2px dashed var(--border);border-radius:var(--radius-control);background:var(--panel-solid);display:grid;place-items:center;cursor:pointer;transition:border-color .15s ease,background .15s ease}.fileDropZone:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.fileDropZone.compact{min-height:44px}.fileDropZone:hover{border-color:#ffffff47}.fileDropZone.dragOver{border-color:var(--accent);background:#f8b40014}.fileDropZone.hasFile{border-style:solid;border-color:#fff3}.fileDropZoneInput{position:absolute;width:0;height:0;opacity:0;pointer-events:none}.fileDropZonePlaceholder,.fileDropZoneLabel{font-size:var(--text-sm);color:var(--muted);text-align:center;padding:var(--space-2)}.fileDropZone.hasFile .fileDropZoneLabel{color:var(--text);display:flex;align-items:center;gap:var(--space-1);min-width:0;overflow:hidden;max-width:100%}.fileDropZone.hasFile .fileDropZoneLabel>span:first-of-type{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.fileDropZoneMeta{flex-shrink:0}.fileDropZoneClear{border:none;background:#ffffff26;color:var(--text);width:22px;height:22px;border-radius:50%;display:grid;place-items:center;cursor:pointer;font-size:1rem;line-height:1;padding:0}.fileDropZoneClear:hover{background:var(--danger)}.optionalImageLabel span:first-child{font-size:var(--text-sm);color:var(--muted);margin-bottom:var(--space-1)}.uploadTitle{margin:var(--space-2) 0 var(--space-2);font-size:var(--text-lg);font-weight:600;line-height:1}label,.uploadField{display:grid;gap:var(--space-1);color:var(--muted);font-size:var(--text-base)}input{width:100%;border:1px solid var(--border);border-radius:var(--radius-control);background:var(--panel-solid);color:var(--text);padding:9px 10px;font:inherit}.button{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-1);border:none;border-radius:var(--radius-control);padding:8px 14px;font-family:inherit;font-weight:600;font-size:var(--text-sm);cursor:pointer;text-decoration:none;text-align:center;transition:background var(--tr-base) ease,color var(--tr-base) ease,transform var(--tr-fast) ease,box-shadow var(--tr-base) ease}.button:active{transform:scale(.98)}.button.primary,.button:not(.secondary):not(.danger):not(.ghost){background:var(--accent);color:#1c2230}.button.primary:hover,.button:not(.secondary):not(.danger):not(.ghost):hover{background:#ffc933;box-shadow:0 2px 12px #f8b40059}.button.secondary,.button.ghost{background:#ffffff0f;color:var(--text);border:1px solid rgba(255,255,255,.12)}.button.secondary:hover,.button.ghost:hover{background:#ffffff1a;border-color:#fff3}.button.danger{background:var(--danger);color:#fff}.button.danger:hover{background:#eb6d7a;box-shadow:0 2px 12px #e35d6a66}.button.btnIcon{padding:8px;min-width:36px;min-height:36px;border-radius:var(--radius-control)}.button:focus-visible,input:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.boardHeader{display:flex;align-items:end;justify-content:space-between;gap:var(--space-2);flex-wrap:wrap;margin-bottom:var(--space-2)}.boardControls{display:flex;align-items:center;gap:var(--space-2);flex:1;justify-content:flex-end;min-width:0}.searchInputWrap{position:relative;flex:1;min-width:0}.searchIcon{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--muted);pointer-events:none;display:grid;place-items:center}.searchInputWrap input{width:100%;min-height:42px;border-radius:999px;padding-inline:42px 42px;background:#081221d1;border-color:#ffffff3d}.debugTrigger{border:none;background:transparent;color:var(--muted);font-size:var(--text-xs);cursor:pointer;padding:4px 8px;border-radius:var(--radius-control);flex-shrink:0}.debugTrigger:hover{color:var(--text);background:#ffffff0f}.debugTrigger:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.sortModeToggle{display:flex;align-items:center;gap:0;border-radius:var(--radius-control);border:1px solid var(--border);overflow:hidden;flex-shrink:0;background:#0f192a59}.sortModeBtn{padding:6px 12px;font-size:var(--text-xs);color:var(--muted);background:transparent;border:none;cursor:pointer;transition:color .15s ease,background .15s ease}.sortModeBtn:hover{color:var(--text);background:#ffffff0f}.sortModeBtn.active{color:var(--text);background:#f8b4002e}.sortModeBtn:not(:last-child){border-right:1px solid var(--border)}.sortModeBtn:focus-visible{outline:2px solid var(--focus);outline-offset:-2px}.searchClear{position:absolute;top:50%;right:9px;width:24px;height:24px;border:none;border-radius:50%;display:grid;place-items:center;transform:translateY(-50%);color:#0f1f34;background:#c9d8ea;font-size:var(--text-xs);font-weight:800;cursor:pointer}.loadingState{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:200px;gap:var(--space-3)}.spinner{width:40px;height:40px;border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.loadingState p{margin:0;color:var(--muted);font-size:var(--text-base)}.emptyState{grid-column:1 / -1;text-align:center;padding:48px var(--space-4);color:var(--muted)}.emptyState p{margin:0;font-size:var(--text-lg);color:var(--text)}.emptyStateHint{margin-top:var(--space-2)!important;font-size:var(--text-base)!important;color:var(--muted)!important}.emptyState .button{margin-top:var(--space-3)}@keyframes groupEnter{0%{opacity:0}to{opacity:1}}.soundGroup{margin-top:var(--space-4);animation:groupEnter .3s ease-out}.soundGroup:first-child{margin-top:0}.soundGroupInline{display:flex;align-items:flex-start;gap:12px}.soundGroupInline .groupCards{flex:1;min-width:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(156px,1fr));gap:10px;margin-top:0}.groupBadge{flex-shrink:0;padding:4px 10px;font-size:var(--text-xs);font-weight:600;color:var(--muted);background:#ffffff14;border:1px solid var(--border);border-radius:999px;letter-spacing:.02em}.groupLabel{margin:0 0 var(--space-2);font-size:var(--text-sm);font-weight:600;color:var(--muted);letter-spacing:.02em}.grid{margin-top:var(--space-2);display:grid;grid-template-columns:repeat(auto-fill,minmax(156px,1fr));gap:10px}.soundGroup .grid{margin-top:0}@keyframes gridCardEnter{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.gridCardWrap{animation:gridCardEnter .45s ease-out forwards;opacity:0}.soundCard{padding:0;display:grid;gap:0;cursor:pointer;position:relative;overflow:hidden;aspect-ratio:1;transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease}.soundCard:hover{border-color:#f8b40073;transform:scale(1.02);box-shadow:0 4px 20px #00000040}.soundCard:active,.soundCard.active{transform:scale(.985);box-shadow:0 0 0 1px #f8b400bf,0 0 18px #f8b4004d}.soundCardPlayOverlay{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;background:#00000057;opacity:0;transition:opacity .15s ease;pointer-events:none;z-index:2}.mediaWrap img.media{display:block}.soundCard:hover .soundCardPlayOverlay,.soundCard:focus-within .soundCardPlayOverlay{opacity:1}.soundCardPlayOverlay svg{color:#fff;filter:drop-shadow(0 1px 4px rgba(0,0,0,.4))}.soundCard:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.mediaWrap{position:relative;width:100%;height:100%;overflow:hidden}.mediaWrap:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg,#070c1400 48%,#070c14b3 78%,#070c14eb);z-index:1;pointer-events:none}.media{width:100%;height:100%;object-fit:cover;background:#ffffff0f}.fallback{display:grid;place-items:center;color:#e7f0ff;font-size:2.2rem;font-weight:700;line-height:1;text-shadow:0 1px 10px rgba(0,0,0,.35)}.fallback span{line-height:1}.soundCard h3{margin:0;font-size:var(--text-base);font-weight:500;letter-spacing:.01em;line-height:1.15;text-wrap:balance}.soundCardMeta{position:absolute;left:var(--space-2);right:var(--space-2);bottom:var(--space-2);z-index:3;display:grid;gap:3px}.actions{display:flex;gap:6px}.actions .button{padding:7px 11px}.meta{margin:0;color:var(--muted);font-size:var(--text-xs);opacity:.74}.playCount{margin:0;font-size:var(--text-xs);color:#f4f9ffd6;font-weight:500}.favoriteBtn{position:absolute;top:10px;left:10px;z-index:2;min-width:26px;height:26px;padding:0;border:none;border-radius:999px;display:flex;align-items:center;justify-content:center;background:#091321e6;color:#eff7ff;cursor:pointer;transition:opacity .12s ease,background .12s ease,color .12s ease;opacity:0;pointer-events:none}.favoriteBtn.favorited{opacity:1;pointer-events:auto;color:var(--accent)}.soundCard:hover .favoriteBtn,.soundCard:focus-within .favoriteBtn{opacity:1;pointer-events:auto}.favoriteBtn:hover{background:#ffffff2e}.favoriteBtn:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.previewBtn{position:absolute;top:10px;left:42px;z-index:2;min-width:26px;height:26px;padding:0;border:none;border-radius:999px;display:flex;align-items:center;justify-content:center;background:#091321e6;color:#eff7ff;cursor:pointer;transition:opacity .12s ease,background .12s ease,color .12s ease;opacity:0;pointer-events:none}.soundCard:hover .previewBtn,.soundCard:focus-within .previewBtn,.previewBtn.previewing{opacity:1;pointer-events:auto}.previewBtn.previewing{color:var(--accent)}.previewBtn:hover{background:#ffffff2e}.previewBtn:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.cardPipsWrap{position:absolute;top:10px;right:10px;z-index:2}.cardPips{min-width:26px;height:26px;padding:0;border:none;border-radius:999px;display:flex;align-items:center;justify-content:center;background:#091321e6;color:#eff7ff;font-size:var(--text-xs);font-weight:600;opacity:0;pointer-events:none;transition:opacity .12s ease,background .12s ease;cursor:pointer}.soundCard:hover .cardPips,.soundCard:focus-within .cardPips,.cardPipsWrapOpen .cardPips{opacity:1;pointer-events:auto}.cardPips:hover{background:#ffffff2e}.cardPips:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.cardPipsIcon{font-size:1.1rem;line-height:1}.cardPipsMenu{position:absolute;top:100%;right:0;margin-top:4px;min-width:100px;padding:4px 0;border-radius:var(--radius-control);background:var(--panel-solid);border:1px solid var(--border);box-shadow:0 4px 16px #0006}.cardPipsMenuItem{display:block;width:100%;padding:8px 12px;border:none;background:transparent;color:var(--text);font-size:var(--text-sm);font-weight:500;text-align:left;cursor:pointer}.cardPipsMenuItem:hover{background:#ffffff14}.cardPipsMenuItemDanger{color:var(--danger)}.cardPipsMenuItemDanger:hover{background:#e35d6a26}.editModalBackdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;display:grid;place-items:center;z-index:1001;padding:var(--space-3)}.editModal{width:100%;max-width:360px;padding:var(--space-4);border:1px solid var(--border);border-radius:var(--radius-panel);background:var(--panel);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.uploadModal{max-width:420px}.editModal form{display:grid;gap:var(--space-2);margin-top:var(--space-2)}.editImageCleared{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2);border-radius:var(--radius-control);background:#e35d6a1f;border:1px solid rgba(227,93,106,.3);color:var(--muted);font-size:var(--text-sm)}.editRemoveImage{margin-top:var(--space-1);padding:0;border:none;background:transparent;color:var(--muted);font-size:var(--text-xs);cursor:pointer;text-decoration:underline}.editRemoveImage:hover{color:var(--danger)}.editModalActions{display:flex;gap:var(--space-2);justify-content:flex-end;margin-top:var(--space-2)}.pageWithLog{display:flex;flex-direction:column;min-height:100vh}.pageWithLog>section,.pageWithLog>.layout{flex:1}.pageWithLog>.layout{padding-bottom:var(--space-4)}.auditLog{border-top:1px solid var(--border);border-radius:var(--radius-panel) var(--radius-panel) 0 0;background:#081221e6;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);z-index:100}.auditLogHeader{display:flex;align-items:center;justify-content:space-between;width:100%;padding:var(--space-2) var(--space-4);font-size:var(--text-sm);color:var(--muted);background:transparent;border:none;border-radius:var(--radius-panel) var(--radius-panel) 0 0;cursor:pointer;font-family:inherit;text-align:left;transition:background .15s ease,color .15s ease}.auditLogHeader:hover{background:#ffffff0f;color:var(--text)}.auditLogTitle{font-weight:500}.auditLogCount{color:var(--accent);font-weight:400}.auditLogChevron{font-size:.7em;opacity:.8}.auditLogList{max-height:200px;overflow-y:auto;padding:var(--space-2) var(--space-4) var(--space-3);font-size:var(--text-xs);font-family:ui-monospace,SF Mono,Consolas,monospace}.auditLogList::-webkit-scrollbar{width:6px}.auditLogList::-webkit-scrollbar-track{background:transparent}.auditLogList::-webkit-scrollbar-thumb{background:#fff3;border-radius:3px}.auditLogEmpty{margin:0;color:var(--muted);font-style:italic}.auditLogEntry{display:flex;gap:var(--space-2);padding:var(--space-1) 0;border-bottom:1px solid rgba(255,255,255,.06);line-height:1.4}.auditLogEntry:last-child{border-bottom:none;padding-bottom:0}.auditLogTime{flex-shrink:0;color:var(--muted)}.auditLogMessage{word-break:break-word}.auditLogEntry-success .auditLogMessage{color:#86efac}.auditLogEntry-error .auditLogMessage{color:#fca5a5}.auditLogEntry-info .auditLogMessage{color:#ffe38a}.message{margin:var(--space-2) 0 0;color:#ffe38a;font-size:var(--text-base)}.debugPanel{border:1px solid var(--border);border-radius:var(--radius-panel);background:#080e1ab3;overflow:hidden}.debugPanelToggle{all:unset;display:flex;align-items:center;justify-content:space-between;width:100%;padding:var(--space-2) var(--space-3);cursor:pointer;box-sizing:border-box;transition:background var(--tr-fast)}.debugPanelToggle:hover{background:#ffffff0a}.debugPanelToggle:focus-visible{outline:2px solid var(--focus);outline-offset:-2px}.debugPanelLabel{font-size:var(--text-xs);font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}.debugPanelChevron{font-size:var(--text-xs);color:var(--muted);opacity:.6}.debugPanelBody{border-top:1px solid var(--border);padding:var(--space-3)}.debugPanelSplit{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4)}.debugPanelLog{min-width:0}.debugPanelLog .auditLog{margin-bottom:var(--space-2)}.auditLogInline{border:none!important;background:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;border-radius:0!important;z-index:auto!important}.auditLogInline .auditLogList{padding-left:0;padding-right:0;padding-top:0}.debugStats{display:flex;flex-wrap:wrap;gap:var(--space-1);margin-bottom:var(--space-2)}.debugStat{display:flex;flex-direction:column;gap:2px;padding:5px 10px;border:1px solid var(--border);border-radius:var(--radius-control);background:#ffffff08;min-width:56px}.debugStatLabel{font-size:var(--text-xs);color:var(--muted);letter-spacing:.05em;text-transform:uppercase}.debugStatVal{font-size:var(--text-sm);font-family:ui-monospace,Cascadia Code,SF Mono,monospace;color:var(--text);font-weight:500}.debugPanelDiscord{min-width:0}.debugPanelSubtitle{margin:0 0 var(--space-2);font-size:var(--text-xs);font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}.debugPanelDetails{margin:0;font-size:var(--text-sm);display:grid;grid-template-columns:auto 1fr;gap:4px var(--space-3);align-items:baseline}.debugPanelDetails dt{color:var(--muted);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.05em;white-space:nowrap;padding-top:1px}.debugPanelDetails dd{margin:0;font-family:ui-monospace,Cascadia Code,SF Mono,monospace;font-size:var(--text-sm);word-break:break-all}@media(max-width:640px){.debugPanelSplit{grid-template-columns:1fr}}.debugTableWrap{overflow-x:auto}.debugTable{width:100%;border-collapse:collapse}.debugTable th{text-align:left;padding:5px 8px;border-bottom:1px solid var(--border);white-space:nowrap;font-size:var(--text-xs);font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}.debugTable td{text-align:left;padding:5px 8px;border-bottom:1px solid rgba(255,255,255,.05);white-space:nowrap;font-size:var(--text-sm);font-family:ui-monospace,Cascadia Code,SF Mono,monospace}.debugTable tr:last-child td{border-bottom:none}.debugTableEmpty{color:var(--muted);font-family:inherit!important;font-size:var(--text-sm)!important;padding:var(--space-2) var(--space-2)!important}.hint{color:var(--muted);margin:0;font-size:var(--text-sm)}.tileName{display:block;font-size:var(--text-base);font-weight:700;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@media(max-width:1120px){.boardHeader{align-items:start;flex-direction:column}.boardControls{width:100%;justify-content:flex-start;flex-wrap:wrap}.searchInputWrap{min-width:0}}@media(max-width:920px){.page{--page-padding: 8px}.button.ultraBtn,.button.mobileHide{display:none}.ribbon{row-gap:var(--space-1);padding:var(--space-1) var(--space-2)}.ribbon .searchInputWrap{flex:1 1 100%;min-width:100%}.topbar,.ribbon{margin-bottom:4px}.topbar{align-items:start;flex-direction:column}.layout{grid-template-columns:1fr;gap:var(--space-1)}.soundGroup:first-child{margin-top:var(--space-1)}.boardPanel{background:transparent;border:none;padding:0;border-radius:0;-webkit-backdrop-filter:none;backdrop-filter:none}.uploadPanel{padding:var(--space-1)}.boardHeader{align-items:stretch;flex-direction:column;gap:var(--space-1)}.boardControls{flex-direction:column;align-items:stretch;width:100%}.boardControls .searchInputWrap{width:100%;flex:none}.boardControls .sortModeToggle{align-self:flex-start}.boardControls input{max-width:none}.grid{grid-template-columns:repeat(2,1fr);gap:6px}.soundGroupInline .groupCards{gap:var(--space-2)}.emptyState{padding:var(--space-2) var(--space-1)}.soundCard{min-height:160px}}
