@import "https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700&display=swap";:root{--bg:#eef1f4;--ink:#1f2227;--muted:#5d6470;--panel:#fff;--line:#d3d8e1;--btn-bg:#1766a5;--font-main:"Noto Sans JP", sans-serif;--mono-font:"Noto Sans JP", sans-serif}*{box-sizing:border-box}body{min-height:100vh;color:var(--ink);font-family:var(--font-main);background:var(--bg);margin:0}#root{min-height:100vh}h1,h2,p{margin-top:0}.app{border:1px solid var(--line);background:var(--panel);border-radius:20px;width:min(1200px,100% - 2rem);margin:1rem auto 2rem;padding:1.25rem;box-shadow:0 24px 50px #14161a24}.top{margin-bottom:1rem}.eyebrow{font-family:var(--mono-font);color:var(--muted);letter-spacing:.08em;text-transform:uppercase;margin:0;font-size:.78rem}.desc{white-space:nowrap;max-width:none;color:var(--muted);margin-top:.4rem}.integrated-section{margin-top:1.4rem}h1{margin:.25rem 0 0;line-height:1}h2{margin-bottom:.6rem}.controls{grid-template-columns:repeat(4,minmax(0,1fr));gap:.7rem;margin-bottom:.8rem;display:grid}.file-picker{background:var(--btn-bg);color:#fff;text-align:center;cursor:pointer;border:1px solid #0000;border-radius:12px;justify-content:center;align-items:center;padding:.65rem .8rem;font-size:.9rem;font-weight:700;transition:transform .14s,box-shadow .2s,opacity .2s;display:inline-flex}.file-picker input{display:none}button,.download{background:var(--btn-bg);color:#fff;cursor:pointer;text-align:center;border:1px solid #0000;border-radius:12px;padding:.65rem .8rem;font-size:.9rem;font-weight:700;text-decoration:none;transition:transform .14s,box-shadow .2s,opacity .2s}button:hover,.download:hover,.file-picker:hover{transform:translateY(-1px);box-shadow:0 10px 20px #0000002e}button:disabled{cursor:not-allowed;opacity:.45;box-shadow:none;transform:none}button.integrate,.download{background:#b35100}.status-row{color:var(--muted);flex-wrap:wrap;gap:1rem;margin-bottom:.75rem;font-size:.9rem;display:flex}.notice{border-radius:10px;margin:.4rem 0;padding:.65rem .75rem;font-size:.9rem}.warning{background:#ffb40024;border:1px solid #ffb40054}.error{background:#f4433624;border:1px solid #f4433666}.grid{grid-template-columns:repeat(auto-fill,100px);justify-content:start;gap:.55rem;display:grid}.tile{-webkit-user-select:none;user-select:none;border:1px solid var(--line);background:#fff;border-radius:10px;width:100px;position:relative;overflow:hidden}.tile.dragging{opacity:.66}.tile-image-wrap{aspect-ratio:1;background:#121418;place-items:center;width:100%;display:grid}.tile-image{object-fit:cover;width:100%;height:100%}.tile-b .tile-image{object-fit:contain}.remove-tile{z-index:2;color:#fff;width:18px;height:18px;box-shadow:none;background:#14161acc;border:none;border-radius:999px;padding:0;font-size:12px;line-height:1;position:absolute;top:4px;right:4px}.remove-tile:hover{box-shadow:none;background:#14161af2;transform:none}.output-wrap{gap:.7rem;display:grid}.output-list{gap:1rem;display:grid}.output-list-2{grid-template-columns:repeat(2,minmax(0,1fr))}.output-list-3{grid-template-columns:repeat(3,minmax(0,1fr))}.output-half{max-width:460px}.output-label{color:var(--muted);margin:0;font-size:.9rem}.output-image-frame{position:relative}.output-download{z-index:1;padding:.4rem .55rem;font-size:.78rem;position:absolute;top:8px;right:8px}.output-image{border:1px dashed var(--line);background:#f0f2f5;border-radius:12px;width:100%}.output-half .output-image,.output-ot .output-image{object-fit:contain;max-height:260px}.empty{color:var(--muted);margin-top:0}@media (width<=960px){.controls{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=640px){.app{width:calc(100% - 1rem);padding:.8rem}.controls,.output-list{grid-template-columns:1fr}.output-ot{grid-column:auto}}