.photo-fields{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px;padding:10px 0}
.photo-fields .photo-wide{grid-column:1/-1}.photo-fields label{display:grid;gap:5px;font-size:.8rem;min-width:0}.photo-fields select{width:100%;min-width:0}
.photo-fields .photo-check{display:flex;align-items:center;gap:8px;min-height:40px}.photo-fields .photo-check input{width:18px;height:18px;flex:none}
.photo-fields button{min-height:40px;font-size:.8rem}.photo-fields .photo-note{font-size:.78rem;line-height:1.5;color:var(--muted,#a5ada9);margin:0}
.photo-fields .photo-preview{display:flex;align-items:center;justify-content:center;gap:14px;background:var(--panel,#19231f);border:1px solid var(--line,#34433e);padding:6px;border-radius:6px}
.photo-fields .photo-preview[hidden]{display:none}.photo-fields .photo-preview canvas{width:144px!important;height:96px!important;max-width:none;image-rendering:pixelated;pointer-events:none}
.kw .kw-stage[data-photo=true],.atelier .stage[data-photo=true]{overflow:hidden;align-items:center;justify-content:center}
.photo-editor,.photo-creature-picker{box-sizing:border-box;color-scheme:dark;background:#16201e;color:#e4ece8;border:1px solid #53655e;border-radius:9px;padding:12px;box-shadow:0 16px 64px #0009;font-family:inherit;max-height:calc(100dvh - 20px)}
.photo-editor::backdrop,.photo-creature-picker::backdrop{background:#000b}.photo-editor:not([open]),.photo-creature-picker:not([open]){display:none}
.photo-editor[open]{display:grid;grid-template-rows:auto auto minmax(96px,1fr) auto auto auto;gap:8px;width:min(1280px,calc(100vw - 24px));height:min(900px,calc(100dvh - 24px));overflow:hidden}
.photo-editor-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.photo-editor-heading h2{font-size:1rem;margin:0}.photo-editor-heading button{min-width:54px}
.photo-editor button,.photo-creature-picker button{min-height:38px;padding:7px 10px;font:inherit;font-size:.8rem;border:1px solid #475c52;border-radius:5px;background:#24362e;color:#e4ece8;cursor:pointer}
.photo-editor button[aria-pressed=true]{background:#394c3a;border-color:#c6a76a;color:#ffebbe}.photo-editor button:disabled,.photo-creature-picker button:disabled{opacity:.45;cursor:default}
.photo-editor :focus-visible,.photo-creature-picker :focus-visible{outline:2px solid #e0bb77;outline-offset:2px}
.photo-toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:6px}.photo-toolbar output{font-size:.75rem;min-width:38px;text-align:center}.photo-toolbar [data-place-minus],.photo-toolbar [data-place-plus]{min-width:40px;min-height:40px;padding:4px;font-size:1.1rem}
.photo-editor-stage{min-height:0;min-width:0;display:flex;align-items:center;justify-content:center;overflow:hidden;border:1px solid #3b5046;border-radius:5px;background:repeating-conic-gradient(#15201b 0% 25%,#1b2821 0% 50%) 0 0/16px 16px}
.photo-editor-stage canvas{display:block;flex:none;image-rendering:pixelated;touch-action:none;max-width:none}
.photo-selection{display:grid;grid-template-columns:minmax(0,1fr) 82px 120px;gap:8px}.photo-selection label,.photo-creature-picker label{display:grid;gap:4px;min-width:0;font-size:.75rem}
.photo-selection select,.photo-creature-picker input{width:100%;min-width:0;min-height:38px;font-size:.8rem}
.photo-editor-note{font-size:.75rem;line-height:1.4;color:#afc1b6;margin:0}
.photo-creature-picker[open]{display:grid;gap:10px;width:min(650px,calc(100vw - 24px));overflow:auto}
.photo-creature-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;min-height:90px}.photo-creature-grid button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;padding:4px;min-width:0}
.photo-creature-thumb{display:block;width:64px;height:64px;flex:none;background-repeat:no-repeat;image-rendering:pixelated}
.photo-creature-pages{justify-content:space-between;font-size:.8rem}.photo-creature-pages span{min-width:65px;text-align:center}
@media(max-width:600px){
 .photo-editor[open]{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;margin:0;border:0;border-radius:0;padding:8px;gap:6px}
 .photo-editor-heading h2{font-size:.95rem}.photo-editor button,.photo-creature-picker button{min-height:40px;font-size:.74rem;padding:5px 7px}
 .photo-selection{grid-template-columns:minmax(0,1fr) 62px 86px;gap:6px}.photo-selection select{font-size:.74rem;min-height:40px;padding-left:7px}
 .photo-toolbar{gap:5px}.photo-toolbar output{min-width:32px}
 .photo-creature-picker[open]{width:100vw;max-width:100vw;max-height:100dvh;margin:0;border:0;border-radius:0;padding:8px;gap:8px}
 .photo-creature-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.photo-creature-grid button{padding:3px;min-height:84px}
}
@media(max-height:640px){.photo-editor-note{display:none}.photo-editor[open]{grid-template-rows:auto auto minmax(96px,1fr) auto auto}}
@media(forced-colors:active){.photo-editor,.photo-creature-picker{border:1px solid CanvasText}.photo-editor button[aria-pressed=true]{outline:2px solid Highlight}}
