/* @license GPL-2.0-or-later https://www.drupal.org/licensing/faq */
.build-pinyin .hanzi-line{font-family:"Noto Sans SC","PingFang SC","Microsoft YaHei",sans-serif;}.build-pinyin .bp-description-panel{background:linear-gradient(135deg,#f1f5f9 0%,#eef2ff 55%,#fff7ed 100%);border-color:rgba(100,116,139,0.45) !important;}.build-pinyin .bp-description-inner{background:rgba(255,255,255,0.65);border-radius:0.75rem;padding:0.75rem 1rem !important;}.build-pinyin .game-description-container button.collapsed .bp-description-chevron{transform:rotate(-90deg);}.build-pinyin .game-description-container .bp-description-chevron{transition:transform 0.2s ease;}.build-pinyin .game-main-section.build-pinyin__main{background:radial-gradient(1200px 420px at 15% 0%,rgba(99,102,241,0.16),transparent 55%),radial-gradient(900px 360px at 95% 10%,rgba(245,158,11,0.14),transparent 55%),linear-gradient(180deg,#f8fafc 0%,#eef2ff 45%,#f1f5f9 100%);border:1px solid rgba(99,102,241,0.22);box-shadow:inset 0 1px 0 rgba(255,255,255,0.85);}.build-pinyin .game-button.bp-game-actions{background:linear-gradient(135deg,rgba(238,242,255,0.95) 0%,rgba(248,250,252,0.9) 45%,rgba(255,247,237,0.75) 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(99,102,241,0.22);box-shadow:0 6px 18px rgba(99,102,241,0.1),inset 0 1px 0 rgba(255,255,255,0.9);}@media (min-width:768px){.build-pinyin .game-button.bp-game-actions{padding:0.65rem 0.85rem;}}.build-pinyin .game-scoreboard-like{background:rgba(255,255,255,0.75);border-radius:0.5rem;padding:0.5rem 0.75rem;}.build-pinyin .bp-stat{font-weight:500;white-space:nowrap;}.build-pinyin .bp-stat--timer{color:#4338ca;}.build-pinyin .bp-stat--score{color:#0f766e;}.build-pinyin .bp-stat--acc{color:#b45309;}.build-pinyin .bp-stat--round{color:#1f2937;font-weight:700;}.build-pinyin .bp-target{font-size:clamp(2.25rem,6vw,3.6rem);line-height:1.15;letter-spacing:0.02em;}.build-pinyin .bp-pronounce-ring{display:inline-flex;align-items:center;justify-content:center;min-width:1.7em;height:1.7em;padding:0 0.35em;border:2px solid #ef4444;border-radius:999px;color:#111827;background:rgba(255,255,255,0.78);box-shadow:0 2px 10px rgba(239,68,68,0.12);}.build-pinyin #bp-root .modal-content.text-center{border:1px solid rgba(99,102,241,0.22);border-radius:1rem;overflow:hidden;}.build-pinyin #bp-root .modal-content.text-center .modal-header{background:linear-gradient(135deg,rgba(99,102,241,0.18),rgba(245,158,11,0.12));border-bottom:1px solid rgba(99,102,241,0.14);}.build-pinyin #bp-root .modal-content.text-center .modal-title{font-weight:800;letter-spacing:0.01em;}.build-pinyin #bp-root .modal-content.text-center .modal-body{padding-top:1.1rem;padding-bottom:1.1rem;}.build-pinyin #bp-root #bp-go-score,.build-pinyin #bp-root #bp-tu-score{display:inline-block;font-size:clamp(2.1rem,6vw,2.75rem);line-height:1.05;font-weight:900;color:#0f766e;padding:0.05em 0.35em;border-radius:0.75rem;background:rgba(15,118,110,0.08);border:1px solid rgba(15,118,110,0.2);}.build-pinyin #bp-root #bp-go-message{font-size:0.95rem;color:#475569 !important;}.build-pinyin #bp-root .modal-content.text-center .modal-footer{border-top:1px solid rgba(99,102,241,0.12);padding-top:0.9rem;padding-bottom:0.9rem;gap:0.5rem;}.build-pinyin .bp-play-btn{width:2.4rem;height:2.4rem;line-height:1;display:inline-flex;align-items:center;justify-content:center;padding:0;}.build-pinyin .bp-caption.bp-feedback--neutral{color:#64748b;}.build-pinyin .bp-caption.bp-feedback--success{color:#0f766e;font-weight:700;}.build-pinyin .bp-caption.bp-feedback--error{color:#b91c1c;font-weight:700;}.build-pinyin .bp-hint{color:#475569;grid-column:1 / -1;}.build-pinyin .bp-hint.bp-hint--success{color:#0f766e;font-weight:700;}.build-pinyin .bp-hint.bp-hint--error{color:#b45309;font-weight:700;}.build-pinyin .bp-hero{position:relative;width:min(220px,65vw);height:min(180px,52vw);margin:0 auto;}.build-pinyin .bp-hero-logo{position:absolute;left:50%;top:50%;width:min(110px,32vw);height:auto;transform:translate(-50%,-50%);filter:drop-shadow(0 8px 14px rgba(15,23,42,0.12));}.build-pinyin .bp-gear{position:absolute;width:min(76px,22vw);height:min(76px,22vw);border-radius:50%;background:radial-gradient(circle at 50% 50%,rgba(255,255,255,0.7) 0 28%,transparent 29% 100%),conic-gradient(from 10deg,#94a3b8,#cbd5e1,#94a3b8);opacity:0.85;}.build-pinyin .bp-gear--a{left:5%;top:18%;animation:bp-spin 6s linear infinite;}.build-pinyin .bp-gear--b{right:2%;bottom:8%;width:min(64px,18vw);height:min(64px,18vw);animation:bp-spin 5s linear infinite reverse;}@keyframes bp-spin{to{transform:rotate(360deg);}}.build-pinyin .bp-factory-stage{width:min(220px,70vw);height:200px;position:relative;}.build-pinyin .bp-factory-window{width:160px;height:150px;margin:0 auto;border-radius:1rem;background:rgba(255,255,255,0.75);border:1px solid rgba(99,102,241,0.28);box-shadow:inset 0 1px 0 rgba(255,255,255,0.85);display:grid;place-items:center;}.build-pinyin .bp-factory-logo{width:120px;height:auto;opacity:0.98;filter:drop-shadow(0 8px 14px rgba(15,23,42,0.12));}.build-pinyin .bp-smoke{position:absolute;left:35px;top:10px;width:16px;height:16px;border-radius:50%;background:rgba(148,163,184,0.45);opacity:0;}.build-pinyin .bp-smoke--1{animation:bp-smoke 2.4s ease-out infinite;}.build-pinyin .bp-smoke--2{left:auto;right:35px;animation:bp-smoke 2.8s ease-out infinite 0.35s;}@keyframes bp-smoke{0%{opacity:0;transform:translateY(12px) scale(0.6);}20%{opacity:0.6;}70%{opacity:0.2;transform:translateY(-18px) scale(1.4);}100%{opacity:0;transform:translateY(-26px) scale(1.65);}}.build-pinyin .bp-factory-stage.bp-factory--fail{animation:bp-fail 0.35s ease;}@keyframes bp-fail{0%,100%{transform:translateX(0);}25%{transform:translateX(-6px);}50%{transform:translateX(6px);}75%{transform:translateX(-4px);}}.build-pinyin .bp-slots{display:grid;grid-template-columns:repeat(3,1fr);gap:0.6rem;align-items:end;}.build-pinyin .bp-slot-wrap{text-align:left;}.build-pinyin .bp-slot-label{font-size:0.8rem;color:#475569;margin-bottom:0.25rem;}.build-pinyin .bp-slot{min-height:52px;border-radius:0.75rem;border:2px dashed rgba(99,102,241,0.35);background:rgba(255,255,255,0.78);padding:0.35rem 0.5rem;display:grid;place-items:center;outline:none;}.build-pinyin .bp-slot:focus{border-color:rgba(99,102,241,0.7);box-shadow:0 0 0 0.2rem rgba(99,102,241,0.22);}.build-pinyin .bp-slot.bp-slot--filled{border-style:solid;border-color:rgba(15,118,110,0.45);}.build-pinyin .bp-slot.bp-slot--active{border-color:rgba(245,158,11,0.75);}.build-pinyin .bp-blocks{display:flex;flex-wrap:wrap;gap:0.5rem;}.build-pinyin .bp-block{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;border:1px solid rgba(51,65,85,0.14);background:rgba(255,255,255,0.92);padding:0.45rem 0.75rem;font-weight:700;cursor:grab;user-select:none;}.build-pinyin .bp-block:active{cursor:grabbing;}.build-pinyin .bp-block[data-type="tone"]{background:rgba(255,247,237,0.96);}.build-pinyin .bp-block[data-type="initial"]{background:rgba(238,242,255,0.96);}.build-pinyin .bp-block[data-type="final"]{background:rgba(240,253,250,0.96);}.build-pinyin .bp-block.bp-block--used{opacity:0.38;cursor:not-allowed;}@media (max-width:767.98px){.build-pinyin .bp-slots{grid-template-columns:1fr;}.build-pinyin .bp-slot{min-height:46px;}.build-pinyin .bp-factory-stage{height:160px;}}
.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;}}
