@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap";*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:15px;line-height:1.6;color:#3d3d3d;background:#fefdfb;-webkit-font-smoothing:antialiased}a{color:#5c6ac4;text-decoration:none;transition:color .2s}a:hover{color:#3d4db7}h1{font-size:32px;font-weight:700;margin-bottom:8px;color:#000;letter-spacing:-.5px}h2{font-size:24px;font-weight:600;margin-bottom:16px;color:#000;letter-spacing:-.3px}h3{font-size:18px;font-weight:600;margin-bottom:12px;color:#3d3d3d}button{font-family:inherit;font-size:15px;font-weight:500;border:none;cursor:pointer;transition:all .2s ease}.btn-primary{background:#ff6b6b;color:#fff;padding:14px 32px;border-radius:24px;box-shadow:0 2px 8px #ff6b6b33}.btn-primary:hover:not(:disabled){background:#ff5252;box-shadow:0 4px 12px #ff6b6b4d;transform:translateY(-1px)}.btn-primary:disabled{opacity:.5;cursor:not-allowed;transform:none}.btn-secondary{background:#f5f5f5;color:#3d3d3d;padding:10px 20px;border-radius:20px;border:1px solid #e8e8e8}.btn-secondary:hover{background:#ebebeb;border-color:#d8d8d8}.btn-link{color:#5c6ac4;padding:0;text-decoration:underline}.btn-link:hover{color:#3d4db7}input,textarea,select{-webkit-appearance:none;appearance:none;font-family:inherit;font-size:15px;padding:12px 16px;border:1.5px solid #e8e8e8;border-radius:12px;width:100%;background:#fff;transition:border-color .2s;box-sizing:border-box}input:focus,textarea:focus,select:focus{outline:none;border-color:#ff6b6b}input[type=file]{padding:10px}input[type=checkbox],input[type=radio]{width:auto;padding:0;border:none;border-radius:0;-webkit-appearance:auto;appearance:auto}label{display:block;margin-bottom:8px;font-weight:500;color:#3d3d3d}.container{max-width:700px;margin:0 auto;padding:40px 24px}.section{margin-bottom:32px;padding-bottom:32px;border-bottom:1px solid #f0f0f0}.section:last-child{border-bottom:none}.code-box{background:#f9f9f9;border:1px solid #ebebeb;border-radius:12px;padding:16px;font-family:SF Mono,Monaco,Courier New,monospace;font-size:13px;white-space:pre-wrap;overflow-x:auto;margin:12px 0;color:#3d3d3d}.card{border:1px solid #f0f0f0;border-radius:16px;padding:20px;margin-bottom:16px;background:#fff}table{width:100%;border-collapse:collapse;margin:16px 0}th,td{text-align:left;padding:12px 8px;border-bottom:1px solid #f0f0f0}th{font-weight:600;background:#fafafa;color:#3d3d3d;font-size:13px;text-transform:uppercase;letter-spacing:.5px}td{font-size:14px}.text-center{text-align:center}.text-small{font-size:13px}.text-gray{color:#999}.mb-1{margin-bottom:8px}.mb-2{margin-bottom:16px}.mb-3{margin-bottom:24px}.mt-1{margin-top:8px}.mt-2{margin-top:16px}.mt-3{margin-top:24px}.loading{text-align:center;padding:60px 20px}.progress-bar{width:100%;height:3px;background:#f5f5f5;margin:24px 0;border-radius:2px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,#ff6b6b,#ff8787);animation:progress 2s ease-in-out;border-radius:2px}@keyframes progress{0%{width:0%}to{width:100%}}.error{background:#fff5f5;border:1px solid #ffebee;border-radius:12px;color:#d32f2f;padding:16px;margin:16px 0}.success{background:#f1f8f4;border:1px solid #c8e6c9;border-radius:12px;color:#2e7d32;padding:16px;margin:16px 0}header{border-bottom:1px solid #f0f0f0;padding:20px 24px;background:#fff}header a{text-decoration:none;color:#000;font-weight:600;font-size:16px;letter-spacing:-.3px}header nav{margin-top:0}header nav a,header nav span{margin-right:20px;font-size:14px;color:#999}footer{border-top:1px solid #f5f5f5;padding:32px 24px;margin-top:60px;text-align:center;font-size:13px;color:#999}footer a{margin:0 12px;color:#999}footer a:hover{color:#3d3d3d}.thumbnail-grid{display:flex;gap:12px;flex-wrap:wrap;margin:16px 0}.thumbnail{width:100px;height:100px;object-fit:cover;border-radius:12px;border:1px solid #f0f0f0}.copy-btn{font-size:12px;font-weight:500;padding:6px 12px;margin-left:12px;border:1.5px solid #e8e8e8;border-radius:16px;background:#fff;color:#5c6ac4;transition:all .2s}.copy-btn:hover{background:#f9f9fb;border-color:#5c6ac4}.copy-btn.copied{background:#e8f5e9;border-color:#81c784;color:#2e7d32}@media(max-width:768px){body{font-size:16px}.container{padding:24px 16px}h1{font-size:28px}input,button,select{min-height:48px}.btn-primary{padding:16px 32px}}.group-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px;margin:24px 0}.group-card{border:2px solid #e5e7eb;border-radius:16px;padding:16px;background:#fff;transition:border-color .15s,background .15s;min-height:140px}.group-card.drag-over{border-color:#5c6ac4;background:#eff6ff}.group-card-label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:#999;margin-bottom:10px}.group-thumbnails{display:flex;flex-wrap:wrap;gap:6px;min-height:72px}.group-thumb-wrap{position:relative;width:64px;height:64px;flex-shrink:0}.group-thumb{width:64px;height:64px;object-fit:cover;border-radius:8px;border:1px solid #e5e7eb;cursor:grab;transition:opacity .15s,transform .15s;display:block}.group-thumb:active{cursor:grabbing}.group-thumb.is-dragging{opacity:.35}.group-thumb.is-selected{outline:3px solid #5c6ac4;outline-offset:2px;transform:scale(1.05)}.group-card.tap-target{border-color:#5c6ac4;background:#f8f9ff;cursor:pointer}.new-group-zone.tap-target{border-color:#5c6ac4;background:#f8f9ff;color:#5c6ac4;cursor:pointer}.new-group-zone{border:2px dashed #d1d5db;border-radius:16px;padding:20px 16px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;color:#9ca3af;font-size:13px;cursor:default;transition:border-color .15s,background .15s,color .15s;min-height:100px;text-align:center}.new-group-zone.drag-over{border-color:#5c6ac4;background:#eff6ff;color:#5c6ac4}.analysis-status-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px;margin:24px 0}.analysis-status-card{border:2px solid #e5e7eb;border-radius:12px;padding:12px;text-align:center;background:#fff;transition:border-color .2s,background .2s}.analysis-status-card.pending{border-color:#e5e7eb}.analysis-status-card.analyzing{border-color:#f59e0b;background:#fffbeb}.analysis-status-card.done{border-color:#22c55e;background:#f0fdf4}.analysis-status-card.error{border-color:#ef4444;background:#fef2f2}.analysis-status-thumb{width:56px;height:56px;object-fit:cover;border-radius:8px;margin:0 auto 8px;display:block}.analysis-status-label{font-size:12px;font-weight:600;color:#374151}.analysis-status-sub{font-size:11px;color:#9ca3af;margin-top:2px}@keyframes spin{to{transform:rotate(360deg)}}.spinner{width:16px;height:16px;border:2px solid #e5e7eb;border-top-color:#f59e0b;border-radius:50%;animation:spin .7s linear infinite;margin:4px auto 0}.photo-remove-btn{position:absolute;top:-6px;right:-6px;width:22px;height:22px;min-height:22px;padding:0;display:flex;align-items:center;justify-content:center;background:#3d3d3d;color:#fff;border:2px solid #fff;border-radius:50%;font-size:10px;line-height:1;cursor:pointer;box-shadow:0 1px 3px #0003;transition:background .15s,transform .15s}.photo-remove-btn:hover{background:#ef4444;transform:scale(1.1)}:focus-visible{outline:2px solid #ff6b6b;outline-offset:2px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}
