/* 记录 · 奖牌墙（10·22）：按画布 Main 搭。纸 #f1ede2，格子近白 #fbf9f3，今天亮黄 #ece35f；
   颜色只长在骨头上——四个领域的刻度、成品金点、通宵不锈钢、一卦黑方块。 */
#xu-wall{min-height:100%;background:#f1ede2;color:#191918;font-family:"Geist","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;-webkit-font-smoothing:antialiased}
#xu-wall *{box-sizing:border-box}
#xu-wall .mono{font-family:"Geist Mono",ui-monospace,Menlo,monospace;font-size:10px;letter-spacing:.06em;text-transform:uppercase;font-variant-numeric:tabular-nums}
:where(#xu-wall) button{font:inherit;color:inherit;border:0;background:none;padding:0;cursor:pointer;-webkit-tap-highlight-color:transparent}
:where(#xu-wall) button:focus-visible{outline:2px solid #191918;outline-offset:2px}
.xw-page{max-width:430px;margin:0 auto;padding:18px 16px 40px;display:flex;flex-direction:column;gap:18px}
.xw-top{display:flex;justify-content:space-between;align-items:center;min-height:32px;color:#4a4842}
.xw-nav{display:flex;align-items:center;gap:6px;color:#191918}
.xw-nav button{min-width:36px;min-height:36px;font-size:16px;display:grid;place-items:center}
.xw-nav button:disabled{opacity:.25;cursor:default}
.xw-stripbox{display:flex;flex-direction:column;gap:4px}
.xw-strip{width:100%;height:34px;display:block}
.xw-sl{display:flex;justify-content:space-between;color:#5b584f}
.xw-keys{display:flex;gap:10px}
.xw-keys span{display:flex;align-items:center;gap:4px;color:#191918}
.xw-keys i{width:10px;height:4px;display:block}
.xw-head{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 14px;align-items:end}
.xw-big{font-size:84px;line-height:.82;font-weight:800;letter-spacing:-.05em;font-variant-numeric:tabular-nums;background:#e3c48f;padding:12px 10px 8px;border-radius:2px;min-width:76px;text-align:center}
.xw-head>div:last-child{display:flex;flex-direction:column;gap:4px;padding-bottom:4px}
.xw-head b{font-size:15px}
.xw-head span{font-size:12px;line-height:1.5;color:#4a4842}
.xw-counts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.xw-counts>div{border-radius:2px;padding:10px 8px;display:flex;flex-direction:column;gap:10px;min-width:0}
.xw-counts>div.dark{background:#191918;color:#f1ede2}
.xw-counts .mono{display:flex;align-items:center;gap:6px;white-space:nowrap}
.xw-counts b{font-size:30px;line-height:.9;letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.xw-mini{display:flex;gap:2px;align-items:flex-start;border-top:1px solid #191918;height:11px}
.xw-mini i{width:3px;display:block}
.xw-cal{display:flex;flex-direction:column;gap:6px}
.xw-wk{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;background:#191918;border-radius:2px;padding:6px 0}
.xw-wk span{text-align:center;color:#f1ede2}
.xw-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}
.xw-cell{height:66px;border-radius:4px;padding:5px 4px 5px 5px;display:flex;flex-direction:column;justify-content:space-between;background:#fbf9f3;min-width:0;box-shadow:inset 0 0 0 1px rgba(25,25,24,.08);text-align:left}
.xw-cell.blank{background:transparent;box-shadow:none}
.xw-cell.future{background:transparent;box-shadow:inset 0 0 0 1px rgba(25,25,24,.18);cursor:default}
.xw-cell.today{background:#ece35f}
.xw-cell.sel{box-shadow:inset 0 0 0 2px #191918}
.xw-dn{font-family:"Geist Mono",ui-monospace,monospace;font-size:10px;line-height:14px;color:#191918}
.xw-bot{display:flex;flex-direction:column;gap:3px}
.xw-ms{display:flex;flex-wrap:wrap;gap:2px;align-content:flex-end}
.xw-tk{display:flex;align-items:flex-start;gap:2px;height:14px;border-top:1px solid rgba(25,25,24,.55)}
.xw-tk i{width:3px;display:block;transform-origin:top}
.xw-p{width:9px;height:9px;border-radius:50%;box-shadow:inset 0 0 0 1.2px #191918;display:inline-block;flex:none}
.xw-steel{width:11px;height:11px;border-radius:50%;background:radial-gradient(circle at 30% 30%,#f4f4f1 0 18%,#b9bab6 45%,#7f817d 100%);box-shadow:inset 0 0 0 1px #4d4f4b;display:inline-block;flex:none}
.xw-gua{width:9px;height:9px;background:#191918;border-radius:1.5px;position:relative;display:inline-block;flex:none}
.xw-gua::before,.xw-gua::after{content:"";position:absolute;left:2px;right:2px;height:1px;background:#eeeadd}
.xw-gua::before{top:3px}.xw-gua::after{top:5px}
.xw-zt{width:4px;height:12px;display:inline-block;flex:none}
/* 唯一的动效：进页面时顶上刻度长出来；日历滑进眼前时，奖牌一天一天从上面落进格子、底下刻度往下长 */
.xw-page.anim .xw-strip line.t{transform-box:fill-box;transform-origin:top;animation:xw-grow .5s cubic-bezier(.2,1.2,.4,1) both}
.xw-page.anim .xw-ms i{animation:xw-drop .62s cubic-bezier(.25,1.6,.45,1) both;animation-play-state:paused}
.xw-page.anim .xw-tk i{animation:xw-grow .5s cubic-bezier(.2,1.2,.4,1) both;animation-play-state:paused}
.xw-page.anim .xw-grid.go .xw-ms i,.xw-page.anim .xw-grid.go .xw-tk i{animation-play-state:running}
@keyframes xw-drop{0%{transform:translateY(-34px) scale(.3);opacity:0}55%{opacity:1}100%{transform:none;opacity:1}}
@keyframes xw-grow{from{transform:scaleY(0)}to{transform:none}}
@media (prefers-reduced-motion:reduce){.xw-page.anim .xw-ms i,.xw-page.anim .xw-tk i,.xw-page.anim .xw-strip line.t{animation:none}}
.xw-legend{display:flex;flex-wrap:wrap;gap:8px 14px;color:#4a4842}
.xw-legend>span{display:flex;align-items:center;gap:6px}
.xw-panel{background:#fbf9f3;border-radius:2px;border-top:8px solid #c3bee1;padding:12px 14px 14px;display:flex;flex-direction:column;gap:12px;box-shadow:inset 0 0 0 1px rgba(25,25,24,.08)}
.xw-ph{display:flex;justify-content:space-between;align-items:baseline}
.xw-ph b{font-size:20px;letter-spacing:-.02em}
.xw-ph .mono{color:#4a4842}
.xw-grp{display:flex;flex-direction:column;gap:5px}
.xw-gh{margin:0;display:flex;align-items:center;gap:7px;font-size:12px;font-weight:700;color:#191918}
.xw-li{margin:0;padding-left:16px;font-size:13.5px;line-height:1.6;color:#2c2b27}
.xw-li small{color:#7b766c;font-size:12px}
.xw-li em{font-style:normal;color:#7b766c}
.xw-stamp{display:inline-block;margin-left:6px;padding:0 4px;font-size:10px;font-weight:700;color:#e0301c;border:1.3px solid #e0301c;border-radius:3px;transform:rotate(-4deg)}
.xw-empty{margin:0;font-size:13.5px;color:#7b766c}
.xw-open{display:flex;align-items:center;justify-content:space-between;min-height:48px;border-radius:24px;background:#191918!important;color:#eeeadd!important;padding:0 6px 0 18px!important;font-size:14px;font-weight:600;margin-top:2px}
.xw-open span{width:36px;height:36px;border-radius:50%;background:#ece35f;color:#191918;display:grid;place-items:center;font-size:16px}