/* 七星练习场 · 共用样式（纯本地，无外链字体） */
:root{
  --bg:#F6EBD9;--paper:#FFFBF3;--ink:#3A2E28;--muted:#7C6B5D;--line:#EAD9C0;
  --yw:#E2553B;--sx:#139688;--yy:#6E52C8;--star:#FFB400;
  --ok:#1F9D55;--okbg:#E2F6E9;--no:#E8862A;--nobg:#FFF0DD;
  --c:#E2553B;--r:22px;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{font-size:17px;scroll-behavior:smooth}
body{margin:0;background:var(--bg);
  background-image:radial-gradient(#E9D5B6 1.3px,transparent 1.4px);background-size:22px 22px;
  color:var(--ink);line-height:1.75;
  font-family:"PingFang SC","Hiragino Sans GB","Noto Sans CJK SC","Source Han Sans SC","Microsoft YaHei",system-ui,sans-serif}
body.yw{--c:var(--yw)} body.sx{--c:var(--sx)} body.yy{--c:var(--yy)}
button{font-family:inherit;color:inherit}
.wrap{max-width:760px;margin:0 auto;padding:0 14px 30px}

/* 顶栏 */
.topbar{position:sticky;top:0;z-index:40;background:rgba(246,235,217,.94);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border-bottom:2px solid var(--line)}
.topbar .in{max-width:760px;margin:0 auto;display:flex;align-items:center;gap:6px;padding:8px 12px;flex-wrap:wrap}
.topbar a,.topbar .tb{display:inline-flex;align-items:center;gap:4px;min-height:44px;padding:4px 13px;border-radius:999px;background:#fff;color:var(--ink);text-decoration:none;font-weight:800;font-size:.95rem;border:2px solid var(--line);box-shadow:0 3px 0 var(--line);cursor:pointer}
.topbar a.cur{background:var(--c);color:#fff;border-color:transparent;box-shadow:0 3px 0 rgba(0,0,0,.18)}
.topbar .starpill{margin-left:auto;display:inline-flex;align-items:center;gap:4px;font-weight:900;background:#FFF6D6;border:2px solid #F3D27A;border-radius:999px;padding:4px 12px;min-height:44px}
.topbar .starpill b{color:#C98500}

/* 原创标识 */
.notice{background:#FFF4C9;border:2.5px dashed #E1AE12;border-radius:18px;padding:10px 14px;font-weight:800;margin:14px 0;color:#6b4e00;display:flex;gap:8px;align-items:flex-start}
.notice .tag{flex:none;background:#E1AE12;color:#fff;border-radius:10px;padding:0 8px;font-size:.85rem;line-height:1.9}

.hero{background:var(--c);color:#fff;border-radius:28px;padding:20px 20px 18px;margin-top:14px;position:relative;overflow:hidden;box-shadow:0 6px 0 rgba(0,0,0,.14)}
.hero h1{margin:0;font-size:1.55rem;line-height:1.35}
.hero p{margin:6px 0 0;opacity:.95}
.hero:after{content:"★";position:absolute;right:-6px;top:-22px;font-size:120px;opacity:.16;transform:rotate(14deg)}
.hero .tools{margin-top:12px;display:flex;gap:8px;flex-wrap:wrap}
.hero .tools button{background:rgba(255,255,255,.22);color:#fff;border:2px solid rgba(255,255,255,.55);border-radius:999px;min-height:44px;padding:4px 14px;font-weight:800;font-size:.95rem;cursor:pointer}

.secnav{display:flex;gap:8px;overflow-x:auto;padding:12px 2px 6px;scrollbar-width:none}
.secnav::-webkit-scrollbar{display:none}
.secnav a{flex:none;min-height:44px;display:inline-flex;align-items:center;padding:4px 14px;border-radius:999px;background:#fff;border:2px solid var(--line);color:var(--ink);text-decoration:none;font-weight:700;font-size:.95rem;box-shadow:0 3px 0 var(--line)}

/* 板块 */
.sec{margin:28px 0;scroll-margin-top:70px}
.sec-head{display:flex;align-items:center;gap:10px;background:var(--c);color:#fff;border-radius:var(--r);padding:12px 16px;box-shadow:0 5px 0 rgba(0,0,0,.15)}
.sec-head h2{font-size:1.18rem;margin:0;flex:1;line-height:1.4}
.sec-ico{font-size:1.5rem}
.sec-prog{background:rgba(255,255,255,.25);border-radius:999px;padding:2px 12px;font-weight:900;white-space:nowrap}
.sec-prog:before{content:"★ "}
.sec-intro{margin:10px 4px;color:var(--muted);font-weight:600}

/* 题卡 */
.q{background:var(--paper);border-radius:var(--r);padding:14px 16px 16px;margin:14px 0;box-shadow:0 4px 0 var(--line);border:2.5px solid transparent;transition:border-color .3s;scroll-margin-top:70px}
.q.solved{border-color:#9EDDB6}
.q-top{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.q-no{background:var(--c);color:#fff;border-radius:12px;min-width:34px;height:34px;display:grid;place-items:center;font-weight:900}
.q-tag{font-size:.82rem;font-weight:800;color:var(--c);background:#fff;border:2px solid var(--line);border-radius:999px;padding:0 10px}
.redo{margin-left:auto;background:none;border:2px solid var(--line);border-radius:999px;min-height:38px;padding:0 12px;font-weight:700;font-size:.85rem;color:var(--muted);cursor:pointer}
.q-star{font-size:1.75rem;color:#D8C7AD;line-height:1;display:inline-block}
.q.earned .q-star,.q.solved .q-star{color:var(--star)}
.q-star.pop{animation:pop .7s cubic-bezier(.3,1.6,.5,1)}
.q-text{font-size:1.08rem;font-weight:700}
.q-text .spk{margin-left:8px;vertical-align:middle}
.q-media{margin:10px 0;text-align:center}
.q-media svg{max-width:100%;height:auto}
.big-word{font-size:2rem;font-weight:900;letter-spacing:.12em;text-align:center;margin:6px 0;font-family:"Comic Sans MS","Chalkboard SE","Segoe Print",system-ui,sans-serif}

.opts{display:grid;gap:10px;margin-top:12px}
.opts.cols2{grid-template-columns:1fr 1fr}
.opts.cols3{grid-template-columns:1fr 1fr 1fr}
.opt-row{display:flex;gap:8px;min-width:0}
.opt{flex:1;min-width:0;min-height:56px;font-size:1.05rem;background:#fff;border:2.5px solid var(--line);border-radius:16px;padding:10px 14px;text-align:left;box-shadow:0 4px 0 var(--line);cursor:pointer;line-height:1.6;transition:transform .08s}
.opts.center .opt{text-align:center;display:flex;align-items:center;justify-content:center}
.opt:active{transform:translateY(3px);box-shadow:0 1px 0 var(--line)}
.opt.right{background:var(--okbg);border-color:var(--ok);box-shadow:0 4px 0 #9AD9B0;animation:bounce .5s}
.opt.wrong{background:var(--nobg);border-color:var(--no);opacity:.7;animation:shake .4s}
.opt svg{display:block;margin:auto;max-width:100%}
.emoji-opt{font-size:2.3rem;text-align:center}
.spk{flex:none;width:54px;min-height:54px;border-radius:16px;border:2.5px solid #D9CDF5;background:#F1ECFF;font-size:1.35rem;box-shadow:0 4px 0 #D9CDF5;cursor:pointer;line-height:1}
.spk.talk{animation:pulse .6s}
.spk.xl{width:76px;min-height:64px;font-size:1.9rem}

.act{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px;align-items:center}
.btn{font-weight:900;font-size:1.05rem;border:none;border-radius:16px;padding:10px 22px;min-height:52px;background:var(--c);color:#fff;box-shadow:0 5px 0 rgba(0,0,0,.2);cursor:pointer}
.btn:active{transform:translateY(3px);box-shadow:0 2px 0 rgba(0,0,0,.2)}
.btn.ghost{background:#fff;color:var(--ink);box-shadow:0 4px 0 var(--line);border:2px solid var(--line)}
.btn.sm{min-height:44px;padding:6px 14px;font-size:.95rem;margin:6px 6px 0 0}

.fb{margin-top:10px;font-weight:800}
.fb:empty{display:none}
.fb .ok{color:var(--ok)}
.fb .no{color:#B65A0B}
.fb small{color:var(--muted);font-weight:600}
.exp{background:#F4EEE2;border-radius:14px;padding:10px 12px;margin-top:8px;font-weight:600;color:#4b3c32}
.tip{color:var(--muted);font-size:.92rem;font-weight:600;margin:6px 0}

.fill-line{font-size:1.12rem;line-height:2.6;font-weight:600}
input.blank,input.wide{font:inherit;font-size:1.15rem;width:6.2em;min-height:48px;border:2.5px solid var(--line);border-radius:12px;padding:2px 8px;text-align:center;background:#fff;margin:2px 4px;vertical-align:middle;color:var(--ink)}
input.wide{width:100%;text-align:left;margin:4px 0}
input.blank:focus,input.wide:focus,textarea.ta:focus{outline:3px solid #FFD66B;border-color:#E1AE12}
input.blank.bad{border-color:var(--no);background:var(--nobg)}
input.blank.good{border-color:var(--ok);background:var(--okbg)}

/* 标点 */
.pslot{display:inline-grid;place-items:center;min-width:46px;height:46px;border:2.5px dashed var(--c);border-radius:12px;margin:0 3px;vertical-align:middle;font-size:1.35rem;font-weight:900;background:#fff;cursor:pointer;padding:0}
.pslot.on{background:#FFF4C9;border-style:solid;box-shadow:0 0 0 3px #FFE38A}
.pslot.bad{border-color:var(--no);background:var(--nobg)}
.pslot.good{border-color:var(--ok);background:var(--okbg);border-style:solid}
.pal{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px}
.pbtn{width:58px;height:58px;font-size:1.7rem;font-weight:900;background:#fff;border:2.5px solid var(--line);border-radius:16px;box-shadow:0 4px 0 var(--line);cursor:pointer}
.pbtn:active{transform:translateY(3px)}

/* 排序 */
.order-ans{min-height:64px;border:2.5px dashed var(--line);border-radius:16px;padding:8px;display:flex;flex-direction:column;gap:8px;background:#fff9ee}
.order-pool{display:flex;flex-direction:column;gap:8px;margin-top:10px}
.chip{min-height:52px;text-align:left;font-size:1rem;background:#fff;border:2.5px solid var(--line);border-radius:14px;padding:8px 12px;box-shadow:0 3px 0 var(--line);cursor:pointer;line-height:1.6;font-weight:600}
.chip.on{background:#FFF4C9;border-color:#F0C94D}
.chip b{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--c);color:#fff;margin-right:6px}
.ph{color:var(--muted);font-weight:700;padding:10px}

/* 点句子 */
.pick-para{background:#fff;border-radius:16px;padding:10px 12px;border:2px solid var(--line);margin-top:10px}
.sent{display:inline;font-size:1.08rem;background:none;border:none;padding:6px 2px;line-height:2.2;text-align:left;cursor:pointer;border-bottom:2.5px dashed #D9C2A0;font-weight:600}
.sent.right{background:var(--okbg);border-bottom-color:var(--ok)}
.sent.wrong{background:var(--nobg);border-bottom-color:var(--no)}

/* 开放题 */
.tipsbox{background:#EEF7FF;border:2px solid #BFDDF7;border-radius:16px;padding:10px 14px;margin-top:10px}
.tipsbox ol,.tipsbox ul{margin:6px 0 0;padding-left:1.4em}
.example{background:#FFF7E8;border-left:6px solid var(--c);border-radius:10px;padding:8px 12px;margin:10px 0;font-weight:600}
textarea.ta{width:100%;font:inherit;font-size:1.08rem;border:2.5px solid var(--line);border-radius:14px;padding:10px 12px;margin-top:10px;background:#fff;resize:vertical;color:var(--ink)}
.rubric{background:#FFF8DC;border:2px solid #F3D27A;border-radius:16px;padding:10px 12px;margin-top:10px;font-weight:600;color:var(--ink)}
.rubric ul{margin:6px 0 0;padding-left:1.3em}
.rub{display:block;width:100%;text-align:left;min-height:48px;background:#fff;border:2px solid var(--line);border-radius:12px;margin-top:8px;padding:8px 12px;font-size:1rem;cursor:pointer;font-weight:600}
.rub.on{border-color:var(--star);background:#FFF3C4}

/* 阅读短文 */
.passage{background:#fff;border-radius:var(--r);padding:16px 18px;margin-top:12px;border:2.5px solid var(--line);box-shadow:0 4px 0 var(--line)}
.passage h3{text-align:center;margin:0 0 6px;font-size:1.25rem}
.passage .by{text-align:center;color:var(--muted);font-size:.85rem;margin-bottom:6px}
.passage p{text-indent:2em;margin:6px 0;font-size:1.08rem}
.writing-card{background:#fff;border-radius:var(--r);padding:12px 16px;border:2.5px solid var(--line)}

ruby rt{font-size:.6em;color:#B0532E;font-weight:600;letter-spacing:0}
.hide-py rt{display:none}

.tool{background:#fff;border-radius:var(--r);padding:14px 16px;margin-top:12px;border:2.5px solid var(--line);box-shadow:0 4px 0 var(--line)}
.tool h3{margin:0 0 6px;font-size:1.08rem}

footer.foot{text-align:center;color:var(--muted);padding:24px 10px 50px;font-size:.92rem;font-weight:700}

.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:#3A2E28;color:#fff;border-radius:999px;padding:10px 18px;font-weight:700;z-index:100;max-width:90vw;text-align:center;animation:fadeup .25s}
.burst{position:fixed;pointer-events:none;z-index:99;font-size:24px;margin:-12px 0 0 -12px;color:var(--star);text-shadow:0 1px 0 #c98500;animation:fly .9s ease-out forwards}

@keyframes shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}
@keyframes bounce{0%{transform:scale(1)}40%{transform:scale(1.05)}100%{transform:scale(1)}}
@keyframes pop{0%{transform:scale(.3)}60%{transform:scale(1.6) rotate(18deg)}100%{transform:scale(1)}}
@keyframes pulse{50%{transform:scale(1.15)}}
@keyframes fly{to{transform:translate(var(--dx),var(--dy)) scale(.4) rotate(200deg);opacity:0}}
@keyframes fadeup{from{opacity:0;transform:translate(-50%,10px)}}
@media (max-width:420px){html{font-size:16px}.opts.cols3{grid-template-columns:1fr 1fr}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
