.creative-hub { padding: 76px 0; scroll-margin-top: 100px; }
.creative-tabs { display:flex; gap:8px; border-bottom:1px solid #ffffff30; padding-bottom:16px; margin-bottom:28px; }
.creative-tabs[hidden], .creative-panel[hidden] { display:none !important; }
.creative-tabs button { flex:1; max-width:220px; border:1px solid #ffffff40; border-radius:100px; padding:14px 22px; background:transparent; color:#e2e9e5; font-size:1rem; font-weight:600; font-family:inherit; cursor:pointer; transition:background .18s,color .18s; }
.creative-tabs button:hover { background:#ffffff15; }
.creative-tabs button[aria-selected="true"] { background:#e9d4ad; color:#173e36; border-color:#e9d4ad; }
.creative-hub :focus-visible { outline:3px solid #d8ba84; outline-offset:5px; }
.creative-category { font-size:.85rem; font-weight:600; letter-spacing:.08em; color:#d8ba84; margin:0 0 20px; }
.creative-games { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.creative-games .money-life-card { display:flex; flex-direction:column; padding:0; overflow:hidden; border-radius:6px; }
.creative-games .money-life-visual { min-height:220px; margin:0; border-radius:0; }
.creative-games .maze-home-card { grid-column:auto; display:flex; flex-direction:column; align-items:stretch; gap:0; padding:0; overflow:hidden; }
.creative-games .maze-home-art { border-radius:0; min-height:220px; }
.creative-games .maze-home-art img { width:140px; height:140px; }
.creative-games .money-life-copy { flex:1; padding:28px; container-type:inline-size; }
.creative-games h3 { font-size:1.8rem; }
.creative-games .money-life-actions { margin-top:22px; }
.creative-more { display:inline-flex; margin-top:24px; color:#ead4ad; font-weight:600; text-underline-offset:5px; }
#panel-music .music-card { max-width:780px; margin:0 auto; padding:32px; }
#panel-music .music-player-frame { max-width:600px; margin:22px auto; }
.creative-prints { padding:32px; color:var(--ink); background:#edf3ed; border-radius:6px; }
.creative-prints .section-kicker { color:#526f56; }
.creative-prints h2 { font-size:2.2rem; }
.creative-prints p { max-width:76ch; }
.creative-panel { scroll-margin-top:110px; }
.puzzlebox-card { display:flex; align-items:flex-start; gap:24px; padding:30px; margin-bottom:24px; border:1px solid #d8ba8455; border-radius:10px; background:#28453f; color:#fffefa; }
.puzzlebox-mark { display:grid; place-items:center; width:72px; height:72px; flex:0 0 72px; background:#e9d4ad; color:#285d50; border-radius:16px; font-size:2.5rem; }
.puzzlebox-card h3 { font:1.9rem/1.3 Georgia,serif; margin:12px 0; }
.puzzlebox-card p { max-width:75ch; color:#d2ddd5; font-size:.95rem; line-height:1.75; margin:0 0 22px; }
@media(max-width:540px) { .puzzlebox-card { flex-direction:column; padding:24px; gap:16px; } .puzzlebox-card h3 { font-size:1.6rem; } }
.creative-games .game-card-header { display:flex; align-items:center; gap:22px; min-height:172px; padding:28px; background:#e1e8d8; color:var(--ink); }
.creative-games .game-icon { width:112px; height:112px; flex:0 0 112px; display:grid; place-items:center; background:#f3f2e7; border-radius:24px; overflow:hidden; }
.creative-games .game-icon img { width:112px; height:112px; object-fit:contain; }
.creative-games .game-maker { display:block; font-size:.65rem; letter-spacing:.12em; color:#496853; font-weight:600; }
.creative-games .game-card-header h3 { font:2rem/1.1 Georgia,serif; letter-spacing:-.035em; margin:9px 0 0; }
.creative-games .money-life-copy h3 { font-size:1.55rem; }
.game-platforms { display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:12px; margin-top:auto; padding-top:16px; }
.game-platform { display:flex; align-items:center; gap:12px; padding:12px; min-width:0; border:1px solid #c7d4c9; border-radius:10px; background:#fffdf6; color:#214e42; text-decoration:none; transition:background .18s; }
.game-platform:hover { background:#e0eadb; }
.game-platform strong { display:block; font-size:.95rem; }
.game-platform small { display:block; font-size:.7rem; line-height:1.5; margin-top:4px; }
.game-platform img { width:96px; height:96px; flex:0 0 96px; image-rendering:pixelated; border-radius:3px; }
.game-web { background:#285d50; color:#fffdf6; border-color:#285d50; }
.game-web:hover { background:#1b463b; }
.platform-symbol { font-size:1.9rem; flex:0 0 32px; text-align:center; }
@container (min-width:380px) {
  .game-platforms:has(> .game-platform:nth-child(3)) { grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
  .game-platforms:has(> .game-platform:nth-child(3)) .game-platform { flex-direction:column; justify-content:flex-start; gap:10px; padding:12px 8px; text-align:center; }
  .game-platforms:has(> .game-platform:nth-child(3)) .platform-symbol { display:grid; place-items:center; width:96px; height:96px; flex:0 0 96px; }
}
@media(max-width:480px) { .creative-games .game-card-header { padding:24px; gap:18px; min-height:144px; } .creative-games .game-icon, .creative-games .game-icon img { width:88px; height:88px; } .creative-games .game-icon { flex-basis:88px; border-radius:20px; } .creative-games .game-card-header h3 { font-size:1.7rem; } .creative-games .money-life-copy { padding:24px; } .game-platforms { grid-template-columns:1fr; } }
@media(max-width:760px) { .creative-hub { padding:52px 0; } .creative-games { grid-template-columns:1fr; } .creative-tabs { gap:6px; } .creative-tabs button { padding:12px 8px; font-size:.9rem; } .creative-prints, #panel-music .music-card { padding:24px; } .creative-prints h2 { font-size:1.8rem; } }