@import url("site-theme.css?v=eba6ccded968930cbdc1");
body{--scene:url("backgrounds/bg-projects-pixel-game-r3.webp?v=eba6ccded968930cbdc1")}
body[data-page=games],body[data-page=detail]{--scene:url("backgrounds/bg-games-pixel-game-r3.webp?v=eba6ccded968930cbdc1")}
body[data-page=tools],body[data-page=method]{--scene:url("backgrounds/bg-tools-pixel-game-r3.webp?v=eba6ccded968930cbdc1")}
body[data-page=notes]{--scene:url("backgrounds/bg-notes-pixel-game-r3.webp?v=eba6ccded968930cbdc1")}
body[data-page=about]{--scene:url("backgrounds/bg-about-phone-teardown-r4.webp?v=eba6ccded968930cbdc1")}
.about-contact{min-width:0}.about-contact h2{font-size:32px;line-height:1.3;margin:0 0 14px;color:var(--paper)}.about-contact p{color:var(--muted);margin:0 0 24px}.about-contact .actions{margin-top:0}
.page-head{position:relative;isolation:isolate;overflow:hidden;background:var(--accent);border-bottom:4px solid var(--paper)}
.page-head::after{content:"";position:absolute;inset:0 0 0 38%;z-index:-1;background-image:linear-gradient(90deg,rgba(17,17,22,.3),rgba(17,17,22,.1)),var(--scene);background-size:cover;background-position:center;image-rendering:pixelated;clip-path:polygon(16% 0,100% 0,100% 100%,0 100%)}
.page-head__body{padding-block:52px;min-height:272px;display:flex;align-items:flex-start;justify-content:center;flex-direction:column}.page-head .eyebrow{background:#111;padding:4px 12px;margin-bottom:16px;box-shadow:3px 3px 0 var(--paper)}.page-head h1{font-size:58px;background:var(--paper);color:#111;transform:rotate(-2deg);padding:4px 24px 12px 16px;box-shadow:7px 7px 0 #111;max-width:90%;overflow-wrap:anywhere}.page-head .lede{font-size:18px;line-height:1.6;background:#111;padding:7px 14px;margin-top:24px;max-width:640px}
.section{padding-top:48px}.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;margin-bottom:28px}.section-head .eyebrow{font-size:14px;color:#ff687b;margin-bottom:10px}.section-head>p{font-size:16px;max-width:35em;color:var(--muted)}
.filter-bar{display:flex;gap:14px;margin-bottom:16px;flex-wrap:wrap}.filter-bar button{border:1px solid #77727b;background:transparent;color:var(--paper);padding:9px 18px;font-size:16px;min-height:44px;display:flex;gap:16px}.filter-bar button[aria-pressed=true]{background:var(--paper);color:#111;border-color:var(--paper);box-shadow:4px 4px 0 var(--accent)}.filter-bar button:hover{border-color:#ed263d}.filter-count{font-size:14px;opacity:.7}.filter-summary{font-size:14px;color:var(--muted);margin:18px 0 24px}
.media-list{display:grid;gap:40px}.media-row{display:grid;grid-template-columns:46% 1fr;min-width:0;border-bottom:1px solid #615b66;padding-bottom:40px;gap:40px}.media-row__cover{min-height:230px;background-size:cover;background-position:center;border:3px solid var(--paper);box-shadow:7px 7px 0 var(--accent);align-self:start;aspect-ratio:16/9}.media-row__body{min-width:0}.media-row__kicker{display:flex;align-items:center;gap:14px;margin-bottom:18px}.game-category{font-size:14px;color:var(--muted)}.media-row h2{font-size:34px;margin-bottom:16px}.media-row__body>p{font-size:18px;color:#d2cdd4;max-width:34em;line-height:1.75}.media-row .actions{gap:12px}.media-row .button{font-size:16px;padding:9px 16px}.entry-grid{display:grid;gap:24px}.entry{padding:32px;border-left:6px solid var(--accent);background:#1c1b23}.entry>p{margin-top:14px;color:var(--muted)}.entry--empty{min-height:180px;display:flex;justify-content:center;flex-direction:column;max-width:840px}.entry__link{display:block;margin-top:20px;color:#ff687b}.entry--feature{max-width:780px}.entry--feature:hover{background:#28252e}.now-panel{border-left:6px solid var(--accent);padding:24px;background:#1c1b23}
.article{max-width:900px}.article>h2{margin-top:32px;margin-bottom:16px}.article>p{line-height:1.85;color:#ded9df}.article>img{border:3px solid var(--paper);border-radius:0!important}.about-intro{display:grid;grid-template-columns:256px 1fr;gap:48px;align-items:center}.about-avatar{width:256px;height:256px;image-rendering:pixelated;border:4px solid var(--paper);border-radius:0;box-shadow:10px 10px 0 var(--accent)}.about-intro p{font-size:21px;line-height:1.9}.evidence-list{display:grid;gap:20px}.evidence{border-left:3px solid var(--accent);padding-left:20px}
@media(max-width:900px){.media-row{grid-template-columns:42% 1fr;gap:24px}.media-row h2{font-size:29px}.media-row__cover{min-height:180px}.page-head h1{font-size:48px}.about-intro{gap:32px;grid-template-columns:220px 1fr}.about-avatar{width:220px;height:220px}}
@media(max-width:640px){.page-head__body{padding-block:36px;min-height:256px}.page-head::after{left:25%;opacity:.7}.page-head h1{font-size:40px;max-width:100%;padding:7px 14px}.page-head .lede{font-size:17px}.section{padding-top:32px}.section-head{align-items:flex-start;flex-direction:column;gap:14px}.media-row{grid-template-columns:1fr;gap:26px;padding-bottom:32px}.media-row__cover{min-height:0}.media-row h2{font-size:30px}.media-row__body>p{font-size:17px}.about-intro{grid-template-columns:1fr;gap:36px}.about-avatar{width:256px;height:256px;max-width:100%;justify-self:center}.about-intro p{font-size:19px}.entry{padding:24px}.site-footer{margin-top:40px}}
.tool-entry{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);align-items:center;gap:36px}
.tool-entry__body{min-width:0}.tool-entry__body>p:not(.entry__kind){margin-top:14px;color:var(--muted);line-height:1.8}
.tool-entry__preview{display:block;min-width:0;border:3px solid var(--paper);box-shadow:6px 6px 0 var(--accent)}
.tool-entry__preview img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:contain}
.tool-entry__preview:focus-visible{outline:3px solid var(--accent);outline-offset:6px}
@media(max-width:760px){.tool-entry{grid-template-columns:1fr;gap:24px}}
/* Q咪 card: reserve a real grid column, never overlay the project copy. */
.pet-card-heading{display:grid;grid-template-columns:minmax(0,1fr) 96px;gap:20px;align-items:center;min-width:0}
.pet-card-heading>div{min-width:0}.pet-card-heading .entry__kind{color:var(--muted);margin-bottom:8px}
.pet-card-sprite{display:block;width:96px;height:104px;background:url('../projects/q-mimi/spritesheet.webp?v=eba6ccded968930cbdc1') 0 0/768px 1144px no-repeat;animation:q-mimi-card-idle 1.56s steps(6) 2}
@keyframes q-mimi-card-idle{to{background-position:-576px 0}}
@media(max-width:480px){.pet-card-heading{grid-template-columns:minmax(0,1fr) 72px;gap:12px}.pet-card-sprite{width:72px;height:78px;background-size:576px 858px;animation-name:q-mimi-card-idle-small}}
@keyframes q-mimi-card-idle-small{to{background-position:-432px 0}}
@media(prefers-reduced-motion:reduce){.pet-card-sprite{animation:none}}