/* @license GPL-2.0-or-later https://www.drupal.org/licensing/faq */
.sound-battle__main{background:radial-gradient(1200px 500px at 50% 0%,rgba(13,110,253,0.12),rgba(255,255,255,0) 60%),linear-gradient(180deg,#ffffff 0%,#f8fafc 100%);border:1px solid rgba(15,23,42,0.06);}.sound-battle .game-description-container.sb-description-panel{background:linear-gradient(125deg,rgba(229,244,255,0.98) 0%,rgba(237,231,255,0.92) 42%,rgba(255,245,230,0.95) 100%);border-color:rgba(13,110,253,0.18);box-shadow:0 8px 28px rgba(13,110,253,0.08),0 2px 8px rgba(15,23,42,0.06);}.sound-battle .game-button.sb-game-actions{background:linear-gradient(125deg,rgba(229,244,255,0.96) 0%,rgba(237,231,255,0.78) 45%,rgba(255,245,230,0.85) 100%);border-radius:clamp(0.55rem,2.2vw,0.9rem);padding:clamp(0.45rem,1.8vw,0.65rem) clamp(0.35rem,1.2vw,0.65rem);border:1px solid rgba(13,110,253,0.2);box-shadow:0 6px 20px rgba(13,110,253,0.1),inset 0 1px 0 rgba(255,255,255,0.92);}@media (min-width:768px){.sound-battle .game-button.sb-game-actions{padding:0.65rem 0.85rem;}}.sb-description-panel .sb-description-chevron{transition:transform 0.2s ease;}.sb-description-panel button.collapsed .sb-description-chevron{transform:rotate(-90deg);}.sb-hero .sb-arena{margin:0 auto;max-width:720px;border-radius:18px;padding:18px;background:linear-gradient(180deg,rgba(13,110,253,0.10),rgba(255,255,255,0.65));border:1px solid rgba(15,23,42,0.08);}.sb-arena--idle{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:120px;}.sb-fighter{flex:1 1 45%;height:92px;border-radius:16px;border:1px dashed rgba(15,23,42,0.18);background:rgba(255,255,255,0.55);}.sound-battle .sb-game-scoreboard .sb-timer-badge{color:#0369a1;font-weight:600;border:1px solid rgba(14,165,233,0.35);background:linear-gradient(135deg,rgba(224,242,254,0.95),rgba(255,255,255,0.92));border-radius:999px;padding:0.35rem 0.75rem;}.sound-battle .sb-game-scoreboard .sb-timer-badge.sb-timer--warn{color:#b91c1c;border-color:rgba(220,53,69,0.45);background:linear-gradient(135deg,rgba(254,226,226,0.95),rgba(255,255,255,0.88));}.sound-battle .sb-game-scoreboard .sb-stat--score{color:#047857;font-weight:500;}.sound-battle .sb-game-scoreboard .sb-stat--score .fw-semibold{color:#059669;}.sound-battle .sb-game-scoreboard .sb-stat--acc{color:#b45309;font-weight:500;}.sound-battle .sb-game-scoreboard .sb-stat--acc .fw-semibold{color:#d97706;}.sound-battle .sb-game-scoreboard .sb-stat--combo{color:#6d28d9;font-weight:600;}.sound-battle .sb-game-scoreboard .sb-stat--combo .fw-semibold{color:#7c3aed;}.sound-battle .sb-game-scoreboard .sb-stat--round{color:#334155;font-weight:600;background:rgba(241,245,249,0.95);border:1px solid rgba(148,163,184,0.4);border-radius:999px;padding:0.3rem 0.7rem;}.sound-battle .sb-game-scoreboard .sb-stat--round:not(:empty){display:inline-block;}.sb-play-row{row-gap:0.75rem;}.sb-play-context{max-width:min(72vw,16rem);font-size:clamp(1.35rem,3.8vw,2rem);font-weight:600;line-height:1.25;text-align:center;word-break:break-word;}.sound-battle .sb-play-context .sb-play-focus{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;min-width:1.2em;min-height:1.2em;margin:0 0.04em;padding:0.06em 0.1em;line-height:1;border:2.5px solid #dc3545;border-radius:50%;color:inherit;vertical-align:middle;box-shadow:0 0 0 1px rgba(255,255,255,0.85) inset;}@media (min-width:576px){.sb-play-context{text-align:right;max-width:min(42vw,18rem);}}.sb-play-btn{width:64px;height:64px;display:inline-flex;align-items:center;justify-content:center;}.sb-hint.sb-hint--success{color:var(--bs-success);}.sb-hint.sb-hint--error{color:var(--bs-danger);}.sb-arena--live{display:flex;align-items:stretch;justify-content:center;gap:14px;flex-wrap:wrap;padding:14px;border-radius:18px;border:1px solid rgba(15,23,42,0.10);background:linear-gradient(180deg,rgba(255,255,255,0.9),rgba(248,250,252,0.95));position:relative;overflow:hidden;}.sb-vs{align-self:center;font-weight:800;letter-spacing:0.06em;color:rgba(15,23,42,0.55);padding:6px 10px;border-radius:999px;border:1px solid rgba(15,23,42,0.10);background:rgba(255,255,255,0.75);}.sb-card{flex:1 1 300px;max-width:420px;border:0;border-radius:18px;padding:16px 14px 14px;text-align:center;background:linear-gradient(180deg,#ffffff,#f3f6ff);box-shadow:0 10px 30px rgba(15,23,42,0.10);transition:transform 0.18s ease,box-shadow 0.18s ease,filter 0.18s ease;position:relative;}.sb-card:hover{transform:translateY(-2px);box-shadow:0 14px 34px rgba(15,23,42,0.14);}.sb-card:active{transform:translateY(0px) scale(0.99);}.sb-card:focus-visible{outline:3px solid rgba(13,110,253,0.35);outline-offset:3px;}.sb-card__badge{position:absolute;top:10px;left:10px;width:34px;height:34px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;font-weight:800;color:rgba(15,23,42,0.75);border:1px solid rgba(15,23,42,0.10);background:rgba(255,255,255,0.85);}.sb-card__char{font-size:clamp(2.4rem,6vw,3.4rem);line-height:1.05;margin:10px 0 6px;}.sb-card__char--pinyin{font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif;font-weight:700;letter-spacing:0.04em;font-variant-numeric:tabular-nums;}.sb-card__py{font-size:1.05rem;letter-spacing:0.02em;color:rgba(15,23,42,0.72);}.sound-battle #sb-card-a-py,.sound-battle #sb-card-b-py{display:none;}.sb-card--a{border-top:4px solid rgba(13,110,253,0.65);}.sb-card--b{border-top:4px solid rgba(25,135,84,0.65);}.sb-card--attack{filter:saturate(1.05);box-shadow:0 16px 40px rgba(13,110,253,0.22);}.sb-card--hit{animation:sb-shake 520ms ease;filter:saturate(0.95);}.sb-card--defend{animation:sb-shield 520ms ease;}.sb-arena--attack-left::before,.sb-arena--attack-right::before{content:"";position:absolute;inset:-40% -20%;background:radial-gradient(circle at 30% 45%,rgba(13,110,253,0.22),rgba(255,255,255,0) 55%),radial-gradient(circle at 70% 45%,rgba(25,135,84,0.10),rgba(255,255,255,0) 55%);transform:translateX(var(--sb-burst-x,0));opacity:0.9;pointer-events:none;}.sb-arena--attack-left{--sb-burst-x:-6%;}.sb-arena--attack-right{--sb-burst-x:6%;}@keyframes sb-shake{0%{transform:translateX(0);}20%{transform:translateX(-6px);}40%{transform:translateX(6px);}60%{transform:translateX(-4px);}80%{transform:translateX(4px);}100%{transform:translateX(0);}}@keyframes sb-shield{0%{box-shadow:0 10px 30px rgba(15,23,42,0.10);}40%{box-shadow:0 0 0 6px rgba(13,110,253,0.12),0 10px 30px rgba(15,23,42,0.10);}100%{box-shadow:0 10px 30px rgba(15,23,42,0.10);}}@media (max-width:576px){.sb-arena--live{flex-direction:column;}.sb-vs{transform:rotate(90deg);}}
.top-search-container{position:relative;display:inline-block;width:100%;}.search-form{display:flex;justify-content:space-between;width:100%;}.input-group{display:flex;width:100%;}#top-search-bar{flex:1;padding:8px;border:1px solid #ccc;border-radius:4px;}.btn-primary{margin-left:8px;padding:8px 16px;border-radius:4px;}.search-popup{display:none;position:absolute;top:100%;left:0;width:100%;max-width:300px;background:#fff;border-radius:4px;box-shadow:0 4px 6px rgba(0,0,0,0.2);z-index:1000;}#search-results{list-style:none;margin:0;padding:0;max-height:200px;overflow-y:auto;}#search-results li{padding:10px;cursor:pointer;font-size:14px;border-bottom:1px solid #eee;}#search-results li:hover{background-color:#f7f7f7;}@media (max-width:576px){.top-search-container{width:350px;}.search-popup{max-width:350px;}}