:root{--primary-color: #1a237e;--primary-light: #534bae;--accent-color: #2979ff;--success-color: #2e7d32;--text-main: #37474f;--text-sub: #78909c;--bg-body: #f4f6f8;--bg-card: #ffffff;--border-color: #cfd8dc;--header-height: 48px;--shadow-card: 0 2px 8px rgba(0, 0, 0, .05)}body{margin:0;padding:0;font-family:Noto Sans JP,Hiragino Kaku Gothic ProN,Meiryo,Roboto,Helvetica Neue,Arial,sans-serif;-webkit-font-smoothing:antialiased;background-color:var(--bg-body);color:var(--text-main);overflow:hidden}.app-container{display:flex;flex-direction:column;height:100vh;width:100vw}.app-header{height:var(--header-height);background-color:var(--primary-color);color:#fff;display:flex;align-items:center;padding:0 16px;box-shadow:0 2px 4px #0003;z-index:100;flex-shrink:0}.header-logo{font-size:1.1rem;font-weight:700;letter-spacing:.5px}.app-body{flex:1;overflow:hidden;position:relative;background-color:var(--bg-body)}.app-footer{background-color:var(--bg-body);color:var(--text-sub);padding:8px 16px;font-size:11px;text-align:center;border-top:1px solid #e0e0e0;flex-shrink:0}.app-footer a{color:var(--text-sub);text-decoration:none;margin:0 6px}.viewer-container{display:flex;flex-direction:column;height:100%;padding:16px;box-sizing:border-box;gap:16px}.control-bar{display:flex;align-items:center;gap:20px;padding:12px 20px;flex-shrink:0;border-left:4px solid var(--accent-color)}.control-group{display:flex;flex-direction:column;gap:4px;min-width:200px}.control-group label{font-size:10px;font-weight:700;color:var(--text-sub);text-transform:uppercase}.control-actions{margin-left:auto}.styled-select{padding:8px;border:1px solid var(--border-color);border-radius:4px;font-size:13px;color:var(--text-main);background-color:#fff}.styled-select:focus{border-color:var(--accent-color);outline:none}.content-split{display:flex;flex:1;min-height:0;gap:16px}.card{background-color:var(--bg-card);border-radius:6px;box-shadow:var(--shadow-card);border:1px solid var(--border-color);overflow:hidden}.table-area{flex:7;display:flex;flex-direction:column;min-width:0}.card-header{padding:10px 16px;background-color:#fafafa;border-bottom:1px solid var(--border-color);font-weight:700;color:var(--primary-color);font-size:13px;display:flex;align-items:center}.table-wrapper{flex:1;overflow:auto;position:relative}.full-spec-table{width:100%;border-collapse:separate;border-spacing:0;font-size:12px}.full-spec-table th{position:sticky;top:0;background-color:#f0f2f5;color:var(--text-main);font-weight:700;padding:10px 12px;text-align:left;border-bottom:2px solid var(--border-color);text-transform:uppercase;font-size:11px;white-space:nowrap;z-index:10}.full-spec-table td{padding:8px 12px;border-bottom:1px solid #eee;color:var(--text-main);white-space:nowrap;cursor:pointer}.full-spec-table tr:hover td{background-color:#e3f2fd}.full-spec-table tr.selected-row td{background-color:var(--primary-color);color:#fff!important}.th-fixed{left:0;z-index:11!important;border-right:1px solid var(--border-color)}.td-fixed{position:sticky;left:0;background-color:inherit;border-right:1px solid var(--border-color);z-index:5}.visualizer-area{flex:3;display:flex;flex-direction:column;background-color:#f9f9f9}.placeholder-content{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--text-sub);padding:20px;text-align:center;border:2px dashed #e0e0e0;margin:16px;border-radius:8px}.placeholder-icon{font-size:40px;margin-bottom:10px;opacity:.3}.sub-text{font-size:11px;max-width:200px;margin-top:5px}.selected-info{margin-top:30px;padding:10px;background:#eee;border-radius:4px;font-size:11px;width:100%;word-break:break-all}.btn-success{background-color:var(--success-color);color:#fff;border:none;padding:8px 16px;border-radius:4px;cursor:pointer;font-weight:600;font-size:12px;display:flex;align-items:center;gap:6px;transition:.2s}.btn-success:hover{background-color:#1b5e20}.font-bold{font-weight:700}.font-mono{font-family:Roboto Mono,monospace}.cell-dash{color:#ccc}.text-sub{color:var(--text-sub)}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#0009;z-index:200;display:flex;justify-content:center;align-items:center}.modal-content{background:#fff;border-radius:8px;max-width:600px;padding:24px;position:relative;max-height:80vh;overflow-y:auto}.modal-close-btn{position:absolute;top:12px;right:12px;font-size:20px;background:none;border:none;color:var(--text-sub);cursor:pointer}.modal-header{font-size:1.2rem;font-weight:700;color:var(--primary-color);border-bottom:1px solid #eee;padding-bottom:10px;margin-bottom:15px}