/* Approved pixel-retro system: real bitmap elements support the few framed windows. */
:root{
  --pixel-blue:#4d6ff3;--pixel-blue-deep:#314ba8;--pixel-line:#8095dd;
  --pixel-lilac:#dfe5ff;--pixel-lilac-2:#eef1ff;--pixel-paper:#fcfbf8;
  --pixel-yellow:#ffd36b;--pixel-coral:#ff8c80;--pixel-shadow:rgba(72,86,145,.16);
}
body{background-color:#fbfaf7!important;background-image:linear-gradient(rgba(102,123,189,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(102,123,189,.05) 1px,transparent 1px)!important;background-size:32px 32px!important;color:#2d3146!important}
.top{background:rgba(255,254,251,.96)!important;border:0!important;border-bottom:1px solid #e2e5ef!important;box-shadow:none!important}
.top-in{max-width:1280px!important;border:0!important}
.brand{border:0!important;color:#2f3d83!important}.brand .mark{display:block!important;width:42px!important;height:42px!important;background:url('/static/pixel/elephant.png') center/contain no-repeat!important;font-size:0!important}.brand .mark i{display:none!important}
nav a{border:0!important;color:#38405d!important;background:transparent!important;box-shadow:none!important;gap:8px!important}
nav a:hover,nav a.on{background:transparent!important;color:#314aaf!important;box-shadow:inset 0 -4px 0 var(--pixel-blue)!important}
nav a.on:after{right:11px!important;top:12px!important;width:5px!important;height:5px!important;background:var(--pixel-blue)!important;box-shadow:8px 0 0 var(--pixel-yellow),0 8px 0 var(--pixel-coral)!important}
nav a:before{content:"";width:30px;height:30px;background-position:center;background-repeat:no-repeat;background-size:contain;image-rendering:pixelated;flex:none}
nav a:nth-child(1):before{background-image:url('/static/pixel/book.png')}nav a:nth-child(2):before{background-image:url('/static/pixel/review.png')}nav a:nth-child(3):before{background-image:url('/static/pixel/elephant.png')}nav a:nth-child(4):before{background-image:url('/static/pixel/workbench.png')}
nav .ni{display:none!important}.account{border:0!important}.account .av{border:1px solid #d5d9e8!important;border-radius:7px!important;box-shadow:none!important;background:#f0f2fa!important;overflow:hidden!important}.rc-av,.sk-av,.review-author-avatar,.comment-avatar{overflow:hidden!important;border:1px solid #d5d9e8!important}.rc-av,.sk-av{border-radius:5px!important}.review-author-avatar,.comment-avatar{border-radius:7px!important}

/* True pixel windows: only these keep framed chrome. */
.hero-main,.hero-side,.window,.work-panel{border:2px solid var(--pixel-line)!important;outline:1px solid #cbd4f8;outline-offset:3px;border-radius:0!important;box-shadow:7px 8px 0 var(--pixel-shadow)!important;background:rgba(255,255,255,.9)!important;color:#2d3146!important}
.pixel-window-head{height:50px;margin:-36px -38px 30px;padding:0 16px;display:flex;align-items:center;gap:10px;background:linear-gradient(180deg,#dce4ff,#cfd9ff);border-bottom:2px solid var(--pixel-line);font-weight:750;color:#33437e}
.pixel-window-head>img:first-child{width:31px;height:31px;object-fit:contain;image-rendering:pixelated}.pixel-window-head .controls{width:99px;height:30px;margin-left:auto;object-fit:contain;object-position:center;image-rendering:pixelated}
.hero-main{padding-top:36px!important;display:grid;grid-template-columns:180px 1fr;gap:14px 28px;align-items:center}.hero-main:after{display:none!important}.hero-main .pixel-window-head{grid-column:1/-1}.hero-art{width:180px;height:180px;object-fit:contain;image-rendering:pixelated;grid-row:2/6}.hero-copy{min-width:0}.hero-main h1{font-size:clamp(34px,4vw,56px)!important}.hero-main .cta{justify-self:start}.hero-side{padding-top:76px!important;background:rgba(244,246,255,.9)!important}.hero-side:before{content:"学习进度";position:absolute;left:0;right:0;top:0;height:50px;padding:0 16px 0 52px;display:flex;align-items:center;background:linear-gradient(180deg,#e4e9ff,#d7dfff);border-bottom:2px solid var(--pixel-line);font-weight:750;color:#34427c}.hero-side:after{left:13px!important;right:auto!important;top:8px!important;width:34px!important;height:34px!important;background:url('/static/pixel/book.png') center/contain no-repeat!important;box-shadow:none!important}.hero-side .eyebrow{display:none}.hero-side p{color:#69708c!important}.meter-track{border:1px solid #aab5df!important;background:#fff!important}.meter-fill{background:var(--pixel-blue)!important}
.cta,.sk-get,.up button,.btn.primary,.b.primary,.go{border:1px solid #2d49c3!important;border-radius:3px!important;background:linear-gradient(180deg,#5c7cff,#4265ee)!important;box-shadow:3px 4px 0 #b4bde0!important;color:white!important}

/* Ordinary information is light, flat and contemporary. */
.section{border-top:1px solid #e1e4ee!important}.section-head p{color:#70758a!important}.st{min-height:205px!important;padding:18px!important;border:1px solid #d5daed!important;border-radius:9px!important;box-shadow:0 8px 22px rgba(62,74,124,.08)!important;background:rgba(255,255,255,.78)!important;align-items:flex-start!important}.st:hover{transform:translateY(-2px)!important;box-shadow:0 12px 25px rgba(62,74,124,.13)!important}.st .n{margin-bottom:4px!important}.st-icon{width:72px;height:72px;object-fit:contain;image-rendering:pixelated;margin:2px auto 9px;align-self:center}.st .t{width:100%}.st .tag{border:0!important;padding-top:0!important}.st.done{background:#f6f7fd!important;border-left:1px solid #d5daed!important}.st.now{background:#fff!important;color:#2d3146!important;border:2px solid var(--pixel-blue)!important;box-shadow:0 9px 24px rgba(77,111,243,.16)!important}.st.now .n,.st.now .td,.st.now .tag{color:inherit!important}.st.now .tag{color:var(--pixel-blue)!important}.st.locked{background:rgba(247,247,247,.7)!important;border:1px dashed #c9cedd!important;opacity:.74}.st.talk:after{border-radius:0!important;background:var(--pixel-coral)!important;color:#fff!important}.st.done .st-icon{filter:saturate(.75)}
.review-card,.sk,.gh,.hot,.up,details.what{border:0!important;border-radius:12px!important;outline:0!important;box-shadow:0 10px 28px rgba(62,74,124,.09)!important;background:rgba(255,255,255,.84)!important}.review-card:hover,.sk:hover,.gh:hover{box-shadow:0 15px 32px rgba(62,74,124,.14)!important}.hot{box-shadow:0 10px 28px rgba(62,74,124,.09)!important}.tab{border:0!important;border-radius:7px!important;box-shadow:none!important;background:#eff1f8!important}.tab.on{background:#dfe5ff!important;box-shadow:inset 0 -3px 0 var(--pixel-blue)!important}
.panel{border:1px solid #d9dce7!important;border-radius:9px!important;box-shadow:0 12px 28px rgba(62,74,124,.09)!important}.panel-head{background:#eef0f6!important;border-bottom:1px solid #d9dce7!important}.stat{border:0!important;border-radius:8px!important;box-shadow:0 7px 20px rgba(62,74,124,.08)!important}.intro{border:1px solid #d9dce7!important;box-shadow:0 10px 28px rgba(62,74,124,.09)!important}.window-head,.work-panel-head{background:linear-gradient(180deg,#e6eaff,#dce2fa)!important;border-bottom:1px solid var(--pixel-line)!important}
.panel-ico{display:none!important}.window-head:before,.work-panel-head:before{content:"";width:27px;height:27px;background:url('/static/pixel/chat.png') center/contain no-repeat;image-rendering:pixelated}.skill-row,.feedback-row,.history-row{border-color:#dfe2ec!important}
@media(max-width:850px){nav a:before{width:25px;height:25px}.brand .mark{width:36px!important;height:36px!important}.hero-main{grid-template-columns:1fr!important}.hero-art{width:130px;height:130px;grid-row:auto;margin:auto}.pixel-window-head{margin:-28px -24px 22px}.hero-main .pixel-window-head{grid-column:1}.hero-main .cta{justify-self:stretch}.st{min-height:175px!important}}
