*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:system-ui,sans-serif;background:#f5f5f5;color:#111}@media (max-width: 480px){body{font-size:15px}}.login-wrap{max-width:320px;margin:10vh auto;padding:2rem;background:#fff;border-radius:8px;box-shadow:0 2px 8px #0002}.login-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.5rem}.login-header h2{margin:0}.login-wrap input,.login-wrap button{display:block;width:100%;padding:.6rem .8rem;margin-bottom:.75rem;border:1px solid #ccc;border-radius:4px;font-size:1rem}.login-wrap button{background:#2563eb;color:#fff;border:none;cursor:pointer}.login-wrap button:hover{background:#1d4ed8}.error{color:#dc2626;margin-bottom:.5rem;font-size:.875rem}.lang-switcher{display:flex;align-items:center;gap:.25rem;font-size:.8rem}.lang-switcher button{background:none;border:none;cursor:pointer;padding:.2rem .3rem;color:#6b7280;font-size:.8rem;border-radius:3px}.lang-switcher button.active{color:#2563eb;font-weight:600}.lang-switcher button:hover{color:#111}.lang-switcher span{color:#d1d5db}header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.5rem;padding:.75rem 1rem;background:#fff;border-bottom:1px solid #e5e7eb}header h1{font-size:1.15rem}header button{padding:.4rem .7rem;cursor:pointer;font-size:.85rem}.header-actions{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}main{padding:1rem}@media (min-width: 600px){main{padding:1.5rem}}.icon-gallery{display:flex;flex-wrap:nowrap;overflow-x:auto;gap:.5rem;margin:.75rem 0;padding-bottom:4px}.icon-btn{border:2px solid #e5e7eb;border-radius:6px;padding:4px;background:#fff;cursor:pointer}.icon-btn.selected{border-color:#2563eb;background:#eff6ff}.icon-btn-none{width:56px;height:56px;display:flex;align-items:center;justify-content:center;color:#9ca3af;font-size:1.25rem}.icon-btn-none.selected{color:#2563eb}.create-form{background:#fff;padding:1.5rem;border-radius:8px;box-shadow:0 1px 4px #0001;margin-bottom:1.5rem;max-width:600px}.create-form h2{margin-bottom:1rem;font-size:1.1rem}.create-form input{width:100%;padding:.6rem .8rem;border:1px solid #ccc;border-radius:4px;font-size:1rem;margin-bottom:.5rem}.create-form button{padding:.6rem 1.25rem;background:#2563eb;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:1rem}.create-form button:disabled{background:#93c5fd;cursor:default}.btn-secondary{padding:.5rem 1rem;background:#fff;color:#374151;border:1px solid #d1d5db;border-radius:4px;cursor:pointer;font-size:.9rem}.btn-secondary:hover{background:#f9fafb}.btn-link{background:none;border:none;cursor:pointer;color:#2563eb;font-size:.85rem;padding:0;text-decoration:underline}.form-actions{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-top:.75rem;flex-wrap:wrap}.form-submit-row{display:flex;align-items:center;gap:.5rem}.form-submit-row>button[type=submit]{white-space:nowrap}.qty-input{width:3.5rem;padding:.6rem .5rem;border:1px solid #ccc;border-radius:4px;font-size:1rem;text-align:center}.warn{color:#d97706;font-size:.875rem;margin-bottom:.5rem}.search-bar{margin-bottom:1rem;position:relative}.search-bar input{padding:.5rem .8rem;border:1px solid #ccc;border-radius:4px;font-size:1rem;width:260px;max-width:100%}.search-suggestions{position:absolute;top:100%;left:0;z-index:50;background:#fff;border:1px solid #d1d5db;border-radius:4px;box-shadow:0 4px 12px #0002;list-style:none;min-width:260px;max-width:400px}.search-suggestions li{padding:.5rem .8rem;cursor:pointer;font-size:.95rem}.search-suggestions li:hover{background:#f3f4f6}.table-toolbar{display:flex;align-items:center;gap:1rem;margin-bottom:.75rem;flex-wrap:wrap}.toggle-deleted{font-size:.9rem;cursor:pointer;white-space:nowrap}.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}table{width:100%;border-collapse:collapse;background:#fff;border-radius:8px;overflow:hidden;min-width:500px}th,td{padding:.55rem .75rem;text-align:left;border-bottom:1px solid #e5e7eb;font-size:.875rem}th{background:#f9fafb;font-weight:600}.deleted-row td{color:#9ca3af}.deleted-row td:nth-child(3){text-decoration:line-through}.status-active{color:#16a34a}.status-deleted{color:#6b7280;font-size:.8rem}td button{padding:.3rem .5rem;border:1px solid #d1d5db;background:#fff;border-radius:4px;cursor:pointer;font-size:.8rem;white-space:nowrap}td button:hover{background:#f3f4f6}td button.btn-danger{color:#dc2626;border-color:#fca5a5}td button.btn-danger:hover{background:#fef2f2}td button:disabled{opacity:.5;cursor:default}@media (max-width: 600px){.col-icon,.col-date,.col-status{display:none}}.pagination{display:flex;align-items:center;gap:.4rem;flex-wrap:wrap;margin-top:.75rem;font-size:.875rem;color:#374151}.page-size-label{margin-right:.2rem}.page-size-btn{padding:.25rem .5rem;border:1px solid #d1d5db;background:#fff;border-radius:4px;cursor:pointer;font-size:.8rem}.page-size-btn.active{background:#2563eb;color:#fff;border-color:#2563eb}.page-size-btn:hover:not(.active){background:#f3f4f6}.page-spacer{flex:1}.page-nav{padding:.25rem .6rem;border:1px solid #d1d5db;background:#fff;border-radius:4px;cursor:pointer;font-size:1rem;line-height:1}.page-nav:hover:not(:disabled){background:#f3f4f6}.page-nav:disabled{opacity:.4;cursor:default}.page-info{min-width:4rem;text-align:center;color:#6b7280}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000073;display:flex;align-items:flex-start;justify-content:center;z-index:100;padding:1rem;overflow-y:auto}@media (min-height: 600px){.modal-backdrop{align-items:center}}.modal{background:#fff;border-radius:8px;padding:1rem;max-width:640px;width:100%;max-height:calc(100vh - 2rem);overflow-y:auto;position:relative;flex-shrink:0}@media (min-width: 600px){.modal{padding:1.5rem}}.modal-close{position:absolute;top:.75rem;right:.75rem;background:none;border:none;cursor:pointer;font-size:1.25rem;color:#6b7280;line-height:1;padding:.1rem .4rem}.modal-close:hover{color:#111}.modal h2{margin-bottom:1rem;font-size:1.1rem;padding-right:2rem}.btn-primary{padding:.6rem 1.25rem;background:#2563eb;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:1rem}.btn-primary:disabled{background:#93c5fd;cursor:default}.import-panel{background:#fff;padding:1.5rem;border-radius:8px;box-shadow:0 1px 4px #0001;margin-bottom:1.5rem;max-width:600px}.import-panel h2{margin-bottom:1rem;font-size:1.1rem}.import-file-row{display:flex;align-items:center;gap:.75rem;margin-bottom:1rem;flex-wrap:wrap}.import-filename{font-size:.875rem;color:#6b7280}.import-icon-section{margin-bottom:.75rem}.import-label{font-size:.875rem;color:#374151;margin-bottom:.4rem}.import-toolbar{display:flex;gap:1rem;margin-bottom:.5rem}.import-name-list{max-height:220px;overflow-y:auto;border:1px solid #e5e7eb;border-radius:4px;padding:.5rem;margin-bottom:.75rem}.import-name-item{display:flex;align-items:center;gap:.5rem;padding:.3rem .25rem;cursor:pointer;font-size:.9rem;-webkit-user-select:none;user-select:none}.import-name-item:hover{background:#f9fafb;border-radius:3px}.import-panel button[type=button]:not(.btn-secondary):not(.btn-link){padding:.6rem 1.25rem;background:#2563eb;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:1rem}.import-panel button[type=button]:not(.btn-secondary):not(.btn-link):disabled{background:#93c5fd;cursor:default}.import-success{color:#16a34a;font-size:.875rem;margin-top:.5rem}.import-hint{font-size:.8rem;color:#6b7280;margin-bottom:.4rem}.import-dup{color:#d97706}