.page-main *,.page-main *::before,.page-main *::after{box-sizing:border-box;}
.hidden{display:none;}
#tool-info{padding:48px 0;text-align:center;}
#tool-info .name{font-size:36px;line-height:40px;font-weight:700;color:#111827;}
#tool-info .text{margin-top:12px;font-size:18px;line-height:28px;color:#6b7280;}
#tool-info .badge-local{display:inline-flex;align-items:center;gap:6px;margin-top:14px;padding:6px 16px;border-radius:9999px;border:1px solid #b7e4c7;background:#e6f7ec;color:#0b6e4f;font-size:14px;font-weight:500;}
#tool{padding-bottom:24px;}
#tool .zone{position:relative;overflow:hidden;border-radius:16px;border:2px dashed #cbd5e1;background:#fff;cursor:pointer;transition:border-color .2s,background-color .2s,box-shadow .2s;box-shadow:0 1px 2px 0 rgba(0,0,0,.05);}
#tool .zone:hover,#tool .zone.drag-over{border-color:#16a085;background:#f0fdfa;box-shadow:0 8px 20px rgba(22,160,133,.12);}
#tool .zone #file-zone{position:absolute;top:0;left:0;width:100%;height:100%;z-index:10;cursor:pointer;}
#tool .zone .upload-inner{pointer-events:none;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:48px 24px;text-align:center;}
#tool .zone .upload-icon{width:56px;height:56px;color:#16a085;}
#tool .zone .upload-title{margin-top:16px;font-size:20px;font-weight:600;color:#1f2937;}
#tool .zone .upload-sub{margin-top:8px;font-size:14px;line-height:1.625;color:#6b7280;}
#tool .zone .upload-hint{margin-top:14px;display:inline-block;padding:4px 14px;border-radius:9999px;background:#f1f5f9;color:#94a3b8;font-size:13px;}#files{padding:0 0 24px;}
#files .file-panel{border-radius:16px;background:#fff;box-shadow:0 1px 2px 0 rgba(0,0,0,.05);overflow:hidden;}
#files .panel-header{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;padding:16px 20px;border-bottom:1px solid #f1f5f9;}
#files .panel-header .title{display:flex;align-items:center;gap:8px;font-size:16px;font-weight:700;color:#1f2937;}
#files .file-count{display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:24px;padding:0 8px;border-radius:9999px;background:#e2e8f0;color:#475569;font-size:13px;font-weight:600;}
#files .actions{display:flex;gap:10px;flex-wrap:wrap;}
#files .actions .btn{display:inline-flex;align-items:center;justify-content:center;width:auto;height:auto;line-height:1.5;letter-spacing:0;border:none;border-radius:8px;padding:10px 20px;font-size:14px;font-weight:500;cursor:pointer;transition:background-color .15s,color .15s,border-color .15s;}
#files .actions .btn:disabled{opacity:.5;cursor:not-allowed;}
#files .actions .btn-primary{background:#16a085;color:#fff;}
#files .actions .btn-primary:hover:not(:disabled){background:#1abc9c;}
#files .actions .btn-secondary{background:#fff;border:1px solid #cbd5e1;color:#1f2937;}
#files .actions .btn-secondary:hover:not(:disabled){background:#f8fafc;border-color:#94a3b8;}
#files .actions .btn-danger{background:#fee2e2;color:#b91c1c;}
#files .actions .btn-danger:hover:not(:disabled){background:#fecaca;}
#files .file-table-wrapper{overflow-x:auto;}
#files table{width:100%;border-collapse:collapse;font-size:14px;}
#files th{text-align:left;padding:12px 16px;background:#f8fafc;color:#475569;font-weight:600;font-size:13px;border-bottom:1px solid #e2e8f0;white-space:nowrap;}
#files td{padding:12px 16px;border-bottom:1px solid #f1f5f9;vertical-align:middle;}
#files tr:last-child td{border-bottom:none;}
#files .thumbnail{width:48px;height:48px;object-fit:cover;border-radius:8px;border:1px solid #e2e8f0;background:#f1f5f9;display:block;}
#files .file-name{font-weight:500;max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#374151;}
#files .file-size{color:#64748b;white-space:nowrap;}
#files .badge-status{display:inline-flex;align-items:center;gap:4px;padding:3px 12px;border-radius:9999px;font-size:13px;font-weight:500;white-space:nowrap;}
#files .status-waiting{background:#fef9c3;color:#854d0e;}
#files .status-processing{background:#dbeafe;color:#1e40af;}
#files .status-done{background:#dcfce7;color:#166534;}
#files .status-error{background:#fee2e2;color:#991b1b;}
#files .download-link{color:#16a085;font-weight:500;text-decoration:none;font-size:14px;cursor:pointer;white-space:nowrap;margin-right:12px;}
#files .download-link:hover{color:#1abc9c;text-decoration:underline;}
#files .delete-btn{background:none;border:none;color:#9ca3af;cursor:pointer;font-size:14px;padding:4px 10px;border-radius:8px;white-space:nowrap;}
#files .delete-btn:hover{color:#ef4444;background:#fef2f2;}
#files .empty-state{padding:48px 16px;text-align:center;color:#94a3b8;font-size:14px;}#related{margin-top:24px;}
#related .unit{padding:16px 20px;background:#fff;border-radius:12px;box-shadow:0 1px 3px rgba(0,0,0,.08);}
#related .unit .links{line-height:2;}
#related .unit .links div{font-size:15px;font-weight:600;color:#374151;margin-bottom:4px;}
#related .unit .links a{display:inline-block;margin:0 10px 10px 0;padding:4px 14px;border:1px solid #16a085;border-radius:9999px;color:#16a085;font-size:13px;}
#related .unit .links a:hover{background:#16a085;color:#fff;}
#intro{margin-bottom:64px;margin-top:24px;overflow:hidden;border-radius:16px;background:#fff;box-shadow:0 1px 2px 0 rgba(0,0,0,.05);}
#intro .head{border-bottom:1px solid #f3f4f6;padding:16px 24px;font-size:20px;line-height:28px;font-weight:700;color:#1f2937;}
#intro .main{padding:20px 24px;font-size:16px;line-height:1.625;color:#4b5563;}
#intro .main p{margin:0 0 12px 0;text-indent:2em;}
@media screen and (max-width:1000px){
  #tool .zone,#files .file-panel,#related,#intro{margin-left:10px;margin-right:10px;}
  #files .panel-header{flex-direction:column;align-items:flex-start;}
  #files th,#files td{padding:10px 8px;font-size:12px;}
  #files .thumbnail{width:36px;height:36px;}
  #files .file-name{max-width:140px;}
}
