.pe-pixel{max-width:1180px;margin:auto;padding:28px 20px 50px;color:#17384b;font:16px/1.6 Nunito,Arial,sans-serif}.pe-pixel *{box-sizing:border-box}.pe-pixel [hidden]{display:none!important}.pe-pixel h1{font-size:clamp(2rem,4vw,3rem);line-height:1.12;font-weight:900;color:#123d56;margin:15px 0}.pe-pixel h2{font-size:1.55rem;font-weight:900;margin:26px 0 14px;line-height:1.25}.pe-pixel h3{font-size:1.12rem;font-weight:800;line-height:1.3;margin:0 0 12px}.pe-pixel p{margin:12px 0}.pe-pixel a{color:#075c80;text-decoration:underline;text-underline-offset:3px}.pe-pixel button,.pe-pixel input,.pe-pixel select{font:inherit;color:inherit}.pe-pixel button,.pe-pixel .btn,.pe-pixel .studio-file-button{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;padding:9px 13px;background:white;border:1px solid #9cb7c5;border-radius:10px;cursor:pointer;text-decoration:none;font-weight:800;line-height:1.3}.pe-pixel button:hover,.pe-pixel .btn:hover{background:#e9f6f0;border-color:#13754f}.pe-pixel button:disabled{opacity:.45;cursor:default}.pe-pixel button[aria-pressed=true]{outline:2px solid #136a49;outline-offset:1px;background:#e2f5eb}.pe-pixel :focus-visible{outline:3px solid #c65b19;outline-offset:3px}.pe-pixel input:not([type=checkbox]):not([type=color]),.pe-pixel select{display:block;width:100%;min-width:0;min-height:44px;border:1px solid #9cb7c5;padding:8px 10px;border-radius:8px;background:#fff}.pe-pixel input[type=file]{font-size:13px;padding:5px!important}.pe-pixel input[type=checkbox]{appearance:auto;width:19px;height:19px;vertical-align:middle;accent-color:#16784f}.pe-pixel input[type=color]{appearance:auto;width:54px;height:42px;cursor:pointer;vertical-align:middle;border:1px solid #abc}.pe-pixel label{font-size:14px;font-weight:800;display:block;min-width:0}.pe-pixel fieldset{border:0;padding:0;min-width:0;margin:0}.pe-pixel legend{font-weight:800;margin:0 0 8px;padding:0}.pe-pixel summary{font-weight:800;cursor:pointer;min-height:44px;padding:10px 0}.pe-pixel details{border-top:1px solid #cbdae3}.pe-pixel ul,.pe-pixel ol{list-style:revert;padding-left:24px;margin:12px 0}.pe-pixel li{margin:6px 0}.pe-pixel .pe-intro{padding:24px;background:#edf8f2;border-radius:20px;margin:20px 0}.pe-pixel .pe-kicker{font-weight:900;text-transform:uppercase;letter-spacing:.08em;font-size:12px;color:#126342}.pe-pixel .pe-nav,.pe-pixel .studio-actions,.pe-pixel .studio-history,.pe-pixel .studio-tools{display:flex;flex-wrap:wrap;gap:9px}.pe-pixel .pe-nav{margin:18px 0}.pe-pixel .pe-nav a{padding:8px 13px;border-radius:20px;background:#eff5f8;font-weight:800}.pe-pixel .pe-crumbs{display:flex;flex-wrap:wrap;gap:8px;font-size:13px}.pe-pixel .pixel-studio{border:1px solid #b8d0db;background:#f6fafc;border-radius:18px;padding:22px;margin:24px 0}.pe-pixel .studio-toolbar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-bottom:20px}.pe-pixel .studio-workspace{display:grid;grid-template-columns:minmax(0,1fr) minmax(250px,320px);gap:24px;align-items:start}.pe-pixel .studio-canvas-wrap{min-width:0}.pe-pixel canvas[data-pixel-canvas]{border:1px solid #859dab;border-radius:6px;background:white}.pe-pixel .studio-sidebar{display:grid;gap:18px;min-width:0}.pe-pixel .studio-palette{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:5px}.pe-pixel .studio-swatch{padding:0;min-width:0;min-height:34px;height:34px;border:1px solid #6c7e88;border-radius:5px;font-size:18px}.pe-pixel .studio-hint{font-size:13px;color:#4b6371}.pe-pixel .studio-status{min-height:50px;font-size:14px;font-weight:800;padding:10px 12px;background:#e6f2ec;border-radius:8px}.pe-pixel .studio-actions{margin-top:20px}.pe-pixel .studio-actions .btn-primary,.pe-pixel button.pe-primary{background:#13784f;color:white;border-color:#13784f}.pe-pixel .studio-file-button{flex-wrap:wrap;justify-content:start;max-width:100%}.pe-pixel .studio-file-button input{max-width:230px}.pe-pixel .pe-teacher{border-top:2px solid #c2d7df;padding-top:14px;margin-top:22px;scroll-margin-top:30px}.pe-pixel .pe-teacher-controls{display:flex;flex-wrap:wrap;align-items:end;gap:12px}.pe-pixel .pe-teacher-controls label{flex:1 1 250px}.pe-pixel .pe-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}.pe-pixel .model-filter-bar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:20px;border-radius:16px;background:#eff6f9}.pe-pixel .model-result{font-weight:800;min-height:28px}.pe-pixel .model-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.pe-pixel .model-card{min-width:0;padding:16px;border:1px solid #c3d7e0;border-radius:14px;background:white;display:flex;flex-direction:column}.pe-pixel .model-card-preview{display:block;background:#f4f8fa;border-radius:8px}.pe-pixel .model-preview{display:block;width:100%;height:auto;aspect-ratio:1;image-rendering:pixelated}.pe-pixel .model-badge{display:inline-block;font-size:12px;font-weight:800;margin-top:12px}.pe-pixel .model-card-content p{font-size:13px;margin:6px 0 10px}.pe-pixel .model-card-actions{display:flex;flex-wrap:wrap;gap:8px}.pe-pixel .model-card-actions .btn{font-size:13px;padding:8px 10px}.pe-pixel .pe-model-index{columns:3;column-gap:25px}.pe-pixel .pe-model-index li{break-inside:avoid;font-size:14px}.pe-pixel .pe-faq{max-width:900px;margin-top:30px}
@media(max-width:850px){.pe-pixel .model-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.pe-pixel .studio-workspace{grid-template-columns:minmax(0,1fr)}.pe-pixel .studio-sidebar{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.pe-pixel .studio-swatch{min-height:40px;height:40px}.pe-pixel .studio-palette{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:550px){.pe-pixel{padding:18px 12px 32px}.pe-pixel .pe-intro{padding:18px}.pe-pixel .pixel-studio{padding:12px}.pe-pixel .studio-toolbar,.pe-pixel .studio-sidebar,.pe-pixel .pe-columns{grid-template-columns:minmax(0,1fr)}.pe-pixel .studio-palette{grid-template-columns:repeat(8,minmax(0,1fr))}.pe-pixel .studio-swatch{min-height:36px;height:36px}.pe-pixel .model-grid,.pe-pixel .model-filter-bar{grid-template-columns:repeat(2,minmax(0,1fr))}.pe-pixel .model-card{padding:10px}.pe-pixel .model-card-actions .btn{width:100%}.pe-pixel .pe-model-index{columns:1}.pe-pixel .studio-actions>button{flex:1 1 140px}.pe-pixel h2{font-size:1.4rem}.pe-pixel .model-filter-bar{padding:12px}}
